tembro 3.1.1 → 3.1.6

package/dist/src/showcase/premium/property-grid/showcase.js

@@ -1,93 +0,0 @@
-import { Badge as e } from "../../../components/ui/badge/index.js";
-import { PropertyGrid as t } from "../../../components/display/property-grid.js";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-//#region src/showcase/premium/property-grid/showcase.tsx
-var i = "border-t border-[color:var(--aui-divider)] py-6";
-function a() {
-	return /* @__PURE__ */ r("div", {
-		className: "space-y-0",
-		children: [/* @__PURE__ */ r("section", {
-			className: "pb-6",
-			children: [
-				/* @__PURE__ */ n("p", {
-					className: "text-xs font-semibold uppercase tracking-[0.24em] aui-text-muted",
-					children: "Installed display primitive"
-				}),
-				/* @__PURE__ */ n("h3", {
-					className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-					children: "PropertyGrid packs metadata into a compact surface"
-				}),
-				/* @__PURE__ */ n("p", {
-					className: "mt-3 max-w-2xl text-sm leading-6 aui-text-muted",
-					children: "Reach for it when the page needs many small facts and a full DescriptionList would feel too linear."
-				})
-			]
-		}), /* @__PURE__ */ n("section", {
-			className: i,
-			children: /* @__PURE__ */ r("div", {
-				className: "grid gap-6 xl:grid-cols-[1fr_360px]",
-				children: [/* @__PURE__ */ r("div", { children: [
-					/* @__PURE__ */ n("p", {
-						className: "text-lg font-semibold aui-text-strong",
-						children: "Release summary metadata"
-					}),
-					/* @__PURE__ */ n("p", {
-						className: "mt-2 max-w-xl text-sm leading-6 aui-text-muted",
-						children: "The grid layout works well for ownership, dates, environment and deployment facts."
-					}),
-					/* @__PURE__ */ n(t, {
-						className: "mt-5",
-						columns: 3,
-						items: [
-							{
-								key: "owner",
-								label: "Owner",
-								value: "Azamat Jurayev"
-							},
-							{
-								key: "status",
-								label: "Status",
-								value: /* @__PURE__ */ n(e, {
-									variant: "secondary",
-									children: "Ready"
-								})
-							},
-							{
-								key: "version",
-								label: "Version",
-								value: "0.3.27"
-							},
-							{
-								key: "environment",
-								label: "Environment",
-								value: "Production"
-							},
-							{
-								key: "updated",
-								label: "Updated",
-								value: "Today, 14:40"
-							},
-							{
-								key: "notes",
-								label: "Notes",
-								value: "Premium demos expanded for core display and utility routes.",
-								span: 2
-							}
-						]
-					})
-				] }), /* @__PURE__ */ r("div", {
-					className: "rounded-xl border border-[color:var(--aui-divider)] p-4",
-					children: [/* @__PURE__ */ n("p", {
-						className: "text-sm font-semibold aui-text-strong",
-						children: "Guidance"
-					}), /* @__PURE__ */ r("div", {
-						className: "mt-3 space-y-3 text-sm leading-6 aui-text-muted",
-						children: [/* @__PURE__ */ n("p", { children: "PropertyGrid is best for short values. If the content becomes paragraph-length, a linear details layout will read better." }), /* @__PURE__ */ n("p", { children: "Use `span` sparingly to keep rhythm predictable across breakpoints." })]
-					})]
-				})]
-			})
-		})]
-	});
-}
-//#endregion
-export { a as PropertyGridShowcase };

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

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

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

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

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

