tembro 3.1.16 → 4.0.0

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

@@ -1,31 +0,0 @@
-//#region src/showcase/premium/pagination/mock.ts
-var e = {
-	code: "import * as React from \"react\"\nimport { Pagination } from \"tembro\"\n\nexport function Example() {\n  const [page, setPage] = React.useState(6)\n\n  return (\n    <Pagination\n      page={page}\n      pageCount={18}\n      onPageChange={setPage}\n      showEdges\n    />\n  )\n}",
-	highlights: [
-		"Controlled page state",
-		"First/last edge actions",
-		"Ellipsis generation for large datasets",
-		"Compact navigation for tables and audit logs"
-	],
-	scenarios: [
-		{
-			title: "Orders table",
-			description: "Switch through long operational tables without losing search and filters."
-		},
-		{
-			title: "Audit trail",
-			description: "Keep log browsing compact while preserving direct jumps to early and late pages."
-		},
-		{
-			title: "Review queue",
-			description: "Let teams move page-by-page through pending approvals."
-		}
-	],
-	capabilityNotes: [
-		"Keep pagination controlled so URL params or table state remain the source of truth.",
-		"Use `showEdges` when the dataset spans many pages.",
-		"Pair with visible total count so users know how far they are in the list."
-	]
-};
-//#endregion
-export { e as paginationMock };

package/dist/src/showcase/premium/pagination/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/pagination.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(6),[c,l]=r.useState(18),[u,d]=r.useState(!0),[f,p]=r.useState(20);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:`Navigation control`}),(0,i.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Pagination should preserve context while moving through data`}),(0,i.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`Good pagination feels quiet: the active page is obvious, edge jumps are available, and large datasets collapse into readable ellipsis states.`})]}),(0,i.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,i.jsx)(t.Badge,{variant:`outline`,className:`rounded-full`,children:`Controlled`}),(0,i.jsx)(t.Badge,{variant:`outline`,className:`rounded-full`,children:`Large lists`})]})]})}),(0,i.jsx)(`section`,{className:a,children:(0,i.jsxs)(`div`,{className:`flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between`,children:[(0,i.jsxs)(`div`,{children:[(0,i.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Review queue pages`}),(0,i.jsxs)(`p`,{className:`mt-2 text-sm leading-6 aui-text-muted`,children:[`Showing page `,(0,i.jsx)(`span`,{className:`font-medium aui-text-strong`,children:o}),` of `,(0,i.jsx)(`span`,{className:`font-medium aui-text-strong`,children:c}),`.`]})]}),(0,i.jsx)(n.Pagination,{page:o,pageCount:c,onPageChange:s,showEdges:u,totalCount:c*f,pageSize:f,pageSizeOptions:[10,20,50],onPageSizeChange:p,showSummary:!0})]})}),(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:`Why this matters`}),(0,i.jsxs)(`div`,{className:`mt-4 space-y-3 text-sm leading-6 aui-text-muted`,children:[(0,i.jsx)(`p`,{children:`Tables, audit trails, and inboxes all need stable navigation that does not compete with the data itself.`}),(0,i.jsx)(`p`,{children:`Ellipsis should reduce noise, not hide where the user currently is.`})]})]}),(0,i.jsxs)(`section`,{className:a,children:[(0,i.jsx)(`p`,{className:`text-sm font-medium aui-text-muted`,children:`Current demo state`}),(0,i.jsxs)(`div`,{className:`mt-4 space-y-2 text-sm leading-6 aui-text-muted`,children:[(0,i.jsxs)(`p`,{children:[`Page: `,(0,i.jsx)(`span`,{className:`font-medium aui-text-strong`,children:o})]}),(0,i.jsxs)(`p`,{children:[`Total pages: `,(0,i.jsx)(`span`,{className:`font-medium aui-text-strong`,children:c})]}),(0,i.jsxs)(`p`,{children:[`Page size: `,(0,i.jsx)(`span`,{className:`font-medium aui-text-strong`,children:f})]}),(0,i.jsxs)(`p`,{children:[`Edges: `,(0,i.jsx)(`span`,{className:`font-medium aui-text-strong`,children:u?`visible`:`hidden`})]})]})]})]}),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:()=>s(Math.max(1,o-1)),children:`Previous page`}),(0,i.jsx)(`button`,{type:`button`,className:`rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm`,onClick:()=>s(Math.min(c,o+1)),children:`Next page`}),(0,i.jsx)(`button`,{type:`button`,className:`rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm`,onClick:()=>d(e=>!e),children:`Toggle edges`}),(0,i.jsx)(`button`,{type:`button`,className:`rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm`,onClick:()=>l(e=>e===18?8:18),children:`Toggle page count`})]})}):null]})}exports.PaginationShowcase=o;

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

