tembro 3.0.0 → 3.1.1

package/dist/showcase/premium/tooltip/showcase.js

@@ -1,113 +1 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Tooltip as t } from "../../../components/ui/tooltip/index.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/showcase/premium/tooltip/showcase.tsx
-var a = [
-	"top",
-	"right",
-	"bottom",
-	"left"
-], o = "border-t border-[color:var(--aui-divider)] py-6";
-function s() {
-	let [s, c] = n.useState("top"), [l, u] = n.useState(!1);
-	return /* @__PURE__ */ i("div", {
-		className: "space-y-0",
-		children: [
-			/* @__PURE__ */ r("section", {
-				className: "pb-6",
-				children: /* @__PURE__ */ i("div", {
-					className: "flex flex-col gap-6 xl:flex-row xl:items-end xl:justify-between",
-					children: [/* @__PURE__ */ i("div", {
-						className: "max-w-xl",
-						children: [
-							/* @__PURE__ */ r("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted",
-								children: "Tooltip"
-							}),
-							/* @__PURE__ */ r("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Explain quickly, then get out"
-							}),
-							/* @__PURE__ */ r("p", {
-								className: "mt-3 text-sm leading-6 aui-text-muted",
-								children: "Tooltip should answer one short question near the trigger without interrupting the screen."
-							})
-						]
-					}), /* @__PURE__ */ i("div", {
-						className: "grid gap-3 sm:grid-cols-3 xl:min-w-[360px] xl:max-w-[420px]",
-						children: [
-							/* @__PURE__ */ i("div", {
-								className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-								children: [/* @__PURE__ */ r("p", {
-									className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-									children: "Side"
-								}), /* @__PURE__ */ r("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong capitalize",
-									children: s
-								})]
-							}),
-							/* @__PURE__ */ i("div", {
-								className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-								children: [/* @__PURE__ */ r("p", {
-									className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-									children: "State"
-								}), /* @__PURE__ */ r("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong",
-									children: l ? "Disabled" : "Enabled"
-								})]
-							}),
-							/* @__PURE__ */ i("div", {
-								className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-								children: [/* @__PURE__ */ r("p", {
-									className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-									children: "Use for"
-								}), /* @__PURE__ */ r("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong",
-									children: "Short hints"
-								})]
-							})
-						]
-					})]
-				})
-			}),
-			/* @__PURE__ */ r("section", {
-				className: o,
-				children: /* @__PURE__ */ r("div", {
-					className: "flex min-h-48 items-center justify-center rounded-[22px] border border-[color:var(--aui-divider)] p-5",
-					children: /* @__PURE__ */ r(t, {
-						content: "Copies the current docs example to your clipboard.",
-						side: s,
-						disabled: l,
-						children: /* @__PURE__ */ r(e, {
-							type: "button",
-							variant: "outline",
-							children: "Hover or focus me"
-						})
-					})
-				})
-			}),
-			/* @__PURE__ */ r("section", {
-				className: o,
-				children: /* @__PURE__ */ i("div", {
-					className: "flex flex-wrap gap-2",
-					children: [a.map((t) => /* @__PURE__ */ r(e, {
-						type: "button",
-						size: "sm",
-						variant: s === t ? "default" : "secondary",
-						onClick: () => c(t),
-						children: t
-					}, t)), /* @__PURE__ */ r(e, {
-						type: "button",
-						size: "sm",
-						variant: "outline",
-						onClick: () => u((e) => !e),
-						children: l ? "Enable" : "Disable"
-					})]
-				})
-			})
-		]
-	});
-}
-//#endregion
-export { s as TooltipShowcase };
+export * from "../../../src/showcase/premium/tooltip/showcase.js"

package/dist/showcase/premium/tree-view/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./mock.cjs"),t=require("./showcase.cjs");exports.TreeViewShowcase=t.TreeViewShowcase,exports.treeViewMock=e.treeViewMock;
+module.exports = require("../../../src/showcase/premium/tree-view/index.cjs")

package/dist/showcase/premium/tree-view/index.js

@@ -1,3 +1 @@
-import { treeViewMock as e } from "./mock.js";
-import { TreeViewShowcase as t } from "./showcase.js";
-export { t as TreeViewShowcase, e as treeViewMock };
+export * from "../../../src/showcase/premium/tree-view/index.js"

package/dist/showcase/premium/tree-view/mock.cjs

