tembro 3.1.1 → 3.1.5

package/dist/src/showcase/premium/app-shell/showcase.js

@@ -1,208 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import { Sidebar as n } from "../../../components/layout/app-sidebar.js";
-import { Breadcrumbs as r } from "../../../components/layout/breadcrumbs.js";
-import { PageContainer as i } from "../../../components/layout/page-container.js";
-import { SidebarNav as a } from "../../../components/layout/sidebar-nav.js";
-import { MetricGrid as o } from "../../../components/display/metric-grid.js";
-import { InfoCard as s } from "../../../components/display/info-card.js";
-import { AppHeader as c } from "../../../components/layout/app-header.js";
-import { PageHeader as l } from "../../../components/layout/page-header.js";
-import * as u from "react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-//#region src/showcase/premium/app-shell/showcase.tsx
-var p = [
-	{
-		key: "overview",
-		label: "Overview",
-		href: "#overview"
-	},
-	{
-		key: "products",
-		label: "Products",
-		href: "#products"
-	},
-	{
-		key: "billing",
-		label: "Billing",
-		href: "#billing"
-	},
-	{
-		key: "settings",
-		label: "Settings",
-		href: "#settings"
-	}
-], m = [
-	{
-		key: "mrr",
-		label: "MRR",
-		value: "$64k",
-		description: "11% vs last week",
-		tone: "success"
-	},
-	{
-		key: "users",
-		label: "Users",
-		value: "1,020",
-		description: "3% churn risk",
-		tone: "warning"
-	},
-	{
-		key: "tasks",
-		label: "Tasks",
-		value: "58",
-		description: "5 in progress",
-		tone: "info"
-	},
-	{
-		key: "response",
-		label: "Latency",
-		value: "1.2s",
-		description: "P95 API response",
-		tone: "default"
-	}
-];
-function h({ mode: h }) {
-	let [g, _] = u.useState("overview"), [v, y] = u.useState(!1), b = p.map((e) => ({
-		...e,
-		active: e.key === g,
-		onSelect: () => _(e.key)
-	})), x = p.find((e) => e.key === g)?.label ?? "Overview";
-	return /* @__PURE__ */ f("div", {
-		className: "space-y-5",
-		children: [
-			/* @__PURE__ */ d("div", {
-				className: "rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5",
-				children: /* @__PURE__ */ f("div", {
-					className: "flex flex-col gap-4 xl:flex-row xl:items-center xl:justify-between",
-					children: [/* @__PURE__ */ f("div", {
-						className: "max-w-xl",
-						children: [
-							/* @__PURE__ */ d("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted",
-								children: "Application frame"
-							}),
-							/* @__PURE__ */ d("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Reusable shell preview"
-							}),
-							/* @__PURE__ */ d("p", {
-								className: "mt-3 text-sm leading-6 aui-text-muted",
-								children: "Header, sidebar, main content and aside should feel like one predictable route frame."
-							})
-						]
-					}), /* @__PURE__ */ f("div", {
-						className: "flex flex-wrap gap-2",
-						children: [
-							/* @__PURE__ */ d(t, {
-								variant: "outline",
-								className: "rounded-full",
-								children: "Header"
-							}),
-							/* @__PURE__ */ d(t, {
-								variant: "outline",
-								className: "rounded-full",
-								children: "Sidebar"
-							}),
-							/* @__PURE__ */ d(t, {
-								variant: "outline",
-								className: "rounded-full",
-								children: "Aside"
-							})
-						]
-					})]
-				})
-			}),
-			h === "playground" ? /* @__PURE__ */ d("div", {
-				className: "flex flex-wrap gap-3",
-				children: /* @__PURE__ */ d(e, {
-					size: "sm",
-					variant: v ? "outline" : "default",
-					onClick: () => y((e) => !e),
-					children: v ? "Expand sidebar" : "Collapse sidebar"
-				})
-			}) : null,
-			/* @__PURE__ */ f("div", {
-				className: "overflow-hidden rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)]",
-				children: [/* @__PURE__ */ d(c, {
-					className: "border-b border-[color:var(--aui-divider)] px-4 py-3",
-					left: "Product shell",
-					right: /* @__PURE__ */ d(e, {
-						size: "sm",
-						variant: "outline",
-						children: "Profile"
-					})
-				}), /* @__PURE__ */ f("div", {
-					className: "grid min-h-[420px] lg:grid-cols-[250px_minmax(0,1fr)_260px]",
-					children: [
-						/* @__PURE__ */ d(n, {
-							responsive: !0,
-							mobileTitle: "Workspace navigation",
-							mobileDescription: "Open the shell menu first, then move through app routes without squeezing the main content.",
-							header: /* @__PURE__ */ d("div", {
-								className: "px-3 py-2 text-sm font-semibold",
-								children: "AZA Studio"
-							}),
-							footer: /* @__PURE__ */ d("div", {
-								className: "aui-text-muted px-3 py-2 text-xs",
-								children: "Shell footer"
-							}),
-							className: v ? "lg:w-[92px]" : "",
-							collapsed: v,
-							children: /* @__PURE__ */ d(a, { items: b })
-						}),
-						/* @__PURE__ */ d("div", {
-							className: "min-w-0 border-x border-[color:var(--aui-divider)] p-4",
-							children: /* @__PURE__ */ f(i, {
-								size: "lg",
-								children: [/* @__PURE__ */ d(l, {
-									eyebrow: "Workspace",
-									title: x,
-									description: "Use shared shell primitives to keep regions stable across routes.",
-									breadcrumbs: /* @__PURE__ */ d(r, { items: [
-										{
-											key: "home",
-											label: "Home",
-											href: "/"
-										},
-										{
-											key: "components",
-											label: "Components",
-											href: "/components"
-										},
-										{
-											key: "active",
-											label: x,
-											current: !0
-										}
-									] }),
-									actions: /* @__PURE__ */ d(e, {
-										size: "sm",
-										children: "Manage"
-									})
-								}), /* @__PURE__ */ d("div", {
-									className: "mt-4",
-									children: /* @__PURE__ */ d(o, {
-										items: m,
-										columns: 2,
-										compact: !0
-									})
-								})]
-							})
-						}),
-						/* @__PURE__ */ d("aside", {
-							className: "hidden p-4 lg:block",
-							children: /* @__PURE__ */ d(s, {
-								title: "Quick actions",
-								description: "Support content can live in the aside.",
-								compact: !0
-							})
-						})
-					]
-				})]
-			})
-		]
-	});
-}
-//#endregion
-export { h as AppShellShowcase };