@@ -1,160 +0,0 @@
-import { Badge as e } from "../../../components/ui/badge/index.js";
-import { Pagination as t } from "../../../components/navigation/pagination.js";
-import * as n from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/showcase/premium/pagination/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(6), [l, u] = n.useState(18), [d, f] = n.useState(!0), [p, m] = n.useState(20);
-	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: "Navigation control"
-							}),
-							/* @__PURE__ */ r("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Pagination should preserve context while moving through data"
-							}),
-							/* @__PURE__ */ r("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "Good pagination feels quiet: the active page is obvious, edge jumps are available, and large datasets collapse into readable ellipsis states."
-							})
-						]
-					}), /* @__PURE__ */ i("div", {
-						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ r(e, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Controlled"
-						}), /* @__PURE__ */ r(e, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Large lists"
-						})]
-					})]
-				})
-			}),
-			/* @__PURE__ */ r("section", {
-				className: a,
-				children: /* @__PURE__ */ i("div", {
-					className: "flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between",
-					children: [/* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Review queue pages"
-					}), /* @__PURE__ */ i("p", {
-						className: "mt-2 text-sm leading-6 aui-text-muted",
-						children: [
-							"Showing page ",
-							/* @__PURE__ */ r("span", {
-								className: "font-medium aui-text-strong",
-								children: s
-							}),
-							" of ",
-							/* @__PURE__ */ r("span", {
-								className: "font-medium aui-text-strong",
-								children: l
-							}),
-							"."
-						]
-					})] }), /* @__PURE__ */ r(t, {
-						page: s,
-						pageCount: l,
-						onPageChange: c,
-						showEdges: d,
-						totalCount: l * p,
-						pageSize: p,
-						pageSizeOptions: [
-							10,
-							20,
-							50
-						],
-						onPageSizeChange: m,
-						showSummary: !0
-					})]
-				})
-			}),
-			/* @__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: "Why this matters"
-					}), /* @__PURE__ */ i("div", {
-						className: "mt-4 space-y-3 text-sm leading-6 aui-text-muted",
-						children: [/* @__PURE__ */ r("p", { children: "Tables, audit trails, and inboxes all need stable navigation that does not compete with the data itself." }), /* @__PURE__ */ r("p", { children: "Ellipsis should reduce noise, not hide where the user currently is." })]
-					})]
-				}), /* @__PURE__ */ i("section", {
-					className: a,
-					children: [/* @__PURE__ */ r("p", {
-						className: "text-sm font-medium aui-text-muted",
-						children: "Current demo state"
-					}), /* @__PURE__ */ i("div", {
-						className: "mt-4 space-y-2 text-sm leading-6 aui-text-muted",
-						children: [
-							/* @__PURE__ */ i("p", { children: ["Page: ", /* @__PURE__ */ r("span", {
-								className: "font-medium aui-text-strong",
-								children: s
-							})] }),
-							/* @__PURE__ */ i("p", { children: ["Total pages: ", /* @__PURE__ */ r("span", {
-								className: "font-medium aui-text-strong",
-								children: l
-							})] }),
-							/* @__PURE__ */ i("p", { children: ["Page size: ", /* @__PURE__ */ r("span", {
-								className: "font-medium aui-text-strong",
-								children: p
-							})] }),
-							/* @__PURE__ */ i("p", { children: ["Edges: ", /* @__PURE__ */ r("span", {
-								className: "font-medium aui-text-strong",
-								children: d ? "visible" : "hidden"
-							})] })
-						]
-					})]
-				})]
-			}),
-			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: () => c(Math.max(1, s - 1)),
-							children: "Previous page"
-						}),
-						/* @__PURE__ */ r("button", {
-							type: "button",
-							className: "rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm",
-							onClick: () => c(Math.min(l, s + 1)),
-							children: "Next page"
-						}),
-						/* @__PURE__ */ r("button", {
-							type: "button",
-							className: "rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm",
-							onClick: () => f((e) => !e),
-							children: "Toggle edges"
-						}),
-						/* @__PURE__ */ r("button", {
-							type: "button",
-							className: "rounded-full border border-[color:var(--aui-divider)] px-3 py-2 text-sm",
-							onClick: () => u((e) => e === 18 ? 8 : 18),
-							children: "Toggle page count"
-						})
-					]
-				})
-			}) : null
-		]
-	});
-}
-//#endregion
-export { o as PaginationShowcase };

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

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=[{label:`Open help`,variant:`outline`,title:`Quick tips`,description:`Use compact overlays for helper content and short actions.`},{label:`Open actions`,variant:`secondary`,title:`Workspace actions`,description:`Duplicate, archive or transfer ownership from this menu.`},{label:`Open shortcut`,variant:`outline`,title:`Keyboard tip`,description:`Use Cmd/Ctrl+K to open command palette from this page.`}];exports.popoverDemoItems=e;

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