@@ -1,19 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { TreeView } from "tembro"
-
-export function Example() {
-  return (
-    <TreeView
-      items={[
-        {
-          key: "ui",
-          label: "UI",
-          children: [
-            { key: "buttons", label: "Buttons" },
-            { key: "inputs", label: "Inputs" },
-          ],
-        },
-      ]}
-      defaultExpandedKeys={["ui"]}
-    />
-  )
-}`,cliCommand:`npx tembro add tree-view`,highlights:[`Tree data model with nested children`,`Controlled and uncontrolled expand state support`,`Selectable nodes with active visual states`],scenarios:[{title:`Navigation map`,description:`Use for quick nested navigation structures.`},{title:`Docs sections`,description:`Represent nested headings and details.`}]};exports.treeViewMock=e;
+module.exports = require("../../../src/showcase/premium/tree-view/mock.cjs")

package/dist/showcase/premium/tree-view/mock.js

@@ -1,19 +1 @@
-//#region src/showcase/premium/tree-view/mock.ts
-var e = {
-	code: "import { TreeView } from \"tembro\"\n\nexport function Example() {\n  return (\n    <TreeView\n      items={[\n        {\n          key: \"ui\",\n          label: \"UI\",\n          children: [\n            { key: \"buttons\", label: \"Buttons\" },\n            { key: \"inputs\", label: \"Inputs\" },\n          ],\n        },\n      ]}\n      defaultExpandedKeys={[\"ui\"]}\n    />\n  )\n}",
-	cliCommand: "npx tembro add tree-view",
-	highlights: [
-		"Tree data model with nested children",
-		"Controlled and uncontrolled expand state support",
-		"Selectable nodes with active visual states"
-	],
-	scenarios: [{
-		title: "Navigation map",
-		description: "Use for quick nested navigation structures."
-	}, {
-		title: "Docs sections",
-		description: "Represent nested headings and details."
-	}]
-};
-//#endregion
-export { e as treeViewMock };
+export * from "../../../src/showcase/premium/tree-view/mock.js"

package/dist/showcase/premium/tree-view/showcase.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/display/tree-view.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");var a=[{key:`design`,label:`Design`,icon:(0,i.jsx)(r.FolderOpen,{className:`size-4`}),children:[{key:`components`,label:`Components`,icon:(0,i.jsx)(r.Folder,{className:`size-4`})},{key:`tokens`,label:`Tokens`,icon:(0,i.jsx)(r.File,{className:`size-4`})}]},{key:`dev`,label:`Development`,icon:(0,i.jsx)(r.Folder,{className:`size-4`}),children:[{key:`docs`,label:`Docs`,icon:(0,i.jsx)(r.File,{className:`size-4`})},{key:`release`,label:`Release`,icon:(0,i.jsx)(r.Folder,{className:`size-4`}),children:[{key:`notes`,label:`Notes`,icon:(0,i.jsx)(r.File,{className:`size-4`})}]}]}];function o(){let[e,r]=n.useState(`components`),[o,s]=n.useState([`design`,`dev`]);return(0,i.jsxs)(`div`,{className:`space-y-3`,children:[(0,i.jsx)(t.TreeView,{items:a,selectedKey:e,expandedKeys:o,onExpandedKeysChange:s,onSelect:n.useCallback(e=>{r(e.key)},[])}),(0,i.jsxs)(`div`,{className:`rounded-md border px-3 py-2 text-sm text-muted-foreground`,children:[`Selected: `,e]})]})}exports.TreeViewShowcase=o;
+module.exports = require("../../../src/showcase/premium/tree-view/showcase.cjs")

package/dist/showcase/premium/tree-view/showcase.js

@@ -1,57 +1 @@
-import { TreeView as e } from "../../../components/display/tree-view.js";
-import * as t from "react";
-import { File as n, Folder as r, FolderOpen as i } from "lucide-react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-//#region src/showcase/premium/tree-view/showcase.tsx
-var s = [{
-	key: "design",
-	label: "Design",
-	icon: /* @__PURE__ */ a(i, { className: "size-4" }),
-	children: [{
-		key: "components",
-		label: "Components",
-		icon: /* @__PURE__ */ a(r, { className: "size-4" })
-	}, {
-		key: "tokens",
-		label: "Tokens",
-		icon: /* @__PURE__ */ a(n, { className: "size-4" })
-	}]
-}, {
-	key: "dev",
-	label: "Development",
-	icon: /* @__PURE__ */ a(r, { className: "size-4" }),
-	children: [{
-		key: "docs",
-		label: "Docs",
-		icon: /* @__PURE__ */ a(n, { className: "size-4" })
-	}, {
-		key: "release",
-		label: "Release",
-		icon: /* @__PURE__ */ a(r, { className: "size-4" }),
-		children: [{
-			key: "notes",
-			label: "Notes",
-			icon: /* @__PURE__ */ a(n, { className: "size-4" })
-		}]
-	}]
-}];
-function c() {
-	let [n, r] = t.useState("components"), [i, c] = t.useState(["design", "dev"]);
-	return /* @__PURE__ */ o("div", {
-		className: "space-y-3",
-		children: [/* @__PURE__ */ a(e, {
-			items: s,
-			selectedKey: n,
-			expandedKeys: i,
-			onExpandedKeysChange: c,
-			onSelect: t.useCallback((e) => {
-				r(e.key);
-			}, [])
-		}), /* @__PURE__ */ o("div", {
-			className: "rounded-md border px-3 py-2 text-sm text-muted-foreground",
-			children: ["Selected: ", n]
-		})]
-	});
-}
-//#endregion
-export { c as TreeViewShowcase };
+export * from "../../../src/showcase/premium/tree-view/showcase.js"

package/dist/showcase/premium/types.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={textValue:`Azamat UI`,textareaValue:`Controlled preview content for the selected component.`,checked:!0,switchOn:!0,selectValue:`starter`,badgeVariant:`default`,cardCompact:!1,activeTab:`overview`};exports.defaultComponentDemoState=e;
+module.exports = require("../../src/showcase/premium/types.cjs")

package/dist/showcase/premium/types.js

@@ -1,13 +1 @@
-//#region src/showcase/premium/types.ts
-var e = {
-	textValue: "Azamat UI",
-	textareaValue: "Controlled preview content for the selected component.",
-	checked: !0,
-	switchOn: !0,
-	selectValue: "starter",
-	badgeVariant: "default",
-	cardCompact: !1,
-	activeTab: "overview"
-};
-//#endregion
-export { e as defaultComponentDemoState };
+export * from "../../src/showcase/premium/types.js"

package/dist/showcase/premium/typography/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./mock.cjs"),t=require("./showcase.cjs");exports.TypographyShowcase=t.TypographyShowcase,exports.typographyMock=e.typographyMock;
+module.exports = require("../../../src/showcase/premium/typography/index.cjs")

package/dist/showcase/premium/typography/index.js

@@ -1,3 +1 @@
-import { typographyMock as e } from "./mock.js";
-import { TypographyShowcase as t } from "./showcase.js";
-export { t as TypographyShowcase, e as typographyMock };
+export * from "../../../src/showcase/premium/typography/index.js"

package/dist/showcase/premium/typography/mock.cjs

@@ -1,13 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Blockquote, Heading, Mark, Text } from "tembro"
-
-export function Example() {
-  return (
-    <div className="space-y-2">
-      <Heading level={3}>Product page</Heading>
-      <Text muted>
-        <Mark>Typography</Mark> is part of every polished UI.
-      </Text>
-      <Blockquote>Keep hierarchy tight, readable, and reusable.</Blockquote>
-    </div>
-  )
-}`,cliCommand:`npx tembro add typography`,highlights:[`Heading hierarchy`,`Muted and default text sizes`,`Blockquote and mark patterns for content-heavy pages`],scenarios:[{title:`Docs pages`,description:`Use components for stable copy rhythm.`},{title:`Blog layouts`,description:`Keep large and small text consistent.`},{title:`Help center`,description:`Support spoilers and highlighted snippets.`}]};exports.typographyMock=e;
+module.exports = require("../../../src/showcase/premium/typography/mock.cjs")

package/dist/showcase/premium/typography/mock.js

@@ -1,26 +1 @@
-//#region src/showcase/premium/typography/mock.ts
-var e = {
-	code: "import { Blockquote, Heading, Mark, Text } from \"tembro\"\n\nexport function Example() {\n  return (\n    <div className=\"space-y-2\">\n      <Heading level={3}>Product page</Heading>\n      <Text muted>\n        <Mark>Typography</Mark> is part of every polished UI.\n      </Text>\n      <Blockquote>Keep hierarchy tight, readable, and reusable.</Blockquote>\n    </div>\n  )\n}",
-	cliCommand: "npx tembro add typography",
-	highlights: [
-		"Heading hierarchy",
-		"Muted and default text sizes",
-		"Blockquote and mark patterns for content-heavy pages"
-	],
-	scenarios: [
-		{
-			title: "Docs pages",
-			description: "Use components for stable copy rhythm."
-		},
-		{
-			title: "Blog layouts",
-			description: "Keep large and small text consistent."
-		},
-		{
-			title: "Help center",
-			description: "Support spoilers and highlighted snippets."
-		}
-	]
-};
-//#endregion
-export { e as typographyMock };
+export * from "../../../src/showcase/premium/typography/mock.js"