@@ -1,29 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { useState } from "react"
-import { Input } from "tembro"
-
-export function Example() {
-  const [quantity, setQuantity] = useState<number | null>(3)
-
-  return (
-    <div className="space-y-3">
-      <Input
-        kind="quantity"
-        value={quantity}
-        onValueChange={(nextValue: number | null) => setQuantity(nextValue)}
-        min={0}
-        max={10}
-        step={1}
-        showControls
-      />
-      <p className="text-sm aui-text-subtle">
-        Items: <strong>{quantity ?? "unset"}</strong>
-      </p>
-      <p className="text-sm aui-text-muted">
-        Controls should stay aligned with adjacent action columns in compact table rows.
-      </p>
-      <p className="text-sm aui-text-muted">
-        Try increment/decrement at bounds to validate guardrails.
-      </p>
-    </div>
-  )
-}`,htmlCode:`<label for="qty">Quantity</label><input id="qty" type="text" inputmode="numeric" />`,cliCommand:`npx tembro add input`,highlights:[`Stepper controls`,`min/max boundaries`,`controlled usage`,`compact row compatibility`],relatedBlockSlugs:[`crm-dashboard`,`users-table`,`settings-form`],scenarios:[{title:`Line item quantity`,description:`Use in carts and order forms with strict bounds.`},{title:`Inventory controls`,description:`Keep increments aligned with backend-stock constraints.`},{title:`Form tables`,description:`Compact control rendering works well in inline editable rows.`},{title:`Bounded values`,description:`Reject edits below zero and above maximum.`}],capabilityNotes:[`Show inline controls for quick adjustments when quantity edits are frequent.`,"Set `min`/`max` to protect impossible states in business rules.",`Use controlled flow to persist updates across rows and validation passes.`,`Disable controls when quantity is not editable to avoid inconsistent states.`]};exports.quantityInputMock=e;

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

@@ -1,43 +0,0 @@
-//#region src/showcase/premium/quantity-input/mock.ts
-var e = {
-	code: "import { useState } from \"react\"\nimport { Input } from \"tembro\"\n\nexport function Example() {\n  const [quantity, setQuantity] = useState<number | null>(3)\n\n  return (\n    <div className=\"space-y-3\">\n      <Input\n        kind=\"quantity\"\n        value={quantity}\n        onValueChange={(nextValue: number | null) => setQuantity(nextValue)}\n        min={0}\n        max={10}\n        step={1}\n        showControls\n      />\n      <p className=\"text-sm aui-text-subtle\">\n        Items: <strong>{quantity ?? \"unset\"}</strong>\n      </p>\n      <p className=\"text-sm aui-text-muted\">\n        Controls should stay aligned with adjacent action columns in compact table rows.\n      </p>\n      <p className=\"text-sm aui-text-muted\">\n        Try increment/decrement at bounds to validate guardrails.\n      </p>\n    </div>\n  )\n}",
-	htmlCode: "<label for=\"qty\">Quantity</label><input id=\"qty\" type=\"text\" inputmode=\"numeric\" />",
-	cliCommand: "npx tembro add input",
-	highlights: [
-		"Stepper controls",
-		"min/max boundaries",
-		"controlled usage",
-		"compact row compatibility"
-	],
-	relatedBlockSlugs: [
-		"crm-dashboard",
-		"users-table",
-		"settings-form"
-	],
-	scenarios: [
-		{
-			title: "Line item quantity",
-			description: "Use in carts and order forms with strict bounds."
-		},
-		{
-			title: "Inventory controls",
-			description: "Keep increments aligned with backend-stock constraints."
-		},
-		{
-			title: "Form tables",
-			description: "Compact control rendering works well in inline editable rows."
-		},
-		{
-			title: "Bounded values",
-			description: "Reject edits below zero and above maximum."
-		}
-	],
-	capabilityNotes: [
-		"Show inline controls for quick adjustments when quantity edits are frequent.",
-		"Set `min`/`max` to protect impossible states in business rules.",
-		"Use controlled flow to persist updates across rows and validation passes.",
-		"Disable controls when quantity is not editable to avoid inconsistent states."
-	]
-};
-//#endregion
-export { e as quantityInputMock };

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

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../components/ui/input/index.cjs");let t=require("react"),n=require("react/jsx-runtime");function r(){let[r,i]=(0,t.useState)(2);return(0,n.jsxs)(`div`,{className:`space-y-3`,children:[(0,n.jsx)(e.Input,{kind:`quantity`,value:r,onValueChange:i,min:0,max:12,showControls:!0}),(0,n.jsxs)(`p`,{className:`aui-text-subtle text-sm`,children:[`Quantity: `,r??`unset`]})]})}exports.QuantityInputShowcase=r;

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

@@ -1,23 +0,0 @@
-import { Input as e } from "../../../components/ui/input/index.js";
-import { useState as t } from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-//#region src/showcase/premium/quantity-input/showcase.tsx
-function i() {
-	let [i, a] = t(2);
-	return /* @__PURE__ */ r("div", {
-		className: "space-y-3",
-		children: [/* @__PURE__ */ n(e, {
-			kind: "quantity",
-			value: i,
-			onValueChange: a,
-			min: 0,
-			max: 12,
-			showControls: !0
-		}), /* @__PURE__ */ r("p", {
-			className: "aui-text-subtle text-sm",
-			children: ["Quantity: ", i ?? "unset"]
-		})]
-	});
-}
-//#endregion
-export { i as QuantityInputShowcase };

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

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

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

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

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

@@ -1,12 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Result } from "tembro"
-
-export function Example() {
-  return (
-    <Result
-      status="success"
-      title="Project created"
-      description="Your new workspace is ready and all checks passed."
-      compact
-    />
-  )
-}`,highlights:[`Semantic statuses`,`Inline action block`,`Compact and full variants`,`Reusable result states for non-page flows`],scenarios:[{title:`Create success`,description:`Use after successful create/update actions.`},{title:`Error outcome`,description:`Show clear recovery action and short guidance.`},{title:`Not found state`,description:`Use for invalid entity pages and missing route scenarios.`}],capabilityNotes:[`Align status text with backend outcomes.`,`Pair each state with primary and optional secondary actions.`,"Keep `description` short and specific to user intent."]};exports.resultMock=e;

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