package/dist/src/showcase/premium/clearable-input/index.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./showcase.cjs"),t=require("./mock.cjs");exports.ClearableInputShowcase=e.ClearableInputShowcase,exports.clearableInputMock=t.clearableInputMock;

package/dist/src/showcase/premium/clearable-input/index.js

@@ -1,3 +0,0 @@
-import { ClearableInputShowcase as e } from "./showcase.js";
-import { clearableInputMock as t } from "./mock.js";
-export { e as ClearableInputShowcase, t as clearableInputMock };

package/dist/src/showcase/premium/clearable-input/mock.cjs

@@ -1,16 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import * as React from "react"
-import { Input } from "tembro"
-
-export function Example() {
-  const [value, setValue] = React.useState("workspace token")
-
-  return (
-    <Input
-      value={value}
-      onValueChange={setValue}
-      placeholder="Filter or paste value..."
-      clearable
-      clearOnEscape
-    />
-  )
-}`,cliCommand:`npx tembro add input`,highlights:[`Inline clear action`,`Escape-to-clear support`,`Focus restore after clearing`,`Small but high-frequency utility input`],scenarios:[{title:`Filter reset`,description:`Let users clear a short filter without hunting for an extra reset button.`},{title:`Token paste`,description:`Remove a pasted value quickly and stay focused in the same field.`},{title:`Toolbar utility`,description:`Use in dense admin bars where compact cleanup matters.`}],capabilityNotes:["Prefer `Input clearable` for short-lived values like filters and quick entry.",`Escape clear is useful only when the input is frequently changed.`,`Keep the field visually quiet so the clear action feels secondary.`]};exports.clearableInputMock=e;

package/dist/src/showcase/premium/clearable-input/mock.js

@@ -1,32 +0,0 @@
-//#region src/showcase/premium/clearable-input/mock.ts
-var e = {
-	code: "import * as React from \"react\"\nimport { Input } from \"tembro\"\n\nexport function Example() {\n  const [value, setValue] = React.useState(\"workspace token\")\n\n  return (\n    <Input\n      value={value}\n      onValueChange={setValue}\n      placeholder=\"Filter or paste value...\"\n      clearable\n      clearOnEscape\n    />\n  )\n}",
-	cliCommand: "npx tembro add input",
-	highlights: [
-		"Inline clear action",
-		"Escape-to-clear support",
-		"Focus restore after clearing",
-		"Small but high-frequency utility input"
-	],
-	scenarios: [
-		{
-			title: "Filter reset",
-			description: "Let users clear a short filter without hunting for an extra reset button."
-		},
-		{
-			title: "Token paste",
-			description: "Remove a pasted value quickly and stay focused in the same field."
-		},
-		{
-			title: "Toolbar utility",
-			description: "Use in dense admin bars where compact cleanup matters."
-		}
-	],
-	capabilityNotes: [
-		"Prefer `Input clearable` for short-lived values like filters and quick entry.",
-		"Escape clear is useful only when the input is frequently changed.",
-		"Keep the field visually quiet so the clear action feels secondary."
-	]
-};
-//#endregion
-export { e as clearableInputMock };

package/dist/src/showcase/premium/clearable-input/showcase.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/ui/input/index.cjs"),n=require("../../../components/ui/badge/index.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a=`rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5`;function o({mode:e}){let[o,s]=r.useState(`workspace token`);return(0,i.jsxs)(`div`,{className:`space-y-5`,children:[(0,i.jsx)(`section`,{className:`rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5 sm:p-6`,children:(0,i.jsxs)(`div`,{className:`flex flex-col gap-6 xl:flex-row xl:items-start xl:justify-between`,children:[(0,i.jsxs)(`div`,{className:`max-w-xl`,children:[(0,i.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted`,children:`Utility input`}),(0,i.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`ClearableInput should remove friction from repetitive short entry`}),(0,i.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`This control exists for fields people revise often. Clear has to feel instant and keep focus where the user already is.`})]}),(0,i.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,i.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Escape clear`}),(0,i.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Focus restore`})]})]})}),(0,i.jsx)(`section`,{className:a,children:(0,i.jsx)(t.Input,{value:o,onValueChange:s,placeholder:`Filter or paste value...`,clearable:!0,clearOnEscape:!0,trailingAction:(0,i.jsx)(`span`,{className:`text-xs aui-text-muted`,children:`Live filter`}),replaceTrailingWhenClear:!1})}),(0,i.jsxs)(`div`,{className:`grid gap-4 xl:grid-cols-2`,children:[(0,i.jsxs)(`section`,{className:a,children:[(0,i.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Current value`}),(0,i.jsx)(`p`,{className:`mt-3 text-base font-medium aui-text-strong`,children:o||`Empty`})]}),(0,i.jsxs)(`section`,{className:a,children:[(0,i.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Usage note`}),(0,i.jsx)(`p`,{className:`mt-3 text-sm leading-6 aui-text-muted`,children:`Good for toolbar filters, small token fields, and any place users repeatedly enter and clear short text.`})]})]}),e===`playground`?(0,i.jsx)(`section`,{className:a,children:(0,i.jsx)(`p`,{className:`text-sm aui-text-muted`,children:"`Escape` bosib ham clear bo‘lishini sinab ko‘ring."})}):null]})}exports.ClearableInputShowcase=o;

