@pipelex/mthds-form 0.8.0 → 0.9.0

package/dist/generative/index.js

@@ -0,0 +1,3171 @@
+"use client";
+import { cn, fieldControlClass, ResultField, FieldRenderer, ToggleGroup, ToggleGroupItem, Switch, Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '../chunk-KG4IYFWI.js';
+import '../chunk-S4CB423P.js';
+import { isNativeHtmlNode, isNativeDateNode, isNativeCompositeNode, readDateContent, formatDateContent } from '../chunk-AZZAAGNX.js';
+import '../chunk-25I6JDIK.js';
+import '../chunk-2JWRG53S.js';
+import '../chunk-PM55AHRO.js';
+import '../chunk-GKV77RAS.js';
+import { hasOwnProp } from '../chunk-V3OV2XQT.js';
+import { defineSchema, defineCatalog, validateSpec, compileSpecStream } from '@json-render/core';
+import { z } from 'zod';
+import * as React3 from 'react';
+import { defineRegistry, useStateValue, useStateStore, useBoundProp, useFieldValidation, useRepeatScope, JSONUIProvider, Renderer } from '@json-render/react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Send, Pencil, Zap, Lightbulb, Truck, Package, Briefcase, Bookmark, Flag, Shield, Info, AlertCircle, CheckCircle2, ListChecks, Layers, Tag, Phone, Mail, Paperclip, Upload, FileText, BarChart3, TrendingUp, Hash, Percent, Receipt, Coins, Banknote, Wallet, Gift, Ticket, Image, Camera, Music, Coffee, Utensils, Star, Heart, Accessibility, Baby, User, Users, Hourglass, Clock, Calendar, Moon, Sun, Leaf, Mountain, Globe, Landmark, Building2, Home, Hotel, Ship, Car, Train, Plane, Route, MapPin, Map as Map$1, Compass, Rocket, Sparkles } from 'lucide-react';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+
+var generativeSchema = defineSchema(
+  (s) => ({
+    spec: s.object({
+      root: s.string(),
+      elements: s.record(
+        s.object({
+          type: s.ref("catalog.components"),
+          props: s.propsOf("catalog.components"),
+          children: s.array(s.string()),
+          slots: { ...s.record(s.array(s.string())), ...s.optional() },
+          visible: { ...s.any(), ...s.optional() },
+          repeat: { ...s.any(), ...s.optional() }
+        })
+      )
+    }),
+    catalog: s.object({
+      components: s.map({
+        props: s.zod(),
+        slots: s.array(s.string()),
+        description: s.string(),
+        example: s.any()
+      }),
+      actions: s.map({
+        params: s.zod(),
+        description: s.string()
+      })
+    })
+  }),
+  {
+    // The runtime handles these four without a registry handler; the names and
+    // the wording are the React schema's, so a model that has seen json-render
+    // before recognises them. The validator reads them to know which actions
+    // need no handler, and `designerCatalog()` lists them first, marked
+    // built-in, so the method's prompt names them beside the catalog's own.
+    builtInActions: [
+      {
+        name: "setState",
+        description: "Update a value in the state model at the given statePath. Params: { statePath: string, value: any }"
+      },
+      {
+        name: "pushState",
+        description: "Append an item to an array in state. Params: { statePath: string, value: any, clearStatePath?: string }."
+      },
+      {
+        name: "removeState",
+        description: "Remove an item from an array in state by index. Params: { statePath: string, index: number }"
+      },
+      {
+        name: "validateForm",
+        description: "Validate all registered form fields and write the result to state. Params: { statePath?: string }. Defaults to /formValidation."
+      }
+    ]
+  }
+);
+var validationCheckSchema = z.array(
+  z.object({
+    type: z.string(),
+    message: z.string(),
+    args: z.record(z.string(), z.unknown()).optional()
+  })
+).nullable();
+var validateOnSchema = z.enum(["change", "blur", "submit"]).nullable();
+var shadcnComponentDefinitions = {
+  // ── Layout ────────────────────────────────────────────────────────────────
+  Card: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      maxWidth: z.enum(["sm", "md", "lg", "full"]).nullable(),
+      centered: z.boolean().nullable(),
+      className: z.string().nullable().describe("Additional CSS classes")
+    }),
+    slots: ["default"],
+    description: "Container card for content sections. Use for forms/content boxes, NOT for page headers.",
+    example: { title: "Overview", description: "Your account summary" }
+  },
+  Stack: {
+    props: z.object({
+      direction: z.enum(["horizontal", "vertical"]).nullable(),
+      gap: z.enum(["none", "sm", "md", "lg", "xl"]).nullable(),
+      align: z.enum(["start", "center", "end", "stretch"]).nullable(),
+      justify: z.enum(["start", "center", "end", "between", "around"]).nullable(),
+      className: z.string().nullable().describe("Additional CSS classes")
+    }),
+    slots: ["default"],
+    description: "Flex container for layouts",
+    example: { direction: "vertical", gap: "md" }
+  },
+  Grid: {
+    props: z.object({
+      columns: z.number().nullable(),
+      gap: z.enum(["sm", "md", "lg", "xl"]).nullable(),
+      className: z.string().nullable().describe("Additional CSS classes")
+    }),
+    slots: ["default"],
+    description: "Grid layout (1-6 columns)",
+    example: { columns: 3, gap: "md" }
+  },
+  Separator: {
+    props: z.object({
+      orientation: z.enum(["horizontal", "vertical"]).nullable()
+    }),
+    description: "Visual separator line"
+  },
+  Collapsible: {
+    props: z.object({
+      title: z.string(),
+      defaultOpen: z.boolean().nullable()
+    }),
+    slots: ["default"],
+    description: "Collapsible section with trigger. Children render inside."
+  },
+  // ── Content ───────────────────────────────────────────────────────────────
+  Heading: {
+    props: z.object({
+      text: z.string(),
+      level: z.enum(["h1", "h2", "h3", "h4"]).nullable()
+    }),
+    description: "Heading text (h1-h4)",
+    example: { text: "Welcome", level: "h1" }
+  },
+  Text: {
+    props: z.object({
+      text: z.string(),
+      variant: z.enum(["body", "caption", "muted", "lead", "code"]).nullable()
+    }),
+    description: "Paragraph text",
+    example: { text: "Hello, world!" }
+  },
+  Avatar: {
+    props: z.object({
+      src: z.string().nullable(),
+      name: z.string(),
+      size: z.enum(["sm", "md", "lg"]).nullable()
+    }),
+    description: "User avatar with fallback initials",
+    example: { name: "Jane Doe", size: "md" }
+  },
+  Badge: {
+    props: z.object({
+      text: z.string(),
+      variant: z.enum(["default", "secondary", "destructive", "outline"]).nullable()
+    }),
+    description: "Status badge",
+    example: { text: "Active", variant: "default" }
+  },
+  Alert: {
+    props: z.object({
+      title: z.string(),
+      message: z.string().nullable(),
+      type: z.enum(["info", "success", "warning", "error"]).nullable()
+    }),
+    description: "Alert banner",
+    example: {
+      title: "Note",
+      message: "Your changes have been saved.",
+      type: "success"
+    }
+  },
+  Progress: {
+    props: z.object({
+      value: z.number(),
+      max: z.number().nullable(),
+      label: z.string().nullable()
+    }),
+    description: "Progress bar (value 0-100)",
+    example: { value: 65, max: 100, label: "Upload progress" }
+  },
+  // ── Inputs ────────────────────────────────────────────────────────────────
+  Input: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      type: z.enum(["text", "email", "password", "number"]).nullable(),
+      placeholder: z.string().nullable(),
+      value: z.string().nullable(),
+      checks: validationCheckSchema,
+      validateOn: validateOnSchema
+    }),
+    events: ["submit", "focus", "blur"],
+    description: "Text input field. Use { $bindState } on value for two-way binding. Use checks for validation (e.g. required, email, minLength). validateOn controls timing (default: blur).",
+    example: {
+      label: "Email",
+      name: "email",
+      type: "email",
+      placeholder: "you@example.com"
+    }
+  },
+  Textarea: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      placeholder: z.string().nullable(),
+      rows: z.number().nullable(),
+      value: z.string().nullable(),
+      checks: validationCheckSchema,
+      validateOn: validateOnSchema
+    }),
+    description: "Multi-line text input. Use { $bindState } on value for binding. Use checks for validation. validateOn controls timing (default: blur)."
+  },
+  Select: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      options: z.array(z.string().min(1)),
+      placeholder: z.string().nullable(),
+      value: z.string().nullable(),
+      checks: validationCheckSchema,
+      validateOn: validateOnSchema
+    }),
+    events: ["change"],
+    description: "Dropdown select input. Use { $bindState } on value for binding. Use checks for validation. validateOn controls timing (default: change)."
+  },
+  Radio: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      options: z.array(z.string().min(1)),
+      value: z.string().nullable(),
+      checks: validationCheckSchema,
+      validateOn: validateOnSchema
+    }),
+    events: ["change"],
+    description: "Radio button group. Use { $bindState } on value for binding. Use checks for validation. validateOn controls timing (default: change)."
+  },
+  Checkbox: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      checked: z.boolean().nullable(),
+      checks: validationCheckSchema,
+      validateOn: validateOnSchema
+    }),
+    events: ["change"],
+    description: "Checkbox input. Use { $bindState } on checked for binding. Use checks for validation. validateOn controls timing (default: change)."
+  },
+  Switch: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      checked: z.boolean().nullable(),
+      checks: validationCheckSchema,
+      validateOn: validateOnSchema
+    }),
+    events: ["change"],
+    description: "Toggle switch. Use { $bindState } on checked for binding. Use checks for validation. validateOn controls timing (default: change)."
+  },
+  // ── Actions ───────────────────────────────────────────────────────────────
+  Button: {
+    props: z.object({
+      label: z.string(),
+      variant: z.enum(["primary", "secondary", "danger"]).nullable(),
+      disabled: z.boolean().nullable()
+    }),
+    events: ["press"],
+    description: "Clickable button. Bind on.press for handler.",
+    example: { label: "Submit", variant: "primary" }
+  }
+};
+
+// src/generative/components.ts
+var shadcn = shadcnComponentDefinitions;
+var PICKED_SHADCN = [
+  "Card",
+  "Stack",
+  "Grid",
+  "Separator",
+  "Heading",
+  "Text",
+  "Badge",
+  "Alert",
+  "Collapsible",
+  "Progress",
+  "Avatar",
+  "Input",
+  "Textarea",
+  "Select",
+  "Radio",
+  "Checkbox",
+  "Switch",
+  "Button"
+];
+var CUSTOM_COMPONENTS = [
+  "Split",
+  "Tabs",
+  "Steps",
+  "Icon",
+  "Segmented",
+  "NumberInput",
+  "MthdsField",
+  "MthdsResult",
+  "DataTable",
+  "Metric"
+];
+var METRIC_FORMATS = ["plain", "integer", "decimal", "compact"];
+var ICON_NAMES = [
+  "Sparkles",
+  "Rocket",
+  "Compass",
+  "Map",
+  "MapPin",
+  "Route",
+  "Plane",
+  "Train",
+  "Car",
+  "Ship",
+  "Hotel",
+  "Home",
+  "Building2",
+  "Landmark",
+  "Globe",
+  "Mountain",
+  "Leaf",
+  "Sun",
+  "Moon",
+  "Calendar",
+  "Clock",
+  "Hourglass",
+  "Users",
+  "User",
+  "Baby",
+  "Accessibility",
+  "Heart",
+  "Star",
+  "Utensils",
+  "Coffee",
+  "Music",
+  "Camera",
+  "Image",
+  "Ticket",
+  "Gift",
+  "Wallet",
+  "Banknote",
+  "Coins",
+  "Receipt",
+  "Percent",
+  "Hash",
+  "TrendingUp",
+  "BarChart3",
+  "FileText",
+  "Upload",
+  "Paperclip",
+  "Mail",
+  "Phone",
+  "Tag",
+  "Layers",
+  "ListChecks",
+  "CheckCircle2",
+  "AlertCircle",
+  "Info",
+  "Shield",
+  "Flag",
+  "Bookmark",
+  "Briefcase",
+  "Package",
+  "Truck",
+  "Lightbulb",
+  "Zap",
+  "Pencil",
+  "Send"
+];
+var components = {
+  // ── Layout (shadcn) ────────────────────────────────────────────────────
+  Card: {
+    ...shadcn.Card,
+    props: shadcn.Card.props.omit({ className: true, maxWidth: true, centered: true }),
+    description: 'Container card for content sections. Use for forms/content boxes, NOT for page headers. Its optional "title" renders as an h3, so a titled Card sits under an h2.'
+  },
+  Stack: { ...shadcn.Stack, props: shadcn.Stack.props.omit({ className: true }) },
+  Grid: { ...shadcn.Grid, props: shadcn.Grid.props.omit({ className: true }) },
+  Separator: shadcn.Separator,
+  Collapsible: shadcn.Collapsible,
+  // ── Content (shadcn) ───────────────────────────────────────────────────
+  Heading: shadcn.Heading,
+  Text: shadcn.Text,
+  Badge: shadcn.Badge,
+  Alert: shadcn.Alert,
+  Progress: shadcn.Progress,
+  Avatar: {
+    ...shadcn.Avatar,
+    description: `A round avatar showing the initials of "name" - bind it to a person's name in the state ({ "$state" } or { "$item" }); never set "src".`
+  },
+  // ── Inputs (shadcn) ────────────────────────────────────────────────────
+  Input: shadcn.Input,
+  Textarea: shadcn.Textarea,
+  Select: shadcn.Select,
+  Radio: shadcn.Radio,
+  Checkbox: shadcn.Checkbox,
+  Switch: shadcn.Switch,
+  Button: shadcn.Button,
+  // ── Layout (ours) ──────────────────────────────────────────────────────
+  Split: {
+    props: z.object({
+      ratio: z.enum(["1:1", "1:2", "2:1"]).nullable(),
+      gap: z.enum(["md", "lg", "xl"]).nullable()
+    }),
+    slots: ["default"],
+    description: 'Two columns side by side, from exactly two children: the first is the left column. "1:2" puts a narrow rail (a summary, the essentials, the run) beside the work; "2:1" the reverse; "1:1" two halves. Columns stack on a narrow screen.',
+    example: { ratio: "1:2", gap: "lg" }
+  },
+  Tabs: {
+    props: z.object({
+      tabs: z.array(z.object({ label: z.string(), value: z.string() })).min(2)
+    }),
+    slots: ["default"],
+    description: "Concerns of equal weight, one visible at a time. Exactly one child per tab, in the same order - each child is that tab's panel (usually a Stack). The first tab opens. The active tab is the component's own state, never /state.",
+    example: {
+      tabs: [
+        { label: "The trip", value: "trip" },
+        { label: "Who is going", value: "people" }
+      ]
+    }
+  },
+  Steps: {
+    props: z.object({
+      steps: z.array(z.string()).min(2),
+      nextLabel: z.string().nullable(),
+      backLabel: z.string().nullable()
+    }),
+    slots: ["default"],
+    description: "A journey with a natural order: a numbered indicator, one panel at a time, and its own Back and Next. Exactly one child per step, in order - each child is that step's panel. Put the Button that runs inside the LAST panel; Next disappears there. The current step is the component's own state, never /state.",
+    example: { steps: ["Where", "Who", "How"], nextLabel: "Continue" }
+  },
+  Icon: {
+    props: z.object({
+      name: z.enum(ICON_NAMES),
+      size: z.enum(["sm", "md", "lg"]).nullable()
+    }),
+    slots: [],
+    description: "A decorative icon, one of the listed lucide names, to give a section or a figure a face: put it in a horizontal Stack beside a Heading or a Metric. It carries no meaning on its own and no text.",
+    example: { name: "Plane", size: "md" }
+  },
+  // ── Inputs (ours) ──────────────────────────────────────────────────────
+  Segmented: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      options: z.array(z.string().min(1)).min(2).max(6),
+      value: z.string().nullable()
+    }),
+    slots: [],
+    description: `A choice of two to six options as a row of pills, one selected - the app's answer to a short Select. "options" are EXACTLY the brief's choices, spelled exactly; bind "value" with { "$bindState": "/inputs/..." }.`,
+    example: {
+      label: "Pace",
+      name: "pace",
+      options: ["slow", "balanced", "packed"],
+      value: { $bindState: "/inputs/request/pace" }
+    }
+  },
+  NumberInput: {
+    props: z.object({
+      label: z.string(),
+      name: z.string(),
+      value: z.number().nullable(),
+      placeholder: z.string().nullable(),
+      unit: z.string().nullable(),
+      min: z.number().nullable(),
+      max: z.number().nullable(),
+      step: z.number().nullable()
+    }),
+    slots: [],
+    description: 'A figure the person types: writes a NUMBER to the bound path, which Input type "number" does not (it writes text). Bind "value" with { "$bindState": "/inputs/..." }. "unit" is a short suffix ONLY when the brief states one; "min", "max" and "step" only when the brief states them.',
+    example: {
+      label: "Budget",
+      name: "budget",
+      value: { $bindState: "/inputs/request/budget" },
+      placeholder: "2500"
+    }
+  },
+  // ── The escape hatches and the bound equivalents (ours) ────────────────
+  MthdsField: {
+    props: z.object({
+      path: z.string()
+    }),
+    slots: [],
+    description: `The kernel's own control for ONE input, bound two-way at "path" (a /inputs path from the brief). Use it for every path the brief marks as delegated - a file, a date, a list, a structure you would rather not lay out - and for any scalar you would rather not style. It renders its own label and description. Inside a repeat, "path" is the item's field name relative to the item ("lines"), never an $item expression.`,
+    example: { path: "/inputs/source" }
+  },
+  MthdsResult: {
+    props: z.object({
+      path: z.string(),
+      hideLabel: z.boolean().nullable()
+    }),
+    slots: [],
+    description: `The kernel's own read-only rendering of ONE result subtree at "path" (a /result path from the brief). Use it for every path the brief marks as delegated - a file, a date, a document, prose, markup - and for any structure you choose not to lay out. It renders its own label unless hideLabel is true. Inside a repeat, "path" is the item's field name relative to the item ("teams"), never an $item expression - the way to delegate one subtree of every item.`,
+    example: { path: "/result/issued_on" }
+  },
+  DataTable: {
+    props: z.object({
+      rows: z.any(),
+      columns: z.array(z.object({ path: z.string(), label: z.string() })),
+      caption: z.string().nullable()
+    }),
+    slots: [],
+    description: 'A table over a list of structures. "rows" MUST be { "$state": "/path/to/the/list" } (never inline rows); each column names a field of one item by its relative path ("label", "unit_price") and the header to show for it.',
+    example: {
+      rows: { $state: "/result/lines" },
+      columns: [
+        { path: "label", label: "Item" },
+        { path: "quantity", label: "Qty" }
+      ]
+    }
+  },
+  Metric: {
+    props: z.object({
+      label: z.string(),
+      value: z.any(),
+      unit: z.string().nullable(),
+      format: z.enum(METRIC_FORMATS).nullable()
+    }),
+    slots: [],
+    description: 'A labelled figure - the one number a reader looks for first. "value" is bound with { "$state": "/path" } (never inline); "unit" is a short suffix and ONLY one the brief states (a currency the structure carries, "%" for a rate, "M" when the brief says "in millions") - never invent a currency the state does not carry; "format" is plain, integer, decimal (two places) or compact.',
+    example: { label: "Total", value: { $state: "/result/total" }, unit: "EUR", format: "decimal" }
+  }
+};
+var actions = {
+  run: {
+    params: z.object({}),
+    description: "Start the run with the current /inputs. The host handles it; an input page binds it to its one Button after validateForm."
+  }
+};
+defineCatalog(generativeSchema, { components, actions });
+var generativeComponents = components;
+var generativeActions = actions;
+
+// src/generative/catalog.ts
+var PRODUCT_COMPONENTS = [
+  "AppBar",
+  "Hero",
+  "Workspace",
+  "Section",
+  "Rail",
+  "SummaryRow",
+  "Cta",
+  "Footer"
+];
+var product = {
+  AppBar: {
+    props: z.object({
+      app: z.string(),
+      links: z.array(z.string()).nullable(),
+      tag: z.string().nullable()
+    }),
+    slots: [],
+    description: "A bar across the top of the page: the brand's logo, the name of this app beside it, a few muted links, and a small mono tag at the right (the method behind the page). It renders as the page's banner, so at most one.",
+    example: { app: "Trip planner", links: ["Methods", "Runs"], tag: "plan_trip" }
+  },
+  Hero: {
+    props: z.object({
+      headline: z.string(),
+      lede: z.string().nullable(),
+      eyebrow: z.string().nullable()
+    }),
+    slots: [],
+    description: "An opening: one bold headline that says what happens here, one muted line under it at most, and an optional small eyebrow in the accent colour above. The headline renders as an h1, so at most one on a page.",
+    example: { headline: "Plan a trip worth taking.", lede: "Tell us where and who is coming." }
+  },
+  Workspace: {
+    props: z.object({ rail: z.enum(["right", "left"]).nullable() }),
+    slots: ["default"],
+    description: 'Two children side by side on a wide screen and stacked on a narrow one: the work, and beside it a narrower panel that stays sticky while the work scrolls. Exactly two children; "rail" says which side the panel takes, right by default.',
+    example: { rail: "right" }
+  },
+  Section: {
+    props: z.object({
+      number: z.string().nullable(),
+      title: z.string(),
+      lede: z.string().nullable()
+    }),
+    slots: ["default"],
+    description: "A titled stage of the work: an optional small mono number in the accent colour, an h2 title, an optional muted line, then its children - flat, spaced, separated from the next Section by a hairline, never boxed.",
+    example: { number: "01", title: "Where and when" }
+  },
+  Rail: {
+    props: z.object({ title: z.string() }),
+    slots: ["default"],
+    description: "A raised, boxed panel: a small uppercase h2 title, then its children in a column. Made to stand beside the work as the panel of a Workspace, and the one boxed surface in this vocabulary.",
+    example: { title: "Your trip" }
+  },
+  SummaryRow: {
+    props: z.object({
+      label: z.string(),
+      value: z.any().nullable(),
+      detail: z.any().nullable(),
+      separator: z.string().nullable(),
+      placeholder: z.string().nullable()
+    }),
+    slots: [],
+    description: 'A line that restates a value: a muted label at the left, a bound value at the right. "value" and the optional "detail" are read with { "$state": "/inputs/..." } and joined by "separator" (a space by default); each is a scalar path - text, number, boolean, date or choice - never a structure, a list or a file. While both are empty the row shows "placeholder", or a dash.',
+    example: {
+      label: "Budget",
+      value: { $state: "/inputs/request/budget" },
+      detail: { $state: "/inputs/request/currency" }
+    }
+  },
+  Cta: {
+    props: z.object({ label: z.string(), hint: z.string().nullable() }),
+    slots: [],
+    events: ["press"],
+    description: "A call to action: a full-width button in the accent colour that runs the method, with an optional one-line hint under it. Bind on.press to validateForm then run.",
+    example: { label: "Plan my trip", hint: "Nothing runs until the request is complete." }
+  },
+  Footer: {
+    props: z.object({ text: z.string(), tag: z.string().nullable() }),
+    slots: [],
+    description: "A closing line, muted, with an optional mono tag at the right. It renders as the page's contentinfo, so at most one.",
+    example: { text: "Runs on Pipelex.", tag: "MTHDS" }
+  }
+};
+var COMPONENT_RENDERINGS = {
+  Hero: { heading: { level: 1 } },
+  Section: { heading: { level: 2 } },
+  Rail: { heading: { level: 2 } },
+  Card: { heading: { level: 3, when: "title" } },
+  AppBar: { once: "the page's banner" },
+  Footer: { once: "the page's contentinfo" },
+  Split: { children: { count: 2, roles: "left, right" } },
+  Workspace: { children: { count: 2, roles: "work, rail" } },
+  Tabs: { panels: { prop: "tabs", noun: "tab" } },
+  Steps: { panels: { prop: "steps", noun: "step" } }
+};
+var catalog = Object.assign(
+  defineCatalog(generativeSchema, {
+    components: { ...generativeComponents, ...product },
+    actions: generativeActions
+  }),
+  { renders: COMPONENT_RENDERINGS }
+);
+var COMPONENT_NAMES = [
+  ...PICKED_SHADCN,
+  ...CUSTOM_COMPONENTS,
+  ...PRODUCT_COMPONENTS
+];
+
+// src/generative/props-signature.ts
+function definitionOf(schema) {
+  return schema._zod.def;
+}
+function propsSignature(schema) {
+  const def = definitionOf(schema);
+  switch (def.type) {
+    case "string":
+      return "string";
+    case "number":
+      return "number";
+    case "boolean":
+      return "boolean";
+    case "literal":
+      return JSON.stringify(def.values?.[0]);
+    case "enum":
+      return Object.values(def.entries ?? {}).map((value) => `"${String(value)}"`).join(" | ");
+    case "array":
+      return `Array<${def.element ? propsSignature(def.element) : "unknown"}>`;
+    case "object": {
+      const props = Object.entries(def.shape ?? {}).map(([key, value]) => {
+        const inner = definitionOf(value).type;
+        const optional = inner === "optional" || inner === "nullable";
+        return `${key}${optional ? "?" : ""}: ${propsSignature(value)}`;
+      });
+      return `{ ${props.join(", ")} }`;
+    }
+    case "optional":
+    case "nullable":
+    case "default":
+      return def.innerType ? propsSignature(def.innerType) : "unknown";
+    case "union":
+      return def.options ? def.options.map((option) => propsSignature(option)).join(" | ") : "unknown";
+    case "record": {
+      const key = def.keyType ? propsSignature(def.keyType) : "string";
+      const value = def.valueType ? propsSignature(def.valueType) : "unknown";
+      return `Record<${key}, ${value}>`;
+    }
+    default:
+      return "unknown";
+  }
+}
+
+// src/generative/designer-catalog.ts
+var DESIGNER_CATALOG_CONCEPT = "generative.Catalog";
+function designerCatalog() {
+  const definitions = catalog.data.components;
+  const components3 = COMPONENT_NAMES.map((name) => {
+    const definition = definitions[name];
+    if (!definition) throw new Error(`the catalog defines no component named '${name}'`);
+    const slots = definition.slots ?? [];
+    return {
+      name,
+      props: propsSignature(definition.props),
+      description: definition.description,
+      accepts_children: slots.includes("default"),
+      slots: slots.filter((slot) => slot !== "default"),
+      events: [...definition.events ?? []]
+    };
+  });
+  const builtIn = (generativeSchema.builtInActions ?? []).map((action) => ({
+    name: action.name,
+    description: action.description,
+    built_in: true
+  }));
+  const own = Object.entries(catalog.data.actions).map(
+    ([name, action]) => ({
+      name,
+      description: action.description,
+      built_in: false
+    })
+  );
+  return { components: components3, actions: [...builtIn, ...own] };
+}
+
+// src/generative/prompt-hash.ts
+var PROMPT_HASH = "15d195df65f3";
+
+// src/generative/paths.ts
+var INPUTS_ROOT = "/inputs";
+var RESULT_ROOT = "/result";
+function joinPath(root, ...segments) {
+  return segments.reduce((path, segment) => `${path}/${escapeSegment(segment)}`, root);
+}
+function escapeSegment(segment) {
+  return segment.replace(/~/g, "~0").replace(/\//g, "~1");
+}
+function unescapeSegment(segment) {
+  return segment.replace(/~1/g, "/").replace(/~0/g, "~");
+}
+function segmentsUnder(root, path) {
+  if (path === root) return [];
+  if (!path.startsWith(`${root}/`)) return void 0;
+  return path.slice(root.length + 1).split("/").map(unescapeSegment);
+}
+function fieldAtSegments(fields, segments) {
+  const [head, ...rest] = segments;
+  if (head === void 0) return void 0;
+  const field = fields.find((candidate) => candidate.name === head);
+  if (!field) return void 0;
+  return rest.length === 0 ? field : descend(field, rest);
+}
+function descend(field, segments) {
+  const [head, ...rest] = segments;
+  if (head === void 0) return field;
+  if (field.kind === "object") return fieldAtSegments(field.fields, segments);
+  if (field.kind === "list" && /^\d+$/.test(head)) return descend(field.item, rest);
+  return void 0;
+}
+function inputFieldAtPath(fields, path) {
+  const segments = segmentsUnder(INPUTS_ROOT, path);
+  return segments && segments.length > 0 ? fieldAtSegments(fields, segments) : void 0;
+}
+function resultFieldAtPath(field, path) {
+  const segments = segmentsUnder(RESULT_ROOT, path);
+  if (!segments) return void 0;
+  return segments.length === 0 ? field : descend(field, segments);
+}
+function parentMapOf(spec) {
+  const parents = /* @__PURE__ */ new Map();
+  for (const [parentKey, element] of Object.entries(spec.elements)) {
+    for (const child of element.children ?? []) parents.set(child, parentKey);
+  }
+  return parents;
+}
+function repeatBasePathOf(spec, key, parents = parentMapOf(spec)) {
+  const chain = [];
+  const seen = /* @__PURE__ */ new Set();
+  let current = key;
+  while (current !== void 0 && !seen.has(current)) {
+    seen.add(current);
+    chain.unshift(current);
+    current = parents.get(current);
+  }
+  let base;
+  for (const elementKey of chain) {
+    const repeat = spec.elements[elementKey]?.repeat;
+    if (!repeat) continue;
+    const statePath = repeat.statePath;
+    if (typeof statePath === "string") {
+      base = `${statePath}/0`;
+      continue;
+    }
+    const item = statePath?.$item;
+    if (base === void 0 || typeof item !== "string") return void 0;
+    base = `${joinPath(base, item)}/0`;
+  }
+  return base;
+}
+function absoluteHatchPath(spec, key, path, parents) {
+  if (path.startsWith("/")) return path;
+  const base = repeatBasePathOf(spec, key, parents);
+  return base ? `${base}/${path}` : void 0;
+}
+function repeatListPathOf(spec, key, parents = parentMapOf(spec)) {
+  const statePath = spec.elements[key]?.repeat?.statePath;
+  if (typeof statePath === "string") return statePath;
+  const item = statePath?.$item;
+  const parent = parents.get(key);
+  const outer = parent === void 0 ? void 0 : repeatBasePathOf(spec, parent, parents);
+  return outer !== void 0 && typeof item === "string" ? joinPath(outer, item) : void 0;
+}
+
+// src/generative/brief.ts
+var RUN_COMPONENT = "Cta";
+function isDelegatedInput(field) {
+  return field.kind === "document" || field.kind === "image" || field.kind === "date" || field.kind === "list" || field.kind === "unknown" || field.kind === "enum" && field.options.includes("");
+}
+function isDelegatedResult(field) {
+  if (isNativeHtmlNode(field) || isNativeDateNode(field) || isNativeCompositeNode(field)) {
+    return true;
+  }
+  return field.kind === "document" || field.kind === "image" || field.kind === "date" || field.kind === "prose" || field.kind === "unknown";
+}
+function kindLabel(field) {
+  if (isNativeHtmlNode(field)) return "markup (native.Html)";
+  if (isNativeDateNode(field)) return "date (native.Date)";
+  if (isNativeCompositeNode(field)) return "composite (native.Composite)";
+  switch (field.kind) {
+    case "text":
+      return "text";
+    case "prose":
+      return "prose (markdown)";
+    case "number":
+      return field.integer ? "integer" : "number";
+    case "boolean":
+      return "boolean";
+    case "enum":
+      return `choice of ${field.options.map((option) => JSON.stringify(option)).join(" | ")}`;
+    case "date":
+      return field.datetime ? "date with time" : "date";
+    case "document":
+      return "document (a file)";
+    case "image":
+      return "image (a file)";
+    case "object":
+      return `structure${field.conceptRef ? ` ${field.conceptRef}` : ""}`;
+    case "list":
+      return `list of ${kindLabel(field.item)}`;
+    case "unknown":
+      return "unknown";
+    default:
+      return field;
+  }
+}
+function labelOf(field) {
+  return field.title && field.title !== field.name ? `${field.title} (\`${field.name}\`)` : `\`${field.name}\``;
+}
+function constraints(field) {
+  const notes = [];
+  if (field.kind === "number") {
+    if (field.min !== void 0) notes.push(`min ${field.min}`);
+    if (field.max !== void 0) notes.push(`max ${field.max}`);
+  }
+  if (field.kind === "text" || field.kind === "prose") {
+    if (field.minLength !== void 0) notes.push(`at least ${field.minLength} characters`);
+    if (field.maxLength !== void 0) notes.push(`at most ${field.maxLength} characters`);
+    if (field.format) notes.push(`format ${field.format}`);
+  }
+  if (field.kind === "list") {
+    if (field.itemCount !== void 0) notes.push(`at least ${field.itemCount} items`);
+    if (field.maxItemCount !== void 0) notes.push(`at most ${field.maxItemCount} items`);
+  }
+  if (field.defaultValue !== void 0) notes.push(`default ${JSON.stringify(field.defaultValue)}`);
+  if (field.examples && field.examples.length > 0) {
+    notes.push(`examples ${field.examples.map((example) => JSON.stringify(example)).join(", ")}`);
+  }
+  if (field.hints && Object.keys(field.hints).length > 0) {
+    notes.push(
+      `hints ${Object.entries(field.hints).map(([key, value]) => `${key}=${value}`).join(", ")}`
+    );
+  }
+  return notes;
+}
+function describe(field, path, depth, side, lines) {
+  const delegated = side === "input" ? isDelegatedInput(field) : isDelegatedResult(field);
+  const parts = [`\`${path}\` \u2014 ${kindLabel(field)}`];
+  if (side === "input") {
+    parts.push(field.required ? "required" : "optional");
+    if (field.gating) parts.push("gates the run");
+  }
+  const head = parts.join(", ");
+  const tail = [labelOf(field), field.description ?? ""].filter(Boolean).join(": ");
+  const notes = constraints(field);
+  const delegation = delegated ? ` **[delegate: ${side === "input" ? "MthdsField" : "MthdsResult"}]**` : "";
+  lines.push({
+    depth,
+    text: `${head} \u2014 ${tail}${notes.length > 0 ? ` (${notes.join("; ")})` : ""}${delegation}`
+  });
+  if (delegated) return;
+  if (field.kind === "object") {
+    for (const child of field.fields) {
+      describe(child, joinPath(path, child.name), depth + 1, side, lines);
+    }
+  }
+  if (field.kind === "list" && side === "result") {
+    const item = field.item;
+    if (item.kind === "object" && !isDelegatedResult(item)) {
+      lines.push({
+        depth: depth + 1,
+        text: `each item is a ${kindLabel(item)}${item.description ? ` (${item.description})` : ""}, with these members (paths relative to one item, for DataTable columns or $item):`
+      });
+      for (const child of item.fields) {
+        describeRelative(child, child.name, depth + 2, lines);
+      }
+    } else {
+      lines.push({ depth: depth + 1, text: `each item is a ${kindLabel(item)}` });
+    }
+  }
+}
+function describeRelative(field, relativePath, depth, lines) {
+  const notes = constraints(field);
+  lines.push({
+    depth,
+    text: `\`${relativePath}\` \u2014 ${kindLabel(field)} \u2014 ${[labelOf(field), field.description ?? ""].filter(Boolean).join(": ")}${notes.length > 0 ? ` (${notes.join("; ")})` : ""}${isDelegatedResult(field) ? " (a DataTable prints it as text; delegate the whole list to MthdsResult to render it properly)" : ""}`
+  });
+  if (field.kind === "object") {
+    for (const child of field.fields)
+      describeRelative(child, joinPath(relativePath, child.name), depth + 1, lines);
+  }
+  if (field.kind === "list" && field.item.kind === "object") {
+    lines.push({ depth: depth + 1, text: `each item is a ${kindLabel(field.item)}, with:` });
+    for (const child of field.item.fields) {
+      describeRelative(child, joinPath(relativePath, "<i>", child.name), depth + 2, lines);
+    }
+  }
+}
+function render(lines) {
+  return lines.map((line) => `${"  ".repeat(line.depth)}- ${line.text}`).join("\n");
+}
+function collectDelegated(fields, root, side) {
+  const out = [];
+  const walk = (field, path) => {
+    const delegated = side === "input" ? isDelegatedInput(field) : isDelegatedResult(field);
+    if (delegated) {
+      out.push(`\`${path}\` (${kindLabel(field)})`);
+      return;
+    }
+    if (field.kind === "object") {
+      for (const child of field.fields) walk(child, joinPath(path, child.name));
+    }
+  };
+  for (const field of fields) walk(field, joinPath(root, field.name));
+  return out;
+}
+function collectDefaults(fields, root) {
+  const out = [];
+  const walk = (field, path) => {
+    if (field.defaultValue !== void 0) {
+      out.push(`\`${path}\` = ${JSON.stringify(field.defaultValue)}`);
+      return;
+    }
+    if (field.kind === "object") {
+      for (const child of field.fields) walk(child, joinPath(path, child.name));
+    }
+  };
+  for (const field of fields) walk(field, joinPath(root, field.name));
+  return out;
+}
+function renderInputBrief(subject, fields) {
+  const lines = [];
+  for (const field of fields) describe(field, joinPath(INPUTS_ROOT, field.name), 0, "input", lines);
+  const delegated = collectDelegated(fields, INPUTS_ROOT, "input");
+  const defaults = collectDefaults(fields, INPUTS_ROOT);
+  const gating = fields.filter((field) => field.gating).map((field) => `\`${field.name}\``);
+  return [
+    `# Input page: ${subject.pipeRef}`,
+    "",
+    subject.description ?? "A method with the inputs below.",
+    "",
+    ...subject.name ? [
+      "## Name",
+      "",
+      `The method is called \xAB${subject.name}\xBB, as the host lists it. That is the app's name wherever the layout asks for one; invent no other. Links, if the layout carries any, name this page's own sections. The page states nothing the method does not: no promise about storage, privacy, speed, or what happens after the run.`,
+      ""
+    ] : [],
+    "## State",
+    "",
+    `The form's values live under \`${INPUTS_ROOT}\`, one member per input, exactly as listed. Bind each input with \`$bindState\` at its path; a structure's members bind at their own paths beneath it.`,
+    "",
+    render(lines),
+    "",
+    "## Delegated",
+    "",
+    delegated.length > 0 ? `Render these with \`MthdsField\` at the path, and nothing else:
+
+${delegated.map((entry) => `- ${entry}`).join("\n")}` : "None: every input can be entered with the catalog's own inputs. `MthdsField` remains available for any you would rather not style.",
+    "",
+    "## Defaults",
+    "",
+    defaults.length > 0 ? `Seed these, and only these, with \`/state\` patches (\`{"op":"add","path":"/state/inputs/...","value":...}\`):
+
+${defaults.map((entry) => `- ${entry}`).join("\n")}` : "None. Emit no `/state` patches.",
+    "",
+    "## Run",
+    "",
+    gating.length > 0 ? `The run waits for ${gating.join(", ")}; say so near the ${RUN_COMPONENT}, briefly.` : "Nothing gates the run.",
+    `The page has exactly one \`${RUN_COMPONENT}\`, \`on.press\` bound to \`validateForm\` then \`run\`; label it with what the method does, in a person's words.`,
+    ""
+  ].join("\n");
+}
+function renderResultBrief(subject, field, state) {
+  const lines = [];
+  const delegatedWhole = isDelegatedResult(field);
+  if (field.kind === "object" && !delegatedWhole) {
+    lines.push({
+      depth: 0,
+      text: `\`${RESULT_ROOT}\` \u2014 ${kindLabel(field)}${field.description ? `: ${field.description}` : ""}`
+    });
+    for (const child of field.fields) {
+      describe(child, joinPath(RESULT_ROOT, child.name), 1, "result", lines);
+    }
+  } else {
+    describe(field, RESULT_ROOT, 0, "result", lines);
+  }
+  const delegated = field.kind === "object" && !delegatedWhole ? collectDelegated(field.fields, RESULT_ROOT, "result") : delegatedWhole ? [`\`${RESULT_ROOT}\` (${kindLabel(field)})`] : [];
+  return [
+    `# Result page: ${subject.pipeRef}`,
+    "",
+    subject.description ?? "The result of a method, described below.",
+    "",
+    "## State",
+    "",
+    `The host loads the run's result under \`${RESULT_ROOT}\` before the page renders. Read every value with \`$state\`; emit no \`/state\` patches. Paths:`,
+    "",
+    render(lines),
+    "",
+    "## Delegated",
+    "",
+    delegated.length > 0 ? `Render these with \`MthdsResult\` at the path - they are kinds the catalog cannot show properly:
+
+${delegated.map((entry) => `- ${entry}`).join("\n")}` : "None. `MthdsResult` remains available for any structure you choose not to lay out.",
+    "",
+    "## One real run, as loaded",
+    "",
+    "The state of one actual run, so you can judge magnitudes and lengths. Bind to the paths; do not copy these values into the spec.",
+    "",
+    "```json",
+    JSON.stringify(state, null, 2),
+    "```",
+    ""
+  ].join("\n");
+}
+var EXPRESSION_KEYS = [
+  "$state",
+  "$item",
+  "$index",
+  "$bindState",
+  "$bindItem",
+  "$cond",
+  "$computed",
+  "$template"
+];
+var HATCHES = /* @__PURE__ */ new Set(["MthdsField", "MthdsResult"]);
+function isExpression(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value) && Object.keys(value).some((key) => EXPRESSION_KEYS.includes(key));
+}
+function isClosedVocabulary(schema) {
+  let current = schema;
+  for (let depth = 0; depth < 8; depth += 1) {
+    const def = current.def;
+    if (!def) return false;
+    if (def.type === "enum" || def.type === "literal") return true;
+    if (def.innerType === void 0) return false;
+    current = def.innerType;
+  }
+  return false;
+}
+function definitionOf2(catalog2, type) {
+  const components3 = catalog2.data.components;
+  return hasOwnProp(components3, type) ? components3[type] : void 0;
+}
+function propsSchemaOf(catalog2, type) {
+  const props = definitionOf2(catalog2, type)?.props;
+  return props && typeof props === "object" && "shape" in props ? props : void 0;
+}
+function eventsOf(catalog2, type) {
+  const definition = definitionOf2(catalog2, type);
+  if (!definition) return void 0;
+  return Array.isArray(definition.events) ? definition.events.filter((event) => typeof event === "string") : [];
+}
+var MAX_ELEMENT_DEPTH = 512;
+function childKeysOf(spec, key) {
+  const element = spec.elements[key];
+  if (!element) return [];
+  const children = Array.isArray(element.children) ? element.children : [];
+  const slots = typeof element.slots === "object" && element.slots !== null ? Object.values(element.slots).flatMap(
+    (slot) => Array.isArray(slot) ? slot : []
+  ) : [];
+  return [...children, ...slots].filter((child) => typeof child === "string");
+}
+function deepestChain(spec) {
+  const below = /* @__PURE__ */ new Map();
+  const onPath = /* @__PURE__ */ new Set();
+  let deepest = 0;
+  for (const start of Object.keys(spec.elements)) {
+    if (below.has(start)) continue;
+    const stack = [start];
+    while (stack.length > 0) {
+      const key = stack[stack.length - 1];
+      if (below.has(key)) {
+        onPath.delete(key);
+        stack.pop();
+        continue;
+      }
+      const children = childKeysOf(spec, key).filter((child) => !onPath.has(child));
+      const pending = children.filter((child) => !below.has(child));
+      if (pending.length > 0) {
+        onPath.add(key);
+        stack.push(...pending);
+        continue;
+      }
+      below.set(
+        key,
+        children.reduce((tallest, child) => Math.max(tallest, below.get(child) ?? 0), 0) + 1
+      );
+      onPath.delete(key);
+      stack.pop();
+    }
+    deepest = Math.max(deepest, below.get(start) ?? 0);
+  }
+  return deepest;
+}
+function validateAgainstCatalog(spec, catalog2 = catalog) {
+  try {
+    return checkAgainstCatalog(spec, catalog2);
+  } catch (error) {
+    return {
+      ok: false,
+      problems: [{ message: `the layout is not a well-formed spec: ${String(error)}` }]
+    };
+  }
+}
+function checkAgainstCatalog(spec, catalog2) {
+  const problems = [];
+  const depth = deepestChain(spec);
+  if (depth > MAX_ELEMENT_DEPTH) {
+    return {
+      ok: false,
+      problems: [
+        {
+          message: `the element tree is ${depth} deep; this entry renders at most ${MAX_ELEMENT_DEPTH}.`
+        }
+      ]
+    };
+  }
+  const structure = validateSpec(spec, { checkOrphans: true });
+  for (const issue of structure.issues) {
+    if (issue.severity === "error" || issue.code === "orphaned_element") {
+      problems.push({ elementKey: issue.elementKey, message: issue.message });
+    }
+  }
+  const cyclic = /* @__PURE__ */ new Set();
+  const state = /* @__PURE__ */ new Map();
+  const descend2 = (key) => {
+    const mark = state.get(key);
+    if (mark === "done") return;
+    if (mark === "open") {
+      cyclic.add(key);
+      return;
+    }
+    state.set(key, "open");
+    const element = spec.elements[key];
+    for (const child of element?.children ?? []) descend2(child);
+    for (const slot of Object.values(element?.slots ?? {}))
+      for (const child of slot) descend2(child);
+    state.set(key, "done");
+  };
+  for (const key of Object.keys(spec.elements)) descend2(key);
+  for (const key of cyclic) {
+    problems.push({
+      elementKey: key,
+      message: `"${key}" is its own descendant: an element tree may not contain a cycle.`
+    });
+  }
+  const known = new Set(catalog2.componentNames);
+  for (const [key, element] of Object.entries(spec.elements)) {
+    if (!known.has(element.type)) {
+      problems.push({ elementKey: key, message: `unknown component type "${element.type}"` });
+    }
+  }
+  for (const [key, element] of Object.entries(spec.elements)) {
+    const schema = propsSchemaOf(catalog2, element.type);
+    if (!schema) continue;
+    const shape = schema.shape;
+    const props = element.props ?? {};
+    for (const [name, value] of Object.entries(props)) {
+      const propSchema = shape[name];
+      if (!propSchema) {
+        problems.push({
+          elementKey: key,
+          message: `${element.type} has no prop "${name}" (known: ${Object.keys(shape).join(", ")})`
+        });
+        continue;
+      }
+      if (isExpression(value)) {
+        if (HATCHES.has(element.type) && name === "path") {
+          problems.push({
+            elementKey: key,
+            message: `${element.type}.path must be a literal string - absolute, or the item's field name inside a repeat - never an expression.`
+          });
+        } else if (isClosedVocabulary(propSchema)) {
+          problems.push({
+            elementKey: key,
+            message: `${element.type}.${name} is one of a fixed set of names, so it must be written as a literal, never as an expression.`
+          });
+        }
+        continue;
+      }
+      const parsed = propSchema.safeParse(value);
+      if (!parsed.success) {
+        problems.push({
+          elementKey: key,
+          message: `${element.type}.${name}: ${parsed.error.issues.map((issue) => issue.message).join("; ")}`
+        });
+      }
+    }
+    for (const [name, propSchema] of Object.entries(shape)) {
+      if (name in props) continue;
+      if (propSchema.safeParse(void 0).success || propSchema.safeParse(null).success) continue;
+      problems.push({
+        elementKey: key,
+        message: `${element.type} is missing required prop "${name}"`
+      });
+    }
+  }
+  const renders = catalog2.renders ?? {};
+  const renderingOf = (type) => hasOwnProp(renders, type) ? renders[type] : void 0;
+  for (const [key, element] of Object.entries(spec.elements)) {
+    const panelled = renderingOf(element.type)?.panels;
+    if (!panelled) continue;
+    const props = element.props ?? {};
+    const listed = props[panelled.prop];
+    if (!Array.isArray(listed)) continue;
+    const panels = listed.length;
+    const children = element.children?.length ?? 0;
+    if (children !== panels) {
+      problems.push({
+        elementKey: key,
+        message: `${element.type} declares ${panels} panel${panels === 1 ? "" : "s"} but has ${children} child${children === 1 ? "" : "ren"}: exactly one child per ${panelled.noun}, in order.`
+      });
+    }
+    const runs = (element.children ?? []).filter(
+      (child) => spec.elements[child]?.type === "Button"
+    );
+    if (runs.length > 0) {
+      problems.push({
+        elementKey: key,
+        message: `${element.type} has a Button as a direct child; a panel is a container (a Stack), and the Button belongs inside the last one.`
+      });
+    }
+  }
+  const present2 = (value) => value !== void 0 && value !== null && value !== "";
+  const levels = [];
+  const onlyOnce = /* @__PURE__ */ new Map();
+  const seen = /* @__PURE__ */ new Set();
+  const walk = (key) => {
+    if (seen.has(key)) return;
+    seen.add(key);
+    const element = spec.elements[key];
+    if (!element) return;
+    const props = element.props ?? {};
+    const rendering = renderingOf(element.type);
+    if (element.type === "Heading") {
+      const level = String(props.level ?? "h2");
+      const match = /^h([1-4])$/.exec(level);
+      if (match) levels.push({ key, type: "Heading", level: Number(match[1]) });
+    } else if (rendering?.heading) {
+      const rendered = rendering.heading;
+      const has = rendered.when === void 0 || present2(props[rendered.when]);
+      if (has) levels.push({ key, type: element.type, level: rendered.level });
+    }
+    if (rendering?.once !== void 0) {
+      const entry = onlyOnce.get(element.type) ?? { reason: rendering.once, keys: [] };
+      entry.keys.push(key);
+      onlyOnce.set(element.type, entry);
+    }
+    for (const child of element.children ?? []) walk(child);
+    for (const slot of Object.values(element.slots ?? {})) for (const child of slot) walk(child);
+  };
+  if (spec.root) walk(spec.root);
+  const describe2 = (heading) => heading.type === "Heading" ? `h${heading.level}` : `${heading.type}'s h${heading.level}`;
+  let previous;
+  for (const heading of levels) {
+    if (previous !== void 0 && heading.level > previous.level + 1) {
+      problems.push({
+        elementKey: heading.key,
+        message: `${describe2(heading)} jumps after ${describe2(previous)}: heading levels increase by one, never by more.`
+      });
+    }
+    previous = heading;
+  }
+  const firsts = levels.filter((heading) => heading.level === 1);
+  const h1Ways = [
+    ...known.has("Heading") ? ["as a Heading at level h1"] : [],
+    ...Object.entries(renders).filter(([, rendering]) => rendering.heading?.level === 1).map(([type]) => `as the heading a ${type} renders`)
+  ];
+  if (firsts.length === 0 && spec.root && h1Ways.length > 0) {
+    problems.push({
+      elementKey: spec.root,
+      message: `the page has no h1: exactly one, ${h1Ways.join(" or ")}.`
+    });
+  }
+  for (const extra of firsts.slice(1)) {
+    problems.push({
+      elementKey: extra.key,
+      message: `a second h1 (${describe2(extra)}, after ${describe2(firsts[0])} at [${firsts[0].key}]): exactly one on a page.`
+    });
+  }
+  for (const [type, { reason, keys }] of onlyOnce) {
+    for (const extra of keys.slice(1)) {
+      problems.push({
+        elementKey: extra,
+        message: `a second ${type} (after [${keys[0]}]): at most one on a page, since it renders as ${reason}.`
+      });
+    }
+  }
+  for (const [key, element] of Object.entries(spec.elements)) {
+    const rule = renderingOf(element.type)?.children;
+    if (!rule) continue;
+    const children = element.children?.length ?? 0;
+    if (children !== rule.count) {
+      problems.push({
+        elementKey: key,
+        message: `${element.type} takes exactly ${rule.count} children (${rule.roles}); this one has ${children}.`
+      });
+    }
+  }
+  const declared = [
+    ...catalog2.actionNames ?? [],
+    ...(catalog2.schema?.builtInActions ?? []).map((action) => action.name)
+  ];
+  const knownActions = declared.length > 0 ? new Set(declared) : void 0;
+  const STATE_WRITES = {
+    setState: [{ param: "statePath" }],
+    pushState: [{ param: "statePath" }, { param: "clearStatePath", optional: true }],
+    removeState: [{ param: "statePath" }],
+    validateForm: [{ param: "statePath", optional: true }]
+  };
+  const OWNED_ROOTS = [INPUTS_ROOT, RESULT_ROOT];
+  const ownedRootOf = (written) => {
+    const statePath = written.startsWith("/") ? written : `/${written}`;
+    return OWNED_ROOTS.find((root) => statePath === root || statePath.startsWith(`${root}/`));
+  };
+  const bindingsOf = (binding) => Array.isArray(binding) ? binding : [binding];
+  const refusal = (owned, statePath) => `a layout may not write into ${owned}, which the host fills. Bind the value with { "$bindState": "${statePath}" } or delegate it with MthdsField instead.`;
+  const checkBinding = (key, site, entry) => {
+    const action = entry?.action;
+    if (typeof action !== "string") {
+      problems.push({ elementKey: key, message: `${site} has an entry with no "action" name.` });
+      return;
+    }
+    if (knownActions && !knownActions.has(action)) {
+      problems.push({
+        elementKey: key,
+        message: `${site} names the unknown action "${action}" (known: ${[...knownActions].join(", ")}); nothing would handle it.`
+      });
+      return;
+    }
+    const writes = hasOwnProp(STATE_WRITES, action) ? STATE_WRITES[action] : void 0;
+    if (writes) {
+      const params = entry.params;
+      for (const { param, optional } of writes) {
+        const written = typeof params === "object" && params !== null ? params[param] : void 0;
+        if (written === void 0 || written === null) {
+          if (!optional) {
+            problems.push({
+              elementKey: key,
+              message: `${site} calls ${action} without a literal "${param}".`
+            });
+          }
+          continue;
+        }
+        if (typeof written !== "string") {
+          problems.push({
+            elementKey: key,
+            message: `${site} calls ${action} with a "${param}" that is not a literal string; where an action writes must be named, never computed.`
+          });
+          continue;
+        }
+        const owned = ownedRootOf(written);
+        if (owned) {
+          const where = param === "statePath" ? `on "${written}"` : `with ${param} "${written}"`;
+          problems.push({
+            elementKey: key,
+            message: `${site} calls ${action} ${where}: ${refusal(owned, written.startsWith("/") ? written : `/${written}`)}`
+          });
+        }
+      }
+    }
+    for (const hook of ["onSuccess", "onError"]) {
+      const follow = entry[hook];
+      if (follow === void 0 || follow === null) continue;
+      const hookSite = `${site}.${hook}`;
+      if (typeof follow !== "object" || Array.isArray(follow)) {
+        problems.push({
+          elementKey: key,
+          message: `${hookSite} must be an object: a { "set" } of state paths to values, or an { "action" } binding.`
+        });
+        continue;
+      }
+      const record = follow;
+      if (record.set !== void 0 && record.set !== null) {
+        if (typeof record.set !== "object" || Array.isArray(record.set)) {
+          problems.push({
+            elementKey: key,
+            message: `${hookSite}.set must be an object mapping a state path to its value.`
+          });
+        } else {
+          for (const written of Object.keys(record.set)) {
+            const owned = ownedRootOf(written);
+            if (owned) {
+              problems.push({
+                elementKey: key,
+                message: `${hookSite} sets "${written}": ${refusal(owned, written.startsWith("/") ? written : `/${written}`)}`
+              });
+            }
+          }
+        }
+      }
+      if (record.action !== void 0) checkBinding(key, hookSite, record);
+    }
+  };
+  for (const [key, element] of Object.entries(spec.elements)) {
+    const on = element.on;
+    if (on !== void 0 && on !== null) {
+      if (typeof on !== "object" || Array.isArray(on)) {
+        problems.push({
+          elementKey: key,
+          message: '"on" must be an object mapping an event name to its actions.'
+        });
+      } else {
+        const emitted = eventsOf(catalog2, element.type);
+        for (const [event, binding] of Object.entries(on)) {
+          if (emitted && !emitted.includes(event)) {
+            problems.push({
+              elementKey: key,
+              message: emitted.length > 0 ? `on.${event}: ${element.type} never emits "${event}" (it emits: ${emitted.join(", ")}), so nothing bound there would ever fire.` : `on.${event}: ${element.type} emits no events, so nothing bound there would ever fire.`
+            });
+          }
+          for (const entry of bindingsOf(binding)) checkBinding(key, `on.${event}`, entry);
+        }
+      }
+    }
+    const watch = element.watch;
+    if (watch !== void 0 && watch !== null) {
+      if (typeof watch !== "object" || Array.isArray(watch)) {
+        problems.push({
+          elementKey: key,
+          message: '"watch" must be an object mapping a state path to the actions its change fires.'
+        });
+      } else {
+        for (const [path, binding] of Object.entries(watch)) {
+          for (const entry of bindingsOf(binding)) checkBinding(key, `watch.${path}`, entry);
+        }
+      }
+    }
+  }
+  return { ok: problems.length === 0, problems };
+}
+function formatProblems(problems) {
+  return problems.map(
+    (problem) => problem.elementKey ? `[${problem.elementKey}] ${problem.message}` : problem.message
+  ).join("\n");
+}
+
+// src/generative/layout-fits.ts
+function isUnder(root, path) {
+  return path === root || path.startsWith(`${root}/`);
+}
+function itemPathResolver(spec, key, parents) {
+  let base;
+  let resolvedBase = false;
+  return (field) => {
+    if (!resolvedBase) {
+      base = repeatBasePathOf(spec, key, parents);
+      resolvedBase = true;
+    }
+    if (base === void 0) return void 0;
+    const under = field.startsWith("/") ? field.slice(1) : field;
+    return under === "" ? base : `${base}/${under}`;
+  };
+}
+function interpolatedPaths(template, itemPath) {
+  return [...template.matchAll(/\$\{([^}]+)\}/g)].flatMap((match) => {
+    const raw = match[1];
+    if (raw === void 0) return [];
+    if (raw.startsWith("/")) return [raw];
+    return [itemPath(raw) ?? `/${raw}`];
+  });
+}
+function mentionedPaths(spec, parents) {
+  const found = { bound: [], read: [], adrift: [] };
+  for (const [key, element] of Object.entries(spec.elements)) {
+    const itemPath = itemPathResolver(spec, key, parents);
+    const walk = (value) => {
+      if (Array.isArray(value)) {
+        value.forEach(walk);
+        return;
+      }
+      if (typeof value !== "object" || value === null) return;
+      const record = value;
+      if (typeof record.$bindState === "string") found.bound.push(record.$bindState);
+      if (typeof record.$state === "string") found.read.push(record.$state);
+      if (typeof record.$template === "string") {
+        found.read.push(...interpolatedPaths(record.$template, itemPath));
+      }
+      if (typeof record.$bindItem === "string") {
+        const path = itemPath(record.$bindItem);
+        if (path === void 0) found.adrift.push(key);
+        else found.bound.push(path);
+      }
+      if (typeof record.$item === "string") {
+        const path = itemPath(record.$item);
+        if (path === void 0) found.adrift.push(key);
+        else found.read.push(path);
+      }
+      Object.values(record).forEach(walk);
+    };
+    walk(element.props);
+    walk(element.visible);
+  }
+  return found;
+}
+function staleReads(read, root, resolves) {
+  const under = read.filter((path) => isUnder(root, path));
+  return [...new Set(under)].filter((path) => !resolves(path));
+}
+function staleRepeats(spec, parents, root, resolves, side) {
+  const problems = [];
+  for (const [key, element] of Object.entries(spec.elements)) {
+    if (!element.repeat) continue;
+    const listPath = repeatListPathOf(spec, key, parents);
+    if (listPath === void 0 || !isUnder(root, listPath)) continue;
+    if (!resolves(listPath)) {
+      problems.push(`${key}: repeats over ${listPath}, which no ${side} has`);
+    }
+  }
+  return problems;
+}
+var NOT_A_VALUE = {
+  object: { what: "a structure", instead: "a structure is shown through its members" },
+  list: { what: "a list", instead: "a list is laid out as a repeat or a DataTable" },
+  document: { what: "a file", instead: "a file is delegated to the kernel's own control" },
+  image: { what: "a file", instead: "a file is delegated to the kernel's own control" }
+};
+var NOT_VALUES = {
+  object: "structures",
+  list: "lists",
+  document: "files",
+  image: "files"
+};
+var listPropsCache;
+function listProps() {
+  if (listPropsCache) return listPropsCache;
+  const found = /* @__PURE__ */ new Map([
+    ["DataTable", /* @__PURE__ */ new Map([["rows", "anything"]])]
+  ]);
+  const components3 = catalog.data.components;
+  for (const [type, definition] of Object.entries(components3)) {
+    const shape = definition.props?.shape;
+    for (const [prop, schema] of Object.entries(shape ?? {})) {
+      const items = listItemsOf(schema);
+      if (items === void 0) continue;
+      if (!found.has(type)) found.set(type, /* @__PURE__ */ new Map());
+      found.get(type).set(prop, items);
+    }
+  }
+  listPropsCache = found;
+  return found;
+}
+var VALUE_SCHEMAS = /* @__PURE__ */ new Set(["string", "number", "boolean", "enum", "literal"]);
+function unwrapped(schema) {
+  let current = schema;
+  for (let depth = 0; depth < 8; depth += 1) {
+    const def = current.def;
+    if (!def) return void 0;
+    if (def.innerType === void 0) return def;
+    current = def.innerType;
+  }
+  return void 0;
+}
+function listItemsOf(schema) {
+  const def = unwrapped(schema);
+  if (def?.type !== "array") return void 0;
+  const element = unwrapped(def.element);
+  return element?.type !== void 0 && VALUE_SCHEMAS.has(element.type) ? "values" : "anything";
+}
+function nonScalarReads(spec, parents, root, fieldAt) {
+  const problems = [];
+  const lists = listProps();
+  for (const [key, element] of Object.entries(spec.elements)) {
+    const itemPath = itemPathResolver(spec, key, parents);
+    const listy = lists.get(element.type);
+    const check = (prop, path) => {
+      if (!isUnder(root, path)) return;
+      const field = fieldAt(path);
+      if (!field) return;
+      const wrong = hasOwnProp(NOT_A_VALUE, field.kind) ? NOT_A_VALUE[field.kind] : void 0;
+      if (!wrong) return;
+      problems.push(
+        `${key}: ${prop} shows ${path}, which is ${wrong.what} and not a value; a prop that shows a value takes a scalar path, and ${wrong.instead}`
+      );
+    };
+    const checkList = (prop, path, items) => {
+      if (!isUnder(root, path)) return;
+      const field = fieldAt(path);
+      if (!field || field.kind === "unknown") return;
+      if (field.kind !== "list") {
+        const what = hasOwnProp(NOT_A_VALUE, field.kind) ? NOT_A_VALUE[field.kind].what : "a value";
+        problems.push(
+          `${key}: ${prop} takes a list, and ${path} is ${what}; a prop that takes a list reads a list path`
+        );
+        return;
+      }
+      if (items !== "values") return;
+      const of = hasOwnProp(NOT_VALUES, field.item.kind) ? NOT_VALUES[field.item.kind] : void 0;
+      if (!of) return;
+      problems.push(
+        `${key}: ${prop} takes a list of values, and ${path} is a list of ${of}; a list of ${of} is laid out as a repeat or a DataTable`
+      );
+    };
+    const walk = (prop, value) => {
+      if (Array.isArray(value)) {
+        value.forEach((entry) => walk(prop, entry));
+        return;
+      }
+      if (typeof value !== "object" || value === null) return;
+      const record = value;
+      if (typeof record.$state === "string") check(prop, record.$state);
+      if (typeof record.$item === "string") {
+        const path = itemPath(record.$item);
+        if (path !== void 0) check(prop, path);
+      }
+      if (typeof record.$template === "string") {
+        for (const path of interpolatedPaths(record.$template, itemPath)) check(prop, path);
+      }
+      for (const [name, entry] of Object.entries(record)) {
+        if (name !== "$cond") walk(prop, entry);
+      }
+    };
+    for (const [prop, value] of Object.entries(element.props ?? {})) {
+      const items = listy?.get(prop);
+      if (items === void 0 || Array.isArray(value)) {
+        walk(prop, value);
+        continue;
+      }
+      if (typeof value !== "object" || value === null) continue;
+      const record = value;
+      if (typeof record.$state === "string") checkList(prop, record.$state, items);
+      if (typeof record.$item === "string") {
+        const path = itemPath(record.$item);
+        if (path !== void 0) checkList(prop, path, items);
+      }
+    }
+  }
+  return problems;
+}
+function boundProblems(bound, inputs) {
+  const problems = [];
+  const underInputs = bound.filter((path) => isUnder(INPUTS_ROOT, path));
+  if (!inputs) {
+    if (underInputs.length > 0) {
+      problems.push(`a result page binds ${underInputs.join(", ")}; a result page writes nothing`);
+    }
+  } else {
+    for (const path of underInputs) {
+      if (!inputFieldAtPath(inputs, path)) {
+        problems.push(`${path} is bound, and no input has it`);
+      }
+    }
+  }
+  for (const path of bound) {
+    if (isUnder(RESULT_ROOT, path)) {
+      problems.push(
+        `${path} is bound; a layout may not write into ${RESULT_ROOT}, which the run fills`
+      );
+    }
+  }
+  return problems;
+}
+function repeatPaths(spec) {
+  const found = [];
+  for (const element of Object.values(spec.elements)) {
+    const statePath = element.repeat?.statePath;
+    if (typeof statePath === "string") found.push(statePath);
+  }
+  return found;
+}
+function isOffered(path, offered) {
+  if (offered.bound.has(path) || offered.repeated.has(path)) return true;
+  return offered.delegated.some((at) => path === at || path.startsWith(`${at}/`));
+}
+function uncoveredUnder(field, path, offered) {
+  if (isOffered(path, offered)) return [];
+  if (field.kind === "object") {
+    return field.fields.filter((child) => child.required).flatMap((child) => uncoveredUnder(child, joinPath(path, child.name), offered));
+  }
+  return [path];
+}
+function layoutProblems(descriptor, spec) {
+  try {
+    return collectLayoutProblems(descriptor, spec);
+  } catch (error) {
+    return [`the layout is not a well-formed spec: ${String(error)}`];
+  }
+}
+function collectLayoutProblems(descriptor, spec) {
+  const problems = [];
+  const delegated = [];
+  const parents = parentMapOf(spec);
+  for (const [key, element] of Object.entries(spec.elements)) {
+    const written = element.props?.path;
+    const path = typeof written === "string" ? absoluteHatchPath(spec, key, written, parents) : void 0;
+    if (element.type === "MthdsField") {
+      if (!path || !inputFieldAtPath(descriptor.inputs ?? [], path)) {
+        problems.push(`${key}: MthdsField delegates ${String(written)}, which no input has`);
+      } else {
+        delegated.push(path);
+      }
+    }
+    if (element.type === "MthdsResult") {
+      if (!path || !descriptor.result || !resultFieldAtPath(descriptor.result, path)) {
+        problems.push(`${key}: MthdsResult delegates ${String(written)}, which no result has`);
+      }
+    }
+  }
+  const { bound, read, adrift } = mentionedPaths(spec, parents);
+  for (const key of new Set(adrift)) {
+    problems.push(`${key}: reads the current item, and no repeat above it has one`);
+  }
+  problems.push(...boundProblems(bound, descriptor.inputs));
+  if (!descriptor.inputs) {
+    const result = descriptor.result;
+    const fieldAt2 = (path) => result ? resultFieldAtPath(result, path) : void 0;
+    const resolves2 = (path) => fieldAt2(path) !== void 0;
+    problems.push(...staleRepeats(spec, parents, RESULT_ROOT, resolves2, "result"));
+    for (const path of staleReads(read, RESULT_ROOT, resolves2)) {
+      problems.push(`${path} is read, and no result has it`);
+    }
+    problems.push(...nonScalarReads(spec, parents, RESULT_ROOT, fieldAt2));
+    return problems;
+  }
+  const inputs = descriptor.inputs;
+  const fieldAt = (path) => inputFieldAtPath(inputs, path);
+  const resolves = (path) => fieldAt(path) !== void 0;
+  problems.push(...staleRepeats(spec, parents, INPUTS_ROOT, resolves, "input"));
+  for (const path of staleReads(read, INPUTS_ROOT, resolves)) {
+    problems.push(`${path} is read, and no input has it`);
+  }
+  problems.push(...nonScalarReads(spec, parents, INPUTS_ROOT, fieldAt));
+  const offered = {
+    bound: new Set(bound),
+    repeated: new Set(repeatPaths(spec)),
+    delegated
+  };
+  for (const field of inputs) {
+    if (!field.required) continue;
+    for (const path of uncoveredUnder(field, joinPath(INPUTS_ROOT, field.name), offered)) {
+      problems.push(`${path} is required, and the layout offers nowhere to enter it`);
+    }
+  }
+  return problems;
+}
+function layoutFits(descriptor, spec) {
+  return layoutProblems(descriptor, spec).length === 0;
+}
+function specToJsonl(spec) {
+  const lines = [];
+  const push = (op, path, value) => lines.push(JSON.stringify({ op, path, value }));
+  push("add", "/root", spec.root);
+  const emitted = /* @__PURE__ */ new Set();
+  const queue = [spec.root];
+  while (queue.length > 0) {
+    const key = queue.shift();
+    if (emitted.has(key)) continue;
+    const element = spec.elements[key];
+    if (!element) continue;
+    emitted.add(key);
+    push("add", `/elements/${escapeSegment(key)}`, element);
+    for (const child of element.children ?? []) queue.push(child);
+    for (const slotChildren of Object.values(element.slots ?? {})) queue.push(...slotChildren);
+  }
+  for (const key of Object.keys(spec.elements)) {
+    if (!emitted.has(key)) push("add", `/elements/${escapeSegment(key)}`, spec.elements[key]);
+  }
+  for (const [key, value] of Object.entries(spec.state ?? {})) {
+    push("add", `/state/${escapeSegment(key)}`, value);
+  }
+  return `${lines.join("\n")}
+`;
+}
+var FORBIDDEN_SEGMENTS = /* @__PURE__ */ new Set(["__proto__", "constructor", "prototype"]);
+function pointerReachesPrototype(pointer) {
+  return typeof pointer === "string" && pointer.split("/").some((segment) => FORBIDDEN_SEGMENTS.has(unescapeSegment(segment)));
+}
+function reachesPrototype(line) {
+  let parsed;
+  try {
+    parsed = JSON.parse(line);
+  } catch {
+    return false;
+  }
+  const patch = parsed;
+  return pointerReachesPrototype(patch?.path) || pointerReachesPrototype(patch?.from);
+}
+function specFromJsonl(jsonl) {
+  let spec = { root: "", elements: {} };
+  for (const line of jsonl.split("\n")) {
+    if (reachesPrototype(line)) continue;
+    try {
+      spec = compileSpecStream(line, spec);
+    } catch {
+      continue;
+    }
+  }
+  return spec;
+}
+function jsonlLines(jsonl) {
+  return jsonl.split("\n").filter((line) => line.trim().length > 0);
+}
+var BrandContext = React3.createContext(null);
+function BrandProvider({
+  manifest,
+  children
+}) {
+  useWebfont(manifest.webfont);
+  return /* @__PURE__ */ jsx(BrandContext.Provider, { value: manifest, children });
+}
+function useBrand() {
+  const manifest = React3.useContext(BrandContext);
+  if (!manifest)
+    throw new Error(
+      "useBrand: no brand in scope. Pass `brand` to GenerativePage, or wrap the tree in BrandProvider."
+    );
+  return manifest;
+}
+var WEIGHTS = "400;500;600;700";
+function useWebfont(webfont) {
+  const provider = webfont?.provider;
+  const family = webfont?.family;
+  React3.useEffect(() => {
+    if (!provider || !family) return;
+    const key = `${provider}:${family}`;
+    if (document.head.querySelector(`link[data-brand-webfont="${CSS.escape(key)}"]`)) return;
+    for (const origin of ["https://fonts.googleapis.com", "https://fonts.gstatic.com"]) {
+      if (document.head.querySelector(`link[rel="preconnect"][href="${origin}"]`)) continue;
+      const preconnect = document.createElement("link");
+      preconnect.rel = "preconnect";
+      preconnect.href = origin;
+      if (origin.endsWith("gstatic.com")) preconnect.crossOrigin = "anonymous";
+      document.head.appendChild(preconnect);
+    }
+    const link = document.createElement("link");
+    link.rel = "stylesheet";
+    const encoded = encodeURIComponent(family).replace(/%20/g, "+");
+    link.href = `https://fonts.googleapis.com/css2?family=${encoded}:wght@${WEIGHTS}&display=swap`;
+    link.dataset.brandWebfont = key;
+    document.head.appendChild(link);
+  }, [provider, family]);
+}
+function useBoundField(literal, binding, empty, { checks, validateOn }) {
+  const [boundValue, setBoundValue] = useBoundProp(literal ?? void 0, binding);
+  const [localValue, setLocalValue] = React3.useState(literal ?? empty);
+  const isBound = Boolean(binding);
+  const hasValidation = Boolean(binding && checks?.length);
+  const when = validateOn ?? "change";
+  const { errors, validate } = useFieldValidation(
+    binding ?? "",
+    hasValidation ? { checks: checks ?? [], validateOn: when } : void 0
+  );
+  return {
+    value: isBound ? boundValue ?? empty : localValue,
+    setValue: (next) => {
+      if (isBound) setBoundValue(next);
+      else setLocalValue(next);
+    },
+    error: errors[0],
+    validateOnChange: () => {
+      if (hasValidation && when === "change") validate();
+    },
+    validateOnBlur: () => {
+      if (hasValidation && when === "blur") validate();
+    }
+  };
+}
+var LABEL = "block text-sm leading-none font-medium";
+function FieldError({ message }) {
+  return message ? /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: message }) : null;
+}
+function pickKey(table, key, fallback) {
+  return key != null && hasOwnProp(table, key) ? key : fallback;
+}
+function pick(table, key, fallback) {
+  return table[pickKey(table, key, fallback)];
+}
+function Card({
+  props,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-border bg-card p-6 text-card-foreground", children: [
+    props.title || props.description ? /* @__PURE__ */ jsxs("div", { className: "mb-4 space-y-1.5", children: [
+      props.title ? /* @__PURE__ */ jsx("h3", { className: "text-lg leading-none font-semibold", children: props.title }) : null,
+      props.description ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: props.description }) : null
+    ] }) : null,
+    children
+  ] });
+}
+var GAP = {
+  none: "gap-0",
+  sm: "gap-2",
+  md: "gap-4",
+  lg: "gap-6",
+  xl: "gap-8"
+};
+var ALIGN = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch"
+};
+var JUSTIFY = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between",
+  around: "justify-around"
+};
+function Stack({
+  props,
+  children
+}) {
+  const horizontal = props.direction === "horizontal";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "flex",
+        horizontal ? "flex-row" : "flex-col",
+        pick(GAP, props.gap, "md"),
+        pick(ALIGN, props.align, horizontal ? "start" : "stretch"),
+        props.justify ? pick(JUSTIFY, props.justify, "start") : void 0
+      ),
+      children
+    }
+  );
+}
+var COLUMNS = {
+  1: "grid-cols-1",
+  2: "sm:grid-cols-2",
+  3: "sm:grid-cols-2 lg:grid-cols-3",
+  4: "sm:grid-cols-2 lg:grid-cols-4",
+  5: "sm:grid-cols-2 lg:grid-cols-5",
+  6: "sm:grid-cols-2 lg:grid-cols-6"
+};
+function Grid({
+  props,
+  children
+}) {
+  const columns = Math.min(Math.max(Math.round(props.columns ?? 2), 1), 6);
+  return /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-1", COLUMNS[columns], pick(GAP, props.gap, "md")), children });
+}
+function Separator({
+  props
+}) {
+  const vertical = props.orientation === "vertical";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "separator",
+      "aria-orientation": vertical ? "vertical" : "horizontal",
+      className: cn("shrink-0 bg-border", vertical ? "h-full w-px" : "h-px w-full")
+    }
+  );
+}
+function Collapsible({
+  props,
+  children
+}) {
+  return /* @__PURE__ */ jsxs(
+    "details",
+    {
+      className: "rounded-md border border-border",
+      open: props.defaultOpen ?? false,
+      "data-slot": "collapsible",
+      children: [
+        /* @__PURE__ */ jsx("summary", { className: "cursor-pointer list-none px-4 py-3 text-sm font-medium select-none", children: props.title }),
+        /* @__PURE__ */ jsx("div", { className: "border-t border-border px-4 py-3", children })
+      ]
+    }
+  );
+}
+var HEADING = {
+  h1: "text-3xl font-bold tracking-tight",
+  h2: "text-2xl font-semibold tracking-tight",
+  h3: "text-lg font-semibold",
+  h4: "text-base font-semibold"
+};
+function Heading({
+  props
+}) {
+  const Tag2 = pickKey(HEADING, props.level, "h2");
+  return /* @__PURE__ */ jsx(Tag2, { className: cn("text-foreground", HEADING[Tag2]), children: props.text });
+}
+var TEXT = {
+  body: "text-sm text-foreground",
+  caption: "text-xs text-muted-foreground",
+  muted: "text-sm text-muted-foreground",
+  lead: "text-lg text-muted-foreground",
+  code: "font-mono text-[13px] text-foreground"
+};
+function Text({
+  props
+}) {
+  return /* @__PURE__ */ jsx("p", { className: pick(TEXT, props.variant, "body"), children: props.text });
+}
+var AVATAR_SIZE = {
+  sm: "size-8 text-[11px]",
+  md: "size-10 text-xs",
+  lg: "size-12 text-sm"
+};
+function initialsOf(name) {
+  const words = name.trim().split(/\s+/).filter(Boolean);
+  if (words.length === 0) return "?";
+  const first = words[0]?.[0] ?? "";
+  const last = words.length > 1 ? words[words.length - 1]?.[0] ?? "" : "";
+  return (first + last).toUpperCase();
+}
+function Avatar({
+  props
+}) {
+  const name = String(props.name ?? "");
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "inline-flex shrink-0 items-center justify-center rounded-full bg-muted font-medium text-muted-foreground",
+        pick(AVATAR_SIZE, props.size, "md")
+      ),
+      "aria-label": name || void 0,
+      role: "img",
+      children: initialsOf(name)
+    }
+  );
+}
+var BADGE = {
+  default: "bg-primary text-primary-foreground",
+  secondary: "bg-secondary text-secondary-foreground",
+  destructive: "bg-destructive text-white",
+  outline: "border border-border text-foreground"
+};
+function Badge({
+  props
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "inline-flex w-fit items-center rounded-md px-2 py-0.5 text-xs font-medium",
+        pick(BADGE, props.variant, "default")
+      ),
+      children: props.text
+    }
+  );
+}
+var ALERT = {
+  info: "border-border bg-muted text-foreground",
+  success: "border-border bg-muted text-foreground",
+  warning: "border-border bg-muted text-foreground",
+  error: "border-destructive/50 bg-destructive/10 text-foreground"
+};
+function Alert({
+  props
+}) {
+  const type = pickKey(ALERT, props.type, "info");
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: type === "error" ? "alert" : "status",
+      className: cn("rounded-md border px-4 py-3 text-sm", ALERT[type]),
+      children: [
+        /* @__PURE__ */ jsx("p", { className: "font-medium", children: props.title }),
+        props.message ? /* @__PURE__ */ jsx("p", { className: "mt-1 text-muted-foreground", children: props.message }) : null
+      ]
+    }
+  );
+}
+function Progress({
+  props
+}) {
+  const max = props.max ?? 100;
+  const value = Math.min(Math.max(Number(props.value) || 0, 0), max);
+  const percent = max > 0 ? value / max * 100 : 0;
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+    props.label ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: props.label }) : null,
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "progressbar",
+        "aria-valuenow": value,
+        "aria-valuemin": 0,
+        "aria-valuemax": max,
+        "aria-label": props.label ?? void 0,
+        className: "h-2 w-full overflow-hidden rounded-full bg-muted",
+        children: /* @__PURE__ */ jsx("div", { className: "h-full bg-primary transition-all", style: { width: `${percent}%` } })
+      }
+    )
+  ] });
+}
+function useControlId(name) {
+  return `jr-${name}-${React3.useId()}`;
+}
+function Input({
+  props,
+  bindings,
+  emit
+}) {
+  const id = useControlId(props.name);
+  const field = useBoundField(props.value, bindings?.value, "", props);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("label", { htmlFor: id, className: LABEL, children: props.label }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        id,
+        name: props.name,
+        type: props.type ?? "text",
+        className: cn(fieldControlClass, "min-h-11 px-3 py-2"),
+        placeholder: props.placeholder ?? void 0,
+        value: field.value,
+        "aria-invalid": field.error ? true : void 0,
+        onChange: (event) => {
+          field.setValue(event.target.value);
+          field.validateOnChange();
+        },
+        onFocus: () => emit("focus"),
+        onBlur: () => {
+          field.validateOnBlur();
+          emit("blur");
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx(FieldError, { message: field.error })
+  ] });
+}
+function Textarea({
+  props,
+  bindings
+}) {
+  const id = useControlId(props.name);
+  const field = useBoundField(props.value, bindings?.value, "", props);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("label", { htmlFor: id, className: LABEL, children: props.label }),
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        id,
+        name: props.name,
+        rows: props.rows ?? 4,
+        className: cn(fieldControlClass, "px-3 py-2"),
+        placeholder: props.placeholder ?? void 0,
+        value: field.value,
+        "aria-invalid": field.error ? true : void 0,
+        onChange: (event) => {
+          field.setValue(event.target.value);
+          field.validateOnChange();
+        },
+        onBlur: field.validateOnBlur
+      }
+    ),
+    /* @__PURE__ */ jsx(FieldError, { message: field.error })
+  ] });
+}
+function Radio({
+  props,
+  bindings,
+  emit
+}) {
+  const id = useControlId(props.name);
+  const field = useBoundField(props.value, bindings?.value, "", props);
+  return /* @__PURE__ */ jsxs("fieldset", { className: "space-y-2", "aria-invalid": field.error ? true : void 0, children: [
+    /* @__PURE__ */ jsx("legend", { className: LABEL, children: props.label }),
+    /* @__PURE__ */ jsx("div", { className: "space-y-2", children: (props.options ?? []).map((option, index) => /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "radio",
+          name: id,
+          value: option,
+          checked: field.value === option,
+          className: "size-4 accent-primary",
+          onChange: () => {
+            field.setValue(option);
+            field.validateOnChange();
+            emit("change");
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { children: option })
+    ] }, `${index}-${option}`)) }),
+    /* @__PURE__ */ jsx(FieldError, { message: field.error })
+  ] });
+}
+function Checkbox({
+  props,
+  bindings,
+  emit
+}) {
+  const id = useControlId(props.name);
+  const field = useBoundField(props.checked, bindings?.checked, false, props);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "flex items-center gap-2 text-sm", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          id,
+          name: props.name,
+          type: "checkbox",
+          className: "size-4 accent-primary",
+          checked: field.value,
+          "aria-invalid": field.error ? true : void 0,
+          onChange: (event) => {
+            field.setValue(event.target.checked);
+            field.validateOnChange();
+            emit("change");
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { children: props.label })
+    ] }),
+    /* @__PURE__ */ jsx(FieldError, { message: field.error })
+  ] });
+}
+function Switch2({
+  props,
+  bindings,
+  emit
+}) {
+  const id = useControlId(props.name);
+  const field = useBoundField(props.checked, bindings?.checked, false, props);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsx(
+        Switch,
+        {
+          id,
+          name: props.name,
+          checked: field.value,
+          "aria-invalid": field.error ? true : void 0,
+          onCheckedChange: (next) => {
+            field.setValue(next);
+            field.validateOnChange();
+            emit("change");
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx("label", { htmlFor: id, className: "text-sm", children: props.label })
+    ] }),
+    /* @__PURE__ */ jsx(FieldError, { message: field.error })
+  ] });
+}
+var BUTTON = {
+  primary: "bg-primary text-primary-foreground hover:bg-primary/90",
+  secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+  danger: "bg-destructive text-white hover:bg-destructive/90"
+};
+function Button({
+  props,
+  emit
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      disabled: props.disabled ?? false,
+      className: cn(
+        "inline-flex min-h-11 w-fit items-center justify-center rounded-md px-4 py-2 text-sm font-medium transition-colors",
+        "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+        "disabled:pointer-events-none disabled:opacity-50",
+        pick(BUTTON, props.variant, "primary")
+      ),
+      onClick: () => emit("press"),
+      children: props.label
+    }
+  );
+}
+var DescriptorContext = React3.createContext({});
+function useDescriptorScope() {
+  return React3.useContext(DescriptorContext);
+}
+function DescriptorProvider({
+  scope,
+  children
+}) {
+  return /* @__PURE__ */ jsx(DescriptorContext.Provider, { value: scope, children });
+}
+function Unresolved({ path, side }) {
+  return /* @__PURE__ */ jsxs(
+    "p",
+    {
+      role: "alert",
+      className: "rounded-md border border-destructive/50 px-2.5 py-1.5 text-[12px] text-destructive",
+      children: [
+        side === "input" ? "No input" : "No result",
+        " at ",
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: path })
+      ]
+    }
+  );
+}
+function encodeSegment(segment) {
+  return segment.replace(/_/g, "_u").replace(/-/g, "_d").replace(/~/g, "_t");
+}
+function decodeSegment(segment) {
+  return segment.replace(
+    /_([udt])/g,
+    (_match, code) => code === "u" ? "_" : code === "d" ? "-" : "~"
+  );
+}
+function domIdFor(prefix, path) {
+  return `${prefix ?? "gen"}${path.split("/").map(encodeSegment).join("-")}`;
+}
+function pathFromDomId(prefix, id) {
+  const head = prefix ?? "gen";
+  if (!id.startsWith(head)) return void 0;
+  const [own = "", ...children] = id.slice(head.length).split(".");
+  if (!own.startsWith("-")) return void 0;
+  const path = own.split("-").map(decodeSegment).join("/");
+  return `${path}${children.map((child) => `/${child}`).join("")}`;
+}
+function useAbsolutePath(path) {
+  const repeat = useRepeatScope();
+  if (path.startsWith("/")) return path;
+  return repeat ? `${repeat.basePath}/${path}` : void 0;
+}
+function MthdsField({ props }) {
+  const scope = React3.useContext(DescriptorContext);
+  const path = useAbsolutePath(props.path) ?? "";
+  const field = scope.inputs && path ? inputFieldAtPath(scope.inputs, path) : void 0;
+  const value = useStateValue(path);
+  const { set } = useStateStore();
+  const onChange = React3.useCallback((next) => set(path, next), [set, path]);
+  if (!field) return /* @__PURE__ */ jsx(Unresolved, { path: props.path, side: "input" });
+  return /* @__PURE__ */ jsx(
+    FieldRenderer,
+    {
+      field,
+      value,
+      onChange,
+      id: domIdFor(scope.idPrefix, path),
+      env: scope.env
+    }
+  );
+}
+function MthdsResult({ props }) {
+  const scope = React3.useContext(DescriptorContext);
+  const path = useAbsolutePath(props.path) ?? "";
+  const field = scope.result && path ? resultFieldAtPath(scope.result, path) : void 0;
+  const value = useStateValue(path);
+  if (!field) return /* @__PURE__ */ jsx(Unresolved, { path: props.path, side: "result" });
+  return /* @__PURE__ */ jsx(ResultField, { field, value, hideLabel: props.hideLabel ?? false });
+}
+function AccessibleSelect({ props, bindings, emit }) {
+  const [boundValue, setBoundValue] = useBoundProp(
+    props.value ?? void 0,
+    bindings?.value
+  );
+  const [localValue, setLocalValue] = React3.useState("");
+  const isBound = Boolean(bindings?.value);
+  const value = isBound ? boundValue ?? "" : localValue;
+  const setValue = isBound ? setBoundValue : setLocalValue;
+  const validateOn = props.validateOn ?? "change";
+  const hasValidation = Boolean(bindings?.value && props.checks?.length);
+  const { errors, validate } = useFieldValidation(
+    bindings?.value ?? "",
+    hasValidation ? { checks: props.checks ?? [], validateOn } : void 0
+  );
+  const id = useControlId(props.name);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("label", { htmlFor: id, className: "block text-sm leading-none font-medium", children: props.label }),
+    /* @__PURE__ */ jsxs(
+      Select,
+      {
+        value,
+        onValueChange: (next) => {
+          setValue(next);
+          if (hasValidation && validateOn === "change") validate();
+          emit("change");
+        },
+        children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { id, className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: props.placeholder ?? "Select..." }) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: (props.options ?? []).map((option, index) => /* @__PURE__ */ jsx(SelectItem, { value: option, children: option }, `${index}-${option}`)) })
+        ]
+      }
+    ),
+    errors.length > 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: errors[0] }) : null
+  ] });
+}
+function valueAt(row, relativePath) {
+  let current = row;
+  for (const segment of relativePath.split("/").filter((part) => part.length > 0)) {
+    if (typeof current !== "object" || current === null) return void 0;
+    current = current[segment];
+  }
+  return current;
+}
+var CELL_NUMBER = new Intl.NumberFormat("en-US", { maximumFractionDigits: 2 });
+function formatCell(value) {
+  if (value === null || value === void 0 || value === "") return "\u2014";
+  if (typeof value === "boolean") return value ? "yes" : "no";
+  if (typeof value === "number") return CELL_NUMBER.format(value);
+  if (typeof value === "string") return value;
+  if (Array.isArray(value)) return value.map(formatCell).join(", ");
+  return JSON.stringify(value);
+}
+function DataTable({ props }) {
+  const rows = Array.isArray(props.rows) ? props.rows : [];
+  const columns = props.columns ?? [];
+  return /* @__PURE__ */ jsx("div", { className: "overflow-x-auto rounded-md border border-border", children: /* @__PURE__ */ jsxs("table", { className: "w-full min-w-full border-collapse text-[13px]", children: [
+    props.caption ? /* @__PURE__ */ jsx("caption", { className: "px-2.5 py-1.5 text-start text-[12px] text-muted-foreground", children: props.caption }) : null,
+    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { className: "border-b border-border bg-muted", children: columns.map((column) => /* @__PURE__ */ jsx(
+      "th",
+      {
+        scope: "col",
+        className: "whitespace-nowrap px-2.5 py-1.5 text-start font-semibold text-foreground",
+        children: column.label
+      },
+      column.path
+    )) }) }),
+    /* @__PURE__ */ jsx("tbody", { children: rows.map((row, index) => /* @__PURE__ */ jsx("tr", { className: "border-b border-border/60 last:border-b-0", children: columns.map((column) => /* @__PURE__ */ jsx("td", { className: "px-2.5 py-1.5 align-top text-foreground", children: formatCell(valueAt(row, column.path)) }, column.path)) }, index)) })
+  ] }) });
+}
+function numberFormat(format) {
+  switch (format) {
+    case "integer":
+      return new Intl.NumberFormat("en-US", { maximumFractionDigits: 0 });
+    case "decimal":
+      return new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 });
+    case "compact":
+      return new Intl.NumberFormat("en-US", { notation: "compact", maximumFractionDigits: 1 });
+    case "plain":
+      return new Intl.NumberFormat("en-US", { maximumFractionDigits: 20, useGrouping: false });
+    default:
+      return format;
+  }
+}
+function Metric({ props }) {
+  const value = props.value;
+  const text = typeof value === "number" ? numberFormat(props.format ?? "plain").format(value) : value === null || value === void 0 || value === "" ? "\u2014" : String(value);
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-[11px] font-medium uppercase tracking-wider text-muted-foreground", children: props.label }),
+    /* @__PURE__ */ jsxs("span", { className: "text-2xl font-semibold tabular-nums text-foreground", children: [
+      text,
+      props.unit ? /* @__PURE__ */ jsx("span", { className: "ml-1 text-sm font-normal text-muted-foreground", children: props.unit }) : null
+    ] })
+  ] });
+}
+var SPLIT_COLUMNS = {
+  "1:1": "sm:grid-cols-[minmax(0,1fr)_minmax(0,1fr)]",
+  "1:2": "sm:grid-cols-[minmax(0,1fr)_minmax(0,2fr)]",
+  "2:1": "sm:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]"
+};
+var SPLIT_GAP = { md: "gap-4", lg: "gap-6", xl: "gap-8" };
+function Split({
+  props,
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "grid grid-cols-1 items-start",
+        pick(SPLIT_COLUMNS, props.ratio, "1:2"),
+        pick(SPLIT_GAP, props.gap, "lg")
+      ),
+      children
+    }
+  );
+}
+function Tabs({ props, children }) {
+  const tabs = props.tabs ?? [];
+  const panels = React3.Children.toArray(children);
+  const [value, setValue] = React3.useState(tabs[0]?.value ?? "");
+  return /* @__PURE__ */ jsxs(TabsPrimitive.Root, { value, onValueChange: setValue, className: "w-full", children: [
+    /* @__PURE__ */ jsx(TabsPrimitive.List, { className: "inline-flex h-10 items-center justify-start rounded-md bg-muted p-1 text-muted-foreground", children: tabs.map((tab) => /* @__PURE__ */ jsx(
+      TabsPrimitive.Trigger,
+      {
+        value: tab.value,
+        className: "inline-flex items-center justify-center rounded-sm px-3 py-1.5 text-sm font-medium whitespace-nowrap transition-all focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-hidden data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
+        children: tab.label
+      },
+      tab.value
+    )) }),
+    tabs.map((tab, index) => /* @__PURE__ */ jsx(
+      TabsPrimitive.Content,
+      {
+        value: tab.value,
+        className: "mt-4 focus-visible:outline-hidden",
+        children: panels[index] ?? null
+      },
+      tab.value
+    ))
+  ] });
+}
+var BUTTON_BASE = "inline-flex h-10 items-center justify-center rounded-md px-4 text-sm font-medium transition-colors focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50";
+var PRIMARY_BUTTON = cn(BUTTON_BASE, "bg-primary text-primary-foreground hover:bg-primary/90");
+var SECONDARY_BUTTON = cn(
+  BUTTON_BASE,
+  "border border-border bg-background text-foreground hover:bg-accent hover:text-accent-foreground"
+);
+function Steps({ props, children }) {
+  const steps = props.steps ?? [];
+  const panels = React3.Children.toArray(children);
+  const [index, setIndex] = React3.useState(0);
+  const last = steps.length - 1;
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
+    /* @__PURE__ */ jsx("ol", { className: "flex flex-wrap items-center gap-x-5 gap-y-2", children: steps.map((label, position) => /* @__PURE__ */ jsxs(
+      "li",
+      {
+        "aria-current": position === index ? "step" : void 0,
+        className: cn(
+          "flex items-center gap-2 text-sm",
+          position === index ? "font-medium text-foreground" : "text-muted-foreground"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "flex h-6 w-6 items-center justify-center rounded-full text-[12px] font-semibold tabular-nums",
+                position < index ? "bg-primary/15 text-primary" : position === index ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"
+              ),
+              children: position + 1
+            }
+          ),
+          label
+        ]
+      },
+      `${position}-${label}`
+    )) }),
+    /* @__PURE__ */ jsx("div", { children: panels[index] ?? null }),
+    index > 0 || index < last ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+      index > 0 ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "data-testid": "steps-back",
+          onClick: () => setIndex((current) => Math.max(0, current - 1)),
+          className: SECONDARY_BUTTON,
+          children: props.backLabel ?? "Back"
+        }
+      ) : /* @__PURE__ */ jsx("span", {}),
+      index < last ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "data-testid": "steps-next",
+          onClick: () => setIndex((current) => Math.min(last, current + 1)),
+          className: PRIMARY_BUTTON,
+          children: props.nextLabel ?? "Next"
+        }
+      ) : null
+    ] }) : null
+  ] });
+}
+var ICONS = {
+  Sparkles,
+  Rocket,
+  Compass,
+  Map: Map$1,
+  MapPin,
+  Route,
+  Plane,
+  Train,
+  Car,
+  Ship,
+  Hotel,
+  Home,
+  Building2,
+  Landmark,
+  Globe,
+  Mountain,
+  Leaf,
+  Sun,
+  Moon,
+  Calendar,
+  Clock,
+  Hourglass,
+  Users,
+  User,
+  Baby,
+  Accessibility,
+  Heart,
+  Star,
+  Utensils,
+  Coffee,
+  Music,
+  Camera,
+  Image,
+  Ticket,
+  Gift,
+  Wallet,
+  Banknote,
+  Coins,
+  Receipt,
+  Percent,
+  Hash,
+  TrendingUp,
+  BarChart3,
+  FileText,
+  Upload,
+  Paperclip,
+  Mail,
+  Phone,
+  Tag,
+  Layers,
+  ListChecks,
+  CheckCircle2,
+  AlertCircle,
+  Info,
+  Shield,
+  Flag,
+  Bookmark,
+  Briefcase,
+  Package,
+  Truck,
+  Lightbulb,
+  Zap,
+  Pencil,
+  Send
+};
+function Icon({ props }) {
+  const Glyph = ICONS[props.name];
+  if (!Glyph) return null;
+  const size = props.size === "lg" ? "h-7 w-7" : props.size === "sm" ? "h-4 w-4" : "h-5 w-5";
+  return /* @__PURE__ */ jsx(Glyph, { "aria-hidden": "true", className: cn(size, "shrink-0 text-muted-foreground") });
+}
+function Segmented({ props, bindings, emit }) {
+  const [boundValue, setBoundValue] = useBoundProp(
+    props.value ?? void 0,
+    bindings?.value
+  );
+  const [localValue, setLocalValue] = React3.useState("");
+  const isBound = Boolean(bindings?.value);
+  const value = isBound ? boundValue ?? "" : localValue;
+  const setValue = isBound ? setBoundValue : setLocalValue;
+  const labelId = useControlId(props.name);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("span", { id: labelId, className: "block text-sm leading-none font-medium", children: props.label }),
+    /* @__PURE__ */ jsx(
+      ToggleGroup,
+      {
+        type: "single",
+        "aria-labelledby": labelId,
+        value,
+        onValueChange: (next) => {
+          if (!next) return;
+          setValue(next);
+          emit("change");
+        },
+        className: "flex-wrap justify-start gap-1.5",
+        children: (props.options ?? []).map((option) => /* @__PURE__ */ jsx(
+          ToggleGroupItem,
+          {
+            value: option,
+            variant: "outline",
+            size: "sm",
+            className: "rounded-full px-3.5 data-[state=on]:border-primary data-[state=on]:bg-primary data-[state=on]:text-primary-foreground",
+            children: option
+          },
+          option
+        ))
+      }
+    )
+  ] });
+}
+function NumberInput({ props, bindings, emit }) {
+  const [boundValue, setBoundValue] = useBoundProp(
+    props.value ?? void 0,
+    bindings?.value
+  );
+  const [localValue, setLocalValue] = React3.useState(void 0);
+  const isBound = Boolean(bindings?.value);
+  const value = isBound ? boundValue : localValue;
+  const setValue = isBound ? setBoundValue : setLocalValue;
+  const id = useControlId(props.name);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("label", { htmlFor: id, className: "block text-sm leading-none font-medium", children: props.label }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          id,
+          type: "number",
+          inputMode: "decimal",
+          value: typeof value === "number" ? value : "",
+          min: props.min ?? void 0,
+          max: props.max ?? void 0,
+          step: props.step ?? "any",
+          placeholder: props.placeholder ?? void 0,
+          onChange: (event) => {
+            const raw = event.target.value;
+            setValue(raw === "" ? void 0 : Number(raw));
+            emit("change");
+          },
+          className: cn(
+            fieldControlClass,
+            "h-10 px-3 tabular-nums [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none"
+          )
+        }
+      ),
+      props.unit ? /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: props.unit }) : null
+    ] })
+  ] });
+}
+var components2 = {
+  Card: (ctx) => /* @__PURE__ */ jsx(Card, { ...ctx }),
+  // A vertical Stack stretches its children unless the spec says otherwise:
+  // hugging the content is the one layout a result page never wants, since a
+  // table or a grid inside it would stop short of the page's width.
+  Stack: (ctx) => /* @__PURE__ */ jsx(Stack, { ...ctx }),
+  Grid: (ctx) => /* @__PURE__ */ jsx(Grid, { ...ctx }),
+  Separator: (ctx) => /* @__PURE__ */ jsx(Separator, { ...ctx }),
+  Collapsible: (ctx) => /* @__PURE__ */ jsx(Collapsible, { ...ctx }),
+  Heading: (ctx) => /* @__PURE__ */ jsx(Heading, { ...ctx }),
+  Text: (ctx) => /* @__PURE__ */ jsx(Text, { ...ctx }),
+  Badge: (ctx) => /* @__PURE__ */ jsx(Badge, { ...ctx }),
+  Alert: (ctx) => /* @__PURE__ */ jsx(Alert, { ...ctx }),
+  Progress: (ctx) => /* @__PURE__ */ jsx(Progress, { ...ctx }),
+  Avatar: (ctx) => /* @__PURE__ */ jsx(Avatar, { ...ctx }),
+  Input: (ctx) => /* @__PURE__ */ jsx(Input, { ...ctx }),
+  Textarea: (ctx) => /* @__PURE__ */ jsx(Textarea, { ...ctx }),
+  // A plain label beside a trigger leaves the trigger with no accessible name,
+  // which axe reports as a button without one (`a11y` runs at error). This one
+  // is the package's own vendored select under a label that names the trigger.
+  Select: (ctx) => /* @__PURE__ */ jsx(AccessibleSelect, { ...ctx }),
+  Radio: (ctx) => /* @__PURE__ */ jsx(Radio, { ...ctx }),
+  Checkbox: (ctx) => /* @__PURE__ */ jsx(Checkbox, { ...ctx }),
+  Switch: (ctx) => /* @__PURE__ */ jsx(Switch2, { ...ctx }),
+  Button: (ctx) => /* @__PURE__ */ jsx(Button, { ...ctx }),
+  Split: (ctx) => /* @__PURE__ */ jsx(Split, { ...ctx }),
+  Tabs: (ctx) => /* @__PURE__ */ jsx(Tabs, { ...ctx }),
+  Steps: (ctx) => /* @__PURE__ */ jsx(Steps, { ...ctx }),
+  Icon: (ctx) => /* @__PURE__ */ jsx(Icon, { ...ctx }),
+  Segmented: (ctx) => /* @__PURE__ */ jsx(Segmented, { ...ctx }),
+  NumberInput: (ctx) => /* @__PURE__ */ jsx(NumberInput, { ...ctx }),
+  // Ours are React components (they use hooks), so each is MOUNTED rather than
+  // called: a render function that called hooks itself would run them inside
+  // the registry's wrapper and break the moment the wrapper re-ordered them.
+  MthdsField: (ctx) => /* @__PURE__ */ jsx(MthdsField, { ...ctx }),
+  MthdsResult: (ctx) => /* @__PURE__ */ jsx(MthdsResult, { ...ctx }),
+  DataTable: (ctx) => /* @__PURE__ */ jsx(DataTable, { ...ctx }),
+  Metric: (ctx) => /* @__PURE__ */ jsx(Metric, { ...ctx })
+};
+var generativeRenderers = components2;
+var ResultSlotContext = React3.createContext(null);
+function ResultSlotProvider({
+  slot,
+  children
+}) {
+  return /* @__PURE__ */ jsx(ResultSlotContext.Provider, { value: slot, children });
+}
+function useResultSlot() {
+  return React3.useContext(ResultSlotContext);
+}
+var CONTAINER = "mx-auto w-full max-w-6xl px-6 sm:px-8";
+var LABEL2 = "block text-[13.5px] leading-none font-medium text-foreground";
+function AppBar({ props }) {
+  const brand = useBrand();
+  return /* @__PURE__ */ jsx("header", { className: "border-b border-border", children: /* @__PURE__ */ jsxs("div", { className: cn(CONTAINER, "flex h-16 items-center gap-5"), children: [
+    /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: brand.logo.onLight,
+        alt: brand.name,
+        referrerPolicy: "no-referrer",
+        className: "h-7 w-auto dark:hidden"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: brand.logo.onDark,
+        alt: brand.name,
+        referrerPolicy: "no-referrer",
+        className: "hidden h-7 w-auto dark:block"
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "h-5 w-px bg-border" }),
+    /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground/80", children: props.app }),
+    /* @__PURE__ */ jsxs("div", { className: "ml-auto flex min-w-0 items-center gap-6", children: [
+      props.links && props.links.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Site", className: "hidden items-center gap-6 sm:flex", children: props.links.map((link) => /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: "#",
+          onClick: (event) => event.preventDefault(),
+          className: "text-sm text-muted-foreground transition-colors hover:text-foreground",
+          children: link
+        },
+        link
+      )) }) : null,
+      props.tag ? /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate rounded-lg border border-primary/40 bg-primary/10 px-2.5 py-1 font-mono text-[11px] text-primary", children: props.tag }) : null
+    ] })
+  ] }) });
+}
+function Hero({ props }) {
+  return /* @__PURE__ */ jsxs("section", { className: "pt-12 pb-10 sm:pt-14 sm:pb-12", children: [
+    props.eyebrow ? /* @__PURE__ */ jsx("p", { className: "mb-4 text-[11px] font-medium tracking-[0.15em] text-primary uppercase", children: props.eyebrow }) : null,
+    /* @__PURE__ */ jsx("h1", { className: "max-w-2xl text-4xl font-bold tracking-tight text-foreground sm:text-[44px] sm:leading-[1.15]", children: props.headline }),
+    props.lede ? /* @__PURE__ */ jsx("p", { className: "mt-4 max-w-2xl text-[17px] leading-relaxed text-muted-foreground", children: props.lede }) : null
+  ] });
+}
+function Workspace({ props, children }) {
+  const [work, rail] = React3.Children.toArray(children);
+  const railLeft = props.rail === "left";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        CONTAINER,
+        "grid grid-cols-1 gap-10 pb-16 lg:gap-14",
+        railLeft ? "lg:grid-cols-[360px_minmax(0,1fr)]" : "lg:grid-cols-[minmax(0,1fr)_360px]"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: cn("min-w-0", railLeft && "lg:order-2"), children: [
+          work,
+          /* @__PURE__ */ jsx(ResultPanel, {})
+        ] }),
+        /* @__PURE__ */ jsx(
+          "aside",
+          {
+            className: cn(
+              "lg:sticky lg:top-6 lg:self-start lg:pt-12 sm:lg:pt-14",
+              railLeft && "lg:order-1"
+            ),
+            children: rail
+          }
+        )
+      ]
+    }
+  );
+}
+function ResultPanel() {
+  const slot = useResultSlot();
+  if (!slot?.content) return null;
+  return /* @__PURE__ */ jsxs("section", { className: "border-t border-border py-9", "data-testid": "result-panel", "aria-live": "polite", children: [
+    /* @__PURE__ */ jsx("h2", { className: "mb-6 text-xl font-semibold tracking-tight text-foreground", children: slot.title ?? "Result" }),
+    slot.content
+  ] });
+}
+function Section({ props, children }) {
+  return /* @__PURE__ */ jsxs("section", { className: "border-t border-border py-9 first:border-t-0 first:pt-0", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-6", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-3", children: [
+        props.number ? /* @__PURE__ */ jsx("span", { className: "font-mono text-[12px] text-primary", children: props.number }) : null,
+        /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold tracking-tight text-foreground", children: props.title })
+      ] }),
+      props.lede ? /* @__PURE__ */ jsx("p", { className: "mt-1.5 text-sm text-muted-foreground", children: props.lede }) : null
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4", children })
+  ] });
+}
+function Rail({ props, children }) {
+  return (
+    // An arbitrary value reads the token directly, so it does NOT go through
+    // the `@theme inline` mapping and does not inherit its fallback - it has to
+    // carry its own, or a host that defines no tokens loses the declaration
+    // outright. See src/styles/tailwind-entry.css.
+    /* @__PURE__ */ jsxs("div", { className: "rounded-[calc(var(--radius,0.5rem)*1.5)] border border-border bg-card p-7 text-card-foreground shadow-xl", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-[11px] font-semibold tracking-[0.15em] text-muted-foreground uppercase", children: props.title }),
+      /* @__PURE__ */ jsx("div", { className: "mt-4 flex flex-col", children })
+    ] })
+  );
+}
+function present(value) {
+  return value !== void 0 && value !== null && value !== "";
+}
+function SummaryRow({ props }) {
+  const text = [props.value, props.detail].filter(present).map(String).join(props.separator ?? " ");
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-4 border-b border-border/60 py-3 first:pt-0 last:border-b-0", children: [
+    /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[13px] text-muted-foreground", children: props.label }),
+    text ? /* @__PURE__ */ jsx("span", { className: "text-right text-[13px] font-medium text-foreground", children: text }) : /* @__PURE__ */ jsx("span", { className: "text-[13px] text-muted-foreground/50", children: props.placeholder ?? "\u2014" })
+  ] });
+}
+function Cta({ props, emit }) {
+  return /* @__PURE__ */ jsxs("div", { className: "mt-6", children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => emit("press"),
+        className: cn(
+          "inline-flex h-12 w-full items-center justify-center rounded-lg bg-primary px-6 text-sm font-semibold text-primary-foreground",
+          // The fallback is not decoration here either - see Rail above.
+          "shadow-[0_0_28px_color-mix(in_oklab,var(--primary,hsl(240_5.9%_10%))_35%,transparent)] transition-all hover:bg-primary/90 hover:shadow-[0_0_44px_color-mix(in_oklab,var(--primary,hsl(240_5.9%_10%))_50%,transparent)]",
+          "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:outline-hidden"
+        ),
+        children: props.label
+      }
+    ),
+    props.hint ? /* @__PURE__ */ jsx("p", { className: "mt-3 text-center text-[12px] leading-relaxed text-muted-foreground", children: props.hint }) : null
+  ] });
+}
+function Footer({ props }) {
+  return /* @__PURE__ */ jsx("footer", { className: "border-t border-border", children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        CONTAINER,
+        // Wraps, and the tag may break anywhere: a pipe's code is one long
+        // word, and at phone width an unbreakable one widened the document
+        // past the viewport.
+        "flex flex-wrap items-center justify-between gap-x-6 gap-y-2 py-6 text-[12px] text-muted-foreground"
+      ),
+      children: [
+        /* @__PURE__ */ jsx("span", { children: props.text }),
+        props.tag ? /* @__PURE__ */ jsx("span", { className: "min-w-0 font-mono text-[11px] tracking-wider break-all text-muted-foreground/70 uppercase", children: props.tag }) : null
+      ]
+    }
+  ) });
+}
+function useTextField(props, bindings) {
+  const [boundValue, setBoundValue] = useBoundProp(
+    props.value ?? void 0,
+    bindings?.value
+  );
+  const [localValue, setLocalValue] = React3.useState("");
+  const isBound = Boolean(bindings?.value);
+  const value = isBound ? boundValue ?? "" : localValue;
+  const setValue = isBound ? setBoundValue : setLocalValue;
+  const validateOn = props.validateOn ?? "blur";
+  const hasValidation = Boolean(bindings?.value && props.checks?.length);
+  const { errors, validate } = useFieldValidation(
+    bindings?.value ?? "",
+    hasValidation ? { checks: props.checks ?? [], validateOn } : void 0
+  );
+  const onChange = (next) => {
+    setValue(next);
+    if (hasValidation && validateOn === "change") validate();
+  };
+  const onBlur = () => {
+    if (hasValidation && validateOn === "blur") validate();
+  };
+  return { value, errors, onChange, onBlur };
+}
+function BrandInput({
+  props,
+  bindings,
+  emit
+}) {
+  const field = useTextField(props, bindings);
+  const id = useControlId(props.name);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("label", { htmlFor: id, className: LABEL2, children: props.label }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        id,
+        name: props.name,
+        type: props.type ?? "text",
+        value: field.value,
+        placeholder: props.placeholder ?? "",
+        "aria-invalid": field.errors.length > 0 || void 0,
+        onChange: (event) => field.onChange(event.target.value),
+        onBlur: () => {
+          field.onBlur();
+          emit("blur");
+        },
+        onFocus: () => emit("focus"),
+        onKeyDown: (event) => {
+          if (event.key === "Enter") emit("submit");
+        },
+        className: cn(fieldControlClass, "h-11 px-3.5")
+      }
+    ),
+    field.errors[0] ? /* @__PURE__ */ jsx("p", { role: "alert", className: "text-[11px] text-destructive", children: field.errors[0] }) : null
+  ] });
+}
+function BrandTextarea({
+  props,
+  bindings
+}) {
+  const field = useTextField(props, bindings);
+  const id = useControlId(props.name);
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsx("label", { htmlFor: id, className: LABEL2, children: props.label }),
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        id,
+        name: props.name,
+        rows: props.rows ?? 3,
+        value: field.value,
+        placeholder: props.placeholder ?? "",
+        "aria-invalid": field.errors.length > 0 || void 0,
+        onChange: (event) => field.onChange(event.target.value),
+        onBlur: field.onBlur,
+        className: cn(fieldControlClass, "px-3.5 py-2.5 leading-relaxed")
+      }
+    ),
+    field.errors[0] ? /* @__PURE__ */ jsx("p", { role: "alert", className: "text-[11px] text-destructive", children: field.errors[0] }) : null
+  ] });
+}
+var { registry: generativeRegistry } = defineRegistry(catalog, {
+  components: {
+    ...generativeRenderers,
+    Input: (ctx) => /* @__PURE__ */ jsx(BrandInput, { ...ctx }),
+    Textarea: (ctx) => /* @__PURE__ */ jsx(BrandTextarea, { ...ctx }),
+    AppBar: (ctx) => /* @__PURE__ */ jsx(AppBar, { ...ctx }),
+    Hero: (ctx) => /* @__PURE__ */ jsx(Hero, { ...ctx }),
+    Workspace: (ctx) => /* @__PURE__ */ jsx(Workspace, { ...ctx }),
+    Section: (ctx) => /* @__PURE__ */ jsx(Section, { ...ctx }),
+    Rail: (ctx) => /* @__PURE__ */ jsx(Rail, { ...ctx }),
+    SummaryRow: (ctx) => /* @__PURE__ */ jsx(SummaryRow, { ...ctx }),
+    Cta: (ctx) => /* @__PURE__ */ jsx(Cta, { ...ctx }),
+    Footer: (ctx) => /* @__PURE__ */ jsx(Footer, { ...ctx })
+  }
+});
+function GenerativePage({
+  spec,
+  store,
+  scope,
+  onRun,
+  loading,
+  registry = generativeRegistry,
+  brand
+}) {
+  const { inputs, result, env, idPrefix } = scope;
+  const stableScope = React3.useMemo(
+    () => ({ inputs, result, env, idPrefix }),
+    [inputs, result, env, idPrefix]
+  );
+  const latest = React3.useRef({ onRun, store });
+  React3.useEffect(() => {
+    latest.current = { onRun, store };
+  });
+  const [handlers] = React3.useState(() => ({
+    run: () => {
+      latest.current.onRun?.(latest.current.store.getSnapshot());
+    }
+  }));
+  const page = /* @__PURE__ */ jsx(DescriptorProvider, { scope: stableScope, children: /* @__PURE__ */ jsx(JSONUIProvider, { registry, store, handlers, children: /* @__PURE__ */ jsx(Renderer, { spec, registry, loading }) }) });
+  return brand ? /* @__PURE__ */ jsx(BrandProvider, { manifest: brand, children: page }) : page;
+}
+function useStoreSnapshot(store) {
+  return React3.useSyncExternalStore(
+    store.subscribe,
+    store.getSnapshot,
+    store.getServerSnapshot ?? store.getSnapshot
+  );
+}
+var httpUrl = z.url({ protocol: /^https?$/ });
+var brandManifestSchema = z.strictObject({
+  name: z.string().min(1),
+  website: httpUrl,
+  logo: z.strictObject({
+    /** The mark drawn on the light canvas: usually the dark version of the logo. */
+    onLight: httpUrl,
+    /** The mark drawn on the dark canvas: usually the light version of the logo. */
+    onDark: httpUrl
+  }),
+  webfont: z.strictObject({
+    provider: z.literal("google-fonts"),
+    family: z.string().min(1)
+  }).nullable()
+});
+
+// src/generative/state.ts
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function payloadToState(field, payload) {
+  if (payload === void 0 || payload === null) return payload;
+  if (isNativeHtmlNode(field) || isNativeDateNode(field) || isNativeCompositeNode(field)) {
+    return payload;
+  }
+  switch (field.kind) {
+    case "date": {
+      const content = readDateContent(payload);
+      return content ? formatDateContent(content) : payload;
+    }
+    case "list": {
+      const items = Array.isArray(payload) ? payload : isRecord(payload) && Array.isArray(payload.items) ? payload.items : void 0;
+      if (!items) return payload;
+      return items.map((item) => payloadToState(field.item, item));
+    }
+    case "object": {
+      if (!isRecord(payload)) return payload;
+      const out = { ...payload };
+      for (const child of field.fields) {
+        if (hasOwnProp(payload, child.name)) {
+          out[child.name] = payloadToState(child, payload[child.name]);
+        }
+      }
+      return out;
+    }
+    case "document":
+    case "image":
+    case "text":
+    case "prose":
+    case "number":
+    case "boolean":
+    case "enum":
+    case "unknown":
+      return payload;
+    default:
+      return field;
+  }
+}
+function seedInputs(fields) {
+  const seed = {};
+  for (const field of fields) {
+    if (field.defaultValue !== void 0) {
+      seed[field.name] = field.defaultValue;
+    } else if (field.kind === "object") {
+      const nested = seedInputs(field.fields);
+      if (Object.keys(nested).length > 0) seed[field.name] = nested;
+    }
+  }
+  return seed;
+}
+
+// src/generative/fixture.ts
+function fixtureId(fixture) {
+  return [
+    fixture.producer,
+    fixture.model,
+    fixture.seed ? "seeded" : null,
+    fixture.critic ? "critic" : null
+  ].filter((part) => part !== null).join("--");
+}
+var PRODUCER_LABEL = {
+  "pipelex-method": "Pipelex method",
+  "claude-code-subagent": "Claude Code subagent",
+  "claude-code-session": "Claude Code session, by hand"
+};
+function fixtureLabel(fixture) {
+  const parts = [PRODUCER_LABEL[fixture.producer], fixture.model];
+  if (fixture.seed) parts.push("with a seed");
+  if (fixture.critic) {
+    parts.push(
+      `${fixture.critic.model} critic \xD7 ${fixture.critic.rounds} round${fixture.critic.rounds === 1 ? "" : "s"}`
+    );
+  }
+  return parts.join(" \xB7 ");
+}
+function findFixture(fixtures, pipeRef, id) {
+  const found = fixtures.find(
+    (fixture) => fixture.pipeRef === pipeRef && fixtureId(fixture) === id
+  );
+  if (!found) {
+    const known = fixtures.filter((fixture) => fixture.pipeRef === pipeRef).map(fixtureId).join(", ");
+    throw new Error(`No spec fixture ${id} for ${pipeRef}. Known: ${known || "none"}.`);
+  }
+  return found;
+}
+
+export { BrandProvider, COMPONENT_NAMES, COMPONENT_RENDERINGS, CUSTOM_COMPONENTS, DESIGNER_CATALOG_CONCEPT, DescriptorProvider, GenerativePage, ICON_NAMES, INPUTS_ROOT, METRIC_FORMATS, PICKED_SHADCN, PRODUCT_COMPONENTS, PROMPT_HASH, RESULT_ROOT, ResultSlotProvider, absoluteHatchPath, brandManifestSchema, catalog, designerCatalog, fieldAtSegments, findFixture, fixtureId, fixtureLabel, formatProblems, generativeRegistry, generativeRenderers, inputFieldAtPath, isDelegatedInput, isDelegatedResult, joinPath, jsonlLines, layoutFits, layoutProblems, pathFromDomId, payloadToState, renderInputBrief, renderResultBrief, repeatBasePathOf, resultFieldAtPath, seedInputs, segmentsUnder, specFromJsonl, specToJsonl, useBrand, useDescriptorScope, useResultSlot, useStoreSnapshot, validateAgainstCatalog };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map