Component Model

All components, visual and non-visual, share a common base JSON shape. Specific types add required or optional fields on top of this base.

3.1 Base Component Shape

Field	Type	Required	Description
id	string	REQUIRED	Unique identifier. MUST be globally unique across the entire unit — not just within a module.
type	string (enum)	REQUIRED	Component type identifier. MUST be one of the supported types (see §3.2).
context	object	Optional	Component property dictionary. Values can be literals, state refs, context refs, or expressions.
style	object	Optional	Visual and layout styling grouped by style domain (see §7).
children	array	Optional	Nested child components. Leaf components may omit this field.
events	object	Optional	Event handler dictionary: { eventName: [Action, …] } (see §9).

ℹ Note: id is mandatory on every component AND every action. IDs MUST be globally unique across the entire unit.

3.2 Supported Component Types

Category	Types
Content	text, image, video, pdf, media, label, progress, color, map
Input	textfield, texteditor, toggle, picker, slider, datepicker, button
Navigation	navigation, link, tab
Layout	vstack, hstack, zstack, scroll, spacer, divider, list, form, section, grid, gridrow
Shapes	circle, ellipse, capsule, rectangle, roundedrectangle, star, bubble
Non-visual	module, template, dynamic, conditional

ℹ Component type is matched case-insensitively. The canonical form is lowercase (the spellings above); a conforming runtime MUST resolve any casing — datepicker, datePicker, and DATEPICKER all select the same component. Convention: component types are lowercase; style domains (§7) are camelCase.