tembro 1.0.2 → 2.0.0

package/dist/showcase/families/filters/showcase.js

@@ -1,213 +0,0 @@
-import { Button as e } from "../../../components/ui/button/index.js";
-import { Input as t } from "../../../components/ui/input/index.js";
-import { Badge as n } from "../../../components/ui/badge/index.js";
-import { FilterChips as r } from "../../../components/filters/filter-chips.js";
-import { SavedFilterSelect as i } from "../../../components/filters/saved-filter-select.js";
-import { SimpleSelect as a } from "../../../components/inputs/simple-select.js";
-import { defaultFilterChips as o, savedViews as s, statusOptions as c } from "./data.js";
-import * as l from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
-//#region src/showcase/families/filters/showcase.tsx
-function f({ state: f, setState: p }) {
-	let [m, h] = l.useState("all-pipeline"), [g, _] = l.useState("active"), [v, y] = l.useState(o);
-	return /* @__PURE__ */ d("div", {
-		className: "space-y-4",
-		children: [/* @__PURE__ */ d("div", {
-			className: "rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4",
-			children: [
-				/* @__PURE__ */ d("div", {
-					className: "flex flex-col gap-4 xl:flex-row xl:items-start xl:justify-between",
-					children: [/* @__PURE__ */ d("div", {
-						className: "space-y-3",
-						children: [/* @__PURE__ */ d("div", {
-							className: "flex flex-wrap gap-2",
-							children: [
-								/* @__PURE__ */ u(n, {
-									variant: "outline",
-									children: "SavedFilterSelect"
-								}),
-								/* @__PURE__ */ u(n, {
-									variant: "outline",
-									children: "FilterChips"
-								}),
-								/* @__PURE__ */ u(n, {
-									variant: "outline",
-									children: "SimpleSelect"
-								})
-							]
-						}), /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("p", {
-							className: "aui-text-strong text-sm font-medium",
-							children: "Filter composition flow"
-						}), /* @__PURE__ */ u("p", {
-							className: "aui-text-muted mt-1 text-sm leading-6",
-							children: "Search, saved view switch, field-level filter and removable active chips should read like one coherent toolbar rather than separate widgets."
-						})] })]
-					}), /* @__PURE__ */ d("div", {
-						className: "flex flex-wrap gap-2",
-						children: [
-							/* @__PURE__ */ u(e, {
-								variant: "outline",
-								size: "sm",
-								onClick: () => p({ search: "" }),
-								children: "Clear query"
-							}),
-							/* @__PURE__ */ u(e, {
-								variant: "outline",
-								size: "sm",
-								onClick: () => {
-									h("all-pipeline"), _("active"), y(o), p({
-										search: "",
-										notes: "Filters reset to default operating view."
-									});
-								},
-								children: "Reset"
-							}),
-							/* @__PURE__ */ u(e, {
-								size: "sm",
-								onClick: () => p({ notes: "Current filter composition prepared for save flow." }),
-								children: "Save view"
-							})
-						]
-					})]
-				}),
-				/* @__PURE__ */ d("div", {
-					className: "mt-4 grid gap-3 xl:grid-cols-[1.2fr_0.8fr_0.8fr]",
-					children: [
-						/* @__PURE__ */ u(t, {
-							value: f.search,
-							onChange: (e) => p({ search: e.target.value }),
-							placeholder: "Search records...",
-							className: "w-full"
-						}),
-						/* @__PURE__ */ u(i, {
-							value: m,
-							onValueChange: (e) => {
-								h(e), p({ notes: `${s.find((t) => t.value === e)?.label ?? "View cleared"} applied to the table toolbar.` });
-							},
-							filters: s,
-							onSave: (e) => p({ notes: `Saved filter view requested: ${e}` }),
-							onDelete: (e) => p({ notes: `${s.find((t) => t.value === e)?.label ?? e} requested for deletion.` })
-						}),
-						/* @__PURE__ */ u(a, {
-							value: g,
-							onValueChange: (e) => {
-								_(e), p({ notes: `${c.find((t) => t.value === e)?.label ?? "Status cleared"} filter applied.` });
-							},
-							options: c,
-							placeholder: "Select status",
-							clearable: !0,
-							searchable: !0
-						})
-					]
-				}),
-				/* @__PURE__ */ u("div", {
-					className: "mt-4 rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] p-4",
-					children: /* @__PURE__ */ u(r, {
-						chips: v,
-						onRemove: (e) => {
-							y((t) => t.filter((t) => t.key !== e)), p({ notes: `${e} filter removed from the active toolbar state.` });
-						},
-						onClear: () => {
-							y([]), p({ notes: "All active filter chips cleared." });
-						}
-					})
-				})
-			]
-		}), /* @__PURE__ */ d("div", {
-			className: "grid gap-4 lg:grid-cols-[1.1fr_0.9fr]",
-			children: [/* @__PURE__ */ d("div", {
-				className: "rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4",
-				children: [/* @__PURE__ */ d("div", {
-					className: "flex flex-wrap items-center gap-2",
-					children: [
-						/* @__PURE__ */ u(n, {
-							variant: "outline",
-							children: "Step 1: query"
-						}),
-						/* @__PURE__ */ u(n, {
-							variant: "outline",
-							children: "Step 2: saved view"
-						}),
-						/* @__PURE__ */ u(n, {
-							variant: "outline",
-							children: "Step 3: active chips"
-						})
-					]
-				}), /* @__PURE__ */ d("div", {
-					className: "mt-4 grid gap-3 md:grid-cols-3",
-					children: [
-						/* @__PURE__ */ d("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-							children: [/* @__PURE__ */ u("p", {
-								className: "aui-text-strong text-sm font-medium",
-								children: "Search narrows result scope"
-							}), /* @__PURE__ */ u("p", {
-								className: "aui-text-subtle mt-2 text-sm leading-6",
-								children: "Top-level search stays lightweight and pairs with field filters instead of replacing them."
-							})]
-						}),
-						/* @__PURE__ */ d("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-							children: [/* @__PURE__ */ u("p", {
-								className: "aui-text-strong text-sm font-medium",
-								children: "Saved view restores intent"
-							}), /* @__PURE__ */ u("p", {
-								className: "aui-text-subtle mt-2 text-sm leading-6",
-								children: "Named views bring back common operating states without manually rebuilding every chip."
-							})]
-						}),
-						/* @__PURE__ */ d("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-							children: [/* @__PURE__ */ u("p", {
-								className: "aui-text-strong text-sm font-medium",
-								children: "Chips expose active state"
-							}), /* @__PURE__ */ u("p", {
-								className: "aui-text-subtle mt-2 text-sm leading-6",
-								children: "Each chip can be removed independently, and clear-all stays available for quick resets."
-							})]
-						})
-					]
-				})]
-			}), /* @__PURE__ */ u("div", {
-				className: "rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-4",
-				children: /* @__PURE__ */ d("div", {
-					className: "grid gap-3",
-					children: [
-						/* @__PURE__ */ d("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-							children: [/* @__PURE__ */ u("p", {
-								className: "aui-text-muted text-sm",
-								children: "Current query"
-							}), /* @__PURE__ */ u("p", {
-								className: "aui-text-strong mt-2 text-lg font-semibold",
-								children: f.search || "All records"
-							})]
-						}),
-						/* @__PURE__ */ d("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-							children: [/* @__PURE__ */ u("p", {
-								className: "aui-text-muted text-sm",
-								children: "Saved view"
-							}), /* @__PURE__ */ u("p", {
-								className: "aui-text-strong mt-2 text-lg font-semibold",
-								children: s.find((e) => e.value === m)?.label ?? "None"
-							})]
-						}),
-						/* @__PURE__ */ d("div", {
-							className: "rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3",
-							children: [/* @__PURE__ */ u("p", {
-								className: "aui-text-muted text-sm",
-								children: "Active chips"
-							}), /* @__PURE__ */ u("p", {
-								className: "aui-text-strong mt-2 text-lg font-semibold",
-								children: v.length
-							})]
-						})
-					]
-				})
-			})]
-		})]
-	});
-}
-//#endregion
-export { f as FiltersFamilyShowcase };

