tembro 3.1.16 → 4.0.0

package/dist/src/showcase/component-route-data.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=[{value:`north`,label:`North Region`,description:`Sales ops`,team:`Sales`,status:`Live`},{value:`south`,label:`South Region`,description:`Support team`,team:`Support`,status:`Review`},{value:`west`,label:`West Region`,description:`Billing operations`,team:`Finance`,status:`Draft`}],t=[{value:`public`,label:`Public`,description:`Visible to all users`,keywords:[`open`,`live`]},{value:`private`,label:`Private`,description:`Restricted to invited members`,keywords:[`restricted`]},{value:`internal`,label:`Internal`,description:`Only workspace maintainers`,keywords:[`team`,`ops`]},{value:`archived`,label:`Archived`,description:`Kept for history only`,disabled:!0,keywords:[`disabled`]}],n=[{value:`billing`,label:`Billing`,description:`Invoices and payment status`},{value:`ops`,label:`Operations`,description:`Queues and workload`},{value:`owners`,label:`Owner: Azamat`,description:`Assigned records only`}];exports.routeSavedViews=n,exports.routeSimpleSelectOptions=t,exports.routeWorkspaceOptions=e;

package/dist/src/showcase/component-route-data.js

@@ -1,68 +0,0 @@
-//#region src/showcase/component-route-data.ts
-var e = [
-	{
-		value: "north",
-		label: "North Region",
-		description: "Sales ops",
-		team: "Sales",
-		status: "Live"
-	},
-	{
-		value: "south",
-		label: "South Region",
-		description: "Support team",
-		team: "Support",
-		status: "Review"
-	},
-	{
-		value: "west",
-		label: "West Region",
-		description: "Billing operations",
-		team: "Finance",
-		status: "Draft"
-	}
-], t = [
-	{
-		value: "public",
-		label: "Public",
-		description: "Visible to all users",
-		keywords: ["open", "live"]
-	},
-	{
-		value: "private",
-		label: "Private",
-		description: "Restricted to invited members",
-		keywords: ["restricted"]
-	},
-	{
-		value: "internal",
-		label: "Internal",
-		description: "Only workspace maintainers",
-		keywords: ["team", "ops"]
-	},
-	{
-		value: "archived",
-		label: "Archived",
-		description: "Kept for history only",
-		disabled: !0,
-		keywords: ["disabled"]
-	}
-], n = [
-	{
-		value: "billing",
-		label: "Billing",
-		description: "Invoices and payment status"
-	},
-	{
-		value: "ops",
-		label: "Operations",
-		description: "Queues and workload"
-	},
-	{
-		value: "owners",
-		label: "Owner: Azamat",
-		description: "Assigned records only"
-	}
-];
-//#endregion
-export { n as routeSavedViews, t as routeSimpleSelectOptions, e as routeWorkspaceOptions };

package/dist/src/showcase/create-demo.cjs