@@ -1,31 +0,0 @@
-//#region src/showcase/premium/result/mock.ts
-var e = {
-	code: "import { Result } from \"tembro\"\n\nexport function Example() {\n  return (\n    <Result\n      status=\"success\"\n      title=\"Project created\"\n      description=\"Your new workspace is ready and all checks passed.\"\n      compact\n    />\n  )\n}",
-	highlights: [
-		"Semantic statuses",
-		"Inline action block",
-		"Compact and full variants",
-		"Reusable result states for non-page flows"
-	],
-	scenarios: [
-		{
-			title: "Create success",
-			description: "Use after successful create/update actions."
-		},
-		{
-			title: "Error outcome",
-			description: "Show clear recovery action and short guidance."
-		},
-		{
-			title: "Not found state",
-			description: "Use for invalid entity pages and missing route scenarios."
-		}
-	],
-	capabilityNotes: [
-		"Align status text with backend outcomes.",
-		"Pair each state with primary and optional secondary actions.",
-		"Keep `description` short and specific to user intent."
-	]
-};
-//#endregion
-export { e as resultMock };

package/dist/src/showcase/premium/result/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/display/result.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=[`success`,`error`,`warning`,`info`,`not-found`,`forbidden`,`server-error`],s={success:`The requested action completed.`,error:`The action failed. Review the message and try again.`,warning:`The request completed with warnings. Verify details before proceed.`,info:`An additional state is available for neutral communication.`,"not-found":`The requested resource could not be found.`,forbidden:`You do not have permission to perform this action.`,"server-error":`The server returned an unexpected response.`};function c({mode:e}){let[c,l]=i.useState(`success`),[u,d]=i.useState(e===`playground`),f=c===`success`?`Operation complete`:`Attention required`;return(0,a.jsxs)(`div`,{className:`space-y-5`,children:[(0,a.jsx)(`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:`Outcome state`}),(0,a.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Result should explain what happened next`}),(0,a.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`Use result for decisive page outcomes: success, failure, missing access, or blocked states. It should never read like a decorative alert.`})]}),(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:`Failure`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Blocked access`})]})]})}),e===`playground`?(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(`button`,{className:`rounded-full border border-[color:var(--aui-divider)] px-4 py-2 text-sm aui-text-muted`,onClick:()=>d(e=>!e),children:u?`Use roomy mode`:`Use compact mode`}),o.map(e=>(0,a.jsx)(`button`,{className:`rounded-full px-4 py-2 text-sm ${c===e?`bg-[color:var(--aui-surface-strong)] text-[color:var(--aui-surface-strong-foreground)]`:`border border-[color:var(--aui-divider)] aui-text-muted`}`,onClick:()=>l(e),children:e},e))]}):null,(0,a.jsx)(r.Result,{status:c,title:f,compact:u,description:s[c],actions:(0,a.jsx)(t.Button,{size:`sm`,variant:c===`success`?`outline`:`default`,children:c===`success`?`Continue`:`Try again`})})]})}exports.ResultShowcase=c;

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

@@ -1,98 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import { Result as n } from "../../../components/display/result.js";
-import * as r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/showcase/premium/result/showcase.tsx
-var o = [
-	"success",
-	"error",
-	"warning",
-	"info",
-	"not-found",
-	"forbidden",
-	"server-error"
-], s = {
-	success: "The requested action completed.",
-	error: "The action failed. Review the message and try again.",
-	warning: "The request completed with warnings. Verify details before proceed.",
-	info: "An additional state is available for neutral communication.",
-	"not-found": "The requested resource could not be found.",
-	forbidden: "You do not have permission to perform this action.",
-	"server-error": "The server returned an unexpected response."
-};
-function c({ mode: c }) {
-	let [l, u] = r.useState("success"), [d, f] = r.useState(c === "playground"), p = l === "success" ? "Operation complete" : "Attention required";
-	return /* @__PURE__ */ a("div", {
-		className: "space-y-5",
-		children: [
-			/* @__PURE__ */ i("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: "Outcome state"
-							}),
-							/* @__PURE__ */ i("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Result should explain what happened next"
-							}),
-							/* @__PURE__ */ i("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "Use result for decisive page outcomes: success, failure, missing access, or blocked states. It should never read like a decorative alert."
-							})
-						]
-					}), /* @__PURE__ */ a("div", {
-						className: "flex flex-wrap gap-2",
-						children: [
-							/* @__PURE__ */ i(t, {
-								variant: "outline",
-								className: "rounded-full",
-								children: "Success"
-							}),
-							/* @__PURE__ */ i(t, {
-								variant: "outline",
-								className: "rounded-full",
-								children: "Failure"
-							}),
-							/* @__PURE__ */ i(t, {
-								variant: "outline",
-								className: "rounded-full",
-								children: "Blocked access"
-							})
-						]
-					})]
-				})
-			}),
-			c === "playground" ? /* @__PURE__ */ a("div", {
-				className: "flex flex-wrap gap-2",
-				children: [/* @__PURE__ */ i("button", {
-					className: "rounded-full border border-[color:var(--aui-divider)] px-4 py-2 text-sm aui-text-muted",
-					onClick: () => f((e) => !e),
-					children: d ? "Use roomy mode" : "Use compact mode"
-				}), o.map((e) => /* @__PURE__ */ i("button", {
-					className: `rounded-full px-4 py-2 text-sm ${l === e ? "bg-[color:var(--aui-surface-strong)] text-[color:var(--aui-surface-strong-foreground)]" : "border border-[color:var(--aui-divider)] aui-text-muted"}`,
-					onClick: () => u(e),
-					children: e
-				}, e))]
-			}) : null,
-			/* @__PURE__ */ i(n, {
-				status: l,
-				title: p,
-				compact: d,
-				description: s[l],
-				actions: /* @__PURE__ */ i(e, {
-					size: "sm",
-					variant: l === "success" ? "outline" : "default",
-					children: l === "success" ? "Continue" : "Try again"
-				})
-			})
-		]
-	});
-}
-//#endregion
-export { c as ResultShowcase };

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

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

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

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

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

@@ -1,18 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import * as React from "react"
-import { Input, Kbd } from "tembro"
-
-export function Example() {
-  const [value, setValue] = React.useState("")
-
-  return (
-    <Input
-      kind="search"
-      value={value}
-      onValueChange={setValue}
-      placeholder="Search customers, invoices, or routes..."
-      resultCount={18}
-      shortcut={<Kbd>Ctrl+K</Kbd>}
-      debounceMs={250}
-    />
-  )
-}`,highlights:[`Search icon, result count, and shortcut support`,`Debounced value callback`,`Clear action inheritance`,`Good fit for toolbars and command launchers`],scenarios:[{title:`Data table search`,description:`Filter customers, invoices, or events without leaving the current view.`},{title:`Global search bar`,description:`Pair result count and shortcut hint in a compact top-level surface.`},{title:`Settings search`,description:`Reduce long preferences pages into one searchable control.`}],capabilityNotes:[`Keep search placeholder specific to the entities users can actually find.`,`Use debounced callbacks for remote or expensive filtering.`,`Only show result count when the number helps the user decide the next step.`]};exports.searchInputMock=e;

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

