tembro 3.0.0 → 3.1.5

package/dist/showcase/premium/descriptions/showcase.js

@@ -1,85 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Descriptions as t } from "../../../components/display/descriptions.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/showcase/premium/descriptions/showcase.tsx
-function a() {
-	let [a, o] = n.useState(3), [s, c] = n.useState(!0);
-	return /* @__PURE__ */ i("div", {
-		className: "space-y-5",
-		children: [/* @__PURE__ */ i("div", {
-			className: "flex flex-wrap gap-2",
-			children: [
-				/* @__PURE__ */ r(e, {
-					size: "sm",
-					variant: a === 1 ? "default" : "outline",
-					onClick: () => o(1),
-					children: "1 col"
-				}),
-				/* @__PURE__ */ r(e, {
-					size: "sm",
-					variant: a === 2 ? "default" : "outline",
-					onClick: () => o(2),
-					children: "2 col"
-				}),
-				/* @__PURE__ */ r(e, {
-					size: "sm",
-					variant: a === 3 ? "default" : "outline",
-					onClick: () => o(3),
-					children: "3 col"
-				}),
-				/* @__PURE__ */ r(e, {
-					size: "sm",
-					variant: a === 4 ? "default" : "outline",
-					onClick: () => o(4),
-					children: "4 col"
-				}),
-				/* @__PURE__ */ r(e, {
-					size: "sm",
-					variant: s ? "default" : "outline",
-					onClick: () => c((e) => !e),
-					children: s ? "Bordered" : "Unbordered"
-				})
-			]
-		}), /* @__PURE__ */ r(t, {
-			title: "Project profile",
-			extra: /* @__PURE__ */ r("span", {
-				className: "text-sm text-muted-foreground",
-				children: "Draft"
-			}),
-			bordered: s,
-			columns: a,
-			items: [
-				{
-					key: "owner",
-					label: "Owner",
-					value: "Azamat UI Team"
-				},
-				{
-					key: "status",
-					label: "Status",
-					value: "In review"
-				},
-				{
-					key: "release",
-					label: "Release",
-					value: "v0.3.27",
-					span: 2
-				},
-				{
-					key: "stack",
-					label: "Tech",
-					value: "React + Tailwind"
-				},
-				{
-					key: "source",
-					label: "Source",
-					value: "Package-first components",
-					span: 4
-				}
-			]
-		})]
-	});
-}
-//#endregion
-export { a as DescriptionsShowcase };

package/dist/showcase/premium/hover-card/index.cjs

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

package/dist/showcase/premium/hover-card/index.d.ts

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

package/dist/showcase/premium/hover-card/index.js

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

package/dist/showcase/premium/hover-card/mock.cjs

