@pipelex/mthds-form 0.30.0 → 0.32.0

package/dist/generative/index.js

@@ -1,13 +1,16 @@
 "use client";
-import { cn, headingClass, checkedAccentClass, focusOutlineClass, actionShadowClass, panelSurfaceClass, panelRaisedShadowClass, linkTextClass, selectedBorderClass, selectedFillClass, fieldControlClass, ResultRoot, ResultField, FieldRenderer, enumLabeler, useFieldPresentation, ToggleGroup, ToggleGroupItem, selectedFillStrongClass, Switch, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, panelFlatShadowClass } from '../chunk-JCFALTTY.js';
+import { cn, headingClass, checkedAccentClass, focusOutlineClass, useResolveUrl, panelSurfaceClass, panelFlatShadowClass, linkTextClass, actionShadowClass, panelRaisedShadowClass, fieldControlClass, ResultRoot, ResultField, FieldRenderer, enumLabeler, useFieldPresentation, ToggleGroup, ToggleGroupItem, selectedFillStrongClass, Switch, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, selectedBorderClass, selectedFillClass, isThenable } from '../chunk-PCNFELNT.js';
+import { baseCatalog, catalog, frameComponents, resultFieldAtPath, segmentsUnder, RESULT_ROOT, inputFieldAtPath } from '../chunk-VBXFGUCG.js';
+export { COMPONENT_NAMES, COMPONENT_RENDERINGS, COMPOSER_COMPONENTS, CUSTOM_COMPONENTS, DESIGNER_BRIEF_CONCEPT, DESIGNER_CATALOG_CONCEPT, FRAMES, FRAME_COMPONENTS, ICON_NAMES, INPUTS_ROOT, METRIC_FORMATS, PICKED_SHADCN, PRODUCT_COMPONENTS, PROMPT_HASH, REPAIR_ATTEMPTS, RESULT_COMPONENTS, RESULT_ROOT, absoluteHatchPath, catalog, componentNamesFor, designerCatalog, fieldAtSegments, findFixture, fixtureId, fixtureLabel, formatProblems, frameCatalog, inputBrief, inputFieldAtPath, isDelegatedInput, isDelegatedResult, joinPath, jsonlLines, layoutCheckProblems, layoutFits, layoutProblems, payloadToState, promptHashSubject, repeatBasePathOf, resultBrief, resultFieldAtPath, seedLine, segmentsUnder, specFromJsonl, specToJsonl, validateAgainstCatalog } from '../chunk-VBXFGUCG.js';
 import '../chunk-4VAO6BDE.js';
 export { seedInputs } from '../chunk-VH5CDQDR.js';
 import '../chunk-L23R3JNQ.js';
 import '../chunk-56WECFBD.js';
 import '../chunk-ZX52CQJ4.js';
 import '../chunk-GHVVULHY.js';
-import { isNativeValueNode, readDateContent, formatDateContent, isNativeHtmlNode, isNativeDateNode, isNativeCompositeNode } from '../chunk-QQK6Y55E.js';
-export { brandManifestSchema } from '../chunk-QFX332LE.js';
+import { readImageContent, viewableUrl, readDateContent } from '../chunk-QQK6Y55E.js';
+export { brandManifestSchema } from '../chunk-QGFR57OH.js';
+import '../chunk-3GO65HWP.js';
 import '../chunk-ZB4RYUKV.js';
 import '../chunk-FABY3DEY.js';
 import '../chunk-XCO6GTEC.js';
@@ -17,1796 +20,239 @@ import '../chunk-OD3VYXUY.js';
 import '../chunk-WYH56SOZ.js';
 import { hasOwnProp } from '../chunk-V3OV2XQT.js';
 import '../chunk-GKV77RAS.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 * as React5 from 'react';
+import { defineRegistry, useStateValue, useRepeatScope, useStateStore, useBoundProp, useFieldValidation, 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 { Clock, ArrowRight, 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, Calendar, Moon, Sun, Leaf, Mountain, Globe, Landmark, Building2, Home, Hotel, Ship, Car, Train, Plane, Route, MapPin, Map as Map$1, Compass, Rocket, Sparkles, ChevronDown } from 'lucide-react';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
+export { createStateStore } from '@json-render/core';
 
-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 = "2b2325fd1231";
-
-// 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 DESIGNER_BRIEF_CONCEPT = "generative.Brief";
-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 (isNativeValueNode(field)) return true;
-  if (field.kind === "list" && isNativeValueNode(field.item)) 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;
-  }
+var BrandContext = React5.createContext(null);
+function BrandProvider({
+  manifest,
+  children
+}) {
+  useWebfont(manifest.webfont);
+  return /* @__PURE__ */ jsx(BrandContext.Provider, { value: manifest, children });
 }
