@petrarca/sonnet-playground 0.8.0 → 0.9.0

package/dist/{chunk-6WI3N7JI.js → chunk-RGBSHXS5.js}

@@ -49,7 +49,10 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle,
-  DialogTrigger
+  DialogTrigger,
+  DangerZone,
+  ListRow,
+  ViewSwitch
 } from "@petrarca/sonnet-ui";
 import { useClipboard, useDisclosure } from "@petrarca/sonnet-core/hooks";
 import {
@@ -59,9 +62,144 @@ import {
   Pencil,
   Trash2,
   Plus,
-  Copy
+  Copy,
+  Network,
+  Shapes,
+  FileText,
+  Eraser
 } from "lucide-react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function ListRowSection() {
+  const actions = (name) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(IconButton, { label: `Edit ${name}`, onClick: () => toast(`Edit ${name}`), children: /* @__PURE__ */ jsx(Pencil, { className: "h-4 w-4" }) }),
+    /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        label: `Delete ${name}`,
+        tone: "destructive",
+        onClick: () => toast(`Delete ${name}`),
+        children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
+      }
+    )
+  ] });
+  return /* @__PURE__ */ jsx(
+    PlaygroundSection,
+    {
+      title: "List Row",
+      description: "One item of a short, bordered list: title, optional adornment and detail line, actions on the right. With onClick, the title area opens the item.",
+      variant: "card",
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-2 max-w-2xl", children: [
+        /* @__PURE__ */ jsx(
+          ListRow,
+          {
+            title: "product",
+            detail: "What a product is -- built-in, read-only."
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ListRow,
+          {
+            title: "github",
+            adornment: /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(Badge, { badgeColor: "indigo", children: "github" }),
+              /* @__PURE__ */ jsx(Badge, { badgeColor: "teal", children: "credential set" })
+            ] }),
+            detail: "https://github.com \xB7 used by 2 sources",
+            actions: actions("github")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ListRow,
+          {
+            title: "code",
+            onClick: () => toast("Open code"),
+            detail: "sentence_transformer \xB7 all-MiniLM-L6-v2 \xB7 pgvector",
+            actions: actions("code")
+          }
+        )
+      ] })
+    }
+  );
+}
+function DangerZoneSection() {
+  return /* @__PURE__ */ jsx(
+    PlaygroundSection,
+    {
+      title: "Danger Zone",
+      description: "The last section of a heavyweight item's Settings tab: what cannot be undone or reaches beyond the item. Each action says what it destroys; one not allowed yet is disabled with its reason (hover it). The caller confirms before acting.",
+      variant: "card",
+      children: /* @__PURE__ */ jsx("div", { className: "max-w-2xl", children: /* @__PURE__ */ jsx(
+        DangerZone,
+        {
+          actions: [
+            {
+              title: "Drop indexed data",
+              description: "Removes the chunks, vectors and graph; the source stays and can be indexed again.",
+              label: "Drop data",
+              icon: Eraser,
+              variant: "outline",
+              onClick: () => toast("Drop data")
+            },
+            {
+              title: "Delete this source",
+              description: "Removes the source and its indexed data. This cannot be undone.",
+              label: "Delete source",
+              icon: Trash2,
+              onClick: () => toast("Delete source")
+            },
+            {
+              title: "Delete this tenant",
+              description: "Removes the tenant and all its user assignments.",
+              label: "Delete tenant",
+              icon: Trash2,
+              onClick: () => toast("Delete tenant"),
+              disabledReason: "A provisioned tenant must be deactivated first."
+            }
+          ]
+        }
+      ) })
+    }
+  );
+}
+function ViewSwitchSection() {
+  const [view, setView] = useState("graph");
+  const [mode, setMode] = useState("semantic");
+  return /* @__PURE__ */ jsx(
+    PlaygroundSection,
+    {
+      title: "View Switch",
+      description: "A quiet row of icon + text buttons switching between the views or modes of one surface; the current one filled. Calmer than Tabs in a header or next to a query bar.",
+      variant: "card",
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-8", children: [
+        /* @__PURE__ */ jsx(
+          ViewSwitch,
+          {
+            label: "Views",
+            value: view,
+            onChange: setView,
+            options: [
+              { value: "graph", label: "Graph", icon: /* @__PURE__ */ jsx(Network, {}) },
+              { value: "model", label: "Model", icon: /* @__PURE__ */ jsx(Shapes, {}) },
+              { value: "description", label: "Description", icon: /* @__PURE__ */ jsx(FileText, {}) }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ViewSwitch,
+          {
+            label: "Search mode",
+            value: mode,
+            onChange: setMode,
+            options: [
+              { value: "semantic", label: "Semantic" },
+              { value: "text", label: "Text" }
+            ]
+          }
+        )
+      ] })
+    }
+  );
+}
 function SelectSection() {
   const [fruit, setFruit] = useState("");
   const [tz, setTz] = useState("cet");
@@ -1215,6 +1353,9 @@ function PlayCoreComponents() {
           ] })
         }
       ),
