tembro 1.0.0

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

@@ -0,0 +1,3 @@
+export * from "./filter-chips";
+export * from "./filter-bar";
+export * from "./saved-filter-select";

package/dist/components/filters/index.js

@@ -0,0 +1,4 @@
+import { FilterChips as e } from "./filter-chips.js";
+import { FilterBar as t } from "./filter-bar.js";
+import { SavedFilterSelect as n } from "./saved-filter-select.js";
+export { t as FilterBar, e as FilterChips, n as SavedFilterSelect };

package/dist/components/filters/saved-filter-select.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("../ui/input/index.cjs"),i=require("../ui/popover/index.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("lucide-react"),s=require("react/jsx-runtime");function c({value:e,onValueChange:c,filters:l,onSave:u,onDelete:d,placeholder:f=`Views`,saveLabel:p=`Save current view`,savePlaceholder:m=`Name this view`,emptyMessage:h=`No saved views`,saveValue:g,onSaveValueChange:_,className:v,...y}){let[b,x]=a.useState(!1),[S,C]=a.useState(``),w=l.find(t=>t.value===e),T=g??S;function E(e){g===void 0&&C(e),_?.(e)}function D(){let e=T.trim();!e||!u||(u(e),E(``),x(!1))}return(0,s.jsx)(`div`,{"data-slot":`saved-filter-select`,className:v,...y,children:(0,s.jsxs)(i.Popover,{open:b,onOpenChange:x,children:[(0,s.jsxs)(n.Button,{render:(0,s.jsx)(i.PopoverTrigger,{}),variant:`outline`,role:`combobox`,"aria-expanded":b,className:`w-[200px] justify-between`,children:[(0,s.jsxs)(`div`,{className:`flex items-center gap-2 truncate`,children:[(0,s.jsx)(o.BookmarkIcon,{className:`size-4 shrink-0 opacity-50`}),(0,s.jsx)(`span`,{className:`truncate`,children:w?w.label:f})]}),(0,s.jsx)(o.ChevronsUpDownIcon,{className:`size-4 shrink-0 opacity-50`})]}),(0,s.jsxs)(i.PopoverContent,{className:`w-[250px] p-0`,align:`start`,children:[(0,s.jsx)(`div`,{className:`max-h-[300px] overflow-y-auto p-1`,children:l.length===0?(0,s.jsx)(`div`,{className:`py-6 text-center text-sm text-muted-foreground`,children:h}):(0,s.jsx)(`div`,{className:`grid gap-1`,children:l.map(r=>{let i=e===r.value;return(0,s.jsxs)(`div`,{className:t.cn(`group relative flex items-center justify-between rounded-sm px-2 py-1.5 text-sm outline-none hover:bg-accent hover:text-accent-foreground`,i&&`bg-accent text-accent-foreground`),children:[(0,s.jsxs)(`button`,{className:`flex min-w-0 flex-1 items-center gap-2 text-left`,onClick:()=>{c?.(i?void 0:r.value),x(!1)},children:[(0,s.jsx)(`span`,{className:`flex size-4 shrink-0 items-center justify-center`,children:i&&(0,s.jsx)(o.CheckIcon,{className:`size-4`})}),(0,s.jsxs)(`div`,{className:`grid gap-0.5`,children:[(0,s.jsx)(`span`,{className:`truncate font-medium`,children:r.label}),r.description&&(0,s.jsx)(`span`,{className:`truncate text-xs text-muted-foreground`,children:r.description})]})]}),d&&(0,s.jsx)(n.Button,{variant:`ghost`,size:`icon`,className:`size-6 shrink-0 opacity-0 group-hover:opacity-100 hover:text-destructive`,onClick:e=>{t.stopInteractivePropagation(e),d(r.value)},onMouseDown:t.stopInteractivePropagation,onDoubleClick:t.stopInteractivePropagation,children:(0,s.jsx)(o.Trash2Icon,{className:`size-3`})})]},r.value)})})}),u&&(0,s.jsxs)(`div`,{className:`grid gap-2 border-t p-2`,children:[(0,s.jsx)(r.Input,{value:T,placeholder:m,onChange:e=>E(e.target.value),onKeyDown:e=>{e.key===`Enter`&&(e.preventDefault(),D())}}),(0,s.jsxs)(n.Button,{variant:`outline`,className:`w-full justify-center text-sm font-medium`,disabled:!T.trim(),onClick:D,children:[(0,s.jsx)(o.SaveIcon,{className:`mr-2 size-4`}),p]})]})]})]})})}exports.SavedFilterSelect=c;

package/dist/components/filters/saved-filter-select.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+export type SavedFilterItem = {
+    value: string;
+    label: string;
+    description?: string;
+};
+export type SavedFilterSelectProps = Omit<React.ComponentProps<"div">, "value" | "onChange"> & {
+    value?: string;
+    onValueChange?: (value: string | undefined) => void;
+    filters: SavedFilterItem[];
+    onSave?: (name: string) => void;
+    onDelete?: (value: string) => void;
+    placeholder?: string;
+    saveLabel?: string;
+    savePlaceholder?: string;
+    emptyMessage?: React.ReactNode;
+    saveValue?: string;
+    onSaveValueChange?: (value: string) => void;
+};
+declare function SavedFilterSelect({ value, onValueChange, filters, onSave, onDelete, placeholder, saveLabel, savePlaceholder, emptyMessage, saveValue, onSaveValueChange, className, ...props }: SavedFilterSelectProps): React.JSX.Element;
+export { SavedFilterSelect };

package/dist/components/filters/saved-filter-select.js

@@ -0,0 +1,106 @@
+import { cn as e, stopInteractivePropagation as t } from "../../lib/utils.js";
+import { Button as n } from "../ui/button/index.js";
+import { Input as r } from "../ui/input/index.js";
+import { Popover as i, PopoverContent as a, PopoverTrigger as o } from "../ui/popover/index.js";
+import * as s from "react";
+import { BookmarkIcon as c, CheckIcon as l, ChevronsUpDownIcon as u, SaveIcon as d, Trash2Icon as f } from "lucide-react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/filters/saved-filter-select.tsx
+function h({ value: h, onValueChange: g, filters: _, onSave: v, onDelete: y, placeholder: b = "Views", saveLabel: x = "Save current view", savePlaceholder: S = "Name this view", emptyMessage: C = "No saved views", saveValue: w, onSaveValueChange: T, className: E, ...D }) {
+	let [O, k] = s.useState(!1), [A, j] = s.useState(""), M = _.find((e) => e.value === h), N = w ?? A;
+	function P(e) {
+		w === void 0 && j(e), T?.(e);
+	}
+	function F() {
+		let e = N.trim();
+		!e || !v || (v(e), P(""), k(!1));
+	}
+	return /* @__PURE__ */ p("div", {
+		"data-slot": "saved-filter-select",
+		className: E,
+		...D,
+		children: /* @__PURE__ */ m(i, {
+			open: O,
+			onOpenChange: k,
+			children: [/* @__PURE__ */ m(n, {
+				render: /* @__PURE__ */ p(o, {}),
+				variant: "outline",
+				role: "combobox",
+				"aria-expanded": O,
+				className: "w-[200px] justify-between",
+				children: [/* @__PURE__ */ m("div", {
+					className: "flex items-center gap-2 truncate",
+					children: [/* @__PURE__ */ p(c, { className: "size-4 shrink-0 opacity-50" }), /* @__PURE__ */ p("span", {
+						className: "truncate",
+						children: M ? M.label : b
+					})]
+				}), /* @__PURE__ */ p(u, { className: "size-4 shrink-0 opacity-50" })]
+			}), /* @__PURE__ */ m(a, {
+				className: "w-[250px] p-0",
+				align: "start",
+				children: [/* @__PURE__ */ p("div", {
+					className: "max-h-[300px] overflow-y-auto p-1",
+					children: _.length === 0 ? /* @__PURE__ */ p("div", {
+						className: "py-6 text-center text-sm text-muted-foreground",
+						children: C
+					}) : /* @__PURE__ */ p("div", {
+						className: "grid gap-1",
+						children: _.map((r) => {
+							let i = h === r.value;
+							return /* @__PURE__ */ m("div", {
+								className: e("group relative flex items-center justify-between rounded-sm px-2 py-1.5 text-sm outline-none hover:bg-accent hover:text-accent-foreground", i && "bg-accent text-accent-foreground"),
+								children: [/* @__PURE__ */ m("button", {
+									className: "flex min-w-0 flex-1 items-center gap-2 text-left",
+									onClick: () => {
+										g?.(i ? void 0 : r.value), k(!1);
+									},
+									children: [/* @__PURE__ */ p("span", {
+										className: "flex size-4 shrink-0 items-center justify-center",
+										children: i && /* @__PURE__ */ p(l, { className: "size-4" })
+									}), /* @__PURE__ */ m("div", {
+										className: "grid gap-0.5",
+										children: [/* @__PURE__ */ p("span", {
+											className: "truncate font-medium",
+											children: r.label
+										}), r.description && /* @__PURE__ */ p("span", {
+											className: "truncate text-xs text-muted-foreground",
+											children: r.description
+										})]
+									})]
+								}), y && /* @__PURE__ */ p(n, {
+									variant: "ghost",
+									size: "icon",
+									className: "size-6 shrink-0 opacity-0 group-hover:opacity-100 hover:text-destructive",
+									onClick: (e) => {
+										t(e), y(r.value);
+									},
+									onMouseDown: t,
+									onDoubleClick: t,
+									children: /* @__PURE__ */ p(f, { className: "size-3" })
+								})]
+							}, r.value);
+						})
+					})
+				}), v && /* @__PURE__ */ m("div", {
+					className: "grid gap-2 border-t p-2",
+					children: [/* @__PURE__ */ p(r, {
+						value: N,
+						placeholder: S,
+						onChange: (e) => P(e.target.value),
+						onKeyDown: (e) => {
+							e.key === "Enter" && (e.preventDefault(), F());
+						}
+					}), /* @__PURE__ */ m(n, {
+						variant: "outline",
+						className: "w-full justify-center text-sm font-medium",
+						disabled: !N.trim(),
+						onClick: F,
+						children: [/* @__PURE__ */ p(d, { className: "mr-2 size-4" }), x]
+					})]
+				})]
+			})]
+		})
+	});
+}
+//#endregion
+export { h as SavedFilterSelect };

package/dist/components/form/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(`form-input`,`FormInput`,`form`,`Form wrapper for the universal Input surface.`),e.component(`form-select`,`FormSelect`,`form`,`Form wrapper for controlled select fields.`),e.component(`form-textarea`,`FormTextarea`,`form`,`Textarea wrapper with validation slots.`),e.component(`form-switch`,`FormSwitch`,`form`,`Boolean form control with shell-level label and hint handling.`),e.component(`form-date-picker`,`FormDatePicker`,`form`,`Popover date picker wrapper with RHF integration.`),e.component(`form-date-range-picker`,`FormDateRangePicker`,`form`,`Range date picker wrapper with RHF integration.`),e.component(`repeater-field`,`RepeaterField`,`form`,`Repeating field array surface for editable lists inside forms.`)]);exports.formShowcaseDemoRegistry=t;

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

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