@@ -1,10 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Avatar, HoverCard } from "tembro"
-
-export function Example() {
-  return (
-    <HoverCard
-      trigger={<Avatar fallback="AJ" />}
-      content={<div className="space-y-1"><p className="font-medium">Azamat</p><p className="text-sm text-muted-foreground">Design system owner</p></div>}
-    />
-  )
-}`,htmlCode:`<div data-slot="hover-card"></div>`,cliCommand:`npx tembro add hover-card`,highlights:[`Entity preview`,`Hover + focus`,`Secondary context`,`Compact detail card`],relatedBlockSlugs:[`crm-dashboard`,`users-table`,`settings-form`],scenarios:[{title:`User preview`,description:`Reveal compact profile details without opening a full panel.`},{title:`Card summary`,description:`Useful for metrics and owners in dense dashboard layouts.`},{title:`Secondary context`,description:`Show supporting data only when the user intentionally pauses.`}],capabilityNotes:[`HoverCard is for richer secondary context than Tooltip.`,`Keep content compact; if users need actions, switch to Popover.`,`Always ensure trigger remains meaningful without the reveal card.`,`Support focus states so keyboard users can access the same content.`]};exports.hoverCardMock=e;

package/dist/showcase/premium/hover-card/mock.d.ts

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

package/dist/showcase/premium/hover-card/mock.js

@@ -1,39 +0,0 @@
-//#region src/showcase/premium/hover-card/mock.ts
-var e = {
-	code: "import { Avatar, HoverCard } from \"tembro\"\n\nexport function Example() {\n  return (\n    <HoverCard\n      trigger={<Avatar fallback=\"AJ\" />}\n      content={<div className=\"space-y-1\"><p className=\"font-medium\">Azamat</p><p className=\"text-sm text-muted-foreground\">Design system owner</p></div>}\n    />\n  )\n}",
-	htmlCode: "<div data-slot=\"hover-card\"></div>",
-	cliCommand: "npx tembro add hover-card",
-	highlights: [
-		"Entity preview",
-		"Hover + focus",
-		"Secondary context",
-		"Compact detail card"
-	],
-	relatedBlockSlugs: [
-		"crm-dashboard",
-		"users-table",
-		"settings-form"
-	],
-	scenarios: [
-		{
-			title: "User preview",
-			description: "Reveal compact profile details without opening a full panel."
-		},
-		{
-			title: "Card summary",
-			description: "Useful for metrics and owners in dense dashboard layouts."
-		},
-		{
-			title: "Secondary context",
-			description: "Show supporting data only when the user intentionally pauses."
-		}
-	],
-	capabilityNotes: [
-		"HoverCard is for richer secondary context than Tooltip.",
-		"Keep content compact; if users need actions, switch to Popover.",
-		"Always ensure trigger remains meaningful without the reveal card.",
-		"Support focus states so keyboard users can access the same content."
-	]
-};
-//#endregion
-export { e as hoverCardMock };

package/dist/showcase/premium/hover-card/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/hover-card.cjs"),r=require("../../../components/display/avatar.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=[`bottom`,`right`,`top`,`left`],s=`border-t border-[color:var(--aui-divider)] py-6`;function c(){let[e,c]=i.useState(`bottom`);return(0,a.jsxs)(`div`,{className:`space-y-0`,children:[(0,a.jsx)(`section`,{className:`pb-6`,children:(0,a.jsxs)(`div`,{className:`flex flex-col gap-6 xl:flex-row xl:items-end 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:`Hover card`}),(0,a.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Richer than tooltip, lighter than popover`}),(0,a.jsx)(`p`,{className:`mt-3 text-sm leading-6 aui-text-muted`,children:`Use hover card when one entity preview needs a bit more room but still should feel lightweight.`})]}),(0,a.jsxs)(`div`,{className:`grid gap-3 sm:grid-cols-3 xl:min-w-[360px] xl:max-w-[420px]`,children:[(0,a.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted`,children:`Side`}),(0,a.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong capitalize`,children:e})]}),(0,a.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted`,children:`Use for`}),(0,a.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:`Entity preview`})]}),(0,a.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3`,children:[(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted`,children:`Avoid for`}),(0,a.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:`Heavy actions`})]})]})]})}),(0,a.jsx)(`section`,{className:s,children:(0,a.jsx)(`div`,{className:`flex min-h-52 items-center justify-center rounded-[22px] border border-[color:var(--aui-divider)] p-5`,children:(0,a.jsx)(n.HoverCard,{side:e,trigger:(0,a.jsx)(`button`,{type:`button`,className:`rounded-full border border-[color:var(--aui-divider)] p-1`,children:(0,a.jsx)(r.Avatar,{fallback:`AJ`})}),content:(0,a.jsxs)(`div`,{className:`space-y-1`,children:[(0,a.jsx)(`p`,{className:`font-medium`,children:`Azamat Jurayev`}),(0,a.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:`Design system owner`}),(0,a.jsx)(`p`,{className:`text-xs text-muted-foreground`,children:`Keeps public components and package releases in sync.`})]})})})}),(0,a.jsx)(`section`,{className:s,children:(0,a.jsx)(`div`,{className:`flex flex-wrap gap-2`,children:o.map(n=>(0,a.jsx)(t.Button,{type:`button`,size:`sm`,variant:e===n?`default`:`secondary`,onClick:()=>c(n),children:n},n))})})]})}exports.HoverCardShowcase=c;