-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(", ")}`
+function useBrand() {
+  const manifest = React5.useContext(BrandContext);
+  if (!manifest)
+    throw new Error(
+      "useBrand: no brand in scope. Pass `brand` to GenerativePage, or wrap the tree in BrandProvider."
     );
-  }
-  return notes;
-}
-function entryOf(field, path, depth, side, relative, seeded) {
-  const notes = constraints(field);
-  return {
-    depth,
-    path,
-    kind: kindLabel(field),
-    name: field.name,
-    title: field.title && field.title !== field.name ? field.title : void 0,
-    description: field.description,
-    required: side === "input" ? field.required : void 0,
-    gating: side === "input" && field.gating ? true : void 0,
-    notes: notes.length > 0 ? notes : void 0,
-    default: seeded || field.defaultValue === void 0 ? void 0 : JSON.stringify(field.defaultValue),
-    delegated: side === "input" ? isDelegatedInput(field) : isDelegatedResult(field),
-    relative: relative ? true : void 0
-  };
-}
-function describe(field, path, depth, side, entries, seeded = false) {
-  const entry = entryOf(field, path, depth, side, false, seeded);
-  entries.push(entry);
-  if (entry.delegated) return;
-  if (field.kind === "object") {
-    const seededBelow = seeded || field.defaultValue !== void 0 || side === "input" && !field.required;
-    for (const child of field.fields) {
-      describe(child, joinPath(path, child.name), depth + 1, side, entries, seededBelow);
-    }
-  }
-  if (field.kind === "list" && side === "result") {
-    const item = field.item;
-    entry.item_kind = kindLabel(item);
-    entry.item_description = item.description;
-    if (item.kind === "object" && !isDelegatedResult(item)) {
-      entry.item_laid_out = true;
-      for (const child of item.fields) {
-        describeRelative(child, child.name, depth + 2, entries);
-      }
-    }
-  }
-}
-function describeRelative(field, relativePath, depth, entries) {
-  const entry = entryOf(field, relativePath, depth, "result", true, false);
-  entries.push(entry);
-  if (entry.delegated) return;
-  if (field.kind === "object") {
-    for (const child of field.fields) {
-      describeRelative(child, joinPath(relativePath, child.name), depth + 1, entries);
-    }
-  }
-  if (field.kind === "list") {
-    const item = field.item;
-    entry.item_kind = kindLabel(item);
-    entry.item_description = item.description;
-    if (item.kind === "object" && !isDelegatedResult(item)) {
-      entry.item_laid_out = true;
-      for (const child of item.fields) {
-        describeRelative(child, joinPath(relativePath, "<i>", child.name), depth + 2, entries);
-      }
-    }
-  }
-}
-function inputBrief(subject, fields) {
-  const paths = [];
-  for (const field of fields) describe(field, joinPath(INPUTS_ROOT, field.name), 0, "input", paths);
-  return {
-    side: "input",
-    pipe_ref: subject.pipeRef,
-    description: subject.description,
-    name: subject.name,
-    paths,
-    run_control: RUN_COMPONENT
-  };
-}
-function resultBrief(subject, field, state) {
-  const paths = [];
-  if (field.kind === "object" && !isDelegatedResult(field)) {
-    paths.push({
-      depth: 0,
-      path: RESULT_ROOT,
-      kind: kindLabel(field),
-      description: field.description,
-      delegated: false
-    });
-    for (const child of field.fields) {
-      describe(child, joinPath(RESULT_ROOT, child.name), 1, "result", paths);
-    }
-  } else {
-    describe(field, RESULT_ROOT, 0, "result", paths);
-  }
-  return {
-    side: "result",
-    pipe_ref: subject.pipeRef,
-    description: subject.description,
-    paths,
-    sample_state: JSON.stringify(state, null, 2)
-  };
+  return manifest;
 }
-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();
+var WEIGHTS = "400;500;600;700";
+function useWebfont(webfont) {
+  const provider = webfont?.provider;
+  const family = webfont?.family;
+  React5.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);
     }
-    deepest = Math.max(deepest, below.get(start) ?? 0);
-  }
-  return deepest;
+    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 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)}` }]
-    };
+var ReportingContext = React5.createContext(false);
+var ElementBoundary = class extends React5.Component {
+  constructor(props) {
+    super(props);
+    this.state = { failed: false, error: void 0, resetOn: props.resetOn };
   }
-}
-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}.`
-        }
-      ]
-    };
+  static getDerivedStateFromError(error) {
+    return { failed: true, error };
   }
-  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 });
-    }
+  static getDerivedStateFromProps(props, state) {
+    if (Object.is(props.resetOn, state.resetOn)) return null;
+    return { failed: false, error: void 0, resetOn: props.resetOn };
   }
-  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.`
+  componentDidCatch(error, info) {
+    if (!this.props.reporting) return;
+    const componentStack = info.componentStack ?? void 0;
+    this.props.report.current?.(error, {
+      type: this.props.type,
+      ...componentStack ? { componentStack } : {}
     });
   }
-  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}"` });
-    }
+  // Whether to report or to throw the error on is decided as the boundary
+  // renders its failure, from whether the host passes a handler in this very
+  // render: decided later, it cost a blank commit and a second record of the
+  // same error, and decided from the ref, it read the previous render's
+  // callback. No host to tell: the error goes on, in the same render, to
+  // json-render's boundary or the host's around the page, which record it
+  // once, as if this one were not here.
+  render() {
+    if (!this.state.failed) return this.props.children;
+    if (!this.props.reporting) throw this.state.error;
+    return null;
   }
-  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);
+function reportingRegistry(registry, report, made) {
+  const wrapped = {};
+  for (const [type, Renderer2] of Object.entries(registry)) {
+    const kept = made.get(type);
+    if (kept && kept.renderer === Renderer2) {
+      wrapped[type] = kept.wrapper;
+      continue;
     }
+    const Component2 = Renderer2;
+    const Reported = (props) => /* @__PURE__ */ jsx(ElementBoundary, { type, report, reporting: React5.useContext(ReportingContext), children: /* @__PURE__ */ jsx(Component2, { ...props }) });
+    Reported.displayName = `Reported(${type})`;
+    made.set(type, { renderer: Renderer2, wrapper: Reported });
+    wrapped[type] = Reported;
   }
-  listPropsCache = found;
-  return found;
+  return wrapped;
 }
-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);
+var CONTAINER = "mx-auto w-full max-w-6xl px-6 sm:px-8";
+function BrandBar({ app, links, tag }) {
+  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"
       }
-    }
-  }
-  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`);
+    ),
+    /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: brand.logo.onDark,
+        alt: brand.name,
+        referrerPolicy: "no-referrer",
+        className: "hidden h-7 w-auto dark:block"
       }
-    }
-  }
-  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}/`));
+    ),
+    /* @__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: app }),
+    /* @__PURE__ */ jsxs("div", { className: "ml-auto flex min-w-0 items-center gap-6", children: [
+      links && links.length > 0 ? /* @__PURE__ */ jsx("nav", { "aria-label": "Site", className: "hidden items-center gap-6 sm:flex", children: links.map((link, index) => /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: "#",
+          onClick: (event) => event.preventDefault(),
+          className: "rounded-sm text-sm text-muted-foreground transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:outline-hidden",
+          children: link
+        },
+        `${index}-${link}`
+      )) }) : null,
+      tag ? /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn(
+            "min-w-0 truncate rounded-lg border px-2.5 py-1 font-mono text-[11px]",
+            selectedBorderClass,
+            selectedFillClass,
+            linkTextClass
+          ),
+          children: tag
+        }
+      ) : null
+    ] })
+  ] }) });
 }