package/dist/components/form/demo.js

@@ -0,0 +1,13 @@
+import { component as e, createShowcaseDemoRegistry as t } from "../../showcase/create-demo.js";
+//#region src/components/form/demo.tsx
+var n = t([
+	e("form-input", "FormInput", "form", "Form wrapper for the universal Input surface."),
+	e("form-select", "FormSelect", "form", "Form wrapper for controlled select fields."),
+	e("form-textarea", "FormTextarea", "form", "Textarea wrapper with validation slots."),
+	e("form-switch", "FormSwitch", "form", "Boolean form control with shell-level label and hint handling."),
+	e("form-date-picker", "FormDatePicker", "form", "Popover date picker wrapper with RHF integration."),
+	e("form-date-range-picker", "FormDateRangePicker", "form", "Range date picker wrapper with RHF integration."),
+	e("repeater-field", "RepeaterField", "form", "Repeating field array surface for editable lists inside forms.")
+]);
+//#endregion
+export { n as formShowcaseDemoRegistry };

package/dist/components/form/deprecated-compat.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./form-input.cjs"),t=require("./form-select.cjs"),n=require("../../lib/deprecated-warning.cjs");let r=require("react/jsx-runtime");function i({componentName:t,replacement:i,kind:a,props:o,extraProps:s}){return n.warnDeprecatedComponent(t,i),(0,r.jsx)(e.FormInput,{...o,...s,kind:a})}function a({componentName:e,replacement:i,kind:a,props:o}){return n.warnDeprecatedComponent(e,i),(0,r.jsx)(t.FormSelect,{...o,kind:a})}exports.renderDeprecatedFormInputAlias=i,exports.renderDeprecatedFormSelectAlias=a;