package/dist/showcase/families/form/data.cjs

@@ -1 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=[{value:`azamat-ui`,label:`Azamat UI`,description:`Public component library`,data:{team:`Core`,status:`Live`}},{value:`crm-pulse`,label:`CRM Pulse`,description:`Sales workflow module`,data:{team:`Sales`,status:`Review`}},{value:`store-command`,label:`Store Command`,description:`Commerce operations area`,data:{team:`Commerce`,status:`Live`}},{value:`finance-dock`,label:`Finance Dock`,description:`Billing admin surface`,data:{team:`Finance`,status:`Draft`}}],t=[{label:`Pinned`,options:e.slice(0,2)},{label:`All projects`,options:e.slice(2)}],n={workspaceName:`Tembro`,status:`review`,owner:`azamat-ui`,publishChanges:!0,notes:`Public documentation and component routes are being prepared for release.`};exports.defaultFormValues=n,exports.groupedWorkspaceOptions=t,exports.workspaceOptions=e;

package/dist/showcase/families/form/data.d.ts

@@ -1,22 +0,0 @@
-export type WorkspaceOption = {
-    value: string;
-    label: string;
-    description: string;
-    data: {
-        team: string;
-        status: "Live" | "Draft" | "Review";
-    };
-};
-export type FormValues = {
-    workspaceName: string;
-    status: string;
-    owner: string;
-    publishChanges: boolean;
-    notes: string;
-};
-export declare const workspaceOptions: WorkspaceOption[];
-export declare const groupedWorkspaceOptions: {
-    label: string;
-    options: WorkspaceOption[];
-}[];
-export declare const defaultFormValues: FormValues;

