tembro 3.1.17 → 4.0.0

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

@@ -1,158 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import { Calendar as n } from "../../../components/calendar/calendar.js";
-import * as r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/showcase/premium/calendar/showcase.tsx
-var o = "rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5", s = [
-	"2026-07-18",
-	"2026-07-19",
-	"2026-07-25"
-];
-function c({ mode: c }) {
-	let [l, u] = r.useState("2026-07-14"), [d, f] = r.useState({
-		from: "2026-07-10",
-		to: "2026-07-15"
-	}), [p, m] = r.useState(2);
-	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: "Date control"
-							}),
-							/* @__PURE__ */ i("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Calendar should feel precise, not decorative"
-							}),
-							/* @__PURE__ */ i("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "Real usage needs visible range selection, disabled business dates, and month comparison without clutter. This surface shows all three."
-							})
-						]
-					}), /* @__PURE__ */ a("div", {
-						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ i(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Range mode"
-						}), /* @__PURE__ */ i(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Blocked dates"
-						})]
-					})]
-				})
-			}),
-			/* @__PURE__ */ a("div", {
-				className: "grid gap-4 xl:grid-cols-[1.15fr_0.85fr]",
-				children: [/* @__PURE__ */ a("section", {
-					className: o,
-					children: [/* @__PURE__ */ i("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Range selection"
-					}), /* @__PURE__ */ i("div", {
-						className: "mt-4 overflow-x-auto pb-1",
-						children: /* @__PURE__ */ i(n, {
-							mode: "range",
-							range: d,
-							onRangeChange: f,
-							defaultMonth: "2026-07-01",
-							min: "2026-07-01",
-							max: "2026-08-31",
-							disabledDates: s,
-							numberOfMonths: p,
-							pagedNavigation: !0,
-							showClearShortcut: !0,
-							showTodayShortcut: !0,
-							showSelectionSummary: !0
-						})
-					})]
-				}), /* @__PURE__ */ a("div", {
-					className: "space-y-4",
-					children: [/* @__PURE__ */ a("section", {
-						className: o,
-						children: [/* @__PURE__ */ i("p", {
-							className: "text-sm font-medium aui-text-muted",
-							children: "Single date"
-						}), /* @__PURE__ */ i("div", {
-							className: "mt-4 overflow-x-auto pb-1",
-							children: /* @__PURE__ */ i(n, {
-								value: l,
-								onValueChange: u,
-								defaultMonth: "2026-07-01",
-								min: "2026-07-01",
-								max: "2026-07-31",
-								disabledDates: s,
-								showClearShortcut: !0,
-								showSelectionSummary: !0
-							})
-						})]
-					}), /* @__PURE__ */ a("section", {
-						className: o,
-						children: [/* @__PURE__ */ i("p", {
-							className: "text-sm font-medium aui-text-muted",
-							children: "Selection summary"
-						}), /* @__PURE__ */ a("div", {
-							className: "mt-4 space-y-3 text-sm leading-6 aui-text-muted",
-							children: [
-								/* @__PURE__ */ a("p", { children: ["Single: ", /* @__PURE__ */ i("span", {
-									className: "font-medium aui-text-strong",
-									children: l
-								})] }),
-								/* @__PURE__ */ a("p", { children: ["Range start: ", /* @__PURE__ */ i("span", {
-									className: "font-medium aui-text-strong",
-									children: d.from ?? "not selected"
-								})] }),
-								/* @__PURE__ */ a("p", { children: ["Range end: ", /* @__PURE__ */ i("span", {
-									className: "font-medium aui-text-strong",
-									children: d.to ?? "not selected"
-								})] })
-							]
-						})]
-					})]
-				})]
-			}),
-			c === "playground" ? /* @__PURE__ */ i("section", {
-				className: o,
-				children: /* @__PURE__ */ a("div", {
-					className: "flex flex-wrap gap-2",
-					children: [
-						/* @__PURE__ */ i(e, {
-							size: "sm",
-							variant: p === 1 ? "default" : "outline",
-							onClick: () => m(1),
-							children: "1 month"
-						}),
-						/* @__PURE__ */ i(e, {
-							size: "sm",
-							variant: p === 2 ? "default" : "outline",
-							onClick: () => m(2),
-							children: "2 months"
-						}),
-						/* @__PURE__ */ i(e, {
-							size: "sm",
-							variant: "outline",
-							onClick: () => {
-								u("2026-07-14"), f({
-									from: "2026-07-10",
-									to: "2026-07-15"
-								});
-							},
-							children: "Reset selection"
-						})
-					]
-				})
-			}) : null
-		]
-	});
-}
-//#endregion
-export { c as CalendarShowcase };

