tembro 1.0.2 → 2.0.0

package/dist/showcase/families/upload/showcase.js

@@ -1,133 +0,0 @@
-import { Badge as e } from "../../../components/ui/badge/index.js";
-import { FileUpload as t } from "../../../components/upload/file-upload.js";
-import { ImageUpload as n } from "../../../components/upload/image-upload.js";
-import { uploadHelperTags as r } from "./data.js";
-import * as i from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-//#region src/showcase/families/upload/showcase.tsx
-function s({ setState: s }) {
-	let [c, l] = i.useState([]), [u, d] = i.useState([]);
-	return /* @__PURE__ */ o("div", {
-		className: "space-y-4",
-		children: [
-			/* @__PURE__ */ a("div", {
-				className: "rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4",
-				children: /* @__PURE__ */ a("div", {
-					className: "flex flex-col gap-4 xl:flex-row xl:items-start xl:justify-between",
-					children: /* @__PURE__ */ o("div", {
-						className: "space-y-3",
-						children: [/* @__PURE__ */ a("div", {
-							className: "flex flex-wrap gap-2",
-							children: r.map((t) => /* @__PURE__ */ a(e, {
-								variant: "outline",
-								children: t
-							}, t))
-						}), /* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("p", {
-							className: "aui-text-strong text-sm font-medium",
-							children: "Upload family coverage"
-						}), /* @__PURE__ */ a("p", {
-							className: "aui-text-muted mt-1 text-sm leading-6",
-							children: "File and image upload should expose real dropzone behavior, clear actions, remove actions, preview surfaces and controlled file counts."
-						})] })]
-					})
-				})
-			}),
-			/* @__PURE__ */ o("div", {
-				className: "grid gap-4 xl:grid-cols-2",
-				children: [/* @__PURE__ */ o("div", {
-					className: "rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4",
-					children: [
-						/* @__PURE__ */ a("p", {
-							className: "aui-text-strong text-sm font-medium",
-							children: "File upload"
-						}),
-						/* @__PURE__ */ a("p", {
-							className: "aui-text-muted mt-1 text-sm leading-6",
-							children: "Drop files, clear all, reject invalid types and keep remove actions inside the file item surface."
-						}),
-						/* @__PURE__ */ a("div", {
-							className: "mt-4",
-							children: /* @__PURE__ */ a(t, {
-								files: c,
-								onFilesChange: (e) => {
-									l(e), s({ notes: `${e.length} file attachments are now staged.` });
-								},
-								accept: ".pdf,.docx,.png",
-								maxFiles: 4,
-								maxSize: 4 * 1024 * 1024,
-								helperText: "Accepts PDF, DOCX and PNG up to 4 MB."
-							})
-						})
-					]
-				}), /* @__PURE__ */ o("div", {
-					className: "rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4",
-					children: [
-						/* @__PURE__ */ a("p", {
-							className: "aui-text-strong text-sm font-medium",
-							children: "Image upload"
-						}),
-						/* @__PURE__ */ a("p", {
-							className: "aui-text-muted mt-1 text-sm leading-6",
-							children: "Image preview, removable files and count summary are exposed directly from the reusable component."
-						}),
-						/* @__PURE__ */ a("div", {
-							className: "mt-4",
-							children: /* @__PURE__ */ a(n, {
-								files: u,
-								onFilesChange: (e) => {
-									d(e), s({ notes: `${e.length} preview images are now staged.` });
-								},
-								maxFiles: 3,
-								helperText: "Upload hero illustrations or block thumbnails."
-							})
-						})
-					]
-				})]
-			}),
-			/* @__PURE__ */ o("div", {
-				className: "grid gap-4 md:grid-cols-3",
-				children: [
-					/* @__PURE__ */ o("div", {
-						className: "rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-						children: [/* @__PURE__ */ a("p", {
-							className: "aui-text-muted text-sm",
-							children: "Attached files"
-						}), /* @__PURE__ */ a("p", {
-							className: "aui-text-strong mt-2 text-lg font-semibold",
-							children: c.length
-						})]
-					}),
-					/* @__PURE__ */ o("div", {
-						className: "rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-						children: [/* @__PURE__ */ a("p", {
-							className: "aui-text-muted text-sm",
-							children: "Attached images"
-						}), /* @__PURE__ */ a("p", {
-							className: "aui-text-strong mt-2 text-lg font-semibold",
-							children: u.length
-						})]
-					}),
-					/* @__PURE__ */ o("div", {
-						className: "rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-						children: [
-							/* @__PURE__ */ a("p", {
-								className: "aui-text-muted text-sm",
-								children: "Interaction proof"
-							}),
-							/* @__PURE__ */ a("p", {
-								className: "aui-text-strong mt-2 text-lg font-semibold",
-								children: "Remove and clear are isolated"
-							}),
-							/* @__PURE__ */ a("p", {
-								className: "aui-text-subtle mt-2 text-sm",
-								children: "Nested upload actions no longer conflict with the parent dropzone click surface."
-							})
-						]
-					})
-				]
-			})
-		]
-	});
-}
-//#endregion
-export { s as UploadFamilyShowcase };