package/dist/showcase/premium/typography/showcase.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../components/display/typography.cjs");let t=require("react/jsx-runtime");function n(){return(0,t.jsxs)(`div`,{className:`space-y-4`,children:[(0,t.jsx)(e.Heading,{level:1,children:`Typography Surface`}),(0,t.jsx)(e.Text,{size:`lg`,muted:!0,children:`This page shows practical text primitives that scale from copy to section copy and long-form notes.`}),(0,t.jsx)(e.Heading,{level:2,children:`Status`}),(0,t.jsxs)(e.Text,{children:[`You can emphasize words with `,(0,t.jsx)(e.Mark,{children:`Mark`}),` while keeping semantic text sizes.`]}),(0,t.jsx)(e.Blockquote,{children:`Readable prose starts from stable hierarchy, not from random utility classes.`}),(0,t.jsxs)(e.Spoiler,{children:[(0,t.jsx)(e.SpoilerSummary,{children:`Expand typography details`}),(0,t.jsxs)(`div`,{className:`mt-2 space-y-2 text-sm text-muted-foreground`,children:[(0,t.jsx)(e.Text,{size:`sm`,children:`Use level + muted controls for rhythm across pages.`}),(0,t.jsx)(e.Text,{children:`Use blockquotes for citations and customer notes.`})]})]})]})}exports.TypographyShowcase=n;
+module.exports = require("../../../src/showcase/premium/typography/showcase.cjs")

package/dist/showcase/premium/typography/showcase.js

@@ -1,38 +1 @@
-import { Blockquote as e, Heading as t, Mark as n, Spoiler as r, SpoilerSummary as i, Text as a } from "../../../components/display/typography.js";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-//#region src/showcase/premium/typography/showcase.tsx
-function c() {
-	return /* @__PURE__ */ s("div", {
-		className: "space-y-4",
-		children: [
-			/* @__PURE__ */ o(t, {
-				level: 1,
-				children: "Typography Surface"
-			}),
-			/* @__PURE__ */ o(a, {
-				size: "lg",
-				muted: !0,
-				children: "This page shows practical text primitives that scale from copy to section copy and long-form notes."
-			}),
-			/* @__PURE__ */ o(t, {
-				level: 2,
-				children: "Status"
-			}),
-			/* @__PURE__ */ s(a, { children: [
-				"You can emphasize words with ",
-				/* @__PURE__ */ o(n, { children: "Mark" }),
-				" while keeping semantic text sizes."
-			] }),
-			/* @__PURE__ */ o(e, { children: "Readable prose starts from stable hierarchy, not from random utility classes." }),
-			/* @__PURE__ */ s(r, { children: [/* @__PURE__ */ o(i, { children: "Expand typography details" }), /* @__PURE__ */ s("div", {
-				className: "mt-2 space-y-2 text-sm text-muted-foreground",
-				children: [/* @__PURE__ */ o(a, {
-					size: "sm",
-					children: "Use level + muted controls for rhythm across pages."
-				}), /* @__PURE__ */ o(a, { children: "Use blockquotes for citations and customer notes." })]
-			})] })
-		]
-	});
-}
-//#endregion
-export { c as TypographyShowcase };
+export * from "../../../src/showcase/premium/typography/showcase.js"

package/dist/showcase/premium/virtual-list/index.cjs

@@ -0,0 +1 @@
+module.exports = require("../../../src/showcase/premium/virtual-list/index.cjs")

package/dist/showcase/premium/virtual-list/index.d.ts

@@ -0,0 +1,2 @@
+export { virtualListMock } from "./mock";
+export { VirtualListShowcase } from "./showcase";

package/dist/showcase/premium/virtual-list/index.js

@@ -0,0 +1 @@
+export * from "../../../src/showcase/premium/virtual-list/index.js"

package/dist/showcase/premium/virtual-list/mock.cjs

@@ -0,0 +1 @@
+module.exports = require("../../../src/showcase/premium/virtual-list/mock.cjs")

package/dist/showcase/premium/virtual-list/mock.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentDemoMock } from "../types";
+export declare const virtualListMock: ComponentDemoMock;

package/dist/showcase/premium/virtual-list/mock.js

@@ -0,0 +1 @@
+export * from "../../../src/showcase/premium/virtual-list/mock.js"

package/dist/showcase/premium/virtual-list/showcase.cjs

@@ -0,0 +1 @@
+module.exports = require("../../../src/showcase/premium/virtual-list/showcase.cjs")

package/dist/showcase/premium/virtual-list/showcase.d.ts

@@ -0,0 +1,2 @@
+import * as React from "react";
+export declare function VirtualListShowcase(): React.JSX.Element;

package/dist/showcase/premium/virtual-list/showcase.js

@@ -0,0 +1 @@
+export * from "../../../src/showcase/premium/virtual-list/showcase.js"

package/dist/showcase/preview-catalog.cjs

@@ -1,42 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=[{slug:`dashboard-01`,title:`Dashboard with sidebar`,command:`npx tembro init --template next --defaults
-npx tembro add app-sidebar metric-grid data-table`,code:`import { AppSidebar, MetricGrid } from "tembro"
-
-export function Dashboard01() {
-  return <AppSidebar />
-}`,tone:`dashboard`},{slug:`table-01`,title:`Advanced invoice table`,command:`npx tembro add data-table`,code:`import { DataTable } from "tembro"
-
-export function Table01() {
-  return <DataTable columns={columns} data={rows} />
-}`,tone:`table`},{slug:`auth-01`,title:`Authentication screen`,command:`npx tembro add input button`,code:`import { Button, Input } from "tembro"
-
-export function Auth01() {
-  return (
-    <div className="space-y-3">
-      <Input placeholder="Email" type="email" />
-      <Input placeholder="Password" type="password" />
-      <Button>Sign in</Button>
-    </div>
-  )
-}`,tone:`auth`},{slug:`product-01`,title:`Commerce product detail`,command:`npx tembro add badge button`,code:`import { Badge, Button } from "tembro"
-
-export function Product01() {
-  return (
-    <div className="space-y-2">
-      <Badge>Featured</Badge>
-      <div>Starter kit bundle</div>
-      <Button>Buy now</Button>
-    </div>
-  )
-}`,tone:`product`},{slug:`command-01`,title:`Command palette`,command:`npx tembro add command-palette`,code:`import { CommandPalette } from "tembro"
-
-export function Command01() {
-  return <CommandPalette />
-}`,tone:`command`},{slug:`calendar-01`,title:`Calendar and date picker`,command:`npx tembro add calendar date-picker`,code:`import { Calendar } from "tembro"
-
-export function Calendar01() {
-  return <Calendar />
-}`,tone:`calendar`},{slug:`upload-01`,title:`Upload workspace`,command:`npx tembro add file-upload image-upload`,code:`import { FileUpload } from "tembro"
-
-export function Upload01() {
-  return <FileUpload />
-}`,tone:`upload`}];function t(t){return e.find(e=>e.slug===t)??null}exports.getPreviewSurface=t,exports.previewSurfaceCatalog=e;
+module.exports = require("../src/showcase/preview-catalog.cjs")