-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];
+
+// src/generative/declared-props.ts
+function definitionOf(schema) {
+  return schema._zod?.def;
 }
-function layoutProblems(descriptor, spec) {
-  try {
-    return collectLayoutProblems(descriptor, spec);
-  } catch (error) {
-    return [`the layout is not a well-formed spec: ${String(error)}`];
+function unwrapped(schema) {
+  let def = definitionOf(schema);
+  for (let depth = 0; depth < 8 && def; depth += 1) {
+    if (def.type !== "nullable" && def.type !== "optional" && def.type !== "default") return def;
+    def = def.innerType ? definitionOf(def.innerType) : void 0;
   }
+  return def;
+}
+function absentValueOf(schema) {
+  if (schema.safeParse(null).success) return null;
+  if (schema.safeParse(void 0).success) return void 0;
+  const type = unwrapped(schema)?.type;
+  if (type === "string") return "";
+  if (type === "array") return [];
+  return void 0;
 }
-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`);
-      }
-    }
+function conformValue(schema, value) {
+  if (value === void 0 || value === null) {
+    return schema.safeParse(value).success ? value : absentValueOf(schema);
   }
-  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`);
-    }
+  if (schema.safeParse(value).success) return value;
+  const def = unwrapped(schema);
+  if (def?.type === "string" && (typeof value === "number" || typeof value === "boolean")) {
+    return String(value);
   }
-  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);
+  if (def?.type === "array" && def.element && Array.isArray(value)) {
+    const element = def.element;
+    return value.filter((entry) => element.safeParse(entry).success);
   }
-  for (const key of Object.keys(spec.elements)) {
-    if (!emitted.has(key)) push("add", `/elements/${escapeSegment(key)}`, spec.elements[key]);
+  return absentValueOf(schema);
+}
+function conformProps(shape, props, asWritten = []) {
+  let conformed;
+  for (const [name, schema] of Object.entries(shape)) {
+    if (asWritten.includes(name)) continue;
+    const value = props[name];
+    const held = conformValue(schema, value);
+    if (held === value) continue;
+    conformed ?? (conformed = { ...props });
+    conformed[name] = held;
   }
-  for (const [key, value] of Object.entries(spec.state ?? {})) {
-    push("add", `/state/${escapeSegment(key)}`, value);
+  return conformed ?? props;
+}
+function withDeclaredProps(definitions, renderers, asWritten = {}) {
+  const wrapped = {};
+  for (const [name, render] of Object.entries(renderers)) {
+    const schema = definitions[name]?.props;
+    const shape = schema?.shape;
+    wrapped[name] = shape ? (ctx) => render({
+      ...ctx,
+      props: conformProps(shape, ctx.props, asWritten[name])
+    }) : render;
   }
-  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)));
+  return wrapped;
 }
-function reachesPrototype(line) {
-  let parsed;
+function textOf(value) {
+  if (value === void 0 || value === null) return "";
+  if (typeof value !== "object") return String(value);
   try {
-    parsed = JSON.parse(line);
+    return String(value);
   } 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);
+      return JSON.stringify(value) ?? "";
     } catch {
-      continue;
+      return "";
     }
   }
-  return spec;
-}
-function jsonlLines(jsonl) {
-  return jsonl.split("\n").filter((line) => line.trim().length > 0);
 }