package/dist/components/form/deprecated-compat.d.ts

@@ -0,0 +1,17 @@
+import { type FormInputKind } from "@/components/form/form-input";
+type DeprecatedFormInputAliasArgs<TProps> = {
+    componentName: string;
+    replacement: string;
+    kind: FormInputKind;
+    props: TProps;
+    extraProps?: Record<string, unknown>;
+};
+declare function renderDeprecatedFormInputAlias<TProps>({ componentName, replacement, kind, props, extraProps, }: DeprecatedFormInputAliasArgs<TProps>): import("react").JSX.Element;
+type DeprecatedFormSelectAliasArgs<TProps> = {
+    componentName: string;
+    replacement: string;
+    kind: "async";
+    props: TProps;
+};
+declare function renderDeprecatedFormSelectAlias<TProps>({ componentName, replacement, kind, props, }: DeprecatedFormSelectAliasArgs<TProps>): import("react").JSX.Element;
+export { renderDeprecatedFormInputAlias, renderDeprecatedFormSelectAlias };

package/dist/components/form/deprecated-compat.js

@@ -0,0 +1,20 @@
+import { FormInput as e } from "./form-input.js";
+import { FormSelect as t } from "./form-select.js";
+import { warnDeprecatedComponent as n } from "../../lib/deprecated-warning.js";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/form/deprecated-compat.tsx
+function i({ componentName: t, replacement: i, kind: a, props: o, extraProps: s }) {
+	return n(t, i), /* @__PURE__ */ r(e, {
+		...o,
+		...s,
+		kind: a
+	});
+}
+function a({ componentName: e, replacement: i, kind: a, props: o }) {
+	return n(e, i), /* @__PURE__ */ r(t, {
+		...o,
+		kind: a
+	});
+}
+//#endregion
+export { i as renderDeprecatedFormInputAlias, a as renderDeprecatedFormSelectAlias };

package/dist/components/form/form-async-select.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./deprecated-compat.cjs");function t(t){return e.renderDeprecatedFormSelectAlias({componentName:`FormAsyncSelect`,replacement:`FormSelect with kind="async"`,kind:`async`,props:t})}exports.FormAsyncSelect=t;

package/dist/components/form/form-async-select.d.ts

@@ -0,0 +1,9 @@
+import { type FormSelectAsyncVariantProps as BaseFormAsyncSelectProps } from "@/components/form/form-select";
+import type { AsyncSelectOption } from "@/components/inputs/async-select";
+import type { FieldPath, FieldValues } from "react-hook-form";
+export type FormAsyncSelectProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends string = string, TData = unknown, TOption extends AsyncSelectOption<TValue, TData> = AsyncSelectOption<TValue, TData>> = Omit<BaseFormAsyncSelectProps<TFieldValues, TName, TValue, TData, TOption>, "kind">;
+/**
+ * @deprecated Use {@link FormSelect} with `kind="async"` instead.
+ */
+declare function FormAsyncSelect<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TValue extends string = string, TData = unknown, TOption extends AsyncSelectOption<TValue, TData> = AsyncSelectOption<TValue, TData>>(props: FormAsyncSelectProps<TFieldValues, TName, TValue, TData, TOption>): import("react").JSX.Element;
+export { FormAsyncSelect };

