view-contracts 0.1.0

package/spec/ui-dsl.schema.json

@@ -0,0 +1,738 @@
+{
+  "$schema": "./ui-dsl.meta.json",
+  "tokens": {
+    "role": ["button", "link", "heading", "list", "listitem", "main", "dialog", "status"],
+    "widthSize": ["wrap", "fill"],
+    "heightSize": ["wrap", "fill"],
+    "align": ["start", "center", "end", "stretch"],
+    "justify": ["start", "center", "end", "spaceBetween", "spaceAround", "spaceEvenly"],
+    "contentAlign": ["topStart", "top", "topEnd", "start", "center", "end", "bottomStart", "bottom", "bottomEnd"],
+    "axis": ["vertical", "horizontal"],
+    "direction": ["ltr", "rtl", "system"],
+    "scroll": ["none", "vertical", "horizontal", "both"],
+    "border": ["none"],
+    "shadow": ["none", "sm", "md", "lg"],
+    "textAlign": ["start", "center", "end"],
+    "lineLimit": ["none"],
+    "textOverflow": ["clip", "ellipsis"],
+    "fontWeight": ["regular", "medium", "bold"],
+    "imageFit": ["contain", "cover", "fill", "none"],
+    "keyboardType": ["text", "number", "email", "url", "password", "tel"],
+    "clip": ["none", "bounds", "shape"]
+  },
+  "properties": {
+    "id": {
+      "type": "string",
+      "x-category": "identity",
+      "description": "Stable identifier for tests and diff updates"
+    },
+    "role": {
+      "type": "string",
+      "enum": "role",
+      "x-category": "identity",
+      "description": "Accessibility semantics (not HTML tag names)"
+    },
+    "label": {
+      "type": "string",
+      "x-category": "identity",
+      "description": "Accessible name; required for IconButton"
+    },
+    "visible": {
+      "type": "boolean",
+      "x-category": "state",
+      "description": "Show or omit from render tree"
+    },
+    "enabled": {
+      "type": "boolean",
+      "x-category": "state",
+      "x-appliesTo": ["Button", "IconButton", "TextInput", "TextArea", "Select", "Checkbox", "Radio", "Switch"]
+    },
+    "selected": {
+      "type": "boolean",
+      "x-category": "state",
+      "x-appliesTo": ["ListItem"]
+    },
+    "checked": {
+      "type": "boolean",
+      "x-category": "state",
+      "x-appliesTo": ["Checkbox", "Radio", "Switch"]
+    },
+    "readonly": {
+      "type": "boolean",
+      "x-category": "state",
+      "x-appliesTo": ["TextInput", "TextArea"]
+    },
+    "required": {
+      "type": "boolean",
+      "x-category": "state",
+      "x-appliesTo": ["TextInput", "TextArea", "Select", "Checkbox", "Field"]
+    },
+    "width": {
+      "type": ["string", "number"],
+      "enum": "widthSize",
+      "x-category": "size",
+      "x-notes": "string: wrap|fill; number: fixed px/dp/pt; flex ratio uses weight property"
+    },
+    "height": {
+      "type": ["string", "number"],
+      "enum": "heightSize",
+      "x-category": "size",
+      "x-notes": "string: wrap|fill; number: fixed px/dp/pt; flex ratio uses weight property"
+    },
+    "minWidth": { "type": "number", "x-category": "size" },
+    "maxWidth": { "type": ["string", "number"], "x-category": "size", "x-notes": "number or fill" },
+    "minHeight": { "type": "number", "x-category": "size" },
+    "maxHeight": { "type": ["string", "number"], "x-category": "size", "x-notes": "number or fill" },
+    "aspectRatio": { "type": "number", "x-category": "size", "x-appliesTo": ["Image"] },
+    "weight": {
+      "type": "number",
+      "x-category": "size",
+      "x-notes": "Flex ratio among Row/Column direct children; Spacer is the primary use case"
+    },
+    "padding": { "type": ["string", "number"], "x-category": "spacing", "x-notes": "space token or per-side" },
+    "gap": {
+      "type": ["string", "number"],
+      "x-category": "spacing",
+      "x-appliesTo": ["Row", "Column", "List"]
+    },
+    "align": {
+      "type": "string",
+      "enum": "align",
+      "x-category": "alignment",
+      "x-appliesTo": ["Row", "Column"]
+    },
+    "justify": {
+      "type": "string",
+      "enum": "justify",
+      "x-category": "alignment",
+      "x-appliesTo": ["Row", "Column"]
+    },
+    "selfAlign": { "type": "string", "enum": "align", "x-category": "alignment" },
+    "contentAlign": {
+      "type": "string",
+      "enum": "contentAlign",
+      "x-category": "alignment",
+      "x-appliesTo": ["Box", "Stack"]
+    },
+    "axis": {
+      "type": "string",
+      "enum": "axis",
+      "x-category": "direction",
+      "x-appliesTo": ["ScrollArea", "List", "Divider"]
+    },
+    "direction": {
+      "type": "string",
+      "enum": "direction",
+      "x-category": "direction",
+      "x-appliesTo": ["App", "Page"],
+      "description": "Text/layout direction; set at app or screen root, not per layout container"
+    },
+    "scroll": {
+      "type": "string",
+      "enum": "scroll",
+      "x-category": "overflow",
+      "x-appliesTo": ["ScrollArea"]
+    },
+    "background": { "type": "string", "x-category": "visual", "x-notes": "color token" },
+    "foreground": {
+      "type": "string",
+      "x-category": "visual",
+      "x-appliesTo": ["Text", "Icon", "Button"],
+      "x-notes": "color token"
+    },
+    "border": { "type": ["string", "object"], "enum": "border", "x-category": "visual", "x-notes": "none|token|{width,color}" },
+    "radius": { "type": "string", "x-category": "visual", "x-notes": "radius token" },
+    "shadow": { "type": "string", "enum": "shadow", "x-category": "visual" },
+    "opacity": { "type": "number", "x-category": "visual", "x-notes": "0..1" },
+    "clip": { "type": "string", "enum": "clip", "x-category": "visual" },
+    "textStyle": { "type": "string", "x-category": "text", "x-appliesTo": ["Text", "Heading"], "x-notes": "typography token" },
+    "textAlign": { "type": "string", "enum": "textAlign", "x-category": "text", "x-appliesTo": ["Text", "Heading"] },
+    "lineLimit": { "type": ["string", "number"], "enum": "lineLimit", "x-category": "text", "x-appliesTo": ["Text"] },
+    "textOverflow": { "type": "string", "enum": "textOverflow", "x-category": "text", "x-appliesTo": ["Text"] },
+    "fontWeight": { "type": "string", "enum": "fontWeight", "x-category": "text", "x-appliesTo": ["Text"] },
+    "headingLevel": {
+      "type": "number",
+      "x-category": "text",
+      "x-appliesTo": ["Heading"],
+      "description": "Semantic heading level (1–6) for h1/h2 mapping and accessibility hierarchy"
+    },
+    "fit": { "type": "string", "enum": "imageFit", "x-category": "image", "x-appliesTo": ["Image"] },
+    "src": {
+      "type": "string",
+      "x-category": "image",
+      "x-appliesTo": ["Image"],
+      "description": "Image source URL or asset reference"
+    },
+    "alt": { "type": "string", "x-category": "image", "x-appliesTo": ["Image", "Icon"], "description": "Alternative text; not a source reference" },
+    "name": {
+      "type": "string",
+      "x-category": "image",
+      "x-appliesTo": ["Icon"],
+      "description": "Icon token or asset name in the renderer icon set"
+    },
+    "onClick": {
+      "type": "action",
+      "x-category": "interaction",
+      "x-appliesTo": ["Button", "IconButton", "Link"],
+      "description": "Action id, not arbitrary code"
+    },
+    "onSubmit": {
+      "type": "action",
+      "x-category": "interaction",
+      "x-appliesTo": ["Form"],
+      "description": "Form submit/validation action id"
+    },
+    "onChange": {
+      "type": "action",
+      "x-category": "interaction",
+      "x-appliesTo": ["TextInput", "TextArea", "Select", "Checkbox", "Radio", "Switch"]
+    },
+    "focusable": { "type": "boolean", "x-category": "interaction" },
+    "autoFocus": {
+      "type": "boolean",
+      "x-category": "interaction",
+      "x-appliesTo": ["Modal", "TextInput"]
+    },
+    "keyboardType": {
+      "type": "string",
+      "enum": "keyboardType",
+      "x-category": "interaction",
+      "x-appliesTo": ["TextInput"]
+    },
+    "value": {
+      "type": ["string", "number", "boolean"],
+      "x-category": "data",
+      "x-appliesTo": ["TextInput", "TextArea", "Select", "Radio", "Checkbox", "Switch"]
+    },
+    "binding": {
+      "type": "string",
+      "x-category": "data",
+      "x-appliesTo": ["TextInput", "TextArea", "Select", "Checkbox", "Radio", "Switch"],
+      "description": "ViewModel or form state field identifier"
+    },
+    "placeholder": { "type": "string", "x-category": "data", "x-appliesTo": ["TextInput", "TextArea"] },
+    "options": {
+      "type": "array",
+      "x-category": "data",
+      "x-appliesTo": ["Select"],
+      "x-notes": "array<{value,label}>"
+    },
+    "error": {
+      "type": ["string", "null"],
+      "x-category": "validation",
+      "x-appliesTo": ["Field", "TextInput", "TextArea", "Select"]
+    },
+    "help": {
+      "type": ["string", "null"],
+      "x-category": "validation",
+      "x-appliesTo": ["Field", "TextInput", "TextArea", "Select"]
+    },
+    "variant": { "type": "string", "x-category": "visual", "x-notes": "design token variant" }
+  },
+  "elements": {
+    "App": {
+      "x-tier": "core",
+      "x-category": "structure",
+      "description": "App root; holds theme/token/navigation context",
+      "x-notes": "Optional; not required for single-screen DSL",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "padding": { "$ref": "#/properties/padding" },
+        "direction": { "$ref": "#/properties/direction" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Page"] }
+    },
+    "Page": {
+      "x-tier": "core",
+      "x-category": "structure",
+      "description": "Screen root; viewport and safe-area boundary",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "padding": { "$ref": "#/properties/padding" },
+        "direction": { "$ref": "#/properties/direction" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Column", "Row", "Stack", "Box"] }
+    },
+    "SafeArea": {
+      "x-tier": "core",
+      "x-category": "structure",
+      "description": "Insets for OS/browser safe areas",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "padding": { "$ref": "#/properties/padding" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Box", "Column", "Row"] }
+    },
+    "Box": {
+      "x-tier": "core",
+      "x-category": "layout",
+      "description": "Single region; background, bounds, child placement",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "width": { "$ref": "#/properties/width" },
+        "height": { "$ref": "#/properties/height" },
+        "minWidth": { "$ref": "#/properties/minWidth" },
+        "maxWidth": { "$ref": "#/properties/maxWidth" },
+        "minHeight": { "$ref": "#/properties/minHeight" },
+        "maxHeight": { "$ref": "#/properties/maxHeight" },
+        "padding": { "$ref": "#/properties/padding" },
+        "contentAlign": { "$ref": "#/properties/contentAlign" },
+        "background": { "$ref": "#/properties/background" },
+        "foreground": { "$ref": "#/properties/foreground" },
+        "border": { "$ref": "#/properties/border" },
+        "radius": { "$ref": "#/properties/radius" },
+        "shadow": { "$ref": "#/properties/shadow" },
+        "opacity": { "$ref": "#/properties/opacity" },
+        "clip": { "$ref": "#/properties/clip" },
+        "selfAlign": { "$ref": "#/properties/selfAlign" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "any" }
+    },
+    "Row": {
+      "x-tier": "core",
+      "x-category": "layout",
+      "description": "Horizontal child layout",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "gap": { "$ref": "#/properties/gap" },
+        "align": { "$ref": "#/properties/align" },
+        "justify": { "$ref": "#/properties/justify" },
+        "padding": { "$ref": "#/properties/padding" },
+        "width": { "$ref": "#/properties/width" },
+        "height": { "$ref": "#/properties/height" },
+        "minWidth": { "$ref": "#/properties/minWidth" },
+        "maxWidth": { "$ref": "#/properties/maxWidth" },
+        "minHeight": { "$ref": "#/properties/minHeight" },
+        "maxHeight": { "$ref": "#/properties/maxHeight" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "any" }
+    },
+    "Column": {
+      "x-tier": "core",
+      "x-category": "layout",
+      "description": "Vertical child layout",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "gap": { "$ref": "#/properties/gap" },
+        "align": { "$ref": "#/properties/align" },
+        "justify": { "$ref": "#/properties/justify" },
+        "padding": { "$ref": "#/properties/padding" },
+        "width": { "$ref": "#/properties/width" },
+        "height": { "$ref": "#/properties/height" },
+        "minWidth": { "$ref": "#/properties/minWidth" },
+        "maxWidth": { "$ref": "#/properties/maxWidth" },
+        "minHeight": { "$ref": "#/properties/minHeight" },
+        "maxHeight": { "$ref": "#/properties/maxHeight" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "any" }
+    },
+    "Stack": {
+      "x-tier": "core",
+      "x-category": "layout",
+      "description": "Overlay children by z-order (not absolute positioning)",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "contentAlign": { "$ref": "#/properties/contentAlign" },
+        "padding": { "$ref": "#/properties/padding" },
+        "width": { "$ref": "#/properties/width" },
+        "height": { "$ref": "#/properties/height" },
+        "background": { "$ref": "#/properties/background" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "any" }
+    },
+    "Spacer": {
+      "x-tier": "core",
+      "x-category": "layout",
+      "description": "Occupies remaining flex space",
+      "x-notes": "Direct child of Row/Column only",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "width": { "$ref": "#/properties/width" },
+        "height": { "$ref": "#/properties/height" },
+        "weight": { "$ref": "#/properties/weight" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Divider": {
+      "x-tier": "core",
+      "x-category": "layout",
+      "description": "Horizontal or vertical separator",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "axis": { "$ref": "#/properties/axis" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "ScrollArea": {
+      "x-tier": "core",
+      "x-category": "scroll",
+      "description": "Internal scroll boundary",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "axis": { "$ref": "#/properties/axis" },
+        "scroll": { "$ref": "#/properties/scroll" },
+        "width": { "$ref": "#/properties/width" },
+        "height": { "$ref": "#/properties/height" },
+        "minHeight": { "$ref": "#/properties/minHeight" },
+        "maxHeight": { "$ref": "#/properties/maxHeight" },
+        "padding": { "$ref": "#/properties/padding" }
+      },
+      "_children": { "x-kind": "single" }
+    },
+    "List": {
+      "x-tier": "core",
+      "x-category": "scroll",
+      "description": "Homogeneous list of items",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "gap": { "$ref": "#/properties/gap" },
+        "axis": { "$ref": "#/properties/axis" },
+        "role": { "$ref": "#/properties/role" },
+        "visible": { "$ref": "#/properties/visible" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["ListItem"] }
+    },
+    "ListItem": {
+      "x-tier": "core",
+      "x-category": "scroll",
+      "description": "One row/cell in a list",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "selected": { "$ref": "#/properties/selected" },
+        "padding": { "$ref": "#/properties/padding" },
+        "gap": { "$ref": "#/properties/gap" },
+        "role": { "$ref": "#/properties/role" },
+        "visible": { "$ref": "#/properties/visible" }
+      },
+      "_children": { "x-kind": "any" }
+    },
+    "Text": {
+      "x-tier": "core",
+      "x-category": "text",
+      "description": "Text display",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "textStyle": { "$ref": "#/properties/textStyle" },
+        "textAlign": { "$ref": "#/properties/textAlign" },
+        "lineLimit": { "$ref": "#/properties/lineLimit" },
+        "textOverflow": { "$ref": "#/properties/textOverflow" },
+        "fontWeight": { "$ref": "#/properties/fontWeight" },
+        "foreground": { "$ref": "#/properties/foreground" },
+        "opacity": { "$ref": "#/properties/opacity" },
+        "role": { "$ref": "#/properties/role" }
+      },
+      "_children": { "x-kind": "text" }
+    },
+    "Heading": {
+      "x-tier": "core",
+      "x-category": "text",
+      "description": "Heading text; visual style via textStyle, semantic level via headingLevel",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "headingLevel": { "$ref": "#/properties/headingLevel" },
+        "textStyle": { "$ref": "#/properties/textStyle" },
+        "textAlign": { "$ref": "#/properties/textAlign" },
+        "foreground": { "$ref": "#/properties/foreground" },
+        "role": { "$ref": "#/properties/role" }
+      },
+      "_children": { "x-kind": "text" }
+    },
+    "Link": {
+      "x-tier": "optional",
+      "x-category": "text",
+      "description": "Navigable text or region",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "onClick": { "$ref": "#/properties/onClick" },
+        "label": { "$ref": "#/properties/label" },
+        "foreground": { "$ref": "#/properties/foreground" },
+        "role": { "$ref": "#/properties/role" }
+      },
+      "_children": { "x-kind": "text" }
+    },
+    "Image": {
+      "x-tier": "core",
+      "x-category": "media",
+      "description": "Image display",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "src": { "$ref": "#/properties/src" },
+        "fit": { "$ref": "#/properties/fit" },
+        "alt": { "$ref": "#/properties/alt" },
+        "width": { "$ref": "#/properties/width" },
+        "height": { "$ref": "#/properties/height" },
+        "aspectRatio": { "$ref": "#/properties/aspectRatio" },
+        "radius": { "$ref": "#/properties/radius" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Icon": {
+      "x-tier": "core",
+      "x-category": "media",
+      "description": "Icon display; asset set referenced by name token at renderer",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "name": { "$ref": "#/properties/name" },
+        "alt": { "$ref": "#/properties/alt" },
+        "foreground": { "$ref": "#/properties/foreground" },
+        "opacity": { "$ref": "#/properties/opacity" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Button": {
+      "x-tier": "core",
+      "x-category": "input",
+      "description": "Pressable action; label or children required (label is a11y name when both present)",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "onClick": { "$ref": "#/properties/onClick" },
+        "label": { "$ref": "#/properties/label" },
+        "foreground": { "$ref": "#/properties/foreground" },
+        "background": { "$ref": "#/properties/background" },
+        "variant": { "$ref": "#/properties/variant" },
+        "role": { "$ref": "#/properties/role" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Text", "Icon", "Row"] }
+    },
+    "IconButton": {
+      "x-tier": "optional",
+      "x-category": "input",
+      "description": "Icon-primary button; label required for accessibility",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "onClick": { "$ref": "#/properties/onClick" },
+        "label": { "$ref": "#/properties/label" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Icon"] }
+    },
+    "TextInput": {
+      "x-tier": "core",
+      "x-category": "input",
+      "description": "Single-line text input",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "readonly": { "$ref": "#/properties/readonly" },
+        "required": { "$ref": "#/properties/required" },
+        "value": { "$ref": "#/properties/value" },
+        "binding": { "$ref": "#/properties/binding" },
+        "placeholder": { "$ref": "#/properties/placeholder" },
+        "onChange": { "$ref": "#/properties/onChange" },
+        "error": { "$ref": "#/properties/error" },
+        "help": { "$ref": "#/properties/help" },
+        "keyboardType": { "$ref": "#/properties/keyboardType" },
+        "focusable": { "$ref": "#/properties/focusable" },
+        "autoFocus": { "$ref": "#/properties/autoFocus" },
+        "width": { "$ref": "#/properties/width" },
+        "label": { "$ref": "#/properties/label" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "TextArea": {
+      "x-tier": "core",
+      "x-category": "input",
+      "description": "Multi-line text input",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "readonly": { "$ref": "#/properties/readonly" },
+        "required": { "$ref": "#/properties/required" },
+        "value": { "$ref": "#/properties/value" },
+        "binding": { "$ref": "#/properties/binding" },
+        "placeholder": { "$ref": "#/properties/placeholder" },
+        "onChange": { "$ref": "#/properties/onChange" },
+        "error": { "$ref": "#/properties/error" },
+        "help": { "$ref": "#/properties/help" },
+        "focusable": { "$ref": "#/properties/focusable" },
+        "minHeight": { "$ref": "#/properties/minHeight" },
+        "label": { "$ref": "#/properties/label" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Select": {
+      "x-tier": "core",
+      "x-category": "input",
+      "description": "Single selection",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "required": { "$ref": "#/properties/required" },
+        "value": { "$ref": "#/properties/value" },
+        "binding": { "$ref": "#/properties/binding" },
+        "options": { "$ref": "#/properties/options" },
+        "onChange": { "$ref": "#/properties/onChange" },
+        "error": { "$ref": "#/properties/error" },
+        "help": { "$ref": "#/properties/help" },
+        "width": { "$ref": "#/properties/width" },
+        "label": { "$ref": "#/properties/label" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Checkbox": {
+      "x-tier": "core",
+      "x-category": "input",
+      "description": "Boolean or multi-select toggle",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "checked": { "$ref": "#/properties/checked" },
+        "required": { "$ref": "#/properties/required" },
+        "binding": { "$ref": "#/properties/binding" },
+        "label": { "$ref": "#/properties/label" },
+        "onChange": { "$ref": "#/properties/onChange" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Radio": {
+      "x-tier": "core",
+      "x-category": "input",
+      "description": "Single choice in a group (use Row/Column to group; binding identifies group)",
+      "x-notes": "RadioGroup is expressed via layout Group, not a separate element",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "checked": { "$ref": "#/properties/checked" },
+        "binding": { "$ref": "#/properties/binding" },
+        "label": { "$ref": "#/properties/label" },
+        "value": { "$ref": "#/properties/value" },
+        "onChange": { "$ref": "#/properties/onChange" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Switch": {
+      "x-tier": "core",
+      "x-category": "input",
+      "description": "On/off toggle",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "enabled": { "$ref": "#/properties/enabled" },
+        "checked": { "$ref": "#/properties/checked" },
+        "binding": { "$ref": "#/properties/binding" },
+        "label": { "$ref": "#/properties/label" },
+        "onChange": { "$ref": "#/properties/onChange" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Form": {
+      "x-tier": "core",
+      "x-category": "form",
+      "description": "Input group submit/validation boundary",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "gap": { "$ref": "#/properties/gap" },
+        "onSubmit": { "$ref": "#/properties/onSubmit" }
+      },
+      "_children": { "x-kind": "any" }
+    },
+    "Field": {
+      "x-tier": "core",
+      "x-category": "form",
+      "description": "label/help/error/input unit",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "label": { "$ref": "#/properties/label" },
+        "help": { "$ref": "#/properties/help" },
+        "error": { "$ref": "#/properties/error" },
+        "required": { "$ref": "#/properties/required" },
+        "gap": { "$ref": "#/properties/gap" }
+      },
+      "_children": { "x-kind": "any" }
+    },
+    "Modal": {
+      "x-tier": "core",
+      "x-category": "overlay",
+      "description": "Primary transient dialog",
+      "x-notes": "Direct child of Page or App; role defaults to dialog at renderer",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "role": { "$ref": "#/properties/role" },
+        "autoFocus": { "$ref": "#/properties/autoFocus" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Box", "Column"] }
+    },
+    "Drawer": {
+      "x-tier": "extension",
+      "x-category": "overlay",
+      "description": "Edge panel overlay",
+      "x-notes": "Placement limited to start/end/bottom at renderer",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Box", "Column"] }
+    },
+    "Popover": {
+      "x-tier": "extension",
+      "x-category": "overlay",
+      "description": "Small anchored panel",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" }
+      },
+      "_children": { "x-kind": "list", "x-items": ["Box", "Column"] }
+    },
+    "Tooltip": {
+      "x-tier": "extension",
+      "x-category": "overlay",
+      "description": "Supplementary description",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "label": { "$ref": "#/properties/label" }
+      },
+      "_children": { "x-kind": "text" }
+    },
+    "Progress": {
+      "x-tier": "core",
+      "x-category": "feedback",
+      "description": "Determinate progress",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "value": { "$ref": "#/properties/value" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "none" }
+    },
+    "Spinner": {
+      "x-tier": "core",
+      "x-category": "feedback",
+      "description": "Indeterminate loading",
+      "properties": {
+        "id": { "$ref": "#/properties/id" },
+        "visible": { "$ref": "#/properties/visible" },
+        "variant": { "$ref": "#/properties/variant" }
+      },
+      "_children": { "x-kind": "none" }
+    }
+  }
+}