tembro 3.0.0 → 3.1.5

package/dist/showcase/premium/number-input/mock.cjs

@@ -1,32 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { useState } from "react"
-import { Input } from "tembro"
-
-export function Example() {
-  const [value, setValue] = useState<number | null>(14)
-  const [raw, setRaw] = useState("14")
-
-  return (
-    <div className="space-y-3">
-      <Input
-        kind="number"
-        value={value}
-        onNumberChange={(nextValue) => {
-          setValue(nextValue)
-          setRaw(String(nextValue ?? ""))
-        }}
-        onChange={(event) => setRaw(event.target.value)}
-        min={0}
-        max={100}
-        step={5}
-        allowEmpty
-      />
-      <p className="text-sm aui-text-subtle">
-        Parsed numeric: <strong>{value === null ? "unset" : value}</strong>
-      </p>
-      <p className="text-sm aui-text-muted">Raw text: {raw}</p>
-      <p className="text-sm aui-text-muted">
-        Try entering invalid chars to see how parse and clamp rules apply.
-      </p>
-    </div>
-  )
-}`,htmlCode:`<label for="example-number">Amount</label><input id="example-number" inputmode="decimal" type="text" />`,cliCommand:`npx tembro add input`,highlights:[`Numeric parsing`,`Min/max constraints`,`Decimal steps`,`allowEmpty fallback`],relatedBlockSlugs:[`settings-form`,`users-table`,`crm-dashboard`],scenarios:[{title:`Budget field`,description:`Keep values inside business bounds while editing quickly.`},{title:`Invalid input`,description:`Use parser path to avoid NaN leaks into form data.`},{title:`Stepper steps`,description:`Use step values that match your business precision.`},{title:`Uncontrolled mode`,description:`Use defaultValue and HTML value when rapid typing is enough.`}],capabilityNotes:[`The component supports controlled numeric state and keeps string display behavior under user editing.`,"Use `min`/`max` with `clamp` semantics when downstream systems expect bounded values.","`allowEmpty` helps avoid forced 0 when field is cleared temporarily.",`Prefer controlled usage in forms that need instant validation and submit-time serialization.`]};exports.numberInputMock=e;

package/dist/showcase/premium/number-input/mock.d.ts

@@ -1,2 +0,0 @@
-import type { ComponentDemoMock } from "../types";
-export declare const numberInputMock: ComponentDemoMock;

package/dist/showcase/premium/number-input/mock.js

@@ -1,43 +0,0 @@
-//#region src/showcase/premium/number-input/mock.ts
-var e = {
-	code: "import { useState } from \"react\"\nimport { Input } from \"tembro\"\n\nexport function Example() {\n  const [value, setValue] = useState<number | null>(14)\n  const [raw, setRaw] = useState(\"14\")\n\n  return (\n    <div className=\"space-y-3\">\n      <Input\n        kind=\"number\"\n        value={value}\n        onNumberChange={(nextValue) => {\n          setValue(nextValue)\n          setRaw(String(nextValue ?? \"\"))\n        }}\n        onChange={(event) => setRaw(event.target.value)}\n        min={0}\n        max={100}\n        step={5}\n        allowEmpty\n      />\n      <p className=\"text-sm aui-text-subtle\">\n        Parsed numeric: <strong>{value === null ? \"unset\" : value}</strong>\n      </p>\n      <p className=\"text-sm aui-text-muted\">Raw text: {raw}</p>\n      <p className=\"text-sm aui-text-muted\">\n        Try entering invalid chars to see how parse and clamp rules apply.\n      </p>\n    </div>\n  )\n}",
-	htmlCode: "<label for=\"example-number\">Amount</label><input id=\"example-number\" inputmode=\"decimal\" type=\"text\" />",
-	cliCommand: "npx tembro add input",
-	highlights: [
-		"Numeric parsing",
-		"Min/max constraints",
-		"Decimal steps",
-		"allowEmpty fallback"
-	],
-	relatedBlockSlugs: [
-		"settings-form",
-		"users-table",
-		"crm-dashboard"
-	],
-	scenarios: [
-		{
-			title: "Budget field",
-			description: "Keep values inside business bounds while editing quickly."
-		},
-		{
-			title: "Invalid input",
-			description: "Use parser path to avoid NaN leaks into form data."
-		},
-		{
-			title: "Stepper steps",
-			description: "Use step values that match your business precision."
-		},
-		{
-			title: "Uncontrolled mode",
-			description: "Use defaultValue and HTML value when rapid typing is enough."
-		}
-	],
-	capabilityNotes: [
-		"The component supports controlled numeric state and keeps string display behavior under user editing.",
-		"Use `min`/`max` with `clamp` semantics when downstream systems expect bounded values.",
-		"`allowEmpty` helps avoid forced 0 when field is cleared temporarily.",
-		"Prefer controlled usage in forms that need instant validation and submit-time serialization."
-	]
-};
-//#endregion
-export { e as numberInputMock };

package/dist/showcase/premium/number-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)(12);return(0,n.jsxs)(`div`,{className:`space-y-3`,children:[(0,n.jsx)(e.Input,{kind:`number`,value:r,onNumberChange:i,min:0,max:30,step:1}),(0,n.jsxs)(`p`,{className:`aui-text-subtle text-sm`,children:[`Current value: `,r??`unset`]})]})}exports.NumberInputShowcase=r;

package/dist/showcase/premium/number-input/showcase.d.ts

@@ -1 +0,0 @@
-export declare function NumberInputShowcase(): import("react").JSX.Element;

package/dist/showcase/premium/number-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/number-input/showcase.tsx
-function i() {
-	let [i, a] = t(12);
-	return /* @__PURE__ */ r("div", {
-		className: "space-y-3",
-		children: [/* @__PURE__ */ n(e, {
-			kind: "number",
-			value: i,
-			onNumberChange: a,
-			min: 0,
-			max: 30,
-			step: 1
-		}), /* @__PURE__ */ r("p", {
-			className: "aui-text-subtle text-sm",
-			children: ["Current value: ", i ?? "unset"]
-		})]
-	});
-}
-//#endregion
-export { i as NumberInputShowcase };

package/dist/showcase/premium/page-container/index.cjs

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

package/dist/showcase/premium/page-container/index.d.ts

@@ -1,2 +0,0 @@
-export { PageContainerShowcase } from "./showcase";
-export { pageContainerMock } from "./mock";

package/dist/showcase/premium/page-container/index.js

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

package/dist/showcase/premium/page-container/mock.cjs

@@ -1,9 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { PageContainer } from "tembro"
-
-export function Example() {
-  return (
-    <PageContainer size="lg">
-      <div className="rounded-md border p-4">Page content stays constrained here.</div>
-    </PageContainer>
-  )
-}`,highlights:[`Consistent max-width wrapper`,`Size presets`,`Useful for dashboard and content pages`,`Simple integration with layout components`],scenarios:[{title:`Global page shell`,description:`Use as the default wrapper inside AppShell main slot.`},{title:`Long-form content`,description:`Use smaller sizes for forms and full width for tables.`},{title:`Readable spacing`,description:`Pair with responsive spacing utilities from surrounding layouts.`}],capabilityNotes:["Prefer `lg` or `xl` for heavy forms and tables.","Use `full` when content needs entire width, such as charts.",`Wrap page-level cards in a single PageContainer to keep rhythm uniform.`]};exports.pageContainerMock=e;