package/dist/components/form/form-async-select.js

@@ -0,0 +1,12 @@
+import { renderDeprecatedFormSelectAlias as e } from "./deprecated-compat.js";
+//#region src/components/form/form-async-select.tsx
+function t(t) {
+	return e({
+		componentName: "FormAsyncSelect",
+		replacement: "FormSelect with kind=\"async\"",
+		kind: "async",
+		props: t
+	});
+}
+//#endregion
+export { t as FormAsyncSelect };

package/dist/components/form/form-date-input.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./deprecated-compat.cjs");function t(t){return e.renderDeprecatedFormInputAlias({componentName:`FormDateInput`,replacement:`FormInput with kind="date"`,kind:`date`,props:t})}exports.FormDateInput=t;

package/dist/components/form/form-date-input.d.ts

@@ -0,0 +1,8 @@
+import { type FormInputDateVariantProps } from "@/components/form/form-input";
+import type { FieldPath, FieldValues } from "react-hook-form";
+export type FormDateInputProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<FormInputDateVariantProps<TFieldValues, TName>, "kind">;
+/**
+ * @deprecated Use {@link FormInput} with `kind="date"` instead.
+ */
+declare function FormDateInput<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(props: FormDateInputProps<TFieldValues, TName>): import("react").JSX.Element;
+export { FormDateInput };

package/dist/components/form/form-date-input.js

@@ -0,0 +1,12 @@
+import { renderDeprecatedFormInputAlias as e } from "./deprecated-compat.js";
+//#region src/components/form/form-date-input.tsx
+function t(t) {
+	return e({
+		componentName: "FormDateInput",
+		replacement: "FormInput with kind=\"date\"",
+		kind: "date",
+		props: t
+	});
+}
+//#endregion
+export { t as FormDateInput };

package/dist/components/form/form-date-picker.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./form-field-shell.cjs"),t=require("../calendar/date-picker.cjs");let n=require("react/jsx-runtime"),r=require("react-hook-form");function i({control:i,name:a,label:o,description:s,required:c,className:l,fieldClassName:u,emptyValue:d=``,onValueChange:f,...p}){return(0,n.jsx)(r.Controller,{control:i,name:a,render:({field:r,fieldState:i})=>(0,n.jsx)(e.FormFieldShell,{label:o,description:s,required:c,error:i.error?.message,className:l,children:(0,n.jsx)(t.DatePicker,{value:r.value??``,triggerClassName:u,onValueChange:e=>{r.onChange(e||d),f?.(e)},...p})})})}exports.FormDatePicker=i;

package/dist/components/form/form-date-picker.d.ts

@@ -0,0 +1,12 @@
+import { type Control, type FieldPath, type FieldValues } from "react-hook-form";
+import { type DatePickerProps } from "@/components/calendar/date-picker";
+import { type FormFieldShellProps } from "@/components/form/form-field-shell";
+export type FormDatePickerProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<DatePickerProps, "value" | "onValueChange"> & Pick<FormFieldShellProps, "label" | "description" | "required" | "className"> & {
+    control: Control<TFieldValues>;
+    name: TName;
+    fieldClassName?: string;
+    emptyValue?: unknown;
+    onValueChange?: (value: string) => void;
+};
+declare function FormDatePicker<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ control, name, label, description, required, className, fieldClassName, emptyValue, onValueChange, ...props }: FormDatePickerProps<TFieldValues, TName>): import("react").JSX.Element;
+export { FormDatePicker };

package/dist/components/form/form-date-picker.js

@@ -0,0 +1,28 @@
+import { FormFieldShell as e } from "./form-field-shell.js";
+import { DatePicker as t } from "../calendar/date-picker.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Controller as r } from "react-hook-form";
+//#region src/components/form/form-date-picker.tsx
+function i({ control: i, name: a, label: o, description: s, required: c, className: l, fieldClassName: u, emptyValue: d = "", onValueChange: f, ...p }) {
+	return /* @__PURE__ */ n(r, {
+		control: i,
+		name: a,
+		render: ({ field: r, fieldState: i }) => /* @__PURE__ */ n(e, {
+			label: o,
+			description: s,
+			required: c,
+			error: i.error?.message,
+			className: l,
+			children: /* @__PURE__ */ n(t, {
+				value: r.value ?? "",
+				triggerClassName: u,
+				onValueChange: (e) => {
+					r.onChange(e || d), f?.(e);
+				},
+				...p
+			})
+		})
+	});
+}
+//#endregion
+export { i as FormDatePicker };

package/dist/components/form/form-date-range-input.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../inputs/date-range-input.cjs"),t=require("./form-field-shell.cjs");let n=require("react/jsx-runtime"),r=require("react-hook-form");function i({control:i,fromName:a,toName:o,label:s,description:c,required:l,className:u,emptyValue:d=``,onValueChange:f,...p}){return(0,n.jsx)(r.Controller,{control:i,name:a,render:({field:a,fieldState:m})=>(0,n.jsx)(r.Controller,{control:i,name:o,render:({field:r,fieldState:i})=>(0,n.jsx)(t.FormFieldShell,{label:s,description:c,required:l,error:m.error?.message??i.error?.message,className:u,children:(0,n.jsx)(e.DateRangeInput,{value:{from:a.value??``,to:r.value??``},onValueChange:e=>{a.onChange(e.from||d),r.onChange(e.to||d),f?.(e)},...p})})})})}exports.FormDateRangeInput=i;