package/dist/showcase/premium/hover-card/showcase.d.ts

@@ -1,2 +0,0 @@
-import * as React from "react";
-export declare function HoverCardShowcase(): React.JSX.Element;

package/dist/showcase/premium/hover-card/showcase.js

@@ -1,123 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { HoverCard as t } from "../../../components/ui/hover-card.js";
-import { Avatar as n } from "../../../components/display/avatar.js";
-import * as r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-//#region src/showcase/premium/hover-card/showcase.tsx
-var o = [
-	"bottom",
-	"right",
-	"top",
-	"left"
-], s = "border-t border-[color:var(--aui-divider)] py-6";
-function c() {
-	let [c, l] = r.useState("bottom");
-	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: "Hover card"
-							}),
-							/* @__PURE__ */ i("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Richer than tooltip, lighter than popover"
-							}),
-							/* @__PURE__ */ i("p", {
-								className: "mt-3 text-sm leading-6 aui-text-muted",
-								children: "Use hover card when one entity preview needs a bit more room but still should feel lightweight."
-							})
-						]
-					}), /* @__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: "Side"
-								}), /* @__PURE__ */ i("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong capitalize",
-									children: c
-								})]
-							}),
-							/* @__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: "Use for"
-								}), /* @__PURE__ */ i("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong",
-									children: "Entity preview"
-								})]
-							}),
-							/* @__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: "Avoid for"
-								}), /* @__PURE__ */ i("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong",
-									children: "Heavy actions"
-								})]
-							})
-						]
-					})]
-				})
-			}),
-			/* @__PURE__ */ i("section", {
-				className: s,
-				children: /* @__PURE__ */ i("div", {
-					className: "flex min-h-52 items-center justify-center rounded-[22px] border border-[color:var(--aui-divider)] p-5",
-					children: /* @__PURE__ */ i(t, {
-						side: c,
-						trigger: /* @__PURE__ */ i("button", {
-							type: "button",
-							className: "rounded-full border border-[color:var(--aui-divider)] p-1",
-							children: /* @__PURE__ */ i(n, { fallback: "AJ" })
-						}),
-						content: /* @__PURE__ */ a("div", {
-							className: "space-y-1",
-							children: [
-								/* @__PURE__ */ i("p", {
-									className: "font-medium",
-									children: "Azamat Jurayev"
-								}),
-								/* @__PURE__ */ i("p", {
-									className: "text-sm text-muted-foreground",
-									children: "Design system owner"
-								}),
-								/* @__PURE__ */ i("p", {
-									className: "text-xs text-muted-foreground",
-									children: "Keeps public components and package releases in sync."
-								})
-							]
-						})
-					})
-				})
-			}),
-			/* @__PURE__ */ i("section", {
-				className: s,
-				children: /* @__PURE__ */ i("div", {
-					className: "flex flex-wrap gap-2",
-					children: o.map((t) => /* @__PURE__ */ i(e, {
-						type: "button",
-						size: "sm",
-						variant: c === t ? "default" : "secondary",
-						onClick: () => l(t),
-						children: t
-					}, t))
-				})
-			})
-		]
-	});
-}
-//#endregion
-export { c as HoverCardShowcase };

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

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

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

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

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

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

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

