tembro 1.0.0

package/dist/components/overlay/sheet-shell.js

@@ -0,0 +1,116 @@
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import * as n from "react";
+import { XIcon as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Dialog as o } from "@base-ui/react/dialog";
+//#region src/components/overlay/sheet-shell.tsx
+var s = o.Root;
+function c({ ...e }) {
+	return /* @__PURE__ */ i(o.Trigger, {
+		"data-slot": "sheet-trigger",
+		...e
+	});
+}
+function l({ ...e }) {
+	return /* @__PURE__ */ i(o.Portal, {
+		"data-slot": "sheet-portal",
+		...e
+	});
+}
+function u({ ...e }) {
+	return /* @__PURE__ */ i(o.Close, {
+		"data-slot": "sheet-close",
+		...e
+	});
+}
+function d({ className: t, ...n }) {
+	return /* @__PURE__ */ i(o.Backdrop, {
+		"data-slot": "sheet-overlay",
+		className: e("fixed inset-0 z-50 bg-foreground/12 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", t),
+		...n
+	});
+}
+var f = {
+	top: "inset-x-0 top-0 max-h-[85vh] rounded-b-xl border-b data-open:slide-in-from-top data-closed:slide-out-to-top",
+	right: "inset-y-0 right-0 h-full w-3/4 max-w-sm border-l data-open:slide-in-from-right data-closed:slide-out-to-right sm:max-w-md",
+	bottom: "inset-x-0 bottom-0 max-h-[85vh] rounded-t-xl border-t data-open:slide-in-from-bottom data-closed:slide-out-to-bottom",
+	left: "inset-y-0 left-0 h-full w-3/4 max-w-sm border-r data-open:slide-in-from-left data-closed:slide-out-to-left sm:max-w-md"
+};
+function p({ className: n, children: s, side: c = "right", showCloseButton: p = !0, ...m }) {
+	return /* @__PURE__ */ a(l, { children: [/* @__PURE__ */ i(d, {}), /* @__PURE__ */ a(o.Popup, {
+		"data-slot": "sheet-content",
+		className: e("fixed z-50 flex flex-col gap-4 bg-background p-4 text-foreground shadow-xl outline-none duration-200 data-open:animate-in data-closed:animate-out", f[c], n),
+		...m,
+		children: [s, p && /* @__PURE__ */ a(u, {
+			render: /* @__PURE__ */ i(t, {
+				type: "button",
+				variant: "ghost",
+				size: "icon-sm",
+				className: "absolute right-3 top-3"
+			}),
+			children: [/* @__PURE__ */ i(r, {}), /* @__PURE__ */ i("span", {
+				className: "sr-only",
+				children: "Close"
+			})]
+		})]
+	})] });
+}
+function m({ className: t, ...n }) {
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "sheet-header",
+		className: e("flex flex-col gap-2 pr-8", t),
+		...n
+	});
+}
+function h({ className: t, ...n }) {
+	return /* @__PURE__ */ i("div", {
+		"data-slot": "sheet-footer",
+		className: e("mt-auto flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
+		...n
+	});
+}
+function g({ className: t, ...n }) {
+	return /* @__PURE__ */ i(o.Title, {
+		"data-slot": "sheet-title",
+		className: e("font-heading text-base font-medium leading-none", t),
+		...n
+	});
+}
+function _({ className: t, ...n }) {
+	return /* @__PURE__ */ i(o.Description, {
+		"data-slot": "sheet-description",
+		className: e("text-sm text-muted-foreground", t),
+		...n
+	});
+}
+function v(e) {
+	return e ? n.isValidElement(e) ? /* @__PURE__ */ i(c, { render: e }) : /* @__PURE__ */ i(c, { children: e }) : null;
+}
+function y({ open: t, defaultOpen: n, onOpenChange: r, trigger: o, title: c, description: l, children: u, footer: d, side: f = "right", showCloseButton: y = !0, contentClassName: b, headerClassName: x, bodyClassName: S }) {
+	let C = !!(c || l);
+	return /* @__PURE__ */ a(s, {
+		open: t,
+		defaultOpen: n,
+		onOpenChange: r,
+		children: [v(o), /* @__PURE__ */ a(p, {
+			side: f,
+			showCloseButton: y,
+			className: b,
+			children: [
+				C && /* @__PURE__ */ a(m, {
+					className: x,
+					children: [c && /* @__PURE__ */ i(g, { children: c }), l && /* @__PURE__ */ i(_, { children: l })]
+				}),
+				u && /* @__PURE__ */ i("div", {
+					"data-slot": "sheet-shell-body",
+					className: e("min-w-0 flex-1", S),
+					children: u
+				}),
+				d && /* @__PURE__ */ i(h, { children: d })
+			]
+		})]
+	});
+}
+//#endregion
+export { s as Sheet, u as SheetClose, p as SheetContent, _ as SheetDescription, h as SheetFooter, m as SheetHeader, d as SheetOverlay, l as SheetPortal, y as SheetShell, g as SheetTitle, c as SheetTrigger };

package/dist/components/patterns/demo.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../showcase/create-demo.cjs");var t=e.createShowcaseDemoRegistry([e.component(`resource-page`,`ResourcePage`,`patterns`,`Full resource index page shell for admin dashboards.`),e.component(`resource-detail-page`,`ResourceDetailPage`,`patterns`,`Detail page shell with title, metadata and sections.`)]);exports.patternsShowcaseDemoRegistry=t;

package/dist/components/patterns/demo.d.ts

@@ -0,0 +1,6 @@
+export declare const patternsShowcaseDemoRegistry: {
+    [k: string]: {
+        mock: import("../../showcase").ShowcaseDemoMock;
+        Showcase: (props: import("../../showcase").ShowcaseDemoProps) => import("react").JSX.Element;
+    };
+};

package/dist/components/patterns/demo.js

@@ -0,0 +1,5 @@
+import { component as e, createShowcaseDemoRegistry as t } from "../../showcase/create-demo.js";
+//#region src/components/patterns/demo.tsx
+var n = t([e("resource-page", "ResourcePage", "patterns", "Full resource index page shell for admin dashboards."), e("resource-detail-page", "ResourceDetailPage", "patterns", "Detail page shell with title, metadata and sections.")]);
+//#endregion
+export { n as patternsShowcaseDemoRegistry };

package/dist/components/patterns/form-builder-presets.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./form-builder.cjs");exports.asyncSelectField=e.asyncSelectField,exports.customField=e.customField,exports.dateField=e.dateField,exports.dateRangeField=e.dateRangeField,exports.formSection=e.formSection,exports.inputField=e.inputField,exports.numberField=e.numberField,exports.phoneField=e.phoneField,exports.selectField=e.selectField,exports.switchField=e.switchField,exports.textareaField=e.textareaField;

package/dist/components/patterns/form-builder-presets.d.ts

@@ -0,0 +1 @@
+export { asyncSelectField, customField, dateField, dateRangeField, formSection, inputField, numberField, phoneField, selectField, switchField, textareaField, } from "./form-builder";

package/dist/components/patterns/form-builder-presets.js

@@ -0,0 +1,2 @@
+import { asyncSelectField as e, customField as t, dateField as n, dateRangeField as r, formSection as i, inputField as a, numberField as o, phoneField as s, selectField as c, switchField as l, textareaField as u } from "./form-builder.js";
+export { e as asyncSelectField, t as customField, n as dateField, r as dateRangeField, i as formSection, a as inputField, o as numberField, s as phoneField, c as selectField, l as switchField, u as textareaField };

package/dist/components/patterns/form-builder.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../form/form-input.cjs"),i=require("../form/form-select.cjs"),a=require("../form/form-switch.cjs"),o=require("../form/form-textarea.cjs"),s=require("../form/form-async-select.cjs"),c=require("../form/form-date-input.cjs"),l=require("../form/form-date-range-input.cjs"),u=require("../form/form-number-input.cjs"),d=require("../form/form-phone-input.cjs");let f=require("react");f=e.__toESM(f,1);let p=require("react/jsx-runtime");var m={compact:`gap-3`,default:`gap-4`,comfortable:`gap-6`},h={1:`grid-cols-1`,2:`grid-cols-1 md:grid-cols-2`,3:`grid-cols-1 md:grid-cols-2 xl:grid-cols-3`,4:`grid-cols-1 md:grid-cols-2 xl:grid-cols-4`},g={1:`col-span-1`,2:`md:col-span-2`,3:`xl:col-span-3`,4:`xl:col-span-4`,full:`col-span-full`};function _(e){let{id:t,hidden:n,className:r,colSpan:i,props:a}=e;return{base:{id:t,hidden:n,className:r,colSpan:i},props:a}}function v(e){let{base:t,props:n}=_(e);return{...t,type:`input`,props:n}}function y(e){let{base:t,props:n}=_(e);return{...t,type:`textarea`,props:n}}function b(e){let{base:t,props:n}=_(e);return{...t,type:`select`,props:n}}function x(e){let{base:t,props:n}=_(e);return{...t,type:`async-select`,props:n}}function S(e){let{base:t,props:n}=_(e);return{...t,type:`switch`,props:n}}function C(e){let{base:t,props:n}=_(e);return{...t,type:`number`,props:n}}function w(e){let{base:t,props:n}=_(e);return{...t,type:`phone`,props:n}}function T(e){let{base:t,props:n}=_(e);return{...t,type:`date`,props:n}}function E(e){let{base:t,props:n}=_(e);return{...t,type:`date-range`,props:n}}function D(e){let{id:t,hidden:n,className:r,colSpan:i,render:a}=e;return{id:t,hidden:n,className:r,colSpan:i,type:`custom`,render:a}}function O(e){return e}function k(e,t){let n=r.FormInput,m=i.FormSelect;switch(e.type){case`custom`:return e.render(t);case`input`:return f.createElement(n,{control:t.control,disabled:t.disabled,readOnly:t.readOnly,...e.props});case`textarea`:return(0,p.jsx)(o.FormTextarea,{control:t.control,disabled:t.disabled,readOnly:t.readOnly,...e.props});case`select`:return f.createElement(m,{control:t.control,disabled:t.disabled,...e.props});case`async-select`:return(0,p.jsx)(s.FormAsyncSelect,{control:t.control,disabled:t.disabled,...e.props});case`switch`:return(0,p.jsx)(a.FormSwitch,{control:t.control,disabled:t.disabled,...e.props});case`number`:return(0,p.jsx)(u.FormNumberInput,{control:t.control,disabled:t.disabled,readOnly:t.readOnly,...e.props});case`phone`:return(0,p.jsx)(d.FormPhoneInput,{control:t.control,disabled:t.disabled,readOnly:t.readOnly,...e.props});case`date`:return(0,p.jsx)(c.FormDateInput,{control:t.control,disabled:t.disabled,readOnly:t.readOnly,...e.props});case`date-range`:return(0,p.jsx)(l.FormDateRangeInput,{control:t.control,fromInputProps:{disabled:t.disabled,readOnly:t.readOnly},toInputProps:{disabled:t.disabled,readOnly:t.readOnly},...e.props});default:return null}}function A({fields:e,sections:t}){return t?.length?t:[{id:`default`,fields:e??[]}]}function j({className:e,control:r,fields:i,sections:a,layout:o=`grid`,density:s=`default`,columns:c=2,disabled:l,readOnly:u,footer:d,submitLabel:_,resetLabel:v,onResetClick:y,isSubmitting:b,sectionClassName:x,fieldClassName:S,footerClassName:C,...w}){let T=A({fields:i,sections:a}),E=f.useMemo(()=>({control:r,disabled:l,readOnly:u}),[r,l,u]);return(0,p.jsxs)(`form`,{"data-slot":`form-builder`,className:t.cn(`grid`,m[s],e),...w,children:[T.filter(e=>!e.hidden).map(e=>(0,p.jsxs)(`section`,{"data-slot":`form-builder-section`,className:t.cn(`grid gap-4`,e.className,x),children:[(e.title||e.description||e.actions)&&(0,p.jsxs)(`div`,{"data-slot":`form-builder-section-header`,className:`flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between`,children:[(0,p.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[e.title&&(0,p.jsx)(`h2`,{className:`text-base font-semibold leading-none tracking-tight`,children:e.title}),e.description&&(0,p.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.description})]}),e.actions&&(0,p.jsx)(`div`,{className:`flex shrink-0 flex-wrap items-center gap-2`,children:e.actions})]}),(0,p.jsx)(`div`,{"data-slot":`form-builder-fields`,"data-layout":o,className:t.cn(`grid`,m[s],o===`grid`?h[c]:`grid-cols-1`),children:e.fields.filter(e=>!e.hidden).map(e=>(0,p.jsx)(`div`,{"data-slot":`form-builder-field`,className:t.cn(e.colSpan&&g[e.colSpan],e.className,S),children:k(e,E)},e.id))})]},e.id)),(d||_||v)&&(0,p.jsx)(`div`,{"data-slot":`form-builder-footer`,className:t.cn(`flex flex-wrap items-center justify-end gap-2`,C),children:d??(0,p.jsxs)(p.Fragment,{children:[v&&(0,p.jsx)(n.Button,{type:`button`,variant:`outline`,disabled:l||b,onClick:y,children:v}),_&&(0,p.jsx)(n.Button,{type:`submit`,disabled:l||b,children:_})]})})]})}exports.FormBuilder=j,exports.asyncSelectField=x,exports.customField=D,exports.dateField=T,exports.dateRangeField=E,exports.formSection=O,exports.inputField=v,exports.numberField=C,exports.phoneField=w,exports.renderFormBuilderField=k,exports.selectField=b,exports.switchField=S,exports.textareaField=y;

package/dist/components/patterns/form-builder.d.ts

@@ -0,0 +1,109 @@
+import * as React from "react";
+import type { Control, FieldPath, FieldValues } from "react-hook-form";
+import { type FormInputProps } from "@/components/form/form-input";
+import { type FormTextareaProps } from "@/components/form/form-textarea";
+import { type FormSelectProps } from "@/components/form/form-select";
+import { type FormAsyncSelectProps } from "@/components/form/form-async-select";
+import { type FormSwitchProps } from "@/components/form/form-switch";
+import { type FormNumberInputProps } from "@/components/form/form-number-input";
+import { type FormPhoneInputProps } from "@/components/form/form-phone-input";
+import { type FormDateInputProps } from "@/components/form/form-date-input";
+import { type FormDateRangeInputProps } from "@/components/form/form-date-range-input";
+export type FormBuilderLayout = "grid" | "stack";
+export type FormBuilderDensity = "compact" | "default" | "comfortable";
+export type FormBuilderFieldRenderContext<TFieldValues extends FieldValues> = {
+    control: Control<TFieldValues>;
+    disabled?: boolean;
+    readOnly?: boolean;
+};
+type BaseFormBuilderField = {
+    id: string;
+    hidden?: boolean;
+    className?: string;
+    colSpan?: 1 | 2 | 3 | 4 | "full";
+};
+export type FormBuilderCustomField<TFieldValues extends FieldValues> = BaseFormBuilderField & {
+    type: "custom";
+    render: (context: FormBuilderFieldRenderContext<TFieldValues>) => React.ReactNode;
+};
+export type FormBuilderInputField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "input";
+    props: Omit<FormInputProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderTextareaField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "textarea";
+    props: Omit<FormTextareaProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderSelectField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "select";
+    props: Omit<FormSelectProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderAsyncSelectField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "async-select";
+    props: Omit<FormAsyncSelectProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderSwitchField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "switch";
+    props: Omit<FormSwitchProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderNumberField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "number";
+    props: Omit<FormNumberInputProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderPhoneField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "phone";
+    props: Omit<FormPhoneInputProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderDateField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "date";
+    props: Omit<FormDateInputProps<TFieldValues, TName>, "control">;
+};
+export type FormBuilderDateRangeField<TFieldValues extends FieldValues, TFromName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TToName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = BaseFormBuilderField & {
+    type: "date-range";
+    props: Omit<FormDateRangeInputProps<TFieldValues, TFromName, TToName>, "control">;
+};
+export type FormBuilderField<TFieldValues extends FieldValues> = FormBuilderCustomField<TFieldValues> | FormBuilderInputField<TFieldValues> | FormBuilderTextareaField<TFieldValues> | FormBuilderSelectField<TFieldValues> | FormBuilderAsyncSelectField<TFieldValues> | FormBuilderSwitchField<TFieldValues> | FormBuilderNumberField<TFieldValues> | FormBuilderPhoneField<TFieldValues> | FormBuilderDateField<TFieldValues> | FormBuilderDateRangeField<TFieldValues>;
+export type FormBuilderSection<TFieldValues extends FieldValues> = {
+    id: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
+    hidden?: boolean;
+    className?: string;
+    fields: FormBuilderField<TFieldValues>[];
+};
+export type FormBuilderProps<TFieldValues extends FieldValues> = Omit<React.ComponentProps<"form">, "children"> & {
+    control: Control<TFieldValues>;
+    fields?: FormBuilderField<TFieldValues>[];
+    sections?: FormBuilderSection<TFieldValues>[];
+    layout?: FormBuilderLayout;
+    density?: FormBuilderDensity;
+    columns?: 1 | 2 | 3 | 4;
+    disabled?: boolean;
+    readOnly?: boolean;
+    footer?: React.ReactNode;
+    submitLabel?: React.ReactNode;
+    resetLabel?: React.ReactNode;
+    onResetClick?: () => void;
+    isSubmitting?: boolean;
+    sectionClassName?: string;
+    fieldClassName?: string;
+    footerClassName?: string;
+};
+type FieldPresetOptions<TProps> = BaseFormBuilderField & {
+    props: TProps;
+};
+declare function inputField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderInputField<TFieldValues, TName>["props"]>): FormBuilderInputField<TFieldValues, TName>;
+declare function textareaField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderTextareaField<TFieldValues, TName>["props"]>): FormBuilderTextareaField<TFieldValues, TName>;
+declare function selectField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderSelectField<TFieldValues, TName>["props"]>): FormBuilderSelectField<TFieldValues, TName>;
+declare function asyncSelectField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderAsyncSelectField<TFieldValues, TName>["props"]>): FormBuilderAsyncSelectField<TFieldValues, TName>;
+declare function switchField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderSwitchField<TFieldValues, TName>["props"]>): FormBuilderSwitchField<TFieldValues, TName>;
+declare function numberField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderNumberField<TFieldValues, TName>["props"]>): FormBuilderNumberField<TFieldValues, TName>;
+declare function phoneField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderPhoneField<TFieldValues, TName>["props"]>): FormBuilderPhoneField<TFieldValues, TName>;
+declare function dateField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderDateField<TFieldValues, TName>["props"]>): FormBuilderDateField<TFieldValues, TName>;
+declare function dateRangeField<TFieldValues extends FieldValues, TFromName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TToName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(options: FieldPresetOptions<FormBuilderDateRangeField<TFieldValues, TFromName, TToName>["props"]>): FormBuilderDateRangeField<TFieldValues, TFromName, TToName>;
+declare function customField<TFieldValues extends FieldValues>(options: BaseFormBuilderField & Pick<FormBuilderCustomField<TFieldValues>, "render">): FormBuilderCustomField<TFieldValues>;
+declare function formSection<TFieldValues extends FieldValues>(section: FormBuilderSection<TFieldValues>): FormBuilderSection<TFieldValues>;
+declare function renderFormBuilderField<TFieldValues extends FieldValues>(field: FormBuilderField<TFieldValues>, context: FormBuilderFieldRenderContext<TFieldValues>): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | React.JSX.Element | null | undefined;
+declare function FormBuilder<TFieldValues extends FieldValues>({ className, control, fields, sections, layout, density, columns, disabled, readOnly, footer, submitLabel, resetLabel, onResetClick, isSubmitting, sectionClassName, fieldClassName, footerClassName, ...props }: FormBuilderProps<TFieldValues>): React.JSX.Element;
+export { FormBuilder, asyncSelectField, customField, dateField, dateRangeField, formSection, inputField, numberField, phoneField, renderFormBuilderField, selectField, switchField, textareaField, };