package/dist/components/form/form-date-range-input.d.ts

@@ -0,0 +1,12 @@
+import { type Control, type FieldPath, type FieldValues } from "react-hook-form";
+import { type FormFieldShellProps } from "@/components/form/form-field-shell";
+import { type DateRangeInputProps, type DateRangeValue } from "@/components/inputs/date-range-input";
+export type FormDateRangeInputProps<TFieldValues extends FieldValues = FieldValues, TFromName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TToName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<DateRangeInputProps, "value" | "onValueChange"> & Pick<FormFieldShellProps, "label" | "description" | "required" | "className"> & {
+    control: Control<TFieldValues>;
+    fromName: TFromName;
+    toName: TToName;
+    emptyValue?: unknown;
+    onValueChange?: (value: DateRangeValue) => void;
+};
+declare function FormDateRangeInput<TFieldValues extends FieldValues = FieldValues, TFromName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>, TToName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ control, fromName, toName, label, description, required, className, emptyValue, onValueChange, ...props }: FormDateRangeInputProps<TFieldValues, TFromName, TToName>): import("react").JSX.Element;
+export { FormDateRangeInput };

package/dist/components/form/form-date-range-input.js

@@ -0,0 +1,34 @@
+import { DateRangeInput as e } from "../inputs/date-range-input.js";
+import { FormFieldShell as t } from "./form-field-shell.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Controller as r } from "react-hook-form";
+//#region src/components/form/form-date-range-input.tsx
+function i({ control: i, fromName: a, toName: o, label: s, description: c, required: l, className: u, emptyValue: d = "", onValueChange: f, ...p }) {
+	return /* @__PURE__ */ n(r, {
+		control: i,
+		name: a,
+		render: ({ field: a, fieldState: m }) => /* @__PURE__ */ n(r, {
+			control: i,
+			name: o,
+			render: ({ field: r, fieldState: i }) => /* @__PURE__ */ n(t, {
+				label: s,
+				description: c,
+				required: l,
+				error: m.error?.message ?? i.error?.message,
+				className: u,
+				children: /* @__PURE__ */ n(e, {
+					value: {
+						from: a.value ?? "",
+						to: r.value ?? ""
+					},
+					onValueChange: (e) => {
+						a.onChange(e.from || d), r.onChange(e.to || d), f?.(e);
+					},
+					...p
+				})
+			})
+		})
+	});
+}
+//#endregion
+export { i as FormDateRangeInput };

package/dist/components/form/form-date-range-picker.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./form-field-shell.cjs"),t=require("../calendar/date-range-picker.cjs");let n=require("react/jsx-runtime"),r=require("react-hook-form");function i({control:i,fromName:a,toName:o,label:s,description:c,required:l,className:u,emptyValue:d=``,onValueChange:f,...p}){return(0,n.jsx)(r.Controller,{control:i,name:a,render:({field:a,fieldState:m})=>(0,n.jsx)(r.Controller,{control:i,name:o,render:({field:r,fieldState:i})=>(0,n.jsx)(e.FormFieldShell,{label:s,description:c,required:l,error:m.error?.message??i.error?.message,className:u,children:(0,n.jsx)(t.DateRangePicker,{value:{from:a.value??``,to:r.value??``},onValueChange:e=>{a.onChange(e.from||d),r.onChange(e.to||d),f?.({from:e.from||void 0,to:e.to||void 0})},...p})})})})}exports.FormDateRangePicker=i;

package/dist/components/form/form-date-range-picker.d.ts

@@ -0,0 +1,15 @@
+import { type Control, type FieldPath, type FieldValues } from "react-hook-form";
+import { type DateRangePickerProps } from "@/components/calendar/date-range-picker";
+import { type FormFieldShellProps } from "@/components/form/form-field-shell";
+export type FormDateRangePickerProps<TFieldValues extends FieldValues = FieldValues> = Omit<DateRangePickerProps, "value" | "onValueChange"> & Pick<FormFieldShellProps, "label" | "description" | "required" | "className"> & {
+    control: Control<TFieldValues>;
+    fromName: FieldPath<TFieldValues>;
+    toName: FieldPath<TFieldValues>;
+    emptyValue?: unknown;
+    onValueChange?: (value: {
+        from?: string;
+        to?: string;
+    }) => void;
+};
+declare function FormDateRangePicker<TFieldValues extends FieldValues = FieldValues>({ control, fromName, toName, label, description, required, className, emptyValue, onValueChange, ...props }: FormDateRangePickerProps<TFieldValues>): import("react").JSX.Element;
+export { FormDateRangePicker };

package/dist/components/form/form-date-range-picker.js