package/dist/src/showcase/premium/clearable-input/showcase.js

@@ -1,94 +0,0 @@
-import { Input as e } from "../../../components/ui/input/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/showcase/premium/clearable-input/showcase.tsx
-var a = "rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5";
-function o({ mode: o }) {
-	let [s, c] = n.useState("workspace token");
-	return /* @__PURE__ */ i("div", {
-		className: "space-y-5",
-		children: [
-			/* @__PURE__ */ r("section", {
-				className: "rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5 sm:p-6",
-				children: /* @__PURE__ */ i("div", {
-					className: "flex flex-col gap-6 xl:flex-row xl:items-start xl:justify-between",
-					children: [/* @__PURE__ */ i("div", {
-						className: "max-w-xl",
-						children: [
-							/* @__PURE__ */ r("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted",
-								children: "Utility input"
-							}),
-							/* @__PURE__ */ r("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "ClearableInput should remove friction from repetitive short entry"
-							}),
-							/* @__PURE__ */ r("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "This control exists for fields people revise often. Clear has to feel instant and keep focus where the user already is."
-							})
-						]
-					}), /* @__PURE__ */ i("div", {
-						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ r(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Escape clear"
-						}), /* @__PURE__ */ r(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Focus restore"
-						})]
-					})]
-				})
-			}),
-			/* @__PURE__ */ r("section", {
-				className: a,
-				children: /* @__PURE__ */ r(e, {
-					value: s,
-					onValueChange: c,
-					placeholder: "Filter or paste value...",
-					clearable: !0,
-					clearOnEscape: !0,
-					trailingAction: /* @__PURE__ */ r("span", {
-						className: "text-xs aui-text-muted",
-						children: "Live filter"
-					}),
-					replaceTrailingWhenClear: !1
-				})
-			}),
-			/* @__PURE__ */ i("div", {
-				className: "grid gap-4 xl:grid-cols-2",
-				children: [/* @__PURE__ */ i("section", {
-					className: a,
-					children: [/* @__PURE__ */ r("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Current value"
-					}), /* @__PURE__ */ r("p", {
-						className: "mt-3 text-base font-medium aui-text-strong",
-						children: s || "Empty"
-					})]
-				}), /* @__PURE__ */ i("section", {
-					className: a,
-					children: [/* @__PURE__ */ r("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Usage note"
-					}), /* @__PURE__ */ r("p", {
-						className: "mt-3 text-sm leading-6 aui-text-muted",
-						children: "Good for toolbar filters, small token fields, and any place users repeatedly enter and clear short text."
-					})]
-				})]
-			}),
-			o === "playground" ? /* @__PURE__ */ r("section", {
-				className: a,
-				children: /* @__PURE__ */ r("p", {
-					className: "text-sm aui-text-muted",
-					children: "`Escape` bosib ham clear bo‘lishini sinab ko‘ring."
-				})
-			}) : null
-		]
-	});
-}
-//#endregion
-export { o as ClearableInputShowcase };