@@ -1,23 +0,0 @@
-//#region src/showcase/premium/popover/data.ts
-var e = [
-	{
-		label: "Open help",
-		variant: "outline",
-		title: "Quick tips",
-		description: "Use compact overlays for helper content and short actions."
-	},
-	{
-		label: "Open actions",
-		variant: "secondary",
-		title: "Workspace actions",
-		description: "Duplicate, archive or transfer ownership from this menu."
-	},
-	{
-		label: "Open shortcut",
-		variant: "outline",
-		title: "Keyboard tip",
-		description: "Use Cmd/Ctrl+K to open command palette from this page."
-	}
-];
-//#endregion
-export { e as popoverDemoItems };

package/dist/src/showcase/premium/popover/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.PopoverShowcase=t.PopoverShowcase,exports.popoverDemoItems=e.popoverDemoItems,exports.popoverMock=n.popoverMock;

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

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

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

@@ -1,24 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Button, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger } from "tembro"
-
-export function Example() {
-  return (
-    <div className="space-y-3">
-      <Popover>
-        <PopoverTrigger render={<Button variant="outline">Open helper</Button>} />
-        <PopoverContent className="w-72">
-          <PopoverHeader>
-            <PopoverTitle>Keyboard shortcut</PopoverTitle>
-            <PopoverDescription>Press Cmd/Ctrl + K to open quick search.</PopoverDescription>
-          </PopoverHeader>
-        </PopoverContent>
-      </Popover>
-
-      <Popover>
-        <PopoverTrigger render={<Button variant="secondary">Open workspace menu</Button>} />
-        <PopoverContent className="w-64">
-          Duplicate Archive Share
-        </PopoverContent>
-      </Popover>
-    </div>
-  )
-}`,htmlCode:`<button data-slot="popover-trigger">Open popover</button>`,cliCommand:`npx tembro add popover`,highlights:[`Anchored overlay`,`Action-specific compact content`,`Placement control`,`Keyboard-focus hints`],relatedBlockSlugs:[`users-table`,`dashboard-starter`,`crm-dashboard`],scenarios:[{title:`Inline help`,description:`Keep helper text close to the trigger control.`},{title:`Context menu`,description:`Use popover for compact action sets instead of full modals.`},{title:`Detail summary`,description:`Show small explanations where space is limited.`},{title:`Tooltip-style guidance`,description:`Offer focus-safe guidance for complex form controls.`}],capabilityNotes:[`Use popovers for short, contextual content and actions.`,`Avoid placing long-form or deeply interactive workflows in popovers.`,`Prefer stable side/alignment to prevent layout jank in dense UIs.`,`Set focus behavior intentionally when nested controls are present.`]};exports.popoverMock=e;

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

@@ -1,43 +0,0 @@
-//#region src/showcase/premium/popover/mock.ts
-var e = {
-	code: "import { Button, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger } from \"tembro\"\n\nexport function Example() {\n  return (\n    <div className=\"space-y-3\">\n      <Popover>\n        <PopoverTrigger render={<Button variant=\"outline\">Open helper</Button>} />\n        <PopoverContent className=\"w-72\">\n          <PopoverHeader>\n            <PopoverTitle>Keyboard shortcut</PopoverTitle>\n            <PopoverDescription>Press Cmd/Ctrl + K to open quick search.</PopoverDescription>\n          </PopoverHeader>\n        </PopoverContent>\n      </Popover>\n\n      <Popover>\n        <PopoverTrigger render={<Button variant=\"secondary\">Open workspace menu</Button>} />\n        <PopoverContent className=\"w-64\">\n          Duplicate Archive Share\n        </PopoverContent>\n      </Popover>\n    </div>\n  )\n}",
-	htmlCode: "<button data-slot=\"popover-trigger\">Open popover</button>",
-	cliCommand: "npx tembro add popover",
-	highlights: [
-		"Anchored overlay",
-		"Action-specific compact content",
-		"Placement control",
-		"Keyboard-focus hints"
-	],
-	relatedBlockSlugs: [
-		"users-table",
-		"dashboard-starter",
-		"crm-dashboard"
-	],
-	scenarios: [
-		{
-			title: "Inline help",
-			description: "Keep helper text close to the trigger control."
-		},
-		{
-			title: "Context menu",
-			description: "Use popover for compact action sets instead of full modals."
-		},
-		{
-			title: "Detail summary",
-			description: "Show small explanations where space is limited."
-		},
-		{
-			title: "Tooltip-style guidance",
-			description: "Offer focus-safe guidance for complex form controls."
-		}
-	],
-	capabilityNotes: [
-		"Use popovers for short, contextual content and actions.",
-		"Avoid placing long-form or deeply interactive workflows in popovers.",
-		"Prefer stable side/alignment to prevent layout jank in dense UIs.",
-		"Set focus behavior intentionally when nested controls are present."
-	]
-};
-//#endregion
-export { e as popoverMock };

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

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../components/ui/button/index.cjs"),t=require("../../../components/ui/input/index.cjs"),n=require("../../../components/ui/popover/index.cjs"),r=require("./data.cjs");let i=require("react/jsx-runtime");var a=`border-t border-[color:var(--aui-divider)] py-6`;function o(){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:`Popover`}),(0,i.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Keep it short and contextual`}),(0,i.jsx)(`p`,{className:`mt-3 text-sm leading-6 aui-text-muted`,children:`Popover should add nearby context, not replace the page or become a hidden modal.`})]}),(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:`Examples`}),(0,i.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:r.popoverDemoItems.length})]}),(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:`Use for`}),(0,i.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:`Short help`})]}),(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:`Avoid for`}),(0,i.jsx)(`p`,{className:`mt-2 text-lg font-semibold aui-text-strong`,children:`Full flows`})]})]})]})}),(0,i.jsx)(`section`,{className:a,children:(0,i.jsx)(`div`,{className:`grid gap-4 xl:grid-cols-3`,children:r.popoverDemoItems.map(t=>(0,i.jsxs)(`div`,{className:`rounded-[20px] border border-[color:var(--aui-divider)] px-4 py-4`,children:[(0,i.jsxs)(`div`,{children:[(0,i.jsx)(`p`,{className:`text-sm font-semibold aui-text-strong`,children:t.title}),(0,i.jsx)(`p`,{className:`mt-2 text-sm leading-6 aui-text-muted`,children:t.description})]}),(0,i.jsx)(`div`,{className:`mt-4`,children:(0,i.jsxs)(n.Popover,{children:[(0,i.jsx)(n.PopoverTrigger,{render:(0,i.jsx)(e.Button,{variant:t.variant}),children:t.label}),(0,i.jsx)(n.PopoverContent,{children:(0,i.jsxs)(n.PopoverHeader,{children:[(0,i.jsx)(n.PopoverTitle,{children:t.title}),(0,i.jsx)(n.PopoverDescription,{children:t.description})]})})]})})]},t.label))})}),(0,i.jsx)(`section`,{className:a,children:(0,i.jsxs)(`div`,{className:`grid gap-5 xl:grid-cols-[0.85fr_1.15fr]`,children:[(0,i.jsxs)(`div`,{children:[(0,i.jsx)(`p`,{className:`text-lg font-semibold aui-text-strong`,children:`Inline settings form`}),(0,i.jsx)(`p`,{className:`mt-2 max-w-xl text-sm leading-6 aui-text-muted`,children:`Short forms fit when they change a local view and can be dismissed without losing page context.`})]}),(0,i.jsx)(`div`,{className:`flex justify-start xl:justify-end`,children:(0,i.jsxs)(n.Popover,{children:[(0,i.jsx)(n.PopoverTrigger,{render:(0,i.jsx)(e.Button,{variant:`outline`}),children:`Edit workspace`}),(0,i.jsxs)(n.PopoverContent,{align:`end`,collisionPadding:16,children:[(0,i.jsxs)(n.PopoverHeader,{children:[(0,i.jsx)(n.PopoverTitle,{children:`Workspace details`}),(0,i.jsx)(n.PopoverDescription,{children:`Update the label used in local navigation.`})]}),(0,i.jsxs)(`div`,{className:`grid gap-3`,children:[(0,i.jsx)(t.Input,{"aria-label":`Workspace name`,defaultValue:`Growth analytics`}),(0,i.jsx)(t.Input,{"aria-label":`Workspace slug`,defaultValue:`growth`})]}),(0,i.jsxs)(`div`,{className:`flex justify-end gap-2`,children:[(0,i.jsx)(e.Button,{type:`button`,variant:`secondary`,size:`sm`,children:`Cancel`}),(0,i.jsx)(e.Button,{type:`button`,size:`sm`,children:`Save`})]})]})]})})]})})]})}exports.PopoverShowcase=o;

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