@@ -1,17 +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("AA-123")
-
-  return (
-    <Input
-      kind="masked"
-      value={value}
-      onValueChange={(nextValue) => setValue(nextValue)}
-      mask={(raw: string) => raw.toUpperCase().slice(0, 6).replace(/(.{3})(?=.)/, "$1-")}
-      placeholder="AA-123"
-    />
-  )
-}
-`,htmlCode:`<label for="masked">Referral code</label><input id="masked" type="text" value="AA-123" placeholder="AA-123" />`,cliCommand:`npx tembro add input`,highlights:[`Mask callback runs on each edit`,`Uppercase and slicing are explicit formatting assumptions`,`Raw value assumptions should be mirrored in validation and submit payloads`,`Use a deterministic placeholder that matches the mask contract`],relatedBlockSlugs:[`settings-form`,`crm-dashboard`,`auth-sign-in`],scenarios:[{title:`Referral codes`,description:`Use fixed pattern for short identifiers while typing.`},{title:`License keys`,description:`Apply grouping with a strict uppercase format and controlled length.`},{title:`Display normalization`,description:`Normalize display while preserving form-level expectations.`},{title:`Validation gate`,description:`Reject submission when value shape does not match mask contract.`}],capabilityNotes:[`Document whether callback receives raw text or already masked text.`,`If you need raw payload, sanitize before submit and keep canonical storage layer separate.`,`Use one mask function source for both form and API submission paths.`,`Treat partially typed values as invalid until user completion conditions are met.`]};exports.maskedInputMock=e;

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

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

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

@@ -1,43 +0,0 @@
-//#region src/showcase/premium/masked-input/mock.ts
-var e = {
-	code: "import { useState } from \"react\"\nimport { Input } from \"tembro\"\n\nexport function Example() {\n  const [value, setValue] = useState(\"AA-123\")\n\n  return (\n    <Input\n      kind=\"masked\"\n      value={value}\n      onValueChange={(nextValue) => setValue(nextValue)}\n      mask={(raw: string) => raw.toUpperCase().slice(0, 6).replace(/(.{3})(?=.)/, \"$1-\")}\n      placeholder=\"AA-123\"\n    />\n  )\n}\n",
-	htmlCode: "<label for=\"masked\">Referral code</label><input id=\"masked\" type=\"text\" value=\"AA-123\" placeholder=\"AA-123\" />",
-	cliCommand: "npx tembro add input",
-	highlights: [
-		"Mask callback runs on each edit",
-		"Uppercase and slicing are explicit formatting assumptions",
-		"Raw value assumptions should be mirrored in validation and submit payloads",
-		"Use a deterministic placeholder that matches the mask contract"
-	],
-	relatedBlockSlugs: [
-		"settings-form",
-		"crm-dashboard",
-		"auth-sign-in"
-	],
-	scenarios: [
-		{
-			title: "Referral codes",
-			description: "Use fixed pattern for short identifiers while typing."
-		},
-		{
-			title: "License keys",
-			description: "Apply grouping with a strict uppercase format and controlled length."
-		},
-		{
-			title: "Display normalization",
-			description: "Normalize display while preserving form-level expectations."
-		},
-		{
-			title: "Validation gate",
-			description: "Reject submission when value shape does not match mask contract."
-		}
-	],
-	capabilityNotes: [
-		"Document whether callback receives raw text or already masked text.",
-		"If you need raw payload, sanitize before submit and keep canonical storage layer separate.",
-		"Use one mask function source for both form and API submission paths.",
-		"Treat partially typed values as invalid until user completion conditions are met."
-	]
-};
-//#endregion
-export { e as maskedInputMock };

package/dist/showcase/premium/masked-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({mode:r}){let[i,a]=(0,t.useState)(`AA-123`);return(0,n.jsxs)(`div`,{className:`space-y-4`,children:[(0,n.jsx)(e.Input,{kind:`masked`,value:i,onValueChange:e=>a(e),mask:e=>e.toUpperCase().slice(0,6).replace(/(.{3})(?=.)/,`$1-`),placeholder:`AA-123`}),(0,n.jsxs)(`p`,{className:`aui-text-subtle text-sm`,children:[`Display value: `,i||`—`]}),(0,n.jsx)(`p`,{className:`aui-text-muted text-sm`,children:`Task focus: fixed-format field where raw/display value assumptions should be documented.`}),(0,n.jsxs)(`p`,{className:`aui-text-muted text-sm`,children:[`Mode: `,r]})]})}exports.MaskedInputShowcase=r;

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

@@ -1,2 +0,0 @@
-import type { ComponentDemoProps } from "../types";
-export declare function MaskedInputShowcase({ mode }: ComponentDemoProps): import("react").JSX.Element;

package/dist/showcase/premium/masked-input/showcase.js

@@ -1,33 +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/masked-input/showcase.tsx
-function i({ mode: i }) {
-	let [a, o] = t("AA-123");
-	return /* @__PURE__ */ r("div", {
-		className: "space-y-4",
-		children: [
-			/* @__PURE__ */ n(e, {
-				kind: "masked",
-				value: a,
-				onValueChange: (e) => o(e),
-				mask: (e) => e.toUpperCase().slice(0, 6).replace(/(.{3})(?=.)/, "$1-"),
-				placeholder: "AA-123"
-			}),
-			/* @__PURE__ */ r("p", {
-				className: "aui-text-subtle text-sm",
-				children: ["Display value: ", a || "—"]
-			}),
-			/* @__PURE__ */ n("p", {
-				className: "aui-text-muted text-sm",
-				children: "Task focus: fixed-format field where raw/display value assumptions should be documented."
-			}),
-			/* @__PURE__ */ r("p", {
-				className: "aui-text-muted text-sm",
-				children: ["Mode: ", i]
-			})
-		]
-	});
-}
-//#endregion
-export { i as MaskedInputShowcase };

package/dist/showcase/premium/menubar/index.cjs

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

package/dist/showcase/premium/menubar/index.d.ts

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

package/dist/showcase/premium/menubar/index.js

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

package/dist/showcase/premium/menubar/mock.cjs

@@ -1,15 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarTrigger } from "tembro"
-
-export function Example() {
-  return (
-    <Menubar>
-      <MenubarMenu>
-        <MenubarTrigger>File</MenubarTrigger>
-        <MenubarContent>
-          <MenubarItem>New project</MenubarItem>
-          <MenubarItem>Open</MenubarItem>
-        </MenubarContent>
-      </MenubarMenu>
-    </Menubar>
-  )
-}`,cliCommand:`npx tembro add menubar`,highlights:[`Composable menubar surfaces with grouped actions`,`Trigger + content + item primitives`],scenarios:[{title:`Editor top bar`,description:`Display grouped app actions in one compact area.`},{title:`Admin tools`,description:`Expose grouped controls without full menu system overhead.`}]};exports.menubarMock=e;