package/dist/src/showcase/premium/combobox/index.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./showcase.cjs"),t=require("./mock.cjs");exports.ComboboxShowcase=e.ComboboxShowcase,exports.comboboxMock=t.comboboxMock;

package/dist/src/showcase/premium/combobox/index.js

@@ -1,3 +0,0 @@
-import { ComboboxShowcase as e } from "./showcase.js";
-import { comboboxMock as t } from "./mock.js";
-export { e as ComboboxShowcase, t as comboboxMock };

package/dist/src/showcase/premium/combobox/mock.cjs

@@ -1,29 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { useState } from "react"
-import { Button, Select } from "tembro"
-
-const teammateOptions = [
-  { value: "azamat", label: "Azamat", description: "Design system owner" },
-  { value: "nodira", label: "Nodira", description: "Operations lead" },
-  { value: "sardor", label: "Sardor", description: "Frontend engineer" },
-]
-
-export function Example() {
-  const [value, setValue] = useState("azamat")
-
-  return (
-    <div className="space-y-3">
-      <Select
-        value={value}
-        onValueChange={(nextValue) => setValue(nextValue ?? "azamat")}
-        options={teammateOptions}
-        placeholder="Assign owner"
-        searchPlaceholder="Search teammate..."
-        searchable
-      />
-      <div className="rounded-2xl border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface-muted)] px-4 py-3 text-sm aui-text-muted">
-        Current owner: <strong>{value}</strong>
-      </div>
-      <Button variant="outline" onClick={() => setValue("nodira")}>Pick Nodira</Button>
-    </div>
-  )
-}`,htmlCode:`<button data-slot="combobox-trigger">Open combobox</button>`,cliCommand:`npx tembro add select`,highlights:[`Search-led selection`,`Controlled value`,`Description rows`,`Fast reassignment flow`],relatedBlockSlugs:[`settings-form`,`users-table`,`crm-dashboard`],scenarios:[{title:`Owner assignment`,description:`Use combobox when the list is local but still benefits from search.`},{title:`Dense admin forms`,description:`Keep reassignment fast without opening a full modal.`},{title:`Command-like search`,description:`Useful when discoverability matters more than plain select semantics.`}],capabilityNotes:[`Use Combobox when users need type-to-find behavior on a local option set.`,`Keep option labels and descriptions short to avoid noisy dropdown rows.`,`Prefer controlled value in admin workflows so state stays explicit.`,`If options come from the server, move to AsyncSelect instead of overloading Combobox.`]};exports.comboboxMock=e;

package/dist/src/showcase/premium/combobox/mock.js

@@ -1,39 +0,0 @@
-//#region src/showcase/premium/combobox/mock.ts
-var e = {
-	code: "import { useState } from \"react\"\nimport { Button, Select } from \"tembro\"\n\nconst teammateOptions = [\n  { value: \"azamat\", label: \"Azamat\", description: \"Design system owner\" },\n  { value: \"nodira\", label: \"Nodira\", description: \"Operations lead\" },\n  { value: \"sardor\", label: \"Sardor\", description: \"Frontend engineer\" },\n]\n\nexport function Example() {\n  const [value, setValue] = useState(\"azamat\")\n\n  return (\n    <div className=\"space-y-3\">\n      <Select\n        value={value}\n        onValueChange={(nextValue) => setValue(nextValue ?? \"azamat\")}\n        options={teammateOptions}\n        placeholder=\"Assign owner\"\n        searchPlaceholder=\"Search teammate...\"\n        searchable\n      />\n      <div className=\"rounded-2xl border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface-muted)] px-4 py-3 text-sm aui-text-muted\">\n        Current owner: <strong>{value}</strong>\n      </div>\n      <Button variant=\"outline\" onClick={() => setValue(\"nodira\")}>Pick Nodira</Button>\n    </div>\n  )\n}",
-	htmlCode: "<button data-slot=\"combobox-trigger\">Open combobox</button>",
-	cliCommand: "npx tembro add select",
-	highlights: [
-		"Search-led selection",
-		"Controlled value",
-		"Description rows",
-		"Fast reassignment flow"
-	],
-	relatedBlockSlugs: [
-		"settings-form",
-		"users-table",
-		"crm-dashboard"
-	],
-	scenarios: [
-		{
-			title: "Owner assignment",
-			description: "Use combobox when the list is local but still benefits from search."
-		},
-		{
-			title: "Dense admin forms",
-			description: "Keep reassignment fast without opening a full modal."
-		},
-		{
-			title: "Command-like search",
-			description: "Useful when discoverability matters more than plain select semantics."
-		}
-	],
-	capabilityNotes: [
-		"Use Combobox when users need type-to-find behavior on a local option set.",
-		"Keep option labels and descriptions short to avoid noisy dropdown rows.",
-		"Prefer controlled value in admin workflows so state stays explicit.",
-		"If options come from the server, move to AsyncSelect instead of overloading Combobox."
-	]
-};
-//#endregion
-export { e as comboboxMock };

package/dist/src/showcase/premium/combobox/showcase.cjs

@@ -1 +0,0 @@
-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/ui/select/index.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`,s=[{value:`azamat`,label:`Azamat`,description:`Design system owner`},{value:`nodira`,label:`Nodira`,description:`Operations lead`},{value:`sardor`,label:`Sardor`,description:`Frontend engineer`},{value:`kamola`,label:`Kamola`,description:`Product manager`}];function c({state:e,setState:c}){let l=s.some(t=>t.value===e.selectValue)?e.selectValue:`azamat`,u=s.find(e=>e.value===l)??s[0],[d,f]=i.useState(``);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:`Search selection`}),(0,a.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Combobox is the keyboard-first local member`}),(0,a.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`Use it when users know part of the option name and need to jump directly through local filtering instead of scanning a longer static Select list.`})]}),(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Searchable`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Controlled`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Local options`})]})]}),(0,a.jsxs)(`div`,{className:`mt-6 grid gap-4 xl:grid-cols-[1.1fr_0.9fr]`,children:[(0,a.jsxs)(`div`,{className:o,children:[(0,a.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Assign component owner`}),(0,a.jsx)(`div`,{className:`mt-3`,children:(0,a.jsx)(r.Select,{value:l,options:s.map(e=>({...e})),onValueChange:e=>c({selectValue:e??`azamat`}),placeholder:`Choose teammate`,searchPlaceholder:`Search teammate...`,searchable:!0,clearable:!0,showSelectedDescription:!0,onSearchChange:f})})]}),(0,a.jsxs)(`div`,{className:o,children:[(0,a.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Selection summary`}),(0,a.jsx)(`p`,{className:`mt-3 text-lg font-semibold aui-text-strong`,children:u.label}),(0,a.jsx)(`p`,{className:`mt-2 text-sm leading-6 aui-text-muted`,children:u.description}),(0,a.jsx)(`p`,{className:`mt-3 text-sm leading-6 aui-text-muted`,children:`Keep Combobox for local search-heavy reassignment flows. If options are remote, move back to the Select family and choose AsyncSelect instead.`})]})]})]}),(0,a.jsx)(`section`,{className:o,children:(0,a.jsxs)(`div`,{className:`flex flex-col gap-5 lg:flex-row lg:items-center lg:justify-between`,children:[(0,a.jsxs)(`div`,{children:[(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.24em] aui-text-muted`,children:`Live state`}),(0,a.jsxs)(`h4`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:[`Current owner: `,u.label]}),(0,a.jsx)(`p`,{className:`mt-2 text-sm leading-6 aui-text-muted`,children:`Use quick actions below to verify that the value stays controlled outside the dropdown itself.`}),(0,a.jsxs)(`p`,{className:`mt-2 text-sm leading-6 aui-text-muted`,children:[`Search query: `,d||`empty`]})]}),(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(t.Button,{type:`button`,size:`sm`,onClick:()=>c({selectValue:`nodira`}),children:`Pick Nodira`}),(0,a.jsx)(t.Button,{type:`button`,size:`sm`,variant:`secondary`,onClick:()=>c({selectValue:`azamat`}),children:`Reset`})]})]})})]})}exports.ComboboxShowcase=c;

package/dist/src/showcase/premium/combobox/showcase.js

@@ -1,157 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import { Select as n } from "../../../components/ui/select/index.js";
-import * as r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/showcase/premium/combobox/showcase.tsx
-var o = "rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5", s = [
-	{
-		value: "azamat",
-		label: "Azamat",
-		description: "Design system owner"
-	},
-	{
-		value: "nodira",
-		label: "Nodira",
-		description: "Operations lead"
-	},
-	{
-		value: "sardor",
-		label: "Sardor",
-		description: "Frontend engineer"
-	},
-	{
-		value: "kamola",
-		label: "Kamola",
-		description: "Product manager"
-	}
-];
-function c({ state: c, setState: l }) {
-	let u = s.some((e) => e.value === c.selectValue) ? c.selectValue : "azamat", d = s.find((e) => e.value === u) ?? s[0], [f, p] = r.useState("");
-	return /* @__PURE__ */ a("div", {
-		className: "space-y-5",
-		children: [/* @__PURE__ */ a("section", {
-			className: "rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5 sm:p-6",
-			children: [/* @__PURE__ */ a("div", {
-				className: "flex flex-col gap-6 xl:flex-row xl:items-start xl:justify-between",
-				children: [/* @__PURE__ */ a("div", {
-					className: "max-w-xl",
-					children: [
-						/* @__PURE__ */ i("p", {
-							className: "text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted",
-							children: "Search selection"
-						}),
-						/* @__PURE__ */ i("h3", {
-							className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-							children: "Combobox is the keyboard-first local member"
-						}),
-						/* @__PURE__ */ i("p", {
-							className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-							children: "Use it when users know part of the option name and need to jump directly through local filtering instead of scanning a longer static Select list."
-						})
-					]
-				}), /* @__PURE__ */ a("div", {
-					className: "flex flex-wrap gap-2",
-					children: [
-						/* @__PURE__ */ i(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Searchable"
-						}),
-						/* @__PURE__ */ i(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Controlled"
-						}),
-						/* @__PURE__ */ i(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Local options"
-						})
-					]
-				})]
-			}), /* @__PURE__ */ a("div", {
-				className: "mt-6 grid gap-4 xl:grid-cols-[1.1fr_0.9fr]",
-				children: [/* @__PURE__ */ a("div", {
-					className: o,
-					children: [/* @__PURE__ */ i("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Assign component owner"
-					}), /* @__PURE__ */ i("div", {
-						className: "mt-3",
-						children: /* @__PURE__ */ i(n, {
-							value: u,
-							options: s.map((e) => ({ ...e })),
-							onValueChange: (e) => l({ selectValue: e ?? "azamat" }),
-							placeholder: "Choose teammate",
-							searchPlaceholder: "Search teammate...",
-							searchable: !0,
-							clearable: !0,
-							showSelectedDescription: !0,
-							onSearchChange: p
-						})
-					})]
-				}), /* @__PURE__ */ a("div", {
-					className: o,
-					children: [
-						/* @__PURE__ */ i("p", {
-							className: "text-sm font-medium aui-text-muted",
-							children: "Selection summary"
-						}),
-						/* @__PURE__ */ i("p", {
-							className: "mt-3 text-lg font-semibold aui-text-strong",
-							children: d.label
-						}),
-						/* @__PURE__ */ i("p", {
-							className: "mt-2 text-sm leading-6 aui-text-muted",
-							children: d.description
-						}),
-						/* @__PURE__ */ i("p", {
-							className: "mt-3 text-sm leading-6 aui-text-muted",
-							children: "Keep Combobox for local search-heavy reassignment flows. If options are remote, move back to the Select family and choose AsyncSelect instead."
-						})
-					]
-				})]
-			})]
-		}), /* @__PURE__ */ i("section", {
-			className: o,
-			children: /* @__PURE__ */ a("div", {
-				className: "flex flex-col gap-5 lg:flex-row lg:items-center lg:justify-between",
-				children: [/* @__PURE__ */ a("div", { children: [
-					/* @__PURE__ */ i("p", {
-						className: "text-xs font-semibold uppercase tracking-[0.24em] aui-text-muted",
-						children: "Live state"
-					}),
-					/* @__PURE__ */ a("h4", {
-						className: "mt-2 text-lg font-semibold aui-text-strong",
-						children: ["Current owner: ", d.label]
-					}),
-					/* @__PURE__ */ i("p", {
-						className: "mt-2 text-sm leading-6 aui-text-muted",
-						children: "Use quick actions below to verify that the value stays controlled outside the dropdown itself."
-					}),
-					/* @__PURE__ */ a("p", {
-						className: "mt-2 text-sm leading-6 aui-text-muted",
-						children: ["Search query: ", f || "empty"]
-					})
-				] }), /* @__PURE__ */ a("div", {
-					className: "flex flex-wrap gap-2",
-					children: [/* @__PURE__ */ i(e, {
-						type: "button",
-						size: "sm",
-						onClick: () => l({ selectValue: "nodira" }),
-						children: "Pick Nodira"
-					}), /* @__PURE__ */ i(e, {
-						type: "button",
-						size: "sm",
-						variant: "secondary",
-						onClick: () => l({ selectValue: "azamat" }),
-						children: "Reset"
-					})]
-				})]
-			})
-		})]
-	});
-}
-//#endregion
-export { c as ComboboxShowcase };

package/dist/src/showcase/premium/command-bar/index.js

@@ -1,3 +0,0 @@
-import { commandBarMock as e } from "./mock.js";
-import { CommandBarShowcase as t } from "./showcase.js";
-export { t as CommandBarShowcase, e as commandBarMock };

package/dist/src/showcase/premium/command-bar/mock.cjs

@@ -1,11 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { CommandBar, Kbd, Button } from "tembro"
-
-export function Example() {
-  return (
-    <CommandBar>
-      <Kbd>G</Kbd>
-      <Button size="sm" variant="ghost">Go to dashboard</Button>
-      <Button size="sm">Publish</Button>
-    </CommandBar>
-  )
-}`,cliCommand:`npx tembro add command-bar`,highlights:[`Floating action rail for global shortcuts or workflow actions`,`Top or bottom positioning`,`Useful when a few persistent actions should stay reachable`],scenarios:[{title:`Global actions`,description:`Keep a small set of route-level actions always reachable.`},{title:`Keyboard hints`,description:`Pair actions with shortcuts inside the same persistent rail.`},{title:`Review flow`,description:`Float approve, reject, and comment actions over long content.`}]};exports.commandBarMock=e;

package/dist/src/showcase/premium/command-bar/mock.js

@@ -1,26 +0,0 @@
-//#region src/showcase/premium/command-bar/mock.ts
-var e = {
-	code: "import { CommandBar, Kbd, Button } from \"tembro\"\n\nexport function Example() {\n  return (\n    <CommandBar>\n      <Kbd>G</Kbd>\n      <Button size=\"sm\" variant=\"ghost\">Go to dashboard</Button>\n      <Button size=\"sm\">Publish</Button>\n    </CommandBar>\n  )\n}",
-	cliCommand: "npx tembro add command-bar",
-	highlights: [
-		"Floating action rail for global shortcuts or workflow actions",
-		"Top or bottom positioning",
-		"Useful when a few persistent actions should stay reachable"
-	],
-	scenarios: [
-		{
-			title: "Global actions",
-			description: "Keep a small set of route-level actions always reachable."
-		},
-		{
-			title: "Keyboard hints",
-			description: "Pair actions with shortcuts inside the same persistent rail."
-		},
-		{
-			title: "Review flow",
-			description: "Float approve, reject, and comment actions over long content."
-		}
-	]
-};
-//#endregion
-export { e as commandBarMock };