@@ -1,31 +0,0 @@
-//#region src/showcase/premium/search-input/mock.ts
-var e = {
-	code: "import * as React from \"react\"\nimport { Input, Kbd } from \"tembro\"\n\nexport function Example() {\n  const [value, setValue] = React.useState(\"\")\n\n  return (\n    <Input\n      kind=\"search\"\n      value={value}\n      onValueChange={setValue}\n      placeholder=\"Search customers, invoices, or routes...\"\n      resultCount={18}\n      shortcut={<Kbd>Ctrl+K</Kbd>}\n      debounceMs={250}\n    />\n  )\n}",
-	highlights: [
-		"Search icon, result count, and shortcut support",
-		"Debounced value callback",
-		"Clear action inheritance",
-		"Good fit for toolbars and command launchers"
-	],
-	scenarios: [
-		{
-			title: "Data table search",
-			description: "Filter customers, invoices, or events without leaving the current view."
-		},
-		{
-			title: "Global search bar",
-			description: "Pair result count and shortcut hint in a compact top-level surface."
-		},
-		{
-			title: "Settings search",
-			description: "Reduce long preferences pages into one searchable control."
-		}
-	],
-	capabilityNotes: [
-		"Keep search placeholder specific to the entities users can actually find.",
-		"Use debounced callbacks for remote or expensive filtering.",
-		"Only show result count when the number helps the user decide the next step."
-	]
-};
-//#endregion
-export { e as searchInputMock };