package/dist/src/showcase/premium/calendar-scheduler/index.cjs

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

package/dist/src/showcase/premium/calendar-scheduler/index.js

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

package/dist/src/showcase/premium/calendar-scheduler/mock.cjs

@@ -1,17 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { CalendarScheduler } from "tembro"
-
-export function Example() {
-  return (
-    <CalendarScheduler
-      variant="agenda"
-      density="compact"
-      title="Delivery schedule"
-      defaultSelectedEventId="1"
-      days={["Mon, Jul 6"]}
-      events={[
-        { id: "1", title: "Design review", description: "API review", date: "Mon, Jul 6", time: "10:00" },
-        { id: "2", title: "Release freeze", description: "Production gate", date: "Mon, Jul 6", time: "14:00" },
-      ]}
-    />
-  )
-}`,cliCommand:`npx tembro add calendar-scheduler`,highlights:[`Board and agenda variants with compact or comfortable density`,`Rich metadata, badges, hidden and disabled event states`,`Controlled or uncontrolled selection and custom event rendering`],scenarios:[{title:`Ops dashboard`,description:`Show day tasks by lane without heavy calendar widgets.`},{title:`Sprint board`,description:`Keep event density low and readable.`}]};exports.calendarSchedulerMock=e;

package/dist/src/showcase/premium/calendar-scheduler/mock.js

@@ -1,19 +0,0 @@
-//#region src/showcase/premium/calendar-scheduler/mock.ts
-var e = {
-	code: "import { CalendarScheduler } from \"tembro\"\n\nexport function Example() {\n  return (\n    <CalendarScheduler\n      variant=\"agenda\"\n      density=\"compact\"\n      title=\"Delivery schedule\"\n      defaultSelectedEventId=\"1\"\n      days={[\"Mon, Jul 6\"]}\n      events={[\n        { id: \"1\", title: \"Design review\", description: \"API review\", date: \"Mon, Jul 6\", time: \"10:00\" },\n        { id: \"2\", title: \"Release freeze\", description: \"Production gate\", date: \"Mon, Jul 6\", time: \"14:00\" },\n      ]}\n    />\n  )\n}",
-	cliCommand: "npx tembro add calendar-scheduler",
-	highlights: [
-		"Board and agenda variants with compact or comfortable density",
-		"Rich metadata, badges, hidden and disabled event states",
-		"Controlled or uncontrolled selection and custom event rendering"
-	],
-	scenarios: [{
-		title: "Ops dashboard",
-		description: "Show day tasks by lane without heavy calendar widgets."
-	}, {
-		title: "Sprint board",
-		description: "Keep event density low and readable."
-	}]
-};
-//#endregion
-export { e as calendarSchedulerMock };

package/dist/src/showcase/premium/calendar-scheduler/showcase.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/modern/calendar-scheduler.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");var i=[`Mon, Jul 6`,`Tue, Jul 7`,`Wed, Jul 8`];function a(){let[e,a]=n.useState(!0),[o,s]=n.useState(`agenda`),c=n.useMemo(()=>[{id:`1`,title:`Design review`,description:`Component API and release readiness`,meta:`Product room`,badge:(0,r.jsx)(`span`,{className:`rounded bg-amber-100 px-2 py-0.5 text-xs text-amber-800`,children:`Review`}),date:`Mon, Jul 6`,time:`10:00`,tone:`warning`},{id:`2`,title:`Release freeze`,description:`Production deployment checkpoint`,meta:`Platform team`,badge:(0,r.jsx)(`span`,{className:`rounded bg-red-100 px-2 py-0.5 text-xs text-red-800`,children:`Required`}),date:`Tue, Jul 7`,time:`14:00`,tone:`danger`},{id:`3`,title:`Daily standup`,description:`Owners, blockers and delivery status`,date:`Wed, Jul 8`,time:`09:30`,tone:`default`},...e?[{id:`4`,title:`Priority follow-up`,description:`Customer escalation review`,date:`Mon, Jul 6`,time:`16:00`,tone:`warning`}]:[]],[e]);return(0,r.jsxs)(`div`,{className:`space-y-3`,children:[(0,r.jsxs)(`div`,{className:`flex gap-2`,children:[(0,r.jsxs)(`button`,{type:`button`,className:`inline-flex items-center rounded-md border px-3 py-1.5 text-sm`,onClick:()=>s(e=>e===`agenda`?`board`:`agenda`),children:[`Use `,o===`agenda`?`board`:`agenda`]}),(0,r.jsx)(`button`,{type:`button`,className:`inline-flex items-center rounded-md border px-3 py-1.5 text-sm`,onClick:()=>a(e=>!e),children:e?`Hide warning`:`Show warning`})]}),(0,r.jsx)(t.CalendarScheduler,{title:`Delivery schedule`,description:`Production agenda with rich event metadata and selection.`,variant:o,density:`compact`,days:i,events:c,defaultSelectedEventId:`1`})]})}exports.CalendarSchedulerShowcase=a;

package/dist/src/showcase/premium/calendar-scheduler/showcase.js

@@ -1,82 +0,0 @@
-import { CalendarScheduler as e } from "../../../components/modern/calendar-scheduler.js";
-import * as t from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-//#region src/showcase/premium/calendar-scheduler/showcase.tsx
-var i = [
-	"Mon, Jul 6",
-	"Tue, Jul 7",
-	"Wed, Jul 8"
-];
-function a() {
-	let [a, o] = t.useState(!0), [s, c] = t.useState("agenda"), l = t.useMemo(() => [
-		{
-			id: "1",
-			title: "Design review",
-			description: "Component API and release readiness",
-			meta: "Product room",
-			badge: /* @__PURE__ */ n("span", {
-				className: "rounded bg-amber-100 px-2 py-0.5 text-xs text-amber-800",
-				children: "Review"
-			}),
-			date: "Mon, Jul 6",
-			time: "10:00",
-			tone: "warning"
-		},
-		{
-			id: "2",
-			title: "Release freeze",
-			description: "Production deployment checkpoint",
-			meta: "Platform team",
-			badge: /* @__PURE__ */ n("span", {
-				className: "rounded bg-red-100 px-2 py-0.5 text-xs text-red-800",
-				children: "Required"
-			}),
-			date: "Tue, Jul 7",
-			time: "14:00",
-			tone: "danger"
-		},
-		{
-			id: "3",
-			title: "Daily standup",
-			description: "Owners, blockers and delivery status",
-			date: "Wed, Jul 8",
-			time: "09:30",
-			tone: "default"
-		},
-		...a ? [{
-			id: "4",
-			title: "Priority follow-up",
-			description: "Customer escalation review",
-			date: "Mon, Jul 6",
-			time: "16:00",
-			tone: "warning"
-		}] : []
-	], [a]);
-	return /* @__PURE__ */ r("div", {
-		className: "space-y-3",
-		children: [/* @__PURE__ */ r("div", {
-			className: "flex gap-2",
-			children: [/* @__PURE__ */ r("button", {
-				type: "button",
-				className: "inline-flex items-center rounded-md border px-3 py-1.5 text-sm",
-				onClick: () => c((e) => e === "agenda" ? "board" : "agenda"),
-				children: ["Use ", s === "agenda" ? "board" : "agenda"]
-			}), /* @__PURE__ */ n("button", {
-				type: "button",
-				className: "inline-flex items-center rounded-md border px-3 py-1.5 text-sm",
-				onClick: () => o((e) => !e),
-				children: a ? "Hide warning" : "Show warning"
-			})]
-		}), /* @__PURE__ */ n(e, {
-			title: "Delivery schedule",
-			description: "Production agenda with rich event metadata and selection.",
-			variant: s,
-			density: "compact",
-			days: i,
-			events: l,
-			defaultSelectedEventId: "1"
-		})]
-	});
-}
-//#endregion
-export { a as CalendarSchedulerShowcase };

package/dist/src/showcase/premium/card/data.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=[{title:`Project rollout`,description:`Track release readiness across modules and teams.`,metrics:[`Design review: Passed`,`QA coverage: 84%`],badges:[`secondary`,`outline`],footer:`Updated 12 minutes ago`},{title:`Publish queue`,description:`3 items waiting for review`,metrics:[`Docs`,`QA`,`Blocking`],badges:[`secondary`,`outline`,`destructive`],footer:`Escalate if overdue`}];exports.cardDemoProjects=e;

package/dist/src/showcase/premium/card/data.js

@@ -1,24 +0,0 @@
-//#region src/showcase/premium/card/data.ts
-var e = [{
-	title: "Project rollout",
-	description: "Track release readiness across modules and teams.",
-	metrics: ["Design review: Passed", "QA coverage: 84%"],
-	badges: ["secondary", "outline"],
-	footer: "Updated 12 minutes ago"
-}, {
-	title: "Publish queue",
-	description: "3 items waiting for review",
-	metrics: [
-		"Docs",
-		"QA",
-		"Blocking"
-	],
-	badges: [
-		"secondary",
-		"outline",
-		"destructive"
-	],
-	footer: "Escalate if overdue"
-}];
-//#endregion
-export { e as cardDemoProjects };

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

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

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

@@ -1,4 +0,0 @@
-import { cardDemoProjects as e } from "./data.js";
-import { CardShowcase as t } from "./showcase.js";
-import { cardMock as n } from "./mock.js";
-export { t as CardShowcase, e as cardDemoProjects, n as cardMock };

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

@@ -1,18 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Badge, Card } from "tembro"
-
-export function Example() {
-  return (
-    <Card
-      title="Project status"
-      description="Release readiness and team alignment"
-      content={
-        <div className="space-y-2">
-          <p>Design review complete. QA pass: 84%.</p>
-          <Badge variant="secondary">Dashboard module</Badge>
-        </div>
-      }
-      footer="Updated 12 minutes ago"
-    />
-  )
-}
-`,cliCommand:`npx tembro add card`,highlights:[`Prop-driven surface`,`Compact density`,`Dashboard modules`,`Token-ready styling`],relatedBlockSlugs:[`dashboard-starter`,`sidebar-layout`,`users-table`],scenarios:[{title:`Status module`,description:`Show dense KPI or project status summaries.`},{title:`Feature card`,description:`Use cards for marketing sections and blocks.`},{title:`Compact card`,description:`Switch density for tighter dashboard layouts.`},{title:`Composed content shell`,description:`Assemble headers, media and metadata in one consistent surface.`}],capabilityNotes:[`Use title, description, content and footer props for the default ready-made card API.`,`Header/content/footer slot exports stay available only for advanced custom layouts.`,`Use size='sm' for dense dashboards and default for richer content blocks.`,`Avoid nesting cards; compose with sections, stacks, or lists instead.`,`Great as wrapper for forms, metric summaries and preview surfaces.`]};exports.cardMock=e;

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