@@ -0,0 +1,37 @@
+import { FormFieldShell as e } from "./form-field-shell.js";
+import { DateRangePicker as t } from "../calendar/date-range-picker.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Controller as r } from "react-hook-form";
+//#region src/components/form/form-date-range-picker.tsx
+function i({ control: i, fromName: a, toName: o, label: s, description: c, required: l, className: u, emptyValue: d = "", onValueChange: f, ...p }) {
+	return /* @__PURE__ */ n(r, {
+		control: i,
+		name: a,
+		render: ({ field: a, fieldState: m }) => /* @__PURE__ */ n(r, {
+			control: i,
+			name: o,
+			render: ({ field: r, fieldState: i }) => /* @__PURE__ */ n(e, {
+				label: s,
+				description: c,
+				required: l,
+				error: m.error?.message ?? i.error?.message,
+				className: u,
+				children: /* @__PURE__ */ n(t, {
+					value: {
+						from: a.value ?? "",
+						to: r.value ?? ""
+					},
+					onValueChange: (e) => {
+						a.onChange(e.from || d), r.onChange(e.to || d), f?.({
+							from: e.from || void 0,
+							to: e.to || void 0
+						});
+					},
+					...p
+				})
+			})
+		})
+	});
+}
+//#endregion
+export { i as FormDateRangePicker };

package/dist/components/form/form-field-shell.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");var a={vertical:`grid gap-2`,horizontal:`grid gap-2 sm:grid-cols-[minmax(0,12rem)_1fr] sm:items-start sm:gap-5`,inline:`flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-4`};function o({className:e,label:n,description:o,error:s,required:c=!1,htmlFor:l,layout:u=`vertical`,descriptionPosition:d=`top`,labelAction:f,requiredIndicator:p=(0,i.jsx)(`span`,{className:`ml-1 text-destructive`,children:`*`}),errorIcon:m,showErrorIcon:h=!0,disabled:g=!1,readOnly:_=!1,labelClassName:v,labelRowClassName:y,descriptionClassName:b,errorClassName:x,contentClassName:S,children:C,...w}){let T=!!(n||f),E=o&&d===`top`,D=o&&d===`bottom`,O=m??(0,i.jsx)(r.AlertCircleIcon,{className:`size-3.5`}),k=T?(0,i.jsxs)(`div`,{"data-slot":`form-field-label-row`,className:t.cn(`flex min-w-0 items-center justify-between gap-3`,u===`inline`&&`sm:w-auto`,y),children:[n?(0,i.jsxs)(`label`,{"data-slot":`form-field-label`,htmlFor:l,className:t.cn(`min-w-0 text-sm font-semibold leading-none tracking-tight text-foreground`,g&&`cursor-not-allowed opacity-60`,_&&`opacity-80`,v),children:[n,c&&p]}):(0,i.jsx)(`span`,{}),f&&(0,i.jsx)(`div`,{"data-slot":`form-field-label-action`,className:`shrink-0 text-sm`,children:f})]}):null,A=o?(0,i.jsx)(`p`,{"data-slot":`form-field-description`,className:t.cn(`text-sm leading-6 text-muted-foreground`,g&&`opacity-60`,b),children:o}):null,j=(0,i.jsx)(`div`,{"data-slot":`form-field-content`,className:t.cn(`min-w-0 space-y-2`,S),children:C}),M=s?(0,i.jsxs)(`p`,{"data-slot":`form-field-error`,className:t.cn(`flex items-start gap-2 rounded-[min(var(--radius-xl),16px)] border border-destructive/18 bg-destructive/8 px-3 py-2 text-sm font-medium leading-6 text-destructive`,x),children:[h&&(0,i.jsx)(`span`,{className:`mt-1 shrink-0`,children:O}),(0,i.jsx)(`span`,{className:`min-w-0`,children:s})]}):null;return(0,i.jsx)(`div`,{"data-slot":`form-field-shell`,"data-layout":u,"data-invalid":!!s||void 0,"data-disabled":g||void 0,"data-readonly":_||void 0,"aria-disabled":g||void 0,className:t.cn(a[u],`rounded-[var(--radius-2xl)]`,e),...w,children:u===`horizontal`?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(`div`,{className:`grid gap-2 sm:pt-2.5`,children:[k,E&&A]}),(0,i.jsxs)(`div`,{className:`grid min-w-0 gap-2`,children:[j,D&&A,M]})]}):u===`inline`?(0,i.jsxs)(i.Fragment,{children:[k,(0,i.jsxs)(`div`,{className:`grid min-w-0 flex-1 gap-2`,children:[E&&A,j,D&&A,M]})]}):(0,i.jsxs)(i.Fragment,{children:[k,E&&A,j,D&&A,M]})})}exports.FormFieldShell=o;

package/dist/components/form/form-field-shell.d.ts

@@ -0,0 +1,26 @@
+import * as React from "react";
+export type FormFieldLayout = "vertical" | "horizontal" | "inline";
+export type FormFieldDescriptionPosition = "top" | "bottom";
+export type FormFieldShellProps = React.ComponentProps<"div"> & {
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+    error?: React.ReactNode;
+    required?: boolean;
+    htmlFor?: string;
+    layout?: FormFieldLayout;
+    descriptionPosition?: FormFieldDescriptionPosition;
+    labelAction?: React.ReactNode;
+    requiredIndicator?: React.ReactNode;
+    errorIcon?: React.ReactNode;
+    showErrorIcon?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    labelClassName?: string;
+    labelRowClassName?: string;
+    descriptionClassName?: string;
+    errorClassName?: string;
+    contentClassName?: string;
+};
+export type FormFieldShellControlProps = Pick<FormFieldShellProps, "label" | "description" | "required" | "className" | "layout" | "descriptionPosition" | "labelAction" | "requiredIndicator" | "errorIcon" | "showErrorIcon" | "disabled" | "readOnly" | "labelClassName" | "labelRowClassName" | "descriptionClassName" | "errorClassName" | "contentClassName">;
+declare function FormFieldShell({ className, label, description, error, required, htmlFor, layout, descriptionPosition, labelAction, requiredIndicator, errorIcon, showErrorIcon, disabled, readOnly, labelClassName, labelRowClassName, descriptionClassName, errorClassName, contentClassName, children, ...props }: FormFieldShellProps): React.JSX.Element;
+export { FormFieldShell };