package/dist/src/showcase/premium/search-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"),r=require("../../../components/ui/kbd/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=[`Acme Growth workspace`,`Invoice 2048 approval`,`Northwind billing route`,`Customer retention dashboard`,`Workspace member access`,`Export usage report`];function c({mode:e}){let[c,l]=i.useState(``),[u,d]=i.useState(``),f=i.useMemo(()=>{let e=u.trim().toLowerCase();return e?s.filter(t=>t.toLowerCase().includes(e)):s},[u]);return(0,a.jsxs)(`div`,{className:`space-y-5`,children:[(0,a.jsx)(`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 control`}),(0,a.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`SearchInput should shorten finding, not add interface noise`}),(0,a.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`A good search field exposes intent clearly: what can be searched, how many matches remain, and whether the query is still being processed.`})]}),(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Debounced`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Shortcut aware`})]})]})}),(0,a.jsx)(`section`,{className:o,children:(0,a.jsx)(t.Input,{kind:`search`,value:c,onValueChange:l,onDebouncedValueChange:d,placeholder:`Search customers, invoices, or routes...`,resultCount:f.length,shortcut:(0,a.jsx)(r.Kbd,{children:`Ctrl+K`}),debounceMs:250})}),(0,a.jsxs)(`div`,{className:`grid gap-4 xl:grid-cols-[0.95fr_1.05fr]`,children:[(0,a.jsxs)(`section`,{className:o,children:[(0,a.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Resolved query`}),(0,a.jsx)(`p`,{className:`mt-3 text-base font-medium aui-text-strong`,children:u||`No active query`}),(0,a.jsx)(`p`,{className:`mt-2 text-sm leading-6 aui-text-muted`,children:`The debounced value represents what should usually drive remote or expensive filters.`})]}),(0,a.jsxs)(`section`,{className:o,children:[(0,a.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Preview results`}),(0,a.jsx)(`div`,{className:`mt-4 space-y-2 text-sm`,children:f.map(e=>(0,a.jsx)(`div`,{className:`rounded-2xl border border-[color:var(--aui-divider)] px-3 py-2 aui-text-muted`,children:e},e))})]})]}),e===`playground`?(0,a.jsx)(`section`,{className:o,children:(0,a.jsx)(`p`,{className:`text-sm aui-text-muted`,children:"Try searching for `invoice`, `workspace`, or `billing`."})}):null]})}exports.SearchInputShowcase=c;

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