package/dist/showcase/families/form/data.js

@@ -1,53 +0,0 @@
-//#region src/showcase/families/form/data.ts
-var e = [
-	{
-		value: "azamat-ui",
-		label: "Azamat UI",
-		description: "Public component library",
-		data: {
-			team: "Core",
-			status: "Live"
-		}
-	},
-	{
-		value: "crm-pulse",
-		label: "CRM Pulse",
-		description: "Sales workflow module",
-		data: {
-			team: "Sales",
-			status: "Review"
-		}
-	},
-	{
-		value: "store-command",
-		label: "Store Command",
-		description: "Commerce operations area",
-		data: {
-			team: "Commerce",
-			status: "Live"
-		}
-	},
-	{
-		value: "finance-dock",
-		label: "Finance Dock",
-		description: "Billing admin surface",
-		data: {
-			team: "Finance",
-			status: "Draft"
-		}
-	}
-], t = [{
-	label: "Pinned",
-	options: e.slice(0, 2)
-}, {
-	label: "All projects",
-	options: e.slice(2)
-}], n = {
-	workspaceName: "Tembro",
-	status: "review",
-	owner: "azamat-ui",
-	publishChanges: !0,
-	notes: "Public documentation and component routes are being prepared for release."
-};
-//#endregion
-export { n as defaultFormValues, t as groupedWorkspaceOptions, e as workspaceOptions };

package/dist/showcase/families/form/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.FormFamilyShowcase=t.FormFamilyShowcase,exports.defaultFormValues=e.defaultFormValues,exports.formFamilyMock=n.formFamilyMock,exports.groupedWorkspaceOptions=e.groupedWorkspaceOptions,exports.workspaceOptions=e.workspaceOptions;

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

@@ -1,4 +0,0 @@
-export { FormFamilyShowcase } from "./showcase";
-export { formFamilyMock } from "./mock";
-export { defaultFormValues, groupedWorkspaceOptions, workspaceOptions } from "./data";
-export type { FormValues, WorkspaceOption } from "./data";

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

@@ -1,4 +0,0 @@
-import { defaultFormValues as e, groupedWorkspaceOptions as t, workspaceOptions as n } from "./data.js";
-import { FormFamilyShowcase as r } from "./showcase.js";
-import { formFamilyMock as i } from "./mock.js";
-export { r as FormFamilyShowcase, e as defaultFormValues, i as formFamilyMock, t as groupedWorkspaceOptions, n as workspaceOptions };

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