package/dist/components/form/form-field-shell.js

@@ -0,0 +1,84 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { AlertCircleIcon as t } from "lucide-react";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/form/form-field-shell.tsx
+var a = {
+	vertical: "grid gap-2",
+	horizontal: "grid gap-2 sm:grid-cols-[minmax(0,12rem)_1fr] sm:items-start sm:gap-5",
+	inline: "flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-4"
+};
+function o({ className: o, label: s, description: c, error: l, required: u = !1, htmlFor: d, layout: f = "vertical", descriptionPosition: p = "top", labelAction: m, requiredIndicator: h = /* @__PURE__ */ r("span", {
+	className: "ml-1 text-destructive",
+	children: "*"
+}), errorIcon: g, showErrorIcon: _ = !0, disabled: v = !1, readOnly: y = !1, labelClassName: b, labelRowClassName: x, descriptionClassName: S, errorClassName: C, contentClassName: w, children: T, ...E }) {
+	let D = !!(s || m), O = c && p === "top", k = c && p === "bottom", A = g ?? /* @__PURE__ */ r(t, { className: "size-3.5" }), j = D ? /* @__PURE__ */ i("div", {
+		"data-slot": "form-field-label-row",
+		className: e("flex min-w-0 items-center justify-between gap-3", f === "inline" && "sm:w-auto", x),
+		children: [s ? /* @__PURE__ */ i("label", {
+			"data-slot": "form-field-label",
+			htmlFor: d,
+			className: e("min-w-0 text-sm font-semibold leading-none tracking-tight text-foreground", v && "cursor-not-allowed opacity-60", y && "opacity-80", b),
+			children: [s, u && h]
+		}) : /* @__PURE__ */ r("span", {}), m && /* @__PURE__ */ r("div", {
+			"data-slot": "form-field-label-action",
+			className: "shrink-0 text-sm",
+			children: m
+		})]
+	}) : null, M = c ? /* @__PURE__ */ r("p", {
+		"data-slot": "form-field-description",
+		className: e("text-sm leading-6 text-muted-foreground", v && "opacity-60", S),
+		children: c
+	}) : null, N = /* @__PURE__ */ r("div", {
+		"data-slot": "form-field-content",
+		className: e("min-w-0 space-y-2", w),
+		children: T
+	}), P = l ? /* @__PURE__ */ i("p", {
+		"data-slot": "form-field-error",
+		className: e("flex items-start gap-2 rounded-[min(var(--radius-xl),16px)] border border-destructive/18 bg-destructive/8 px-3 py-2 text-sm font-medium leading-6 text-destructive", C),
+		children: [_ && /* @__PURE__ */ r("span", {
+			className: "mt-1 shrink-0",
+			children: A
+		}), /* @__PURE__ */ r("span", {
+			className: "min-w-0",
+			children: l
+		})]
+	}) : null;
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "form-field-shell",
+		"data-layout": f,
+		"data-invalid": !!l || void 0,
+		"data-disabled": v || void 0,
+		"data-readonly": y || void 0,
+		"aria-disabled": v || void 0,
+		className: e(a[f], "rounded-[var(--radius-2xl)]", o),
+		...E,
+		children: f === "horizontal" ? /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ i("div", {
+			className: "grid gap-2 sm:pt-2.5",
+			children: [j, O && M]
+		}), /* @__PURE__ */ i("div", {
+			className: "grid min-w-0 gap-2",
+			children: [
+				N,
+				k && M,
+				P
+			]
+		})] }) : f === "inline" ? /* @__PURE__ */ i(n, { children: [j, /* @__PURE__ */ i("div", {
+			className: "grid min-w-0 flex-1 gap-2",
+			children: [
+				O && M,
+				N,
+				k && M,
+				P
+			]
+		})] }) : /* @__PURE__ */ i(n, { children: [
+			j,
+			O && M,
+			N,
+			k && M,
+			P
+		] })
+	});
+}
+//#endregion
+export { o as FormFieldShell };