package/dist/showcase/premium/page-container/mock.d.ts

@@ -1,2 +0,0 @@
-import type { ComponentDemoMock } from "../types";
-export declare const pageContainerMock: ComponentDemoMock;

package/dist/showcase/premium/page-container/mock.js

@@ -1,31 +0,0 @@
-//#region src/showcase/premium/page-container/mock.ts
-var e = {
-	code: "import { PageContainer } from \"tembro\"\n\nexport function Example() {\n  return (\n    <PageContainer size=\"lg\">\n      <div className=\"rounded-md border p-4\">Page content stays constrained here.</div>\n    </PageContainer>\n  )\n}",
-	highlights: [
-		"Consistent max-width wrapper",
-		"Size presets",
-		"Useful for dashboard and content pages",
-		"Simple integration with layout components"
-	],
-	scenarios: [
-		{
-			title: "Global page shell",
-			description: "Use as the default wrapper inside AppShell main slot."
-		},
-		{
-			title: "Long-form content",
-			description: "Use smaller sizes for forms and full width for tables."
-		},
-		{
-			title: "Readable spacing",
-			description: "Pair with responsive spacing utilities from surrounding layouts."
-		}
-	],
-	capabilityNotes: [
-		"Prefer `lg` or `xl` for heavy forms and tables.",
-		"Use `full` when content needs entire width, such as charts.",
-		"Wrap page-level cards in a single PageContainer to keep rhythm uniform."
-	]
-};
-//#endregion
-export { e as pageContainerMock };