@@ -1,12 +0,0 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { FormInput, FormSelect, FormSwitch } from "tembro"
-
-export function Example() {
-  return (
-    <>
-      <FormInput control={control} name="workspaceName" label="Workspace" />
-      <FormInput control={control} name="ownerPhone" kind="phone" label="Owner phone" />
-      <FormSelect control={control} name="owner" kind="async" label="Linked workspace" />
-      <FormSwitch control={control} name="publishChanges" label="Publish after save" />
-    </>
-  )
-}`,highlights:[`Universal form wrappers`,`Async field hydration`,`Dirty + reset flow`,`Consistent validation surfaces`],scenarios:[{title:`Settings form`,description:`Keep labels, helper text, toggles and async fields aligned through the same wrapper language.`},{title:`Edit resource flow`,description:'Hydrate saved owner/workspace values back into the form route with `FormSelect kind="async"`.'},{title:`Long forms`,description:`Scale complex field groups without splitting into many narrowly named wrappers.`}],metrics:[{label:`Exports`,value:`14`},{label:`Universal wrappers`,value:`2 primary`},{label:`Status`,value:`Stable`}]};exports.formFamilyMock=e;

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

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

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

@@ -1,40 +0,0 @@
-//#region src/showcase/families/form/mock.ts
-var e = {
-	code: "import { FormInput, FormSelect, FormSwitch } from \"tembro\"\n\nexport function Example() {\n  return (\n    <>\n      <FormInput control={control} name=\"workspaceName\" label=\"Workspace\" />\n      <FormInput control={control} name=\"ownerPhone\" kind=\"phone\" label=\"Owner phone\" />\n      <FormSelect control={control} name=\"owner\" kind=\"async\" label=\"Linked workspace\" />\n      <FormSwitch control={control} name=\"publishChanges\" label=\"Publish after save\" />\n    </>\n  )\n}",
-	highlights: [
-		"Universal form wrappers",
-		"Async field hydration",
-		"Dirty + reset flow",
-		"Consistent validation surfaces"
-	],
-	scenarios: [
-		{
-			title: "Settings form",
-			description: "Keep labels, helper text, toggles and async fields aligned through the same wrapper language."
-		},
-		{
-			title: "Edit resource flow",
-			description: "Hydrate saved owner/workspace values back into the form route with `FormSelect kind=\"async\"`."
-		},
-		{
-			title: "Long forms",
-			description: "Scale complex field groups without splitting into many narrowly named wrappers."
-		}
-	],
-	metrics: [
-		{
-			label: "Exports",
-			value: "14"
-		},
-		{
-			label: "Universal wrappers",
-			value: "2 primary"
-		},
-		{
-			label: "Status",
-			value: "Stable"
-		}
-	]
-};
-//#endregion
-export { e as formFamilyMock };