package/dist/components/patterns/form-builder.js

@@ -0,0 +1,263 @@
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import { FormInput as n } from "../form/form-input.js";
+import { FormSelect as r } from "../form/form-select.js";
+import { FormSwitch as i } from "../form/form-switch.js";
+import { FormTextarea as a } from "../form/form-textarea.js";
+import { FormAsyncSelect as o } from "../form/form-async-select.js";
+import { FormDateInput as s } from "../form/form-date-input.js";
+import { FormDateRangeInput as c } from "../form/form-date-range-input.js";
+import { FormNumberInput as l } from "../form/form-number-input.js";
+import { FormPhoneInput as u } from "../form/form-phone-input.js";
+import * as d from "react";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/patterns/form-builder.tsx
+var h = {
+	compact: "gap-3",
+	default: "gap-4",
+	comfortable: "gap-6"
+}, g = {
+	1: "grid-cols-1",
+	2: "grid-cols-1 md:grid-cols-2",
+	3: "grid-cols-1 md:grid-cols-2 xl:grid-cols-3",
+	4: "grid-cols-1 md:grid-cols-2 xl:grid-cols-4"
+}, _ = {
+	1: "col-span-1",
+	2: "md:col-span-2",
+	3: "xl:col-span-3",
+	4: "xl:col-span-4",
+	full: "col-span-full"
+};
+function v(e) {
+	let { id: t, hidden: n, className: r, colSpan: i, props: a } = e;
+	return {
+		base: {
+			id: t,
+			hidden: n,
+			className: r,
+			colSpan: i
+		},
+		props: a
+	};
+}
+function y(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "input",
+		props: n
+	};
+}
+function b(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "textarea",
+		props: n
+	};
+}
+function x(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "select",
+		props: n
+	};
+}
+function S(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "async-select",
+		props: n
+	};
+}
+function C(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "switch",
+		props: n
+	};
+}
+function w(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "number",
+		props: n
+	};
+}
+function T(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "phone",
+		props: n
+	};
+}
+function E(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "date",
+		props: n
+	};
+}
+function D(e) {
+	let { base: t, props: n } = v(e);
+	return {
+		...t,
+		type: "date-range",
+		props: n
+	};
+}
+function O(e) {
+	let { id: t, hidden: n, className: r, colSpan: i, render: a } = e;
+	return {
+		id: t,
+		hidden: n,
+		className: r,
+		colSpan: i,
+		type: "custom",
+		render: a
+	};
+}
+function k(e) {
+	return e;
+}
+function A(e, t) {
+	let f = n, m = r;
+	switch (e.type) {
+		case "custom": return e.render(t);
+		case "input": return d.createElement(f, {
+			control: t.control,
+			disabled: t.disabled,
+			readOnly: t.readOnly,
+			...e.props
+		});
+		case "textarea": return /* @__PURE__ */ p(a, {
+			control: t.control,
+			disabled: t.disabled,
+			readOnly: t.readOnly,
+			...e.props
+		});
+		case "select": return d.createElement(m, {
+			control: t.control,
+			disabled: t.disabled,
+			...e.props
+		});
+		case "async-select": return /* @__PURE__ */ p(o, {
+			control: t.control,
+			disabled: t.disabled,
+			...e.props
+		});
+		case "switch": return /* @__PURE__ */ p(i, {
+			control: t.control,
+			disabled: t.disabled,
+			...e.props
+		});
+		case "number": return /* @__PURE__ */ p(l, {
+			control: t.control,
+			disabled: t.disabled,
+			readOnly: t.readOnly,
+			...e.props
+		});
+		case "phone": return /* @__PURE__ */ p(u, {
+			control: t.control,
+			disabled: t.disabled,
+			readOnly: t.readOnly,
+			...e.props
+		});
+		case "date": return /* @__PURE__ */ p(s, {
+			control: t.control,
+			disabled: t.disabled,
+			readOnly: t.readOnly,
+			...e.props
+		});
+		case "date-range": return /* @__PURE__ */ p(c, {
+			control: t.control,
+			fromInputProps: {
+				disabled: t.disabled,
+				readOnly: t.readOnly
+			},
+			toInputProps: {
+				disabled: t.disabled,
+				readOnly: t.readOnly
+			},
+			...e.props
+		});
+		default: return null;
+	}
+}
+function j({ fields: e, sections: t }) {
+	return t?.length ? t : [{
+		id: "default",
+		fields: e ?? []
+	}];
+}
+function M({ className: n, control: r, fields: i, sections: a, layout: o = "grid", density: s = "default", columns: c = 2, disabled: l, readOnly: u, footer: v, submitLabel: y, resetLabel: b, onResetClick: x, isSubmitting: S, sectionClassName: C, fieldClassName: w, footerClassName: T, ...E }) {
+	let D = j({
+		fields: i,
+		sections: a
+	}), O = d.useMemo(() => ({
+		control: r,
+		disabled: l,
+		readOnly: u
+	}), [
+		r,
+		l,
+		u
+	]);
+	return /* @__PURE__ */ m("form", {
+		"data-slot": "form-builder",
+		className: e("grid", h[s], n),
+		...E,
+		children: [D.filter((e) => !e.hidden).map((t) => /* @__PURE__ */ m("section", {
+			"data-slot": "form-builder-section",
+			className: e("grid gap-4", t.className, C),
+			children: [(t.title || t.description || t.actions) && /* @__PURE__ */ m("div", {
+				"data-slot": "form-builder-section-header",
+				className: "flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",
+				children: [/* @__PURE__ */ m("div", {
+					className: "min-w-0 space-y-1",
+					children: [t.title && /* @__PURE__ */ p("h2", {
+						className: "text-base font-semibold leading-none tracking-tight",
+						children: t.title
+					}), t.description && /* @__PURE__ */ p("p", {
+						className: "text-sm text-muted-foreground",
+						children: t.description
+					})]
+				}), t.actions && /* @__PURE__ */ p("div", {
+					className: "flex shrink-0 flex-wrap items-center gap-2",
+					children: t.actions
+				})]
+			}), /* @__PURE__ */ p("div", {
+				"data-slot": "form-builder-fields",
+				"data-layout": o,
+				className: e("grid", h[s], o === "grid" ? g[c] : "grid-cols-1"),
+				children: t.fields.filter((e) => !e.hidden).map((t) => /* @__PURE__ */ p("div", {
+					"data-slot": "form-builder-field",
+					className: e(t.colSpan && _[t.colSpan], t.className, w),
+					children: A(t, O)
+				}, t.id))
+			})]
+		}, t.id)), (v || y || b) && /* @__PURE__ */ p("div", {
+			"data-slot": "form-builder-footer",
+			className: e("flex flex-wrap items-center justify-end gap-2", T),
+			children: v ?? /* @__PURE__ */ m(f, { children: [b && /* @__PURE__ */ p(t, {
+				type: "button",
+				variant: "outline",
+				disabled: l || S,
+				onClick: x,
+				children: b
+			}), y && /* @__PURE__ */ p(t, {
+				type: "submit",
+				disabled: l || S,
+				children: y
+			})] })
+		})]
+	});
+}
+//#endregion
+export { M as FormBuilder, S as asyncSelectField, O as customField, E as dateField, D as dateRangeField, k as formSection, y as inputField, w as numberField, T as phoneField, A as renderFormBuilderField, x as selectField, C as switchField, b as textareaField };