@@ -1,25 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./render-registry-preview.cjs"),t=require("./demo-snippets/index.cjs");let n=require("react/jsx-runtime");function r(e,t,n,r,i=t){let a=m(e);return{slug:e,title:a,component:t,kind:n,summary:r,importName:i,highlights:[`${a} renders with realistic dashboard data instead of an empty shell.`,`${t} stays isolated so copy, install and preview remain component-scoped.`,u(n)],scenarios:[{title:`Use when`,description:d(n,r)},{title:`Implementation`,description:f(e,i)}]}}function i(e){return Object.fromEntries(e.map(e=>[e.slug,{mock:a(e),Showcase:t=>(0,n.jsx)(l,{definition:e,...t})}]))}function a(e){return{cliCommand:`npx tembro add ${e.slug}`,code:o(e),highlights:e.highlights,scenarios:e.scenarios,capabilityNotes:c(e)}}function o(e){return t.demoCodeSnippets[e.slug]??s(e)}function s(e){let t=e.importName??e.component,n=`tembro`;return e.kind===`data-table`?`import { ${t} } from "${n}"
-
-export function Demo() {
-  return (
-    <div className="rounded-xl border p-3">
-      <${t} />
-    </div>
-  )
-}`:e.kind===`inputs`||e.kind===`form`?`import { ${t} } from "${n}"
-
-export function Demo() {
-  return <${t} aria-label="${e.title}" />
-}`:e.kind===`layout`||e.kind===`patterns`?`import { ${t} } from "${n}"
-
-export function Demo() {
-  return (
-    <${t}>
-      <div>Production page content</div>
-    </${t}>
-  )
-}`:`import { ${t} } from "${n}"
-
-export function Demo() {
-  return <${t} />
-}`}function c(e){return[`Add ${e.slug} into your local source with the CLI.`,`Open the ${e.title} page to review props, copyable code, and a live state preview.`,p(e.kind)]}function l({definition:t,state:r,setState:i}){return(0,n.jsxs)(`div`,{className:`space-y-5`,children:[(0,n.jsxs)(`header`,{className:`space-y-2`,children:[(0,n.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,n.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] text-[color:var(--aui-page-muted)]`,children:t.component}),(0,n.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] text-[color:var(--aui-page-muted)]`,children:t.kind})]}),(0,n.jsxs)(`div`,{children:[(0,n.jsx)(`h3`,{className:`text-2xl font-semibold tracking-tight text-[color:var(--aui-page-foreground)]`,children:t.title}),(0,n.jsx)(`p`,{className:`mt-2 max-w-2xl text-sm leading-6 text-[color:var(--aui-page-muted)]`,children:t.summary})]})]}),(0,n.jsxs)(`div`,{className:`overflow-hidden rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)]`,children:[(0,n.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-3 border-b border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,n.jsxs)(`div`,{children:[(0,n.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.18em] text-[color:var(--aui-page-muted)]`,children:`Live example`}),(0,n.jsx)(`p`,{className:`mt-1 text-sm font-medium text-[color:var(--aui-page-foreground)]`,children:`Realistic dashboard state`})]}),(0,n.jsx)(`span`,{className:`rounded-full border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] px-2.5 py-1 text-[11px] font-semibold text-[color:var(--aui-brand-strong)]`,children:`CLI ready`})]}),(0,n.jsx)(`div`,{className:`p-4 sm:p-5`,children:e.renderShowcasePreview(t,r,i)})]}),(0,n.jsx)(`div`,{className:`grid gap-3 md:grid-cols-3`,children:t.highlights.slice(0,3).map(e=>(0,n.jsx)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3 text-sm leading-6 text-[color:var(--aui-page-muted)]`,children:e},e))}),(0,n.jsx)(`div`,{className:`grid gap-3 md:grid-cols-2`,children:t.scenarios.slice(0,2).map(e=>(0,n.jsxs)(`div`,{className:`rounded-2xl border border-dashed border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,n.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.18em] text-[color:var(--aui-page-muted)]`,children:e.title}),(0,n.jsx)(`p`,{className:`mt-2 text-sm leading-6 text-[color:var(--aui-page-muted)]`,children:e.description})]},e.title))})]})}function u(e){return{actions:`Actions include labels, destructive states and compact row controls.`,calendar:`Calendar examples keep date value and month state visible.`,"data-table":`Table demos show toolbar, selection, rows, actions and pagination context.`,display:`Display demos use real entity, metric and workflow copy.`,feedback:`Feedback demos include status, action and recovery context.`,form:`Form demos keep label, hint and validation spacing visible.`,inputs:`Input demos show controlled values, placeholder copy and useful affordances.`,layout:`Layout demos show how the component frames a production screen.`,navigation:`Navigation demos show active state and route-sized labels.`,overlay:`Overlay demos keep trigger, content and action semantics together.`,patterns:`Pattern demos show page-level composition, not just isolated atoms.`,upload:`Upload demos show accepted content and empty state messaging.`,wizard:`Wizard demos include steps, progress and content slots.`}[e]}function d(e,t){return e===`data-table`?`Use on operational pages where search, filters, selection and row actions must stay visible together.`:e===`patterns`?`Use when a whole route needs consistent header, stats, filters, sections and detail content.`:e===`overlay`?`Use when the user needs a focused decision without leaving the current route.`:e===`inputs`||e===`form`?`Use inside controlled forms where label, value and validation behavior must be predictable.`:t}function f(e,t){return`Run the CLI add command for ${e}, import ${t}, then replace the preview data with your product state.`}function p(e){return{actions:`Keep action labels explicit and mark destructive operations clearly.`,calendar:`Keep date values normalized before passing them into calendar state.`,"data-table":`Wire table state first, then add visual density and presets.`,display:`Use real empty, loading and long-text cases before shipping.`,feedback:`Pair every alert or state with the next useful user action.`,form:`Validate with RHF or controlled state before styling the wrapper.`,inputs:`Keep value and onChange behavior stable for filtering and forms.`,layout:`Use layout components at route level instead of nesting them deep inside widgets.`,navigation:`Keep active state route-driven where possible.`,overlay:`Preserve focus return, escape close and mobile behavior.`,patterns:`Treat patterns as starting points for full pages, not tiny widgets.`,upload:`Validate file type, size and async error states in your app layer.`,wizard:`Persist current step and form state between step changes.`}[e]}function m(e){return e.split(`-`).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(` `)}exports.component=r,exports.createShowcaseDemoRegistry=i;

package/dist/src/showcase/create-demo.js

@@ -1,193 +0,0 @@
-import { renderShowcasePreview as e } from "./render-registry-preview.js";
-import { demoCodeSnippets as t } from "./demo-snippets/index.js";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-//#region src/showcase/create-demo.tsx
-function i(e, t, n, r, i = t) {
-	let a = h(e);
-	return {
-		slug: e,
-		title: a,
-		component: t,
-		kind: n,
-		summary: r,
-		importName: i,
-		highlights: [
-			`${a} renders with realistic dashboard data instead of an empty shell.`,
-			`${t} stays isolated so copy, install and preview remain component-scoped.`,
-			d(n)
-		],
-		scenarios: [{
-			title: "Use when",
-			description: f(n, r)
-		}, {
-			title: "Implementation",
-			description: p(e, i)
-		}]
-	};
-}
-function a(e) {
-	return Object.fromEntries(e.map((e) => [e.slug, {
-		mock: o(e),
-		Showcase: (t) => /* @__PURE__ */ n(u, {
-			definition: e,
-			...t
-		})
-	}]));
-}
-function o(e) {
-	return {
-		cliCommand: `npx tembro add ${e.slug}`,
-		code: s(e),
-		highlights: e.highlights,
-		scenarios: e.scenarios,
-		capabilityNotes: l(e)
-	};
-}
-function s(e) {
-	return t[e.slug] ?? c(e);
-}
-function c(e) {
-	let t = e.importName ?? e.component, n = "tembro";
-	return e.kind === "data-table" ? `import { ${t} } from "${n}"
-
-export function Demo() {
-  return (
-    <div className="rounded-xl border p-3">
-      <${t} />
-    </div>
-  )
-}` : e.kind === "inputs" || e.kind === "form" ? `import { ${t} } from "${n}"
-
-export function Demo() {
-  return <${t} aria-label="${e.title}" />
-}` : e.kind === "layout" || e.kind === "patterns" ? `import { ${t} } from "${n}"
-
-export function Demo() {
-  return (
-    <${t}>
-      <div>Production page content</div>
-    </${t}>
-  )
-}` : `import { ${t} } from "${n}"
-
-export function Demo() {
-  return <${t} />
-}`;
-}
-function l(e) {
-	return [
-		`Add ${e.slug} into your local source with the CLI.`,
-		`Open the ${e.title} page to review props, copyable code, and a live state preview.`,
-		m(e.kind)
-	];
-}
-function u({ definition: t, state: i, setState: a }) {
-	return /* @__PURE__ */ r("div", {
-		className: "space-y-5",
-		children: [
-			/* @__PURE__ */ r("header", {
-				className: "space-y-2",
-				children: [/* @__PURE__ */ r("div", {
-					className: "flex flex-wrap gap-2",
-					children: [/* @__PURE__ */ n("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] text-[color:var(--aui-page-muted)]",
-						children: t.component
-					}), /* @__PURE__ */ n("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] text-[color:var(--aui-page-muted)]",
-						children: t.kind
-					})]
-				}), /* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("h3", {
-					className: "text-2xl font-semibold tracking-tight text-[color:var(--aui-page-foreground)]",
-					children: t.title
-				}), /* @__PURE__ */ n("p", {
-					className: "mt-2 max-w-2xl text-sm leading-6 text-[color:var(--aui-page-muted)]",
-					children: t.summary
-				})] })]
-			}),
-			/* @__PURE__ */ r("div", {
-				className: "overflow-hidden rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)]",
-				children: [/* @__PURE__ */ r("div", {
-					className: "flex flex-wrap items-center justify-between gap-3 border-b border-[color:var(--aui-divider)] px-4 py-3",
-					children: [/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("p", {
-						className: "text-xs font-semibold uppercase tracking-[0.18em] text-[color:var(--aui-page-muted)]",
-						children: "Live example"
-					}), /* @__PURE__ */ n("p", {
-						className: "mt-1 text-sm font-medium text-[color:var(--aui-page-foreground)]",
-						children: "Realistic dashboard state"
-					})] }), /* @__PURE__ */ n("span", {
-						className: "rounded-full border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] px-2.5 py-1 text-[11px] font-semibold text-[color:var(--aui-brand-strong)]",
-						children: "CLI ready"
-					})]
-				}), /* @__PURE__ */ n("div", {
-					className: "p-4 sm:p-5",
-					children: e(t, i, a)
-				})]
-			}),
-			/* @__PURE__ */ n("div", {
-				className: "grid gap-3 md:grid-cols-3",
-				children: t.highlights.slice(0, 3).map((e) => /* @__PURE__ */ n("div", {
-					className: "rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3 text-sm leading-6 text-[color:var(--aui-page-muted)]",
-					children: e
-				}, e))
-			}),
-			/* @__PURE__ */ n("div", {
-				className: "grid gap-3 md:grid-cols-2",
-				children: t.scenarios.slice(0, 2).map((e) => /* @__PURE__ */ r("div", {
-					className: "rounded-2xl border border-dashed border-[color:var(--aui-divider)] px-4 py-3",
-					children: [/* @__PURE__ */ n("p", {
-						className: "text-xs font-semibold uppercase tracking-[0.18em] text-[color:var(--aui-page-muted)]",
-						children: e.title
-					}), /* @__PURE__ */ n("p", {
-						className: "mt-2 text-sm leading-6 text-[color:var(--aui-page-muted)]",
-						children: e.description
-					})]
-				}, e.title))
-			})
-		]
-	});
-}
-function d(e) {
-	return {
-		actions: "Actions include labels, destructive states and compact row controls.",
-		calendar: "Calendar examples keep date value and month state visible.",
-		"data-table": "Table demos show toolbar, selection, rows, actions and pagination context.",
-		display: "Display demos use real entity, metric and workflow copy.",
-		feedback: "Feedback demos include status, action and recovery context.",
-		form: "Form demos keep label, hint and validation spacing visible.",
-		inputs: "Input demos show controlled values, placeholder copy and useful affordances.",
-		layout: "Layout demos show how the component frames a production screen.",
-		navigation: "Navigation demos show active state and route-sized labels.",
-		overlay: "Overlay demos keep trigger, content and action semantics together.",
-		patterns: "Pattern demos show page-level composition, not just isolated atoms.",
-		upload: "Upload demos show accepted content and empty state messaging.",
-		wizard: "Wizard demos include steps, progress and content slots."
-	}[e];
-}
-function f(e, t) {
-	return e === "data-table" ? "Use on operational pages where search, filters, selection and row actions must stay visible together." : e === "patterns" ? "Use when a whole route needs consistent header, stats, filters, sections and detail content." : e === "overlay" ? "Use when the user needs a focused decision without leaving the current route." : e === "inputs" || e === "form" ? "Use inside controlled forms where label, value and validation behavior must be predictable." : t;
-}
-function p(e, t) {
-	return `Run the CLI add command for ${e}, import ${t}, then replace the preview data with your product state.`;
-}
-function m(e) {
-	return {
-		actions: "Keep action labels explicit and mark destructive operations clearly.",
-		calendar: "Keep date values normalized before passing them into calendar state.",
-		"data-table": "Wire table state first, then add visual density and presets.",
-		display: "Use real empty, loading and long-text cases before shipping.",
-		feedback: "Pair every alert or state with the next useful user action.",
-		form: "Validate with RHF or controlled state before styling the wrapper.",
-		inputs: "Keep value and onChange behavior stable for filtering and forms.",
-		layout: "Use layout components at route level instead of nesting them deep inside widgets.",
-		navigation: "Keep active state route-driven where possible.",
-		overlay: "Preserve focus return, escape close and mobile behavior.",
-		patterns: "Treat patterns as starting points for full pages, not tiny widgets.",
-		upload: "Validate file type, size and async error states in your app layer.",
-		wizard: "Persist current step and form state between step changes."
-	}[e];
-}
-function h(e) {
-	return e.split("-").map((e) => e.charAt(0).toUpperCase() + e.slice(1)).join(" ");
-}
-//#endregion
-export { i as component, a as createShowcaseDemoRegistry };

package/dist/src/showcase/demo-snippets/actions/index.cjs

@@ -1,64 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={"action-menu":`import { ActionMenu, Button } from "tembro"
-
-export function Demo() {
-  return (
-    <ActionMenu
-      label="Row actions"
-      actions={[
-        { key: "open", label: "Open" },
-        { key: "duplicate", label: "Duplicate" },
-        { key: "archive", label: "Archive", destructive: true },
-      ]}
-      trigger={<Button variant="outline">Actions</Button>}
-    />
-  )
-}`,"button-group":`import { ButtonGroup } from "tembro"
-
-export function Demo() {
-  return (
-    <ButtonGroup
-      items={[
-        { key: "day", label: "Day" },
-        { key: "week", label: "Week" },
-        { key: "month", label: "Month" },
-      ]}
-    />
-  )
-}`,"quick-action-grid":`import { QuickActionGrid } from "tembro"
-
-export function Demo() {
-  return (
-    <QuickActionGrid
-      columns={3}
-      items={[
-        { key: "new", label: "New invoice", description: "Create a billing row." },
-        { key: "import", label: "Import CSV", description: "Upload operational data." },
-        { key: "share", label: "Share", description: "Invite a teammate." },
-      ]}
-    />
-  )
-}`,"dialog-actions":`import { Button, ButtonGroup } from "tembro"
-
-export function Demo() {
-  return (
-    <ButtonGroup attached={false}>
-      <Button variant="ghost">Cancel</Button>
-      <Button variant="outline">Save draft</Button>
-      <Button>Publish</Button>
-    </ButtonGroup>
-  )
-}`,stepper:`import { Stepper } from "tembro"
-
-export function Demo() {
-  return (
-    <Stepper
-      currentStep="billing"
-      steps={[
-        { id: "profile", title: "Profile", completed: true },
-        { id: "billing", title: "Billing" },
-        { id: "review", title: "Review" },
-      ]}
-      onStepChange={() => undefined}
-    />
-  )
-}`};exports.actionDemoCodeSnippets=e;

package/dist/src/showcase/demo-snippets/actions/index.js

@@ -1,10 +0,0 @@
-//#region src/showcase/demo-snippets/actions/index.ts
-var e = {
-	"action-menu": "import { ActionMenu, Button } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <ActionMenu\n      label=\"Row actions\"\n      actions={[\n        { key: \"open\", label: \"Open\" },\n        { key: \"duplicate\", label: \"Duplicate\" },\n        { key: \"archive\", label: \"Archive\", destructive: true },\n      ]}\n      trigger={<Button variant=\"outline\">Actions</Button>}\n    />\n  )\n}",
-	"button-group": "import { ButtonGroup } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <ButtonGroup\n      items={[\n        { key: \"day\", label: \"Day\" },\n        { key: \"week\", label: \"Week\" },\n        { key: \"month\", label: \"Month\" },\n      ]}\n    />\n  )\n}",
-	"quick-action-grid": "import { QuickActionGrid } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <QuickActionGrid\n      columns={3}\n      items={[\n        { key: \"new\", label: \"New invoice\", description: \"Create a billing row.\" },\n        { key: \"import\", label: \"Import CSV\", description: \"Upload operational data.\" },\n        { key: \"share\", label: \"Share\", description: \"Invite a teammate.\" },\n      ]}\n    />\n  )\n}",
-	"dialog-actions": "import { Button, ButtonGroup } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <ButtonGroup attached={false}>\n      <Button variant=\"ghost\">Cancel</Button>\n      <Button variant=\"outline\">Save draft</Button>\n      <Button>Publish</Button>\n    </ButtonGroup>\n  )\n}",
-	stepper: "import { Stepper } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <Stepper\n      currentStep=\"billing\"\n      steps={[\n        { id: \"profile\", title: \"Profile\", completed: true },\n        { id: \"billing\", title: \"Billing\" },\n        { id: \"review\", title: \"Review\" },\n      ]}\n      onStepChange={() => undefined}\n    />\n  )\n}"
-};
-//#endregion
-export { e as actionDemoCodeSnippets };

package/dist/src/showcase/demo-snippets/forms/index.cjs

@@ -1,26 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={"search-input":`import { Input } from "tembro"
-
-export function Demo() {
-  return (
-    <Input
-      type="search"
-      value="invoice"
-      onValueChange={(value) => console.log(value)}
-      placeholder="Search invoices..."
-      resultCount={12}
-      shortcut="Ctrl K"
-    />
-  )
-}`,"password-input":`import { PasswordInput } from "tembro"
-
-export function Demo() {
-  return <PasswordInput placeholder="Enter secure token" autoComplete="current-password" />
-}`,"clearable-input":`import { Input } from "tembro"
-
-export function Demo() {
-  return <Input defaultValue="Tembro" placeholder="Search customer" clearable />
-}`,"tag-input":`import { TagInput } from "tembro"
-
-export function Demo() {
-  return <TagInput defaultValue={["dashboard", "billing"]} placeholder="Add tag" />
-}`};exports.formDemoCodeSnippets=e;

package/dist/src/showcase/demo-snippets/forms/index.js

@@ -1,9 +0,0 @@
-//#region src/showcase/demo-snippets/forms/index.ts
-var e = {
-	"search-input": "import { Input } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <Input\n      type=\"search\"\n      value=\"invoice\"\n      onValueChange={(value) => console.log(value)}\n      placeholder=\"Search invoices...\"\n      resultCount={12}\n      shortcut=\"Ctrl K\"\n    />\n  )\n}",
-	"password-input": "import { PasswordInput } from \"tembro\"\n\nexport function Demo() {\n  return <PasswordInput placeholder=\"Enter secure token\" autoComplete=\"current-password\" />\n}",
-	"clearable-input": "import { Input } from \"tembro\"\n\nexport function Demo() {\n  return <Input defaultValue=\"Tembro\" placeholder=\"Search customer\" clearable />\n}",
-	"tag-input": "import { TagInput } from \"tembro\"\n\nexport function Demo() {\n  return <TagInput defaultValue={[\"dashboard\", \"billing\"]} placeholder=\"Add tag\" />\n}"
-};
-//#endregion
-export { e as formDemoCodeSnippets };

package/dist/src/showcase/demo-snippets/index.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./actions/index.cjs"),t=require("./forms/index.cjs"),n=require("./layout/index.cjs"),r=require("./upload/index.cjs");var i={...e.actionDemoCodeSnippets,...t.formDemoCodeSnippets,...n.layoutDemoCodeSnippets,...r.uploadDemoCodeSnippets};exports.demoCodeSnippets=i;

package/dist/src/showcase/demo-snippets/index.js

@@ -1,13 +0,0 @@
-import { actionDemoCodeSnippets as e } from "./actions/index.js";
-import { formDemoCodeSnippets as t } from "./forms/index.js";
-import { layoutDemoCodeSnippets as n } from "./layout/index.js";
-import { uploadDemoCodeSnippets as r } from "./upload/index.js";
-//#region src/showcase/demo-snippets/index.ts
-var i = {
-	...e,
-	...t,
-	...n,
-	...r
-};
-//#endregion
-export { i as demoCodeSnippets };

package/dist/src/showcase/demo-snippets/layout/index.cjs

@@ -1,45 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={"filter-bar":`import { Button, FilterBar, Input } from "tembro"
-
-export function Demo() {
-  return (
-    <FilterBar
-      search={<Input type="search" value="" placeholder="Search rows..." readOnly />}
-      chips={[
-        { key: "status", label: "Status", value: "Active", tone: "success" },
-        { key: "owner", label: "Owner", value: "Azamat" },
-      ]}
-      filters={<Button variant="outline">Status</Button>}
-      actions={<Button>Export</Button>}
-      onReset={() => undefined}
-    />
-  )
-}`,"description-list":`import { DescriptionList } from "tembro"
-
-export function Demo() {
-  return (
-    <DescriptionList
-      title="Invoice details"
-      items={[
-        { key: "id", label: "Invoice", value: "#4821" },
-        { key: "amount", label: "Amount", value: "$12,420" },
-        { key: "status", label: "Status", value: "Paid" },
-      ]}
-    />
-  )
-}`,"stat-card":`import { StatCard } from "tembro"
-
-export function Demo() {
-  return (
-    <StatCard
-      title="Revenue"
-      value="$84.2k"
-      description="Compared with last month"
-      trend={{ value: "+12.4%", tone: "success" }}
-      helperText="Updated just now"
-    />
-  )
-}`,pagination:`import { Pagination } from "tembro"
-
-export function Demo() {
-  return <Pagination page={3} pageCount={9} onPageChange={(page) => console.log(page)} />
-}`};exports.layoutDemoCodeSnippets=e;

package/dist/src/showcase/demo-snippets/layout/index.js

@@ -1,9 +0,0 @@
-//#region src/showcase/demo-snippets/layout/index.ts
-var e = {
-	"filter-bar": "import { Button, FilterBar, Input } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <FilterBar\n      search={<Input type=\"search\" value=\"\" placeholder=\"Search rows...\" readOnly />}\n      chips={[\n        { key: \"status\", label: \"Status\", value: \"Active\", tone: \"success\" },\n        { key: \"owner\", label: \"Owner\", value: \"Azamat\" },\n      ]}\n      filters={<Button variant=\"outline\">Status</Button>}\n      actions={<Button>Export</Button>}\n      onReset={() => undefined}\n    />\n  )\n}",
-	"description-list": "import { DescriptionList } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <DescriptionList\n      title=\"Invoice details\"\n      items={[\n        { key: \"id\", label: \"Invoice\", value: \"#4821\" },\n        { key: \"amount\", label: \"Amount\", value: \"$12,420\" },\n        { key: \"status\", label: \"Status\", value: \"Paid\" },\n      ]}\n    />\n  )\n}",
-	"stat-card": "import { StatCard } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <StatCard\n      title=\"Revenue\"\n      value=\"$84.2k\"\n      description=\"Compared with last month\"\n      trend={{ value: \"+12.4%\", tone: \"success\" }}\n      helperText=\"Updated just now\"\n    />\n  )\n}",
-	pagination: "import { Pagination } from \"tembro\"\n\nexport function Demo() {\n  return <Pagination page={3} pageCount={9} onPageChange={(page) => console.log(page)} />\n}"
-};
-//#endregion
-export { e as layoutDemoCodeSnippets };

package/dist/src/showcase/demo-snippets/upload/index.cjs

@@ -1,5 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={"file-dropzone":`import { FileDropzone } from "tembro"
-
-export function Demo() {
-  return <FileDropzone label="Drop contract files" description="PDF, PNG or CSV up to 10MB." />
-}`};exports.uploadDemoCodeSnippets=e;

package/dist/src/showcase/demo-snippets/upload/index.js

@@ -1,4 +0,0 @@
-//#region src/showcase/demo-snippets/upload/index.ts
-var e = { "file-dropzone": "import { FileDropzone } from \"tembro\"\n\nexport function Demo() {\n  return <FileDropzone label=\"Drop contract files\" description=\"PDF, PNG or CSV up to 10MB.\" />\n}" };
-//#endregion
-export { e as uploadDemoCodeSnippets };

package/dist/src/showcase/fallback.cjs

@@ -1,5 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../components/ui/button/index.cjs"),t=require("../components/actions/button-group.cjs"),n=require("../components/actions/copy-button.cjs"),r=require("../components/ui/input/index.cjs"),i=require("../components/ui/card/index.cjs"),a=require("../components/ui/badge/index.cjs"),o=require("../components/ui/accordion/index.cjs"),s=require("../components/ui/skeleton/index.cjs"),c=require("../components/ui/divider/index.cjs"),l=require("../components/ui/segmented-control/index.cjs"),u=require("../components/ui/spinner/index.cjs"),d=require("../components/actions/quick-action-grid.cjs"),f=require("../components/layout/section.cjs"),p=require("../components/filters/filter-bar.cjs"),m=require("../components/filters/saved-filter-select.cjs"),h=require("../components/inputs/otp-input.cjs"),g=require("../components/inputs/rating.cjs"),_=require("../components/inputs/slider.cjs"),v=require("../components/inputs/tag-input.cjs"),y=require("../components/inputs/json-input.cjs"),b=require("../components/inputs/time-picker.cjs"),x=require("../components/inputs/color-picker.cjs"),S=require("../components/inputs/signature-pad.cjs"),C=require("../components/feedback/alert.cjs"),w=require("../components/feedback/page-state.cjs"),T=require("../components/display/avatar.cjs"),E=require("../components/display/kanban.cjs"),D=require("../components/display/code-block.cjs"),O=require("../components/display/data-state.cjs"),k=require("../components/display/list.cjs"),A=require("../components/display/statistic.cjs"),j=require("../components/display/status-legend.cjs"),M=require("../components/display/tree-view.cjs"),N=require("../components/display/virtual-list.cjs"),P=require("../components/display/qr-code.cjs"),F=require("../components/display/carousel.cjs"),I=require("../components/display/tag.cjs"),L=require("../components/display/typography.cjs"),R=require("../components/modern/calendar-scheduler.cjs"),z=require("../components/modern/dual-list-picker.cjs"),B=require("../components/modern/resizable-panel.cjs"),V=require("../components/modern/rich-text-editor.cjs"),H=require("../components/modern/image-cropper.cjs"),U=require("../components/command/command-palette.cjs"),W=require("../components/dnd/sortable-list.cjs");let G=require("react/jsx-runtime");function K({item:e,groupLabel:t,importSnippet:n}){let r=q(e.slug);return{Showcase:n=>(0,G.jsx)(J,{...n,item:e,groupLabel:t}),mock:{cliCommand:`npx tembro add ${e.slug}`,code:`${n}\n\nexport function Example() {\n  return <${r} />\n}`,highlights:e.features,scenarios:e.features.slice(0,3).map(t=>({title:t,description:`${e.title} can be copied into your app and adjusted locally.`})),capabilityNotes:e.features.slice(0,3)}}}function q(e){return e.split(`-`).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(``)}function J({item:e,groupLabel:t,state:n,setState:r,mode:i}){let a=e.features.length?e.features:[t,`CLI add`,`Local file`];return(0,G.jsxs)(`div`,{className:`space-y-5`,children:[(0,G.jsxs)(`div`,{className:`flex flex-col gap-5 border-b border-[color:var(--aui-divider)] pb-5 lg:flex-row lg:items-start lg:justify-between`,children:[(0,G.jsxs)(`div`,{className:`max-w-xl`,children:[(0,G.jsx)(`p`,{className:`text-sm font-semibold uppercase tracking-[0.22em] text-[color:var(--aui-brand-strong)]`,children:`CLI component`}),(0,G.jsx)(`h3`,{className:`mt-2.5 text-2xl font-semibold tracking-tight text-[color:var(--aui-page-foreground)]`,children:e.title}),(0,G.jsx)(`p`,{className:`mt-3 text-sm leading-7 text-[color:var(--aui-page-muted)]`,children:"Copy this component into your app and adjust it inside your own `components` folder."})]}),(0,G.jsx)(`div`,{className:`rounded-full border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] px-3 py-1.5 text-[11px] font-semibold uppercase tracking-[0.18em] text-[color:var(--aui-page-muted-strong)]`,children:i===`docs`?`Docs`:`Preview`})]}),(0,G.jsx)(`div`,{className:`grid gap-3 sm:grid-cols-3`,children:a.slice(0,3).map(e=>(0,G.jsxs)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] p-3.5`,children:[(0,G.jsx)(`p`,{className:`text-sm font-semibold text-[color:var(--aui-page-foreground)]`,children:e}),(0,G.jsx)(`p`,{className:`mt-1.5 text-xs leading-5 text-[color:var(--aui-page-muted)]`,children:`Lives in your local component source.`})]},e))}),(0,G.jsx)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-code-bg)] px-4 py-3`,children:(0,G.jsxs)(`code`,{className:`text-sm text-[color:var(--aui-code-fg)]`,children:[`npx tembro add `,e.slug]})}),(0,G.jsx)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] p-4 sm:p-5`,children:Y(e,t,n,r,i)})]})}function Y(K,q,J,Y,X){return K.slug===`avatar`?(0,G.jsxs)(`div`,{className:`flex flex-wrap items-center gap-4`,children:[(0,G.jsx)(T.Avatar,{name:`Tembro`}),(0,G.jsx)(T.Avatar,{fallback:`AJ`,shape:`rounded`}),(0,G.jsx)(T.AvatarGroup,{items:[{key:`1`,name:`Azamat`},{key:`2`,name:`Nodir`},{key:`3`,name:`Dilshod`},{key:`4`,name:`Madina`}]})]}):K.slug===`accordion`?(0,G.jsx)(o.Accordion,{type:`single`,defaultValue:`install`,items:[{key:`install`,title:`Install with CLI`,description:`Copy source into your app.`,content:"Run `npx tembro add accordion`, then edit the local component source."},{key:`compose`,title:`Compose route content`,description:`Use it for settings, FAQ and dense docs groups.`,content:`Accordion items keep title, description, meta, badges and disabled states together.`}]}):K.slug===`calendar-scheduler`?(0,G.jsx)(R.CalendarScheduler,{events:[{id:`1`,title:`Design review`,date:`Mon`,time:`10:00`,tone:`default`},{id:`2`,title:`Release QA`,date:`Tue`,time:`14:00`,tone:`warning`},{id:`3`,title:`Go live`,date:`Fri`,time:`09:30`,tone:`success`}]}):K.slug===`carousel`?(0,G.jsxs)(F.Carousel,{index:0,children:[(0,G.jsx)(F.CarouselItem,{children:(0,G.jsx)(i.Card,{children:(0,G.jsxs)(i.CardContent,{className:`p-5`,children:[(0,G.jsx)(`p`,{className:`text-lg font-semibold`,children:`Release dashboard`}),(0,G.jsx)(`p`,{className:`mt-2 text-sm text-muted-foreground`,children:`Compact KPI slide for weekly review.`})]})})}),(0,G.jsx)(F.CarouselItem,{children:(0,G.jsx)(i.Card,{children:(0,G.jsxs)(i.CardContent,{className:`p-5`,children:[(0,G.jsx)(`p`,{className:`text-lg font-semibold`,children:`Customer health`}),(0,G.jsx)(`p`,{className:`mt-2 text-sm text-muted-foreground`,children:`Second slide with account risk summary.`})]})})})]}):K.slug===`code-block`?(0,G.jsx)(D.CodeBlock,{title:`Install`,language:`bash`,code:`npx tembro init --template next
-npx tembro add button`}):K.slug===`command-palette`?(0,G.jsx)(U.CommandPalette,{open:!0,onOpenChange:()=>void 0,title:`Preview command palette`,description:`Command palette preview with grouped actions.`,placeholder:`Search commands...`,groups:[{id:`components`,label:`Components`,items:[{id:`button`,label:`Button`,description:`Open button docs`,shortcut:`B`},{id:`input`,label:`Input`,description:`Open input docs`,shortcut:`I`},{id:`data-table`,label:`DataTable`,description:`Open table docs`,shortcut:`T`}]}],contentClassName:`relative inset-auto translate-x-0 translate-y-0 shadow-none`}):K.slug===`copy-button`?(0,G.jsx)(n.CopyButton,{value:`npx tembro add button`,children:`Copy command`}):K.slug===`data-state`?(0,G.jsx)(O.DataState,{status:`empty`,title:`No matching rows`,description:`Try another filter or import the first record.`,actions:(0,G.jsx)(e.Button,{size:`sm`,children:`Import CSV`})}):K.slug===`color-picker`?(0,G.jsx)(x.ColorPicker,{label:`Brand accent`,defaultValue:`#2563ebcc`,showAlpha:!0,swatches:[`#0f172a`,`#2563eb`,`#059669`,`#d97706`,`#dc2626`,`#7c3aed`]}):K.slug===`divider`?(0,G.jsxs)(`div`,{className:`grid gap-3`,children:[(0,G.jsx)(`div`,{className:`text-sm font-medium`,children:`Section above`}),(0,G.jsx)(c.Divider,{label:`Summary`}),(0,G.jsx)(`div`,{className:`text-sm text-muted-foreground`,children:`Section below`})]}):K.slug===`dual-list-picker`?(0,G.jsx)(z.DualListPicker,{picked:[`billing`,`support`],items:[{value:`billing`,label:`Billing`},{value:`support`,label:`Support`},{value:`analytics`,label:`Analytics`},{value:`security`,label:`Security`}]}):K.slug===`segmented-control`?(0,G.jsx)(l.SegmentedControl,{options:[{value:`overview`,label:`Overview`},{value:`activity`,label:`Activity`},{value:`settings`,label:`Settings`}],defaultValue:`overview`}):K.slug===`spinner`?(0,G.jsxs)(`div`,{className:`flex items-center gap-5`,children:[(0,G.jsx)(u.Spinner,{size:`xs`}),(0,G.jsx)(u.Spinner,{size:`sm`}),(0,G.jsx)(u.Spinner,{size:`md`}),(0,G.jsx)(u.Spinner,{size:`lg`})]}):K.slug===`skeleton`?(0,G.jsxs)(`div`,{className:`grid gap-3`,children:[(0,G.jsx)(s.Skeleton,{className:`h-10 w-full`}),(0,G.jsx)(s.SkeletonText,{rows:3}),(0,G.jsx)(s.SkeletonCard,{avatar:!0})]}):K.slug===`slider`?(0,G.jsx)(_.Slider,{label:`Spacing scale`,description:`Adjust dashboard density.`,defaultValue:64,showValue:!0}):K.slug===`statistic`?(0,G.jsxs)(A.StatisticGrid,{columns:3,children:[(0,G.jsx)(A.StatisticCard,{label:`ARR`,value:`$84.2k`,change:`+12.4%`,trend:`up`,description:`vs previous month`}),(0,G.jsx)(A.Statistic,{label:`MRR`,value:`$7.0k`,change:`+3.1%`,trend:`up`,description:`Live subscriptions`}),(0,G.jsx)(A.Statistic,{label:`Churn`,value:`1.9%`,change:`-0.4%`,trend:`down`,description:`Healthy range`})]}):K.slug===`tag`?(0,G.jsxs)(I.TagGroup,{children:[(0,G.jsx)(I.Tag,{children:`Default`}),(0,G.jsx)(I.Tag,{tone:`success`,children:`Live`}),(0,G.jsx)(I.Tag,{tone:`warning`,children:`Review`}),(0,G.jsx)(I.Tag,{tone:`danger`,children:`Blocked`})]}):K.slug===`time-picker`?(0,G.jsxs)(`div`,{className:`grid gap-3`,children:[(0,G.jsx)(b.TimePicker,{label:`Start time`,defaultValue:`09:30`}),(0,G.jsx)(b.TimeRangePicker,{from:`09:30`,to:`17:30`})]}):K.slug===`tree-view`?(0,G.jsx)(M.TreeView,{defaultExpandedKeys:[`components`,`inputs`],selectedKey:`button`,items:[{key:`components`,label:`Components`,children:[{key:`inputs`,label:`Inputs`,children:[{key:`button`,label:`Button`},{key:`input`,label:`Input`}]}]}]}):K.slug===`typography`?(0,G.jsxs)(`div`,{className:`grid gap-3`,children:[(0,G.jsx)(L.Heading,{level:2,children:`Dashboard typography`}),(0,G.jsx)(L.Text,{children:`Readable defaults for product copy and operational labels.`}),(0,G.jsx)(`blockquote`,{className:`border-l-4 pl-4 italic text-muted-foreground`,children:`Ship simple text hierarchy before adding decorative layout layers.`}),(0,G.jsxs)(L.Text,{muted:!0,size:`sm`,children:[`Use `,(0,G.jsx)(L.Mark,{children:`Mark`}),` only for emphasis that matters.`]})]}):K.slug===`range-slider`?(0,G.jsx)(_.RangeSlider,{label:`Revenue band`,description:`Filter a metric window.`,defaultValue:[20,80],showValue:!0}):K.slug===`rating`?(0,G.jsx)(g.Rating,{defaultValue:4,labels:{clear:`Reset`}}):K.slug===`otp-input`?(0,G.jsx)(h.OtpInput,{value:J.textValue.replace(/\D/g,``).slice(0,6),onValueChange:e=>Y({textValue:e})}):K.slug===`color-input`?(0,G.jsx)(r.Input,{type:`color`,defaultValue:`#22c55e`,"aria-label":`Accent color`}):K.slug===`tag-input`?(0,G.jsx)(v.TagInput,{defaultValue:[`dashboard`,`beta`,`ops`],placeholder:`Add label`}):K.slug===`button-group`?(0,G.jsx)(t.ButtonGroup,{items:[{key:`day`,label:`Day`},{key:`week`,label:`Week`},{key:`month`,label:`Month`}]}):K.slug===`quick-action-grid`?(0,G.jsx)(d.QuickActionGrid,{columns:3,items:[{key:`new`,label:`New invoice`,description:`Create a fresh billing row.`,badge:`N`},{key:`import`,label:`Import CSV`,description:`Bring finance data into the table.`,badge:`I`},{key:`share`,label:`Share workspace`,description:`Invite team members to the route.`,badge:`S`}]}):K.slug===`data-table-saved-filters`?(0,G.jsxs)(`div`,{className:`grid gap-3`,children:[(0,G.jsx)(p.FilterBar,{chips:[{key:`status`,label:`Status`,value:`Active`,tone:`success`},{key:`owner`,label:`Owner`,value:`Azamat`,tone:`default`},{key:`region`,label:`Region`,value:`APAC`,tone:`info`}],onRemoveChip:()=>void 0,onReset:()=>void 0}),(0,G.jsx)(t.ButtonGroup,{attached:!1,items:[{key:`default`,label:`Default`,variant:`secondary`},{key:`billing`,label:`Billing`},{key:`ops`,label:`Operations`}]})]}):K.slug===`alert`?(0,G.jsx)(C.Alert,{tone:`warning`,title:`Review needed`,description:`Billing rules changed and one approval is pending.`,action:(0,G.jsx)(e.Button,{size:`sm`,children:`Open`})}):K.slug===`page-state`?(0,G.jsx)(w.PageState,{title:`Workspace connected`,description:`The route is ready to accept live data and team actions.`,tone:`success`,action:(0,G.jsx)(e.Button,{size:`sm`,children:`Continue`})}):K.slug===`list`?(0,G.jsx)(k.List,{items:[{key:`1`,title:`Enterprise plan`,description:`Priority support and SSO`,extra:`$499`},{key:`2`,title:`Growth plan`,description:`Most used by product teams`,extra:`$199`},{key:`3`,title:`Starter plan`,description:`Lightweight team setup`,extra:`$49`}]}):K.slug===`status-legend`?(0,G.jsx)(j.StatusLegend,{title:`Delivery states`,items:[{key:`live`,label:`Live`,description:`Healthy production routes`,tone:`success`,count:18},{key:`review`,label:`Review`,description:`Awaiting QA approval`,tone:`warning`,count:4},{key:`blocked`,label:`Blocked`,description:`Needs engineering action`,tone:`danger`,count:1}]}):K.slug===`notification-center`?(0,G.jsx)(k.List,{items:[{key:`1`,title:`Build completed`,description:`Dashboard docs deployment is live.`,extra:`Now`},{key:`2`,title:`New comment`,description:`Review requested on DataTable API.`,extra:`8m`},{key:`3`,title:`Publish reminder`,description:`Package version is ready for release.`,extra:`1h`}]}):K.slug===`inline-editable`?(0,G.jsxs)(`div`,{className:`flex flex-col gap-3 sm:flex-row`,children:[(0,G.jsx)(r.Input,{value:J.textValue,onChange:e=>Y({textValue:e.currentTarget.value})}),(0,G.jsx)(e.Button,{size:`sm`,children:`Save label`})]}):K.slug===`json-input`?(0,G.jsx)(y.JsonInput,{value:`{
-  "workspace": "tembro",
-  "theme": "dashboard"
-}`,onValueChange:()=>void 0,rows:7}):K.slug===`sortable-list`?(0,G.jsx)(W.SortableList,{defaultItems:[{id:`docs`,title:`Docs polish`,meta:`Ready`},{id:`api`,title:`API table`,meta:`Review`},{id:`preview`,title:`Live preview`,meta:`Live`}],getItemId:e=>e.id,getItemLabel:e=>e.title,renderItem:e=>(0,G.jsxs)(`div`,{className:`flex min-w-0 items-center justify-between gap-3`,children:[(0,G.jsx)(`span`,{className:`truncate text-sm font-medium`,children:e.title}),(0,G.jsx)(a.Badge,{variant:`outline`,children:e.meta})]})}):K.slug===`virtual-list`?(0,G.jsx)(N.VirtualList,{items:Array.from({length:80},(e,t)=>({id:`row-${t+1}`,name:`Virtual record ${t+1}`,status:t%3==0?`Review`:`Live`})),height:280,estimateSize:56,getItemKey:e=>e.id,renderItem:e=>(0,G.jsxs)(`div`,{className:`mx-1 flex items-center justify-between rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] px-4 py-3`,children:[(0,G.jsx)(`span`,{className:`text-sm font-medium`,children:e.name}),(0,G.jsx)(a.Badge,{variant:e.status===`Live`?`secondary`:`outline`,children:e.status})]})}):K.slug===`signature-pad`?(0,G.jsx)(S.SignaturePad,{defaultValue:[[{x:.16,y:.58,pressure:.5},{x:.26,y:.38,pressure:.5},{x:.38,y:.62,pressure:.5},{x:.54,y:.42,pressure:.5},{x:.72,y:.56,pressure:.5}]],labels:{canvas:`Signature preview`,undo:`Undo`,clear:`Clear`}}):K.slug===`qr-code`?(0,G.jsxs)(`div`,{className:`flex flex-col items-start gap-4 sm:flex-row sm:items-center`,children:[(0,G.jsx)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] bg-white p-4`,children:(0,G.jsx)(P.QRCode,{value:`https://tembro.dev/components`,size:148,alt:`Tembro components QR`})}),(0,G.jsxs)(`div`,{children:[(0,G.jsx)(`p`,{className:`font-semibold aui-text-strong`,children:`QR code`}),(0,G.jsx)(`p`,{className:`mt-2 text-sm leading-6 aui-text-muted`,children:`Generates SVG output, supports custom colors, error fallback and async loading.`})]})]}):K.slug===`rich-text-editor`?(0,G.jsx)(V.RichTextEditor,{defaultValue:`<h2>Release notes</h2><p>Write rich product copy with toolbar actions, links and placeholder support.</p>`,minHeight:180,onLinkRequest:()=>`https://tembro.dev`}):K.slug===`image-cropper`?(0,G.jsx)(H.ImageCropper,{src:`data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20420%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20x2%3D%221%22%20y1%3D%220%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%230f172a%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2322c55e%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D%22640%22%20height%3D%22420%22%20fill%3D%22url(%23g)%22%2F%3E%3Ccircle%20cx%3D%22460%22%20cy%3D%22150%22%20r%3D%2288%22%20fill%3D%22%23ffffff%22%20opacity%3D%22.22%22%2F%3E%3Crect%20x%3D%2270%22%20y%3D%22245%22%20width%3D%22310%22%20height%3D%2264%22%20rx%3D%2220%22%20fill%3D%22%23fff%22%20opacity%3D%22.88%22%2F%3E%3Ctext%20x%3D%2295%22%20y%3D%22287%22%20font-family%3D%22Arial%22%20font-size%3D%2228%22%20font-weight%3D%22700%22%20fill%3D%22%230f172a%22%3ETembro%20crop%3C%2Ftext%3E%3C%2Fsvg%3E`,aspect:16/9,defaultZoom:1.15,defaultRotation:-2}):K.slug===`kanban`?(0,G.jsx)(E.KanbanBoard,{columns:[{key:`todo`,title:`Todo`,cards:[{key:`1`,title:`Polish Button demo`,description:`Improve interactive preview states.`}]},{key:`progress`,title:`In progress`,cards:[{key:`2`,title:`Refresh Input docs`,description:`Clean API notes and examples.`}]},{key:`done`,title:`Done`,cards:[{key:`3`,title:`Publish 1.0.0`,description:`Release package and sync docs.`}]}]}):K.slug===`overlay`?(0,G.jsxs)(`div`,{className:`grid gap-3 sm:grid-cols-3`,children:[(0,G.jsx)(i.Card,{children:(0,G.jsxs)(i.CardContent,{className:`p-4`,children:[(0,G.jsx)(`p`,{className:`font-medium`,children:`Dialog`}),(0,G.jsx)(`p`,{className:`mt-1 text-sm text-muted-foreground`,children:`Focused confirmation and forms.`})]})}),(0,G.jsx)(i.Card,{children:(0,G.jsxs)(i.CardContent,{className:`p-4`,children:[(0,G.jsx)(`p`,{className:`font-medium`,children:`Popover`}),(0,G.jsx)(`p`,{className:`mt-1 text-sm text-muted-foreground`,children:`Compact contextual actions.`})]})}),(0,G.jsx)(i.Card,{children:(0,G.jsxs)(i.CardContent,{className:`p-4`,children:[(0,G.jsx)(`p`,{className:`font-medium`,children:`Sheet`}),(0,G.jsx)(`p`,{className:`mt-1 text-sm text-muted-foreground`,children:`Side panel workflows.`})]})})]}):K.slug===`resizable-panel`?(0,G.jsxs)(B.ResizablePanelGroup,{children:[(0,G.jsxs)(B.ResizablePanel,{defaultSize:`45%`,children:[(0,G.jsx)(`p`,{className:`text-sm font-medium`,children:`Preview panel`}),(0,G.jsx)(`p`,{className:`mt-2 text-sm text-muted-foreground`,children:`Resize this surface in product screens with long content.`})]}),(0,G.jsx)(B.ResizableHandle,{}),(0,G.jsxs)(B.ResizablePanel,{defaultSize:`55%`,children:[(0,G.jsx)(`p`,{className:`text-sm font-medium`,children:`Inspector panel`}),(0,G.jsx)(`p`,{className:`mt-2 text-sm text-muted-foreground`,children:`Use for side-by-side data and editing tools.`})]})]}):K.slug===`saved-filter-select`?(0,G.jsx)(m.SavedFilterSelect,{value:`billing`,filters:[{value:`billing`,label:`Billing`,description:`Invoices and payment status`},{value:`ops`,label:`Operations`,description:`Queues and workload`},{value:`owners`,label:`Owner: Azamat`,description:`Assigned records only`}],onValueChange:()=>void 0,onSave:()=>void 0,onDelete:()=>void 0}):K.slug===`section`?(0,G.jsx)(f.Section,{title:`Revenue summary`,description:`Section wrapper for grouped content and actions.`,actions:(0,G.jsx)(e.Button,{size:`sm`,children:`Export`}),bordered:!0,children:(0,G.jsx)(`div`,{className:`text-sm text-muted-foreground`,children:`Place chart, filters, table or any route content inside.`})}):K.category===`Forms`?(0,G.jsxs)(`div`,{className:`grid gap-3`,children:[(0,G.jsx)(r.Input,{value:J.textValue,onChange:e=>Y({textValue:e.currentTarget.value}),placeholder:`${K.title} preview`}),(0,G.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:`Generic field preview for this form surface.`})]}):K.category===`Overlay`?(0,G.jsxs)(`div`,{className:`grid gap-4 rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5`,children:[(0,G.jsxs)(`div`,{className:`flex items-center justify-between gap-4`,children:[(0,G.jsxs)(`div`,{children:[(0,G.jsx)(`p`,{className:`text-sm font-semibold text-[color:var(--aui-page-foreground)]`,children:K.title}),(0,G.jsx)(`p`,{className:`mt-2 max-w-xl text-sm leading-6 text-[color:var(--aui-page-muted)]`,children:`Overlay surfaces should stay compact, focused, and secondary to the route behind them.`})]}),(0,G.jsx)(a.Badge,{variant:`outline`,children:`Overlay`})]}),(0,G.jsx)(`div`,{className:`rounded-2xl border border-dashed border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] p-4`,children:(0,G.jsxs)(`div`,{className:`flex flex-wrap items-center justify-end gap-2`,children:[(0,G.jsx)(e.Button,{variant:`ghost`,children:`Cancel`}),(0,G.jsx)(e.Button,{variant:`outline`,children:`Save draft`}),(0,G.jsx)(e.Button,{children:`Confirm`})]})})]}):K.category===`Data Display`?(0,G.jsxs)(`div`,{className:`grid gap-4 rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5`,children:[(0,G.jsxs)(`div`,{className:`flex items-center justify-between gap-4`,children:[(0,G.jsxs)(`div`,{children:[(0,G.jsx)(`p`,{className:`text-lg font-semibold`,children:K.title}),(0,G.jsx)(`p`,{className:`mt-1 text-sm text-muted-foreground`,children:`Display surfaces should prioritize readable values, compact metadata, and clear scanning order.`})]}),(0,G.jsx)(a.Badge,{variant:`outline`,children:X})]}),(0,G.jsx)(`div`,{className:`grid gap-3 md:grid-cols-3`,children:[{label:`Primary value`,value:`84.2k`,note:`Strong first read`},{label:`Supporting meta`,value:`12 teams`,note:`Context stays secondary`},{label:`Status`,value:`Live`,note:`One concise badge or tone`}].map(e=>(0,G.jsxs)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3`,children:[(0,G.jsx)(`p`,{className:`text-xs uppercase tracking-[0.18em] text-muted-foreground`,children:e.label}),(0,G.jsx)(`p`,{className:`mt-2 text-lg font-semibold text-[color:var(--aui-page-foreground)]`,children:e.value}),(0,G.jsx)(`p`,{className:`mt-1 text-sm text-muted-foreground`,children:e.note})]},e.label))})]}):(0,G.jsx)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5`,children:(0,G.jsxs)(`div`,{className:`flex items-center justify-between gap-4`,children:[(0,G.jsxs)(`div`,{children:[(0,G.jsx)(`p`,{className:`text-lg font-semibold`,children:K.title}),(0,G.jsx)(`p`,{className:`mt-1 text-sm text-muted-foreground`,children:`Neutral starter preview for this surface. Copy it into your app, then shape the final state with your real data and props.`})]}),(0,G.jsx)(a.Badge,{variant:`outline`,children:K.category})]})})}exports.createGenericShowcaseDemo=K;