+      /* @__PURE__ */ jsx(ListRowSection, {}),
+      /* @__PURE__ */ jsx(DangerZoneSection, {}),
+      /* @__PURE__ */ jsx(ViewSwitchSection, {}),
       /* @__PURE__ */ jsxs(
         PlaygroundSection,
         {
@@ -1290,4 +1431,4 @@ function PlayCoreComponents() {
 export {
   PlayCoreComponents
 };
-//# sourceMappingURL=chunk-6WI3N7JI.js.map
+//# sourceMappingURL=chunk-RGBSHXS5.js.map

package/dist/chunk-RGBSHXS5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/pages/PlayCoreComponents.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { toast } from \"sonner\";\nimport { PlaygroundSection } from \"../PlaygroundSection\";\nimport {\n  Spinner,\n  Button,\n  IconButton,\n  Badge,\n  Alert,\n  AlertDescription,\n  AlertTitle,\n  Separator,\n  ResizeHandle,\n  Input,\n  Textarea,\n  Checkbox,\n  Label,\n  DateInput,\n  TimeInput,\n  DateTimeInput,\n  Select,\n  SelectTrigger,\n  SelectValue,\n  SelectContent,\n  SelectItem,\n  SelectGroup,\n  SelectLabel,\n  SelectSeparator,\n  Avatar,\n  AvatarImage,\n  AvatarFallback,\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n  Card,\n  CardContent,\n  CardDescription,\n  CardFooter,\n  CardHeader,\n  CardTitle,\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n  DangerZone,\n  ListRow,\n  ViewSwitch,\n} from \"@petrarca/sonnet-ui\";\nimport { useClipboard, useDisclosure } from \"@petrarca/sonnet-core/hooks\";\nimport {\n  Info,\n  AlertTriangle,\n  CheckCircle,\n  Pencil,\n  Trash2,\n  Plus,\n  Copy,\n  Network,\n  Shapes,\n  FileText,\n  Eraser,\n} from \"lucide-react\";\n\n/** ListRowSection — showcase for ListRow: one item of a short, bordered list. */\nfunction ListRowSection() {\n  const actions = (name: string) => (\n    <>\n      <IconButton label={`Edit ${name}`} onClick={() => toast(`Edit ${name}`)}>\n        <Pencil className=\"h-4 w-4\" />\n      </IconButton>\n      <IconButton\n        label={`Delete ${name}`}\n        tone=\"destructive\"\n        onClick={() => toast(`Delete ${name}`)}\n      >\n        <Trash2 className=\"h-4 w-4\" />\n      </IconButton>\n    </>\n  );\n  return (\n    <PlaygroundSection\n      title=\"List Row\"\n      description=\"One item of a short, bordered list: title, optional adornment and detail line, actions on the right. With onClick, the title area opens the item.\"\n      variant=\"card\"\n    >\n      <div className=\"space-y-2 max-w-2xl\">\n        <ListRow\n          title=\"product\"\n          detail=\"What a product is -- built-in, read-only.\"\n        />\n        <ListRow\n          title=\"github\"\n          adornment={\n            <>\n              <Badge badgeColor=\"indigo\">github</Badge>\n              <Badge badgeColor=\"teal\">credential set</Badge>\n            </>\n          }\n          detail=\"https://github.com · used by 2 sources\"\n          actions={actions(\"github\")}\n        />\n        <ListRow\n          title=\"code\"\n          onClick={() => toast(\"Open code\")}\n          detail=\"sentence_transformer · all-MiniLM-L6-v2 · pgvector\"\n          actions={actions(\"code\")}\n        />\n      </div>\n    </PlaygroundSection>\n  );\n}\n\n/** DangerZoneSection -- showcase for DangerZone: the end of a heavyweight item's Settings tab. */\nfunction DangerZoneSection() {\n  return (\n    <PlaygroundSection\n      title=\"Danger Zone\"\n      description=\"The last section of a heavyweight item's Settings tab: what cannot be undone or reaches beyond the item. Each action says what it destroys; one not allowed yet is disabled with its reason (hover it). The caller confirms before acting.\"\n      variant=\"card\"\n    >\n      <div className=\"max-w-2xl\">\n        <DangerZone\n          actions={[\n            {\n              title: \"Drop indexed data\",\n              description:\n                \"Removes the chunks, vectors and graph; the source stays and can be indexed again.\",\n              label: \"Drop data\",\n              icon: Eraser,\n              variant: \"outline\",\n              onClick: () => toast(\"Drop data\"),\n            },\n            {\n              title: \"Delete this source\",\n              description:\n                \"Removes the source and its indexed data. This cannot be undone.\",\n              label: \"Delete source\",\n              icon: Trash2,\n              onClick: () => toast(\"Delete source\"),\n            },\n            {\n              title: \"Delete this tenant\",\n              description: \"Removes the tenant and all its user assignments.\",\n              label: \"Delete tenant\",\n              icon: Trash2,\n              onClick: () => toast(\"Delete tenant\"),\n              disabledReason: \"A provisioned tenant must be deactivated first.\",\n            },\n          ]}\n        />\n      </div>\n    </PlaygroundSection>\n  );\n}\n\n/** ViewSwitchSection -- showcase for ViewSwitch: the views of one surface. */\nfunction ViewSwitchSection() {\n  const [view, setView] = useState(\"graph\");\n  const [mode, setMode] = useState(\"semantic\");\n  return (\n    <PlaygroundSection\n      title=\"View Switch\"\n      description=\"A quiet row of icon + text buttons switching between the views or modes of one surface; the current one filled. Calmer than Tabs in a header or next to a query bar.\"\n      variant=\"card\"\n    >\n      <div className=\"flex flex-wrap items-center gap-8\">\n        <ViewSwitch\n          label=\"Views\"\n          value={view}\n          onChange={setView}\n          options={[\n            { value: \"graph\", label: \"Graph\", icon: <Network /> },\n            { value: \"model\", label: \"Model\", icon: <Shapes /> },\n            { value: \"description\", label: \"Description\", icon: <FileText /> },\n          ]}\n        />\n        <ViewSwitch\n          label=\"Search mode\"\n          value={mode}\n          onChange={setMode}\n          options={[\n            { value: \"semantic\", label: \"Semantic\" },\n            { value: \"text\", label: \"Text\" },\n          ]}\n        />\n      </div>\n    </PlaygroundSection>\n  );\n}\n\n/** SelectSection — showcase for the Select primitive. */\nfunction SelectSection() {\n  const [fruit, setFruit] = useState(\"\");\n  const [tz, setTz] = useState(\"cet\");\n\n  return (\n    <PlaygroundSection\n      title=\"Select\"\n      description=\"Single-value dropdown built on Radix Select. Styled trigger, keyboard navigable, with optional groups and labels. For searchable or entity-backed selection use FormSelect / EntitySelect instead.\"\n      variant=\"card\"\n    >\n      <div className=\"grid grid-cols-1 gap-6 md:grid-cols-3\">\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"select-fruit\">Basic (with placeholder)</Label>\n          <Select value={fruit} onValueChange={setFruit}>\n            <SelectTrigger id=\"select-fruit\">\n              <SelectValue placeholder=\"Select a fruit\" />\n            </SelectTrigger>\n            <SelectContent>\n              <SelectItem value=\"apple\">Apple</SelectItem>\n              <SelectItem value=\"banana\">Banana</SelectItem>\n              <SelectItem value=\"cherry\">Cherry</SelectItem>\n              <SelectItem value=\"durian\" disabled>\n                Durian (out of stock)\n              </SelectItem>\n            </SelectContent>\n          </Select>\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{fruit || \"(none)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"select-tz\">Grouped options</Label>\n          <Select value={tz} onValueChange={setTz}>\n            <SelectTrigger id=\"select-tz\">\n              <SelectValue />\n            </SelectTrigger>\n            <SelectContent>\n              <SelectGroup>\n                <SelectLabel>Europe</SelectLabel>\n                <SelectItem value=\"cet\">Central European</SelectItem>\n                <SelectItem value=\"gmt\">Greenwich Mean</SelectItem>\n              </SelectGroup>\n              <SelectSeparator />\n              <SelectGroup>\n                <SelectLabel>Americas</SelectLabel>\n                <SelectItem value=\"est\">Eastern</SelectItem>\n                <SelectItem value=\"pst\">Pacific</SelectItem>\n              </SelectGroup>\n            </SelectContent>\n          </Select>\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{tz}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"select-disabled\">Disabled</Label>\n          <Select disabled value=\"apple\">\n            <SelectTrigger id=\"select-disabled\">\n              <SelectValue />\n            </SelectTrigger>\n            <SelectContent>\n              <SelectItem value=\"apple\">Apple</SelectItem>\n            </SelectContent>\n          </Select>\n        </div>\n      </div>\n    </PlaygroundSection>\n  );\n}\n\n/** DateInputSection — showcase for the DateInput primitive across precisions. */\nfunction DateInputSection() {\n  const [dateDay, setDateDay] = useState(\"2026-06-15\");\n  const [dateMonth, setDateMonth] = useState(\"1980-06\");\n  const [dateYear, setDateYear] = useState(\"1980\");\n  const [dateEmpty, setDateEmpty] = useState(\"\");\n\n  return (\n    <PlaygroundSection\n      title=\"Date Input\"\n      description=\"Text input with a calendar popover. Value is a partial ISO 8601 date string (YYYY, YYYY-MM, or YYYY-MM-DD depending on precision). Display and parsing follow the playground locale (gear icon, top-right of the Overview page); values stay ISO. Supports typed entry, calendar drill-down, and quick entry ('t', 'today', '.').\"\n      variant=\"card\"\n    >\n      <div className=\"grid grid-cols-1 gap-6 md:grid-cols-2\">\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"date-day\">Day precision (YYYY-MM-DD)</Label>\n          <DateInput id=\"date-day\" value={dateDay} onChange={setDateDay} />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{dateDay || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"date-month\">Month precision (YYYY-MM)</Label>\n          <DateInput\n            id=\"date-month\"\n            precision=\"month\"\n            value={dateMonth}\n            onChange={setDateMonth}\n          />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{dateMonth || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"date-year\">Year precision (YYYY)</Label>\n          <DateInput\n            id=\"date-year\"\n            precision=\"year\"\n            value={dateYear}\n            onChange={setDateYear}\n          />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{dateYear || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"date-empty\">Empty + clearable</Label>\n          <DateInput\n            id=\"date-empty\"\n            value={dateEmpty}\n            onChange={setDateEmpty}\n            placeholder=\"Pick or type a date\"\n          />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{dateEmpty || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"date-disabled\">Disabled</Label>\n          <DateInput\n            id=\"date-disabled\"\n            value=\"2026-01-01\"\n            onChange={() => {}}\n            disabled\n          />\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"date-error\">With error</Label>\n          <DateInput\n            id=\"date-error\"\n            value=\"\"\n            onChange={() => {}}\n            error=\"This date is required\"\n          />\n        </div>\n      </div>\n    </PlaygroundSection>\n  );\n}\n\n/** TimeInputSection — showcase for the zone-free TimeInput primitive. */\nfunction TimeInputSection() {\n  const [timeMin, setTimeMin] = useState(\"09:30\");\n  const [timeSec, setTimeSec] = useState(\"21:05:07\");\n  const [timeEmpty, setTimeEmpty] = useState(\"\");\n\n  return (\n    <PlaygroundSection\n      title=\"Time Input\"\n      description=\"Zone-free time of day. Value is a normalized ISO time string (HH:mm or HH:mm:ss). No timezone. Supports lenient typed entry ('9', '930', '9:30') and quick entry (type 'n', 'now', or '.' for the current time).\"\n      variant=\"card\"\n    >\n      <div className=\"grid grid-cols-1 gap-6 md:grid-cols-2\">\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"time-min\">Minute granularity (HH:mm)</Label>\n          <TimeInput id=\"time-min\" value={timeMin} onChange={setTimeMin} />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{timeMin || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"time-sec\">Second granularity (HH:mm:ss)</Label>\n          <TimeInput\n            id=\"time-sec\"\n            granularity=\"second\"\n            value={timeSec}\n            onChange={setTimeSec}\n          />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{timeSec || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"time-empty\">Empty + clearable</Label>\n          <TimeInput\n            id=\"time-empty\"\n            value={timeEmpty}\n            onChange={setTimeEmpty}\n          />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{timeEmpty || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label htmlFor=\"time-error\">With error</Label>\n          <TimeInput\n            id=\"time-error\"\n            value=\"\"\n            onChange={() => {}}\n            error=\"This time is required\"\n          />\n        </div>\n      </div>\n    </PlaygroundSection>\n  );\n}\n\n/** DateTimeInputSection — showcase for the composed DateTimeInput primitive. */\nfunction DateTimeInputSection() {\n  const [dt, setDt] = useState(\"2026-06-15T09:30\");\n  const [dtZoned, setDtZoned] = useState(\"2026-11-02T10:00\");\n  const [dtEmpty, setDtEmpty] = useState(\"\");\n\n  return (\n    <PlaygroundSection\n      title=\"Date-Time Input\"\n      description=\"Combined date + time for a plain wall-clock datetime (YYYY-MM-DDTHH:mm[:ss]), no timezone. Resolving to an absolute instant is the consumer's job. The optional timeZone prop is a display-only hint, never applied or user-entered.\"\n      variant=\"card\"\n    >\n      <div className=\"grid grid-cols-1 gap-6 md:grid-cols-2\">\n        <div className=\"space-y-2\">\n          <Label>Plain wall-clock</Label>\n          <DateTimeInput idPrefix=\"dt\" value={dt} onChange={setDt} />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{dt || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label>With timezone hint</Label>\n          <DateTimeInput\n            idPrefix=\"dt-zoned\"\n            value={dtZoned}\n            onChange={setDtZoned}\n            timeZone=\"Europe/Berlin\"\n          />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{dtZoned || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label>Second granularity + empty</Label>\n          <DateTimeInput\n            idPrefix=\"dt-empty\"\n            granularity=\"second\"\n            value={dtEmpty}\n            onChange={setDtEmpty}\n          />\n          <p className=\"text-xs text-tertiary-foreground\">\n            Value: <span className=\"font-mono\">{dtEmpty || \"(empty)\"}</span>\n          </p>\n        </div>\n\n        <div className=\"space-y-2\">\n          <Label>Disabled</Label>\n          <DateTimeInput\n            idPrefix=\"dt-disabled\"\n            value=\"2026-01-01T08:00\"\n            onChange={() => {}}\n            disabled\n          />\n        </div>\n      </div>\n    </PlaygroundSection>\n  );\n}\n\n/** PlayCoreComponents — showcase for all core UI primitives. */\nexport default function PlayCoreComponents() {\n  const [spinnerSize, setSpinnerSize] = useState<\"sm\" | \"md\" | \"lg\">(\"md\");\n  const clipboard = useClipboard({ timeout: 2000 });\n  const [disclosureOpened, disclosureHandlers] = useDisclosure(false);\n\n  return (\n    <div className=\"space-y-6\">\n      {/* Header */}\n      <div>\n        <h1>Core UI Components</h1>\n        <p className=\"text-sm text-muted-foreground mt-1\">\n          Test all core UI components in isolation before production deployment.\n          Each component is verified here first.\n        </p>\n      </div>\n\n      {/* Components Grid */}\n      <div className=\"space-y-6\">\n        {/* Buttons */}\n        <PlaygroundSection\n          title=\"Buttons\"\n          description=\"shadcn/ui Button component with all variants and sizes.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-6\">\n            {/* Variants */}\n            <div>\n              <h4 className=\"mb-3\">Variants</h4>\n              <div className=\"flex flex-wrap gap-3\">\n                <Button>Default</Button>\n                <Button variant=\"secondary\">Secondary</Button>\n                <Button variant=\"destructive\">Destructive</Button>\n                <Button variant=\"outline\">Outline</Button>\n                <Button variant=\"ghost\">Ghost</Button>\n                <Button variant=\"link\">Link</Button>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Sizes */}\n            <div>\n              <h4 className=\"mb-3\">Sizes</h4>\n              <div className=\"flex flex-wrap items-center gap-3\">\n                <Button size=\"sm\">Small</Button>\n                <Button size=\"default\">Default</Button>\n                <Button size=\"lg\">Large</Button>\n                <Button size=\"icon\">🔍</Button>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* States */}\n            <div>\n              <h4 className=\"mb-3\">States</h4>\n              <div className=\"flex flex-wrap gap-3\">\n                <Button disabled>Disabled</Button>\n                <Button variant=\"outline\" disabled>\n                  Disabled Outline\n                </Button>\n              </div>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Icon Buttons */}\n        <PlaygroundSection\n          title=\"Icon Button\"\n          description=\"Compact, square icon-only button with tooltip + accessible label. The house standard for inline affordances (edit/delete) and small toolbar actions.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-6\">\n            {/* Ghost (inline affordances) */}\n            <div>\n              <h4 className=\"mb-3\">Ghost (inline affordances)</h4>\n              <div className=\"flex flex-wrap items-center gap-2\">\n                <IconButton label=\"Edit\">\n                  <Pencil />\n                </IconButton>\n                <IconButton label=\"Delete\" tone=\"destructive\">\n                  <Trash2 />\n                </IconButton>\n                <IconButton label=\"Copy\">\n                  <Copy />\n                </IconButton>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Outline (toolbar actions) */}\n            <div>\n              <h4 className=\"mb-3\">Outline (toolbar actions)</h4>\n              <div className=\"flex flex-wrap items-center gap-2\">\n                <IconButton label=\"Add node type\" variant=\"outline\">\n                  <Plus />\n                </IconButton>\n                <IconButton\n                  label=\"Delete (outline)\"\n                  variant=\"outline\"\n                  tone=\"destructive\"\n                >\n                  <Trash2 />\n                </IconButton>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Disabled */}\n            <div>\n              <h4 className=\"mb-3\">Disabled</h4>\n              <div className=\"flex flex-wrap items-center gap-2\">\n                <IconButton label=\"Edit (disabled)\" disabled>\n                  <Pencil />\n                </IconButton>\n                <IconButton label=\"Add (disabled)\" variant=\"outline\" disabled>\n                  <Plus />\n                </IconButton>\n              </div>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Badges */}\n        <PlaygroundSection\n          title=\"Badges\"\n          description=\"Badge component with different variants.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-4\">\n            <div className=\"flex flex-wrap items-center gap-3\">\n              <Badge>Default</Badge>\n              <Badge variant=\"secondary\">Secondary</Badge>\n              <Badge variant=\"destructive\">Destructive</Badge>\n              <Badge variant=\"outline\">Outline</Badge>\n            </div>\n\n            <div className=\"flex flex-wrap items-center gap-3\">\n              <span className=\"text-sm text-muted-foreground\">Status:</span>\n              <Badge variant=\"default\">Active</Badge>\n              <Badge variant=\"secondary\">Pending</Badge>\n              <Badge variant=\"destructive\">Error</Badge>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Alerts */}\n        <PlaygroundSection\n          title=\"Alerts\"\n          description=\"Alert component for important messages.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-4\">\n            <Alert>\n              <Info className=\"h-4 w-4\" />\n              <AlertTitle>Info</AlertTitle>\n              <AlertDescription>\n                This is an informational message.\n              </AlertDescription>\n            </Alert>\n\n            <Alert variant=\"default\">\n              <CheckCircle className=\"h-4 w-4\" />\n              <AlertTitle>Success</AlertTitle>\n              <AlertDescription>\n                Your operation completed successfully.\n              </AlertDescription>\n            </Alert>\n\n            <Alert variant=\"destructive\">\n              <AlertTriangle className=\"h-4 w-4\" />\n              <AlertTitle>Error</AlertTitle>\n              <AlertDescription>\n                There was a problem with your request.\n              </AlertDescription>\n            </Alert>\n          </div>\n        </PlaygroundSection>\n\n        {/* Cards */}\n        <PlaygroundSection\n          title=\"Cards\"\n          description=\"Card component for content containers.\"\n          variant=\"card\"\n        >\n          <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n            <Card>\n              <CardHeader>\n                <CardTitle>Simple Card</CardTitle>\n                <CardDescription>\n                  Basic card with header and content\n                </CardDescription>\n              </CardHeader>\n              <CardContent>\n                <p className=\"text-sm text-muted-foreground\">\n                  This is a simple card component with header and content\n                  sections.\n                </p>\n              </CardContent>\n            </Card>\n\n            <Card>\n              <CardHeader>\n                <CardTitle>Card with Footer</CardTitle>\n                <CardDescription>Includes footer with actions</CardDescription>\n              </CardHeader>\n              <CardContent>\n                <p className=\"text-sm text-muted-foreground\">\n                  This card has a footer section for actions.\n                </p>\n              </CardContent>\n              <CardFooter className=\"flex gap-2\">\n                <Button variant=\"outline\" size=\"sm\">\n                  Cancel\n                </Button>\n                <Button size=\"sm\">Save</Button>\n              </CardFooter>\n            </Card>\n\n            <Card className=\"col-span-1 md:col-span-2\">\n              <CardHeader>\n                <CardTitle>Full Width Card</CardTitle>\n                <CardDescription>\n                  This card spans the full width\n                </CardDescription>\n              </CardHeader>\n              <CardContent>\n                <div className=\"space-y-2\">\n                  <p className=\"text-sm text-muted-foreground\">\n                    Cards can be combined with other components for rich\n                    layouts.\n                  </p>\n                  <div className=\"flex gap-2\">\n                    <Badge>Feature</Badge>\n                    <Badge variant=\"secondary\">New</Badge>\n                  </div>\n                </div>\n              </CardContent>\n            </Card>\n          </div>\n        </PlaygroundSection>\n\n        {/* Separator */}\n        <PlaygroundSection\n          title=\"Separator\"\n          description=\"Visual separator for content sections.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-4\">\n            <div>\n              <p className=\"text-sm\">Content above separator</p>\n              <Separator className=\"my-4\" />\n              <p className=\"text-sm\">Content below separator</p>\n            </div>\n\n            <div className=\"flex items-center gap-4\">\n              <p className=\"text-sm\">Vertical separator</p>\n              <Separator orientation=\"vertical\" className=\"h-6\" />\n              <p className=\"text-sm\">Between items</p>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Resize handle */}\n        <PlaygroundSection\n          title=\"Resize Handle\"\n          description=\"Draggable divider between two resizable panes. Quiet centered grip, hover to emphasise; wider invisible hit-area. Orientation-aware (consumer owns the resize math).\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-6\">\n            <div>\n              <p className=\"text-xs font-medium text-muted-foreground uppercase tracking-wide mb-2\">\n                Vertical (left / right panes)\n              </p>\n              <div className=\"flex h-32 rounded-md border overflow-hidden\">\n                <div className=\"flex-1 bg-muted/30 flex items-center justify-center text-sm text-muted-foreground\">\n                  Left pane\n                </div>\n                <ResizeHandle orientation=\"vertical\" />\n                <div className=\"flex-1 bg-muted/30 flex items-center justify-center text-sm text-muted-foreground\">\n                  Right pane\n                </div>\n              </div>\n            </div>\n\n            <div>\n              <p className=\"text-xs font-medium text-muted-foreground uppercase tracking-wide mb-2\">\n                Horizontal (top / bottom panes)\n              </p>\n              <div className=\"flex flex-col h-40 rounded-md border overflow-hidden\">\n                <div className=\"flex-1 bg-muted/30 flex items-center justify-center text-sm text-muted-foreground\">\n                  Top pane\n                </div>\n                <ResizeHandle orientation=\"horizontal\" />\n                <div className=\"flex-1 bg-muted/30 flex items-center justify-center text-sm text-muted-foreground\">\n                  Bottom pane\n                </div>\n              </div>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Tooltips */}\n        <PlaygroundSection\n          title=\"Tooltips\"\n          description=\"Tooltip component for additional information on hover.\"\n          variant=\"card\"\n        >\n          <TooltipProvider>\n            <div className=\"flex flex-wrap gap-6\">\n              <Tooltip>\n                <TooltipTrigger asChild>\n                  <Button variant=\"outline\">Hover me</Button>\n                </TooltipTrigger>\n                <TooltipContent>\n                  <p>This is a tooltip</p>\n                </TooltipContent>\n              </Tooltip>\n\n              <Tooltip>\n                <TooltipTrigger asChild>\n                  <Button>Top (default)</Button>\n                </TooltipTrigger>\n                <TooltipContent>\n                  <p>Tooltip positioned at top</p>\n                </TooltipContent>\n              </Tooltip>\n\n              <Tooltip>\n                <TooltipTrigger asChild>\n                  <Button variant=\"secondary\">With icon 🎯</Button>\n                </TooltipTrigger>\n                <TooltipContent>\n                  <p>Tooltips work with any trigger element</p>\n                </TooltipContent>\n              </Tooltip>\n            </div>\n          </TooltipProvider>\n        </PlaygroundSection>\n\n        {/* Dialogs & Modals */}\n        <PlaygroundSection\n          title=\"Dialogs\"\n          description=\"shadcn/ui Dialog component for modal interactions.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-6\">\n            {/* Basic Dialog */}\n            <div>\n              <h4 className=\"mb-3\">Basic Dialog</h4>\n              <Dialog>\n                <DialogTrigger asChild>\n                  <Button variant=\"outline\">Open Dialog</Button>\n                </DialogTrigger>\n                <DialogContent>\n                  <DialogHeader>\n                    <DialogTitle>Dialog Title</DialogTitle>\n                    <DialogDescription>\n                      This is a basic dialog with a title and description.\n                    </DialogDescription>\n                  </DialogHeader>\n                  <div className=\"py-4\">\n                    <p className=\"text-sm text-muted-foreground\">\n                      Dialog content goes here. You can add any components or\n                      text you need.\n                    </p>\n                  </div>\n                  <DialogFooter>\n                    <Button variant=\"outline\">Cancel</Button>\n                    <Button>Confirm</Button>\n                  </DialogFooter>\n                </DialogContent>\n              </Dialog>\n            </div>\n\n            <Separator />\n\n            {/* Confirmation Dialog */}\n            <div>\n              <h4 className=\"mb-3\">Confirmation Dialog</h4>\n              <Dialog>\n                <DialogTrigger asChild>\n                  <Button variant=\"destructive\">Delete Item</Button>\n                </DialogTrigger>\n                <DialogContent>\n                  <DialogHeader>\n                    <DialogTitle>Are you absolutely sure?</DialogTitle>\n                    <DialogDescription>\n                      This action cannot be undone. This will permanently delete\n                      your data from our servers.\n                    </DialogDescription>\n                  </DialogHeader>\n                  <DialogFooter>\n                    <Button variant=\"outline\">Cancel</Button>\n                    <Button\n                      variant=\"destructive\"\n                      onClick={() => {\n                        toast.success(\"Item deleted\");\n                      }}\n                    >\n                      Delete\n                    </Button>\n                  </DialogFooter>\n                </DialogContent>\n              </Dialog>\n            </div>\n\n            <Separator />\n\n            {/* Dialog with Form */}\n            <div>\n              <h4 className=\"mb-3\">Dialog with Form</h4>\n              <Dialog>\n                <DialogTrigger asChild>\n                  <Button>Add New Item</Button>\n                </DialogTrigger>\n                <DialogContent>\n                  <DialogHeader>\n                    <DialogTitle>Add New Item</DialogTitle>\n                    <DialogDescription>\n                      Fill in the details below to add a new item.\n                    </DialogDescription>\n                  </DialogHeader>\n                  <div className=\"grid gap-4 py-4\">\n                    <div className=\"grid gap-2\">\n                      <Label htmlFor=\"name\">Name</Label>\n                      <Input\n                        id=\"name\"\n                        type=\"text\"\n                        placeholder=\"Enter name...\"\n                      />\n                    </div>\n                    <div className=\"grid gap-2\">\n                      <Label htmlFor=\"description\">Description</Label>\n                      <Textarea\n                        id=\"description\"\n                        placeholder=\"Enter description...\"\n                        rows={3}\n                      />\n                    </div>\n                  </div>\n                  <DialogFooter>\n                    <Button variant=\"outline\">Cancel</Button>\n                    <Button\n                      onClick={() => {\n                        toast.success(\"Item added\");\n                      }}\n                    >\n                      Add Item\n                    </Button>\n                  </DialogFooter>\n                </DialogContent>\n              </Dialog>\n            </div>\n\n            <Separator />\n\n            {/* Information Dialog */}\n            <div>\n              <h4 className=\"mb-3\">Information Dialog</h4>\n              <Dialog>\n                <DialogTrigger asChild>\n                  <Button variant=\"secondary\">View Details</Button>\n                </DialogTrigger>\n                <DialogContent className=\"max-w-2xl\">\n                  <DialogHeader>\n                    <DialogTitle>System Information</DialogTitle>\n                    <DialogDescription>\n                      Detailed information about the current system status.\n                    </DialogDescription>\n                  </DialogHeader>\n                  <div className=\"space-y-4 py-4\">\n                    <div className=\"grid grid-cols-2 gap-4\">\n                      <div>\n                        <p className=\"text-sm font-medium text-foreground\">\n                          Status\n                        </p>\n                        <Badge variant=\"default\" className=\"mt-1\">\n                          Active\n                        </Badge>\n                      </div>\n                      <div>\n                        <p className=\"text-sm font-medium text-foreground\">\n                          Version\n                        </p>\n                        <p className=\"text-sm text-muted-foreground mt-1\">\n                          1.0.0\n                        </p>\n                      </div>\n                      <div>\n                        <p className=\"text-sm font-medium text-foreground\">\n                          Environment\n                        </p>\n                        <p className=\"text-sm text-muted-foreground mt-1\">\n                          Production\n                        </p>\n                      </div>\n                      <div>\n                        <p className=\"text-sm font-medium text-foreground\">\n                          Region\n                        </p>\n                        <p className=\"text-sm text-muted-foreground mt-1\">\n                          US-East\n                        </p>\n                      </div>\n                    </div>\n                    <Separator />\n                    <div>\n                      <p className=\"text-sm font-medium text-foreground mb-2\">\n                        Description\n                      </p>\n                      <p className=\"text-sm text-muted-foreground\">\n                        This is an example of an information dialog that\n                        displays system details. It can contain various types of\n                        content including badges, separators, and structured\n                        data.\n                      </p>\n                    </div>\n                  </div>\n                  <DialogFooter>\n                    <Button>Close</Button>\n                  </DialogFooter>\n                </DialogContent>\n              </Dialog>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Form Inputs */}\n        <PlaygroundSection\n          title=\"Form Inputs\"\n          description=\"shadcn/ui Input, Textarea, and Checkbox components.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-6\">\n            {/* Input */}\n            <div>\n              <h4 className=\"mb-3\">Input</h4>\n              <div className=\"space-y-4 max-w-md\">\n                <div>\n                  <Label htmlFor=\"input-default\">Default Input</Label>\n                  <Input\n                    id=\"input-default\"\n                    type=\"text\"\n                    placeholder=\"Enter text...\"\n                  />\n                </div>\n\n                <div>\n                  <Label htmlFor=\"input-email\">Email Input</Label>\n                  <Input\n                    id=\"input-email\"\n                    type=\"email\"\n                    placeholder=\"email@example.com\"\n                  />\n                </div>\n\n                <div>\n                  <Label htmlFor=\"input-password\">Password Input</Label>\n                  <Input\n                    id=\"input-password\"\n                    type=\"password\"\n                    placeholder=\"Enter password...\"\n                  />\n                </div>\n\n                <div>\n                  <Label htmlFor=\"input-disabled\">Disabled Input</Label>\n                  <Input\n                    id=\"input-disabled\"\n                    type=\"text\"\n                    placeholder=\"Disabled...\"\n                    disabled\n                  />\n                </div>\n\n                <div>\n                  <Label htmlFor=\"input-readonly\">Read-only Input</Label>\n                  <Input\n                    id=\"input-readonly\"\n                    type=\"text\"\n                    value=\"Read-only value\"\n                    readOnly\n                  />\n                </div>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Textarea */}\n            <div>\n              <h4 className=\"mb-3\">Textarea</h4>\n              <div className=\"space-y-4 max-w-md\">\n                <div>\n                  <Label htmlFor=\"textarea-default\">Default Textarea</Label>\n                  <Textarea\n                    id=\"textarea-default\"\n                    placeholder=\"Enter multi-line text...\"\n                  />\n                </div>\n\n                <div>\n                  <Label htmlFor=\"textarea-rows\">\n                    Textarea with Custom Rows\n                  </Label>\n                  <Textarea\n                    id=\"textarea-rows\"\n                    placeholder=\"This has 5 rows...\"\n                    rows={5}\n                  />\n                </div>\n\n                <div>\n                  <Label htmlFor=\"textarea-disabled\">Disabled Textarea</Label>\n                  <Textarea\n                    id=\"textarea-disabled\"\n                    placeholder=\"Disabled...\"\n                    disabled\n                  />\n                </div>\n\n                <div>\n                  <Label htmlFor=\"textarea-value\">Textarea with Value</Label>\n                  <Textarea\n                    id=\"textarea-value\"\n                    value=\"This is some pre-filled text in the textarea.\"\n                    readOnly\n                  />\n                </div>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Checkbox */}\n            <div>\n              <h4 className=\"mb-3\">Checkbox</h4>\n              <div className=\"space-y-4\">\n                <div className=\"flex items-center space-x-2\">\n                  <Checkbox id=\"checkbox-default\" />\n                  <Label htmlFor=\"checkbox-default\">Default Checkbox</Label>\n                </div>\n\n                <div className=\"flex items-center space-x-2\">\n                  <Checkbox id=\"checkbox-checked\" defaultChecked />\n                  <Label htmlFor=\"checkbox-checked\">Checked by Default</Label>\n                </div>\n\n                <div className=\"flex items-center space-x-2\">\n                  <Checkbox id=\"checkbox-disabled\" disabled />\n                  <Label htmlFor=\"checkbox-disabled\">Disabled Checkbox</Label>\n                </div>\n\n                <div className=\"flex items-center space-x-2\">\n                  <Checkbox id=\"checkbox-disabled-checked\" disabled checked />\n                  <Label htmlFor=\"checkbox-disabled-checked\">\n                    Disabled & Checked\n                  </Label>\n                </div>\n\n                <Separator className=\"my-4\" />\n\n                <div className=\"space-y-3\">\n                  <p className=\"text-sm font-medium\">\n                    Multiple Checkboxes Example:\n                  </p>\n                  <div className=\"flex items-center space-x-2\">\n                    <Checkbox id=\"terms\" />\n                    <Label htmlFor=\"terms\">Accept terms and conditions</Label>\n                  </div>\n                  <div className=\"flex items-center space-x-2\">\n                    <Checkbox id=\"marketing\" />\n                    <Label htmlFor=\"marketing\">Send me marketing emails</Label>\n                  </div>\n                  <div className=\"flex items-center space-x-2\">\n                    <Checkbox id=\"newsletter\" defaultChecked />\n                    <Label htmlFor=\"newsletter\">Subscribe to newsletter</Label>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        <SelectSection />\n\n        <DateInputSection />\n\n        <TimeInputSection />\n\n        <DateTimeInputSection />\n\n        {/* Label Component */}\n        <PlaygroundSection\n          title=\"Label\"\n          description=\"Label component for form fields with proper accessibility.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-6\">\n            {/* Basic Label */}\n            <div>\n              <h4 className=\"mb-3\">Basic Usage</h4>\n              <div className=\"space-y-4\">\n                <div className=\"space-y-2\">\n                  <Label htmlFor=\"email\">Email Address</Label>\n                  <Input\n                    id=\"email\"\n                    type=\"email\"\n                    placeholder=\"Enter your email\"\n                  />\n                </div>\n\n                <div className=\"space-y-2\">\n                  <Label htmlFor=\"username\">Username</Label>\n                  <Input id=\"username\" placeholder=\"Choose a username\" />\n                </div>\n\n                <div className=\"space-y-2\">\n                  <Label htmlFor=\"bio\">Bio</Label>\n                  <Textarea id=\"bio\" placeholder=\"Tell us about yourself\" />\n                </div>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Label with Checkbox */}\n            <div>\n              <h4 className=\"mb-3\">With Checkbox</h4>\n              <div className=\"space-y-3\">\n                <div className=\"flex items-center space-x-2\">\n                  <Checkbox id=\"terms-label\" />\n                  <Label htmlFor=\"terms-label\">\n                    Accept terms and conditions\n                  </Label>\n                </div>\n\n                <div className=\"flex items-center space-x-2\">\n                  <Checkbox id=\"newsletter-label\" />\n                  <Label htmlFor=\"newsletter-label\">\n                    Subscribe to newsletter\n                  </Label>\n                </div>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Disabled State */}\n            <div>\n              <h4 className=\"mb-3\">Disabled State</h4>\n              <div className=\"space-y-2\">\n                <Label htmlFor=\"disabled-input\" className=\"opacity-50\">\n                  Disabled Field\n                </Label>\n                <Input\n                  id=\"disabled-input\"\n                  disabled\n                  placeholder=\"This field is disabled\"\n                />\n              </div>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Avatar Component */}\n        <PlaygroundSection\n          title=\"Avatar\"\n          description=\"Avatar component for displaying user profile images with fallback support.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-6\">\n            {/* Basic Avatars */}\n            <div>\n              <h4 className=\"mb-3\">Basic Avatars</h4>\n              <div className=\"flex items-center gap-4\">\n                <Avatar>\n                  <AvatarImage\n                    src=\"https://github.com/shadcn.png\"\n                    alt=\"@shadcn\"\n                  />\n                  <AvatarFallback>CN</AvatarFallback>\n                </Avatar>\n\n                <Avatar>\n                  <AvatarImage\n                    src=\"https://github.com/vercel.png\"\n                    alt=\"@vercel\"\n                  />\n                  <AvatarFallback>VC</AvatarFallback>\n                </Avatar>\n\n                <Avatar>\n                  <AvatarImage\n                    src=\"https://github.com/react.png\"\n                    alt=\"@react\"\n                  />\n                  <AvatarFallback>RC</AvatarFallback>\n                </Avatar>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Fallback Only */}\n            <div>\n              <h4 className=\"mb-3\">Fallback Only (No Image)</h4>\n              <div className=\"flex items-center gap-4\">\n                <Avatar>\n                  <AvatarFallback>JD</AvatarFallback>\n                </Avatar>\n\n                <Avatar>\n                  <AvatarFallback>AB</AvatarFallback>\n                </Avatar>\n\n                <Avatar>\n                  <AvatarFallback>XY</AvatarFallback>\n                </Avatar>\n\n                <Avatar>\n                  <AvatarFallback className=\"bg-primary text-primary-foreground\">\n                    DB\n                  </AvatarFallback>\n                </Avatar>\n\n                <Avatar>\n                  <AvatarFallback className=\"bg-secondary text-secondary-foreground\">\n                    GH\n                  </AvatarFallback>\n                </Avatar>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* With User Info */}\n            <div>\n              <h4 className=\"mb-3\">With User Information</h4>\n              <div className=\"space-y-4\">\n                <div className=\"flex items-center gap-3\">\n                  <Avatar>\n                    <AvatarImage\n                      src=\"https://github.com/shadcn.png\"\n                      alt=\"@shadcn\"\n                    />\n                    <AvatarFallback>CN</AvatarFallback>\n                  </Avatar>\n                  <div>\n                    <p className=\"text-sm font-medium text-foreground\">\n                      John Doe\n                    </p>\n                    <p className=\"text-xs text-faint-foreground\">\n                      john.doe@example.com\n                    </p>\n                  </div>\n                </div>\n\n                <div className=\"flex items-center gap-3\">\n                  <Avatar>\n                    <AvatarFallback className=\"bg-primary text-primary-foreground\">\n                      JD\n                    </AvatarFallback>\n                  </Avatar>\n                  <div>\n                    <p className=\"text-sm font-medium text-foreground\">\n                      Jane Smith\n                    </p>\n                    <p className=\"text-xs text-faint-foreground\">\n                      jane.smith@example.com\n                    </p>\n                  </div>\n                </div>\n\n                <div className=\"flex items-center gap-3\">\n                  <Avatar>\n                    <AvatarFallback className=\"bg-destructive text-destructive-foreground\">\n                      AS\n                    </AvatarFallback>\n                  </Avatar>\n                  <div>\n                    <p className=\"text-sm font-medium text-foreground\">\n                      Alex Johnson\n                    </p>\n                    <p className=\"text-xs text-faint-foreground\">\n                      alex.j@example.com\n                    </p>\n                  </div>\n                </div>\n              </div>\n            </div>\n\n            <Separator />\n\n            {/* Different Sizes */}\n            <div>\n              <h4 className=\"mb-3\">Custom Sizes</h4>\n              <div className=\"flex items-end gap-4\">\n                <div className=\"flex flex-col items-center gap-2\">\n                  <Avatar className=\"h-8 w-8\">\n                    <AvatarFallback className=\"text-xs\">SM</AvatarFallback>\n                  </Avatar>\n                  <span className=\"text-xs text-muted-foreground\">Small</span>\n                </div>\n\n                <div className=\"flex flex-col items-center gap-2\">\n                  <Avatar>\n                    <AvatarFallback>MD</AvatarFallback>\n                  </Avatar>\n                  <span className=\"text-xs text-muted-foreground\">Default</span>\n                </div>\n\n                <div className=\"flex flex-col items-center gap-2\">\n                  <Avatar className=\"h-16 w-16\">\n                    <AvatarFallback className=\"text-lg\">LG</AvatarFallback>\n                  </Avatar>\n                  <span className=\"text-xs text-muted-foreground\">Large</span>\n                </div>\n\n                <div className=\"flex flex-col items-center gap-2\">\n                  <Avatar className=\"h-20 w-20\">\n                    <AvatarFallback className=\"text-xl\">XL</AvatarFallback>\n                  </Avatar>\n                  <span className=\"text-xs text-muted-foreground\">\n                    Extra Large\n                  </span>\n                </div>\n              </div>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Notifications */}\n        <PlaygroundSection\n          title=\"Notifications\"\n          description=\"Toast notifications using Sonner. Test all variants and behaviors.\"\n          variant=\"card\"\n        >\n          <div className=\"flex flex-wrap gap-3\">\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => toast.success(\"Success! Operation completed.\")}\n            >\n              Success\n            </Button>\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => toast.error(\"Error! Something went wrong.\")}\n            >\n              Error\n            </Button>\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => toast.warning(\"Warning! Please be careful.\")}\n            >\n              Warning\n            </Button>\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => toast.info(\"Info: Here is some information.\")}\n            >\n              Info\n            </Button>\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() => {\n                toast.success(\"First notification\");\n                setTimeout(() => toast.info(\"Second notification\"), 500);\n                setTimeout(() => toast.warning(\"Third notification\"), 1000);\n              }}\n            >\n              Multiple\n            </Button>\n            <Button\n              variant=\"outline\"\n              size=\"sm\"\n              onClick={() =>\n                toast(\"Custom message\", {\n                  description: \"This is a custom notification with description\",\n                  duration: 5000,\n                })\n              }\n            >\n              Custom\n            </Button>\n          </div>\n        </PlaygroundSection>\n\n        {/* Spinner */}\n        <PlaygroundSection\n          title=\"Spinner Component\"\n          description=\"Loading spinner with different sizes.\"\n          variant=\"card\"\n        >\n          <div className=\"space-y-4\">\n            <div className=\"flex items-center gap-2\">\n              <span className=\"text-sm font-medium text-muted-foreground\">\n                Size:\n              </span>\n              <Button\n                variant={spinnerSize === \"sm\" ? \"default\" : \"outline\"}\n                size=\"sm\"\n                onClick={() => setSpinnerSize(\"sm\")}\n              >\n                Small\n              </Button>\n              <Button\n                variant={spinnerSize === \"md\" ? \"default\" : \"outline\"}\n                size=\"sm\"\n                onClick={() => setSpinnerSize(\"md\")}\n              >\n                Medium\n              </Button>\n              <Button\n                variant={spinnerSize === \"lg\" ? \"default\" : \"outline\"}\n                size=\"sm\"\n                onClick={() => setSpinnerSize(\"lg\")}\n              >\n                Large\n              </Button>\n            </div>\n\n            <div className=\"flex items-center gap-8 p-6 bg-muted/50 rounded-md\">\n              <div className=\"flex flex-col items-center gap-2\">\n                <Spinner size=\"sm\" />\n                <span className=\"text-xs text-muted-foreground\">\n                  Small (16px)\n                </span>\n              </div>\n\n              <div className=\"flex flex-col items-center gap-2\">\n                <Spinner size=\"md\" />\n                <span className=\"text-xs text-muted-foreground\">\n                  Medium (24px)\n                </span>\n              </div>\n\n              <div className=\"flex flex-col items-center gap-2\">\n                <Spinner size=\"lg\" />\n                <span className=\"text-xs text-muted-foreground\">\n                  Large (32px)\n                </span>\n              </div>\n\n              <div className=\"flex flex-col items-center gap-2\">\n                <Spinner size={spinnerSize} />\n                <span className=\"text-xs text-muted-foreground\">\n                  Selected: {spinnerSize}\n                </span>\n              </div>\n            </div>\n          </div>\n        </PlaygroundSection>\n\n        {/* Custom Hooks */}\n        <ListRowSection />\n        <DangerZoneSection />\n\n        <ViewSwitchSection />\n\n        <PlaygroundSection\n          title=\"Custom Hooks\"\n          description=\"Test custom hooks from @petrarca/sonnet-core.\"\n          variant=\"card\"\n        >\n          {/* useClipboard */}\n          <div className=\"mb-6\">\n            <h4 className=\"mb-3\">useClipboard Hook</h4>\n            <div className=\"flex items-center gap-3\">\n              <Button\n                variant=\"outline\"\n                size=\"sm\"\n                onClick={() => clipboard.copy(\"Hello from clipboard!\")}\n              >\n                {clipboard.copied ? \"✓ Copied!\" : \"Copy Text\"}\n              </Button>\n              <span className=\"text-sm text-muted-foreground\">\n                State: {clipboard.copied ? \"Copied\" : \"Ready\"}\n                {clipboard.error && ` (Error: ${clipboard.error.message})`}\n              </span>\n            </div>\n          </div>\n\n          {/* useDisclosure */}\n          <div>\n            <h4 className=\"mb-3\">useDisclosure Hook</h4>\n            <div className=\"space-y-3\">\n              <div className=\"flex items-center gap-3\">\n                <Button\n                  variant=\"outline\"\n                  size=\"sm\"\n                  onClick={disclosureHandlers.open}\n                >\n                  Open\n                </Button>\n                <Button\n                  variant=\"outline\"\n                  size=\"sm\"\n                  onClick={disclosureHandlers.close}\n                >\n                  Close\n                </Button>\n                <Button\n                  variant=\"outline\"\n                  size=\"sm\"\n                  onClick={disclosureHandlers.toggle}\n                >\n                  Toggle\n                </Button>\n                <span className=\"text-sm text-muted-foreground\">\n                  State: {disclosureOpened ? \"Open\" : \"Closed\"}\n                </span>\n              </div>\n\n              {disclosureOpened && (\n                <div className=\"p-4 bg-muted border rounded-md\">\n                  <p className=\"text-sm\">\n                    This content is visible when disclosure is open!\n                  </p>\n                </div>\n              )}\n            </div>\n          </div>\n        </PlaygroundSection>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-UB7462QG.js → chunk-RLJI5VMP.js}

@@ -20,6 +20,7 @@ import {
   TimeWidget,
   DateTimeWidget,
   DisplayWidget,
+  KeyValueWidget,
   DEFAULT_WIDGETS
 } from "@petrarca/sonnet-forms";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -42,6 +43,13 @@ function makeQuantityHandler(set) {
 }
 function PlayFormWidgets() {
   const [textValue, setTextValue] = useState("");
+  const [labels, setLabels] = useState({
+    team: "platform"
+  });
+  const [inputs, setInputs] = useState({
+    REPORT: "{run_dir}/{product_key}/report.md",
+    CONTEXT: "{repos_root}/{product_key}/docs/context.md"
+  });
   const [textareaValue, setTextareaValue] = useState("");
   const [numberValue, setNumberValue] = useState(void 0);
   const [checkboxValue, setCheckboxValue] = useState(false);
@@ -326,6 +334,69 @@ function PlayFormWidgets() {
           }
         ) })
       ] }) }),
