tembro 3.1.1 → 3.1.5

package/dist/src/showcase/fallback.js

@@ -1,53 +1,45 @@
 import { Button as e } from "../components/ui/button/index.js";
 import { ButtonGroup as t } from "../components/actions/button-group.js";
 import { CopyButton as n } from "../components/actions/copy-button.js";
-import { CopyField as r } from "../components/actions/copy-field.js";
-import { Input as i } from "../components/ui/input/index.js";
-import { Card as a, CardContent as o } from "../components/ui/card/index.js";
-import { Badge as s } from "../components/ui/badge/index.js";
-import { Accordion as ee } from "../components/ui/accordion/index.js";
-import { Skeleton as te, SkeletonCard as c, SkeletonText as ne } from "../components/ui/skeleton/index.js";
-import { Divider as re } from "../components/ui/divider/index.js";
-import { SegmentedControl as l } from "../components/ui/segmented-control/index.js";
-import { Spinner as u } from "../components/ui/spinner/index.js";
-import { QuickActionGrid as ie } from "../components/actions/quick-action-grid.js";
-import { Section as ae } from "../components/layout/section.js";
-import { StickyFooterBar as d } from "../components/layout/sticky-footer-bar.js";
-import { PageTabs as f } from "../components/navigation/page-tabs.js";
-import { StepperTabs as p } from "../components/navigation/stepper-tabs.js";
-import { FilterBar as m } from "../components/filters/filter-bar.js";
-import { SavedFilterSelect as h } from "../components/filters/saved-filter-select.js";
-import { OtpInput as oe } from "../components/inputs/otp-input.js";
-import { Rating as g } from "../components/inputs/rating.js";
-import { RangeSlider as _, Slider as v } from "../components/inputs/slider.js";
-import { TagInput as y } from "../components/inputs/tag-input.js";
-import { JsonInput as b } from "../components/inputs/json-input.js";
-import { TimePicker as x, TimeRangePicker as S } from "../components/inputs/time-picker.js";
-import { Alert as C } from "../components/feedback/alert.js";
-import { PageState as w } from "../components/feedback/page-state.js";
-import { Avatar as T, AvatarGroup as E } from "../components/display/avatar.js";
-import { Descriptions as D } from "../components/display/descriptions.js";
+import { Input as r } from "../components/ui/input/index.js";
+import { Card as i, CardContent as a } from "../components/ui/card/index.js";
+import { Badge as o } from "../components/ui/badge/index.js";
+import { Skeleton as s, SkeletonCard as c, SkeletonText as l } from "../components/ui/skeleton/index.js";
+import { Divider as u } from "../components/ui/divider/index.js";
+import { SegmentedControl as d } from "../components/ui/segmented-control/index.js";
+import { Spinner as f } from "../components/ui/spinner/index.js";
+import { QuickActionGrid as p } from "../components/actions/quick-action-grid.js";
+import { Section as m } from "../components/layout/section.js";
+import { FilterBar as h } from "../components/filters/filter-bar.js";
+import { SavedFilterSelect as g } from "../components/filters/saved-filter-select.js";
+import { OtpInput as _ } from "../components/inputs/otp-input.js";
+import { Rating as v } from "../components/inputs/rating.js";
+import { RangeSlider as y, Slider as ee } from "../components/inputs/slider.js";
+import { TagInput as b } from "../components/inputs/tag-input.js";
+import { JsonInput as x } from "../components/inputs/json-input.js";
+import { TimePicker as S, TimeRangePicker as C } from "../components/inputs/time-picker.js";
+import { Alert as w } from "../components/feedback/alert.js";
+import { PageState as T } from "../components/feedback/page-state.js";
+import { Avatar as E, AvatarGroup as D } from "../components/display/avatar.js";
 import { KanbanBoard as O } from "../components/display/kanban.js";
 import { CodeBlock as k } from "../components/display/code-block.js";
 import { DataState as A } from "../components/display/data-state.js";
 import { List as j } from "../components/display/list.js";
-import { PropertyGrid as M } from "../components/display/property-grid.js";
-import { Statistic as N, StatisticCard as P, StatisticGrid as se } from "../components/display/statistic.js";
+import { Statistic as M, StatisticCard as N, StatisticGrid as P } from "../components/display/statistic.js";
 import { StatusLegend as F } from "../components/display/status-legend.js";
-import { TreeView as I } from "../components/display/tree-view.js";
-import { StatCard as L } from "../components/layout/stat-card.js";
-import { Carousel as R, CarouselItem as z } from "../components/display/carousel.js";
-import { Tag as B, TagGroup as V } from "../components/display/tag.js";
-import { Heading as H, Mark as U, Text as W } from "../components/display/typography.js";
-import { CalendarScheduler as G } from "../components/modern/calendar-scheduler.js";
-import { DualListPicker as K } from "../components/modern/dual-list-picker.js";
-import { ResizableHandle as ce, ResizablePanel as q, ResizablePanelGroup as le } from "../components/modern/resizable-panel.js";
-import { Fragment as J, jsx as Y, jsxs as X } from "react/jsx-runtime";
+import { TreeView as te } from "../components/display/tree-view.js";
+import { Carousel as I, CarouselItem as L } from "../components/display/carousel.js";
+import { Tag as R, TagGroup as z } from "../components/display/tag.js";
+import { Heading as B, Mark as V, Text as H } from "../components/display/typography.js";
+import { CalendarScheduler as U } from "../components/modern/calendar-scheduler.js";
+import { DualListPicker as W } from "../components/modern/dual-list-picker.js";
+import { ResizableHandle as G, ResizablePanel as K, ResizablePanelGroup as q } from "../components/modern/resizable-panel.js";
+import { jsx as J, jsxs as Y } from "react/jsx-runtime";
 //#region src/showcase/fallback.tsx