package/dist/components/form/form-input.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../inputs/clearable-input.cjs"),n=require("../inputs/date-input.cjs"),r=require("../inputs/date-range-input.cjs"),i=require("../inputs/money-input.cjs"),a=require("../inputs/masked-input.cjs"),o=require("../inputs/number-input.cjs"),s=require("../inputs/phone-input.cjs"),c=require("../inputs/quantity-input.cjs"),l=require("../inputs/search-input.cjs"),u=require("../ui/input/index.cjs"),d=require("./form-field-shell.cjs");let f=require("react");f=e.__toESM(f,1);let p=require("react/jsx-runtime"),m=require("react-hook-form");function h(e){return{label:e.label,description:e.description,required:e.required,className:e.className,layout:e.layout,descriptionPosition:e.descriptionPosition,labelAction:e.labelAction,requiredIndicator:e.requiredIndicator,errorIcon:e.errorIcon,showErrorIcon:e.showErrorIcon,disabled:e.disabled,readOnly:e.readOnly,labelClassName:e.labelClassName,labelRowClassName:e.labelRowClassName,descriptionClassName:e.descriptionClassName,errorClassName:e.errorClassName,contentClassName:e.contentClassName}}function g(e){let f=e.id??e.name,g=h(e),_=e.kind??`text`,v=e.fieldClassName??`w-full`;return(0,p.jsx)(m.Controller,{control:e.control,name:e.name,rules:e.rules,render:({field:m,fieldState:h})=>{let y=h.error?.message;if(_===`search`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:c,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,onValueChange:M,onBlur:N,...P}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(l.SearchInput,{...P,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,inputClassName:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),N?.(e)},onValueChange:e=>{m.onChange(e),M?.(e)}})})}if(_===`password`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:c,labelAction:l,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,onValueChange:M,onBlur:N,...P}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(u.Input,{...P,type:`password`,id:A??f,ref:m.ref,name:m.name,value:m.value??``,disabled:S,readOnly:e.readOnly,inputClassName:k??v,onBlur:e=>{m.onBlur(),N?.(e)},onChange:e=>{let t=e.currentTarget.value;m.onChange(t),M?.(t)},"aria-invalid":h.invalid||void 0})})}if(_===`number`){let{control:t,name:n,label:r,description:i,required:a,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=null,onNumberChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(o.NumberInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onNumberChange:e=>{m.onChange(e??M),N?.(e)}})})}if(_===`phone`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,valueMode:M=`raw`,countryCode:N=`+998`,maxDigits:P=12,onValueChange:F,onBlur:I,...L}=e,R=m.value==null?``:String(m.value),z=M===`raw`?s.formatPhoneDigits(R,N,P):R;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(s.PhoneInput,{...L,id:A??f,name:m.name,ref:m.ref,value:z,disabled:S,readOnly:e.readOnly,countryCode:N,maxDigits:P,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),I?.(e)},onValueChange:(e,t)=>{let n=M===`raw`?t:e;m.onChange(n),F?.(n,t,e)}})})}if(_===`date`){let{control:t,name:r,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=``,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(n.DateInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:e=>{m.onChange(e||M),N?.(e)}})})}if(_===`clearable`){let{control:n,name:r,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=``,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(t.ClearableInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??``,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:e=>{m.onChange(e||M),N?.(e)}})})}if(_===`masked`){let{control:t,name:n,label:r,description:i,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,valueMode:M=`raw`,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(a.MaskedInput,{...F,id:A??f,name:m.name,ref:m.ref,value:String(m.value??``),disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:(e,t)=>{let n=M===`raw`?t:e;m.onChange(n),N?.(e,t)}})})}if(_===`money`){let{control:t,name:n,label:r,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=null,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(i.MoneyInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value??null,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:(e,t)=>{m.onChange(e??M),N?.(e,t)}})})}if(_===`quantity`){let{control:t,name:n,label:r,description:i,required:a,className:o,layout:s,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:b,showErrorIcon:x,disabled:S,readOnly:C,labelClassName:w,labelRowClassName:T,descriptionClassName:E,errorClassName:D,contentClassName:O,fieldClassName:k,id:A,kind:j,emptyValue:M=null,onValueChange:N,onBlur:P,...F}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:A??f,children:(0,p.jsx)(c.QuantityInput,{...F,id:A??f,name:m.name,ref:m.ref,value:m.value,disabled:S,readOnly:e.readOnly,className:k??v,"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),P?.(e)},onValueChange:e=>{m.onChange(e??M),N?.(e)}})})}if(_===`date-range`){let{control:t,name:n,label:i,description:a,required:o,className:s,layout:c,descriptionPosition:l,labelAction:u,requiredIndicator:_,errorIcon:v,showErrorIcon:b,disabled:x,labelClassName:S,labelRowClassName:C,descriptionClassName:w,errorClassName:T,contentClassName:E,fieldClassName:D,id:O,kind:k,onValueChange:A,onBlur:j,...M}=e,N=m.value;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:O??f,children:(0,p.jsx)(r.DateRangeInput,{...M,id:O??f,value:N&&typeof N==`object`?{from:N.from,to:N.to}:{from:``,to:``},fromInputProps:{...M.fromInputProps??{},disabled:x,readOnly:e.readOnly},toInputProps:{...M.toInputProps??{},disabled:x,readOnly:e.readOnly},onValueChange:e=>{m.onChange(e),A?.(e)},"aria-invalid":h.invalid||void 0,onBlur:e=>{m.onBlur(),j?.(e)}})})}let{control:b,name:x,label:S,description:C,required:w,className:T,layout:E,descriptionPosition:D,labelAction:O,requiredIndicator:k,errorIcon:A,showErrorIcon:j,disabled:M,readOnly:N,labelClassName:P,labelRowClassName:F,descriptionClassName:I,errorClassName:L,contentClassName:R,fieldClassName:z,transformIn:B,transformOut:V,id:H,kind:U,onChange:W,onBlur:G,...K}=e;return(0,p.jsx)(d.FormFieldShell,{...g,error:y,htmlFor:H??f,children:(0,p.jsx)(u.Input,{...K,id:H??f,ref:m.ref,name:m.name,value:B?B(m.value):m.value??``,disabled:M,readOnly:N,onBlur:e=>{m.onBlur(),G?.(e)},onChange:e=>{m.onChange(V?V(e):e.target.value),W?.(e)},"aria-invalid":h.invalid||void 0,className:z??v})})}})}exports.FormInput=g;