@@ -1,143 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Input as t } from "../../../components/ui/input/index.js";
-import { Popover as n, PopoverContent as r, PopoverDescription as i, PopoverHeader as a, PopoverTitle as o, PopoverTrigger as s } from "../../../components/ui/popover/index.js";
-import { popoverDemoItems as c } from "./data.js";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-//#region src/showcase/premium/popover/showcase.tsx
-var d = "border-t border-[color:var(--aui-divider)] py-6";
-function f() {
-	return /* @__PURE__ */ u("div", {
-		className: "space-y-0",
-		children: [
-			/* @__PURE__ */ l("section", {
-				className: "pb-6",
-				children: /* @__PURE__ */ u("div", {
-					className: "flex flex-col gap-6 xl:flex-row xl:items-end xl:justify-between",
-					children: [/* @__PURE__ */ u("div", {
-						className: "max-w-xl",
-						children: [
-							/* @__PURE__ */ l("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted",
-								children: "Popover"
-							}),
-							/* @__PURE__ */ l("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Keep it short and contextual"
-							}),
-							/* @__PURE__ */ l("p", {
-								className: "mt-3 text-sm leading-6 aui-text-muted",
-								children: "Popover should add nearby context, not replace the page or become a hidden modal."
-							})
-						]
-					}), /* @__PURE__ */ u("div", {
-						className: "grid gap-3 sm:grid-cols-3 xl:min-w-[360px] xl:max-w-[420px]",
-						children: [
-							/* @__PURE__ */ u("div", {
-								className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-								children: [/* @__PURE__ */ l("p", {
-									className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-									children: "Examples"
-								}), /* @__PURE__ */ l("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong",
-									children: c.length
-								})]
-							}),
-							/* @__PURE__ */ u("div", {
-								className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-								children: [/* @__PURE__ */ l("p", {
-									className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-									children: "Use for"
-								}), /* @__PURE__ */ l("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong",
-									children: "Short help"
-								})]
-							}),
-							/* @__PURE__ */ u("div", {
-								className: "rounded-[18px] border border-[color:var(--aui-divider)] px-4 py-3",
-								children: [/* @__PURE__ */ l("p", {
-									className: "text-xs font-semibold uppercase tracking-[0.22em] aui-text-muted",
-									children: "Avoid for"
-								}), /* @__PURE__ */ l("p", {
-									className: "mt-2 text-lg font-semibold aui-text-strong",
-									children: "Full flows"
-								})]
-							})
-						]
-					})]
-				})
-			}),
-			/* @__PURE__ */ l("section", {
-				className: d,
-				children: /* @__PURE__ */ l("div", {
-					className: "grid gap-4 xl:grid-cols-3",
-					children: c.map((t) => /* @__PURE__ */ u("div", {
-						className: "rounded-[20px] border border-[color:var(--aui-divider)] px-4 py-4",
-						children: [/* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("p", {
-							className: "text-sm font-semibold aui-text-strong",
-							children: t.title
-						}), /* @__PURE__ */ l("p", {
-							className: "mt-2 text-sm leading-6 aui-text-muted",
-							children: t.description
-						})] }), /* @__PURE__ */ l("div", {
-							className: "mt-4",
-							children: /* @__PURE__ */ u(n, { children: [/* @__PURE__ */ l(s, {
-								render: /* @__PURE__ */ l(e, { variant: t.variant }),
-								children: t.label
-							}), /* @__PURE__ */ l(r, { children: /* @__PURE__ */ u(a, { children: [/* @__PURE__ */ l(o, { children: t.title }), /* @__PURE__ */ l(i, { children: t.description })] }) })] })
-						})]
-					}, t.label))
-				})
-			}),
-			/* @__PURE__ */ l("section", {
-				className: d,
-				children: /* @__PURE__ */ u("div", {
-					className: "grid gap-5 xl:grid-cols-[0.85fr_1.15fr]",
-					children: [/* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("p", {
-						className: "text-lg font-semibold aui-text-strong",
-						children: "Inline settings form"
-					}), /* @__PURE__ */ l("p", {
-						className: "mt-2 max-w-xl text-sm leading-6 aui-text-muted",
-						children: "Short forms fit when they change a local view and can be dismissed without losing page context."
-					})] }), /* @__PURE__ */ l("div", {
-						className: "flex justify-start xl:justify-end",
-						children: /* @__PURE__ */ u(n, { children: [/* @__PURE__ */ l(s, {
-							render: /* @__PURE__ */ l(e, { variant: "outline" }),
-							children: "Edit workspace"
-						}), /* @__PURE__ */ u(r, {
-							align: "end",
-							collisionPadding: 16,
-							children: [
-								/* @__PURE__ */ u(a, { children: [/* @__PURE__ */ l(o, { children: "Workspace details" }), /* @__PURE__ */ l(i, { children: "Update the label used in local navigation." })] }),
-								/* @__PURE__ */ u("div", {
-									className: "grid gap-3",
-									children: [/* @__PURE__ */ l(t, {
-										"aria-label": "Workspace name",
-										defaultValue: "Growth analytics"
-									}), /* @__PURE__ */ l(t, {
-										"aria-label": "Workspace slug",
-										defaultValue: "growth"
-									})]
-								}),
-								/* @__PURE__ */ u("div", {
-									className: "flex justify-end gap-2",
-									children: [/* @__PURE__ */ l(e, {
-										type: "button",
-										variant: "secondary",
-										size: "sm",
-										children: "Cancel"
-									}), /* @__PURE__ */ l(e, {
-										type: "button",
-										size: "sm",
-										children: "Save"
-									})]
-								})
-							]
-						})] })
-					})]
-				})
-			})
-		]
-	});
-}
-//#endregion
-export { f as PopoverShowcase };

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

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

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

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

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

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

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