@@ -1,113 +0,0 @@
-import { Input as e } from "../../../components/ui/input/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import { Kbd as n } from "../../../components/ui/kbd/index.js";
-import * as r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/showcase/premium/search-input/showcase.tsx
-var o = "rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5", s = [
-	"Acme Growth workspace",
-	"Invoice 2048 approval",
-	"Northwind billing route",
-	"Customer retention dashboard",
-	"Workspace member access",
-	"Export usage report"
-];
-function c({ mode: c }) {
-	let [l, u] = r.useState(""), [d, f] = r.useState(""), p = r.useMemo(() => {
-		let e = d.trim().toLowerCase();
-		return e ? s.filter((t) => t.toLowerCase().includes(e)) : s;
-	}, [d]);
-	return /* @__PURE__ */ a("div", {
-		className: "space-y-5",
-		children: [
-			/* @__PURE__ */ i("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 control"
-							}),
-							/* @__PURE__ */ i("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "SearchInput should shorten finding, not add interface noise"
-							}),
-							/* @__PURE__ */ i("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "A good search field exposes intent clearly: what can be searched, how many matches remain, and whether the query is still being processed."
-							})
-						]
-					}), /* @__PURE__ */ a("div", {
-						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ i(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Debounced"
-						}), /* @__PURE__ */ i(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Shortcut aware"
-						})]
-					})]
-				})
-			}),
-			/* @__PURE__ */ i("section", {
-				className: o,
-				children: /* @__PURE__ */ i(e, {
-					kind: "search",
-					value: l,
-					onValueChange: u,
-					onDebouncedValueChange: f,
-					placeholder: "Search customers, invoices, or routes...",
-					resultCount: p.length,
-					shortcut: /* @__PURE__ */ i(n, { children: "Ctrl+K" }),
-					debounceMs: 250
-				})
-			}),
-			/* @__PURE__ */ a("div", {
-				className: "grid gap-4 xl:grid-cols-[0.95fr_1.05fr]",
-				children: [/* @__PURE__ */ a("section", {
-					className: o,
-					children: [
-						/* @__PURE__ */ i("p", {
-							className: "text-sm font-medium aui-text-muted",
-							children: "Resolved query"
-						}),
-						/* @__PURE__ */ i("p", {
-							className: "mt-3 text-base font-medium aui-text-strong",
-							children: d || "No active query"
-						}),
-						/* @__PURE__ */ i("p", {
-							className: "mt-2 text-sm leading-6 aui-text-muted",
-							children: "The debounced value represents what should usually drive remote or expensive filters."
-						})
-					]
-				}), /* @__PURE__ */ a("section", {
-					className: o,
-					children: [/* @__PURE__ */ i("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Preview results"
-					}), /* @__PURE__ */ i("div", {
-						className: "mt-4 space-y-2 text-sm",
-						children: p.map((e) => /* @__PURE__ */ i("div", {
-							className: "rounded-2xl border border-[color:var(--aui-divider)] px-3 py-2 aui-text-muted",
-							children: e
-						}, e))
-					})]
-				})]
-			}),
-			c === "playground" ? /* @__PURE__ */ i("section", {
-				className: o,
-				children: /* @__PURE__ */ i("p", {
-					className: "text-sm aui-text-muted",
-					children: "Try searching for `invoice`, `workspace`, or `billing`."
-				})
-			}) : null
-		]
-	});
-}
-//#endregion
-export { c as SearchInputShowcase };

package/dist/src/showcase/premium/sheet-shell/index.cjs

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

package/dist/src/showcase/premium/sheet-shell/index.js

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

package/dist/src/showcase/premium/sheet-shell/mock.cjs