package/dist/showcase/preview-catalog.js

@@ -1,57 +1 @@
-//#region src/showcase/preview-catalog.tsx
-var e = [
-	{
-		slug: "dashboard-01",
-		title: "Dashboard with sidebar",
-		command: "npx tembro init --template next --defaults\nnpx tembro add app-sidebar metric-grid data-table",
-		code: "import { AppSidebar, MetricGrid } from \"tembro\"\n\nexport function Dashboard01() {\n  return <AppSidebar />\n}",
-		tone: "dashboard"
-	},
-	{
-		slug: "table-01",
-		title: "Advanced invoice table",
-		command: "npx tembro add data-table",
-		code: "import { DataTable } from \"tembro\"\n\nexport function Table01() {\n  return <DataTable columns={columns} data={rows} />\n}",
-		tone: "table"
-	},
-	{
-		slug: "auth-01",
-		title: "Authentication screen",
-		command: "npx tembro add input button",
-		code: "import { Button, Input } from \"tembro\"\n\nexport function Auth01() {\n  return (\n    <div className=\"space-y-3\">\n      <Input placeholder=\"Email\" type=\"email\" />\n      <Input placeholder=\"Password\" type=\"password\" />\n      <Button>Sign in</Button>\n    </div>\n  )\n}",
-		tone: "auth"
-	},
-	{
-		slug: "product-01",
-		title: "Commerce product detail",
-		command: "npx tembro add badge button",
-		code: "import { Badge, Button } from \"tembro\"\n\nexport function Product01() {\n  return (\n    <div className=\"space-y-2\">\n      <Badge>Featured</Badge>\n      <div>Starter kit bundle</div>\n      <Button>Buy now</Button>\n    </div>\n  )\n}",
-		tone: "product"
-	},
-	{
-		slug: "command-01",
-		title: "Command palette",
-		command: "npx tembro add command-palette",
-		code: "import { CommandPalette } from \"tembro\"\n\nexport function Command01() {\n  return <CommandPalette />\n}",
-		tone: "command"
-	},
-	{
-		slug: "calendar-01",
-		title: "Calendar and date picker",
-		command: "npx tembro add calendar date-picker",
-		code: "import { Calendar } from \"tembro\"\n\nexport function Calendar01() {\n  return <Calendar />\n}",
-		tone: "calendar"
-	},
-	{
-		slug: "upload-01",
-		title: "Upload workspace",
-		command: "npx tembro add file-upload image-upload",
-		code: "import { FileUpload } from \"tembro\"\n\nexport function Upload01() {\n  return <FileUpload />\n}",
-		tone: "upload"
-	}
-];
-function t(t) {
-	return e.find((e) => e.slug === t) ?? null;
-}
-//#endregion
-export { t as getPreviewSurface, e as previewSurfaceCatalog };
+export * from "../src/showcase/preview-catalog.js"