+      /* @__PURE__ */ jsx(Card, { className: "border shadow-sm p-4", children: /* @__PURE__ */ jsxs(SimpleStack, { gap: "sm", children: [
+        /* @__PURE__ */ jsx("h2", { children: "KeyValueWidget" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "A free map of strings (additionalProperties: string), e.g. labels. Enter a key and a value (Enter or +); pairs show as key:value tags. Click a tag to edit it, X removes it; adding a key again replaces its value. Chosen automatically for such maps; x-ui-widget: key-value." }),
+        /* @__PURE__ */ jsx(
+          KeyValueWidget,
+          {
+            id: "key-value-demo",
+            name: "labels",
+            value: labels,
+            onChange: (v) => setLabels(v),
+            label: "Labels",
+            description: "Free key-value labels.",
+            propertySchema: {
+              type: "object",
+              additionalProperties: { type: "string" }
+            },
+            schema: dummySchema,
+            registry: DEFAULT_WIDGETS
+          }
+        ),
+        /* @__PURE__ */ jsx("pre", { className: "text-xs text-muted-foreground", children: JSON.stringify(labels) })
+      ] }) }),
+      /* @__PURE__ */ jsx(Card, { className: "border shadow-sm p-4", children: /* @__PURE__ */ jsxs(SimpleStack, { gap: "sm", children: [
+        /* @__PURE__ */ jsx("h2", { children: "KeyValueWidget -- rows and keys" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: 'The same map displayed as rows (x-ui-options: display "rows"): key and value edited in place, taken on leaving the field or Enter; a key taken by another row is refused. For long values such as templates or paths.' }),
+        /* @__PURE__ */ jsx(
+          KeyValueWidget,
+          {
+            id: "key-value-rows-demo",
+            name: "inputs",
+            value: inputs,
+            onChange: (v) => setInputs(v),
+            label: "Inputs",
+            description: "Templates: {name} reads a run value.",
+            options: { display: "rows" },
+            propertySchema: {
+              type: "object",
+              additionalProperties: { type: "string" }
+            },
+            schema: dummySchema,
+            registry: DEFAULT_WIDGETS
+          }
+        ),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: 'The same map with display "keys": only the keys, each value on hover -- a summary, not edited (the host edits the pairs elsewhere, e.g. as rows in a dialog).' }),
+        /* @__PURE__ */ jsx(
+          KeyValueWidget,
+          {
+            id: "key-value-keys-demo",
+            name: "inputs-keys",
+            value: inputs,
+            onChange: () => void 0,
+            label: "Inputs (keys)",
+            options: { display: "keys" },
+            propertySchema: {
+              type: "object",
+              additionalProperties: { type: "string" }
+            },
+            schema: dummySchema,
+            registry: DEFAULT_WIDGETS
+          }
+        ),
+        /* @__PURE__ */ jsx("pre", { className: "text-xs text-muted-foreground", children: JSON.stringify(inputs) })
+      ] }) }),
       /* @__PURE__ */ jsx(Card, { className: "border shadow-sm p-4", children: /* @__PURE__ */ jsxs(SimpleStack, { gap: "sm", children: [
         /* @__PURE__ */ jsx("h2", { children: "DateWidget / TimeWidget / DateTimeWidget" }),
         /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Date, time, and datetime fields. Auto-resolve from schema format (date / time / date-time). Values are ISO strings; display and parsing follow the playground locale (gear icon)." }),
@@ -503,4 +574,4 @@ function PlayFormWidgets() {
 export {
   PlayFormWidgets
 };
-//# sourceMappingURL=chunk-UB7462QG.js.map
+//# sourceMappingURL=chunk-RLJI5VMP.js.map

package/dist/chunk-RLJI5VMP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/pages/PlayFormWidgets.tsx"],"sourcesContent":["/**\n * Playground page for testing form widgets\n * Accessible at /playground/form-widgets\n */\n\nimport {\n  type Dispatch,\n  type SetStateAction,\n  useCallback,\n  useMemo,\n  useState,\n} from \"react\";\nimport { SimpleStack, Card } from \"@petrarca/sonnet-ui\";\nimport { ExampleBlock } from \"../PlaygroundSection\";\nimport {\n  TextInputWidget,\n  TextareaWidget,\n  NumberWidget,\n  CheckboxWidget,\n  SelectWidget,\n  QuantityWidget,\n  DateWidget,\n  TimeWidget,\n  DateTimeWidget,\n  DisplayWidget,\n  KeyValueWidget,\n  DEFAULT_WIDGETS,\n  type QuantityValue,\n} from \"@petrarca/sonnet-forms\";\nimport type { JsonSchema } from \"@petrarca/sonnet-core/schema\";\n\nconst dummySchema: JsonSchema = {\n  title: \"Form Widgets Demo\",\n  type: \"object\",\n  properties: {},\n  \"x-entity\": {\n    type: \"entity\",\n    label: \"Demo\",\n    relations: [],\n  },\n};\n\nfunction makeQuantityHandler(\n  set: Dispatch<SetStateAction<QuantityValue>>,\n): (v: unknown) => void {\n  return (v: unknown) => {\n    if (v != null && typeof v === \"object\" && !Array.isArray(v)) {\n      set(v as QuantityValue);\n    }\n  };\n}\n\nexport default function PlayFormWidgets() {\n  // State for each widget\n  const [textValue, setTextValue] = useState<string>(\"\");\n  const [labels, setLabels] = useState<Record<string, string>>({\n    team: \"platform\",\n  });\n  const [inputs, setInputs] = useState<Record<string, string>>({\n    REPORT: \"{run_dir}/{product_key}/report.md\",\n    CONTEXT: \"{repos_root}/{product_key}/docs/context.md\",\n  });\n  const [textareaValue, setTextareaValue] = useState<string>(\"\");\n  const [numberValue, setNumberValue] = useState<number | undefined>(undefined);\n  const [checkboxValue, setCheckboxValue] = useState<boolean>(false);\n  const [selectValue, setSelectValue] = useState<string>(\"\");\n  const [multiSelectValue, setMultiSelectValue] = useState<string[]>([]);\n  const [multiSelectColorValue, setMultiSelectColorValue] = useState<string[]>(\n    [],\n  );\n  const [tempValue, setTempValue] = useState<QuantityValue>({\n    value: 37.0,\n    unit: \"degC\",\n  });\n  const [weightValue, setWeightValue] = useState<QuantityValue>({\n    value: undefined,\n    unit: \"kg\",\n  });\n  const [bpValue, setBpValue] = useState<QuantityValue>({\n    value: 72,\n    unit: \"bpm\",\n  });\n  const [priceValue, setPriceValue] = useState<QuantityValue>({\n    value: 49.99,\n    unit: \"EUR\",\n  });\n  const [dateValue, setDateValue] = useState<string>(\"2026-06-15\");\n  const [birthYear, setBirthYear] = useState<string>(\"1980\");\n  const [timeValue, setTimeValue] = useState<string>(\"09:30\");\n  const [dateTimeValue, setDateTimeValue] =\n    useState<string>(\"2026-06-15T09:30\");\n\n  // Narrowing adapters: WidgetProps.onChange is (value: unknown) => void.\n  // All quantity adapters have stable identity (empty deps) -- the fallback\n  // branch is dropped so the state setter is not captured in the closure.\n  const onTextChange = useCallback(\n    (v: unknown) => setTextValue(typeof v === \"string\" ? v : \"\"),\n    [],\n  );\n  const onTextareaChange = useCallback(\n    (v: unknown) => setTextareaValue(typeof v === \"string\" ? v : \"\"),\n    [],\n  );\n  const onNumberChange = useCallback(\n    (v: unknown) => setNumberValue(typeof v === \"number\" ? v : undefined),\n    [],\n  );\n  const onCheckboxChange = useCallback(\n    (v: unknown) => setCheckboxValue(typeof v === \"boolean\" ? v : false),\n    [],\n  );\n  const onSelectChange = useCallback(\n    (v: unknown) => setSelectValue(typeof v === \"string\" ? v : \"\"),\n    [],\n  );\n  const onMultiSelectChange = useCallback(\n    (v: unknown) =>\n      setMultiSelectValue(Array.isArray(v) ? (v as string[]) : []),\n    [],\n  );\n  const onMultiSelectColorChange = useCallback(\n    (v: unknown) =>\n      setMultiSelectColorValue(Array.isArray(v) ? (v as string[]) : []),\n    [],\n  );\n  // Quantity adapters: QuantityWidget passes unknown, guard narrows to QuantityValue.\n  const onTempChange = useMemo(() => makeQuantityHandler(setTempValue), []);\n  const onWeightChange = useMemo(() => makeQuantityHandler(setWeightValue), []);\n  const onBpChange = useMemo(() => makeQuantityHandler(setBpValue), []);\n  const onPriceChange = useMemo(() => makeQuantityHandler(setPriceValue), []);\n  const onStringChange = useCallback(\n    (set: Dispatch<SetStateAction<string>>) => (v: unknown) =>\n      set(typeof v === \"string\" ? v : \"\"),\n    [],\n  );\n\n  return (\n    <div className=\"w-full max-w-4xl space-y-6\">\n      <div>\n        <h1>Basic Form Widgets Playground</h1>\n        <p className=\"text-sm text-muted-foreground mb-3\">\n          Interactive demonstration of all basic form widgets\n        </p>\n      </div>\n\n      <div>\n        <SimpleStack gap=\"md\" style={{ maxWidth: \"900px\" }}>\n          {/* TextInputWidget */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>TextInputWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Single-line text input with support for various HTML input types\n                (text, email, password, url, etc.)\n              </p>\n\n              <TextInputWidget\n                id=\"text-input-demo\"\n                name=\"textInput\"\n                value={textValue}\n                onChange={onTextChange}\n                label=\"Text Input\"\n                description=\"Enter some text\"\n                placeholder=\"Type here...\"\n                propertySchema={{ type: \"string\" }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n              />\n\n              <TextInputWidget\n                id=\"text-input-email\"\n                name=\"emailInput\"\n                value={textValue}\n                onChange={onTextChange}\n                label=\"Email Input\"\n                description=\"Input type: email\"\n                placeholder=\"user@example.com\"\n                propertySchema={{ type: \"string\", format: \"email\" }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n                options={{ inputType: \"email\" }}\n              />\n\n              <pre className=\"text-[11px] bg-muted p-2 rounded overflow-x-auto\">\n                <code>{JSON.stringify({ value: textValue }, null, 2)}</code>\n              </pre>\n            </SimpleStack>\n          </Card>\n\n          {/* TextareaWidget */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>TextareaWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Multi-line text input with configurable rows and autosize\n                support\n              </p>\n\n              <TextareaWidget\n                id=\"textarea-demo\"\n                name=\"textarea\"\n                value={textareaValue}\n                onChange={onTextareaChange}\n                label=\"Textarea\"\n                description=\"Enter multiple lines\"\n                placeholder=\"Type here...\"\n                propertySchema={{ type: \"string\" }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n                options={{ rows: 4 }}\n              />\n\n              <pre className=\"text-[11px] bg-muted p-2 rounded overflow-x-auto\">\n                <code>{JSON.stringify({ value: textareaValue }, null, 2)}</code>\n              </pre>\n            </SimpleStack>\n          </Card>\n\n          {/* NumberWidget */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>NumberWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Number input with support for min, max, and step constraints\n              </p>\n\n              <NumberWidget\n                id=\"number-demo\"\n                name=\"number\"\n                value={numberValue}\n                onChange={onNumberChange}\n                label=\"Number Input\"\n                description=\"Enter a number (0-100, step: 5)\"\n                placeholder=\"0\"\n                propertySchema={{ type: \"number\", minimum: 0, maximum: 100 }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n                options={{ step: 5 }}\n              />\n\n              <pre className=\"text-[11px] bg-muted p-2 rounded overflow-x-auto\">\n                <code>{JSON.stringify({ value: numberValue }, null, 2)}</code>\n              </pre>\n            </SimpleStack>\n          </Card>\n\n          {/* CheckboxWidget */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>CheckboxWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Boolean checkbox for true/false values\n              </p>\n\n              <CheckboxWidget\n                id=\"checkbox-demo\"\n                name=\"checkbox\"\n                value={checkboxValue}\n                onChange={onCheckboxChange}\n                label=\"Enable Feature\"\n                description=\"Check to enable\"\n                propertySchema={{ type: \"boolean\" }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n              />\n\n              <pre className=\"text-[11px] bg-muted p-2 rounded overflow-x-auto\">\n                <code>{JSON.stringify({ value: checkboxValue }, null, 2)}</code>\n              </pre>\n            </SimpleStack>\n          </Card>\n\n          {/* SelectWidget - All Variations */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>SelectWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Dropdown select for enum values with single-select,\n                multi-select, and custom badge colors\n              </p>\n\n              <div className=\"grid grid-cols-2 gap-3 pt-2\">\n                <ExampleBlock label=\"Single select\">\n                  <SelectWidget\n                    id=\"select-demo\"\n                    name=\"select\"\n                    value={selectValue}\n                    onChange={onSelectChange}\n                    label=\"Select Status\"\n                    description=\"Choose a status\"\n                    placeholder=\"Select one...\"\n                    propertySchema={{\n                      type: \"string\",\n                      enum: [\"active\", \"inactive\", \"pending\", \"archived\"],\n                    }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{\n                      enumNames: {\n                        active: \"Active\",\n                        inactive: \"Inactive\",\n                        pending: \"Pending\",\n                        archived: \"Archived\",\n                      },\n                      searchable: true,\n                      clearable: true,\n                    }}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Multi select\">\n                  <SelectWidget\n                    id=\"multiselect-demo\"\n                    name=\"multiselect\"\n                    value={multiSelectValue}\n                    onChange={onMultiSelectChange}\n                    label=\"Select Tags\"\n                    description=\"Choose multiple tags\"\n                    placeholder=\"Select tags...\"\n                    propertySchema={{\n                      type: \"array\",\n                      items: { type: \"string\" },\n                      enum: [\n                        \"frontend\",\n                        \"backend\",\n                        \"database\",\n                        \"devops\",\n                        \"testing\",\n                        \"security\",\n                      ],\n                    }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{ searchable: true, clearable: true }}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Custom badge color\">\n                  <SelectWidget\n                    id=\"multiselect-color-demo\"\n                    name=\"multiselectColor\"\n                    value={multiSelectColorValue}\n                    onChange={onMultiSelectColorChange}\n                    label=\"Select Categories\"\n                    description=\"Custom grape-colored badges\"\n                    placeholder=\"Select categories...\"\n                    propertySchema={{\n                      type: \"array\",\n                      items: { type: \"string\" },\n                      enum: [\n                        \"feature\",\n                        \"bugfix\",\n                        \"enhancement\",\n                        \"documentation\",\n                        \"refactor\",\n                      ],\n                    }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{\n                      searchable: true,\n                      clearable: true,\n                      badgeColor: \"grape\",\n                      enumNames: {\n                        feature: \"Feature\",\n                        bugfix: \"Bug Fix\",\n                        enhancement: \"Enhancement\",\n                        documentation: \"Documentation\",\n                        refactor: \"Refactor\",\n                      },\n                    }}\n                  />\n                </ExampleBlock>\n              </div>\n            </SimpleStack>\n          </Card>\n\n          {/* DisplayWidget */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>DisplayWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Read-only text block (type: null / x-ui-widget: display).\n                Renders title + description as static text, collects no value.\n                For instructions and notes placed between fields.\n              </p>\n\n              <div className=\"rounded-md border border-dashed p-3\">\n                <DisplayWidget\n                  id=\"display-demo\"\n                  name=\"displayNote\"\n                  value={null}\n                  onChange={() => {}}\n                  label=\"Section 3: Medical history\"\n                  description=\"Answer the following to the best of your knowledge. Leave blank if unsure.\"\n                  propertySchema={{ type: \"null\" }}\n                  schema={dummySchema}\n                  registry={DEFAULT_WIDGETS}\n                />\n              </div>\n            </SimpleStack>\n          </Card>\n\n          {/* KeyValueWidget */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>KeyValueWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                A free map of strings (additionalProperties: string), e.g.\n                labels. Enter a key and a value (Enter or +); pairs show as\n                key:value tags. Click a tag to edit it, X removes it; adding a\n                key again replaces its value. Chosen automatically for such\n                maps; x-ui-widget: key-value.\n              </p>\n\n              <KeyValueWidget\n                id=\"key-value-demo\"\n                name=\"labels\"\n                value={labels}\n                onChange={(v) => setLabels(v as Record<string, string>)}\n                label=\"Labels\"\n                description=\"Free key-value labels.\"\n                propertySchema={{\n                  type: \"object\",\n                  additionalProperties: { type: \"string\" },\n                }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n              />\n              <pre className=\"text-xs text-muted-foreground\">\n                {JSON.stringify(labels)}\n              </pre>\n            </SimpleStack>\n          </Card>\n\n          {/* KeyValueWidget as rows */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>KeyValueWidget -- rows and keys</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                The same map displayed as rows (x-ui-options: display\n                &quot;rows&quot;): key and value edited in place, taken on\n                leaving the field or Enter; a key taken by another row is\n                refused. For long values such as templates or paths.\n              </p>\n\n              <KeyValueWidget\n                id=\"key-value-rows-demo\"\n                name=\"inputs\"\n                value={inputs}\n                onChange={(v) => setInputs(v as Record<string, string>)}\n                label=\"Inputs\"\n                description=\"Templates: {name} reads a run value.\"\n                options={{ display: \"rows\" }}\n                propertySchema={{\n                  type: \"object\",\n                  additionalProperties: { type: \"string\" },\n                }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n              />\n              <p className=\"text-sm text-muted-foreground\">\n                The same map with display &quot;keys&quot;: only the keys, each\n                value on hover -- a summary, not edited (the host edits the\n                pairs elsewhere, e.g. as rows in a dialog).\n              </p>\n              <KeyValueWidget\n                id=\"key-value-keys-demo\"\n                name=\"inputs-keys\"\n                value={inputs}\n                onChange={() => undefined}\n                label=\"Inputs (keys)\"\n                options={{ display: \"keys\" }}\n                propertySchema={{\n                  type: \"object\",\n                  additionalProperties: { type: \"string\" },\n                }}\n                schema={dummySchema}\n                registry={DEFAULT_WIDGETS}\n              />\n              <pre className=\"text-xs text-muted-foreground\">\n                {JSON.stringify(inputs)}\n              </pre>\n            </SimpleStack>\n          </Card>\n\n          {/* Date / Time / DateTime widgets */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>DateWidget / TimeWidget / DateTimeWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Date, time, and datetime fields. Auto-resolve from schema format\n                (date / time / date-time). Values are ISO strings; display and\n                parsing follow the playground locale (gear icon).\n              </p>\n\n              <div className=\"grid grid-cols-2 gap-3 pt-2\">\n                <ExampleBlock label=\"Date (format: date)\">\n                  <DateWidget\n                    id=\"date-widget-demo\"\n                    name=\"date\"\n                    value={dateValue}\n                    onChange={onStringChange(setDateValue)}\n                    label=\"Appointment date\"\n                    description=\"Resolved from format: date\"\n                    propertySchema={{ type: \"string\", format: \"date\" }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Date, year precision\">\n                  <DateWidget\n                    id=\"date-widget-year\"\n                    name=\"birthYear\"\n                    value={birthYear}\n                    onChange={onStringChange(setBirthYear)}\n                    label=\"Birth year\"\n                    description=\"x-ui-options.precision: year\"\n                    propertySchema={{ type: \"string\", format: \"date\" }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{ precision: \"year\" }}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Time (format: time)\">\n                  <TimeWidget\n                    id=\"time-widget-demo\"\n                    name=\"time\"\n                    value={timeValue}\n                    onChange={onStringChange(setTimeValue)}\n                    label=\"Start time\"\n                    description=\"Zone-free time of day\"\n                    propertySchema={{ type: \"string\", format: \"time\" }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Date & time (format: date-time)\">\n                  <DateTimeWidget\n                    id=\"datetime-widget-demo\"\n                    name=\"dateTime\"\n                    value={dateTimeValue}\n                    onChange={onStringChange(setDateTimeValue)}\n                    label=\"Scheduled at\"\n                    description=\"Plain wall-clock, timezone hint\"\n                    propertySchema={{ type: \"string\", format: \"date-time\" }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{ timeZone: \"Europe/Berlin\" }}\n                  />\n                </ExampleBlock>\n              </div>\n\n              <pre className=\"text-[11px] bg-muted p-2 rounded overflow-x-auto\">\n                <code>\n                  {JSON.stringify(\n                    {\n                      date: dateValue,\n                      birthYear,\n                      time: timeValue,\n                      dateTime: dateTimeValue,\n                    },\n                    null,\n                    2,\n                  )}\n                </code>\n              </pre>\n            </SimpleStack>\n          </Card>\n\n          {/* QuantityWidget */}\n          <Card className=\"border shadow-sm p-4\">\n            <SimpleStack gap=\"sm\">\n              <h2>QuantityWidget</h2>\n              <p className=\"text-sm text-muted-foreground\">\n                Compound numeric value + unit selector. Multi-unit shows a\n                dropdown, single-unit shows static text, prefix mode places the\n                unit before the value.\n              </p>\n\n              <div className=\"grid grid-cols-2 gap-3 pt-2\">\n                <ExampleBlock label=\"Multi-unit suffix (Temperature)\">\n                  <QuantityWidget\n                    id=\"quantity-temp\"\n                    name=\"temperature\"\n                    value={tempValue}\n                    onChange={onTempChange}\n                    label=\"Temperature\"\n                    description=\"Body temperature with per-unit validation\"\n                    placeholder=\"0.0\"\n                    propertySchema={{ type: \"object\" }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{\n                      precision: 1,\n                      units: [\n                        { value: \"degC\", label: \"C\", min: 35, max: 42 },\n                        { value: \"degF\", label: \"F\", min: 95, max: 108 },\n                      ],\n                    }}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Single-unit suffix (Weight)\">\n                  <QuantityWidget\n                    id=\"quantity-weight\"\n                    name=\"weight\"\n                    value={weightValue}\n                    onChange={onWeightChange}\n                    label=\"Weight\"\n                    description=\"Single unit, global min/max from schema\"\n                    placeholder=\"0\"\n                    propertySchema={{\n                      type: \"object\",\n                      minimum: 0,\n                      maximum: 500,\n                    }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{\n                      precision: 1,\n                      units: [{ value: \"kg\", label: \"kg\" }],\n                    }}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Integer mode (Heart Rate)\">\n                  <QuantityWidget\n                    id=\"quantity-hr\"\n                    name=\"heartRate\"\n                    value={bpValue}\n                    onChange={onBpChange}\n                    label=\"Heart Rate\"\n                    description=\"Integer with per-unit validation (30-250 bpm)\"\n                    placeholder=\"0\"\n                    propertySchema={{ type: \"object\" }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{\n                      precision: 0,\n                      units: [\n                        { value: \"bpm\", label: \"bpm\", min: 30, max: 250 },\n                      ],\n                    }}\n                  />\n                </ExampleBlock>\n                <ExampleBlock label=\"Multi-unit prefix (Currency)\">\n                  <QuantityWidget\n                    id=\"quantity-price\"\n                    name=\"price\"\n                    value={priceValue}\n                    onChange={onPriceChange}\n                    label=\"Price\"\n                    description=\"Currency symbol as prefix, multi-unit selector\"\n                    placeholder=\"0.00\"\n                    propertySchema={{ type: \"object\", minimum: 0 }}\n                    schema={dummySchema}\n                    registry={DEFAULT_WIDGETS}\n                    options={{\n                      precision: 2,\n                      unitPosition: \"prefix\",\n                      units: [\n                        { value: \"EUR\", label: \"EUR\" },\n                        { value: \"USD\", label: \"$\" },\n                        { value: \"GBP\", label: \"GBP\" },\n                      ],\n                    }}\n                  />\n                </ExampleBlock>\n              </div>\n            </SimpleStack>\n          </Card>\n        </SimpleStack>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}