package/dist/showcase/families/form/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/form/form-input.cjs"),i=require("../../../components/form/form-select.cjs"),a=require("../../../components/form/form-switch.cjs"),o=require("../../../components/form/form-textarea.cjs"),s=require("./data.cjs");let c=require("react");c=e.__toESM(c,1);let l=require("react/jsx-runtime"),u=require("react-hook-form");function d({setState:e}){let[d,f]=c.useState(`editing`),p=(0,u.useForm)({defaultValues:s.defaultFormValues}),m=(0,u.useWatch)({control:p.control,name:`publishChanges`}),h=(0,u.useWatch)({control:p.control,name:`workspaceName`}),g=(0,u.useWatch)({control:p.control,name:`status`}),_=(0,u.useWatch)({control:p.control,name:`owner`}),v=c.useCallback(async e=>{await new Promise(e=>window.setTimeout(e,260));let t=e.trim().toLowerCase();return t?[{label:`Search results`,options:s.workspaceOptions.filter(e=>[e.label,e.description,e.data.team,e.data.status].join(` `).toLowerCase().includes(t))}]:s.groupedWorkspaceOptions},[]),y=c.useCallback(async e=>(await new Promise(e=>window.setTimeout(e,120)),s.workspaceOptions.find(t=>t.value===e)??null),[]),b=p.handleSubmit(async t=>{f(`submitting`),await new Promise(e=>window.setTimeout(e,420)),f(`saved`),e({notes:`Saved ${t.workspaceName} with ${t.status} status and ${t.publishChanges?`enabled`:`disabled`} publish sync.`})});return(0,l.jsxs)(`div`,{className:`space-y-4`,children:[(0,l.jsx)(`div`,{className:`rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-5`,children:(0,l.jsxs)(`div`,{className:`flex flex-col gap-4 xl:flex-row xl:items-start xl:justify-between`,children:[(0,l.jsxs)(`div`,{className:`space-y-3`,children:[(0,l.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,l.jsx)(n.Badge,{variant:`outline`,children:`react-hook-form`}),(0,l.jsx)(n.Badge,{variant:`outline`,children:`Wrapped fields`}),(0,l.jsx)(n.Badge,{variant:`outline`,children:`Async entity select`}),(0,l.jsx)(n.Badge,{variant:`outline`,children:p.formState.isDirty?`Dirty`:`Pristine`})]}),(0,l.jsxs)(`div`,{children:[(0,l.jsx)(`p`,{className:`aui-text-strong text-sm font-medium`,children:`Settings editor flow`}),(0,l.jsx)(`p`,{className:`aui-text-muted mt-1 text-sm leading-6`,children:`Wrapped field shell, async entity selection, boolean control, helper copy and submit/reset behavior should read like one coherent form route.`})]})]}),(0,l.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,l.jsx)(t.Button,{variant:`outline`,size:`sm`,onClick:()=>{p.reset(s.defaultFormValues),f(`editing`)},children:`Reset`}),(0,l.jsx)(t.Button,{size:`sm`,onClick:()=>void b(),disabled:d===`submitting`,children:d===`submitting`?`Saving...`:d===`saved`?`Saved`:`Save changes`})]})]})}),(0,l.jsxs)(`div`,{className:`grid gap-4 xl:grid-cols-[1.08fr_0.92fr]`,children:[(0,l.jsxs)(`div`,{className:`space-y-4 rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-5`,children:[(0,l.jsxs)(`form`,{className:`grid gap-4`,onSubmit:e=>{e.preventDefault(),b()},children:[(0,l.jsxs)(`div`,{className:`grid gap-4 md:grid-cols-2`,children:[(0,l.jsx)(r.FormInput,{control:p.control,name:`workspaceName`,label:`Workspace name`,required:!0,placeholder:`Enter workspace name`,description:`Primary title rendered across docs, templates, and component routes.`,fieldClassName:`h-11`}),(0,l.jsx)(i.FormSelect,{control:p.control,name:`status`,label:`Release status`,required:!0,description:`Use a controlled select for lifecycle state.`,options:[{label:`Draft`,value:`draft`},{label:`Review`,value:`review`},{label:`Live`,value:`live`}],placeholder:`Choose status`})]}),(0,l.jsx)(i.FormSelect,{control:p.control,name:`owner`,kind:`async`,label:`Linked workspace`,required:!0,description:`Hydrate saved entity values back into the form and keep async selection inside the same FormSelect API.`,defaultOptions:s.groupedWorkspaceOptions,loadOptions:v,loadSelectedOption:y,labels:{placeholder:`Select workspace`,searchPlaceholder:`Search workspaces...`,loading:`Loading workspaces...`,empty:`No workspace found`},renderValue:e=>(0,l.jsxs)(`span`,{className:`inline-flex min-w-0 flex-col text-left`,children:[(0,l.jsx)(`span`,{className:`truncate`,children:e.label}),(0,l.jsx)(`span`,{className:`aui-text-muted truncate text-xs`,children:e.data.team})]}),renderOption:(e,t)=>(0,l.jsxs)(`span`,{className:`flex min-w-0 items-start justify-between gap-3`,children:[(0,l.jsxs)(`span`,{className:`min-w-0`,children:[(0,l.jsx)(`span`,{className:`block truncate font-medium`,children:e.label}),(0,l.jsx)(`span`,{className:`aui-text-muted block truncate text-xs`,children:e.description})]}),(0,l.jsx)(`span`,{className:t.selected?`rounded-full aui-surface-strong px-2 py-0.5 text-[11px]`:`aui-text-muted rounded-full bg-[color:var(--aui-surface-muted)] px-2 py-0.5 text-[11px]`,children:e.data.status})]})}),(0,l.jsx)(o.FormTextarea,{control:p.control,name:`notes`,label:`Release notes`,description:`Long-form copy should stay aligned with labels, descriptions and validation shell.`,fieldClassName:`min-h-28`}),(0,l.jsx)(a.FormSwitch,{control:p.control,name:`publishChanges`,label:`Publish after save`,description:`Demonstrates wrapped boolean controls inside the same form system.`})]}),(0,l.jsxs)(`div`,{className:`grid gap-3 md:grid-cols-3`,children:[(0,l.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3`,children:[(0,l.jsx)(`p`,{className:`aui-text-strong text-sm font-medium`,children:`Step 1: edit fields`}),(0,l.jsx)(`p`,{className:`aui-text-subtle mt-2 text-sm leading-6`,children:`Text, select, async select and textarea stay aligned inside one shell system.`})]}),(0,l.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3`,children:[(0,l.jsx)(`p`,{className:`aui-text-strong text-sm font-medium`,children:`Step 2: track dirty`}),(0,l.jsx)(`p`,{className:`aui-text-subtle mt-2 text-sm leading-6`,children:`Pristine and dirty state remain visible without building custom page-specific glue.`})]}),(0,l.jsxs)(`div`,{className:`rounded-[18px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg-alt)] px-4 py-3`,children:[(0,l.jsx)(`p`,{className:`aui-text-strong text-sm font-medium`,children:`Step 3: submit flow`}),(0,l.jsx)(`p`,{className:`aui-text-subtle mt-2 text-sm leading-6`,children:`Save and reset show real behavior instead of just decorative buttons.`})]})]})]}),(0,l.jsxs)(`div`,{className:`space-y-4 rounded-[22px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface)] p-5`,children:[(0,l.jsxs)(`div`,{className:`grid gap-3 md:grid-cols-2 xl:grid-cols-1`,children:[(0,l.jsxs)(`div`,{className:`rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface-muted)] p-4`,children:[(0,l.jsx)(`p`,{className:`aui-text-muted text-sm`,children:`Form state`}),(0,l.jsx)(`p`,{className:`aui-text-strong mt-2 text-lg font-semibold`,children:d}),(0,l.jsx)(`p`,{className:`aui-text-subtle mt-2 text-sm`,children:p.formState.isDirty?`There are unsaved changes in the editor.`:`Current values match the saved snapshot.`})]}),(0,l.jsxs)(`div`,{className:`rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface-muted)] p-4`,children:[(0,l.jsx)(`p`,{className:`aui-text-muted text-sm`,children:`Current workspace`}),(0,l.jsx)(`p`,{className:`aui-text-strong mt-2 text-lg font-semibold`,children:h||`Untitled workspace`}),(0,l.jsxs)(`p`,{className:`aui-text-subtle mt-2 text-sm`,children:[`Status: `,g,` • Owner: `,_]})]}),(0,l.jsxs)(`div`,{className:`rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface-muted)] p-4`,children:[(0,l.jsx)(`p`,{className:`aui-text-muted text-sm`,children:`Submit behavior`}),(0,l.jsxs)(`div`,{className:`mt-3 flex flex-wrap gap-2`,children:[(0,l.jsx)(n.Badge,{variant:`outline`,children:`Reset`}),(0,l.jsx)(n.Badge,{variant:`outline`,children:`Dirty tracking`}),(0,l.jsx)(n.Badge,{variant:`outline`,children:`Async hydrate`}),(0,l.jsx)(n.Badge,{variant:`outline`,children:m?`Publish on`:`Publish off`})]})]})]}),(0,l.jsxs)(`div`,{className:`rounded-[20px] border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-surface-muted)] p-4`,children:[(0,l.jsx)(`p`,{className:`aui-text-muted text-sm`,children:`Why this matters`}),(0,l.jsxs)(`div`,{className:`aui-text-subtle mt-3 space-y-2 text-sm`,children:[(0,l.jsx)(`p`,{children:`One wrapper system keeps label, helper and error layout consistent.`}),(0,l.jsx)(`p`,{children:`Async fields can hydrate edit values instead of only supporting fresh creation.`}),(0,l.jsx)(`p`,{children:`Form route now shows actual submit and reset flow instead of static decoration.`})]})]})]})]})]})}exports.FormFamilyShowcase=d;

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

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