package/dist/showcase/preview-registry.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../components/ui/button/index.cjs"),t=require("../components/ui/input/index.cjs"),n=require("../components/ui/badge/index.cjs"),r=require("../components/ui/table/index.cjs"),i=require("../components/actions/demo.cjs"),a=require("../components/calendar/demo.cjs"),o=require("../components/data-table/demo.cjs"),s=require("../components/display/demo.cjs"),c=require("../components/feedback/demo.cjs"),l=require("../components/filters/demo.cjs"),u=require("../components/form/demo.cjs"),d=require("../components/inputs/demo.cjs"),f=require("../components/layout/demo.cjs"),p=require("../components/navigation/demo.cjs"),m=require("../components/overlay/demo.cjs"),h=require("../components/patterns/demo.cjs"),g=require("../components/upload/demo.cjs"),_=require("../components/wizard/demo.cjs"),v=require("./premium/types.cjs"),y=require("./premium/index.cjs"),b=require("./registry-specific.cjs"),x=require("./supplemental.cjs"),S=require("./preview-catalog.cjs");let C=require("react/jsx-runtime");var w=[{label:`Revenue`,value:`$24,780`,delta:`+12.8%`},{label:`Users`,value:`18,390`,delta:`+7.2%`},{label:`Orders`,value:`1,429`,delta:`+6.1%`},{label:`Conversion`,value:`6.3%`,delta:`+1.1%`}],T=[[`AZ-001`,`Acme Dashboard`,`Live`,`$8,240`],[`AZ-002`,`CRM Workspace`,`Review`,`$5,180`],[`AZ-003`,`Store Command`,`Draft`,`$3,740`],[`AZ-004`,`Finance Dock`,`Live`,`$7,620`]],E=[[`INV-001`,`Acme Inc.`,`Paid`,`$2,400`],[`INV-002`,`Larana`,`Review`,`$1,280`],[`INV-003`,`ShipFast`,`Draft`,`$980`],[`INV-004`,`Toolpad`,`Paid`,`$4,120`],[`INV-005`,`Pixels UI`,`Paid`,`$3,860`]],D=`min-h-screen bg-[var(--aui-page-bg-alt)] p-6 aui-text-strong`,O=`border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] shadow-[var(--aui-shadow-panel)]`,k=`border border-[color:var(--aui-divider)] bg-[color:var(--aui-surface-muted)]`,A=`aui-surface-strong text-[color:var(--aui-surface-strong-foreground)]`,j=`aui-text-muted`,M=`text-[color:color-mix(in_oklch,var(--aui-surface-strong-foreground),transparent_28%)]`,N=`border-[color:color-mix(in_oklch,var(--aui-surface-strong-foreground),transparent_88%)] bg-[color:color-mix(in_oklch,var(--aui-surface-strong-foreground),transparent_90%)] text-[color:var(--aui-surface-strong-foreground)]`,P=`border-[color:color-mix(in_oklch,var(--aui-surface-strong-foreground),transparent_88%)] bg-[color:color-mix(in_oklch,var(--aui-surface-strong-foreground),transparent_95%)] text-[color:color-mix(in_oklch,var(--aui-surface-strong-foreground),transparent_18%)]`,F={...i.actionsShowcaseDemoRegistry,...a.calendarShowcaseDemoRegistry,...o.dataTableShowcaseDemoRegistry,...s.displayShowcaseDemoRegistry,...c.feedbackShowcaseDemoRegistry,...l.filtersShowcaseDemoRegistry,...u.formShowcaseDemoRegistry,...d.inputsShowcaseDemoRegistry,...f.layoutShowcaseDemoRegistry,...p.navigationShowcaseDemoRegistry,...m.overlayShowcaseDemoRegistry,...h.patternsShowcaseDemoRegistry,...g.uploadShowcaseDemoRegistry,..._.wizardShowcaseDemoRegistry,...b.registrySpecificDemoRegistry,...x.supplementalShowcaseDemoRegistry,...y.premiumShowcaseDemoRegistry};function I(){return(0,C.jsx)(`div`,{className:`flex size-11 items-center justify-center rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-surface-strong)] text-sm font-semibold tracking-[0.2em] text-[color:var(--aui-surface-strong-foreground)]`,children:`AZ`})}function L({tone:i}){return i===`dashboard`?(0,C.jsx)(`div`,{className:D,children:(0,C.jsxs)(`div`,{className:`grid min-h-[720px] gap-6 lg:grid-cols-[260px_1fr]`,children:[(0,C.jsxs)(`aside`,{className:`rounded-[28px] p-5 ${O}`,children:[(0,C.jsxs)(`div`,{className:`mb-6 flex items-center gap-3`,children:[(0,C.jsx)(I,{}),(0,C.jsxs)(`div`,{children:[(0,C.jsx)(`p`,{className:`font-semibold`,children:`Azamat UI`}),(0,C.jsx)(`p`,{className:`text-sm ${j}`,children:`Dashboard shell`})]})]}),(0,C.jsx)(`div`,{className:`space-y-2 text-sm`,children:[`Overview`,`Analytics`,`Customers`,`Orders`,`Finance`,`Settings`].map((e,t)=>(0,C.jsx)(`div`,{className:t===0?`rounded-2xl px-4 py-3 ${A}`:`rounded-2xl px-4 py-3 ${j}`,children:e},e))})]}),(0,C.jsxs)(`main`,{className:`space-y-6 rounded-[32px] p-6 ${O}`,children:[(0,C.jsxs)(`div`,{className:`flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between`,children:[(0,C.jsxs)(`div`,{children:[(0,C.jsx)(`p`,{className:`text-sm uppercase tracking-[0.24em] ${j}`,children:`Overview`}),(0,C.jsx)(`h1`,{className:`mt-2 text-4xl font-semibold tracking-tight`,children:`Operations dashboard`})]}),(0,C.jsxs)(`div`,{className:`flex gap-3`,children:[(0,C.jsx)(e.Button,{variant:`outline`,className:`rounded-2xl`,children:`Route preview`}),(0,C.jsx)(e.Button,{className:`rounded-2xl`,children:`Create report`})]})]}),(0,C.jsx)(`div`,{className:`grid gap-4 xl:grid-cols-4`,children:w.map(e=>(0,C.jsxs)(`div`,{className:`rounded-[24px] p-5 ${k}`,children:[(0,C.jsx)(`p`,{className:`text-sm ${j}`,children:e.label}),(0,C.jsx)(`p`,{className:`mt-2 text-3xl font-semibold tracking-tight`,children:e.value}),(0,C.jsx)(`p`,{className:`mt-3 text-sm text-emerald-600`,children:e.delta})]},e.label))}),(0,C.jsxs)(`div`,{className:`grid gap-6 xl:grid-cols-[1.15fr_0.85fr]`,children:[(0,C.jsxs)(`section`,{className:`rounded-[28px] p-5 ${k}`,children:[(0,C.jsx)(`h2`,{className:`text-xl font-semibold`,children:`Revenue trend`}),(0,C.jsx)(`p`,{className:`mt-2 text-sm leading-6 ${j}`,children:`Monthly performance with steady lift across product lines.`}),(0,C.jsx)(`div`,{className:`mt-5 h-72 rounded-[24px] bg-[color:var(--aui-page-bg)] [background-image:linear-gradient(180deg,color-mix(in_oklch,var(--aui-accent)_18%,transparent),transparent),radial-gradient(circle_at_bottom_left,color-mix(in_oklch,var(--aui-success)_20%,transparent),transparent_40%)]`})]}),(0,C.jsxs)(`section`,{className:`rounded-[28px] p-5 ${k}`,children:[(0,C.jsx)(`h2`,{className:`text-xl font-semibold`,children:`Release checklist`}),(0,C.jsx)(`p`,{className:`mt-2 text-sm leading-6 ${j}`,children:`Production gating before public deployment.`}),(0,C.jsx)(`div`,{className:`mt-5 space-y-3`,children:[`QA approved`,`Docs updated`,`Tokens synced`,`Routes verified`].map((e,t)=>(0,C.jsxs)(`div`,{className:`flex items-center justify-between rounded-2xl px-4 py-3 ${O}`,children:[(0,C.jsx)(`span`,{children:e}),(0,C.jsx)(n.Badge,{variant:t===3?`outline`:`secondary`,children:t===3?`Pending`:`Done`})]},e))})]})]}),(0,C.jsxs)(`section`,{className:`rounded-[28px] p-5 ${k}`,children:[(0,C.jsxs)(`div`,{className:`flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between`,children:[(0,C.jsxs)(`div`,{children:[(0,C.jsx)(`h2`,{className:`text-xl font-semibold`,children:`Recent workspaces`}),(0,C.jsx)(`p`,{className:`mt-2 text-sm leading-6 ${j}`,children:`Dense table preview inside a public docs frame.`})]}),(0,C.jsxs)(`div`,{className:`flex gap-3`,children:[(0,C.jsx)(t.Input,{placeholder:`Filter rows...`,className:`w-full lg:w-64`}),(0,C.jsx)(e.Button,{variant:`outline`,className:`rounded-2xl`,children:`Export`})]})]}),(0,C.jsx)(`div`,{className:`mt-5 overflow-hidden rounded-[24px] ${O}`,children:(0,C.jsxs)(r.Table,{children:[(0,C.jsx)(r.TableHeader,{children:(0,C.jsxs)(r.TableRow,{children:[(0,C.jsx)(r.TableHead,{children:`ID`}),(0,C.jsx)(r.TableHead,{children:`Name`}),(0,C.jsx)(r.TableHead,{children:`Status`}),(0,C.jsx)(r.TableHead,{className:`text-right`,children:`Revenue`})]})}),(0,C.jsx)(r.TableBody,{children:T.map(([e,t,i,a])=>(0,C.jsxs)(r.TableRow,{children:[(0,C.jsx)(r.TableCell,{children:e}),(0,C.jsx)(r.TableCell,{children:t}),(0,C.jsx)(r.TableCell,{children:(0,C.jsx)(n.Badge,{variant:i===`Live`?`secondary`:i===`Review`?`outline`:`destructive`,children:i})}),(0,C.jsx)(r.TableCell,{className:`text-right`,children:a})]},e))})]})})]})]})]})}):i===`table`?(0,C.jsx)(`div`,{className:D,children:(0,C.jsxs)(`section`,{className:`mx-auto max-w-6xl rounded-[32px] p-6 ${O}`,children:[(0,C.jsxs)(`div`,{className:`flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between`,children:[(0,C.jsxs)(`div`,{children:[(0,C.jsx)(`h1`,{className:`text-3xl font-semibold tracking-tight`,children:`Invoices table`}),(0,C.jsx)(`p`,{className:`mt-2 text-sm leading-6 ${j}`,children:`Responsive data-table preview route with filters, states and pagination shell.`})]}),(0,C.jsxs)(`div`,{className:`flex gap-3`,children:[(0,C.jsx)(t.Input,{placeholder:`Search invoices...`,className:`w-full lg:w-64`}),(0,C.jsx)(e.Button,{variant:`outline`,className:`rounded-2xl`,children:`Columns`}),(0,C.jsx)(e.Button,{className:`rounded-2xl`,children:`Export CSV`})]})]}),(0,C.jsxs)(`div`,{className:`mt-5 space-y-5`,children:[(0,C.jsx)(`div`,{className:`flex flex-wrap gap-2`,children:[`All`,`Paid`,`Review`,`Draft`].map((e,t)=>(0,C.jsx)(n.Badge,{variant:t===0?`default`:`outline`,children:e},e))}),(0,C.jsx)(`div`,{className:`overflow-hidden rounded-[24px] ${O}`,children:(0,C.jsxs)(r.Table,{children:[(0,C.jsx)(r.TableHeader,{children:(0,C.jsxs)(r.TableRow,{children:[(0,C.jsx)(r.TableHead,{children:`Invoice`}),(0,C.jsx)(r.TableHead,{children:`Customer`}),(0,C.jsx)(r.TableHead,{children:`Status`}),(0,C.jsx)(r.TableHead,{className:`text-right`,children:`Amount`})]})}),(0,C.jsx)(r.TableBody,{children:E.map(([e,t,i,a])=>(0,C.jsxs)(r.TableRow,{children:[(0,C.jsx)(r.TableCell,{children:e}),(0,C.jsx)(r.TableCell,{children:t}),(0,C.jsx)(r.TableCell,{children:(0,C.jsx)(n.Badge,{variant:i===`Paid`?`secondary`:i===`Review`?`outline`:`destructive`,children:i})}),(0,C.jsx)(r.TableCell,{className:`text-right`,children:a})]},e))})]})}),(0,C.jsxs)(`div`,{className:`flex items-center justify-between rounded-[24px] px-4 py-3 text-sm ${k} ${j}`,children:[(0,C.jsx)(`span`,{children:`5 rows visible`}),(0,C.jsxs)(`div`,{className:`flex gap-2`,children:[(0,C.jsx)(e.Button,{variant:`outline`,size:`sm`,children:`Prev`}),(0,C.jsx)(e.Button,{size:`sm`,children:`Next`})]})]})]})]})}):i===`auth`?(0,C.jsx)(`div`,{className:`min-h-screen bg-[linear-gradient(180deg,color-mix(in_oklch,var(--aui-warning)_14%,var(--aui-page-bg-alt)),var(--aui-page-bg))] p-6 aui-text-strong`,children:(0,C.jsxs)(`div`,{className:`mx-auto grid min-h-[720px] max-w-6xl gap-6 lg:grid-cols-[1.05fr_0.95fr]`,children:[(0,C.jsxs)(`div`,{className:`flex flex-col justify-between rounded-[36px] border border-[color:color-mix(in_oklch,var(--aui-warning)_40%,transparent)] bg-[radial-gradient(circle_at_top_left,color-mix(in_oklch,var(--aui-warning)_22%,transparent),transparent_35%),var(--aui-surface-strong)] p-8 text-[color:var(--aui-surface-strong-foreground)] shadow-[var(--aui-shadow-panel)]`,children:[(0,C.jsxs)(`div`,{children:[(0,C.jsxs)(`div`,{className:`inline-flex items-center gap-3 rounded-full border px-3 py-2 ${N}`,children:[(0,C.jsx)(`div`,{className:`flex size-8 items-center justify-center rounded-xl border-[color:color-mix(in_oklch,var(--aui-surface-strong-foreground),transparent_88%)] bg-[color:var(--aui-page-bg)] text-xs font-semibold tracking-[0.22em] text-[color:var(--aui-page-foreground)]`,children:`AZ`}),(0,C.jsx)(`span`,{className:`text-sm font-medium`,children:`Azamat UI`})]}),(0,C.jsx)(`h1`,{className:`mt-8 max-w-lg text-5xl font-semibold tracking-tight`,children:`Production sign in flow for modern product surfaces.`}),(0,C.jsx)(`p`,{className:`mt-4 max-w-md text-base leading-7 ${M}`,children:`Preview a reusable auth block inside the docs system without leaving the library site.`})]}),(0,C.jsx)(`div`,{className:`grid gap-3 sm:grid-cols-3`,children:[`Social login`,`Password reset`,`Session states`].map(e=>(0,C.jsx)(`div`,{className:`rounded-2xl border px-4 py-4 text-sm ${P}`,children:e},e))})]}),(0,C.jsx)(`section`,{className:`flex items-center rounded-[36px] p-8 ${O}`,children:(0,C.jsxs)(`div`,{className:`mx-auto w-full max-w-md space-y-6`,children:[(0,C.jsxs)(`div`,{className:`space-y-2 text-center`,children:[(0,C.jsx)(`h2`,{className:`text-3xl font-semibold tracking-tight`,children:`Welcome back`}),(0,C.jsx)(`p`,{className:`text-sm leading-6 ${j}`,children:`Sign in to continue to your workspace and preview environment.`})]}),(0,C.jsx)(e.Button,{variant:`outline`,className:`w-full rounded-2xl`,children:`Continue with Google`}),(0,C.jsxs)(`div`,{className:`grid gap-4`,children:[(0,C.jsxs)(`div`,{className:`space-y-2`,children:[(0,C.jsx)(`label`,{className:`text-sm font-medium aui-text-subtle`,children:`Email`}),(0,C.jsx)(t.Input,{defaultValue:`jane@example.com`})]}),(0,C.jsxs)(`div`,{className:`space-y-2`,children:[(0,C.jsx)(`label`,{className:`text-sm font-medium aui-text-subtle`,children:`Password`}),(0,C.jsx)(t.Input,{type:`password`,defaultValue:`password123`})]})]}),(0,C.jsx)(e.Button,{className:`w-full rounded-2xl`,children:`Sign in`}),(0,C.jsxs)(`div`,{className:`flex items-center justify-between text-sm ${j}`,children:[(0,C.jsx)(`span`,{children:`Forgot password?`}),(0,C.jsx)(`span`,{children:`Create account`})]})]})})]})}):i===`product`?(0,C.jsx)(`div`,{className:`min-h-screen bg-[linear-gradient(180deg,color-mix(in_oklch,var(--aui-danger)_10%,var(--aui-page-bg-alt)),var(--aui-page-bg))] p-6 aui-text-strong`,children:(0,C.jsxs)(`div`,{className:`mx-auto grid max-w-6xl gap-6 lg:grid-cols-[1.05fr_0.95fr]`,children:[(0,C.jsx)(`section`,{className:`rounded-[36px] p-8 ${O}`,children:(0,C.jsx)(`div`,{className:`flex h-[560px] items-center justify-center rounded-[28px] bg-[radial-gradient(circle_at_top,color-mix(in_oklch,var(--aui-danger)_16%,transparent),transparent_35%),linear-gradient(180deg,var(--aui-page-bg),color-mix(in_oklch,var(--aui-danger)_8%,var(--aui-page-bg)))]`,children:(0,C.jsxs)(`div`,{className:`grid gap-6`,children:[(0,C.jsx)(`div`,{className:`mx-auto h-72 w-56 rounded-[28px] ${O}`}),(0,C.jsx)(`div`,{className:`grid grid-cols-4 gap-3`,children:[,,,,].fill(null).map((e,t)=>(0,C.jsx)(`div`,{className:`h-20 rounded-2xl ${O}`},t))})]})})}),(0,C.jsxs)(`div`,{className:`space-y-6 rounded-[36px] p-8 ${O}`,children:[(0,C.jsxs)(`div`,{className:`space-y-4`,children:[(0,C.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,C.jsx)(n.Badge,{className:`rounded-full bg-emerald-50 text-emerald-700 hover:bg-emerald-50`,children:`In stock`}),(0,C.jsx)(n.Badge,{variant:`outline`,children:`Ships today`})]}),(0,C.jsx)(`h1`,{className:`text-5xl font-semibold tracking-tight`,children:`Azamat Chair`}),(0,C.jsx)(`p`,{className:`text-lg leading-8 ${j}`,children:`A clean product detail surface with media gallery, pricing hierarchy and conversion controls.`})]}),(0,C.jsx)(`div`,{className:`rounded-[28px] p-6 ${k}`,children:(0,C.jsxs)(`div`,{className:`flex items-end justify-between`,children:[(0,C.jsxs)(`div`,{children:[(0,C.jsx)(`p`,{className:`text-sm ${j}`,children:`Price`}),(0,C.jsx)(`p`,{className:`mt-2 text-4xl font-semibold`,children:`$249`})]}),(0,C.jsx)(`p`,{className:`text-sm text-emerald-600`,children:`Free shipping`})]})}),(0,C.jsx)(`div`,{className:`grid gap-3 sm:grid-cols-3`,children:[`Oak`,`Walnut`,`Black`].map((e,t)=>(0,C.jsx)(`button`,{className:t===0?`rounded-2xl border px-4 py-3 text-sm ${A}`:`rounded-2xl border border-[color:var(--aui-divider)] px-4 py-3 text-sm aui-text-subtle`,children:e},e))}),(0,C.jsxs)(`div`,{className:`flex gap-3`,children:[(0,C.jsx)(e.Button,{className:`flex-1 rounded-2xl`,children:`Add to cart`}),(0,C.jsx)(e.Button,{variant:`outline`,className:`flex-1 rounded-2xl`,children:`Save`})]}),(0,C.jsx)(`div`,{className:`grid gap-3`,children:[`Premium ash wood frame`,`Textured linen seat`,`Two-year warranty`].map(e=>(0,C.jsx)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] px-4 py-3 text-sm aui-text-subtle`,children:e},e))})]})]})}):i===`command`?(0,C.jsx)(`div`,{className:D,children:(0,C.jsx)(`div`,{className:`mx-auto max-w-4xl rounded-[36px] p-6 ${O}`,children:(0,C.jsxs)(`div`,{className:`mx-auto max-w-3xl overflow-hidden rounded-[28px] bg-[linear-gradient(180deg,var(--aui-page-bg),var(--aui-page-bg-alt))] ${O}`,children:[(0,C.jsx)(`div`,{className:`border-b border-[color:var(--aui-divider)] px-5 py-4`,children:(0,C.jsx)(t.Input,{defaultValue:`Search components, blocks, templates...`,className:`border-0 px-0 text-base shadow-none focus-visible:ring-0`})}),(0,C.jsxs)(`div`,{className:`grid gap-6 p-5 md:grid-cols-2`,children:[(0,C.jsxs)(`div`,{children:[(0,C.jsx)(`p`,{className:`mb-3 text-xs font-semibold uppercase tracking-[0.24em] ${j}`,children:`Trending`}),(0,C.jsx)(`div`,{className:`space-y-2`,children:[`Button`,`Input`,`Card`,`Dialog`,`Data Table`].map((e,t)=>(0,C.jsxs)(`div`,{className:t===0?`flex items-center justify-between rounded-2xl px-4 py-3 text-sm ${A}`:`flex items-center justify-between rounded-2xl px-4 py-3 text-sm aui-text-subtle`,children:[(0,C.jsx)(`span`,{children:e}),(0,C.jsx)(n.Badge,{variant:t===0?`secondary`:`outline`,children:String.fromCharCode(66+t)})]},e))})]}),(0,C.jsxs)(`div`,{children:[(0,C.jsx)(`p`,{className:`mb-3 text-xs font-semibold uppercase tracking-[0.24em] ${j}`,children:`Quick actions`}),(0,C.jsx)(`div`,{className:`space-y-2`,children:[`Open docs`,`Preview template`,`Copy install command`,`Switch theme`].map(e=>(0,C.jsx)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] px-4 py-3 text-sm aui-text-subtle`,children:e},e))})]})]})]})})}):i===`calendar`?(0,C.jsx)(`div`,{className:`min-h-screen bg-[linear-gradient(180deg,color-mix(in_oklch,var(--aui-accent)_10%,var(--aui-page-bg-alt)),var(--aui-page-bg))] p-6 aui-text-strong`,children:(0,C.jsxs)(`div`,{className:`mx-auto grid max-w-5xl gap-6 lg:grid-cols-[0.95fr_1.05fr]`,children:[(0,C.jsxs)(`section`,{className:`rounded-[32px] p-6 ${O}`,children:[(0,C.jsx)(`h1`,{className:`text-3xl font-semibold tracking-tight`,children:`June 2026`}),(0,C.jsx)(`p`,{className:`mt-2 text-sm leading-6 ${j}`,children:`Calendar family preview with selected dates and scheduling context.`}),(0,C.jsx)(`div`,{className:`mt-5 grid grid-cols-7 gap-2 text-center text-sm`,children:[`Mo`,`Tu`,`We`,`Th`,`Fr`,`Sa`,`Su`,...Array.from({length:35},(e,t)=>`${t+1}`)].map((e,t)=>(0,C.jsx)(`div`,{className:t>10&&t<13?`rounded-2xl px-3 py-3 ${A}`:`rounded-2xl border border-[color:var(--aui-divider)] px-3 py-3 aui-text-subtle`,children:e},`${e}-${t}`))})]}),(0,C.jsxs)(`section`,{className:`rounded-[32px] p-6 ${O}`,children:[(0,C.jsx)(`h2`,{className:`text-2xl font-semibold tracking-tight`,children:`Schedule event`}),(0,C.jsx)(`p`,{className:`mt-2 text-sm leading-6 ${j}`,children:`Pair calendar surfaces with summary cards and chosen range context.`}),(0,C.jsxs)(`div`,{className:`mt-5 space-y-4`,children:[(0,C.jsxs)(`div`,{className:`rounded-[24px] p-5 ${k}`,children:[(0,C.jsx)(`p`,{className:`text-sm ${j}`,children:`Selected range`}),(0,C.jsx)(`p`,{className:`mt-2 text-2xl font-semibold`,children:`12 Jun - 18 Jun`})]}),(0,C.jsx)(`div`,{className:`grid gap-3`,children:[`Design review`,`Prototype handoff`,`Release QA`].map(e=>(0,C.jsxs)(`div`,{className:`flex items-center justify-between rounded-2xl border border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,C.jsx)(`span`,{className:`text-sm aui-text-subtle`,children:e}),(0,C.jsx)(n.Badge,{variant:`outline`,children:`Scheduled`})]},e))})]})]})]})}):(0,C.jsx)(`div`,{className:`min-h-screen bg-[linear-gradient(180deg,color-mix(in_oklch,var(--aui-success)_8%,var(--aui-page-bg-alt)),var(--aui-page-bg))] p-6 aui-text-strong`,children:(0,C.jsx)(`div`,{className:`mx-auto max-w-5xl space-y-6`,children:(0,C.jsxs)(`section`,{className:`rounded-[32px] p-6 ${O}`,children:[(0,C.jsx)(`h1`,{className:`text-3xl font-semibold tracking-tight`,children:`Upload assets`}),(0,C.jsx)(`p`,{className:`mt-2 text-sm leading-6 ${j}`,children:`Preview drag, status and asset-library patterns in one route.`}),(0,C.jsxs)(`div`,{className:`mt-5 grid gap-6 lg:grid-cols-[1.05fr_0.95fr]`,children:[(0,C.jsx)(`div`,{className:`flex min-h-[320px] items-center justify-center rounded-[28px] border border-dashed border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface-muted)]`,children:(0,C.jsxs)(`div`,{className:`space-y-3 text-center`,children:[(0,C.jsx)(`p`,{className:`text-lg font-semibold`,children:`Drop files here`}),(0,C.jsx)(`p`,{className:`text-sm ${j}`,children:`PNG, JPG, SVG, PDF up to 20MB`}),(0,C.jsx)(e.Button,{className:`rounded-2xl`,children:`Browse files`})]})}),(0,C.jsx)(`div`,{className:`space-y-3`,children:[`Brand-guide.pdf`,`hero-image.png`,`avatar-collection.zip`].map((e,t)=>(0,C.jsxs)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] px-4 py-4`,children:[(0,C.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,C.jsx)(`span`,{className:`font-medium aui-text-strong`,children:e}),(0,C.jsx)(n.Badge,{variant:t===2?`outline`:`secondary`,children:t===2?`Uploading`:`Done`})]}),(0,C.jsx)(`div`,{className:`mt-3 h-2 rounded-full bg-[color:var(--aui-surface-muted)]`,children:(0,C.jsx)(`div`,{className:t===2?`h-2 w-2/3 rounded-full bg-[color:var(--aui-surface-strong)]`:`h-2 w-full rounded-full bg-emerald-500`})})]},e))})]})]})})})}var R=Object.fromEntries(S.previewSurfaceCatalog.map(e=>[e.slug,{title:e.title,command:e.command,code:e.code,Render:function(){return(0,C.jsx)(L,{tone:e.tone})}}]));function z(e){let t=F[e];return t?{title:`${e} preview`,command:`npx tembro add ${e}`,code:t.mock.code,Render(){return(0,C.jsx)(`div`,{className:D,children:(0,C.jsxs)(`div`,{className:`mx-auto max-w-5xl space-y-6 rounded-[32px] p-6 ${O}`,children:[(0,C.jsxs)(`div`,{className:`space-y-2`,children:[(0,C.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,C.jsx)(`span`,{className:`rounded-full border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] px-2.5 py-1 text-[11px] font-semibold uppercase tracking-[0.18em] ${j}`,children:`Component preview`}),(0,C.jsx)(`span`,{className:`rounded-full border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] px-2.5 py-1 text-[11px] font-semibold uppercase tracking-[0.18em] ${j}`,children:`Playground route`})]}),(0,C.jsx)(`h1`,{className:`text-4xl font-semibold tracking-tight capitalize`,children:e}),(0,C.jsx)(`p`,{className:`text-base leading-7 ${j}`,children:`Direct component demo route for iframe-based docs preview.`})]}),(0,C.jsx)(`div`,{className:`rounded-[28px] border border-[color:var(--aui-divider)] bg-[linear-gradient(180deg,var(--aui-page-bg),var(--aui-page-bg-alt))] p-6`,children:(0,C.jsx)(t.Showcase,{mode:`playground`,state:v.defaultComponentDemoState,setState:()=>void 0})}),(0,C.jsx)(`div`,{className:`grid gap-4 md:grid-cols-3`,children:t.mock.highlights.map(e=>(0,C.jsx)(`div`,{className:`rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-surface-muted)] p-4 text-sm aui-text-subtle`,children:e},e))}),(0,C.jsxs)(`div`,{className:`grid gap-4 md:grid-cols-2`,children:[(0,C.jsxs)(`div`,{className:`rounded-[24px] p-4 ${k}`,children:[(0,C.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] ${j}`,children:`CLI`}),(0,C.jsx)(`code`,{className:`mt-3 block text-sm aui-text-strong`,children:`npx tembro add ${e}`})]}),(0,C.jsxs)(`div`,{className:`rounded-[24px] p-4 ${k}`,children:[(0,C.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] ${j}`,children:`Preview note`}),(0,C.jsx)(`p`,{className:`mt-3 text-sm leading-6 aui-text-subtle`,children:`This route exists to inspect the live reusable surface in isolation before wiring it into docs, templates or application pages.`})]})]})]})})}}:null}exports.getComponentPreview=z,exports.previewBlockRegistry=R;
+module.exports = require("../src/showcase/preview-registry.cjs")