package/dist/components/patterns/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./form-builder.cjs"),t=require("./resource-detail-page.cjs"),n=require("./resource-page.cjs");exports.FormBuilder=e.FormBuilder,exports.ResourceDetailPage=t.ResourceDetailPage,exports.ResourcePage=n.ResourcePage,exports.ResourcePageSection=n.ResourcePageSection,exports.asyncSelectField=e.asyncSelectField,exports.customField=e.customField,exports.dateField=e.dateField,exports.dateRangeField=e.dateRangeField,exports.formSection=e.formSection,exports.inputField=e.inputField,exports.numberField=e.numberField,exports.phoneField=e.phoneField,exports.renderFormBuilderField=e.renderFormBuilderField,exports.selectField=e.selectField,exports.switchField=e.switchField,exports.textareaField=e.textareaField;

package/dist/components/patterns/index.d.ts

@@ -0,0 +1,3 @@
+export * from './resource-page';
+export * from './resource-detail-page';
+export * from './form-builder';

package/dist/components/patterns/index.js

@@ -0,0 +1,4 @@
+import { FormBuilder as e, asyncSelectField as t, customField as n, dateField as r, dateRangeField as i, formSection as a, inputField as o, numberField as s, phoneField as c, renderFormBuilderField as l, selectField as u, switchField as d, textareaField as f } from "./form-builder.js";
+import { ResourceDetailPage as p } from "./resource-detail-page.js";
+import { ResourcePage as m, ResourcePageSection as h } from "./resource-page.js";
+export { e as FormBuilder, p as ResourceDetailPage, m as ResourcePage, h as ResourcePageSection, t as asyncSelectField, n as customField, r as dateField, i as dateRangeField, a as formSection, o as inputField, s as numberField, c as phoneField, l as renderFormBuilderField, u as selectField, d as switchField, f as textareaField };

