tembro 2.0.6 → 2.1.0

package/dist/showcase/premium/textarea/showcase.js

@@ -63,7 +63,10 @@ function s({ state: s, setState: c }) {
 								onChange: (e) => c({ textareaValue: e.target.value }),
 								rows: r[0].rows,
 								className: `${r[0].minHeight} resize-y`,
-								placeholder: r[0].placeholder
+								placeholder: r[0].placeholder,
+								helperText: "Visible helper copy keeps instructions outside the placeholder.",
+								maxLength: 240,
+								showCharacterCount: !0
 							})
 						})]
 					}), /* @__PURE__ */ a("div", {
@@ -135,7 +138,8 @@ function s({ state: s, setState: c }) {
 						children: /* @__PURE__ */ i(t, {
 							defaultValue: r[1].defaultValue,
 							rows: r[1].rows,
-							className: `${r[1].minHeight} resize-none`
+							className: `${r[1].minHeight} resize-none`,
+							helperText: "Uncontrolled draft with stable helper spacing."
 						})
 					})]
 				}), /* @__PURE__ */ a("section", {
@@ -149,7 +153,8 @@ function s({ state: s, setState: c }) {
 							value: r[2].defaultValue,
 							readOnly: r[2].readOnly,
 							rows: r[2].rows,
-							className: `${r[2].minHeight} resize-none opacity-70`
+							className: `${r[2].minHeight} resize-none opacity-70`,
+							errorText: s.textareaValue.trim().length > 0 && s.textareaValue.trim().length < 10 ? "Draft needs at least 10 characters." : void 0
 						}), /* @__PURE__ */ i("p", {
 							className: "text-sm leading-6 aui-text-muted",
 							children: "Read-only textareas should still be easy to scan and copy without looking like disabled, broken, or low-priority content."

package/dist/showcase/premium/toast/showcase.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/ui/button/index.cjs"),n=require("../../../components/ui/badge/index.cjs"),r=require("../../../components/notifications/toast.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=`rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5`;function s({mode:e}){let[s,c]=i.useState(0),{addToast:l,success:u,warning:d,error:f,clearToasts:p,toasts:m,dismissToast:h}=r.useToast();return(0,a.jsxs)(`div`,{className:`space-y-5`,children:[(0,a.jsxs)(`section`,{className:`rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5 sm:p-6`,children:[(0,a.jsxs)(`div`,{className:`flex flex-col gap-6 xl:flex-row xl:items-start xl:justify-between`,children:[(0,a.jsxs)(`div`,{className:`max-w-xl`,children:[(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted`,children:`Transient feedback`}),(0,a.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Toasts should report short-lived outcomes`}),(0,a.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`Use them for short confirmations and lightweight warnings. Critical blocking states should remain on the page, not vanish into transient notifications.`})]}),(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Success`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Warning`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Error`})]})]}),(0,a.jsxs)(`div`,{className:`mt-6 flex flex-wrap gap-2`,children:[(0,a.jsx)(t.Button,{size:`sm`,onClick:()=>{c(e=>e+1),l({title:`Sync started`,description:`Sync run ${s+1} has started.`,tone:`info`})},children:`Add toast`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>{c(e=>e+1),u({title:`Saved`,description:`Project updated successfully.`,tone:`success`})},children:`Success`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>{c(e=>e+1),d(`Please confirm required metadata before publish.`)},children:`Warning`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>{c(e=>e+1),f({title:`Request failed`,description:`Failure occurred while saving item #${s+1}`})},children:`Error`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:p,children:`Clear all`})]})]}),(0,a.jsxs)(`div`,{className:o,children:[(0,a.jsxs)(`p`,{className:`mb-2 text-sm aui-text-muted`,children:[`Active toasts: `,m.length]}),(0,a.jsx)(`div`,{className:`grid gap-2`,children:m.length===0?(0,a.jsx)(`div`,{className:`rounded-lg border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-3 py-2 text-sm aui-text-muted`,children:`No active toasts`}):m.map(e=>(0,a.jsxs)(`div`,{className:`flex items-start justify-between rounded-lg border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-3 py-2 text-sm`,children:[(0,a.jsxs)(`div`,{children:[(0,a.jsx)(`p`,{className:`font-medium aui-text-strong`,children:e.title??`Untitled`}),(0,a.jsx)(`p`,{className:`aui-text-muted`,children:e.description})]}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>h(e.id),children:`Dismiss`})]},e.id))})]}),null]})}function c({mode:e}){return(0,a.jsx)(r.ToastProvider,{position:`top-right`,defaultDuration:3e3,maxToasts:5,pauseOnHover:e===`playground`,children:(0,a.jsx)(s,{mode:e})})}exports.ToastShowcase=c;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/ui/button/index.cjs"),n=require("../../../components/ui/badge/index.cjs"),r=require("../../../components/notifications/toast.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=`rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5`;function s({mode:e}){let[s,c]=i.useState(0),{addToast:l,success:u,warning:d,error:f,promise:p,clearToasts:m,toasts:h,dismissToast:g}=r.useToast();return(0,a.jsxs)(`div`,{className:`space-y-5`,children:[(0,a.jsxs)(`section`,{className:`rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5 sm:p-6`,children:[(0,a.jsxs)(`div`,{className:`flex flex-col gap-6 xl:flex-row xl:items-start xl:justify-between`,children:[(0,a.jsxs)(`div`,{className:`max-w-xl`,children:[(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted`,children:`Transient feedback`}),(0,a.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Toasts should report short-lived outcomes`}),(0,a.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`Use them for short confirmations and lightweight warnings. Critical blocking states should remain on the page, not vanish into transient notifications.`})]}),(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Success`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Warning`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Error`})]})]}),(0,a.jsxs)(`div`,{className:`mt-6 flex flex-wrap gap-2`,children:[(0,a.jsx)(t.Button,{size:`sm`,onClick:()=>{c(e=>e+1),l({title:`Sync started`,description:`Sync run ${s+1} has started.`,tone:`info`})},children:`Add toast`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>{c(e=>e+1),u({title:`Saved`,description:`Project updated successfully.`,tone:`success`})},children:`Success`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>{c(e=>e+1),d(`Please confirm required metadata before publish.`)},children:`Warning`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>{c(e=>e+1),f({title:`Request failed`,description:`Failure occurred while saving item #${s+1}`})},children:`Error`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>{p(new Promise(e=>{window.setTimeout(()=>e(`Export ready`),1200)}),{loading:{title:`Preparing export`,description:`Building CSV package.`,group:`Export`},success:e=>({title:e,description:`Download can start now.`,group:`Export`}),error:()=>({title:`Export failed`,description:`Retry after refreshing.`,group:`Export`})})},children:`Promise`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:m,children:`Clear all`})]})]}),(0,a.jsxs)(`div`,{className:o,children:[(0,a.jsxs)(`p`,{className:`mb-2 text-sm aui-text-muted`,children:[`Active toasts: `,h.length]}),(0,a.jsx)(`div`,{className:`grid gap-2`,children:h.length===0?(0,a.jsx)(`div`,{className:`rounded-lg border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-3 py-2 text-sm aui-text-muted`,children:`No active toasts`}):h.map(e=>(0,a.jsxs)(`div`,{className:`flex items-start justify-between rounded-lg border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-3 py-2 text-sm`,children:[(0,a.jsxs)(`div`,{children:[(0,a.jsx)(`p`,{className:`font-medium aui-text-strong`,children:e.title??`Untitled`}),(0,a.jsx)(`p`,{className:`aui-text-muted`,children:e.description})]}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>g(e.id),children:`Dismiss`})]},e.id))})]}),null]})}function c({mode:e}){return(0,a.jsx)(r.ToastProvider,{position:`top-right`,defaultDuration:3e3,maxToasts:5,pauseOnHover:e===`playground`,children:(0,a.jsx)(s,{mode:e})})}exports.ToastShowcase=c;

package/dist/showcase/premium/toast/showcase.js

@@ -6,7 +6,7 @@ import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/showcase/premium/toast/showcase.tsx
 var s = "rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5";
 function c({ mode: n }) {
-	let [c, l] = i.useState(0), { addToast: u, success: d, warning: f, error: p, clearToasts: m, toasts: h, dismissToast: g } = r();
+	let [c, l] = i.useState(0), { addToast: u, success: d, warning: f, error: p, promise: m, clearToasts: h, toasts: g, dismissToast: _ } = r();
 	return /* @__PURE__ */ o("div", {
 		className: "space-y-5",
 		children: [
@@ -98,7 +98,33 @@ function c({ mode: n }) {
 						/* @__PURE__ */ a(e, {
 							size: "sm",
 							variant: "outline",
-							onClick: m,
+							onClick: () => {
+								m(new Promise((e) => {
+									window.setTimeout(() => e("Export ready"), 1200);
+								}), {
+									loading: {
+										title: "Preparing export",
+										description: "Building CSV package.",
+										group: "Export"
+									},
+									success: (e) => ({
+										title: e,
+										description: "Download can start now.",
+										group: "Export"
+									}),
+									error: () => ({
+										title: "Export failed",
+										description: "Retry after refreshing.",
+										group: "Export"
+									})
+								});
+							},
+							children: "Promise"
+						}),
+						/* @__PURE__ */ a(e, {
+							size: "sm",
+							variant: "outline",
+							onClick: h,
 							children: "Clear all"
 						})
 					]
@@ -108,13 +134,13 @@ function c({ mode: n }) {
 				className: s,
 				children: [/* @__PURE__ */ o("p", {
 					className: "mb-2 text-sm aui-text-muted",
-					children: ["Active toasts: ", h.length]
+					children: ["Active toasts: ", g.length]
 				}), /* @__PURE__ */ a("div", {
 					className: "grid gap-2",
-					children: h.length === 0 ? /* @__PURE__ */ a("div", {
+					children: g.length === 0 ? /* @__PURE__ */ a("div", {
 						className: "rounded-lg border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-3 py-2 text-sm aui-text-muted",
 						children: "No active toasts"
-					}) : h.map((t) => /* @__PURE__ */ o("div", {
+					}) : g.map((t) => /* @__PURE__ */ o("div", {
 						className: "flex items-start justify-between rounded-lg border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-3 py-2 text-sm",
 						children: [/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("p", {
 							className: "font-medium aui-text-strong",
@@ -125,7 +151,7 @@ function c({ mode: n }) {
 						})] }), /* @__PURE__ */ a(e, {
 							size: "sm",
 							variant: "outline",
-							onClick: () => g(t.id),
+							onClick: () => _(t.id),
 							children: "Dismiss"
 						})]
 					}, t.id))

package/dist/showcase/premium/types.d.ts

@@ -5,7 +5,7 @@ export type ComponentDemoState = {
     checked: boolean;
     switchOn: boolean;
     selectValue: string;
-    badgeVariant: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link";
+    badgeVariant: "default" | "secondary" | "soft" | "destructive" | "outline" | "ghost" | "link";
     cardCompact: boolean;
     activeTab: "overview" | "activity" | "settings";
 };

package/dist/showcase/registry-quality.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./create-demo.cjs");var t=e.createShowcaseDemoRegistry([e.component(`button`,`Button`,`actions`,`Primary action surface for clicks, submit, and quick triggers in dashboard workflows.`),e.component(`input`,`Input`,`inputs`,`Single-line text input for quick edits, queries, and form fields.`),e.component(`select`,`Select`,`inputs`,`Select component with menu-driven single choice workflows.`),e.component(`dialog`,`Dialog`,`overlay`,`Modal surface for confirmation, forms, and contextual workflows.`),e.component(`data-table`,`DataTable`,`data-table`,`High density table with search, filters, rows, actions and pagination context.`),e.component(`date-picker`,`DatePicker`,`calendar`,`Date picker surface for period and event selection.`),e.component(`form-input`,`FormInput`,`form`,`Input wrapper with RHF-ready metadata and helper text.`),e.component(`form-select`,`FormSelect`,`form`,`Select wrapper for controlled local and async choice fields.`),e.component(`form-textarea`,`FormTextarea`,`form`,`Textarea wrapper with helper, validation and consistent spacing.`),e.component(`form-switch`,`FormSwitch`,`form`,`Boolean form control with shell-level label and hint handling.`),e.component(`form-date-picker`,`FormDatePicker`,`form`,`Popover date picker wrapper with RHF integration.`),e.component(`form-date-range-picker`,`FormDateRangePicker`,`form`,`Range date picker wrapper for planning and reporting flows.`),e.component(`alert-dialog`,`AlertDialog`,`overlay`,`Destructive confirmation dialog with loading-ready action states.`),e.component(`drawer`,`Drawer`,`overlay`,`Side panel for contextual details without leaving the page.`),e.component(`pagination`,`Pagination`,`navigation`,`Controlled page navigation with edge buttons and active state.`),e.component(`nav-tabs`,`NavTabs`,`navigation`,`Navigation tabs for switching related document sections.`),e.component(`page-tabs`,`PageTabs`,`navigation`,`Top-level page tab strip for route-sized sections.`),e.component(`stepper-tabs`,`StepperTabs`,`navigation`,`Step-like tabs for setup and onboarding progress.`),e.component(`password-input`,`PasswordInput`,`inputs`,`Password field with visibility toggle and secure autocomplete defaults.`),e.component(`number-input`,`NumberInput`,`inputs`,`Numeric entry for counts, thresholds, and reporting controls.`),e.component(`phone-input`,`PhoneInput`,`inputs`,`Phone input with stable raw and masked value handling.`),e.component(`money-input`,`MoneyInput`,`inputs`,`Currency entry for billing, finance and KPI editing flows.`),e.component(`simple-select`,`SimpleSelect`,`inputs`,`Static local-option select for dashboards and settings forms.`),e.component(`async-select`,`AsyncSelect`,`inputs`,`Remote-loaded select for large server-backed option sets.`),e.component(`combobox`,`Combobox`,`inputs`,`Searchable local choice input for reassignment and command-like selection.`),e.component(`slider`,`Slider`,`inputs`,`Single value range control for density, threshold, and score tuning.`),e.component(`range-slider`,`RangeSlider`,`inputs`,`Two-handle slider for min/max filtering.`),e.component(`rating`,`Rating`,`inputs`,`Compact score input for feedback and review flows.`),e.component(`otp-input`,`OtpInput`,`inputs`,`One-time code entry with fixed-length slots.`),e.component(`inline-editable`,`InlineEditable`,`inputs`,`Inline editing primitive for dense tables and configuration rows.`),e.component(`tag-input`,`TagInput`,`inputs`,`Tokenized text input for labels, skills, and quick filters.`),e.component(`progress`,`Progress`,`display`,`Linear progress with label, value formatter, tone and indeterminate state.`),e.component(`progress-circle`,`ProgressCircle`,`display`,`Compact circular progress for sidebars and status cards.`),e.component(`timeline`,`Timeline`,`display`,`Vertical or horizontal event stream for workflow history.`),e.component(`status-dot`,`StatusDot`,`display`,`Tiny live status indicator with optional pulse animation.`),e.component(`user-card`,`UserCard`,`display`,`User summary row with avatar, metadata and actions.`),e.component(`notification-center`,`NotificationCenter`,`display`,`Compact activity and notifications stream.`),e.component(`data-list`,`DataList`,`display`,`Readable title and description rows for compact operational lists.`),e.component(`status-legend`,`StatusLegend`,`display`,`Explain status meaning and counts in a compact legend.`),e.component(`trend-card`,`TrendCard`,`display`,`Metric summary card with trend context.`),e.component(`action-menu`,`ActionMenu`,`actions`,`Compact dropdown action menu for rows and cards.`),e.component(`button-group`,`ButtonGroup`,`actions`,`Grouped action buttons for view switching and compact controls.`),e.component(`quick-action-grid`,`QuickActionGrid`,`actions`,`Action launcher grid for dense dashboard shortcuts.`),e.component(`filter-bar`,`FilterBar`,`actions`,`Search, filters, active-count and reset actions in one toolbar.`),e.component(`app-header`,`AppHeader`,`layout`,`Sticky product header with left, center and right slots.`),e.component(`section-header`,`SectionHeader`,`layout`,`Reusable section title block with actions and metadata.`),e.component(`stat-card`,`StatCard`,`layout`,`Dashboard stat card for KPI, trend and helper text.`),e.component(`alert`,`Alert`,`feedback`,`Inline feedback banner for success, warning, info, and error states.`),e.component(`page-state`,`PageState`,`feedback`,`Full-page completion or blocked state with next actions.`),e.component(`calendar`,`Calendar`,`calendar`,`Single month calendar surface for date picker and scheduling flows.`),e.component(`file-upload`,`FileUpload`,`upload`,`Full file upload surface with dropzone, action button and helper text.`),e.component(`image-upload`,`ImageUpload`,`upload`,`Image upload pattern with preview-oriented copy.`),e.component(`file-dropzone`,`FileDropzone`,`upload`,`Lightweight file dropzone primitive for custom upload flows.`),e.component(`stepper`,`Stepper`,`wizard`,`Clickable step navigation for multi-step forms.`),e.component(`wizard`,`Wizard`,`wizard`,`Stepper, content and footer controls combined into one workflow.`),e.component(`resource-page`,`ResourcePage`,`patterns`,`Full resource index page shell for admin dashboards.`),e.component(`resource-detail-page`,`ResourceDetailPage`,`patterns`,`Detail page shell with title, metadata and sections.`)]);exports.registryQualityDemoRegistry=t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./create-demo.cjs");var t=e.createShowcaseDemoRegistry([e.component(`button`,`Button`,`actions`,`Primary action surface for clicks, submit, and quick triggers in dashboard workflows.`),e.component(`input`,`Input`,`inputs`,`Single-line text input for quick edits, queries, and form fields.`),e.component(`select`,`Select`,`inputs`,`Select component with menu-driven single choice workflows.`),e.component(`dialog`,`Dialog`,`overlay`,`Modal surface for confirmation, forms, and contextual workflows.`),e.component(`data-table`,`DataTable`,`data-table`,`High density table with search, filters, rows, actions and pagination context.`),e.component(`date-picker`,`DatePicker`,`calendar`,`Date picker surface for period and event selection.`),e.component(`form-input`,`FormInput`,`form`,`Input wrapper with RHF-ready metadata and helper text.`),e.component(`form-select`,`FormSelect`,`form`,`Select wrapper for controlled local and async choice fields.`),e.component(`form-textarea`,`FormTextarea`,`form`,`Textarea wrapper with helper, validation and consistent spacing.`),e.component(`form-switch`,`FormSwitch`,`form`,`Boolean form control with shell-level label and hint handling.`),e.component(`form-date-picker`,`FormDatePicker`,`form`,`Popover date picker wrapper with RHF integration.`),e.component(`form-date-range-picker`,`FormDateRangePicker`,`form`,`Range date picker wrapper for planning and reporting flows.`),e.component(`alert-dialog`,`AlertDialog`,`overlay`,`Destructive confirmation dialog with loading-ready action states.`),e.component(`drawer`,`Drawer`,`overlay`,`Side panel for contextual details without leaving the page.`),e.component(`pagination`,`Pagination`,`navigation`,`Controlled page navigation with edge buttons and active state.`),e.component(`nav-tabs`,`NavTabs`,`navigation`,`Navigation tabs for switching related document sections.`),e.component(`page-tabs`,`PageTabs`,`navigation`,`Top-level page tab strip for route-sized sections.`),e.component(`stepper-tabs`,`StepperTabs`,`navigation`,`Step-like tabs for setup and onboarding progress.`),e.component(`password-input`,`PasswordInput`,`inputs`,`Password field with visibility toggle and secure autocomplete defaults.`),e.component(`number-input`,`NumberInput`,`inputs`,`Numeric entry for counts, thresholds, and reporting controls.`),e.component(`phone-input`,`PhoneInput`,`inputs`,`Phone input with stable raw and masked value handling.`),e.component(`money-input`,`MoneyInput`,`inputs`,`Currency entry for billing, finance and KPI editing flows.`),e.component(`simple-select`,`SimpleSelect`,`inputs`,`Static local-option select for dashboards and settings forms.`),e.component(`async-select`,`AsyncSelect`,`inputs`,`Remote-loaded select for large server-backed option sets.`),e.component(`combobox`,`Combobox`,`inputs`,`Searchable local choice input for reassignment and command-like selection.`),e.component(`slider`,`Slider`,`inputs`,`Single value range control for density, threshold, and score tuning.`),e.component(`range-slider`,`RangeSlider`,`inputs`,`Two-handle slider for min/max filtering.`),e.component(`rating`,`Rating`,`inputs`,`Compact score input for feedback and review flows.`),e.component(`otp-input`,`OtpInput`,`inputs`,`One-time code entry with fixed-length slots.`),e.component(`inline-editable`,`InlineEditable`,`inputs`,`Inline editing primitive for dense tables and configuration rows.`),e.component(`tag-input`,`TagInput`,`inputs`,`Tokenized text input for labels, skills, and quick filters.`),e.component(`progress`,`Progress`,`display`,`Linear progress with label, value formatter, tone and indeterminate state.`),e.component(`progress-circle`,`ProgressCircle`,`display`,`Compact circular progress for sidebars and status cards.`),e.component(`timeline`,`Timeline`,`display`,`Vertical or horizontal event stream for workflow history.`),e.component(`status-dot`,`StatusDot`,`display`,`Tiny live status indicator with optional pulse animation.`),e.component(`user-card`,`UserCard`,`display`,`User summary row with avatar, metadata and actions.`),e.component(`notification-center`,`NotificationCenter`,`display`,`Compact activity and notifications stream.`),e.component(`data-list`,`DataList`,`display`,`Readable title and description rows for compact operational lists.`),e.component(`status-legend`,`StatusLegend`,`display`,`Explain status meaning and counts in a compact legend.`),e.component(`trend-card`,`TrendCard`,`display`,`Metric summary card with trend context.`),e.component(`action-menu`,`ActionMenu`,`actions`,`Compact dropdown action menu for rows and cards.`),e.component(`button-group`,`ButtonGroup`,`actions`,`Grouped action buttons for view switching and compact controls.`),e.component(`quick-action-grid`,`QuickActionGrid`,`actions`,`Action launcher grid for dense dashboard shortcuts.`),e.component(`filter-bar`,`FilterBar`,`actions`,`Search, filters, active-count and reset actions in one toolbar.`),e.component(`app-header`,`AppHeader`,`layout`,`Sticky product header with left, center and right slots.`),e.component(`app-shell`,`AppShell`,`layout`,`Responsive application shell with sidebar, header and content regions.`),e.component(`section-header`,`SectionHeader`,`layout`,`Reusable section title block with actions and metadata.`),e.component(`stat-card`,`StatCard`,`layout`,`Dashboard stat card for KPI, trend and helper text.`),e.component(`alert`,`Alert`,`feedback`,`Inline feedback banner for success, warning, info, and error states.`),e.component(`page-state`,`PageState`,`feedback`,`Full-page completion or blocked state with next actions.`),e.component(`calendar`,`Calendar`,`calendar`,`Single month calendar surface for date picker and scheduling flows.`),e.component(`file-upload`,`FileUpload`,`upload`,`Full file upload surface with dropzone, action button and helper text.`),e.component(`image-upload`,`ImageUpload`,`upload`,`Image upload pattern with preview-oriented copy.`),e.component(`file-dropzone`,`FileDropzone`,`upload`,`Lightweight file dropzone primitive for custom upload flows.`),e.component(`stepper`,`Stepper`,`wizard`,`Clickable step navigation for multi-step forms.`),e.component(`wizard`,`Wizard`,`wizard`,`Stepper, content and footer controls combined into one workflow.`),e.component(`resource-page`,`ResourcePage`,`patterns`,`Full resource index page shell for admin dashboards.`),e.component(`resource-detail-page`,`ResourceDetailPage`,`patterns`,`Detail page shell with title, metadata and sections.`)]);exports.registryQualityDemoRegistry=t;

package/dist/showcase/registry-quality.js

@@ -46,6 +46,7 @@ var n = t([
 	e("quick-action-grid", "QuickActionGrid", "actions", "Action launcher grid for dense dashboard shortcuts."),
 	e("filter-bar", "FilterBar", "actions", "Search, filters, active-count and reset actions in one toolbar."),
 	e("app-header", "AppHeader", "layout", "Sticky product header with left, center and right slots."),
+	e("app-shell", "AppShell", "layout", "Responsive application shell with sidebar, header and content regions."),
 	e("section-header", "SectionHeader", "layout", "Reusable section title block with actions and metadata."),
 	e("stat-card", "StatCard", "layout", "Dashboard stat card for KPI, trend and helper text."),
 	e("alert", "Alert", "feedback", "Inline feedback banner for success, warning, info, and error states."),

package/dist/showcase/render-registry-preview.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../_virtual/_rolldown/runtime.cjs"),t=require("../components/ui/button/index.cjs"),n=require("../components/actions/action-menu.cjs"),r=require("../components/actions/button-group.cjs"),i=require("../components/inputs/password-input.cjs"),a=require("../components/ui/input/index.cjs"),o=require("../components/ui/badge/index.cjs"),s=require("../components/actions/quick-action-grid.cjs"),c=require("../components/layout/section-header.cjs"),l=require("../components/navigation/anchor-nav.cjs"),u=require("../components/navigation/nav-tabs.cjs"),d=require("../components/navigation/page-tabs.cjs"),f=require("../components/navigation/pagination.cjs"),p=require("../components/navigation/stepper-tabs.cjs"),m=require("../components/filters/filter-bar.cjs"),h=require("../components/overlay/alert-dialog.cjs"),g=require("../components/overlay/dialog-actions.cjs"),_=require("../components/overlay/drawer.cjs"),v=require("../components/inputs/color-input.cjs"),y=require("../components/inputs/otp-input.cjs"),b=require("../components/inputs/rating.cjs"),x=require("../components/inputs/slider.cjs"),S=require("../components/inputs/tag-input.cjs"),C=require("../components/feedback/alert.cjs"),w=require("../components/feedback/page-state.cjs"),T=require("../components/display/description-list.cjs"),E=require("../components/display/list.cjs"),D=require("../components/display/progress.cjs"),O=require("../components/display/progress-circle.cjs"),k=require("../components/display/status-dot.cjs"),A=require("../components/display/status-legend.cjs"),j=require("../components/display/timeline.cjs"),M=require("../components/display/user-card.cjs"),N=require("../components/layout/stat-card.cjs"),P=require("../components/command/command-palette.cjs"),F=require("../components/calendar/calendar.cjs"),I=require("../components/upload/file-upload.cjs"),L=require("../components/upload/file-dropzone.cjs"),R=require("../components/wizard/stepper.cjs"),ee=require("../components/wizard/wizard.cjs"),z=require("../components/layout/app-header.cjs"),B=require("../components/patterns/resource-detail-page.cjs"),V=require("../components/patterns/resource-page.cjs");let H=require("react");H=e.__toESM(H,1);let U=require("lucide-react"),W=require("react/jsx-runtime");function G(e,t,n){return e.kind===`inputs`?(0,W.jsx)(q,{slug:e.slug,state:t,setState:n}):e.kind===`form`?(0,W.jsx)(J,{state:t,setState:n}):e.kind===`overlay`?(0,W.jsx)(Y,{slug:e.slug}):e.kind===`navigation`?(0,W.jsx)(X,{slug:e.slug}):e.kind===`feedback`?(0,W.jsx)(Z,{slug:e.slug}):e.kind===`display`?(0,W.jsx)(Q,{slug:e.slug}):e.kind===`actions`?(0,W.jsx)($,{slug:e.slug,state:t,setState:n}):e.kind===`layout`?(0,W.jsx)(te,{slug:e.slug}):e.kind===`data-table`?(0,W.jsx)(ne,{slug:e.slug}):e.kind===`calendar`?(0,W.jsx)(re,{}):e.kind===`upload`?(0,W.jsx)(ie,{slug:e.slug}):e.kind===`wizard`?(0,W.jsx)(ae,{slug:e.slug}):e.kind===`patterns`?(0,W.jsx)(oe,{slug:e.slug}):null}function K({tone:e,children:t}){return(0,W.jsx)(o.Badge,{variant:e===`danger`?`destructive`:e===`warning`?`outline`:`secondary`,children:t})}function q({slug:e,state:t,setState:n}){let r=t.textValue,o=e=>n({textValue:e});return e===`search-input`?(0,W.jsx)(a.Input,{type:`search`,value:r,onValueChange:o,resultCount:12,shortcut:`Ctrl K`,placeholder:`Search customers...`}):e===`password-input`?(0,W.jsx)(i.PasswordInput,{value:`secret-token`,onValueChange:o,placeholder:`Password`}):e===`clearable-input`?(0,W.jsx)(a.Input,{value:r,onValueChange:o,placeholder:`Clearable input`,clearable:!0}):e===`slider`?(0,W.jsx)(x.Slider,{label:`Density`,description:`Tune content density.`,defaultValue:64,showValue:!0}):e===`range-slider`?(0,W.jsx)(x.RangeSlider,{label:`Revenue range`,description:`Filter between two values.`,defaultValue:[20,80],showValue:!0}):e===`rating`?(0,W.jsx)(b.Rating,{defaultValue:4,labels:{clear:`Reset`}}):e===`otp-input`?(0,W.jsx)(y.OtpInput,{value:r.replace(/\D/g,``).slice(0,6),onValueChange:o}):e===`color-input`?(0,W.jsx)(v.ColorInput,{defaultValue:`#22c55e`,label:`Accent color`,description:`Theme token preview.`}):e===`tag-input`?(0,W.jsx)(S.TagInput,{defaultValue:[`dashboard`,`beta`,`ops`],placeholder:`Add label`}):(0,W.jsx)(a.Input,{value:r,onChange:e=>n({textValue:e.currentTarget.value}),placeholder:`Unified input`})}function J({state:e,setState:t}){return(0,W.jsxs)(`div`,{className:`grid gap-4 md:grid-cols-2`,children:[(0,W.jsxs)(`label`,{className:`grid gap-2`,children:[(0,W.jsx)(`span`,{className:`text-sm font-medium text-[color:var(--aui-page-foreground)]`,children:`Email address`}),(0,W.jsx)(a.Input,{value:e.textValue,onChange:e=>t({textValue:e.currentTarget.value})}),(0,W.jsx)(`span`,{className:`text-xs text-[color:var(--aui-page-muted)]`,children:`Form wrappers keep label, hint and error spacing consistent.`})]}),(0,W.jsxs)(`label`,{className:`grid gap-2`,children:[(0,W.jsx)(`span`,{className:`text-sm font-medium text-[color:var(--aui-page-foreground)]`,children:`Status`}),(0,W.jsx)(a.Input,{type:`search`,value:`Active customers`,resultCount:7,readOnly:!0}),(0,W.jsx)(`span`,{className:`text-xs text-emerald-500`,children:`Ready to submit`})]})]})}function Y({slug:e}){return e===`dialog-actions`?(0,W.jsx)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:(0,W.jsxs)(g.DialogActions,{align:`end`,children:[(0,W.jsx)(g.DialogActionButton,{variant:`ghost`,children:`Cancel`}),(0,W.jsx)(g.DialogActionButton,{variant:`outline`,children:`Save draft`}),(0,W.jsx)(g.DialogActionButton,{children:`Publish`})]})}):e===`alert-dialog`?(0,W.jsx)(h.AlertDialog,{open:!1,title:`Archive invoice?`,description:`This keeps the invoice readable but removes it from active queues.`,children:(0,W.jsx)(t.Button,{variant:`destructive`,children:`Open alert`})}):e===`drawer`?(0,W.jsx)(_.Drawer,{open:!1,trigger:(0,W.jsx)(t.Button,{variant:`outline`,children:`Open drawer`}),title:`Customer details`,description:`Side panel for fast inspection.`,children:(0,W.jsx)(T.DescriptionList,{items:[{key:`plan`,label:`Plan`,value:`Scale`},{key:`owner`,label:`Owner`,value:`Azamat UI`}]})}):(0,W.jsxs)(`div`,{className:`flex flex-wrap items-center justify-end gap-2 rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:[(0,W.jsx)(t.Button,{variant:`ghost`,children:`Cancel`}),(0,W.jsx)(t.Button,{variant:`outline`,children:`Save draft`}),(0,W.jsx)(t.Button,{children:`Publish`})]})}function X({slug:e}){return e===`pagination`?(0,W.jsx)(f.Pagination,{page:3,pageCount:9,onPageChange:()=>void 0}):e===`anchor-nav`?(0,W.jsx)(l.AnchorNav,{orientation:`horizontal`,title:`Sections`,items:[{key:`overview`,label:`Overview`,href:`#overview`,active:!0},{key:`usage`,label:`Usage`,href:`#usage`},{key:`api`,label:`API`,href:`#api`}]}):e===`page-tabs`?(0,W.jsx)(d.PageTabs,{value:`overview`,variant:`pills`,items:[{value:`overview`,label:`Overview`},{value:`usage`,label:`Usage`},{value:`api`,label:`API`,badge:`3`}]}):e===`stepper-tabs`?(0,W.jsx)(p.StepperTabs,{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`}]}):(0,W.jsx)(u.NavTabs,{value:`overview`,items:[{value:`overview`,label:`Overview`},{value:`usage`,label:`Usage`},{value:`api`,label:`API`}]})}function Z({slug:e}){return e===`alert`?(0,W.jsx)(C.Alert,{tone:`warning`,title:`Review needed`,description:`Billing rules changed and one approval is pending.`,action:(0,W.jsx)(t.Button,{size:`sm`,children:`Open`})}):e===`page-state`?(0,W.jsx)(w.PageState,{title:`Workspace connected`,description:`The route is ready to accept live data and team actions.`,tone:`success`,action:(0,W.jsx)(t.Button,{size:`sm`,children:`Continue`})}):(0,W.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,W.jsx)(K,{tone:`success`,children:`Live`}),(0,W.jsx)(K,{tone:`warning`,children:`Needs review`}),(0,W.jsx)(K,{tone:`danger`,children:`Blocked`}),(0,W.jsx)(K,{tone:`info`,children:`Queued`})]})}function Q({slug:e}){return e===`description-list`?(0,W.jsx)(T.DescriptionList,{title:`Invoice details`,description:`Structured facts with responsive columns.`,items:[{key:`id`,label:`Invoice`,value:`#4821`},{key:`amount`,label:`Amount`,value:`$12,420`},{key:`status`,label:`Status`,value:(0,W.jsx)(K,{tone:`success`,children:`Paid`})},{key:`owner`,label:`Owner`,value:`Finance team`}]}):e===`progress`?(0,W.jsx)(D.Progress,{label:`Migration progress`,description:`Production rollout`,value:68,tone:`success`,showValue:!0}):e===`progress-circle`?(0,W.jsx)(O.ProgressCircle,{value:72,label:`Profile completed`}):e===`timeline`?(0,W.jsx)(j.Timeline,{items:[{key:`created`,title:`Created`,description:`Invoice generated`,time:`09:20`,tone:`success`},{key:`review`,title:`Review`,description:`Finance team assigned`,time:`10:05`,tone:`info`},{key:`approve`,title:`Approval`,description:`Waiting for manager`,time:`Now`,tone:`warning`}],pending:!0,pendingLabel:`Paid`}):e===`metric-card`||e===`stat-card`?(0,W.jsx)(N.StatCard,{title:`Revenue`,value:`$84.2k`,description:`Compared with last month`,trend:{value:`+12.4%`,tone:`success`},icon:(0,W.jsx)(U.LayoutDashboardIcon,{})}):e===`status-dot`?(0,W.jsxs)(`div`,{className:`grid gap-3`,children:[(0,W.jsx)(k.StatusDot,{tone:`success`,pulse:!0,label:`API healthy`}),(0,W.jsx)(k.StatusDot,{tone:`warning`,label:`Sync delayed`}),(0,W.jsx)(k.StatusDot,{tone:`danger`,label:`Webhook failed`})]}):e===`delta-badge`?(0,W.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,W.jsx)(o.Badge,{variant:`secondary`,children:`+12.4%`}),(0,W.jsx)(o.Badge,{variant:`outline`,children:`-3.1%`}),(0,W.jsx)(o.Badge,{variant:`destructive`,children:`Risk`})]}):e===`notification-center`?(0,W.jsx)(E.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`}]}):e===`data-list`?(0,W.jsx)(E.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`}]}):e===`status-legend`?(0,W.jsx)(A.StatusLegend,{title:`Delivery states`,description:`Explain what each state means and how often it appears.`,orientation:`grid`,items:[{key:`live`,label:`Live`,description:`Healthy production routes`,tone:`success`,count:18},{key:`review`,label:`Review`,description:`Waiting for QA approval`,tone:`warning`,count:4},{key:`blocked`,label:`Blocked`,description:`Needs engineering action`,tone:`danger`,count:1}]}):e===`trend-card`||e===`comparison-card`?(0,W.jsx)(N.StatCard,{title:e===`trend-card`?`Weekly revenue`:`Current vs previous`,value:`$84.2k`,description:`Compared with last month`,trend:{value:`+12.4%`,tone:`success`},icon:(0,W.jsx)(U.LayoutDashboardIcon,{})}):(0,W.jsx)(M.UserCard,{name:`Azamat Jurayev`,description:`Product designer and maintainer`,meta:`Admin workspace`,actions:(0,W.jsx)(t.Button,{size:`sm`,children:`Invite`})})}function $({slug:e,state:i,setState:o}){return e===`filter-bar`?(0,W.jsx)(m.FilterBar,{search:(0,W.jsx)(a.Input,{type:`search`,value:i.textValue,onValueChange:e=>o({textValue:e}),placeholder:`Search invoices...`}),onReset:()=>o({textValue:``}),chips:[{key:`status`,label:`Status`,value:`Active`,tone:`success`},{key:`owner`,label:`Owner`,value:`Azamat`,tone:`default`}],onRemoveChip:()=>void 0,filters:(0,W.jsxs)(t.Button,{variant:`outline`,size:`sm`,children:[(0,W.jsx)(U.FilterIcon,{"data-icon":`inline-start`}),`Status`]}),actions:(0,W.jsx)(t.Button,{size:`sm`,children:`Export`})}):e===`command-palette`?(0,W.jsxs)(`div`,{className:`grid gap-3`,children:[(0,W.jsxs)(`div`,{className:`flex items-center gap-2 rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] px-3 py-2`,children:[(0,W.jsx)(U.SearchIcon,{className:`size-4 text-[color:var(--aui-page-muted)]`}),(0,W.jsx)(`span`,{className:`text-sm text-[color:var(--aui-page-muted)]`,children:`Command palette preview: search routes, components and actions.`})]}),(0,W.jsx)(P.CommandPalette,{open:!1,onOpenChange:()=>void 0,groups:[{id:`navigation`,label:`Navigation`,items:[{id:`docs`,label:`Open docs`,icon:(0,W.jsx)(U.SearchIcon,{className:`size-4`})},{id:`components`,label:`Browse components`,icon:(0,W.jsx)(U.LayoutDashboardIcon,{className:`size-4`})}]}]})]}):e===`button-group`?(0,W.jsx)(r.ButtonGroup,{items:[{key:`day`,label:`Day`},{key:`week`,label:`Week`},{key:`month`,label:`Month`}]}):e===`quick-action-grid`?(0,W.jsx)(s.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`}]}):e===`data-table-saved-filters`?(0,W.jsxs)(`div`,{className:`grid gap-3`,children:[(0,W.jsx)(m.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,W.jsx)(r.ButtonGroup,{attached:!1,items:[{key:`default`,label:`Default`,variant:`secondary`},{key:`billing`,label:`Billing`},{key:`ops`,label:`Operations`}]})]}):(0,W.jsxs)(`div`,{className:`flex items-center justify-between rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:[(0,W.jsxs)(`div`,{children:[(0,W.jsx)(`p`,{className:`font-medium text-[color:var(--aui-page-foreground)]`,children:`Invoice #4821`}),(0,W.jsx)(`p`,{className:`text-sm text-[color:var(--aui-page-muted)]`,children:`Pending approval`})]}),(0,W.jsx)(n.ActionMenu,{label:`Actions`,actions:[{key:`open`,label:`Open`,icon:(0,W.jsx)(U.ChevronRightIcon,{className:`size-4`})},{key:`download`,label:`Download`,icon:(0,W.jsx)(U.DownloadIcon,{className:`size-4`})},{key:`archive`,label:`Archive`,icon:(0,W.jsx)(U.ArchiveIcon,{className:`size-4`}),destructive:!0}],trigger:(0,W.jsx)(t.Button,{variant:`outline`,size:`icon-sm`,"aria-label":`Open actions`,children:(0,W.jsx)(U.MoreHorizontalIcon,{})})})]})}function te({slug:e}){return e===`app-header`?(0,W.jsx)(z.AppHeader,{sticky:!1,left:(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(U.LayoutDashboardIcon,{className:`size-4`}),(0,W.jsx)(`span`,{className:`font-medium`,children:`Dashboard`})]}),center:(0,W.jsx)(o.Badge,{variant:`secondary`,children:`Preview`}),right:(0,W.jsxs)(W.Fragment,{children:[(0,W.jsx)(t.Button,{variant:`ghost`,size:`icon-sm`,"aria-label":`Notifications`,children:(0,W.jsx)(U.BellIcon,{})}),(0,W.jsx)(t.Button,{size:`sm`,children:`Deploy`})]}),className:`rounded-xl border border-[color:var(--aui-divider)]`}):e===`section-header`?(0,W.jsx)(c.SectionHeader,{eyebrow:`Components`,title:`Production-ready surfaces`,description:`SectionHeader keeps copy, metadata and actions aligned.`,actions:(0,W.jsx)(t.Button,{size:`sm`,children:`Add component`})}):(0,W.jsx)(N.StatCard,{title:`Revenue`,value:`$84.2k`,description:`Compared with last month`,trend:{value:`+12.4%`,tone:`success`},helperText:`StatCard keeps KPI, helper text and trend in one compact tile.`})}function ne({slug:e}){return(0,W.jsxs)(`div`,{className:`overflow-hidden rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)]`,children:[(0,W.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-3 border-b border-[color:var(--aui-divider)] p-3`,children:[(0,W.jsx)(a.Input,{type:`search`,value:``,placeholder:`Search rows...`,className:`max-w-xs`,readOnly:!0}),(0,W.jsxs)(`div`,{className:`flex gap-2`,children:[(0,W.jsxs)(t.Button,{variant:`outline`,size:`sm`,children:[(0,W.jsx)(U.FilterIcon,{"data-icon":`inline-start`}),`Filters`]}),(0,W.jsx)(t.Button,{size:`sm`,children:`Create`})]})]}),(0,W.jsxs)(`div`,{className:`grid grid-cols-[40px_1fr_120px_72px] border-b border-[color:var(--aui-divider)] px-3 py-2 text-xs font-semibold uppercase tracking-[0.18em] text-[color:var(--aui-page-muted)]`,children:[(0,W.jsx)(`span`,{children:(0,W.jsx)(`input`,{type:`checkbox`,"aria-label":`Select rows`})}),(0,W.jsx)(`span`,{children:`Name`}),(0,W.jsx)(`span`,{children:`Status`}),(0,W.jsx)(`span`,{children:`Actions`})]}),[`Azamat UI`,`Registry`,`Dashboard`].map((e,n)=>(0,W.jsxs)(`div`,{className:`grid grid-cols-[40px_1fr_120px_72px] items-center border-b border-[color:var(--aui-divider)] px-3 py-3 last:border-b-0`,children:[(0,W.jsx)(`span`,{children:(0,W.jsx)(`input`,{type:`checkbox`,"aria-label":`Select ${e}`,defaultChecked:n===0})}),(0,W.jsx)(`span`,{className:`font-medium text-[color:var(--aui-page-foreground)]`,children:e}),(0,W.jsx)(`span`,{children:(0,W.jsx)(K,{tone:n===2?`warning`:`success`,children:n===2?`Review`:`Live`})}),(0,W.jsx)(`span`,{children:(0,W.jsx)(t.Button,{variant:`ghost`,size:`icon-sm`,"aria-label":`Row actions`,children:(0,W.jsx)(U.MoreHorizontalIcon,{})})})]},e)),(0,W.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-3 border-t border-[color:var(--aui-divider)] p-3 text-sm text-[color:var(--aui-page-muted)]`,children:[(0,W.jsxs)(`span`,{children:[{"data-table-pagination":`Pagination footer`,"data-table-toolbar":`Search and filter toolbar`,"data-table-column-visibility-menu":`Column visibility`,"data-table-select-column":`Row selection`,"data-table-sortable-header":`Sortable header`,"data-table-row-actions":`Row actions`,"data-table-actions-column":`Actions column`,"data-table-bulk-actions":`Bulk action bar`,"data-table-view-presets":`Saved view presets`}[e]??`DataTable part`,` preview`]}),(0,W.jsx)(f.Pagination,{page:1,pageCount:4,onPageChange:()=>void 0,showEdges:!1})]})]})}function re(){return(0,W.jsx)(F.Calendar,{value:`2026-06-18`,defaultMonth:`2026-06-01`,onValueChange:()=>void 0})}function ie({slug:e}){return e===`file-dropzone`?(0,W.jsx)(L.FileDropzone,{label:`Drop contract files`,description:`PDF, PNG or CSV up to 10MB.`}):e===`file-upload`?(0,W.jsx)(I.FileUpload,{dropzoneLabel:`Upload documents`,dropzoneDescription:`Drag files here or choose from your device.`,buttonLabel:`Choose files`,helperText:`Supports PDF, CSV and images.`}):(0,W.jsxs)(`div`,{className:`grid gap-4 md:grid-cols-[160px_1fr] md:items-center`,children:[(0,W.jsx)(`div`,{className:`flex aspect-square items-center justify-center rounded-2xl border border-dashed border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)]`,children:(0,W.jsx)(U.UploadCloudIcon,{className:`size-8 text-[color:var(--aui-page-muted)]`})}),(0,W.jsx)(L.FileDropzone,{label:`Upload product image`,description:`Shows the image-upload flow without custom CSS.`,accept:`image/*`})]})}function ae({slug:e}){let t=[{id:`profile`,title:`Profile`,description:`Account details`,completed:!0},{id:`billing`,title:`Billing`,description:`Payment setup`},{id:`review`,title:`Review`,description:`Confirm data`}];return e===`stepper`?(0,W.jsx)(R.Stepper,{steps:t,currentStep:`billing`,onStepChange:()=>void 0}):(0,W.jsx)(ee.Wizard,{steps:t,currentStep:`billing`,onNext:()=>void 0,onPrevious:()=>void 0,onFinish:()=>void 0,children:(0,W.jsxs)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:[(0,W.jsx)(`p`,{className:`font-medium text-[color:var(--aui-page-foreground)]`,children:`Billing setup`}),(0,W.jsx)(`p`,{className:`mt-1 text-sm text-[color:var(--aui-page-muted)]`,children:`Wizard combines steps, content and footer controls.`})]})})}function oe({slug:e}){return e===`resource-detail-page`?(0,W.jsx)(B.ResourceDetailPage,{title:`Customer profile`,description:`ResourceDetailPage organizes detail screens.`,actions:(0,W.jsx)(t.Button,{size:`sm`,children:`Edit`}),children:(0,W.jsx)(V.ResourcePageSection,{title:`Account`,children:(0,W.jsx)(T.DescriptionList,{items:[{key:`plan`,label:`Plan`,value:`Scale`},{key:`owner`,label:`Owner`,value:`Design team`}]})})}):(0,W.jsx)(V.ResourcePage,{title:`Customers`,description:`ResourcePage combines header, stats, filters and sections.`,actions:(0,W.jsx)(t.Button,{size:`sm`,children:`New customer`}),stats:(0,W.jsxs)(`div`,{className:`grid gap-3 sm:grid-cols-2`,children:[(0,W.jsx)(N.StatCard,{title:`Active`,value:`2,418`,trend:{value:`+8%`,tone:`success`}}),(0,W.jsx)(N.StatCard,{title:`Health`,value:`94%`,trend:{value:`Stable`,tone:`default`}})]}),filters:(0,W.jsx)(m.FilterBar,{search:(0,W.jsx)(a.Input,{type:`search`,value:``,placeholder:`Search...`,readOnly:!0}),activeCount:1}),children:(0,W.jsx)(V.ResourcePageSection,{title:`Recent activity`,children:(0,W.jsx)(j.Timeline,{items:[{key:`a`,title:`Customer added`,description:`Acme workspace`,tone:`success`},{key:`b`,title:`Plan updated`,description:`Scale plan enabled`,tone:`info`}]})})})}exports.renderShowcasePreview=G;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../_virtual/_rolldown/runtime.cjs"),t=require("../components/ui/button/index.cjs"),n=require("../components/actions/action-menu.cjs"),r=require("../components/actions/button-group.cjs"),i=require("../components/inputs/password-input.cjs"),a=require("../components/ui/input/index.cjs"),o=require("../components/ui/badge/index.cjs"),s=require("../components/actions/quick-action-grid.cjs"),c=require("../components/layout/section-header.cjs"),l=require("../components/navigation/nav-tabs.cjs"),u=require("../components/navigation/page-tabs.cjs"),d=require("../components/navigation/pagination.cjs"),f=require("../components/navigation/stepper-tabs.cjs"),p=require("../components/filters/filter-bar.cjs"),m=require("../components/overlay/alert-dialog.cjs"),h=require("../components/overlay/dialog-actions.cjs"),g=require("../components/overlay/drawer.cjs"),_=require("../components/inputs/color-input.cjs"),v=require("../components/inputs/otp-input.cjs"),y=require("../components/inputs/rating.cjs"),b=require("../components/inputs/slider.cjs"),x=require("../components/inputs/tag-input.cjs"),S=require("../components/feedback/alert.cjs"),C=require("../components/feedback/page-state.cjs"),w=require("../components/display/description-list.cjs"),T=require("../components/display/list.cjs"),E=require("../components/display/progress.cjs"),D=require("../components/display/progress-circle.cjs"),O=require("../components/display/status-dot.cjs"),k=require("../components/display/status-legend.cjs"),A=require("../components/display/timeline.cjs"),j=require("../components/display/user-card.cjs"),M=require("../components/layout/stat-card.cjs"),N=require("../components/command/command-palette.cjs"),P=require("../components/calendar/calendar.cjs"),F=require("../components/upload/file-upload.cjs"),I=require("../components/upload/file-dropzone.cjs"),L=require("../components/wizard/stepper.cjs"),R=require("../components/wizard/wizard.cjs"),ee=require("../components/layout/app-header.cjs"),z=require("../components/patterns/resource-detail-page.cjs"),B=require("../components/patterns/resource-page.cjs");let V=require("react");V=e.__toESM(V,1);let H=require("lucide-react"),U=require("react/jsx-runtime");function W(e,t,n){return e.kind===`inputs`?(0,U.jsx)(K,{slug:e.slug,state:t,setState:n}):e.kind===`form`?(0,U.jsx)(q,{state:t,setState:n}):e.kind===`overlay`?(0,U.jsx)(J,{slug:e.slug}):e.kind===`navigation`?(0,U.jsx)(Y,{slug:e.slug}):e.kind===`feedback`?(0,U.jsx)(X,{slug:e.slug}):e.kind===`display`?(0,U.jsx)(Z,{slug:e.slug}):e.kind===`actions`?(0,U.jsx)(Q,{slug:e.slug,state:t,setState:n}):e.kind===`layout`?(0,U.jsx)($,{slug:e.slug}):e.kind===`data-table`?(0,U.jsx)(te,{slug:e.slug}):e.kind===`calendar`?(0,U.jsx)(ne,{}):e.kind===`upload`?(0,U.jsx)(re,{slug:e.slug}):e.kind===`wizard`?(0,U.jsx)(ie,{slug:e.slug}):e.kind===`patterns`?(0,U.jsx)(ae,{slug:e.slug}):null}function G({tone:e,children:t}){return(0,U.jsx)(o.Badge,{variant:e===`danger`?`destructive`:e===`warning`?`outline`:`secondary`,children:t})}function K({slug:e,state:t,setState:n}){let r=t.textValue,o=e=>n({textValue:e});return e===`search-input`?(0,U.jsx)(a.Input,{type:`search`,value:r,onValueChange:o,resultCount:12,shortcut:`Ctrl K`,placeholder:`Search customers...`}):e===`password-input`?(0,U.jsx)(i.PasswordInput,{value:`secret-token`,onValueChange:o,placeholder:`Password`}):e===`clearable-input`?(0,U.jsx)(a.Input,{value:r,onValueChange:o,placeholder:`Clearable input`,clearable:!0}):e===`slider`?(0,U.jsx)(b.Slider,{label:`Density`,description:`Tune content density.`,defaultValue:64,showValue:!0}):e===`range-slider`?(0,U.jsx)(b.RangeSlider,{label:`Revenue range`,description:`Filter between two values.`,defaultValue:[20,80],showValue:!0}):e===`rating`?(0,U.jsx)(y.Rating,{defaultValue:4,labels:{clear:`Reset`}}):e===`otp-input`?(0,U.jsx)(v.OtpInput,{value:r.replace(/\D/g,``).slice(0,6),onValueChange:o}):e===`color-input`?(0,U.jsx)(_.ColorInput,{defaultValue:`#22c55e`,label:`Accent color`,description:`Theme token preview.`}):e===`tag-input`?(0,U.jsx)(x.TagInput,{defaultValue:[`dashboard`,`beta`,`ops`],placeholder:`Add label`}):(0,U.jsx)(a.Input,{value:r,onChange:e=>n({textValue:e.currentTarget.value}),placeholder:`Unified input`})}function q({state:e,setState:t}){return(0,U.jsxs)(`div`,{className:`grid gap-4 md:grid-cols-2`,children:[(0,U.jsxs)(`label`,{className:`grid gap-2`,children:[(0,U.jsx)(`span`,{className:`text-sm font-medium text-[color:var(--aui-page-foreground)]`,children:`Email address`}),(0,U.jsx)(a.Input,{value:e.textValue,onChange:e=>t({textValue:e.currentTarget.value})}),(0,U.jsx)(`span`,{className:`text-xs text-[color:var(--aui-page-muted)]`,children:`Form wrappers keep label, hint and error spacing consistent.`})]}),(0,U.jsxs)(`label`,{className:`grid gap-2`,children:[(0,U.jsx)(`span`,{className:`text-sm font-medium text-[color:var(--aui-page-foreground)]`,children:`Status`}),(0,U.jsx)(a.Input,{type:`search`,value:`Active customers`,resultCount:7,readOnly:!0}),(0,U.jsx)(`span`,{className:`text-xs text-emerald-500`,children:`Ready to submit`})]})]})}function J({slug:e}){return e===`dialog-actions`?(0,U.jsx)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:(0,U.jsxs)(h.DialogActions,{align:`end`,children:[(0,U.jsx)(h.DialogActionButton,{variant:`ghost`,children:`Cancel`}),(0,U.jsx)(h.DialogActionButton,{variant:`outline`,children:`Save draft`}),(0,U.jsx)(h.DialogActionButton,{children:`Publish`})]})}):e===`alert-dialog`?(0,U.jsx)(m.AlertDialog,{open:!1,title:`Archive invoice?`,description:`This keeps the invoice readable but removes it from active queues.`,children:(0,U.jsx)(t.Button,{variant:`destructive`,children:`Open alert`})}):e===`drawer`?(0,U.jsx)(g.Drawer,{open:!1,trigger:(0,U.jsx)(t.Button,{variant:`outline`,children:`Open drawer`}),title:`Customer details`,description:`Side panel for fast inspection.`,children:(0,U.jsx)(w.DescriptionList,{items:[{key:`plan`,label:`Plan`,value:`Scale`},{key:`owner`,label:`Owner`,value:`Azamat UI`}]})}):(0,U.jsxs)(`div`,{className:`flex flex-wrap items-center justify-end gap-2 rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:[(0,U.jsx)(t.Button,{variant:`ghost`,children:`Cancel`}),(0,U.jsx)(t.Button,{variant:`outline`,children:`Save draft`}),(0,U.jsx)(t.Button,{children:`Publish`})]})}function Y({slug:e}){return e===`pagination`?(0,U.jsx)(d.Pagination,{page:3,pageCount:9,onPageChange:()=>void 0}):e===`page-tabs`?(0,U.jsx)(u.PageTabs,{value:`overview`,variant:`pills`,items:[{value:`overview`,label:`Overview`},{value:`usage`,label:`Usage`},{value:`api`,label:`API`,badge:`3`}]}):e===`stepper-tabs`?(0,U.jsx)(f.StepperTabs,{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`}]}):(0,U.jsx)(l.NavTabs,{value:`overview`,items:[{value:`overview`,label:`Overview`},{value:`usage`,label:`Usage`},{value:`api`,label:`API`}]})}function X({slug:e}){return e===`alert`?(0,U.jsx)(S.Alert,{tone:`warning`,title:`Review needed`,description:`Billing rules changed and one approval is pending.`,action:(0,U.jsx)(t.Button,{size:`sm`,children:`Open`})}):e===`page-state`?(0,U.jsx)(C.PageState,{title:`Workspace connected`,description:`The route is ready to accept live data and team actions.`,tone:`success`,action:(0,U.jsx)(t.Button,{size:`sm`,children:`Continue`})}):(0,U.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,U.jsx)(G,{tone:`success`,children:`Live`}),(0,U.jsx)(G,{tone:`warning`,children:`Needs review`}),(0,U.jsx)(G,{tone:`danger`,children:`Blocked`}),(0,U.jsx)(G,{tone:`info`,children:`Queued`})]})}function Z({slug:e}){return e===`description-list`?(0,U.jsx)(w.DescriptionList,{title:`Invoice details`,description:`Structured facts with responsive columns.`,items:[{key:`id`,label:`Invoice`,value:`#4821`},{key:`amount`,label:`Amount`,value:`$12,420`},{key:`status`,label:`Status`,value:(0,U.jsx)(G,{tone:`success`,children:`Paid`})},{key:`owner`,label:`Owner`,value:`Finance team`}]}):e===`progress`?(0,U.jsx)(E.Progress,{label:`Migration progress`,description:`Production rollout`,value:68,tone:`success`,showValue:!0}):e===`progress-circle`?(0,U.jsx)(D.ProgressCircle,{value:72,label:`Profile completed`}):e===`timeline`?(0,U.jsx)(A.Timeline,{items:[{key:`created`,title:`Created`,description:`Invoice generated`,time:`09:20`,tone:`success`},{key:`review`,title:`Review`,description:`Finance team assigned`,time:`10:05`,tone:`info`},{key:`approve`,title:`Approval`,description:`Waiting for manager`,time:`Now`,tone:`warning`}],pending:!0,pendingLabel:`Paid`}):e===`metric-card`||e===`stat-card`?(0,U.jsx)(M.StatCard,{title:`Revenue`,value:`$84.2k`,description:`Compared with last month`,trend:{value:`+12.4%`,tone:`success`},icon:(0,U.jsx)(H.LayoutDashboardIcon,{})}):e===`status-dot`?(0,U.jsxs)(`div`,{className:`grid gap-3`,children:[(0,U.jsx)(O.StatusDot,{tone:`success`,pulse:!0,label:`API healthy`}),(0,U.jsx)(O.StatusDot,{tone:`warning`,label:`Sync delayed`}),(0,U.jsx)(O.StatusDot,{tone:`danger`,label:`Webhook failed`})]}):e===`delta-badge`?(0,U.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,U.jsx)(o.Badge,{variant:`secondary`,children:`+12.4%`}),(0,U.jsx)(o.Badge,{variant:`outline`,children:`-3.1%`}),(0,U.jsx)(o.Badge,{variant:`destructive`,children:`Risk`})]}):e===`notification-center`?(0,U.jsx)(T.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`}]}):e===`data-list`?(0,U.jsx)(T.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`}]}):e===`status-legend`?(0,U.jsx)(k.StatusLegend,{title:`Delivery states`,description:`Explain what each state means and how often it appears.`,orientation:`grid`,items:[{key:`live`,label:`Live`,description:`Healthy production routes`,tone:`success`,count:18},{key:`review`,label:`Review`,description:`Waiting for QA approval`,tone:`warning`,count:4},{key:`blocked`,label:`Blocked`,description:`Needs engineering action`,tone:`danger`,count:1}]}):e===`trend-card`||e===`comparison-card`?(0,U.jsx)(M.StatCard,{title:e===`trend-card`?`Weekly revenue`:`Current vs previous`,value:`$84.2k`,description:`Compared with last month`,trend:{value:`+12.4%`,tone:`success`},icon:(0,U.jsx)(H.LayoutDashboardIcon,{})}):(0,U.jsx)(j.UserCard,{name:`Azamat Jurayev`,description:`Product designer and maintainer`,meta:`Admin workspace`,actions:(0,U.jsx)(t.Button,{size:`sm`,children:`Invite`})})}function Q({slug:e,state:i,setState:o}){return e===`filter-bar`?(0,U.jsx)(p.FilterBar,{search:(0,U.jsx)(a.Input,{type:`search`,value:i.textValue,onValueChange:e=>o({textValue:e}),placeholder:`Search invoices...`}),onReset:()=>o({textValue:``}),chips:[{key:`status`,label:`Status`,value:`Active`,tone:`success`},{key:`owner`,label:`Owner`,value:`Azamat`,tone:`default`}],onRemoveChip:()=>void 0,filters:(0,U.jsxs)(t.Button,{variant:`outline`,size:`sm`,children:[(0,U.jsx)(H.FilterIcon,{"data-icon":`inline-start`}),`Status`]}),actions:(0,U.jsx)(t.Button,{size:`sm`,children:`Export`})}):e===`command-palette`?(0,U.jsxs)(`div`,{className:`grid gap-3`,children:[(0,U.jsxs)(`div`,{className:`flex items-center gap-2 rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] px-3 py-2`,children:[(0,U.jsx)(H.SearchIcon,{className:`size-4 text-[color:var(--aui-page-muted)]`}),(0,U.jsx)(`span`,{className:`text-sm text-[color:var(--aui-page-muted)]`,children:`Command palette preview: search routes, components and actions.`})]}),(0,U.jsx)(N.CommandPalette,{open:!1,onOpenChange:()=>void 0,groups:[{id:`navigation`,label:`Navigation`,items:[{id:`docs`,label:`Open docs`,icon:(0,U.jsx)(H.SearchIcon,{className:`size-4`})},{id:`components`,label:`Browse components`,icon:(0,U.jsx)(H.LayoutDashboardIcon,{className:`size-4`})}]}]})]}):e===`button-group`?(0,U.jsx)(r.ButtonGroup,{items:[{key:`day`,label:`Day`},{key:`week`,label:`Week`},{key:`month`,label:`Month`}]}):e===`quick-action-grid`?(0,U.jsx)(s.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`}]}):e===`data-table-saved-filters`?(0,U.jsxs)(`div`,{className:`grid gap-3`,children:[(0,U.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,U.jsx)(r.ButtonGroup,{attached:!1,items:[{key:`default`,label:`Default`,variant:`secondary`},{key:`billing`,label:`Billing`},{key:`ops`,label:`Operations`}]})]}):(0,U.jsxs)(`div`,{className:`flex items-center justify-between rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:[(0,U.jsxs)(`div`,{children:[(0,U.jsx)(`p`,{className:`font-medium text-[color:var(--aui-page-foreground)]`,children:`Invoice #4821`}),(0,U.jsx)(`p`,{className:`text-sm text-[color:var(--aui-page-muted)]`,children:`Pending approval`})]}),(0,U.jsx)(n.ActionMenu,{label:`Actions`,actions:[{key:`open`,label:`Open`,icon:(0,U.jsx)(H.ChevronRightIcon,{className:`size-4`})},{key:`download`,label:`Download`,icon:(0,U.jsx)(H.DownloadIcon,{className:`size-4`})},{key:`archive`,label:`Archive`,icon:(0,U.jsx)(H.ArchiveIcon,{className:`size-4`}),destructive:!0}],trigger:(0,U.jsx)(t.Button,{variant:`outline`,size:`icon-sm`,"aria-label":`Open actions`,children:(0,U.jsx)(H.MoreHorizontalIcon,{})})})]})}function $({slug:e}){return e===`app-header`?(0,U.jsx)(ee.AppHeader,{sticky:!1,left:(0,U.jsxs)(U.Fragment,{children:[(0,U.jsx)(H.LayoutDashboardIcon,{className:`size-4`}),(0,U.jsx)(`span`,{className:`font-medium`,children:`Dashboard`})]}),center:(0,U.jsx)(o.Badge,{variant:`secondary`,children:`Preview`}),right:(0,U.jsxs)(U.Fragment,{children:[(0,U.jsx)(t.Button,{variant:`ghost`,size:`icon-sm`,"aria-label":`Notifications`,children:(0,U.jsx)(H.BellIcon,{})}),(0,U.jsx)(t.Button,{size:`sm`,children:`Deploy`})]}),className:`rounded-xl border border-[color:var(--aui-divider)]`}):e===`section-header`?(0,U.jsx)(c.SectionHeader,{eyebrow:`Components`,title:`Production-ready surfaces`,description:`SectionHeader keeps copy, metadata and actions aligned.`,actions:(0,U.jsx)(t.Button,{size:`sm`,children:`Add component`})}):(0,U.jsx)(M.StatCard,{title:`Revenue`,value:`$84.2k`,description:`Compared with last month`,trend:{value:`+12.4%`,tone:`success`},helperText:`StatCard keeps KPI, helper text and trend in one compact tile.`})}function te({slug:e}){return(0,U.jsxs)(`div`,{className:`overflow-hidden rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)]`,children:[(0,U.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-3 border-b border-[color:var(--aui-divider)] p-3`,children:[(0,U.jsx)(a.Input,{type:`search`,value:``,placeholder:`Search rows...`,className:`max-w-xs`,readOnly:!0}),(0,U.jsxs)(`div`,{className:`flex gap-2`,children:[(0,U.jsxs)(t.Button,{variant:`outline`,size:`sm`,children:[(0,U.jsx)(H.FilterIcon,{"data-icon":`inline-start`}),`Filters`]}),(0,U.jsx)(t.Button,{size:`sm`,children:`Create`})]})]}),(0,U.jsxs)(`div`,{className:`grid grid-cols-[40px_1fr_120px_72px] border-b border-[color:var(--aui-divider)] px-3 py-2 text-xs font-semibold uppercase tracking-[0.18em] text-[color:var(--aui-page-muted)]`,children:[(0,U.jsx)(`span`,{children:(0,U.jsx)(`input`,{type:`checkbox`,"aria-label":`Select rows`})}),(0,U.jsx)(`span`,{children:`Name`}),(0,U.jsx)(`span`,{children:`Status`}),(0,U.jsx)(`span`,{children:`Actions`})]}),[`Azamat UI`,`Registry`,`Dashboard`].map((e,n)=>(0,U.jsxs)(`div`,{className:`grid grid-cols-[40px_1fr_120px_72px] items-center border-b border-[color:var(--aui-divider)] px-3 py-3 last:border-b-0`,children:[(0,U.jsx)(`span`,{children:(0,U.jsx)(`input`,{type:`checkbox`,"aria-label":`Select ${e}`,defaultChecked:n===0})}),(0,U.jsx)(`span`,{className:`font-medium text-[color:var(--aui-page-foreground)]`,children:e}),(0,U.jsx)(`span`,{children:(0,U.jsx)(G,{tone:n===2?`warning`:`success`,children:n===2?`Review`:`Live`})}),(0,U.jsx)(`span`,{children:(0,U.jsx)(t.Button,{variant:`ghost`,size:`icon-sm`,"aria-label":`Row actions`,children:(0,U.jsx)(H.MoreHorizontalIcon,{})})})]},e)),(0,U.jsxs)(`div`,{className:`flex flex-wrap items-center justify-between gap-3 border-t border-[color:var(--aui-divider)] p-3 text-sm text-[color:var(--aui-page-muted)]`,children:[(0,U.jsxs)(`span`,{children:[{"data-table-pagination":`Pagination footer`,"data-table-toolbar":`Search and filter toolbar`,"data-table-column-visibility-menu":`Column visibility`,"data-table-select-column":`Row selection`,"data-table-sortable-header":`Sortable header`,"data-table-row-actions":`Row actions`,"data-table-actions-column":`Actions column`,"data-table-bulk-actions":`Bulk action bar`,"data-table-view-presets":`Saved view presets`}[e]??`DataTable part`,` preview`]}),(0,U.jsx)(d.Pagination,{page:1,pageCount:4,onPageChange:()=>void 0,showEdges:!1})]})]})}function ne(){return(0,U.jsx)(P.Calendar,{value:`2026-06-18`,defaultMonth:`2026-06-01`,onValueChange:()=>void 0})}function re({slug:e}){return e===`file-dropzone`?(0,U.jsx)(I.FileDropzone,{label:`Drop contract files`,description:`PDF, PNG or CSV up to 10MB.`}):e===`file-upload`?(0,U.jsx)(F.FileUpload,{dropzoneLabel:`Upload documents`,dropzoneDescription:`Drag files here or choose from your device.`,buttonLabel:`Choose files`,helperText:`Supports PDF, CSV and images.`}):(0,U.jsxs)(`div`,{className:`grid gap-4 md:grid-cols-[160px_1fr] md:items-center`,children:[(0,U.jsx)(`div`,{className:`flex aspect-square items-center justify-center rounded-2xl border border-dashed border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)]`,children:(0,U.jsx)(H.UploadCloudIcon,{className:`size-8 text-[color:var(--aui-page-muted)]`})}),(0,U.jsx)(I.FileDropzone,{label:`Upload product image`,description:`Shows the image-upload flow without custom CSS.`,accept:`image/*`})]})}function ie({slug:e}){let t=[{id:`profile`,title:`Profile`,description:`Account details`,completed:!0},{id:`billing`,title:`Billing`,description:`Payment setup`},{id:`review`,title:`Review`,description:`Confirm data`}];return e===`stepper`?(0,U.jsx)(L.Stepper,{steps:t,currentStep:`billing`,onStepChange:()=>void 0}):(0,U.jsx)(R.Wizard,{steps:t,currentStep:`billing`,onNext:()=>void 0,onPrevious:()=>void 0,onFinish:()=>void 0,children:(0,U.jsxs)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4`,children:[(0,U.jsx)(`p`,{className:`font-medium text-[color:var(--aui-page-foreground)]`,children:`Billing setup`}),(0,U.jsx)(`p`,{className:`mt-1 text-sm text-[color:var(--aui-page-muted)]`,children:`Wizard combines steps, content and footer controls.`})]})})}function ae({slug:e}){return e===`resource-detail-page`?(0,U.jsx)(z.ResourceDetailPage,{title:`Customer profile`,description:`ResourceDetailPage organizes detail screens.`,actions:(0,U.jsx)(t.Button,{size:`sm`,children:`Edit`}),children:(0,U.jsx)(B.ResourcePageSection,{title:`Account`,children:(0,U.jsx)(w.DescriptionList,{items:[{key:`plan`,label:`Plan`,value:`Scale`},{key:`owner`,label:`Owner`,value:`Design team`}]})})}):(0,U.jsx)(B.ResourcePage,{title:`Customers`,description:`ResourcePage combines header, stats, filters and sections.`,actions:(0,U.jsx)(t.Button,{size:`sm`,children:`New customer`}),stats:(0,U.jsxs)(`div`,{className:`grid gap-3 sm:grid-cols-2`,children:[(0,U.jsx)(M.StatCard,{title:`Active`,value:`2,418`,trend:{value:`+8%`,tone:`success`}}),(0,U.jsx)(M.StatCard,{title:`Health`,value:`94%`,trend:{value:`Stable`,tone:`default`}})]}),filters:(0,U.jsx)(p.FilterBar,{search:(0,U.jsx)(a.Input,{type:`search`,value:``,placeholder:`Search...`,readOnly:!0}),activeCount:1}),children:(0,U.jsx)(B.ResourcePageSection,{title:`Recent activity`,children:(0,U.jsx)(A.Timeline,{items:[{key:`a`,title:`Customer added`,description:`Acme workspace`,tone:`success`},{key:`b`,title:`Plan updated`,description:`Scale plan enabled`,tone:`info`}]})})})}exports.renderShowcasePreview=W;

package/dist/showcase/render-registry-preview.js

@@ -6,22 +6,21 @@ import { Input as i } from "../components/ui/input/index.js";
 import { Badge as a } from "../components/ui/badge/index.js";
 import { QuickActionGrid as o } from "../components/actions/quick-action-grid.js";
 import { SectionHeader as s } from "../components/layout/section-header.js";
-import { AnchorNav as ee } from "../components/navigation/anchor-nav.js";
 import { NavTabs as c } from "../components/navigation/nav-tabs.js";
-import { PageTabs as l } from "../components/navigation/page-tabs.js";
-import { Pagination as u } from "../components/navigation/pagination.js";
-import { StepperTabs as d } from "../components/navigation/stepper-tabs.js";
-import { FilterBar as f } from "../components/filters/filter-bar.js";
-import { AlertDialog as p } from "../components/overlay/alert-dialog.js";
-import { DialogActionButton as m, DialogActions as h } from "../components/overlay/dialog-actions.js";
-import { Drawer as g } from "../components/overlay/drawer.js";
-import { ColorInput as _ } from "../components/inputs/color-input.js";
-import { OtpInput as v } from "../components/inputs/otp-input.js";
-import { Rating as y } from "../components/inputs/rating.js";
-import { RangeSlider as b, Slider as x } from "../components/inputs/slider.js";
-import { TagInput as te } from "../components/inputs/tag-input.js";
-import { Alert as ne } from "../components/feedback/alert.js";
-import { PageState as re } from "../components/feedback/page-state.js";
+import { PageTabs as ee } from "../components/navigation/page-tabs.js";
+import { Pagination as l } from "../components/navigation/pagination.js";
+import { StepperTabs as te } from "../components/navigation/stepper-tabs.js";
+import { FilterBar as u } from "../components/filters/filter-bar.js";
+import { AlertDialog as d } from "../components/overlay/alert-dialog.js";
+import { DialogActionButton as f, DialogActions as p } from "../components/overlay/dialog-actions.js";
+import { Drawer as m } from "../components/overlay/drawer.js";
+import { ColorInput as h } from "../components/inputs/color-input.js";
+import { OtpInput as g } from "../components/inputs/otp-input.js";
+import { Rating as _ } from "../components/inputs/rating.js";
+import { RangeSlider as v, Slider as y } from "../components/inputs/slider.js";
+import { TagInput as b } from "../components/inputs/tag-input.js";
+import { Alert as x } from "../components/feedback/alert.js";
+import { PageState as ne } from "../components/feedback/page-state.js";
 import { DescriptionList as S } from "../components/display/description-list.js";
 import { List as C } from "../components/display/list.js";
 import { Progress as w } from "../components/display/progress.js";
@@ -41,22 +40,22 @@ import { AppHeader as L } from "../components/layout/app-header.js";
 import { ResourceDetailPage as R } from "../components/patterns/resource-detail-page.js";
 import { ResourcePage as z, ResourcePageSection as B } from "../components/patterns/resource-page.js";
 import "react";
-import { ArchiveIcon as V, BellIcon as H, ChevronRightIcon as ie, DownloadIcon as U, FilterIcon as W, LayoutDashboardIcon as G, MoreHorizontalIcon as K, SearchIcon as q, UploadCloudIcon as J } from "lucide-react";
+import { ArchiveIcon as V, BellIcon as H, ChevronRightIcon as U, DownloadIcon as re, FilterIcon as W, LayoutDashboardIcon as G, MoreHorizontalIcon as K, SearchIcon as q, UploadCloudIcon as J } from "lucide-react";
 import { Fragment as Y, jsx as X, jsxs as Z } from "react/jsx-runtime";
 //#region src/showcase/render-registry-preview.tsx
-function ae(e, t, n) {
-	return e.kind === "inputs" ? /* @__PURE__ */ X(oe, {
+function ie(e, t, n) {
+	return e.kind === "inputs" ? /* @__PURE__ */ X(ae, {
 		slug: e.slug,
 		state: t,
 		setState: n
-	}) : e.kind === "form" ? /* @__PURE__ */ X(se, {
+	}) : e.kind === "form" ? /* @__PURE__ */ X(oe, {
 		state: t,
 		setState: n
-	}) : e.kind === "overlay" ? /* @__PURE__ */ X(ce, { slug: e.slug }) : e.kind === "navigation" ? /* @__PURE__ */ X(le, { slug: e.slug }) : e.kind === "feedback" ? /* @__PURE__ */ X(ue, { slug: e.slug }) : e.kind === "display" ? /* @__PURE__ */ X(de, { slug: e.slug }) : e.kind === "actions" ? /* @__PURE__ */ X(fe, {
+	}) : e.kind === "overlay" ? /* @__PURE__ */ X($, { slug: e.slug }) : e.kind === "navigation" ? /* @__PURE__ */ X(se, { slug: e.slug }) : e.kind === "feedback" ? /* @__PURE__ */ X(ce, { slug: e.slug }) : e.kind === "display" ? /* @__PURE__ */ X(le, { slug: e.slug }) : e.kind === "actions" ? /* @__PURE__ */ X(ue, {
 		slug: e.slug,
 		state: t,
 		setState: n
-	}) : e.kind === "layout" ? /* @__PURE__ */ X(pe, { slug: e.slug }) : e.kind === "data-table" ? /* @__PURE__ */ X($, { slug: e.slug }) : e.kind === "calendar" ? /* @__PURE__ */ X(me, {}) : e.kind === "upload" ? /* @__PURE__ */ X(he, { slug: e.slug }) : e.kind === "wizard" ? /* @__PURE__ */ X(ge, { slug: e.slug }) : e.kind === "patterns" ? /* @__PURE__ */ X(_e, { slug: e.slug }) : null;
+	}) : e.kind === "layout" ? /* @__PURE__ */ X(de, { slug: e.slug }) : e.kind === "data-table" ? /* @__PURE__ */ X(fe, { slug: e.slug }) : e.kind === "calendar" ? /* @__PURE__ */ X(pe, {}) : e.kind === "upload" ? /* @__PURE__ */ X(me, { slug: e.slug }) : e.kind === "wizard" ? /* @__PURE__ */ X(he, { slug: e.slug }) : e.kind === "patterns" ? /* @__PURE__ */ X(ge, { slug: e.slug }) : null;
 }
 function Q({ tone: e, children: t }) {
 	return /* @__PURE__ */ X(a, {
@@ -64,7 +63,7 @@ function Q({ tone: e, children: t }) {
 		children: t
 	});
 }
-function oe({ slug: e, state: t, setState: n }) {
+function ae({ slug: e, state: t, setState: n }) {
 	let a = t.textValue, o = (e) => n({ textValue: e });
 	return e === "search-input" ? /* @__PURE__ */ X(i, {
 		type: "search",
@@ -82,27 +81,27 @@ function oe({ slug: e, state: t, setState: n }) {
 		onValueChange: o,
 		placeholder: "Clearable input",
 		clearable: !0
-	}) : e === "slider" ? /* @__PURE__ */ X(x, {
+	}) : e === "slider" ? /* @__PURE__ */ X(y, {
 		label: "Density",
 		description: "Tune content density.",
 		defaultValue: 64,
 		showValue: !0
-	}) : e === "range-slider" ? /* @__PURE__ */ X(b, {
+	}) : e === "range-slider" ? /* @__PURE__ */ X(v, {
 		label: "Revenue range",
 		description: "Filter between two values.",
 		defaultValue: [20, 80],
 		showValue: !0
-	}) : e === "rating" ? /* @__PURE__ */ X(y, {
+	}) : e === "rating" ? /* @__PURE__ */ X(_, {
 		defaultValue: 4,
 		labels: { clear: "Reset" }
-	}) : e === "otp-input" ? /* @__PURE__ */ X(v, {
+	}) : e === "otp-input" ? /* @__PURE__ */ X(g, {
 		value: a.replace(/\D/g, "").slice(0, 6),
 		onValueChange: o
-	}) : e === "color-input" ? /* @__PURE__ */ X(_, {
+	}) : e === "color-input" ? /* @__PURE__ */ X(h, {
 		defaultValue: "#22c55e",
 		label: "Accent color",
 		description: "Theme token preview."
-	}) : e === "tag-input" ? /* @__PURE__ */ X(te, {
+	}) : e === "tag-input" ? /* @__PURE__ */ X(b, {
 		defaultValue: [
 			"dashboard",
 			"beta",
@@ -115,7 +114,7 @@ function oe({ slug: e, state: t, setState: n }) {
 		placeholder: "Unified input"
 	});
 }
-function se({ state: e, setState: t }) {
+function oe({ state: e, setState: t }) {
 	return /* @__PURE__ */ Z("div", {
 		className: "grid gap-4 md:grid-cols-2",
 		children: [/* @__PURE__ */ Z("label", {
@@ -155,24 +154,24 @@ function se({ state: e, setState: t }) {
 		})]
 	});
 }
-function ce({ slug: t }) {
+function $({ slug: t }) {
 	return t === "dialog-actions" ? /* @__PURE__ */ X("div", {
 		className: "rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4",
-		children: /* @__PURE__ */ Z(h, {
+		children: /* @__PURE__ */ Z(p, {
 			align: "end",
 			children: [
-				/* @__PURE__ */ X(m, {
+				/* @__PURE__ */ X(f, {
 					variant: "ghost",
 					children: "Cancel"
 				}),
-				/* @__PURE__ */ X(m, {
+				/* @__PURE__ */ X(f, {
 					variant: "outline",
 					children: "Save draft"
 				}),
-				/* @__PURE__ */ X(m, { children: "Publish" })
+				/* @__PURE__ */ X(f, { children: "Publish" })
 			]
 		})
-	}) : t === "alert-dialog" ? /* @__PURE__ */ X(p, {
+	}) : t === "alert-dialog" ? /* @__PURE__ */ X(d, {
 		open: !1,
 		title: "Archive invoice?",
 		description: "This keeps the invoice readable but removes it from active queues.",
@@ -180,7 +179,7 @@ function ce({ slug: t }) {
 			variant: "destructive",
 			children: "Open alert"
 		})
-	}) : t === "drawer" ? /* @__PURE__ */ X(g, {
+	}) : t === "drawer" ? /* @__PURE__ */ X(m, {
 		open: !1,
 		trigger: /* @__PURE__ */ X(e, {
 			variant: "outline",
@@ -212,33 +211,12 @@ function ce({ slug: t }) {
 		]
 	});
 }
-function le({ slug: e }) {
-	return e === "pagination" ? /* @__PURE__ */ X(u, {
+function se({ slug: e }) {
+	return e === "pagination" ? /* @__PURE__ */ X(l, {
 		page: 3,
 		pageCount: 9,
 		onPageChange: () => void 0
-	}) : e === "anchor-nav" ? /* @__PURE__ */ X(ee, {
-		orientation: "horizontal",
-		title: "Sections",
-		items: [
-			{
-				key: "overview",
-				label: "Overview",
-				href: "#overview",
-				active: !0
-			},
-			{
-				key: "usage",
-				label: "Usage",
-				href: "#usage"
-			},
-			{
-				key: "api",
-				label: "API",
-				href: "#api"
-			}
-		]
-	}) : e === "page-tabs" ? /* @__PURE__ */ X(l, {
+	}) : e === "page-tabs" ? /* @__PURE__ */ X(ee, {
 		value: "overview",
 		variant: "pills",
 		items: [
@@ -256,7 +234,7 @@ function le({ slug: e }) {
 				badge: "3"
 			}
 		]
-	}) : e === "stepper-tabs" ? /* @__PURE__ */ X(d, {
+	}) : e === "stepper-tabs" ? /* @__PURE__ */ X(te, {
 		value: "billing",
 		items: [
 			{
@@ -294,8 +272,8 @@ function le({ slug: e }) {
 		]
 	});
 }
-function ue({ slug: t }) {
-	return t === "alert" ? /* @__PURE__ */ X(ne, {
+function ce({ slug: t }) {
+	return t === "alert" ? /* @__PURE__ */ X(x, {
 		tone: "warning",
 		title: "Review needed",
 		description: "Billing rules changed and one approval is pending.",
@@ -303,7 +281,7 @@ function ue({ slug: t }) {
 			size: "sm",
 			children: "Open"
 		})
-	}) : t === "page-state" ? /* @__PURE__ */ X(re, {
+	}) : t === "page-state" ? /* @__PURE__ */ X(ne, {
 		title: "Workspace connected",
 		description: "The route is ready to accept live data and team actions.",
 		tone: "success",
@@ -333,7 +311,7 @@ function ue({ slug: t }) {
 		]
 	});
 }
-function de({ slug: t }) {
+function le({ slug: t }) {
 	return t === "description-list" ? /* @__PURE__ */ X(S, {
 		title: "Invoice details",
 		description: "Structured facts with responsive columns.",
@@ -523,8 +501,8 @@ function de({ slug: t }) {
 		})
 	});
 }
-function fe({ slug: r, state: a, setState: s }) {
-	return r === "filter-bar" ? /* @__PURE__ */ X(f, {
+function ue({ slug: r, state: a, setState: s }) {
+	return r === "filter-bar" ? /* @__PURE__ */ X(u, {
 		search: /* @__PURE__ */ X(i, {
 			type: "search",
 			value: a.textValue,
@@ -615,7 +593,7 @@ function fe({ slug: r, state: a, setState: s }) {
 		]
 	}) : r === "data-table-saved-filters" ? /* @__PURE__ */ Z("div", {
 		className: "grid gap-3",
-		children: [/* @__PURE__ */ X(f, {
+		children: [/* @__PURE__ */ X(u, {
 			chips: [
 				{
 					key: "status",
@@ -670,12 +648,12 @@ function fe({ slug: r, state: a, setState: s }) {
 				{
 					key: "open",
 					label: "Open",
-					icon: /* @__PURE__ */ X(ie, { className: "size-4" })
+					icon: /* @__PURE__ */ X(U, { className: "size-4" })
 				},
 				{
 					key: "download",
 					label: "Download",
-					icon: /* @__PURE__ */ X(U, { className: "size-4" })
+					icon: /* @__PURE__ */ X(re, { className: "size-4" })
 				},
 				{
 					key: "archive",
@@ -693,7 +671,7 @@ function fe({ slug: r, state: a, setState: s }) {
 		})]
 	});
 }
-function pe({ slug: t }) {
+function de({ slug: t }) {
 	return t === "app-header" ? /* @__PURE__ */ X(L, {
 		sticky: !1,
 		left: /* @__PURE__ */ Z(Y, { children: [/* @__PURE__ */ X(G, { className: "size-4" }), /* @__PURE__ */ X("span", {
@@ -733,7 +711,7 @@ function pe({ slug: t }) {
 		helperText: "StatCard keeps KPI, helper text and trend in one compact tile."
 	});
 }
-function $({ slug: t }) {
+function fe({ slug: t }) {
 	return /* @__PURE__ */ Z("div", {
 		className: "overflow-hidden rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)]",
 		children: [
@@ -809,7 +787,7 @@ function $({ slug: t }) {
 					"data-table-actions-column": "Actions column",
 					"data-table-bulk-actions": "Bulk action bar",
 					"data-table-view-presets": "Saved view presets"
-				}[t] ?? "DataTable part", " preview"] }), /* @__PURE__ */ X(u, {
+				}[t] ?? "DataTable part", " preview"] }), /* @__PURE__ */ X(l, {
 					page: 1,
 					pageCount: 4,
 					onPageChange: () => void 0,
@@ -819,14 +797,14 @@ function $({ slug: t }) {
 		]
 	});
 }
-function me() {
+function pe() {
 	return /* @__PURE__ */ X(M, {
 		value: "2026-06-18",
 		defaultMonth: "2026-06-01",
 		onValueChange: () => void 0
 	});
 }
-function he({ slug: e }) {
+function me({ slug: e }) {
 	return e === "file-dropzone" ? /* @__PURE__ */ X(P, {
 		label: "Drop contract files",
 		description: "PDF, PNG or CSV up to 10MB."
@@ -847,7 +825,7 @@ function he({ slug: e }) {
 		})]
 	});
 }
-function ge({ slug: e }) {
+function he({ slug: e }) {
 	let t = [
 		{
 			id: "profile",
@@ -888,7 +866,7 @@ function ge({ slug: e }) {
 		})
 	});
 }
-function _e({ slug: t }) {
+function ge({ slug: t }) {
 	return t === "resource-detail-page" ? /* @__PURE__ */ X(R, {
 		title: "Customer profile",
 		description: "ResourceDetailPage organizes detail screens.",
@@ -933,7 +911,7 @@ function _e({ slug: t }) {
 				}
 			})]
 		}),
-		filters: /* @__PURE__ */ X(f, {
+		filters: /* @__PURE__ */ X(u, {
 			search: /* @__PURE__ */ X(i, {
 				type: "search",
 				value: "",
@@ -959,4 +937,4 @@ function _e({ slug: t }) {
 	});
 }
 //#endregion
-export { ae as renderShowcasePreview };
+export { ie as renderShowcasePreview };