@@ -1,34 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { useState } from "react"
-import { Button, SheetShell } from "tembro"
-
-export function Example() {
-  const [openRight, setOpenRight] = useState(false)
-  const [openBottom, setOpenBottom] = useState(false)
-
-  return (
-    <div className="space-y-3">
-      <Button onClick={() => setOpenRight(true)}>Open right sheet</Button>
-      <Button variant="outline" onClick={() => setOpenBottom(true)}>Open bottom sheet</Button>
-      <SheetShell
-        open={openRight}
-        onOpenChange={setOpenRight}
-        side="right"
-        title="Workspace editor"
-        description="Use a sheet for dense action rows without taking full screen."
-        footer={<Button onClick={() => setOpenRight(false)}>Done</Button>}
-      >
-        <p className="text-sm aui-text-muted">Compact editor surface stays close to the source context.</p>
-      </SheetShell>
-      <SheetShell
-        open={openBottom}
-        onOpenChange={setOpenBottom}
-        side="bottom"
-        title="Mobile actions"
-        description="Use mobile-friendly sheet for quick row actions."
-        footer={<Button variant="outline" onClick={() => setOpenBottom(false)}>Close</Button>}
-      >
-        <p className="text-sm aui-text-muted">Bottom sheets fit long lists and quick actions on narrow viewports.</p>
-      </SheetShell>
-    </div>
-  )
-}`,htmlCode:`<button data-slot="sheet-shell-trigger">Open sheet</button>`,cliCommand:`npx tembro add sheet-shell`,highlights:[`Side-based drawer behavior`,`Right and bottom anchors`,`Footer action slot`,`Contextual edit pattern`],relatedBlockSlugs:[`dashboard-starter`,`users-table`,`settings-form`],scenarios:[{title:`Desktop quick editor`,description:`Keep row-level actions next to data without leaving page context.`},{title:`Mobile action panel`,description:`Use bottom sheets for compact action drawers on small screens.`},{title:`Controlled sheet`,description:`Parent owns open state and navigation-related side effects.`},{title:`Action footer`,description:`Include explicit Done/Submit for consistent close behavior.`}],capabilityNotes:[`SheetShell should replace full modals when interaction is contextual and task-scoped.`,`Use side controls based on flow density (right for editors, bottom for mobile actions).`,`Keep state/validation outside the sheet to prevent focus and mount side effects.`,`Avoid loading-heavy forms directly in sheets unless the sheet is intentionally a workflow container.`]};exports.sheetShellMock=e;

package/dist/src/showcase/premium/sheet-shell/mock.js

@@ -1,43 +0,0 @@
-//#region src/showcase/premium/sheet-shell/mock.ts
-var e = {
-	code: "import { useState } from \"react\"\nimport { Button, SheetShell } from \"tembro\"\n\nexport function Example() {\n  const [openRight, setOpenRight] = useState(false)\n  const [openBottom, setOpenBottom] = useState(false)\n\n  return (\n    <div className=\"space-y-3\">\n      <Button onClick={() => setOpenRight(true)}>Open right sheet</Button>\n      <Button variant=\"outline\" onClick={() => setOpenBottom(true)}>Open bottom sheet</Button>\n      <SheetShell\n        open={openRight}\n        onOpenChange={setOpenRight}\n        side=\"right\"\n        title=\"Workspace editor\"\n        description=\"Use a sheet for dense action rows without taking full screen.\"\n        footer={<Button onClick={() => setOpenRight(false)}>Done</Button>}\n      >\n        <p className=\"text-sm aui-text-muted\">Compact editor surface stays close to the source context.</p>\n      </SheetShell>\n      <SheetShell\n        open={openBottom}\n        onOpenChange={setOpenBottom}\n        side=\"bottom\"\n        title=\"Mobile actions\"\n        description=\"Use mobile-friendly sheet for quick row actions.\"\n        footer={<Button variant=\"outline\" onClick={() => setOpenBottom(false)}>Close</Button>}\n      >\n        <p className=\"text-sm aui-text-muted\">Bottom sheets fit long lists and quick actions on narrow viewports.</p>\n      </SheetShell>\n    </div>\n  )\n}",
-	htmlCode: "<button data-slot=\"sheet-shell-trigger\">Open sheet</button>",
-	cliCommand: "npx tembro add sheet-shell",
-	highlights: [
-		"Side-based drawer behavior",
-		"Right and bottom anchors",
-		"Footer action slot",
-		"Contextual edit pattern"
-	],
-	relatedBlockSlugs: [
-		"dashboard-starter",
-		"users-table",
-		"settings-form"
-	],
-	scenarios: [
-		{
-			title: "Desktop quick editor",
-			description: "Keep row-level actions next to data without leaving page context."
-		},
-		{
-			title: "Mobile action panel",
-			description: "Use bottom sheets for compact action drawers on small screens."
-		},
-		{
-			title: "Controlled sheet",
-			description: "Parent owns open state and navigation-related side effects."
-		},
-		{
-			title: "Action footer",
-			description: "Include explicit Done/Submit for consistent close behavior."
-		}
-	],
-	capabilityNotes: [
-		"SheetShell should replace full modals when interaction is contextual and task-scoped.",
-		"Use side controls based on flow density (right for editors, bottom for mobile actions).",
-		"Keep state/validation outside the sheet to prevent focus and mount side effects.",
-		"Avoid loading-heavy forms directly in sheets unless the sheet is intentionally a workflow container."
-	]
-};
-//#endregion
-export { e as sheetShellMock };