-var BrandContext = React3.createContext(null);
-function BrandProvider({
-  manifest,
+var FrameHostContext = React5.createContext({});
+function FrameHostProvider({
+  host,
   children
 }) {
-  useWebfont(manifest.webfont);
-  return /* @__PURE__ */ jsx(BrandContext.Provider, { value: manifest, children });
+  return /* @__PURE__ */ jsx(FrameHostContext.Provider, { value: host, 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 useFrameHost() {
+  return React5.useContext(FrameHostContext);
 }
 function useBoundField(literal, binding, empty, { checks, validateOn }) {
   const [boundValue, setBoundValue] = useBoundProp(literal ?? void 0, binding);
-  const [localValue, setLocalValue] = React3.useState(literal ?? empty);
+  const [localValue, setLocalValue] = React5.useState(literal ?? empty);
   const isBound = Boolean(binding);
   const hasValidation = Boolean(binding && checks?.length);
   const when = validateOn ?? "change";
@@ -1846,11 +292,16 @@ function Card({
   return (
     // A style's panel: a host writes the style's field fill onto `--input`
     // here, as on its own panel, so the fields inside do not sink into it.
+    // A panel's corner is one and a half times a control's, as the rail's is.
     /* @__PURE__ */ jsxs(
       "div",
       {
         "data-style-panel": "",
-        className: cn("rounded-lg p-6 text-card-foreground", panelSurfaceClass, panelFlatShadowClass),
+        className: cn(
+          "rounded-[calc(var(--radius,0.5rem)*1.5)] p-6 text-card-foreground",
+          panelSurfaceClass,
+          panelFlatShadowClass
+        ),
         children: [
           props.title || props.description ? /* @__PURE__ */ jsxs("div", { className: "mb-4 space-y-1.5", children: [
             props.title ? /* @__PURE__ */ jsx("h3", { className: cn("text-lg leading-none", headingClass(600)), children: props.title }) : null,
@@ -1940,7 +391,16 @@ function Collapsible({
       open: props.defaultOpen ?? false,
       "data-slot": "collapsible",
       children: [
-        /* @__PURE__ */ jsx("summary", { className: "cursor-pointer list-none rounded-md px-4 py-3 text-sm font-medium select-none focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset", children: props.title }),
+        /* @__PURE__ */ jsxs("summary", { className: "flex min-h-11 cursor-pointer list-none items-center justify-between gap-3 rounded-md px-4 py-3 text-sm font-medium select-none focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset [&::-webkit-details-marker]:hidden", children: [
+          /* @__PURE__ */ jsx("span", { children: props.title }),
+          /* @__PURE__ */ jsx(
+            ChevronDown,
+            {
+              "aria-hidden": "true",
+              className: "size-4 shrink-0 text-muted-foreground transition-transform [details[open]>summary_&]:rotate-180"
+            }
+          )
+        ] }),
         /* @__PURE__ */ jsx("div", { className: "border-t border-border px-4 py-3", children })
       ]
     }
@@ -2064,7 +524,7 @@ function Progress({
   ] });
 }
 function useControlId(name) {
-  return `jr-${name}-${React3.useId()}`;
+  return `jr-${name}-${React5.useId()}`;
 }
 function Input({
   props,
@@ -2243,9 +703,9 @@ function Button({
     }
   );
 }
-var DescriptorContext = React3.createContext({});
+var DescriptorContext = React5.createContext({});
 function useDescriptorScope() {
-  return React3.useContext(DescriptorContext);
+  return React5.useContext(DescriptorContext);
 }
 function DescriptorProvider({
   scope,
@@ -2292,13 +752,28 @@ function useAbsolutePath(path) {
   if (path.startsWith("/")) return path;
   return repeat ? `${repeat.basePath}/${path}` : void 0;
 }
-function MthdsField({ props }) {
-  const scope = React3.useContext(DescriptorContext);
+function withoutOptionalMark(label) {
+  return label.replace(/\s*\(optional\)\s*$/i, "") || label;
+}
+function MthdsField({
+  props
+}) {
+  const scope = React5.useContext(DescriptorContext);
   const path = useAbsolutePath(props.path) ?? "";
-  const field = scope.inputs && path ? inputFieldAtPath(scope.inputs, path) : void 0;
+  const found = scope.inputs && path ? inputFieldAtPath(scope.inputs, path) : void 0;
+  const field = React5.useMemo(
+    () => found && (props.label || props.hint) ? {
+      ...found,
+      // The control marks an optional field itself, so a label that
+      // says "(optional)" too would say it twice.
+      title: props.label ? withoutOptionalMark(props.label) : found.title,
+      description: props.hint || found.description
+    } : found,
+    [found, props.label, props.hint]
+  );
   const value = useStateValue(path);
   const { set } = useStateStore();
-  const onChange = React3.useCallback((next) => set(path, next), [set, path]);
+  const onChange = React5.useCallback((next) => set(path, next), [set, path]);
   if (!field) return /* @__PURE__ */ jsx(Unresolved, { path: props.path, side: "input" });
   return /* @__PURE__ */ jsx(
     FieldRenderer,
@@ -2312,7 +787,7 @@ function MthdsField({ props }) {
   );
 }
 function MthdsResult({ props }) {
-  const scope = React3.useContext(DescriptorContext);
+  const scope = React5.useContext(DescriptorContext);
   const path = useAbsolutePath(props.path) ?? "";
   const field = scope.result && path ? resultFieldAtPath(scope.result, path) : void 0;
   const value = useStateValue(path);
@@ -2325,7 +800,7 @@ function AccessibleSelect({ props, bindings, emit }) {
     props.value ?? void 0,
     bindings?.value
   );
-  const [localValue, setLocalValue] = React3.useState("");
+  const [localValue, setLocalValue] = React5.useState("");
   const isBound = Boolean(bindings?.value);
   const value = isBound ? boundValue ?? "" : localValue;
   const setValue = isBound ? setBoundValue : setLocalValue;
@@ -2374,6 +849,21 @@ function formatCell(value) {
   if (Array.isArray(value)) return value.map(formatCell).join(", ");
   return JSON.stringify(value);
 }
+function formatColumnCell(value, format) {
+  const written = format === "date" ? readDateContent(value)?.date : void 0;
+  const day = written === void 0 ? null : /^\d{4}-\d{2}-\d{2}/.exec(written);
+  if (day) {
+    const date = /* @__PURE__ */ new Date(`${day[0]}T12:00:00Z`);
+    if (!Number.isNaN(date.getTime()))
+      return date.toLocaleDateString("en-GB", {
+        day: "numeric",
+        month: "short",
+        year: "numeric",
+        timeZone: "UTC"
+      });
+  }
+  return formatCell(value);
+}
 function DataTable({ props }) {
   const rows = Array.isArray(props.rows) ? props.rows : [];
   const columns = props.columns ?? [];
@@ -2388,7 +878,7 @@ function DataTable({ props }) {
       },
       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)) })
+    /* @__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: formatColumnCell(valueAt(row, column.path), column.format) }, column.path)) }, index)) })
   ] }) });
 }
 function numberFormat(format) {
@@ -2407,7 +897,7 @@ function numberFormat(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);
+  const text = typeof value === "number" ? numberFormat(props.format ?? "plain").format(value) : value === null || value === void 0 || value === "" ? "\u2014" : textOf(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: [
@@ -2440,8 +930,8 @@ function Split({
 }
 function Tabs({ props, children }) {
   const tabs = props.tabs ?? [];
-  const panels = React3.Children.toArray(children);
-  const [value, setValue] = React3.useState(tabs[0]?.value ?? "");
+  const panels = React5.Children.toArray(children);
+  const [value, setValue] = React5.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 max-sm:h-auto max-sm:flex-wrap", children: tabs.map((tab) => /* @__PURE__ */ jsx(
       TabsPrimitive.Trigger,
@@ -2471,8 +961,8 @@ var SECONDARY_BUTTON = cn(
 );
 function Steps({ props, children }) {
   const steps = props.steps ?? [];
-  const panels = React3.Children.toArray(children);
-  const [index, setIndex] = React3.useState(0);
+  const panels = React5.Children.toArray(children);
+  const [index, setIndex] = React5.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(
@@ -2601,7 +1091,7 @@ function Segmented({ props, bindings, emit }) {
     props.value ?? void 0,
     bindings?.value
   );
-  const [localValue, setLocalValue] = React3.useState("");
+  const [localValue, setLocalValue] = React5.useState("");
   const isBound = Boolean(bindings?.value);
   const value = isBound ? boundValue ?? "" : localValue;
   const setValue = isBound ? setBoundValue : setLocalValue;
@@ -2641,7 +1131,7 @@ function NumberInput({ props, bindings, emit }) {
     props.value ?? void 0,
     bindings?.value
   );
-  const [localValue, setLocalValue] = React3.useState(void 0);
+  const [localValue, setLocalValue] = React5.useState(void 0);
   const isBound = Boolean(bindings?.value);
   const value = isBound ? boundValue : localValue;
   const setValue = isBound ? setBoundValue : setLocalValue;
@@ -2675,7 +1165,7 @@ function NumberInput({ props, bindings, emit }) {
     ] })
   ] });
 }
-var components2 = {
+var components = {
   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
@@ -2714,67 +1204,356 @@ var components2 = {
   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 });
+var generativeRenderers = withDeclaredProps(
+  baseCatalog.data.components,
+  components
+);
+var RADIUS = "rounded-[calc(var(--radius,0.5rem)*1.5)]";
+function useAbsolute(path) {
+  const repeat = useRepeatScope();
+  if (path.startsWith("/")) return path;
+  if (!repeat) return path;
+  return path === "" ? repeat.basePath : `${repeat.basePath}/${path}`;
+}
+function asDate(value) {
+  if (typeof value !== "string" || !/^\d{4}-\d{2}-\d{2}/.test(value)) return void 0;
+  const date = /* @__PURE__ */ new Date(`${value.slice(0, 10)}T12:00:00Z`);
+  return Number.isNaN(date.getTime()) ? void 0 : date;
+}
+function Composer({ props, children, emit }) {
+  const host = useFrameHost();
+  const busy = useDescriptorScope().env?.disabled ?? false;
+  const two = props.columns === "2";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("mx-auto flex w-full flex-col gap-7", two ? "max-w-[980px]" : "max-w-[740px]"),
+      children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(
+            "h1",
+            {
+              className: cn(
+                "text-[32px] leading-[1.1] text-balance text-foreground sm:text-[38px] sm:leading-[1.08]",
+                headingClass(700, true)
+              ),
+              children: props.headline
+            }
+          ),
+          props.lede ? /* @__PURE__ */ jsx("p", { className: "mt-3.5 max-w-[62ch] text-[17px] leading-relaxed text-muted-foreground", children: props.lede }) : null
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-style-panel": "",
+            className: cn(RADIUS, panelSurfaceClass, panelFlatShadowClass, "p-7 max-sm:p-5"),
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "grid gap-8",
+                    two && "md:block md:columns-2 md:gap-x-10 md:[&>*+*]:mt-8 md:[&>*>h2]:break-after-avoid md:[&>*>*:not(h2)]:break-inside-avoid"
+                  ),
+                  children
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "sticky bottom-0 z-[2] -mx-7 -mb-7 mt-7 flex items-center justify-between gap-4 rounded-b-[calc(var(--radius,0.5rem)*1.5)] border-t border-border [background-color:var(--panel-fill,var(--card,hsl(0_0%_100%)))] px-7 pt-[18px] pb-7 max-sm:-mx-5 max-sm:-mb-5 max-sm:flex-col-reverse max-sm:items-stretch max-sm:px-5 max-sm:pb-5", children: [
+                host.eta ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 text-sm text-muted-foreground max-sm:justify-center", children: [
+                  /* @__PURE__ */ jsx(Clock, { className: "size-4", "aria-hidden": "true" }),
+                  " ",
+                  host.eta
+                ] }) : /* @__PURE__ */ jsx("span", {}),
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    disabled: busy,
+                    onClick: () => emit("press"),
+                    className: cn(
+                      "inline-flex min-h-11 items-center justify-center gap-2 rounded-[var(--radius,0.5rem)] bg-primary px-[22px] text-[15px] font-semibold text-primary-foreground transition-all hover:bg-primary/90",
+                      actionShadowClass,
+                      focusOutlineClass,
+                      "disabled:cursor-not-allowed disabled:opacity-60 disabled:hover:bg-primary"
+                    ),
+                    children: [
+                      props.runLabel,
+                      " ",
+                      /* @__PURE__ */ jsx(ArrowRight, { className: "size-4", "aria-hidden": "true" })
+                    ]
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        props.notes && props.notes.length > 0 ? /* @__PURE__ */ jsx("ul", { className: "grid gap-x-8 gap-y-2.5 px-1 sm:grid-cols-2", children: props.notes.map((note, index) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2.5 text-sm text-muted-foreground", children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: linkTextClass, children: "\u2713" }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-0", children: note })
+        ] }, index)) }) : null
+      ]
+    }
+  );
 }
-function useResultSlot() {
-  return React3.useContext(ResultSlotContext);
+function FieldGroup({ props, children }) {
+  return /* @__PURE__ */ jsxs("section", { className: "flex min-w-0 flex-col gap-5", children: [
+    props.title ? /* @__PURE__ */ jsx("h2", { className: cn("text-[17px] leading-snug text-foreground", headingClass(600)), children: props.title }) : null,
+    children
+  ] });
 }
-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: [
+function ResultHeader({ props }) {
+  const host = useFrameHost();
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-6 max-sm:flex-col", children: [
+    /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+      props.eyebrow ? /* @__PURE__ */ jsx("p", { className: cn("mb-1.5 text-[13px] font-semibold", linkTextClass), children: props.eyebrow }) : null,
+      /* @__PURE__ */ jsx(
+        "h1",
+        {
+          className: cn(
+            "text-[28px] leading-[1.12] text-balance text-foreground sm:text-[32px]",
+            headingClass(700, true)
+          ),
+          children: props.title
+        }
+      ),
+      props.subtitle ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-[15px] text-muted-foreground", children: props.subtitle }) : null
+    ] }),
+    host.actions && host.actions.length > 0 && host.onAction ? /* @__PURE__ */ jsx("div", { className: "flex shrink-0 gap-2", children: host.actions.map((label, i) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => host.onAction?.(label),
+        className: cn(
+          "inline-flex min-h-11 items-center rounded-[var(--radius,0.5rem)] px-4 text-sm font-semibold sm:min-h-9",
+          focusOutlineClass,
+          i === 0 ? "bg-primary text-primary-foreground" : "border border-border bg-background text-foreground"
+        ),
+        children: label
+      },
+      `${i}-${label}`
+    )) }) : null
+  ] });
+}
+function segmentMix(index, count) {
+  return count <= 1 ? 100 : Math.round(100 - index * 75 / (count - 1));
+}
+function segmentColor(index, count) {
+  return `color-mix(in oklab, var(--link, var(--primary, hsl(240 5.9% 10%))) ${segmentMix(index, count)}%, var(--muted, hsl(240 4.8% 95.9%)))`;
+}
+function amount(value, unit) {
+  if (unit && /^[A-Z]{3}$/.test(unit)) {
+    try {
+      return new Intl.NumberFormat("en-GB", {
+        style: "currency",
+        currency: unit,
+        maximumFractionDigits: 0
+      }).format(value);
+    } catch {
+    }
+  }
+  const n = new Intl.NumberFormat("en-GB", { maximumFractionDigits: 2 }).format(value);
+  return unit ? `${n} ${unit}` : n;
+}
+function ProportionBar({ props }) {
+  const rows = (Array.isArray(props.items) ? props.items : []).filter(
+    (row) => typeof row === "object" && row !== null && !Array.isArray(row)
+  );
+  const amountOf = (raw) => typeof raw === "object" && raw !== null ? Number.NaN : Number(raw ?? 0);
+  const parts = rows.map((row) => ({
+    label: textOf(row[props.labelKey]),
+    value: amountOf(row[props.valueKey])
+  })).filter((p) => Number.isFinite(p.value) && p.value > 0);
+  const sum = parts.reduce((s, p) => s + p.value, 0);
+  const total = typeof props.total === "number" ? props.total : sum;
+  const scale = Math.max(sum, total, typeof props.of === "number" ? props.of : 0) || 1;
+  const cap = (s) => s.charAt(0).toUpperCase() + s.slice(1);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-style-panel": "",
+      className: cn(
+        RADIUS,
+        panelSurfaceClass,
+        panelFlatShadowClass,
+        "flex flex-col gap-3.5 px-6 py-5"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-baseline gap-x-2.5", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-[15px] text-muted-foreground", children: props.label }),
+          /* @__PURE__ */ jsx("strong", { className: "text-2xl font-semibold tabular-nums text-foreground", children: amount(total, props.unit) }),
+          typeof props.of === "number" ? /* @__PURE__ */ jsxs("span", { className: "text-[15px] text-muted-foreground", children: [
+            "of ",
+            amount(props.of, props.unit)
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex h-2 gap-0.5 overflow-hidden rounded-full bg-muted", "aria-hidden": "true", children: parts.map((p, i) => /* @__PURE__ */ jsx(
+          "span",
+          {
+            style: {
+              width: `${p.value / scale * 100}%`,
+              background: segmentColor(i, parts.length)
+            }
+          },
+          `${i}-${p.label}`
+        )) }),
+        /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-x-5 gap-y-1", children: parts.map((p, i) => /* @__PURE__ */ jsxs(
+          "li",
+          {
+            className: "inline-flex items-center gap-2 text-sm text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: "size-2 rounded-[2px]",
+                  style: {
+                    background: segmentColor(i, parts.length)
+                  },
+                  "aria-hidden": "true"
+                }
+              ),
+              cap(p.label),
+              " ",
+              amount(p.value, props.unit)
+            ]
+          },
+          `${i}-${p.label}`
+        )) })
+      ]
+    }
+  );
+}
+var COLOR_VALUE = /^(?:#[0-9a-f]{3,8}|(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch)\([\w\s.,%/+-]*\)|[a-z]+)$/i;
+function Swatches({ props }) {
+  const colors = (props.colors ?? []).filter(
+    (c) => typeof c === "string" && COLOR_VALUE.test(c.trim())
+  );
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: colors.map((color, i) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
     /* @__PURE__ */ jsx(
-      "img",
+      "span",
       {
-        src: brand.logo.onLight,
-        alt: brand.name,
-        referrerPolicy: "no-referrer",
-        className: "h-7 w-auto dark:hidden"
+        className: "h-7 w-11 rounded-[3px] border border-border",
+        style: { backgroundColor: color.trim() }
       }
     ),
+    /* @__PURE__ */ jsx("span", { className: "font-mono text-[11px] text-muted-foreground", children: color })
+  ] }, `${color}-${i}`)) });
+}
+var ASPECT = {
+  "16:9": "aspect-video",
+  "4:3": "aspect-[4/3]",
+  "1:1": "aspect-square"
+};
+function Picture({
+  props
+}) {
+  const written = typeof props.path === "string" ? props.path : void 0;
+  const path = useAbsolute(written ?? "");
+  const value = useStateValue(path);
+  const resolve = useResolveUrl();
+  const content = written === void 0 ? void 0 : readImageContent(value);
+  const src = content ? viewableUrl(resolve?.(content.url)) ?? viewableUrl(content.publicUrl) ?? viewableUrl(content.url) : void 0;
+  const aspect = props.aspect && props.aspect !== "auto" ? ASPECT[props.aspect] : void 0;
+  if (!src) return null;
+  return /* @__PURE__ */ jsx(
+    "img",
+    {
+      src,
+      alt: props.alt ?? content?.caption ?? "",
+      referrerPolicy: "no-referrer",
+      className: cn(
+        "block w-full rounded-[var(--radius,0.5rem)] border border-border bg-muted object-cover",
+        aspect
+      )
+    }
+  );
+}
+function present(value) {
+  return value !== void 0 && value !== null && value !== "";
+}
+function Fact({
+  props
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 rounded-[var(--radius,0.5rem)] border border-border bg-background px-4 py-3", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-[13px] text-muted-foreground", children: props.label }),
+    /* @__PURE__ */ jsx("span", { className: "text-[16px] font-medium text-foreground tabular-nums", children: present(props.value) ? textOf(props.value) : "\u2014" }),
+    props.detail ? /* @__PURE__ */ jsx("span", { className: "text-[13px] text-muted-foreground", children: props.detail }) : null
+  ] });
+}
+function Detail({ props }) {
+  if (!present(props.value)) return null;
+  return (
+    // A rule between the rows of a list of details, never under one set in a
+    // row: there it read as an underline on every detail but the last.
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[minmax(0,8.5rem)_minmax(0,1fr)] gap-3 border-b border-border py-2.5 text-[14px] last:border-b-0 [.flex-row>&]:border-b-0 [.flex-row>&]:grid-cols-[auto_minmax(0,1fr)]", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: props.label }),
+      /* @__PURE__ */ jsx("span", { className: "text-foreground", children: textOf(props.value) })
+    ] })
+  );
+}
+var DATE_STYLES = {
+  long: { weekday: "long", day: "numeric", month: "long", year: "numeric", timeZone: "UTC" },
+  short: { day: "numeric", month: "short", year: "numeric", timeZone: "UTC" },
+  weekday: { weekday: "short", day: "numeric", month: "long", timeZone: "UTC" }
+};
+function DateText({ props }) {
+  const date = asDate(props.value);
+  if (!date) return null;
+  const tone = props.tone === "accent" ? cn("text-[13px] font-semibold", linkTextClass) : props.tone === "muted" ? "text-sm text-muted-foreground" : "text-[15px] text-foreground";
+  return /* @__PURE__ */ jsx("span", { className: cn("block", tone), children: date.toLocaleDateString("en-GB", DATE_STYLES[props.style ?? "long"]) });
+}
+function TextList({ props }) {
+  const items = Array.isArray(props.items) ? props.items.filter((x) => typeof x === "string" && x.trim()) : [];
+  if (items.length === 0) return null;
+  const marker = props.marker ?? "bullet";
+  const List2 = marker === "number" ? "ol" : "ul";
+  return /* @__PURE__ */ jsx(List2, { className: "flex flex-col gap-2.5", children: items.map((text, index) => /* @__PURE__ */ jsxs("li", { className: "flex gap-3 text-[15px] leading-relaxed text-foreground", children: [
     /* @__PURE__ */ jsx(
-      "img",
+      "span",
       {
-        src: brand.logo.onDark,
-        alt: brand.name,
-        referrerPolicy: "no-referrer",
-        className: "hidden h-7 w-auto dark:block"
+        "aria-hidden": "true",
+        className: cn(
+          "mt-[0.55em] shrink-0",
+          marker === "bullet" && "size-1.5 rounded-full bg-[color:var(--link,var(--primary,hsl(240_5.9%_10%)))]",
+          marker === "number" && cn("mt-0 min-w-5 text-sm font-semibold tabular-nums", linkTextClass),
+          marker === "check" && cn("mt-0", linkTextClass)
+        ),
+        children: marker === "number" ? `${index + 1}.` : marker === "check" ? "\u2713" : null
       }
     ),
-    /* @__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: "rounded-sm text-sm text-muted-foreground transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background focus-visible:outline-hidden",
-          children: link
-        },
-        link
-      )) }) : null,
-      props.tag ? /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: cn(
-            "min-w-0 truncate rounded-lg border px-2.5 py-1 font-mono text-[11px]",
-            selectedBorderClass,
-            selectedFillClass,
-            linkTextClass
-          ),
-          children: props.tag
-        }
-      ) : null
-    ] })
-  ] }) });
+    /* @__PURE__ */ jsx("span", { className: "min-w-0", children: String(text) })
+  ] }, index)) });
+}
+var frameRenderers = withDeclaredProps(
+  frameComponents,
+  {
+    TextList: (ctx) => /* @__PURE__ */ jsx(TextList, { ...ctx }),
+    DateText: (ctx) => /* @__PURE__ */ jsx(DateText, { ...ctx }),
+    Composer: (ctx) => /* @__PURE__ */ jsx(Composer, { ...ctx }),
+    FieldGroup: (ctx) => /* @__PURE__ */ jsx(FieldGroup, { ...ctx }),
+    ResultHeader: (ctx) => /* @__PURE__ */ jsx(ResultHeader, { ...ctx }),
+    ProportionBar: (ctx) => /* @__PURE__ */ jsx(ProportionBar, { ...ctx }),
+    Swatches: (ctx) => /* @__PURE__ */ jsx(Swatches, { ...ctx }),
+    Picture: (ctx) => /* @__PURE__ */ jsx(Picture, { ...ctx }),
+    Fact: (ctx) => /* @__PURE__ */ jsx(Fact, { ...ctx }),
+    Detail: (ctx) => /* @__PURE__ */ jsx(Detail, { ...ctx })
+  },
+  // A refused `path` reaches the renderer as refused: its nearest value, the
+  // empty text, is the item itself inside a repeat.
+  { Picture: ["path"] }
+);
+var ResultSlotContext = React5.createContext(null);
+function ResultSlotProvider({
+  slot,
+  children
+}) {
+  return /* @__PURE__ */ jsx(ResultSlotContext.Provider, { value: slot, children });
+}
+function useResultSlot() {
+  return React5.useContext(ResultSlotContext);
+}
+var LABEL2 = "block text-[13.5px] leading-none font-medium text-foreground";
+function AppBar({ props }) {
+  return /* @__PURE__ */ jsx(BrandBar, { app: props.app, links: props.links, tag: props.tag });
 }
 function Hero({ props }) {
   return /* @__PURE__ */ jsxs("section", { className: "pt-12 pb-10 sm:pt-14 sm:pb-12", children: [
@@ -2799,7 +1578,7 @@ function Hero({ props }) {
   ] });
 }
 function Workspace({ props, children }) {
-  const [work, rail] = React3.Children.toArray(children);
+  const [work, rail] = React5.Children.toArray(children);
   const railLeft = props.rail === "left";
   return /* @__PURE__ */ jsxs(
     "div",
@@ -2871,22 +1650,24 @@ function Rail({ props, children }) {
     )
   );
 }
-function present(value) {
+function present2(value) {
   return value !== void 0 && value !== null && value !== "";
 }
 function SummaryRow({ props }) {
-  const text = [props.value, props.detail].filter(present).map(String).join(props.separator ?? " ");
+  const text = [props.value, props.detail].filter(present2).map(textOf).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 }) {
+  const busy = useDescriptorScope().env?.disabled ?? false;
   return /* @__PURE__ */ jsxs("div", { className: "mt-6", children: [
     /* @__PURE__ */ jsx(
       "button",
       {
         type: "button",
+        disabled: busy,
         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 transition-all hover:bg-primary/90",
@@ -2894,7 +1675,8 @@ function Cta({ props, emit }) {
           // it had. Focus is an outline, which no shadow a style sets can
           // replace or hide.
           actionShadowClass,
-          focusOutlineClass
+          focusOutlineClass,
+          "disabled:cursor-not-allowed disabled:opacity-60 disabled:hover:bg-primary"
         ),
         children: props.label
       }
@@ -2925,7 +1707,7 @@ function useTextField(props, bindings) {
     props.value ?? void 0,
     bindings?.value
   );
-  const [localValue, setLocalValue] = React3.useState("");
+  const [localValue, setLocalValue] = React5.useState("");
   const isBound = Boolean(bindings?.value);
   const value = isBound ? boundValue ?? "" : localValue;
   const setValue = isBound ? setBoundValue : setLocalValue;
@@ -3005,16 +1787,21 @@ function BrandTextarea({
 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 })
+    // Held to their definitions as the base and frame renderers are
+    // (`declared-props.ts`).
+    ...withDeclaredProps(catalog.data.components, {
+      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 })
+    }),
+    ...frameRenderers
   }
 });
 function GenerativePage({
@@ -3024,109 +1811,85 @@ function GenerativePage({
   onRun,
   loading,
   registry = generativeRegistry,
-  brand
+  brand,
+  onElementError
 }) {
   const { inputs, result, env, idPrefix } = scope;
-  const stableScope = React3.useMemo(
+  const stableScope = React5.useMemo(
     () => ({ inputs, result, env, idPrefix }),
     [inputs, result, env, idPrefix]
   );
-  const latest = React3.useRef({ onRun, store });
-  React3.useEffect(() => {
+  const latest = React5.useRef({ onRun, store });
+  React5.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
+  const report = React5.useRef(onElementError);
+  React5.useInsertionEffect(() => {
+    report.current = onElementError;
+  });
+  const [made] = React5.useState(() => /* @__PURE__ */ new Map());
+  const pageRegistry = React5.useMemo(
+    () => reportingRegistry(registry, report, made),
+    [registry, made]
   );
-}
-
-// 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 (isNativeValueNode(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]);
+  const rootType = spec?.elements?.[spec.root]?.type ?? "root";
+  const specContent = React5.useMemo(() => contentOf(spec), [spec]);
+  const reporting = onElementError !== void 0;
+  const running = React5.useRef(false);
+  const [handlers] = React5.useState(() => {
+    const release = () => {
+      setTimeout(() => {
+        running.current = false;
+      }, 0);
+    };
+    return {
+      run: () => {
+        if (running.current) return void 0;
+        running.current = true;
+        let pending;
+        try {
+          pending = latest.current.onRun?.(latest.current.store.getSnapshot());
+        } catch (error) {
+          release();
+          throw error;
+        }
+        if (isThenable(pending)) {
+          const settled = Promise.resolve(pending);
+          settled.then(release, release);
+          return settled;
         }
+        release();
+        return void 0;
       }
-      return out;
+    };
+  });
+  const page = /* @__PURE__ */ jsx(DescriptorProvider, { scope: stableScope, children: /* @__PURE__ */ jsx(JSONUIProvider, { registry: pageRegistry, store, handlers, children: /* @__PURE__ */ jsx(ReportingContext.Provider, { value: reporting, children: /* @__PURE__ */ jsx(
+    ElementBoundary,
+    {
+      type: rootType,
+      report,
+      reporting,
+      resetOn: specContent,
+      children: /* @__PURE__ */ jsx(Renderer, { spec, registry: pageRegistry, loading })
     }
-    case "document":
-    case "image":
-    case "text":
-    case "prose":
-    case "number":
-    case "boolean":
-    case "enum":
-    case "unknown":
-      return payload;
-    default:
-      return field;
-  }
+  ) }) }) });
+  return brand ? /* @__PURE__ */ jsx(BrandProvider, { manifest: brand, children: page }) : page;
 }
-
-// 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"}`
-    );
+function contentOf(spec) {
+  try {
+    return JSON.stringify(spec);
+  } catch {
+    return spec;
   }
-  return parts.join(" \xB7 ");
 }
-function findFixture(fixtures, pipeRef, id) {
-  const found = fixtures.find(
-    (fixture) => fixture.pipeRef === pipeRef && fixtureId(fixture) === id
+function useStoreSnapshot(store) {
+  return React5.useSyncExternalStore(
+    store.subscribe,
+    store.getSnapshot,
+    store.getServerSnapshot ?? store.getSnapshot
   );
-  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_BRIEF_CONCEPT, DESIGNER_CATALOG_CONCEPT, DescriptorProvider, GenerativePage, ICON_NAMES, INPUTS_ROOT, METRIC_FORMATS, PICKED_SHADCN, PRODUCT_COMPONENTS, PROMPT_HASH, RESULT_ROOT, ResultSlotProvider, absoluteHatchPath, catalog, designerCatalog, fieldAtSegments, findFixture, fixtureId, fixtureLabel, formatProblems, generativeRegistry, generativeRenderers, inputBrief, inputFieldAtPath, isDelegatedInput, isDelegatedResult, joinPath, jsonlLines, layoutFits, layoutProblems, pathFromDomId, payloadToState, repeatBasePathOf, resultBrief, resultFieldAtPath, segmentsUnder, specFromJsonl, specToJsonl, useBrand, useDescriptorScope, useResultSlot, useStoreSnapshot, validateAgainstCatalog };
+export { BrandBar, BrandProvider, DescriptorProvider, FrameHostProvider, GenerativePage, ResultSlotProvider, domIdFor, generativeRegistry, generativeRenderers, pathFromDomId, useBrand, useDescriptorScope, useFrameHost, useResultSlot, useStoreSnapshot };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map