-function Z({ item: e, groupLabel: t, importSnippet: n }) {
-	let r = ue(e.slug);
+function X({ item: e, groupLabel: t, importSnippet: n }) {
+	let r = Z(e.slug);
 	return {
-		Showcase: (n) => /* @__PURE__ */ Y(Q, {
+		Showcase: (n) => /* @__PURE__ */ J(Q, {
 			...n,
 			item: e,
 			groupLabel: t
@@ -64,7 +56,7 @@ function Z({ item: e, groupLabel: t, importSnippet: n }) {
 		}
 	};
 }
-function ue(e) {
+function Z(e) {
 	return e.split("-").map((e) => e.charAt(0).toUpperCase() + e.slice(1)).join("");
 }
 function Q({ item: e, groupLabel: t, state: n, setState: r, mode: i }) {
@@ -73,83 +65,69 @@ function Q({ item: e, groupLabel: t, state: n, setState: r, mode: i }) {
 		"CLI add",
 		"Local file"
 	];
-	return /* @__PURE__ */ X("div", {
+	return /* @__PURE__ */ Y("div", {
 		className: "space-y-5",
 		children: [
-			/* @__PURE__ */ X("div", {
+			/* @__PURE__ */ Y("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: [/* @__PURE__ */ X("div", {
+				children: [/* @__PURE__ */ Y("div", {
 					className: "max-w-xl",
 					children: [
-						/* @__PURE__ */ Y("p", {
+						/* @__PURE__ */ J("p", {
 							className: "text-sm font-semibold uppercase tracking-[0.22em] text-[color:var(--aui-brand-strong)]",
 							children: "CLI component"
 						}),
-						/* @__PURE__ */ Y("h3", {
+						/* @__PURE__ */ J("h3", {
 							className: "mt-2.5 text-2xl font-semibold tracking-tight text-[color:var(--aui-page-foreground)]",
 							children: e.title
 						}),
-						/* @__PURE__ */ Y("p", {
+						/* @__PURE__ */ J("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."
 						})
 					]
-				}), /* @__PURE__ */ Y("div", {
+				}), /* @__PURE__ */ J("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"
 				})]
 			}),
-			/* @__PURE__ */ Y("div", {
+			/* @__PURE__ */ J("div", {
 				className: "grid gap-3 sm:grid-cols-3",
-				children: a.slice(0, 3).map((e) => /* @__PURE__ */ X("div", {
+				children: a.slice(0, 3).map((e) => /* @__PURE__ */ Y("div", {
 					className: "rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] p-3.5",
-					children: [/* @__PURE__ */ Y("p", {
+					children: [/* @__PURE__ */ J("p", {
 						className: "text-sm font-semibold text-[color:var(--aui-page-foreground)]",
 						children: e
-					}), /* @__PURE__ */ Y("p", {
+					}), /* @__PURE__ */ J("p", {
 						className: "mt-1.5 text-xs leading-5 text-[color:var(--aui-page-muted)]",
 						children: "Lives in your local component source."
 					})]
 				}, e))
 			}),
-			/* @__PURE__ */ Y("div", {
+			/* @__PURE__ */ J("div", {
 				className: "rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-code-bg)] px-4 py-3",
-				children: /* @__PURE__ */ X("code", {
+				children: /* @__PURE__ */ Y("code", {
 					className: "text-sm text-[color:var(--aui-code-fg)]",
 					children: ["npx tembro add ", e.slug]
 				})
 			}),
-			/* @__PURE__ */ Y("div", {
+			/* @__PURE__ */ J("div", {
 				className: "rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] p-4 sm:p-5",
 				children: $(e, t, n, r, i)
 			})
 		]
 	});
 }
-function $(Z, ue, Q, $, de) {
-	return Z.slug === "accordion" ? /* @__PURE__ */ Y(ee, {
-		type: "single",
-		defaultValue: "api",
-		items: [{
-			key: "api",
-			title: "Single open section",
-			description: "Open one section at a time.",
-			content: "Use one expanded panel when the page needs compact disclosure."
-		}, {
-			key: "states",
-			title: "State handling",
-			description: "Controlled or uncontrolled usage.",
-			content: "Use one expanded section for FAQs, settings clusters, and compact disclosure flows."
-		}]
-	}) : Z.slug === "avatar" ? /* @__PURE__ */ X("div", {
+function $(X, Z, Q, $, ne) {
+	return X.slug === "avatar" ? /* @__PURE__ */ Y("div", {
 		className: "flex flex-wrap items-center gap-4",
 		children: [
-			/* @__PURE__ */ Y(T, { name: "Azamat UI" }),
-			/* @__PURE__ */ Y(T, {
+			/* @__PURE__ */ J(E, { name: "Azamat UI" }),
+			/* @__PURE__ */ J(E, {
 				fallback: "AJ",
 				shape: "rounded"
 			}),
-			/* @__PURE__ */ Y(E, { items: [
+			/* @__PURE__ */ J(D, { items: [
 				{
 					key: "1",
 					name: "Azamat"
@@ -168,7 +146,7 @@ function $(Z, ue, Q, $, de) {
 				}
 			] })
 		]
-	}) : Z.slug === "calendar-scheduler" ? /* @__PURE__ */ Y(G, { events: [
+	}) : X.slug === "calendar-scheduler" ? /* @__PURE__ */ J(U, { events: [
 		{
 			id: "1",
 			title: "Design review",
@@ -190,80 +168,56 @@ function $(Z, ue, Q, $, de) {
 			time: "09:30",
 			tone: "success"
 		}
-	] }) : Z.slug === "carousel" ? /* @__PURE__ */ X(R, {
+	] }) : X.slug === "carousel" ? /* @__PURE__ */ Y(I, {
 		index: 0,
-		children: [/* @__PURE__ */ Y(z, { children: /* @__PURE__ */ Y(a, { children: /* @__PURE__ */ X(o, {
+		children: [/* @__PURE__ */ J(L, { children: /* @__PURE__ */ J(i, { children: /* @__PURE__ */ Y(a, {
 			className: "p-5",
-			children: [/* @__PURE__ */ Y("p", {
+			children: [/* @__PURE__ */ J("p", {
 				className: "text-lg font-semibold",
 				children: "Release dashboard"
-			}), /* @__PURE__ */ Y("p", {
+			}), /* @__PURE__ */ J("p", {
 				className: "mt-2 text-sm text-muted-foreground",
 				children: "Compact KPI slide for weekly review."
 			})]
-		}) }) }), /* @__PURE__ */ Y(z, { children: /* @__PURE__ */ Y(a, { children: /* @__PURE__ */ X(o, {
+		}) }) }), /* @__PURE__ */ J(L, { children: /* @__PURE__ */ J(i, { children: /* @__PURE__ */ Y(a, {
 			className: "p-5",
-			children: [/* @__PURE__ */ Y("p", {
+			children: [/* @__PURE__ */ J("p", {
 				className: "text-lg font-semibold",
 				children: "Customer health"
-			}), /* @__PURE__ */ Y("p", {
+			}), /* @__PURE__ */ J("p", {
 				className: "mt-2 text-sm text-muted-foreground",
 				children: "Second slide with account risk summary."
 			})]
 		}) }) })]
-	}) : Z.slug === "code-block" ? /* @__PURE__ */ Y(k, {
+	}) : X.slug === "code-block" ? /* @__PURE__ */ J(k, {
 		title: "Install",
 		language: "bash",
 		code: "npx tembro init --template next\nnpx tembro add button"
-	}) : Z.slug === "copy-button" ? /* @__PURE__ */ Y(n, {
+	}) : X.slug === "copy-button" ? /* @__PURE__ */ J(n, {
 		value: "npx tembro add button",
 		children: "Copy command"
-	}) : Z.slug === "copy-field" ? /* @__PURE__ */ Y(r, {
-		label: "CLI command",
-		description: "Quick source-copy command",
-		value: "npx tembro add input"
-	}) : Z.slug === "data-state" ? /* @__PURE__ */ Y(A, {
+	}) : X.slug === "data-state" ? /* @__PURE__ */ J(A, {
 		status: "empty",
 		title: "No matching rows",
 		description: "Try another filter or import the first record.",
-		actions: /* @__PURE__ */ Y(e, {
+		actions: /* @__PURE__ */ J(e, {
 			size: "sm",
 			children: "Import CSV"
 		})
-	}) : Z.slug === "descriptions" ? /* @__PURE__ */ Y(D, {
-		title: "Workspace details",
-		columns: 3,
-		items: [
-			{
-				key: "owner",
-				label: "Owner",
-				value: "Azamat UI"
-			},
-			{
-				key: "plan",
-				label: "Plan",
-				value: "Scale"
-			},
-			{
-				key: "renewal",
-				label: "Renewal",
-				value: "Jul 14, 2026"
-			}
-		]
-	}) : Z.slug === "divider" ? /* @__PURE__ */ X("div", {
+	}) : X.slug === "divider" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-3",
 		children: [
-			/* @__PURE__ */ Y("div", {
+			/* @__PURE__ */ J("div", {
 				className: "text-sm font-medium",
 				children: "Section above"
 			}),
-			/* @__PURE__ */ Y(re, { label: "Summary" }),
-			/* @__PURE__ */ Y("div", {
+			/* @__PURE__ */ J(u, { label: "Summary" }),
+			/* @__PURE__ */ J("div", {
 				className: "text-sm text-muted-foreground",
 				children: "Section below"
 			})
 		]
-	}) : Z.slug === "dual-list-picker" ? /* @__PURE__ */ Y(K, {
+	}) : X.slug === "dual-list-picker" ? /* @__PURE__ */ J(W, {
 		picked: ["billing", "support"],
 		items: [
 			{
@@ -283,7 +237,7 @@ function $(Z, ue, Q, $, de) {
 				label: "Security"
 			}
 		]
-	}) : Z.slug === "segmented-control" ? /* @__PURE__ */ Y(l, {
+	}) : X.slug === "segmented-control" ? /* @__PURE__ */ J(d, {
 		options: [
 			{
 				value: "overview",
@@ -299,44 +253,44 @@ function $(Z, ue, Q, $, de) {
 			}
 		],
 		defaultValue: "overview"
-	}) : Z.slug === "spinner" ? /* @__PURE__ */ X("div", {
+	}) : X.slug === "spinner" ? /* @__PURE__ */ Y("div", {
 		className: "flex items-center gap-5",
 		children: [
-			/* @__PURE__ */ Y(u, { size: "xs" }),
-			/* @__PURE__ */ Y(u, { size: "sm" }),
-			/* @__PURE__ */ Y(u, { size: "md" }),
-			/* @__PURE__ */ Y(u, { size: "lg" })
+			/* @__PURE__ */ J(f, { size: "xs" }),
+			/* @__PURE__ */ J(f, { size: "sm" }),
+			/* @__PURE__ */ J(f, { size: "md" }),
+			/* @__PURE__ */ J(f, { size: "lg" })
 		]
-	}) : Z.slug === "skeleton" ? /* @__PURE__ */ X("div", {
+	}) : X.slug === "skeleton" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-3",
 		children: [
-			/* @__PURE__ */ Y(te, { className: "h-10 w-full" }),
-			/* @__PURE__ */ Y(ne, { rows: 3 }),
-			/* @__PURE__ */ Y(c, { avatar: !0 })
+			/* @__PURE__ */ J(s, { className: "h-10 w-full" }),
+			/* @__PURE__ */ J(l, { rows: 3 }),
+			/* @__PURE__ */ J(c, { avatar: !0 })
 		]
-	}) : Z.slug === "slider" ? /* @__PURE__ */ Y(v, {
+	}) : X.slug === "slider" ? /* @__PURE__ */ J(ee, {
 		label: "Spacing scale",
 		description: "Adjust dashboard density.",
 		defaultValue: 64,
 		showValue: !0
-	}) : Z.slug === "statistic" ? /* @__PURE__ */ X(se, {
+	}) : X.slug === "statistic" ? /* @__PURE__ */ Y(P, {
 		columns: 3,
 		children: [
-			/* @__PURE__ */ Y(P, {
+			/* @__PURE__ */ J(N, {
 				label: "ARR",
 				value: "$84.2k",
 				change: "+12.4%",
 				trend: "up",
 				description: "vs previous month"
 			}),
-			/* @__PURE__ */ Y(N, {
+			/* @__PURE__ */ J(M, {
 				label: "MRR",
 				value: "$7.0k",
 				change: "+3.1%",
 				trend: "up",
 				description: "Live subscriptions"
 			}),
-			/* @__PURE__ */ Y(N, {
+			/* @__PURE__ */ J(M, {
 				label: "Churn",
 				value: "1.9%",
 				change: "-0.4%",
@@ -344,49 +298,30 @@ function $(Z, ue, Q, $, de) {
 				description: "Healthy range"
 			})
 		]
-	}) : Z.slug === "sticky-footer-bar" ? /* @__PURE__ */ X("div", {
-		className: "rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)]",
-		children: [/* @__PURE__ */ Y("div", {
-			className: "p-4 text-sm text-muted-foreground",
-			children: "Scrollable page content"
-		}), /* @__PURE__ */ Y(d, {
-			start: /* @__PURE__ */ Y("div", {
-				className: "text-sm font-medium",
-				children: "2 unsaved changes"
-			}),
-			end: /* @__PURE__ */ X(J, { children: [/* @__PURE__ */ Y(e, {
-				size: "sm",
-				variant: "outline",
-				children: "Discard"
-			}), /* @__PURE__ */ Y(e, {
-				size: "sm",
-				children: "Save"
-			})] })
-		})]
-	}) : Z.slug === "tag" ? /* @__PURE__ */ X(V, { children: [
-		/* @__PURE__ */ Y(B, { children: "Default" }),
-		/* @__PURE__ */ Y(B, {
+	}) : X.slug === "tag" ? /* @__PURE__ */ Y(z, { children: [
+		/* @__PURE__ */ J(R, { children: "Default" }),
+		/* @__PURE__ */ J(R, {
 			tone: "success",
 			children: "Live"
 		}),
-		/* @__PURE__ */ Y(B, {
+		/* @__PURE__ */ J(R, {
 			tone: "warning",
 			children: "Review"
 		}),
-		/* @__PURE__ */ Y(B, {
+		/* @__PURE__ */ J(R, {
 			tone: "danger",
 			children: "Blocked"
 		})
-	] }) : Z.slug === "time-picker" ? /* @__PURE__ */ X("div", {
+	] }) : X.slug === "time-picker" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-3",
-		children: [/* @__PURE__ */ Y(x, {
+		children: [/* @__PURE__ */ J(S, {
 			label: "Start time",
 			defaultValue: "09:30"
-		}), /* @__PURE__ */ Y(S, {
+		}), /* @__PURE__ */ J(C, {
 			from: "09:30",
 			to: "17:30"
 		})]
-	}) : Z.slug === "tree-view" ? /* @__PURE__ */ Y(I, {
+	}) : X.slug === "tree-view" ? /* @__PURE__ */ J(te, {
 		defaultExpandedKeys: ["components", "inputs"],
 		selectedKey: "button",
 		items: [{
@@ -404,51 +339,51 @@ function $(Z, ue, Q, $, de) {
 				}]
 			}]
 		}]
-	}) : Z.slug === "typography" ? /* @__PURE__ */ X("div", {
+	}) : X.slug === "typography" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-3",
 		children: [
-			/* @__PURE__ */ Y(H, {
+			/* @__PURE__ */ J(B, {
 				level: 2,
 				children: "Dashboard typography"
 			}),
-			/* @__PURE__ */ Y(W, { children: "Readable defaults for product copy and operational labels." }),
-			/* @__PURE__ */ Y("blockquote", {
+			/* @__PURE__ */ J(H, { children: "Readable defaults for product copy and operational labels." }),
+			/* @__PURE__ */ J("blockquote", {
 				className: "border-l-4 pl-4 italic text-muted-foreground",
 				children: "Ship simple text hierarchy before adding decorative layout layers."
 			}),
-			/* @__PURE__ */ X(W, {
+			/* @__PURE__ */ Y(H, {
 				muted: !0,
 				size: "sm",
 				children: [
 					"Use ",
-					/* @__PURE__ */ Y(U, { children: "Mark" }),
+					/* @__PURE__ */ J(V, { children: "Mark" }),
 					" only for emphasis that matters."
 				]
 			})
 		]
-	}) : Z.slug === "range-slider" ? /* @__PURE__ */ Y(_, {
+	}) : X.slug === "range-slider" ? /* @__PURE__ */ J(y, {
 		label: "Revenue band",
 		description: "Filter a metric window.",
 		defaultValue: [20, 80],
 		showValue: !0
-	}) : Z.slug === "rating" ? /* @__PURE__ */ Y(g, {
+	}) : X.slug === "rating" ? /* @__PURE__ */ J(v, {
 		defaultValue: 4,
 		labels: { clear: "Reset" }
-	}) : Z.slug === "otp-input" ? /* @__PURE__ */ Y(oe, {
+	}) : X.slug === "otp-input" ? /* @__PURE__ */ J(_, {
 		value: Q.textValue.replace(/\D/g, "").slice(0, 6),
 		onValueChange: (e) => $({ textValue: e })
-	}) : Z.slug === "color-input" ? /* @__PURE__ */ Y(i, {
+	}) : X.slug === "color-input" ? /* @__PURE__ */ J(r, {
 		type: "color",
 		defaultValue: "#22c55e",
 		"aria-label": "Accent color"
-	}) : Z.slug === "tag-input" ? /* @__PURE__ */ Y(y, {
+	}) : X.slug === "tag-input" ? /* @__PURE__ */ J(b, {
 		defaultValue: [
 			"dashboard",
 			"beta",
 			"ops"
 		],
 		placeholder: "Add label"
-	}) : Z.slug === "button-group" ? /* @__PURE__ */ Y(t, { items: [
+	}) : X.slug === "button-group" ? /* @__PURE__ */ J(t, { items: [
 		{
 			key: "day",
 			label: "Day"
@@ -461,9 +396,8 @@ function $(Z, ue, Q, $, de) {
 			key: "month",
 			label: "Month"
 		}
-	] }) : Z.slug === "quick-action-grid" || Z.slug === "command-bar" ? /* @__PURE__ */ Y(ie, {
-		columns: Z.slug === "command-bar" ? 4 : 3,
-		compact: Z.slug === "command-bar",
+	] }) : X.slug === "quick-action-grid" ? /* @__PURE__ */ J(p, {
+		columns: 3,
 		items: [
 			{
 				key: "new",
@@ -484,9 +418,9 @@ function $(Z, ue, Q, $, de) {
 				badge: "S"
 			}
 		]
-	}) : Z.slug === "data-table-saved-filters" ? /* @__PURE__ */ X("div", {
+	}) : X.slug === "data-table-saved-filters" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-3",
-		children: [/* @__PURE__ */ Y(m, {
+		children: [/* @__PURE__ */ J(h, {
 			chips: [
 				{
 					key: "status",
@@ -509,7 +443,7 @@ function $(Z, ue, Q, $, de) {
 			],
 			onRemoveChip: () => void 0,
 			onReset: () => void 0
-		}), /* @__PURE__ */ Y(t, {
+		}), /* @__PURE__ */ J(t, {
 			attached: !1,
 			items: [
 				{
@@ -527,61 +461,23 @@ function $(Z, ue, Q, $, de) {
 				}
 			]
 		})]
-	}) : Z.slug === "page-tabs" ? /* @__PURE__ */ Y(f, {
-		value: "overview",
-		variant: "pills",
-		items: [
-			{
-				value: "overview",
-				label: "Overview"
-			},
-			{
-				value: "usage",
-				label: "Usage"
-			},
-			{
-				value: "api",
-				label: "API",
-				badge: "3"
-			}
-		]
-	}) : Z.slug === "stepper-tabs" ? /* @__PURE__ */ Y(p, {
-		value: "billing",
-		items: [
-			{
-				value: "profile",
-				label: "Profile",
-				description: "Team and owner details",
-				completed: !0
-			},
-			{
-				value: "billing",
-				label: "Billing",
-				description: "Payment and invoices"
-			},
-			{
-				value: "review",
-				label: "Review",
-				description: "Confirm release"
-			}
-		]
-	}) : Z.slug === "alert" ? /* @__PURE__ */ Y(C, {
+	}) : X.slug === "alert" ? /* @__PURE__ */ J(w, {
 		tone: "warning",
 		title: "Review needed",
 		description: "Billing rules changed and one approval is pending.",
-		action: /* @__PURE__ */ Y(e, {
+		action: /* @__PURE__ */ J(e, {
 			size: "sm",
 			children: "Open"
 		})
-	}) : Z.slug === "page-state" ? /* @__PURE__ */ Y(w, {
+	}) : X.slug === "page-state" ? /* @__PURE__ */ J(T, {
 		title: "Workspace connected",
 		description: "The route is ready to accept live data and team actions.",
 		tone: "success",
-		action: /* @__PURE__ */ Y(e, {
+		action: /* @__PURE__ */ J(e, {
 			size: "sm",
 			children: "Continue"
 		})
-	}) : Z.slug === "data-list" || Z.slug === "list" ? /* @__PURE__ */ Y(j, { items: [
+	}) : X.slug === "list" ? /* @__PURE__ */ J(j, { items: [
 		{
 			key: "1",
 			title: "Enterprise plan",
@@ -600,7 +496,7 @@ function $(Z, ue, Q, $, de) {
 			description: "Lightweight team setup",
 			extra: "$49"
 		}
-	] }) : Z.slug === "status-legend" ? /* @__PURE__ */ Y(F, {
+	] }) : X.slug === "status-legend" ? /* @__PURE__ */ J(F, {
 		title: "Delivery states",
 		items: [
 			{
@@ -625,31 +521,7 @@ function $(Z, ue, Q, $, de) {
 				count: 1
 			}
 		]
-	}) : Z.slug === "trend-card" || Z.slug === "comparison-card" ? /* @__PURE__ */ Y(L, {
-		title: Z.slug === "trend-card" ? "Weekly revenue" : "Current vs previous",
-		value: "$84.2k",
-		description: "Compared with last month",
-		trend: {
-			value: "+12.4%",
-			tone: "success"
-		}
-	}) : Z.slug === "delta-badge" ? /* @__PURE__ */ X("div", {
-		className: "flex flex-wrap gap-2",
-		children: [
-			/* @__PURE__ */ Y(s, {
-				variant: "secondary",
-				children: "+12.4%"
-			}),
-			/* @__PURE__ */ Y(s, {
-				variant: "outline",
-				children: "-3.1%"
-			}),
-			/* @__PURE__ */ Y(s, {
-				variant: "destructive",
-				children: "Risk"
-			})
-		]
-	}) : Z.slug === "notification-center" ? /* @__PURE__ */ Y(j, { items: [
+	}) : X.slug === "notification-center" ? /* @__PURE__ */ J(j, { items: [
 		{
 			key: "1",
 			title: "Build completed",
@@ -668,20 +540,20 @@ function $(Z, ue, Q, $, de) {
 			description: "Package version is ready for release.",
 			extra: "1h"
 		}
-	] }) : Z.slug === "inline-editable" ? /* @__PURE__ */ X("div", {
+	] }) : X.slug === "inline-editable" ? /* @__PURE__ */ Y("div", {
 		className: "flex flex-col gap-3 sm:flex-row",
-		children: [/* @__PURE__ */ Y(i, {
+		children: [/* @__PURE__ */ J(r, {
 			value: Q.textValue,
 			onChange: (e) => $({ textValue: e.currentTarget.value })
-		}), /* @__PURE__ */ Y(e, {
+		}), /* @__PURE__ */ J(e, {
 			size: "sm",
 			children: "Save label"
 		})]
-	}) : Z.slug === "json-input" ? /* @__PURE__ */ Y(b, {
+	}) : X.slug === "json-input" ? /* @__PURE__ */ J(x, {
 		value: "{\n  \"workspace\": \"azamat-ui\",\n  \"theme\": \"dashboard\"\n}",
 		onValueChange: () => void 0,
 		rows: 7
-	}) : Z.slug === "kanban" ? /* @__PURE__ */ Y(O, { columns: [
+	}) : X.slug === "kanban" ? /* @__PURE__ */ J(O, { columns: [
 		{
 			key: "todo",
 			title: "Todo",
@@ -709,92 +581,63 @@ function $(Z, ue, Q, $, de) {
 				description: "Release package and sync docs."
 			}]
 		}
-	] }) : Z.slug === "overlay" ? /* @__PURE__ */ X("div", {
+	] }) : X.slug === "overlay" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-3 sm:grid-cols-3",
 		children: [
-			/* @__PURE__ */ Y(a, { children: /* @__PURE__ */ X(o, {
+			/* @__PURE__ */ J(i, { children: /* @__PURE__ */ Y(a, {
 				className: "p-4",
-				children: [/* @__PURE__ */ Y("p", {
+				children: [/* @__PURE__ */ J("p", {
 					className: "font-medium",
 					children: "Dialog"
-				}), /* @__PURE__ */ Y("p", {
+				}), /* @__PURE__ */ J("p", {
 					className: "mt-1 text-sm text-muted-foreground",
 					children: "Focused confirmation and forms."
 				})]
 			}) }),
-			/* @__PURE__ */ Y(a, { children: /* @__PURE__ */ X(o, {
+			/* @__PURE__ */ J(i, { children: /* @__PURE__ */ Y(a, {
 				className: "p-4",
-				children: [/* @__PURE__ */ Y("p", {
+				children: [/* @__PURE__ */ J("p", {
 					className: "font-medium",
 					children: "Popover"
-				}), /* @__PURE__ */ Y("p", {
+				}), /* @__PURE__ */ J("p", {
 					className: "mt-1 text-sm text-muted-foreground",
 					children: "Compact contextual actions."
 				})]
 			}) }),
-			/* @__PURE__ */ Y(a, { children: /* @__PURE__ */ X(o, {
+			/* @__PURE__ */ J(i, { children: /* @__PURE__ */ Y(a, {
 				className: "p-4",
-				children: [/* @__PURE__ */ Y("p", {
+				children: [/* @__PURE__ */ J("p", {
 					className: "font-medium",
 					children: "Sheet"
-				}), /* @__PURE__ */ Y("p", {
+				}), /* @__PURE__ */ J("p", {
 					className: "mt-1 text-sm text-muted-foreground",
 					children: "Side panel workflows."
 				})]
 			}) })
 		]
-	}) : Z.slug === "property-grid" ? /* @__PURE__ */ Y(M, {
-		columns: 3,
-		items: [
-			{
-				key: "framework",
-				label: "Framework",
-				value: "Next.js",
-				description: "App Router setup"
-			},
-			{
-				key: "theme",
-				label: "Theme",
-				value: "Light / Dark",
-				description: "CSS tokens ready"
-			},
-			{
-				key: "mode",
-				label: "Mode",
-				value: "Source-copy",
-				description: "Editable local files"
-			}
-		]
-	}) : Z.slug === "quantity-stepper" ? /* @__PURE__ */ Y(i, {
-		kind: "quantity",
-		value: 3,
-		min: 1,
-		max: 10,
-		showControls: !0,
-		"aria-label": "Quantity"
-	}) : Z.slug === "resizable-panel" ? /* @__PURE__ */ X(le, { children: [
-		/* @__PURE__ */ X(q, {
+	}) : X.slug === "resizable-panel" ? /* @__PURE__ */ Y(q, { children: [
+		/* @__PURE__ */ Y(K, {
 			defaultSize: "45%",
-			children: [/* @__PURE__ */ Y("p", {
+			children: [/* @__PURE__ */ J("p", {
 				className: "text-sm font-medium",
 				children: "Preview panel"
-			}), /* @__PURE__ */ Y("p", {
+			}), /* @__PURE__ */ J("p", {
 				className: "mt-2 text-sm text-muted-foreground",
 				children: "Resize this surface in product screens with long content."
 			})]
 		}),
-		/* @__PURE__ */ Y(ce, {}),
-		/* @__PURE__ */ X(q, {
+		/* @__PURE__ */ J(G, {}),
+		/* @__PURE__ */ Y(K, {
 			defaultSize: "55%",
-			children: [/* @__PURE__ */ Y("p", {
+			children: [/* @__PURE__ */ J("p", {
 				className: "text-sm font-medium",
 				children: "Inspector panel"
-			}), /* @__PURE__ */ Y("p", {
+			}), /* @__PURE__ */ J("p", {
 				className: "mt-2 text-sm text-muted-foreground",
 				children: "Use for side-by-side data and editing tools."
 			})]
 		})
-	] }) : Z.slug === "saved-filter-select" ? /* @__PURE__ */ Y(h, {
+	] }) : X.slug === "saved-filter-select" ? /* @__PURE__ */ J(g, {
 		value: "billing",
 		filters: [
 			{
@@ -816,74 +659,74 @@ function $(Z, ue, Q, $, de) {
 		onValueChange: () => void 0,
 		onSave: () => void 0,
 		onDelete: () => void 0
-	}) : Z.slug === "section" ? /* @__PURE__ */ Y(ae, {
+	}) : X.slug === "section" ? /* @__PURE__ */ J(m, {
 		title: "Revenue summary",
 		description: "Section wrapper for grouped content and actions.",
-		actions: /* @__PURE__ */ Y(e, {
+		actions: /* @__PURE__ */ J(e, {
 			size: "sm",
 			children: "Export"
 		}),
 		bordered: !0,
-		children: /* @__PURE__ */ Y("div", {
+		children: /* @__PURE__ */ J("div", {
 			className: "text-sm text-muted-foreground",
 			children: "Place chart, filters, table or any route content inside."
 		})
-	}) : Z.category === "Forms" ? /* @__PURE__ */ X("div", {
+	}) : X.category === "Forms" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-3",
-		children: [/* @__PURE__ */ Y(i, {
+		children: [/* @__PURE__ */ J(r, {
 			value: Q.textValue,
 			onChange: (e) => $({ textValue: e.currentTarget.value }),
-			placeholder: `${Z.title} preview`
-		}), /* @__PURE__ */ Y("p", {
+			placeholder: `${X.title} preview`
+		}), /* @__PURE__ */ J("p", {
 			className: "text-sm text-muted-foreground",
 			children: "Generic field preview for this form surface."
 		})]
-	}) : Z.category === "Overlay" ? /* @__PURE__ */ X("div", {
+	}) : X.category === "Overlay" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-4 rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5",
-		children: [/* @__PURE__ */ X("div", {
+		children: [/* @__PURE__ */ Y("div", {
 			className: "flex items-center justify-between gap-4",
-			children: [/* @__PURE__ */ X("div", { children: [/* @__PURE__ */ Y("p", {
+			children: [/* @__PURE__ */ Y("div", { children: [/* @__PURE__ */ J("p", {
 				className: "text-sm font-semibold text-[color:var(--aui-page-foreground)]",
-				children: Z.title
-			}), /* @__PURE__ */ Y("p", {
+				children: X.title
+			}), /* @__PURE__ */ J("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."
-			})] }), /* @__PURE__ */ Y(s, {
+			})] }), /* @__PURE__ */ J(o, {
 				variant: "outline",
 				children: "Overlay"
 			})]
-		}), /* @__PURE__ */ Y("div", {
+		}), /* @__PURE__ */ J("div", {
 			className: "rounded-2xl border border-dashed border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] p-4",
-			children: /* @__PURE__ */ X("div", {
+			children: /* @__PURE__ */ Y("div", {
 				className: "flex flex-wrap items-center justify-end gap-2",
 				children: [
-					/* @__PURE__ */ Y(e, {
+					/* @__PURE__ */ J(e, {
 						variant: "ghost",
 						children: "Cancel"
 					}),
-					/* @__PURE__ */ Y(e, {
+					/* @__PURE__ */ J(e, {
 						variant: "outline",
 						children: "Save draft"
 					}),
-					/* @__PURE__ */ Y(e, { children: "Confirm" })
+					/* @__PURE__ */ J(e, { children: "Confirm" })
 				]
 			})
 		})]
-	}) : Z.category === "Data Display" ? /* @__PURE__ */ X("div", {
+	}) : X.category === "Data Display" ? /* @__PURE__ */ Y("div", {
 		className: "grid gap-4 rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5",
-		children: [/* @__PURE__ */ X("div", {
+		children: [/* @__PURE__ */ Y("div", {
 			className: "flex items-center justify-between gap-4",
-			children: [/* @__PURE__ */ X("div", { children: [/* @__PURE__ */ Y("p", {
+			children: [/* @__PURE__ */ Y("div", { children: [/* @__PURE__ */ J("p", {
 				className: "text-lg font-semibold",
-				children: Z.title
-			}), /* @__PURE__ */ Y("p", {
+				children: X.title
+			}), /* @__PURE__ */ J("p", {
 				className: "mt-1 text-sm text-muted-foreground",
 				children: "Display surfaces should prioritize readable values, compact metadata, and clear scanning order."
-			})] }), /* @__PURE__ */ Y(s, {
+			})] }), /* @__PURE__ */ J(o, {
 				variant: "outline",
-				children: de
+				children: ne
 			})]
-		}), /* @__PURE__ */ Y("div", {
+		}), /* @__PURE__ */ J("div", {
 			className: "grid gap-3 md:grid-cols-3",
 			children: [
 				{
@@ -901,40 +744,40 @@ function $(Z, ue, Q, $, de) {
 					value: "Live",
 					note: "One concise badge or tone"
 				}
-			].map((e) => /* @__PURE__ */ X("div", {
+			].map((e) => /* @__PURE__ */ Y("div", {
 				className: "rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
 				children: [
-					/* @__PURE__ */ Y("p", {
+					/* @__PURE__ */ J("p", {
 						className: "text-xs uppercase tracking-[0.18em] text-muted-foreground",
 						children: e.label
 					}),
-					/* @__PURE__ */ Y("p", {
+					/* @__PURE__ */ J("p", {
 						className: "mt-2 text-lg font-semibold text-[color:var(--aui-page-foreground)]",
 						children: e.value
 					}),
-					/* @__PURE__ */ Y("p", {
+					/* @__PURE__ */ J("p", {
 						className: "mt-1 text-sm text-muted-foreground",
 						children: e.note
 					})
 				]
 			}, e.label))
 		})]
-	}) : /* @__PURE__ */ Y("div", {
+	}) : /* @__PURE__ */ J("div", {
 		className: "rounded-2xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5",
-		children: /* @__PURE__ */ X("div", {
+		children: /* @__PURE__ */ Y("div", {
 			className: "flex items-center justify-between gap-4",
-			children: [/* @__PURE__ */ X("div", { children: [/* @__PURE__ */ Y("p", {
+			children: [/* @__PURE__ */ Y("div", { children: [/* @__PURE__ */ J("p", {
 				className: "text-lg font-semibold",
-				children: Z.title
-			}), /* @__PURE__ */ Y("p", {
+				children: X.title
+			}), /* @__PURE__ */ J("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."
-			})] }), /* @__PURE__ */ Y(s, {
+			})] }), /* @__PURE__ */ J(o, {
 				variant: "outline",
-				children: Z.category
+				children: X.category
 			})]
 		})
 	});
 }
 //#endregion
-export { Z as createGenericShowcaseDemo };
+export { X as createGenericShowcaseDemo };