@@ -1,43 +0,0 @@
-//#region src/showcase/premium/card/mock.ts
-var e = {
-	code: "import { Badge, Card } from \"tembro\"\n\nexport function Example() {\n  return (\n    <Card\n      title=\"Project status\"\n      description=\"Release readiness and team alignment\"\n      content={\n        <div className=\"space-y-2\">\n          <p>Design review complete. QA pass: 84%.</p>\n          <Badge variant=\"secondary\">Dashboard module</Badge>\n        </div>\n      }\n      footer=\"Updated 12 minutes ago\"\n    />\n  )\n}\n",
-	cliCommand: "npx tembro add card",
-	highlights: [
-		"Prop-driven surface",
-		"Compact density",
-		"Dashboard modules",
-		"Token-ready styling"
-	],
-	relatedBlockSlugs: [
-		"dashboard-starter",
-		"sidebar-layout",
-		"users-table"
-	],
-	scenarios: [
-		{
-			title: "Status module",
-			description: "Show dense KPI or project status summaries."
-		},
-		{
-			title: "Feature card",
-			description: "Use cards for marketing sections and blocks."
-		},
-		{
-			title: "Compact card",
-			description: "Switch density for tighter dashboard layouts."
-		},
-		{
-			title: "Composed content shell",
-			description: "Assemble headers, media and metadata in one consistent surface."
-		}
-	],
-	capabilityNotes: [
-		"Use title, description, content and footer props for the default ready-made card API.",
-		"Header/content/footer slot exports stay available only for advanced custom layouts.",
-		"Use size='sm' for dense dashboards and default for richer content blocks.",
-		"Avoid nesting cards; compose with sections, stacks, or lists instead.",
-		"Great as wrapper for forms, metric summaries and preview surfaces."
-	]
-};
-//#endregion
-export { e as cardMock };

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

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../components/ui/button/index.cjs"),t=require("../../../components/ui/card/index.cjs"),n=require("../../../components/ui/badge/index.cjs"),r=require("./data.cjs");let i=require("react/jsx-runtime");var a=[`secondary`,`outline`,`destructive`],o=`border-t border-[color:var(--aui-divider)] py-6`;function s({state:s}){let c=r.cardDemoProjects[0],l=r.cardDemoProjects[1];return(0,i.jsxs)(`div`,{className:`space-y-0`,children:[(0,i.jsx)(`section`,{className:`pb-6`,children:(0,i.jsxs)(`div`,{className:`flex flex-col gap-6 xl:flex-row xl:items-end 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:`Container`}),(0,i.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`One card should hold the whole story`}),(0,i.jsx)(`p`,{className:`mt-3 text-sm leading-6 aui-text-muted`,children:`Show one rich card and one compact card, not extra chrome around them.`})]}),(0,i.jsxs)(`div`,{className:`grid gap-3 sm:grid-cols-3 xl:min-w-[360px] xl:max-w-[420px]`,children:[(0,i.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,i.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted`,children:`Primary`}),(0,i.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:c.title})]}),(0,i.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,i.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted`,children:`Compact`}),(0,i.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:s.cardCompact?`Small`:`Default`})]}),(0,i.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,i.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted`,children:`Metrics`}),(0,i.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:c.metrics.length})]})]})]})}),(0,i.jsxs)(`section`,{className:o,children:[(0,i.jsxs)(`div`,{className:`grid gap-4 xl:grid-cols-[minmax(0,1.08fr)_minmax(0,0.92fr)]`,children:[(0,i.jsx)(t.Card,{size:s.cardCompact?`sm`:`default`,eyebrow:`Content`,title:c.title,description:c.description,badge:(0,i.jsx)(n.Badge,{tone:`success`,variant:`soft`,children:`Live`}),action:(0,i.jsx)(e.Button,{type:`button`,size:`xs`,variant:`outline`,children:`Open`}),content:(0,i.jsx)(`div`,{className:`grid gap-3 sm:grid-cols-3`,children:c.metrics.map(e=>(0,i.jsx)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] px-4 py-3 text-sm font-medium aui-text-strong`,children:e},e))}),footer:c.footer}),(0,i.jsx)(t.Card,{size:`sm`,interactive:!0,selected:!0,eyebrow:`Selectable`,title:l.title,description:l.description,content:(0,i.jsx)(`div`,{className:`flex flex-wrap gap-2`,children:l.metrics.map((e,t)=>(0,i.jsx)(n.Badge,{variant:a[t],children:e},e))}),footer:l.footer})]}),(0,i.jsxs)(`div`,{className:`mt-4 grid gap-4 xl:grid-cols-[minmax(0,0.92fr)_minmax(0,1.08fr)]`,children:[(0,i.jsx)(t.Card,{orientation:`horizontal`,mediaAspect:`square`,title:`Media card`,description:`The same Card primitive owns image, copy, action and footer slots.`,media:(0,i.jsx)(`div`,{className:`h-full min-h-36 bg-[linear-gradient(135deg,var(--primary),color-mix(in_oklch,var(--primary),white_42%))]`}),action:(0,i.jsx)(e.Button,{type:`button`,size:`xs`,children:`View`}),content:(0,i.jsx)(`p`,{className:`text-sm leading-6 aui-text-muted`,children:`Use media slots for previews, thumbnails, charts, or product visuals without creating another card component.`})}),(0,i.jsx)(t.Card,{size:`sm`,density:`compact`,title:`Compact action card`,description:`Dense layouts still use the same header, content and footer anatomy.`,content:(0,i.jsx)(`div`,{className:`text-sm aui-text-strong`,children:`12 files ready for review`}),footer:(0,i.jsx)(e.Button,{type:`button`,size:`xs`,variant:`secondary`,children:`Review files`})})]})]})]})}exports.CardShowcase=s;

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