package/dist/components/patterns/public.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./form-builder.cjs"),t=require("./resource-detail-page.cjs"),n=require("./resource-page.cjs");exports.FormBuilder=e.FormBuilder,exports.ResourceDetailPage=t.ResourceDetailPage,exports.ResourcePage=n.ResourcePage,exports.ResourcePageSection=n.ResourcePageSection,exports.asyncSelectField=e.asyncSelectField,exports.customField=e.customField,exports.dateField=e.dateField,exports.dateRangeField=e.dateRangeField,exports.formSection=e.formSection,exports.inputField=e.inputField,exports.numberField=e.numberField,exports.phoneField=e.phoneField,exports.renderFormBuilderField=e.renderFormBuilderField,exports.selectField=e.selectField,exports.switchField=e.switchField,exports.textareaField=e.textareaField;

package/dist/components/patterns/public.d.ts

@@ -0,0 +1,3 @@
+export * from "./resource-page";
+export * from "./resource-detail-page";
+export * from "./form-builder";

package/dist/components/patterns/public.js

@@ -0,0 +1,4 @@
+import { FormBuilder as e, asyncSelectField as t, customField as n, dateField as r, dateRangeField as i, formSection as a, inputField as o, numberField as s, phoneField as c, renderFormBuilderField as l, selectField as u, switchField as d, textareaField as f } from "./form-builder.js";
+import { ResourceDetailPage as p } from "./resource-detail-page.js";
+import { ResourcePage as m, ResourcePageSection as h } from "./resource-page.js";
+export { e as FormBuilder, p as ResourceDetailPage, m as ResourcePage, h as ResourcePageSection, t as asyncSelectField, n as customField, r as dateField, i as dateRangeField, a as formSection, o as inputField, s as numberField, c as phoneField, l as renderFormBuilderField, u as selectField, d as switchField, f as textareaField };