package/dist/showcase/premium/page-container/showcase.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/ui/badge/index.cjs"),n=require("../../../components/layout/page-container.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a=[`default`,`sm`,`md`,`lg`,`xl`,`full`],o=`rounded-xl border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4`;function s({mode:e}){let[s,c]=r.useState(`lg`);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:`Content width`}),(0,i.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Page container should stabilize layout width`}),(0,i.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`This wrapper is not decorative. It keeps headings, forms, tables, and body copy aligned so every route does not invent its own max-width.`})]}),(0,i.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,i.jsx)(t.Badge,{variant:`outline`,className:`rounded-full`,children:`Width scale`}),(0,i.jsx)(t.Badge,{variant:`outline`,className:`rounded-full`,children:`Content rhythm`})]})]})}),e===`playground`?(0,i.jsx)(`div`,{className:`flex flex-wrap gap-2`,children:a.map(e=>(0,i.jsx)(`button`,{className:`rounded-full px-4 py-2 text-sm ${s===e?`bg-[color:var(--aui-surface-strong)] text-[color:var(--aui-surface-strong-foreground)]`:`border border-[color:var(--aui-divider)] aui-text-muted`}`,onClick:()=>c(e),children:e},e))}):null,(0,i.jsxs)(n.PageContainer,{size:s,className:o,children:[(0,i.jsxs)(`p`,{className:`aui-text-muted text-sm`,children:[`Active size: `,(0,i.jsx)(`span`,{className:`font-medium aui-text-strong`,children:s})]}),(0,i.jsx)(`p`,{className:`aui-text-muted mt-2 text-sm`,children:`Use this wrapper to keep internal sections aligned across pages and avoid route-by-route width drift.`})]})]})}exports.PageContainerShowcase=s;

package/dist/showcase/premium/page-container/showcase.d.ts

@@ -1,3 +0,0 @@
-import * as React from "react";
-import type { ComponentDemoProps } from "../types";
-export declare function PageContainerShowcase({ mode }: ComponentDemoProps): React.JSX.Element;

package/dist/showcase/premium/page-container/showcase.js

@@ -1,79 +0,0 @@
-import { Badge as e } from "../../../components/ui/badge/index.js";
-import { PageContainer as t } from "../../../components/layout/page-container.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/showcase/premium/page-container/showcase.tsx
-var a = [
-	"default",
-	"sm",
-	"md",
-	"lg",
-	"xl",
-	"full"
-], o = "rounded-xl border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4";
-function s({ mode: s }) {
-	let [c, l] = n.useState("lg");
-	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: "Content width"
-							}),
-							/* @__PURE__ */ r("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Page container should stabilize layout width"
-							}),
-							/* @__PURE__ */ r("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "This wrapper is not decorative. It keeps headings, forms, tables, and body copy aligned so every route does not invent its own max-width."
-							})
-						]
-					}), /* @__PURE__ */ i("div", {
-						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ r(e, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Width scale"
-						}), /* @__PURE__ */ r(e, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Content rhythm"
-						})]
-					})]
-				})
-			}),
-			s === "playground" ? /* @__PURE__ */ r("div", {
-				className: "flex flex-wrap gap-2",
-				children: a.map((e) => /* @__PURE__ */ r("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,
-			/* @__PURE__ */ i(t, {
-				size: c,
-				className: o,
-				children: [/* @__PURE__ */ i("p", {
-					className: "aui-text-muted text-sm",
-					children: ["Active size: ", /* @__PURE__ */ r("span", {
-						className: "font-medium aui-text-strong",
-						children: c
-					})]
-				}), /* @__PURE__ */ r("p", {
-					className: "aui-text-muted mt-2 text-sm",
-					children: "Use this wrapper to keep internal sections aligned across pages and avoid route-by-route width drift."
-				})]
-			})
-		]
-	});
-}
-//#endregion
-export { s as PageContainerShowcase };

package/dist/showcase/premium/page-header/index.cjs

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

package/dist/showcase/premium/page-header/index.d.ts

@@ -1,2 +0,0 @@
-export { PageHeaderShowcase } from "./showcase";
-export { pageHeaderMock } from "./mock";

package/dist/showcase/premium/page-header/index.js

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

package/dist/showcase/premium/page-header/mock.cjs

@@ -1,14 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Breadcrumbs, PageHeader } from "tembro"
-
-export function Example() {
-  return (
-    <PageHeader
-      eyebrow="Overview"
-      title="Project settings"
-      description="Use PageHeader to group title, description and actions at the top of a screen."
-      breadcrumbs={<Breadcrumbs items={[{ key: "home", label: "Home", href: "/" }, { key: "settings", label: "Settings", current: true }]} />}
-      actions={<button>Save</button>}
-      sticky
-    />
-  )
-}`,highlights:[`Top-of-page composition`,`Optional breadcrumbs region`,`Action and meta regions`,`Sticky page heading mode`],relatedBlockSlugs:[`dashboard-starter`,`crm-dashboard`,`users-table`],scenarios:[{title:`Admin pages`,description:`Keep title, description and action buttons together before body content.`},{title:`List views`,description:`Pair breadcrumbs with actions to indicate current scope.`},{title:`Sticky header`,description:`Enable sticky mode for long content pages where users need persistent context.`}],capabilityNotes:["Use `eyebrow` for a compact pre-heading that communicates area or environment.",`Place route breadcrumbs in one place and avoid duplicating path state elsewhere.`,"Use `meta` for small KPI chips, tags or helper context."]};exports.pageHeaderMock=e;