package/dist/showcase/families/wizard/index.cjs

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

package/dist/showcase/families/wizard/index.d.ts

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

package/dist/showcase/families/wizard/index.js

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

package/dist/showcase/families/wizard/mock.cjs

@@ -1,5 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Stepper, Wizard } from "tembro"
-
-export function Example() {
-  return <Wizard />
-}`,highlights:[`Multi-step flow`,`Progress state`,`Guided forms`,`Step affordances`],scenarios:[{title:`Onboarding`,description:`Guide users through setup without overwhelming them.`},{title:`Checkout flow`,description:`Break complex processes into sequential steps.`},{title:`Workspace creation`,description:`Collect structured info with visible progress.`}],metrics:[{label:`Exports`,value:`2`},{label:`Steps`,value:`4`},{label:`Status`,value:`Stable`}]};exports.wizardFamilyMock=e;

package/dist/showcase/families/wizard/mock.d.ts

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

package/dist/showcase/families/wizard/mock.js

@@ -1,40 +0,0 @@
-//#region src/showcase/families/wizard/mock.ts
-var e = {
-	code: "import { Stepper, Wizard } from \"tembro\"\n\nexport function Example() {\n  return <Wizard />\n}",
-	highlights: [
-		"Multi-step flow",
-		"Progress state",
-		"Guided forms",
-		"Step affordances"
-	],
-	scenarios: [
-		{
-			title: "Onboarding",
-			description: "Guide users through setup without overwhelming them."
-		},
-		{
-			title: "Checkout flow",
-			description: "Break complex processes into sequential steps."
-		},
-		{
-			title: "Workspace creation",
-			description: "Collect structured info with visible progress."
-		}
-	],
-	metrics: [
-		{
-			label: "Exports",
-			value: "2"
-		},
-		{
-			label: "Steps",
-			value: "4"
-		},
-		{
-			label: "Status",
-			value: "Stable"
-		}
-	]
-};
-//#endregion
-export { e as wizardFamilyMock };

package/dist/showcase/families/wizard/showcase.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../components/ui/button/index.cjs");let t=require("react/jsx-runtime");var n=[`Workspace`,`Brand`,`Members`,`Publish`];function r({state:r,setState:i}){return(0,t.jsxs)(`div`,{className:`space-y-4`,children:[(0,t.jsx)(`div`,{className:`grid gap-3 md:grid-cols-4`,children:n.map((e,n)=>{let a=n+1,o=r.step===a,s=r.step>a;return(0,t.jsxs)(`button`,{onClick:()=>i({step:a}),className:`rounded-[22px] border px-4 py-4 text-left ${o?`aui-surface-strong border-[color:var(--aui-surface-strong)]`:s?`aui-status-success`:`border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] aui-text-muted`}`,children:[(0,t.jsx)(`div`,{className:`text-xs uppercase tracking-[0.24em]`,children:`Step ${a}`}),(0,t.jsx)(`div`,{className:`mt-2 text-lg font-semibold`,children:e})]},e)})}),(0,t.jsxs)(`div`,{className:`rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-5`,children:[(0,t.jsxs)(`p`,{className:`text-2xl font-semibold tracking-tight`,children:[n[r.step-1],` step`]}),(0,t.jsx)(`p`,{className:`aui-text-muted mt-2 text-sm leading-6`,children:`A multi-step guided workflow with a stable route and predictable step flow.`}),(0,t.jsxs)(`div`,{className:`mt-5 flex gap-3`,children:[(0,t.jsx)(e.Button,{variant:`outline`,onClick:()=>i({step:Math.max(1,r.step-1)}),children:`Back`}),(0,t.jsx)(e.Button,{onClick:()=>i({step:Math.min(4,r.step+1)}),children:`Next`})]})]})]})}exports.WizardFamilyShowcase=r;

package/dist/showcase/families/wizard/showcase.d.ts

@@ -1,2 +0,0 @@
-import type { FamilyDemoProps } from "../types";
-export declare function WizardFamilyShowcase({ state, setState }: FamilyDemoProps): import("react").JSX.Element;

package/dist/showcase/families/wizard/showcase.js

@@ -1,56 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
-//#region src/showcase/families/wizard/showcase.tsx
-var r = [
-	"Workspace",
-	"Brand",
-	"Members",
-	"Publish"
-];
-function i({ state: i, setState: a }) {
-	return /* @__PURE__ */ n("div", {
-		className: "space-y-4",
-		children: [/* @__PURE__ */ t("div", {
-			className: "grid gap-3 md:grid-cols-4",
-			children: r.map((e, r) => {
-				let o = r + 1, s = i.step === o, c = i.step > o;
-				return /* @__PURE__ */ n("button", {
-					onClick: () => a({ step: o }),
-					className: `rounded-[22px] border px-4 py-4 text-left ${s ? "aui-surface-strong border-[color:var(--aui-surface-strong)]" : c ? "aui-status-success" : "border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] aui-text-muted"}`,
-					children: [/* @__PURE__ */ t("div", {
-						className: "text-xs uppercase tracking-[0.24em]",
-						children: `Step ${o}`
-					}), /* @__PURE__ */ t("div", {
-						className: "mt-2 text-lg font-semibold",
-						children: e
-					})]
-				}, e);
-			})
-		}), /* @__PURE__ */ n("div", {
-			className: "rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-5",
-			children: [
-				/* @__PURE__ */ n("p", {
-					className: "text-2xl font-semibold tracking-tight",
-					children: [r[i.step - 1], " step"]
-				}),
-				/* @__PURE__ */ t("p", {
-					className: "aui-text-muted mt-2 text-sm leading-6",
-					children: "A multi-step guided workflow with a stable route and predictable step flow."
-				}),
-				/* @__PURE__ */ n("div", {
-					className: "mt-5 flex gap-3",
-					children: [/* @__PURE__ */ t(e, {
-						variant: "outline",
-						onClick: () => a({ step: Math.max(1, i.step - 1) }),
-						children: "Back"
-					}), /* @__PURE__ */ t(e, {
-						onClick: () => a({ step: Math.min(4, i.step + 1) }),
-						children: "Next"
-					})]
-				})
-			]
-		})]
-	});
-}
-//#endregion
-export { i as WizardFamilyShowcase };

package/packages/cli/vendor/src/families/badge-family.ts

@@ -1,7 +0,0 @@
-import { Badge } from "@/components/ui/badge"
-
-const BadgeFamily = {
-  Root: Badge,
-} as const
-
-export { BadgeFamily }

package/packages/cli/vendor/src/families/card-family.ts

@@ -1,26 +0,0 @@
-import { EntityCard, FileCard, InfoCard, StatisticCard } from "@/components/display"
-import {
-  Card,
-  CardAction,
-  CardContent,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-} from "@/components/ui/card"
-
-const CardFamily = {
-  Root: Card,
-  Header: CardHeader,
-  Title: CardTitle,
-  Description: CardDescription,
-  Action: CardAction,
-  Content: CardContent,
-  Footer: CardFooter,
-  Info: InfoCard,
-  Statistic: StatisticCard,
-  Entity: EntityCard,
-  File: FileCard,
-} as const
-
-export { CardFamily }

package/packages/cli/vendor/src/families/catalog.ts

@@ -1,125 +0,0 @@
-import { additionalPublicFamilies } from "@/families/public-surface-rationalization"
-
-export type ComponentFamilyName =
-  | "InputFamily"
-  | "SelectFamily"
-  | "CardFamily"
-  | "BadgeFamily"
-  | "OverlayFamily"
-  | "FormFamily"
-  | "DataTableFamily"
-  | "ActionFamily"
-  | "FeedbackFamily"
-  | "ProgressFamily"
-  | "ChartFamily"
-  | "NavigationFamily"
-  | "UploadFamily"
-  | "PrimitiveFamily"
-
-export type ComponentFamilyCatalogEntry = {
-  family: ComponentFamilyName
-  label: string
-  description: string
-  canonical: readonly string[]
-  members: readonly string[]
-  transitional?: readonly string[]
-  advanced?: readonly string[]
-}
-
-export const componentFamilyCatalog: ComponentFamilyCatalogEntry[] = [
-  {
-    family: "InputFamily",
-    label: "Input",
-    description: "Small core input surface for the input types used most often in dashboard screens.",
-    canonical: ["Input", "Textarea"],
-    members: [
-      "NumberInput",
-      "DateInput",
-      "DateRangeInput",
-      "MoneyInput",
-      "PhoneInput",
-      "FormInput",
-    ],
-    transitional: ["ClearableInput", "SearchInput", "MaskedInput", "QuantityInput"],
-    advanced: ["Slider", "RangeSlider", "Rating", "OtpInput", "ColorInput", "InlineEditable", "TagInput", "QuantityStepper"],
-  },
-  {
-    family: "SelectFamily",
-    label: "Select",
-    description: "Base select surface with async, keyboard-search, and form-wrapper members layered only when the workflow needs them.",
-    canonical: ["Select"],
-    members: ["AsyncSelect", "Combobox", "FormSelect"],
-    transitional: ["SimpleSelect", "FormAsyncSelect"],
-    advanced: ["AsyncMultiSelect"],
-  },
-  {
-    family: "CardFamily",
-    label: "Card",
-    description: "Primitive card plus dashboard and entity-oriented composed card presets.",
-    canonical: ["Card", "InfoCard"],
-    members: ["StatisticCard", "EntityCard", "FileCard", "TrendCard", "ComparisonCard"],
-    transitional: ["SmartCard", "StatCard"],
-  },
-  {
-    family: "BadgeFamily",
-    label: "Badge",
-    description: "Status, metadata, and inline labels expressed through one Badge API with tone, dot, size, and variant props.",
-    canonical: ["Badge"],
-    members: ["DeltaBadge"],
-  },
-  {
-    family: "OverlayFamily",
-    label: "Overlay",
-    description: "Dialog, popover, menu, tooltip, drawer, and hover-preview interaction surfaces grouped by behavior.",
-    canonical: ["Dialog", "Popover", "DropdownMenu"],
-    members: ["Tooltip", "HoverCard", "ConfirmDialog", "SheetShell"],
-    transitional: ["RightClickMenu", "AlertDialog", "ModalShell", "Drawer", "DialogActions"],
-  },
-  {
-    family: "FormFamily",
-    label: "Form",
-    description: "Field shell, wrappers, and builder presets.",
-    canonical: ["FormFieldShell"],
-    members: [
-      "FormInput",
-      "FormTextarea",
-      "FormSelect",
-      "FormAsyncSelect",
-      "FormSwitch",
-      "FormDatePicker",
-      "FormDateRangePicker",
-      "RepeaterField",
-    ],
-    transitional: [
-      "FormSearchInput",
-      "FormPasswordInput",
-      "FormNumberInput",
-      "FormPhoneInput",
-      "FormDateInput",
-      "FormDateRangeInput",
-    ],
-    advanced: ["FormBuilder"],
-  },
-  {
-    family: "DataTableFamily",
-    label: "Data Table",
-    description: "Canonical grid surface with a small set of reusable companions. Lower-level helpers stay secondary to the main table route.",
-    canonical: ["DataTable"],
-    members: [
-      "DataTableToolbar",
-      "DataTablePagination",
-      "DataTableRowActions",
-      "DataTableBulkActions",
-      "DataTableViewPresets",
-    ],
-    advanced: [
-      "DataTableColumnVisibilityMenu",
-      "DataTableSortableHeader",
-      "createDataTableSelectColumn",
-      "createDataTableActionsColumn",
-      "TableExportMenu",
-      "TableImportButton",
-    ],
-  },
-  ...additionalPublicFamilies,
-] as const

package/packages/cli/vendor/src/families/data-table-family.ts

@@ -1,31 +0,0 @@
-import {
-  createDataTableActionsColumn,
-  createDataTableSelectColumn,
-  DataTable,
-  DataTableBulkActions,
-  DataTableColumnVisibilityMenu,
-  DataTablePagination,
-  DataTableRowActions,
-  DataTableSortableHeader,
-  DataTableToolbar,
-  DataTableViewPresets,
-} from "@/components/data-table"
-import { TableExportMenu } from "@/components/data-table/table-export-menu"
-import { TableImportButton } from "@/components/data-table/table-import-button"
-
-const DataTableFamily = {
-  Root: DataTable,
-  Toolbar: DataTableToolbar,
-  Pagination: DataTablePagination,
-  ColumnVisibilityMenu: DataTableColumnVisibilityMenu,
-  SortableHeader: DataTableSortableHeader,
-  RowActions: DataTableRowActions,
-  BulkActions: DataTableBulkActions,
-  ViewPresets: DataTableViewPresets,
-  ExportMenu: TableExportMenu,
-  ImportButton: TableImportButton,
-  createSelectColumn: createDataTableSelectColumn,
-  createActionsColumn: createDataTableActionsColumn,
-} as const
-
-export { DataTableFamily }

package/packages/cli/vendor/src/families/docs-adoption.ts

@@ -1,103 +0,0 @@
-import {
-  componentDocsGroups,
-  type ComponentDocsGroupName,
-} from "@/families/docs-groups"
-import { getComponentMemberMetadata } from "@/families/member-queries"
-
-export type ComponentDocsBadgeTone =
-  | "stable"
-  | "preview"
-  | "advanced"
-  | "migration"
-
-export type ComponentDocsAdoption = {
-  component: string
-  group: ComponentDocsGroupName
-  badge: {
-    label: string
-    tone: ComponentDocsBadgeTone
-  }
-  recommendedOrder: number
-  sectionOrder: number
-  itemOrder: number
-}
-
-const sectionBaseOrder = {
-  primitives: 0,
-  presets: 100,
-  "form-wrappers": 200,
-  wrappers: 200,
-  extensions: 200,
-  advanced: 300,
-  transitional: 400,
-} as const
-
-function getBadgeForComponent(component: string) {
-  const metadata = getComponentMemberMetadata(component)
-
-  if (!metadata) {
-    return {
-      label: "Unknown",
-      tone: "preview" as const,
-    }
-  }
-
-  if (metadata.maturity === "canonical") {
-    return {
-      label: "Start here",
-      tone: "stable" as const,
-    }
-  }
-
-  if (metadata.maturity === "advanced") {
-    return {
-      label: "Advanced",
-      tone: "advanced" as const,
-    }
-  }
-
-  if (metadata.maturity === "transitional") {
-    return {
-      label: "Migration",
-      tone: "migration" as const,
-    }
-  }
-
-  return {
-    label: "Expand",
-    tone: "preview" as const,
-  }
-}
-
-const docsAdoptionMap = new Map<string, ComponentDocsAdoption>()
-
-for (const group of componentDocsGroups) {
-  group.sections.forEach((section, sectionIndex) => {
-    section.components.forEach((component, itemIndex) => {
-      const baseOrder =
-        sectionBaseOrder[section.id as keyof typeof sectionBaseOrder] ?? 500
-      const recommendedOrder = baseOrder + sectionIndex * 10 + itemIndex
-
-      docsAdoptionMap.set(component, {
-        component,
-        group: group.group,
-        badge: getBadgeForComponent(component),
-        recommendedOrder,
-        sectionOrder: sectionIndex,
-        itemOrder: itemIndex,
-      })
-    })
-  })
-}
-
-function getComponentDocsAdoption(component: string) {
-  return docsAdoptionMap.get(component)
-}
-
-function listDocsAdoption(group: ComponentDocsGroupName) {
-  return [...docsAdoptionMap.values()]
-    .filter((entry) => entry.group === group)
-    .sort((left, right) => left.recommendedOrder - right.recommendedOrder)
-}
-
-export { getComponentDocsAdoption, listDocsAdoption }