package/dist/components/patterns/resource-detail-page.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../display/description-list.cjs"),i=require("../layout/page-header.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s={compact:`gap-3`,default:`gap-4`,comfortable:`gap-6`};function c({className:e,title:a,description:c,eyebrow:l,actions:u,breadcrumbs:d,status:f,summary:p,meta:m,sections:h,children:g,aside:_,footer:v,backLabel:y=`Back`,onBack:b,headerProps:x,density:S=`default`,pageHeaderClassName:C,contentClassName:w,asideClassName:T,sectionClassName:E,...D}){let O=h?.filter(e=>!e.hidden)??[],k=!!(a||c||l||u||b);return(0,o.jsxs)(`div`,{"data-slot":`resource-detail-page`,"data-density":S,className:t.cn(`grid min-w-0`,s[S],e),...D,children:[d&&(0,o.jsx)(`div`,{"data-slot":`resource-detail-page-breadcrumbs`,children:d}),k&&(0,o.jsx)(i.PageHeader,{"data-slot":`resource-detail-page-header`,eyebrow:l,title:a,description:c,actions:(0,o.jsxs)(o.Fragment,{children:[b&&(0,o.jsx)(n.Button,{type:`button`,variant:`outline`,onClick:b,children:y}),u]}),className:C,...x}),(f||p||m)&&(0,o.jsxs)(`div`,{"data-slot":`resource-detail-page-summary`,className:`grid gap-3 lg:grid-cols-[minmax(0,1fr)_auto]`,children:[(0,o.jsxs)(`div`,{className:`grid min-w-0 gap-3`,children:[f&&(0,o.jsx)(`div`,{"data-slot":`resource-detail-page-status`,children:f}),p&&(0,o.jsx)(`div`,{"data-slot":`resource-detail-page-summary-content`,children:p})]}),m&&(0,o.jsx)(`div`,{"data-slot":`resource-detail-page-meta`,className:`min-w-0 lg:w-80`,children:m})]}),(0,o.jsxs)(`div`,{"data-slot":`resource-detail-page-content`,className:t.cn(`grid min-w-0 gap-4 xl:grid-cols-[minmax(0,1fr)_20rem]`,w),children:[(0,o.jsxs)(`div`,{"data-slot":`resource-detail-page-main`,className:`grid min-w-0 gap-4`,children:[g,O.map(e=>(0,o.jsxs)(`section`,{"data-slot":`resource-detail-page-section`,className:t.cn(`rounded-xl border bg-card text-card-foreground shadow-sm`,e.className,E),children:[(e.title||e.description||e.actions)&&(0,o.jsxs)(`div`,{className:`flex flex-col gap-3 border-b p-4 sm:flex-row sm:items-start sm:justify-between`,children:[(0,o.jsxs)(`div`,{className:`min-w-0 space-y-1`,children:[e.title&&(0,o.jsx)(`h2`,{className:`text-base font-semibold leading-none tracking-tight`,children:e.title}),e.description&&(0,o.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.description})]}),e.actions&&(0,o.jsx)(`div`,{className:`flex shrink-0 flex-wrap items-center gap-2`,children:e.actions})]}),(0,o.jsx)(`div`,{className:t.cn(`p-4`,e.bodyClassName),children:e.children??(e.items?(0,o.jsx)(r.DescriptionList,{items:e.items}):null)})]},e.id))]}),_&&(0,o.jsx)(`aside`,{"data-slot":`resource-detail-page-aside`,className:t.cn(`min-w-0`,T),children:_})]}),v&&(0,o.jsx)(`div`,{"data-slot":`resource-detail-page-footer`,children:v})]})}exports.ResourceDetailPage=c;