package/dist/showcase/premium/page-header/mock.d.ts

@@ -1,2 +0,0 @@
-import type { ComponentDemoMock } from "../types";
-export declare const pageHeaderMock: ComponentDemoMock;

package/dist/showcase/premium/page-header/mock.js

@@ -1,36 +0,0 @@
-//#region src/showcase/premium/page-header/mock.ts
-var e = {
-	code: "import { Breadcrumbs, PageHeader } from \"tembro\"\n\nexport function Example() {\n  return (\n    <PageHeader\n      eyebrow=\"Overview\"\n      title=\"Project settings\"\n      description=\"Use PageHeader to group title, description and actions at the top of a screen.\"\n      breadcrumbs={<Breadcrumbs items={[{ key: \"home\", label: \"Home\", href: \"/\" }, { key: \"settings\", label: \"Settings\", current: true }]} />}\n      actions={<button>Save</button>}\n      sticky\n    />\n  )\n}",
-	highlights: [
-		"Top-of-page composition",
-		"Optional breadcrumbs region",
-		"Action and meta regions",
-		"Sticky page heading mode"
-	],
-	relatedBlockSlugs: [
-		"dashboard-starter",
-		"crm-dashboard",
-		"users-table"
-	],
-	scenarios: [
-		{
-			title: "Admin pages",
-			description: "Keep title, description and action buttons together before body content."
-		},
-		{
-			title: "List views",
-			description: "Pair breadcrumbs with actions to indicate current scope."
-		},
-		{
-			title: "Sticky header",
-			description: "Enable sticky mode for long content pages where users need persistent context."
-		}
-	],
-	capabilityNotes: [
-		"Use `eyebrow` for a compact pre-heading that communicates area or environment.",
-		"Place route breadcrumbs in one place and avoid duplicating path state elsewhere.",
-		"Use `meta` for small KPI chips, tags or helper context."
-	]
-};
-//#endregion
-export { e as pageHeaderMock };