@@ -1,154 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Card as t } from "../../../components/ui/card/index.js";
-import { Badge as n } from "../../../components/ui/badge/index.js";
-import { cardDemoProjects as r } from "./data.js";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/showcase/premium/card/showcase.tsx
-var o = [
-	"secondary",
-	"outline",
-	"destructive"
-], s = "border-t border-[color:var(--aui-divider)] py-6";
-function c({ state: c }) {
-	let l = r[0], u = r[1];
-	return /* @__PURE__ */ a("div", {
-		className: "space-y-0",
-		children: [/* @__PURE__ */ i("section", {
-			className: "pb-6",
-			children: /* @__PURE__ */ a("div", {
-				className: "flex flex-col gap-6 xl:flex-row xl:items-end 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: "Container"
-						}),
-						/* @__PURE__ */ i("h3", {
-							className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-							children: "One card should hold the whole story"
-						}),
-						/* @__PURE__ */ i("p", {
-							className: "mt-3 text-sm leading-6 aui-text-muted",
-							children: "Show one rich card and one compact card, not extra chrome around them."
-						})
-					]
-				}), /* @__PURE__ */ a("div", {
-					className: "grid gap-3 sm:grid-cols-3 xl:min-w-[360px] xl:max-w-[420px]",
-					children: [
-						/* @__PURE__ */ a("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-							children: [/* @__PURE__ */ i("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-								children: "Primary"
-							}), /* @__PURE__ */ i("p", {
-								className: "mt-2 text-lg font-semibold aui-text-strong",
-								children: l.title
-							})]
-						}),
-						/* @__PURE__ */ a("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-							children: [/* @__PURE__ */ i("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-								children: "Compact"
-							}), /* @__PURE__ */ i("p", {
-								className: "mt-2 text-lg font-semibold aui-text-strong",
-								children: c.cardCompact ? "Small" : "Default"
-							})]
-						}),
-						/* @__PURE__ */ a("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-							children: [/* @__PURE__ */ i("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-								children: "Metrics"
-							}), /* @__PURE__ */ i("p", {
-								className: "mt-2 text-lg font-semibold aui-text-strong",
-								children: l.metrics.length
-							})]
-						})
-					]
-				})]
-			})
-		}), /* @__PURE__ */ a("section", {
-			className: s,
-			children: [/* @__PURE__ */ a("div", {
-				className: "grid gap-4 xl:grid-cols-[minmax(0,1.08fr)_minmax(0,0.92fr)]",
-				children: [/* @__PURE__ */ i(t, {
-					size: c.cardCompact ? "sm" : "default",
-					eyebrow: "Content",
-					title: l.title,
-					description: l.description,
-					badge: /* @__PURE__ */ i(n, {
-						tone: "success",
-						variant: "soft",
-						children: "Live"
-					}),
-					action: /* @__PURE__ */ i(e, {
-						type: "button",
-						size: "xs",
-						variant: "outline",
-						children: "Open"
-					}),
-					content: /* @__PURE__ */ i("div", {
-						className: "grid gap-3 sm:grid-cols-3",
-						children: l.metrics.map((e) => /* @__PURE__ */ i("div", {
-							className: "rounded-xl border border-[color:var(--aui-divider)] px-4 py-3 text-sm font-medium aui-text-strong",
-							children: e
-						}, e))
-					}),
-					footer: l.footer
-				}), /* @__PURE__ */ i(t, {
-					size: "sm",
-					interactive: !0,
-					selected: !0,
-					eyebrow: "Selectable",
-					title: u.title,
-					description: u.description,
-					content: /* @__PURE__ */ i("div", {
-						className: "flex flex-wrap gap-2",
-						children: u.metrics.map((e, t) => /* @__PURE__ */ i(n, {
-							variant: o[t],
-							children: e
-						}, e))
-					}),
-					footer: u.footer
-				})]
-			}), /* @__PURE__ */ a("div", {
-				className: "mt-4 grid gap-4 xl:grid-cols-[minmax(0,0.92fr)_minmax(0,1.08fr)]",
-				children: [/* @__PURE__ */ i(t, {
-					orientation: "horizontal",
-					mediaAspect: "square",
-					title: "Media card",
-					description: "The same Card primitive owns image, copy, action and footer slots.",
-					media: /* @__PURE__ */ i("div", { className: "h-full min-h-36 bg-[linear-gradient(135deg,var(--primary),color-mix(in_oklch,var(--primary),white_42%))]" }),
-					action: /* @__PURE__ */ i(e, {
-						type: "button",
-						size: "xs",
-						children: "View"
-					}),
-					content: /* @__PURE__ */ i("p", {
-						className: "text-sm leading-6 aui-text-muted",
-						children: "Use media slots for previews, thumbnails, charts, or product visuals without creating another card component."
-					})
-				}), /* @__PURE__ */ i(t, {
-					size: "sm",
-					density: "compact",
-					title: "Compact action card",
-					description: "Dense layouts still use the same header, content and footer anatomy.",
-					content: /* @__PURE__ */ i("div", {
-						className: "text-sm aui-text-strong",
-						children: "12 files ready for review"
-					}),
-					footer: /* @__PURE__ */ i(e, {
-						type: "button",
-						size: "xs",
-						variant: "secondary",
-						children: "Review files"
-					})
-				})]
-			})]
-		})]
-	});
-}
-//#endregion
-export { c as CardShowcase };