package/dist/showcase/premium/menubar/mock.d.ts

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

package/dist/showcase/premium/menubar/mock.js

@@ -1,15 +0,0 @@
-//#region src/showcase/premium/menubar/mock.ts
-var e = {
-	code: "import { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarTrigger } from \"tembro\"\n\nexport function Example() {\n  return (\n    <Menubar>\n      <MenubarMenu>\n        <MenubarTrigger>File</MenubarTrigger>\n        <MenubarContent>\n          <MenubarItem>New project</MenubarItem>\n          <MenubarItem>Open</MenubarItem>\n        </MenubarContent>\n      </MenubarMenu>\n    </Menubar>\n  )\n}",
-	cliCommand: "npx tembro add menubar",
-	highlights: ["Composable menubar surfaces with grouped actions", "Trigger + content + item primitives"],
-	scenarios: [{
-		title: "Editor top bar",
-		description: "Display grouped app actions in one compact area."
-	}, {
-		title: "Admin tools",
-		description: "Expose grouped controls without full menu system overhead."
-	}]
-};
-//#endregion
-export { e as menubarMock };

package/dist/showcase/premium/menubar/showcase.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../components/modern/menubar.cjs");let t=require("react/jsx-runtime");function n(){return(0,t.jsxs)(`div`,{className:`space-y-3`,children:[(0,t.jsxs)(e.Menubar,{className:`w-fit`,children:[(0,t.jsxs)(e.MenubarMenu,{children:[(0,t.jsx)(e.MenubarTrigger,{children:`File`}),(0,t.jsxs)(e.MenubarContent,{children:[(0,t.jsx)(e.MenubarItem,{children:`New project`}),(0,t.jsx)(e.MenubarItem,{children:`Open`}),(0,t.jsx)(e.MenubarItem,{children:`Save`})]})]}),(0,t.jsxs)(e.MenubarMenu,{children:[(0,t.jsx)(e.MenubarTrigger,{children:`Edit`}),(0,t.jsxs)(e.MenubarContent,{children:[(0,t.jsx)(e.MenubarItem,{children:`Undo`}),(0,t.jsx)(e.MenubarItem,{children:`Redo`}),(0,t.jsx)(e.MenubarItem,{children:`Find`})]})]})]}),(0,t.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:`Menubar is a non-dropdown primitive. Use it as a command surface for quick contextual actions.`})]})}exports.MenubarShowcase=n;

