view-contracts 0.1.0 → 0.3.0

package/{src/renderer → renderers}/react/runtime/actionRuntime.ts

@@ -1,5 +1,5 @@
-import type { ViewAction } from '@view-contracts/core';
-import { dispatchAction } from '@view-contracts/runtime';
+import type { DispatchableAction } from './types.js';
+import { dispatchAction } from './dispatch.js';
 
 const globalHandlers: Record<string, (params?: unknown) => void | Promise<void>> = {};
 
@@ -15,7 +15,7 @@ export function clearPreviewActions(): void {
   }
 }
 
-export async function dispatchPreviewAction(action?: ViewAction): Promise<void> {
+export async function dispatchPreviewAction(action?: DispatchableAction): Promise<void> {
   if (!action) return;
   const handler = globalHandlers[action.name];
   if (handler) {

package/renderers/react/runtime/dispatch.ts

@@ -0,0 +1,21 @@
+import type { DispatchableAction } from './types.js';
+
+type ActionHandler = (action: DispatchableAction) => void | Promise<void>;
+
+let handler: ActionHandler | undefined;
+
+export function registerActionHandler(nextHandler: ActionHandler): void {
+  handler = nextHandler;
+}
+
+export async function dispatchAction(action: DispatchableAction): Promise<void> {
+  if (handler) {
+    await handler(action);
+    return;
+  }
+  if (action.name === 'navigate' && typeof action.params?.to === 'string') {
+    window.location.href = action.params.to;
+    return;
+  }
+  window.dispatchEvent(new CustomEvent('view-contracts:action', { detail: action }));
+}

package/renderers/react/runtime/index.ts

@@ -0,0 +1,5 @@
+/** Preview/toolchain React runtime primitives — not copied to generated/. */
+export * from './types.js';
+export { commonStyle, isHidden, toneClass, mapAlign, mapJustify } from './style.js';
+export { registerPreviewActions, clearPreviewActions, dispatchPreviewAction } from './actionRuntime.js';
+export { registerActionHandler, dispatchAction } from './dispatch.js';

package/renderers/react/runtime/style.ts

@@ -0,0 +1,101 @@
+import type { CSSProperties } from 'react';
+import type { Align, ContentAlign, FontWeight, Justify } from '../../../src/generated/schema/dsl-enums.js';
+import type { CommonProps } from './types.js';
+
+export function mapAlign(value?: Align): string | undefined {
+  if (!value) return undefined;
+  if (value === 'start') return 'flex-start';
+  if (value === 'end') return 'flex-end';
+  return value;
+}
+
+export function mapJustify(value?: Justify | string): string | undefined {
+  if (!value) return undefined;
+  if (value === 'start') return 'flex-start';
+  if (value === 'end') return 'flex-end';
+  if (value === 'between' || value === 'spaceBetween') return 'space-between';
+  if (value === 'around' || value === 'spaceAround') return 'space-around';
+  if (value === 'spaceEvenly') return 'space-evenly';
+  return value;
+}
+
+function len(value: number): string {
+  return `${value}px`;
+}
+
+const CONTENT_ALIGN: Record<ContentAlign, string> = {
+  topStart: 'start start',
+  top: 'center start',
+  topEnd: 'end start',
+  start: 'start center',
+  center: 'center center',
+  end: 'end center',
+  bottomStart: 'start end',
+  bottom: 'center end',
+  bottomEnd: 'end end',
+};
+
+function fontSizeStyle(size: number | string | undefined): string | undefined {
+  if (size === undefined) return undefined;
+  return typeof size === 'number' ? len(size) : size;
+}
+
+export function commonStyle(props: CommonProps): CSSProperties {
+  const style: CSSProperties = {};
+  if (typeof props.width === 'number') style.width = len(props.width);
+  if (typeof props.minWidth === 'number') style.minWidth = len(props.minWidth);
+  if (typeof props.maxWidth === 'number') style.maxWidth = len(props.maxWidth);
+  if (typeof props.height === 'number') style.height = len(props.height);
+  if (typeof props.minHeight === 'number') style.minHeight = len(props.minHeight);
+  if (typeof props.maxHeight === 'number') style.maxHeight = len(props.maxHeight);
+  if (props.aspectRatio !== undefined) style.aspectRatio = String(props.aspectRatio);
+  if (typeof props.weight === 'number') style.flexGrow = props.weight;
+  if (typeof props.padding === 'number') style.padding = len(props.padding);
+  if (typeof (props as { margin?: number }).margin === 'number') style.margin = len((props as { margin: number }).margin);
+  if (typeof props.gap === 'number') style.gap = len(props.gap);
+  if (props.textAlign) style.textAlign = props.textAlign === 'start' ? 'left' : props.textAlign === 'end' ? 'right' : 'center';
+  if (props.contentAlign) style.placeItems = CONTENT_ALIGN[props.contentAlign];
+  if ((props as { overflow?: string }).overflow) style.overflow = (props as { overflow: string }).overflow;
+  if (props.selfAlign) style.alignSelf = props.selfAlign === 'start' ? 'flex-start' : props.selfAlign === 'end' ? 'flex-end' : props.selfAlign;
+  const fontSize = fontSizeStyle(props.size);
+  if (fontSize) style.fontSize = fontSize;
+  const fontWeight = typeof props.weight === 'string' ? props.weight : props.fontWeight;
+  if (fontWeight) style.fontWeight = fontWeight as FontWeight;
+  return style;
+}
+
+export function isHidden(props: CommonProps): boolean {
+  return props.visible === false;
+}
+
+/** Sample/extension helper — tone is not in ui-dsl.schema.json */
+export function toneClass(tone: string | undefined): string {
+  return tone ? `ui-tone-${tone}` : 'ui-tone-default';
+}
+
+function componentToKebab(name: string): string {
+  return name.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+}
+
+const DEFAULT_VARIANT_ALIASES = new Set(['default', 'muted']);
+
+/** Resolve theme variant name from variant or legacy tone prop. */
+export function resolveExtensionVariant(variant?: string, tone?: string): string {
+  const raw = variant ?? tone;
+  if (!raw || DEFAULT_VARIANT_ALIASES.has(raw)) return 'default';
+  return raw;
+}
+
+/** Build vc-* base + --variant modifier for themed extension components. */
+export function extensionClassName(
+  component: string,
+  options?: { variant?: string; tone?: string; extra?: string | false },
+): string {
+  const base = `vc-${componentToKebab(component)}`;
+  const variant = resolveExtensionVariant(options?.variant, options?.tone);
+  const parts = [base, `${base}--${variant}`];
+  if (options?.extra) parts.push(options.extra);
+  return parts.filter(Boolean).join(' ');
+}
+
+export type { ContentAlign };

package/renderers/react/runtime/theme.css

@@ -0,0 +1,83 @@
+:root {
+  --ui-bg: #f6f8fb;
+  --ui-surface: #ffffff;
+  --ui-surface-muted: #f8fafc;
+  --ui-text: #111827;
+  --ui-text-muted: #6b7280;
+  --ui-primary: #2563eb;
+  --ui-primary-weak: #dbeafe;
+  --ui-success: #047857;
+  --ui-success-weak: #d1fae5;
+  --ui-warning: #b45309;
+  --ui-warning-weak: #fef3c7;
+  --ui-danger: #dc2626;
+  --ui-danger-weak: #fee2e2;
+  --ui-border: #e5e7eb;
+  --ui-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
+  --ui-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+}
+
+* { box-sizing: border-box; }
+body { margin: 0; background: var(--ui-bg); color: var(--ui-text); font-family: var(--ui-font); }
+button, input, textarea, select { font: inherit; }
+
+.vc-page { min-height: 100vh; }
+.vc-box { display: block; }
+.vc-column { display: flex; flex-direction: column; }
+.vc-stack { display: flex; flex-direction: column; }
+.vc-row { display: flex; flex-direction: row; }
+.vc-wrap { flex-wrap: wrap; }
+.vc-spacer { min-width: 0; min-height: 0; }
+.vc-divider { border: 0; border-top: 1px solid var(--ui-border); width: 100%; }
+
+.vc-heading { margin: 0; line-height: 1.2; letter-spacing: -0.02em; }
+.vc-heading-1 { font-size: 32px; }
+.vc-heading-2 { font-size: 22px; }
+.vc-heading-3 { font-size: 18px; }
+.vc-heading-4 { font-size: 15px; }
+.vc-text { margin: 0; line-height: 1.6; }
+.vc-link { color: var(--ui-primary); text-decoration: none; }
+.vc-link:hover { text-decoration: underline; }
+
+.ui-tone-default { color: var(--ui-text); }
+.ui-tone-muted { color: var(--ui-text-muted); }
+.ui-tone-primary { color: var(--ui-primary); }
+.ui-tone-success { color: var(--ui-success); }
+.ui-tone-warning { color: var(--ui-warning); }
+.ui-tone-danger { color: var(--ui-danger); }
+
+.vc-button { border: 0; border-radius: 10px; padding: 10px 14px; font-weight: 700; cursor: pointer; }
+
+.vc-form { display: flex; flex-direction: column; }
+.vc-field { display: flex; flex-direction: column; gap: 6px; }
+.vc-field-label { font-size: 13px; font-weight: 700; color: var(--ui-text); }
+.vc-field-help { font-size: 12px; color: var(--ui-text-muted); }
+.vc-field-error { font-size: 12px; color: var(--ui-danger); }
+.vc-text-input, .vc-select, .vc-text-area { width: 100%; border: 1px solid var(--ui-border); border-radius: 10px; background: #fff; color: var(--ui-text); outline: none; }
+.vc-text-input:focus, .vc-select:focus, .vc-text-area:focus { border-color: var(--ui-primary); box-shadow: 0 0 0 3px var(--ui-primary-weak); }
+.vc-field-sm { min-height: 34px; padding: 6px 10px; }
+.vc-field-md, .vc-text-input, .vc-select { min-height: 42px; padding: 9px 12px; }
+.vc-field-lg { min-height: 50px; padding: 12px 14px; }
+.vc-text-area { padding: 10px 12px; resize: vertical; }
+.vc-checkbox { display: inline-flex; align-items: center; gap: 8px; }
+.vc-list { margin: 0; padding-left: 20px; }
+.vc-list-item { margin: 0; padding: 2px 0; }
+
+/* Extension components — structural layout; variant colors from theme.yaml via emitVariantCss */
+.vc-container { width: 100%; max-width: 1180px; margin: 0 auto; }
+.vc-grid { display: grid; }
+.vc-card { border: 1px solid var(--ui-border); }
+.vc-badge { display: inline-flex; align-items: center; justify-content: center; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
+.vc-alert { display: flex; gap: 12px; border: 1px solid var(--ui-border); border-radius: 12px; padding: 14px; }
+.vc-alert--success { border-color: #a7f3d0; }
+.vc-alert--warning { border-color: #fde68a; }
+.vc-alert--danger { border-color: #fecaca; }
+.vc-table-wrap { overflow-x: auto; border: 1px solid var(--ui-border); border-radius: 14px; background: #fff; }
+.vc-table { width: 100%; border-collapse: collapse; }
+.vc-table th { background: var(--ui-surface-muted); color: var(--ui-text-muted); font-size: 12px; text-align: left; padding: 12px 14px; }
+.vc-table td { border-top: 1px solid var(--ui-border); padding: 14px; font-size: 14px; }
+.vc-admin-shell { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
+.vc-admin-sidebar { background: #0f172a; color: #cbd5e1; padding: 24px 18px; }
+.vc-admin-nav-item { padding: 10px 12px; border-radius: 10px; color: #cbd5e1; }
+.vc-admin-nav-item--active { background: rgba(255,255,255,0.1); color: #fff; }
+.vc-admin-content { padding: 32px; }

package/renderers/react/runtime/types.ts

@@ -0,0 +1,63 @@
+import type { ReactNode } from 'react';
+import type { DslProperties } from '../../../src/generated/schema/dsl-properties.js';
+import type { FontWeight, Justify, Shadow, WidthSize } from '../../../src/generated/schema/dsl-enums.js';
+
+export type {
+  Align,
+  Axis,
+  Border,
+  Clip,
+  ContentAlign,
+  Direction,
+  FontWeight,
+  HeightSize,
+  ImageFit,
+  Justify,
+  KeyboardType,
+  LineLimit,
+  TextAlign,
+  TextOverflow,
+  WidthSize,
+} from '../../../src/generated/schema/dsl-enums.js';
+
+export type { DslProperties };
+
+export interface ViewAction {
+  name: string;
+  params?: Record<string, unknown>;
+}
+
+export type DispatchableAction = ViewAction;
+
+/** view-contracts view TSX action binding (schema property: onClick / onChange). */
+export type Action = ViewAction;
+
+/**
+ * Preview + sample extension props layered on the DSL catalog.
+ * Widens a few catalog types so sample views can use pragmatic literals (e.g. radius={16}, justify="between").
+ */
+export interface CommonProps extends Omit<DslProperties, 'justify' | 'radius' | 'shadow' | 'width' | 'weight' | 'fontWeight'> {
+  children?: ReactNode;
+  /** View-layer alias for onClick in interactive components. */
+  action?: ViewAction;
+  justify?: Justify | 'between' | 'around';
+  radius?: string | number;
+  shadow?: Shadow | boolean;
+  width?: WidthSize | number;
+  /** Flex grow (number) or sample font weight alias (string) on Text. */
+  weight?: number | string;
+  fontWeight?: FontWeight | string;
+  /** Sample/preview extension props (not in ui-dsl.schema.json). */
+  tone?: string;
+  size?: number | string;
+  ariaLabel?: string;
+  testId?: string;
+}
+
+export interface Option {
+  label: string;
+  value: string;
+}
+
+/** Preview-only field density (not in ui-dsl.schema.json). */
+export type FieldSize = 'sm' | 'md' | 'lg';

package/renderers/react/templates/components-index.ts.hbs

@@ -0,0 +1,5 @@
+/** Auto-generated component barrel — DO NOT EDIT */
+export * from './extensions.js';
+export type { TableColumn } from './extensions.js';
+export { commonStyle, mapAlign, mapJustify, isHidden, toneClass } from './style.js';
+export type { Action, CommonProps, Option } from './types.js';

package/renderers/react/templates/dispatch.ts.hbs

@@ -0,0 +1,22 @@
+/** Auto-generated runtime dispatcher — DO NOT EDIT */
+import type { DispatchableAction } from './types.js';
+
+type ActionHandler = (action: DispatchableAction) => void | Promise<void>;
+
+let handler: ActionHandler | undefined;
+
+export function registerActionHandler(nextHandler: ActionHandler): void {
+  handler = nextHandler;
+}
+
+export async function dispatchAction(action: DispatchableAction): Promise<void> {
+  if (handler) {
+    await handler(action);
+    return;
+  }
+  if (action.name === 'navigate' && typeof action.params?.to === 'string') {
+    window.location.href = action.params.to;
+    return;
+  }
+  window.dispatchEvent(new CustomEvent('view-contracts:action', { detail: action }));
+}

package/renderers/react/templates/handlers.ts.hbs

@@ -0,0 +1,4 @@
+/** Auto-generated from src/runtime/handlers.ts — DO NOT EDIT */
+import type { DispatchableAction } from './types.js';
+
+{{{handlersBody}}}

package/renderers/react/templates/runtime-types.ts.hbs

@@ -0,0 +1,10 @@
+/** Auto-generated — DO NOT EDIT */
+export interface DispatchableAction {
+  name: string;
+  params?: Record<string, unknown>;
+}
+
+/** Optional theme context from App element — for future runtime theme switching. */
+export interface AppThemeContext {
+  theme?: string;
+}

package/renderers/react/templates/style-helpers.ts.hbs

@@ -0,0 +1,2 @@
+/** Auto-generated style helpers for lowered JSX — DO NOT EDIT */
+export { commonStyle, extensionClassName, mapAlign, mapJustify, resolveExtensionVariant } from './style.js';

package/renderers/react/templates/theme.css.hbs

@@ -0,0 +1,2 @@
+/** Auto-generated theme — DO NOT EDIT */
+{{{themeCss}}}

package/renderers/swiftui/templates/Screen.swift.hbs

@@ -0,0 +1,21 @@
+// {{screenName}} — SwiftUI scaffold (Phase 5)
+// Theme IR: {{themeJsonPath}}
+// Token IR: {{tokensJsonPath}}
+//
+// TODO(Phase B): Load theme.json and emit PrimaryButtonStyle(), vcTextMuted(), etc.
+
+import SwiftUI
+
+struct {{screenName}}View: View {
+    var body: some View {
+        Text("{{screenName}} — SwiftUI scaffold")
+    }
+}
+
+#if DEBUG
+struct {{screenName}}View_Previews: PreviewProvider {
+    static var previews: some View {
+        {{screenName}}View()
+    }
+}
+#endif

package/renderers/swiftui/templates/VcTheme.swift.hbs

@@ -0,0 +1,21 @@
+// VcTheme — SwiftUI theme scaffold (Phase 5)
+// Load Token IR + Theme IR from bundle resources:
+//   {{tokensJsonPath}}
+//   {{themeJsonPath}}
+//
+// TODO(Phase B): Map Theme IR variants to ButtonStyle / ViewModifier implementations.
+
+import Foundation
+
+enum VcTheme {
+    static let tokensResource = "{{tokensJsonPath}}"
+    static let themeResource = "{{themeJsonPath}}"
+
+    /// Placeholder — decode theme.json into Swift types in Phase B.
+    static func loadThemeJson() -> Data? {
+        guard let url = Bundle.main.url(forResource: themeResource, withExtension: nil) else {
+            return nil
+        }
+        return try? Data(contentsOf: url)
+    }
+}

package/spec/ui-dsl.schema.json

@@ -227,7 +227,18 @@
       "x-category": "validation",
       "x-appliesTo": ["Field", "TextInput", "TextArea", "Select"]
     },
-    "variant": { "type": "string", "x-category": "visual", "x-notes": "design token variant" }
+    "variant": {
+      "type": "string",
+      "x-category": "visual",
+      "x-appliesTo": ["Button", "IconButton", "Box", "Text", "Heading"],
+      "x-notes": "design token variant"
+    },
+    "theme": {
+      "type": "string",
+      "x-category": "visual",
+      "x-appliesTo": ["App"],
+      "x-notes": "active theme id for runtime theme switching"
+    }
   },
   "elements": {
     "App": {
@@ -238,7 +249,8 @@
       "properties": {
         "id": { "$ref": "#/properties/id" },
         "padding": { "$ref": "#/properties/padding" },
-        "direction": { "$ref": "#/properties/direction" }
+        "direction": { "$ref": "#/properties/direction" },
+        "theme": { "$ref": "#/properties/theme" }
       },
       "_children": { "x-kind": "list", "x-items": ["Page"] }
     },
@@ -307,8 +319,7 @@
         "minWidth": { "$ref": "#/properties/minWidth" },
         "maxWidth": { "$ref": "#/properties/maxWidth" },
         "minHeight": { "$ref": "#/properties/minHeight" },
-        "maxHeight": { "$ref": "#/properties/maxHeight" },
-        "variant": { "$ref": "#/properties/variant" }
+        "maxHeight": { "$ref": "#/properties/maxHeight" }
       },
       "_children": { "x-kind": "any" }
     },
@@ -328,8 +339,7 @@
         "minWidth": { "$ref": "#/properties/minWidth" },
         "maxWidth": { "$ref": "#/properties/maxWidth" },
         "minHeight": { "$ref": "#/properties/minHeight" },
-        "maxHeight": { "$ref": "#/properties/maxHeight" },
-        "variant": { "$ref": "#/properties/variant" }
+        "maxHeight": { "$ref": "#/properties/maxHeight" }
       },
       "_children": { "x-kind": "any" }
     },
@@ -344,8 +354,7 @@
         "padding": { "$ref": "#/properties/padding" },
         "width": { "$ref": "#/properties/width" },
         "height": { "$ref": "#/properties/height" },
-        "background": { "$ref": "#/properties/background" },
-        "variant": { "$ref": "#/properties/variant" }
+        "background": { "$ref": "#/properties/background" }
       },
       "_children": { "x-kind": "any" }
     },
@@ -368,8 +377,7 @@
       "description": "Horizontal or vertical separator",
       "properties": {
         "id": { "$ref": "#/properties/id" },
-        "axis": { "$ref": "#/properties/axis" },
-        "variant": { "$ref": "#/properties/variant" }
+        "axis": { "$ref": "#/properties/axis" }
       },
       "_children": { "x-kind": "none" }
     },
@@ -430,7 +438,8 @@
         "fontWeight": { "$ref": "#/properties/fontWeight" },
         "foreground": { "$ref": "#/properties/foreground" },
         "opacity": { "$ref": "#/properties/opacity" },
-        "role": { "$ref": "#/properties/role" }
+        "role": { "$ref": "#/properties/role" },
+        "variant": { "$ref": "#/properties/variant" }
       },
       "_children": { "x-kind": "text" }
     },
@@ -445,7 +454,8 @@
         "textStyle": { "$ref": "#/properties/textStyle" },
         "textAlign": { "$ref": "#/properties/textAlign" },
         "foreground": { "$ref": "#/properties/foreground" },
-        "role": { "$ref": "#/properties/role" }
+        "role": { "$ref": "#/properties/role" },
+        "variant": { "$ref": "#/properties/variant" }
       },
       "_children": { "x-kind": "text" }
     },
@@ -718,8 +728,7 @@
       "properties": {
         "id": { "$ref": "#/properties/id" },
         "visible": { "$ref": "#/properties/visible" },
-        "value": { "$ref": "#/properties/value" },
-        "variant": { "$ref": "#/properties/variant" }
+        "value": { "$ref": "#/properties/value" }
       },
       "_children": { "x-kind": "none" }
     },