@@ -1,15 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Progress, ProgressCard } from "tembro"
-
-export function Example() {
-  return (
-    <div className="space-y-4">
-      <Progress label="Migration status" value={72} showValue />
-      <ProgressCard
-        title="Workspace import"
-        description="Current completion state"
-        value={58}
-        tone="info"
-      />
-    </div>
-  )
-}`,highlights:[`Linear progress with contextual label`,`Value formatting`,`Tone support for risk and success states`,`Card wrapper for dashboard surfaces`],scenarios:[{title:`Import flow`,description:`Show users how much data sync or onboarding remains.`},{title:`Release readiness`,description:`Track operational completion state in dashboards.`},{title:`Background jobs`,description:`Expose live or indeterminate processing in a compact way.`}],capabilityNotes:[`Progress is strongest when tied to a real milestone or measurable completion state.`,`Use indeterminate only when precise completion cannot be known yet.`,`Label the meaning of the progress, not just the percent.`]};exports.progressMock=e;

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

@@ -1,31 +0,0 @@
-//#region src/showcase/premium/progress/mock.ts
-var e = {
-	code: "import { Progress, ProgressCard } from \"tembro\"\n\nexport function Example() {\n  return (\n    <div className=\"space-y-4\">\n      <Progress label=\"Migration status\" value={72} showValue />\n      <ProgressCard\n        title=\"Workspace import\"\n        description=\"Current completion state\"\n        value={58}\n        tone=\"info\"\n      />\n    </div>\n  )\n}",
-	highlights: [
-		"Linear progress with contextual label",
-		"Value formatting",
-		"Tone support for risk and success states",
-		"Card wrapper for dashboard surfaces"
-	],
-	scenarios: [
-		{
-			title: "Import flow",
-			description: "Show users how much data sync or onboarding remains."
-		},
-		{
-			title: "Release readiness",
-			description: "Track operational completion state in dashboards."
-		},
-		{
-			title: "Background jobs",
-			description: "Expose live or indeterminate processing in a compact way."
-		}
-	],
-	capabilityNotes: [
-		"Progress is strongest when tied to a real milestone or measurable completion state.",
-		"Use indeterminate only when precise completion cannot be known yet.",
-		"Label the meaning of the progress, not just the percent."
-	]
-};
-//#endregion
-export { e as progressMock };

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

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/ui/button/index.cjs"),n=require("../../../components/ui/badge/index.cjs"),r=require("../../../components/display/progress.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=`rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5`;function s({mode:e}){let[s,c]=i.useState(58),[l,u]=i.useState(!1);return(0,a.jsxs)(`div`,{className:`space-y-5`,children:[(0,a.jsx)(`section`,{className:`rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5 sm:p-6`,children:(0,a.jsxs)(`div`,{className:`flex flex-col gap-6 xl:flex-row xl:items-start xl:justify-between`,children:[(0,a.jsxs)(`div`,{className:`max-w-xl`,children:[(0,a.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted`,children:`Completion signal`}),(0,a.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`Progress should explain movement, not just paint a bar`}),(0,a.jsx)(`p`,{className:`mt-3 max-w-lg text-sm leading-6 aui-text-muted`,children:`A useful progress surface ties completion to a concrete workflow like sync, rollout, approval, or onboarding.`})]}),(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Deterministic`}),(0,a.jsx)(n.Badge,{variant:`outline`,className:`rounded-full`,children:`Indeterminate`})]})]})}),(0,a.jsxs)(`div`,{className:`grid gap-4 xl:grid-cols-2`,children:[(0,a.jsx)(`section`,{className:o,children:(0,a.jsx)(r.Progress,{label:`Workspace import`,description:`Records indexed and validated`,value:s,tone:`info`,showValue:!0,indeterminate:l})}),(0,a.jsx)(r.ProgressCard,{title:`Release readiness`,description:`Checks passed before public rollout`,value:s,tone:s>=80?`success`:s>=50?`info`:`warning`,footer:(0,a.jsx)(`p`,{className:`text-xs aui-text-muted`,children:`Promote only when all gates are green.`})})]}),e===`playground`?(0,a.jsx)(`section`,{className:o,children:(0,a.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>c(e=>Math.max(0,e-10)),children:`-10`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>c(e=>Math.min(100,e+10)),children:`+10`}),(0,a.jsx)(t.Button,{size:`sm`,variant:`outline`,onClick:()=>u(e=>!e),children:`Toggle indeterminate`})]})}):null]})}exports.ProgressShowcase=s;

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

@@ -1,100 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Badge as t } from "../../../components/ui/badge/index.js";
-import { Progress as n, ProgressCard as r } from "../../../components/display/progress.js";
-import * as i from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-//#region src/showcase/premium/progress/showcase.tsx
-var s = "rounded-[22px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5";
-function c({ mode: c }) {
-	let [l, u] = i.useState(58), [d, f] = i.useState(!1);
-	return /* @__PURE__ */ o("div", {
-		className: "space-y-5",
-		children: [
-			/* @__PURE__ */ a("section", {
-				className: "rounded-[24px] border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] p-5 sm:p-6",
-				children: /* @__PURE__ */ o("div", {
-					className: "flex flex-col gap-6 xl:flex-row xl:items-start xl:justify-between",
-					children: [/* @__PURE__ */ o("div", {
-						className: "max-w-xl",
-						children: [
-							/* @__PURE__ */ a("p", {
-								className: "text-xs font-semibold uppercase tracking-[0.26em] aui-text-muted",
-								children: "Completion signal"
-							}),
-							/* @__PURE__ */ a("h3", {
-								className: "mt-3 text-2xl font-semibold tracking-tight aui-text-strong",
-								children: "Progress should explain movement, not just paint a bar"
-							}),
-							/* @__PURE__ */ a("p", {
-								className: "mt-3 max-w-lg text-sm leading-6 aui-text-muted",
-								children: "A useful progress surface ties completion to a concrete workflow like sync, rollout, approval, or onboarding."
-							})
-						]
-					}), /* @__PURE__ */ o("div", {
-						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ a(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Deterministic"
-						}), /* @__PURE__ */ a(t, {
-							variant: "outline",
-							className: "rounded-full",
-							children: "Indeterminate"
-						})]
-					})]
-				})
-			}),
-			/* @__PURE__ */ o("div", {
-				className: "grid gap-4 xl:grid-cols-2",
-				children: [/* @__PURE__ */ a("section", {
-					className: s,
-					children: /* @__PURE__ */ a(n, {
-						label: "Workspace import",
-						description: "Records indexed and validated",
-						value: l,
-						tone: "info",
-						showValue: !0,
-						indeterminate: d
-					})
-				}), /* @__PURE__ */ a(r, {
-					title: "Release readiness",
-					description: "Checks passed before public rollout",
-					value: l,
-					tone: l >= 80 ? "success" : l >= 50 ? "info" : "warning",
-					footer: /* @__PURE__ */ a("p", {
-						className: "text-xs aui-text-muted",
-						children: "Promote only when all gates are green."
-					})
-				})]
-			}),
-			c === "playground" ? /* @__PURE__ */ a("section", {
-				className: s,
-				children: /* @__PURE__ */ o("div", {
-					className: "flex flex-wrap gap-2",
-					children: [
-						/* @__PURE__ */ a(e, {
-							size: "sm",
-							variant: "outline",
-							onClick: () => u((e) => Math.max(0, e - 10)),
-							children: "-10"
-						}),
-						/* @__PURE__ */ a(e, {
-							size: "sm",
-							variant: "outline",
-							onClick: () => u((e) => Math.min(100, e + 10)),
-							children: "+10"
-						}),
-						/* @__PURE__ */ a(e, {
-							size: "sm",
-							variant: "outline",
-							onClick: () => f((e) => !e),
-							children: "Toggle indeterminate"
-						})
-					]
-				})
-			}) : null
-		]
-	});
-}
-//#endregion
-export { c as ProgressShowcase };

package/dist/src/showcase/premium/qr-code/index.cjs

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

package/dist/src/showcase/premium/qr-code/index.js

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