package/dist/showcase/premium/menubar/showcase.d.ts

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

package/dist/showcase/premium/menubar/showcase.js

@@ -1,25 +0,0 @@
-import { Menubar as e, MenubarContent as t, MenubarItem as n, MenubarMenu as r, MenubarTrigger as i } from "../../../components/modern/menubar.js";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-//#region src/showcase/premium/menubar/showcase.tsx
-function s() {
-	return /* @__PURE__ */ o("div", {
-		className: "space-y-3",
-		children: [/* @__PURE__ */ o(e, {
-			className: "w-fit",
-			children: [/* @__PURE__ */ o(r, { children: [/* @__PURE__ */ a(i, { children: "File" }), /* @__PURE__ */ o(t, { children: [
-				/* @__PURE__ */ a(n, { children: "New project" }),
-				/* @__PURE__ */ a(n, { children: "Open" }),
-				/* @__PURE__ */ a(n, { children: "Save" })
-			] })] }), /* @__PURE__ */ o(r, { children: [/* @__PURE__ */ a(i, { children: "Edit" }), /* @__PURE__ */ o(t, { children: [
-				/* @__PURE__ */ a(n, { children: "Undo" }),
-				/* @__PURE__ */ a(n, { children: "Redo" }),
-				/* @__PURE__ */ a(n, { children: "Find" })
-			] })] })]
-		}), /* @__PURE__ */ a("p", {
-			className: "text-sm text-muted-foreground",
-			children: "Menubar is a non-dropdown primitive. Use it as a command surface for quick contextual actions."
-		})]
-	});
-}
-//#endregion
-export { s as MenubarShowcase };

package/dist/showcase/premium/metric-grid/index.cjs

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

package/dist/showcase/premium/metric-grid/index.d.ts

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

package/dist/showcase/premium/metric-grid/index.js

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

package/dist/showcase/premium/metric-grid/mock.cjs