@@ -729,8 +738,7 @@
       "description": "Indeterminate loading",
       "properties": {
         "id": { "$ref": "#/properties/id" },
-        "visible": { "$ref": "#/properties/visible" },
-        "variant": { "$ref": "#/properties/variant" }
+        "visible": { "$ref": "#/properties/visible" }
       },
       "_children": { "x-kind": "none" }
     }

package/src/generated/schema/allowed-components.ts

@@ -1,4 +1,4 @@
-/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.1.0 — DO NOT EDIT */
+/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.3.0 — DO NOT EDIT */
 export const ALLOWED_COMPONENTS = new Set([
   'App',
   'Box',

package/src/generated/schema/{tokens.ts → dsl-enums.ts}

@@ -1,4 +1,4 @@
-/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.1.0 — DO NOT EDIT */
+/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.3.0 — DO NOT EDIT */
 export type Role = "button" | "link" | "heading" | "list" | "listitem" | "main" | "dialog" | "status";
 export type WidthSize = "wrap" | "fill";
 export type HeightSize = "wrap" | "fill";

package/src/generated/schema/dsl-properties.ts

@@ -1,6 +1,6 @@
-/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.1.0 — DO NOT EDIT */
+/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.3.0 — DO NOT EDIT */
 export interface ViewAction { name: string; params?: Record<string, unknown> }
-import type { Role, WidthSize, HeightSize, Align, Justify, ContentAlign, Axis, Direction, Scroll, Border, Shadow, TextAlign, LineLimit, TextOverflow, FontWeight, ImageFit, KeyboardType, Clip } from './tokens.js';
+import type { Role, WidthSize, HeightSize, Align, Justify, ContentAlign, Axis, Direction, Scroll, Border, Shadow, TextAlign, LineLimit, TextOverflow, FontWeight, ImageFit, KeyboardType, Clip } from './dsl-enums.js';
 
 /** Shared DSL attributes from $defs.properties / properties catalog */
 export interface DslProperties {
@@ -60,4 +60,5 @@ export interface DslProperties {
   error?: string | null;
   help?: string | null;
   variant?: string;
+  theme?: string;
 }

package/src/generated/schema/index.ts

@@ -1,4 +1,4 @@
-/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.1.0 — DO NOT EDIT */
-export * from './tokens.js';
+/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.3.0 — DO NOT EDIT */
+export * from './dsl-enums.js';
 export * from './dsl-properties.js';
 export * from './schema-document.js';

package/src/generated/schema/lowering-style-properties.ts

@@ -0,0 +1,28 @@
+/** Auto-generated from spec/ui-dsl.schema.json — view-contracts v0.3.0 — DO NOT EDIT */
+/** Property names passed to commonStyle() during React HTML lowering (x-category from DSL + sample extensions). */
+export const LOWERING_STYLE_PROPERTIES = new Set<string>([
+  "align",
+  "aspectRatio",
+  "axis",
+  "contentAlign",
+  "direction",
+  "fontWeight",
+  "gap",
+  "headingLevel",
+  "height",
+  "justify",
+  "lineLimit",
+  "maxHeight",
+  "maxWidth",
+  "minHeight",
+  "minWidth",
+  "padding",
+  "scroll",
+  "selfAlign",
+  "textAlign",
+  "textOverflow",
+  "textStyle",
+  "weight",
+  "width",
+  "size",
+]);

package/src/generated/schema/react-renderer-element-config.ts

@@ -0,0 +1,25 @@
+/** Auto-generated from renderers/react/element-config.meta.json — view-contracts v0.3.0 — DO NOT EDIT */
+/** Shape of entries in renderers/react/elements.yaml (target-specific HTML map, not DSL vocabulary). */
+export interface ReactRendererElementConfig {
+  tag: string;
+  className?: string;
+  ariaLabel?: boolean;
+  ariaHidden?: boolean;
+  flex?: "row" | "column";
+  wrapProp?: string;
+  flexGrowProp?: string;
+  void?: boolean;
+  levelProp?: string;
+  defaultLevel?: number;
+  actionEvent?: "onClick" | "onSubmit";
+  fieldWrap?: boolean;
+  inputType?: string;
+  sizeClass?: string;
+  optionsProp?: string;
+  checkbox?: boolean;
+  defaultRole?: string;
+}
+
+export interface ReactElementMapFile {
+  elements: Record<string, ReactRendererElementConfig>;
+}

package/src/generated/schema/schema-document.ts

@@ -1,5 +1,5 @@
-/** Auto-generated from spec/ui-dsl.meta.json + ui-dsl.schema.json — view-contracts v0.1.0 — DO NOT EDIT */
-import type { Role, WidthSize, HeightSize, Align, Justify, ContentAlign, Axis, Direction, Scroll, Border, Shadow, TextAlign, LineLimit, TextOverflow, FontWeight, ImageFit, KeyboardType, Clip } from './tokens.js';
+/** Auto-generated from spec/ui-dsl.meta.json + ui-dsl.schema.json — view-contracts v0.3.0 — DO NOT EDIT */
+import type { Role, WidthSize, HeightSize, Align, Justify, ContentAlign, Axis, Direction, Scroll, Border, Shadow, TextAlign, LineLimit, TextOverflow, FontWeight, ImageFit, KeyboardType, Clip } from './dsl-enums.js';
 
 export type PropertyType = 'string' | 'number' | 'boolean' | 'array' | 'action' | 'object' | 'null' | string | string[];