npm - tembro - Versions diffs - 3.1.5 → 3.1.7 - Mend

tembro 3.1.5 → 3.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (120) hide show

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

@@ -18,7 +18,7 @@ export function Demo() {
 }`,"clearable-input":`import { Input } from "tembro"
 export function Demo() {
-  return <Input defaultValue="Azamat UI" placeholder="Search customer" clearable />
+  return <Input defaultValue="Tembro" placeholder="Search customer" clearable />
 }`,"tag-input":`import { TagInput } from "tembro"
 export function Demo() {

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

@@ -2,7 +2,7 @@
 var e = {
 	"search-input": "import { Input } from \"tembro\"\n\nexport function Demo() {\n  return (\n    <Input\n      type=\"search\"\n      value=\"invoice\"\n      onValueChange={(value) => console.log(value)}\n      placeholder=\"Search invoices...\"\n      resultCount={12}\n      shortcut=\"Ctrl K\"\n    />\n  )\n}",
 	"password-input": "import { PasswordInput } from \"tembro\"\n\nexport function Demo() {\n  return <PasswordInput placeholder=\"Enter secure token\" autoComplete=\"current-password\" />\n}",
-	"clearable-input": "import { Input } from \"tembro\"\n\nexport function Demo() {\n  return <Input defaultValue=\"Azamat UI\" placeholder=\"Search customer\" clearable />\n}",
+	"clearable-input": "import { Input } from \"tembro\"\n\nexport function Demo() {\n  return <Input defaultValue=\"Tembro\" placeholder=\"Search customer\" clearable />\n}",
 	"tag-input": "import { TagInput } from \"tembro\"\n\nexport function Demo() {\n  return <TagInput defaultValue={[\"dashboard\", \"billing\"]} placeholder=\"Add tag\" />\n}"
 };
 //#endregion

package/dist/src/showcase/fallback.cjs CHANGED Viewed

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