package/dist/components/patterns/resource-detail-page.d.ts

@@ -0,0 +1,39 @@
+import * as React from "react";
+import { type DescriptionListItem } from "@/components/display/description-list";
+import { type PageHeaderProps } from "@/components/layout/page-header";
+export type ResourceDetailPageDensity = "default" | "compact" | "comfortable";
+export type ResourceDetailPageSection = {
+    id: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
+    hidden?: boolean;
+    className?: string;
+    bodyClassName?: string;
+    items?: DescriptionListItem[];
+    children?: React.ReactNode;
+};
+export type ResourceDetailPageProps = Omit<React.ComponentProps<"div">, "children"> & {
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    eyebrow?: React.ReactNode;
+    actions?: React.ReactNode;
+    breadcrumbs?: React.ReactNode;
+    status?: React.ReactNode;
+    summary?: React.ReactNode;
+    meta?: React.ReactNode;
+    sections?: ResourceDetailPageSection[];
+    children?: React.ReactNode;
+    aside?: React.ReactNode;
+    footer?: React.ReactNode;
+    backLabel?: React.ReactNode;
+    onBack?: () => void;
+    headerProps?: Omit<PageHeaderProps, "title" | "description" | "actions" | "eyebrow">;
+    density?: ResourceDetailPageDensity;
+    pageHeaderClassName?: string;
+    contentClassName?: string;
+    asideClassName?: string;
+    sectionClassName?: string;
+};
+declare function ResourceDetailPage({ className, title, description, eyebrow, actions, breadcrumbs, status, summary, meta, sections, children, aside, footer, backLabel, onBack, headerProps, density, pageHeaderClassName, contentClassName, asideClassName, sectionClassName, ...props }: ResourceDetailPageProps): React.JSX.Element;
+export { ResourceDetailPage };