package/dist/src/showcase/premium/card/types.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});

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

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

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

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

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

@@ -1,11 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Carousel, CarouselItem } from "tembro"
-
-export function Example() {
-  return (
-    <Carousel defaultIndex={0} showDots showArrows>
-      <CarouselItem><div className="rounded-xl bg-card p-4">Card 1</div></CarouselItem>
-      <CarouselItem><div className="rounded-xl bg-card p-4">Card 2</div></CarouselItem>
-      <CarouselItem><div className="rounded-xl bg-card p-4">Card 3</div></CarouselItem>
-    </Carousel>
-  )
-}`,cliCommand:`npx tembro add carousel`,highlights:[`Keyboard and control-aware slider`,`Works with any slide content`,`Useful for onboarding and feature snippets`],scenarios:[{title:`Feature tour`,description:`Move users through short product highlights.`},{title:`Feature cards`,description:`Show a compact stack of feature cards without heavy tabs.`},{title:`Promo strip`,description:`Rotate content in dashboard marketing blocks.`}]};exports.carouselMock=e;

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

@@ -1,26 +0,0 @@
-//#region src/showcase/premium/carousel/mock.ts
-var e = {
-	code: "import { Carousel, CarouselItem } from \"tembro\"\n\nexport function Example() {\n  return (\n    <Carousel defaultIndex={0} showDots showArrows>\n      <CarouselItem><div className=\"rounded-xl bg-card p-4\">Card 1</div></CarouselItem>\n      <CarouselItem><div className=\"rounded-xl bg-card p-4\">Card 2</div></CarouselItem>\n      <CarouselItem><div className=\"rounded-xl bg-card p-4\">Card 3</div></CarouselItem>\n    </Carousel>\n  )\n}",
-	cliCommand: "npx tembro add carousel",
-	highlights: [
-		"Keyboard and control-aware slider",
-		"Works with any slide content",
-		"Useful for onboarding and feature snippets"
-	],
-	scenarios: [
-		{
-			title: "Feature tour",
-			description: "Move users through short product highlights."
-		},
-		{
-			title: "Feature cards",
-			description: "Show a compact stack of feature cards without heavy tabs."
-		},
-		{
-			title: "Promo strip",
-			description: "Rotate content in dashboard marketing blocks."
-		}
-	]
-};
-//#endregion
-export { e as carouselMock };

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

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs"),n=require("../../../components/ui/button/index.cjs"),r=require("../../../components/display/carousel.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=[{title:`Onboarding`,text:`Guide quickly from first login.`,tone:`Launch`,detail:`Hero slider for product onboarding and release tours.`},{title:`Components`,text:`Review ready-made dashboard patterns.`,tone:`Library`,detail:`Card rail, docs previews, and swipe-ready gallery states.`},{title:`Release`,text:`Publish, test, and iterate faster.`,tone:`Ship`,detail:`Active slide details stay below the main frame for context.`}];function s(){let[e,s]=i.useState(!0),[c,l]=i.useState(!0),[u,d]=i.useState(!1),[f,p]=i.useState(0),[m,h]=i.useState(!1);return(0,a.jsxs)(`div`,{className:`space-y-5`,children:[(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-3`,children:[(0,a.jsxs)(n.Button,{size:`sm`,variant:e?`default`:`outline`,onClick:()=>s(e=>!e),children:[e?`Hide`:`Show`,` arrows`]}),(0,a.jsxs)(n.Button,{size:`sm`,variant:c?`default`:`outline`,onClick:()=>l(e=>!e),children:[c?`Hide`:`Show`,` dots`]}),(0,a.jsxs)(n.Button,{size:`sm`,variant:u?`default`:`outline`,onClick:()=>d(e=>!e),children:[u?`Stop`:`Start`,` autoplay`]})]}),(0,a.jsx)(`div`,{className:`grid gap-3 md:grid-cols-3`,children:o.map((e,t)=>(0,a.jsxs)(n.Button,{type:`button`,variant:f===t?`default`:`outline`,className:`justify-start`,onClick:()=>p(t),children:[t+1,`. `,e.title]},e.title))}),(0,a.jsx)(r.Carousel,{index:f,loop:!0,showArrows:e,showDots:c,showStatus:!0,showThumbnails:!0,autoplay:u,autoplayInterval:2200,showPlaybackControl:!0,aspectRatio:`16 / 9`,onIndexChange:e=>p(e),onAutoplayChange:h,previousLabel:`Previous slide`,nextLabel:`Next slide`,renderThumbnail:(e,n,r)=>(0,a.jsxs)(`div`,{className:t.cn(`grid gap-1 p-3`,r&&`bg-primary/5`),children:[(0,a.jsxs)(`div`,{className:`text-[11px] font-semibold uppercase tracking-[0.18em] text-muted-foreground`,children:[`0`,n+1]}),(0,a.jsx)(`div`,{className:`text-sm font-medium text-foreground`,children:o[n]?.title})]}),renderActiveDetail:(e,t)=>(0,a.jsxs)(`div`,{className:`rounded-[20px] border border-border/70 bg-card/80 p-4`,children:[(0,a.jsx)(`p`,{className:`text-sm font-semibold text-foreground`,children:o[t]?.title}),(0,a.jsx)(`p`,{className:`mt-1 text-sm text-muted-foreground`,children:o[t]?.detail})]}),children:o.map((e,t)=>(0,a.jsx)(r.CarouselItem,{children:(0,a.jsx)(`div`,{className:`min-h-56 rounded-xl border border-border bg-card p-8`,children:(0,a.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,a.jsxs)(`div`,{className:`grid gap-2`,children:[(0,a.jsx)(`p`,{className:`text-[11px] font-semibold uppercase tracking-[0.24em] text-primary`,children:e.tone}),(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.2em] text-muted-foreground`,children:`Slide ${t+1}`}),(0,a.jsx)(`h3`,{className:`text-lg font-semibold text-foreground`,children:e.title}),(0,a.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.text})]}),(0,a.jsxs)(`div`,{className:`rounded-full border border-border/70 px-3 py-1 text-xs text-muted-foreground`,children:[t+1,`/`,o.length]})]})})},e.title))}),(0,a.jsxs)(`div`,{className:`text-sm text-muted-foreground`,children:[`Playback: `,m||u?`active`:`paused`]})]})}exports.CarouselShowcase=s;