@@ -1,11 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { MetricGrid } from "tembro"
-
-const items = [
-  { key: "users", label: "Users", value: "2,410", description: "Last 30 days" },
-  { key: "revenue", label: "Revenue", value: "$132k", description: "Compared with last month" },
-  { key: "errors", label: "Errors", value: "3", description: "Attention required" },
-]
-
-export function Example() {
-  return <MetricGrid items={items} columns={3} />
-}`,highlights:[`Dashboard-ready KPI tiles`,`Tone-based urgency states`,`Compact mode`,`Composable label and trend`],relatedBlockSlugs:[`dashboard-starter`,`crm-dashboard`,`users-table`],scenarios:[{title:`Overview dashboards`,description:`Show high-level metrics above charts and tables.`},{title:`Loading states`,description:`Replace values with placeholders while fetching real data.`},{title:`Empty states`,description:`Render no metrics with layout preserved and user messaging outside.`}],capabilityNotes:["Use meaningful `description` for quick interpretation and trend context.",`Keep the number of columns tied to viewport width and readability.`,"Use `compact` for dense cards in dense dashboard toolbars."]};exports.metricGridMock=e;

package/dist/showcase/premium/metric-grid/mock.d.ts

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

package/dist/showcase/premium/metric-grid/mock.js

@@ -1,36 +0,0 @@
-//#region src/showcase/premium/metric-grid/mock.ts
-var e = {
-	code: "import { MetricGrid } from \"tembro\"\n\nconst items = [\n  { key: \"users\", label: \"Users\", value: \"2,410\", description: \"Last 30 days\" },\n  { key: \"revenue\", label: \"Revenue\", value: \"$132k\", description: \"Compared with last month\" },\n  { key: \"errors\", label: \"Errors\", value: \"3\", description: \"Attention required\" },\n]\n\nexport function Example() {\n  return <MetricGrid items={items} columns={3} />\n}",
-	highlights: [
-		"Dashboard-ready KPI tiles",
-		"Tone-based urgency states",
-		"Compact mode",
-		"Composable label and trend"
-	],
-	relatedBlockSlugs: [
-		"dashboard-starter",
-		"crm-dashboard",
-		"users-table"
-	],
-	scenarios: [
-		{
-			title: "Overview dashboards",
-			description: "Show high-level metrics above charts and tables."
-		},
-		{
-			title: "Loading states",
-			description: "Replace values with placeholders while fetching real data."
-		},
-		{
-			title: "Empty states",
-			description: "Render no metrics with layout preserved and user messaging outside."
-		}
-	],
-	capabilityNotes: [
-		"Use meaningful `description` for quick interpretation and trend context.",
-		"Keep the number of columns tied to viewport width and readability.",
-		"Use `compact` for dense cards in dense dashboard toolbars."
-	]
-};
-//#endregion
-export { e as metricGridMock };

package/dist/showcase/premium/metric-grid/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/display/metric-grid.cjs"),r=require("../../../components/charts/charts.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=[{key:`users`,label:`Users`,value:`2,410`,description:`Last 30 days`,tone:`success`,trend:`+12%`},{key:`revenue`,label:`Revenue`,value:`$132k`,description:`Compared with last month`,tone:`info`,trend:`+8.4%`},{key:`errors`,label:`Errors`,value:`3`,description:`Immediate follow up`,tone:`danger`},{key:`churn`,label:`Churn`,value:`1.8%`,description:`Within target`,tone:`warning`}],s=[2,3,4];function c({mode:e}){let[c,l]=i.useState(!1),[u,d]=i.useState(3);return(0,a.jsxs)(`div`,{className:`space-y-4`,children:[e===`playground`?(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(t.Button,{size:`sm`,variant:c?`outline`:`default`,onClick:()=>l(e=>!e),children:c?`Use spacious`:`Use compact`}),s.map(e=>(0,a.jsxs)(t.Button,{size:`sm`,variant:u===e?`default`:`outline`,onClick:()=>d(e),children:[e,` cols`]},e))]}):null,(0,a.jsx)(n.MetricGrid,{items:o,columns:u,compact:c}),(0,a.jsxs)(`div`,{className:`grid gap-4 xl:grid-cols-2`,children:[(0,a.jsx)(r.ChartFrame,{title:`Category performance`,description:`Bar chart shares the same token palette.`,children:(0,a.jsx)(r.BarChart,{data:[{label:`CRM`,value:42},{label:`Finance`,value:31},{label:`Auth`,value:-8},{label:`Forms`,value:26}]})}),(0,a.jsx)(r.ChartFrame,{title:`Traffic split`,description:`Donut, legend and KPI blocks stay visually aligned.`,children:(0,a.jsxs)(`div`,{className:`grid justify-items-center gap-4`,children:[(0,a.jsx)(r.DonutChart,{centerValue:`68%`,centerLabel:`Usage`,data:[{label:`Dashboard`,value:42},{label:`Forms`,value:18},{label:`Reports`,value:8}]}),(0,a.jsx)(r.ChartLegend,{data:[{label:`Dashboard`,value:42},{label:`Forms`,value:18},{label:`Reports`,value:8}]})]})})]})]})}exports.MetricGridShowcase=c;

package/dist/showcase/premium/metric-grid/showcase.d.ts

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