package/dist/showcase/premium/page-header/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/layout/breadcrumbs.cjs"),i=require("../../../components/layout/page-header.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=[{key:`home`,label:`Home`,href:`/`},{key:`products`,label:`Products`,href:`/products`},{key:`active`,label:`Workspace`,current:!0}];function c({mode:e}){let[c,l]=a.useState(e===`playground`);return(0,o.jsxs)(`div`,{className:`space-y-5`,children:[(0,o.jsx)(`div`,{className:`rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4 sm:p-5`,children:(0,o.jsx)(i.PageHeader,{eyebrow:`Workspace`,title:`Team settings`,description:`Configure profile, billing and preferences from this page-level surface.`,breadcrumbs:(0,o.jsx)(r.Breadcrumbs,{items:s}),actions:(0,o.jsx)(t.Button,{size:`sm`,children:`Save`}),meta:(0,o.jsxs)(`div`,{className:`flex flex-wrap items-center gap-2`,children:[(0,o.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Breadcrumbs`}),(0,o.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Action`}),(0,o.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Sticky option`})]}),sticky:c})}),e===`playground`?(0,o.jsx)(`button`,{className:`rounded-full border border-[color:var(--aui-divider)] px-4 py-2 text-sm aui-text-muted`,onClick:()=>l(e=>!e),children:c?`Disable sticky`:`Enable sticky`}):null]})}exports.PageHeaderShowcase=c;

package/dist/showcase/premium/page-header/showcase.d.ts

@@ -1,3 +0,0 @@
-import * as React from "react";
-import type { ComponentDemoProps } from "../types";
-export declare function PageHeaderShowcase({ mode }: ComponentDemoProps): React.JSX.Element;

package/dist/showcase/premium/page-header/showcase.js

@@ -1,70 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import { Breadcrumbs as n } from "../../../components/layout/breadcrumbs.js";
-import { PageHeader as r } from "../../../components/layout/page-header.js";
-import * as i from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-//#region src/showcase/premium/page-header/showcase.tsx
-var s = [
-	{
-		key: "home",
-		label: "Home",
-		href: "/"
-	},
-	{
-		key: "products",
-		label: "Products",
-		href: "/products"
-	},
-	{
-		key: "active",
-		label: "Workspace",
-		current: !0
-	}
-];
-function c({ mode: c }) {
-	let [l, u] = i.useState(c === "playground");
-	return /* @__PURE__ */ o("div", {
-		className: "space-y-5",
-		children: [/* @__PURE__ */ a("div", {
-			className: "rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-4 sm:p-5",
-			children: /* @__PURE__ */ a(r, {
-				eyebrow: "Workspace",
-				title: "Team settings",
-				description: "Configure profile, billing and preferences from this page-level surface.",
-				breadcrumbs: /* @__PURE__ */ a(n, { items: s }),
-				actions: /* @__PURE__ */ a(e, {
-					size: "sm",
-					children: "Save"
-				}),
-				meta: /* @__PURE__ */ o("div", {
-					className: "flex flex-wrap items-center gap-2",
-					children: [
-						/* @__PURE__ */ a(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Breadcrumbs"
-						}),
-						/* @__PURE__ */ a(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Action"
-						}),
-						/* @__PURE__ */ a(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Sticky option"
-						})
-					]
-				}),
-				sticky: l
-			})
-		}), c === "playground" ? /* @__PURE__ */ a("button", {
-			className: "rounded-full border border-[color:var(--aui-divider)] px-4 py-2 text-sm aui-text-muted",
-			onClick: () => u((e) => !e),
-			children: l ? "Disable sticky" : "Enable sticky"
-		}) : null]
-	});
-}
-//#endregion
-export { c as PageHeaderShowcase };

package/dist/showcase/premium/page-tabs/index.cjs

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

package/dist/showcase/premium/page-tabs/index.d.ts

@@ -1,2 +0,0 @@
-export { PageTabsShowcase } from "./showcase";
-export { pageTabsMock } from "./mock";

package/dist/showcase/premium/page-tabs/index.js

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

package/dist/showcase/premium/page-tabs/mock.cjs

@@ -1,18 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import * as React from "react"
-import { PageTabs } from "tembro"
-
-export function Example() {
-  const [tab, setTab] = React.useState("overview")
-
-  return (
-    <PageTabs
-      value={tab}
-      onValueChange={(next) => setTab(next)}
-      items={[
-        { value: "overview", label: "Overview" },
-        { value: "billing", label: "Billing", badge: 2 },
-        { value: "activity", label: "Activity" },
-      ]}
-    />
-  )
-}`,highlights:[`Underline, pills, and cards variants`,`Route-sized section switching`,`Optional tab badges`,`Good semantic fit for page-level navigation`],scenarios:[{title:`Workspace sections`,description:`Switch between overview, billing, and activity at the route surface level.`},{title:`Settings pages`,description:`Organize major groups without building separate side navigation.`},{title:`Detail hubs`,description:`Keep related top-level sections visible across a broad content surface.`}],capabilityNotes:[`Use page-tabs for route-sized or section-sized navigation, not tiny inline toggles.`,`Choose pills/cards only when the visual context supports a stronger container.`,`If the options are just view toggles, button-group may be more appropriate.`]};exports.pageTabsMock=e;

package/dist/showcase/premium/page-tabs/mock.d.ts

@@ -1,2 +0,0 @@
-import type { ComponentDemoMock } from "../types";
-export declare const pageTabsMock: ComponentDemoMock;

package/dist/showcase/premium/page-tabs/mock.js

@@ -1,31 +0,0 @@
-//#region src/showcase/premium/page-tabs/mock.ts
-var e = {
-	code: "import * as React from \"react\"\nimport { PageTabs } from \"tembro\"\n\nexport function Example() {\n  const [tab, setTab] = React.useState(\"overview\")\n\n  return (\n    <PageTabs\n      value={tab}\n      onValueChange={(next) => setTab(next)}\n      items={[\n        { value: \"overview\", label: \"Overview\" },\n        { value: \"billing\", label: \"Billing\", badge: 2 },\n        { value: \"activity\", label: \"Activity\" },\n      ]}\n    />\n  )\n}",
-	highlights: [
-		"Underline, pills, and cards variants",
-		"Route-sized section switching",
-		"Optional tab badges",
-		"Good semantic fit for page-level navigation"
-	],
-	scenarios: [
-		{
-			title: "Workspace sections",
-			description: "Switch between overview, billing, and activity at the route surface level."
-		},
-		{
-			title: "Settings pages",
-			description: "Organize major groups without building separate side navigation."
-		},
-		{
-			title: "Detail hubs",
-			description: "Keep related top-level sections visible across a broad content surface."
-		}
-	],
-	capabilityNotes: [
-		"Use page-tabs for route-sized or section-sized navigation, not tiny inline toggles.",
-		"Choose pills/cards only when the visual context supports a stronger container.",
-		"If the options are just view toggles, button-group may be more appropriate."
-	]
-};
-//#endregion
-export { e as pageTabsMock };

package/dist/showcase/premium/page-tabs/showcase.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/ui/badge/index.cjs"),n=require("../../../components/navigation/page-tabs.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(`overview`),[c,l]=r.useState(`underline`);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:`Page navigation`}),(0,i.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`PageTabs should structure major sections, not minor control state`}),(0,i.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`This surface is for broad route or detail-page navigation where the user needs clear top-level section switching.`})]}),(0,i.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,i.jsx)(t.Badge,{variant:`outline`,className:`rounded-full`,children:`Route scale`}),(0,i.jsx)(t.Badge,{variant:`outline`,className:`rounded-full`,children:`Badge support`})]})]})}),(0,i.jsx)(`section`,{className:a,children:(0,i.jsx)(n.PageTabs,{value:o,variant:c,onValueChange:e=>s(e),items:[{value:`overview`,label:`Overview`},{value:`billing`,label:`Billing`,badge:2},{value:`activity`,label:`Activity`}]})}),(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:`Active tab`}),(0,i.jsx)(`p`,{className:`mt-3 text-base font-medium aui-text-strong`,children:o})]}),(0,i.jsxs)(`section`,{className:a,children:[(0,i.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Variant`}),(0,i.jsx)(`p`,{className:`mt-3 text-base font-medium aui-text-strong`,children:c})]})]}),e===`playground`?(0,i.jsx)(`section`,{className:a,children:(0,i.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,i.jsx)(`button`,{type:`button`,className:`rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm`,onClick:()=>l(`underline`),children:`Underline`}),(0,i.jsx)(`button`,{type:`button`,className:`rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm`,onClick:()=>l(`pills`),children:`Pills`}),(0,i.jsx)(`button`,{type:`button`,className:`rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm`,onClick:()=>l(`cards`),children:`Cards`})]})}):null]})}exports.PageTabsShowcase=o;

package/dist/showcase/premium/page-tabs/showcase.d.ts

@@ -1,3 +0,0 @@
-import * as React from "react";
-import type { ComponentDemoProps } from "../types";
-export declare function PageTabsShowcase({ mode }: ComponentDemoProps): React.JSX.Element;

package/dist/showcase/premium/page-tabs/showcase.js

@@ -1,121 +0,0 @@
-import { Badge as e } from "../../../components/ui/badge/index.js";
-import { PageTabs as t } from "../../../components/navigation/page-tabs.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/showcase/premium/page-tabs/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("overview"), [l, u] = n.useState("underline");
-	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: "Page navigation"
-							}),
-							/* @__PURE__ */ r("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "PageTabs should structure major sections, not minor control state"
-							}),
-							/* @__PURE__ */ r("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "This surface is for broad route or detail-page navigation where the user needs clear top-level section switching."
-							})
-						]
-					}), /* @__PURE__ */ i("div", {
-						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ r(e, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Route scale"
-						}), /* @__PURE__ */ r(e, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Badge support"
-						})]
-					})]
-				})
-			}),
-			/* @__PURE__ */ r("section", {
-				className: a,
-				children: /* @__PURE__ */ r(t, {
-					value: s,
-					variant: l,
-					onValueChange: (e) => c(e),
-					items: [
-						{
-							value: "overview",
-							label: "Overview"
-						},
-						{
-							value: "billing",
-							label: "Billing",
-							badge: 2
-						},
-						{
-							value: "activity",
-							label: "Activity"
-						}
-					]
-				})
-			}),
-			/* @__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: "Active tab"
-					}), /* @__PURE__ */ r("p", {
-						className: "mt-3 text-base font-medium aui-text-strong",
-						children: s
-					})]
-				}), /* @__PURE__ */ i("section", {
-					className: a,
-					children: [/* @__PURE__ */ r("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Variant"
-					}), /* @__PURE__ */ r("p", {
-						className: "mt-3 text-base font-medium aui-text-strong",
-						children: l
-					})]
-				})]
-			}),
-			o === "playground" ? /* @__PURE__ */ r("section", {
-				className: a,
-				children: /* @__PURE__ */ i("div", {
-					className: "flex flex-wrap gap-2",
-					children: [
-						/* @__PURE__ */ r("button", {
-							type: "button",
-							className: "rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm",
-							onClick: () => u("underline"),
-							children: "Underline"
-						}),
-						/* @__PURE__ */ r("button", {
-							type: "button",
-							className: "rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm",
-							onClick: () => u("pills"),
-							children: "Pills"
-						}),
-						/* @__PURE__ */ r("button", {
-							type: "button",
-							className: "rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm",
-							onClick: () => u("cards"),
-							children: "Cards"
-						})
-					]
-				})
-			}) : null
-		]
-	});
-}
-//#endregion
-export { o as PageTabsShowcase };

package/dist/showcase/premium/password-input/index.cjs

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

package/dist/showcase/premium/password-input/index.d.ts

@@ -1,2 +0,0 @@
-export { PasswordInputShowcase } from "./showcase";
-export { passwordInputMock } from "./mock";

package/dist/showcase/premium/password-input/index.js

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