@datum-cloud/datum-ui 1.3.2 → 1.4.0

package/dist/{dropzone-ZJhq4Ec9.mjs → dropzone-C_vA4q0u.mjs}

@@ -1,5 +1,5 @@
-import { t as cn } from "./cn-dlASUkDY.mjs";
-import { t as Button } from "./button-B_N7A8gv.mjs";
+import { t as cn } from "./utils-Bu32wN-x.mjs";
+import { t as Button } from "./button-A1qTjZ8U.mjs";
 import { t as Button$1 } from "./button-CsdF61EI.mjs";
 import { t as Icon } from "./icon-wrapper-DKfJlJd0.mjs";
 import { UploadIcon } from "lucide-react";
@@ -116,7 +116,6 @@ function Dropzone({ accept, maxFiles = 1, maxSize, minSize, onDrop, onError, dis
 			if (fileRejections.length > 0) {
 				const message = fileRejections.at(0)?.errors.at(0)?.message;
 				onError?.(new Error(message));
-				return;
 			}
 			onDrop?.(acceptedFiles, fileRejections, event);
 		},
@@ -155,7 +154,7 @@ function defaultContentLabel(files) {
 }
 function DropzoneContent({ children, className, icon, label, description }) {
 	const { src } = useDropzoneContext();
-	if (!src) return null;
+	if (!src || src.length === 0) return null;
 	if (children) return children;
 	const renderedLabel = typeof label === "function" ? label(src) : label;
 	return /* @__PURE__ */ jsxs("div", {
@@ -179,17 +178,18 @@ function DropzoneContent({ children, className, icon, label, description }) {
 }
 function DropzoneEmptyState({ children, className, icon, label, description, showCaption = false }) {
 	const { src, accept, maxSize, minSize } = useDropzoneContext();
-	if (src) return null;
+	if (src && src.length > 0) return null;
 	if (children) return children;
 	let caption = "";
 	if (showCaption) {
+		let sizeClause = "";
+		if (minSize && maxSize) sizeClause = `between ${renderBytes(minSize)} and ${renderBytes(maxSize)}`;
+		else if (minSize) sizeClause = `at least ${renderBytes(minSize)}`;
+		else if (maxSize) sizeClause = `less than ${renderBytes(maxSize)}`;
 		if (accept) {
-			caption += "Accepts ";
-			caption += new Intl.ListFormat("en").format(Object.keys(accept));
-		}
-		if (minSize && maxSize) caption += ` between ${renderBytes(minSize)} and ${renderBytes(maxSize)}`;
-		else if (minSize) caption += ` at least ${renderBytes(minSize)}`;
-		else if (maxSize) caption += ` less than ${renderBytes(maxSize)}`;
+			caption = `Accepts ${new Intl.ListFormat("en").format(Object.keys(accept))}`;
+			if (sizeClause) caption += ` ${sizeClause}`;
+		} else if (sizeClause) caption = `File size must be ${sizeClause}`;
 	}
 	return /* @__PURE__ */ jsxs("div", {
 		className: cn("flex flex-col items-center justify-center", className),

package/dist/empty-content/index.mjs

@@ -1,2 +1,2 @@
-import { t as EmptyContent } from "../empty-content-C4Z0QVfg.mjs";
+import { t as EmptyContent } from "../empty-content-BpS0PONb.mjs";
 export { EmptyContent };

package/dist/{empty-content-C4Z0QVfg.mjs → empty-content-BpS0PONb.mjs}

@@ -1,6 +1,6 @@
-import { t as cn } from "./cn-dlASUkDY.mjs";
-import { t as Button } from "./button-B_N7A8gv.mjs";
-import { t as Tooltip } from "./tooltip-BqrOCH8l.mjs";
+import { t as cn } from "./utils-Bu32wN-x.mjs";
+import { t as Button } from "./button-A1qTjZ8U.mjs";
+import { t as Tooltip } from "./tooltip-BhatUaar.mjs";
 import { cva } from "class-variance-authority";
 import { Fragment } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -111,7 +111,7 @@ function EmptyContent({ title = "No data found", subtitle, variant = "default",
 	const buttonSize = BUTTON_SIZE_MAP[size ?? "md"];
 	const LinkComp = linkComponent || "a";
 	const visibleActions = actions.filter((action) => !action.hidden);
-	const renderAction = (action) => {
+	const renderAction = (action, index) => {
 		const renderAsLink = (action.as === "link" || action.as === "external-link") && !action.disabled;
 		const { as: _as, label, tooltip, tooltipSide, hidden: _hidden, to, target, rel, download, hrefLang, referrerPolicy, ping, type = "secondary", size: sizeOverride, className: actionClassName, ...buttonProps } = action;
 		const resolvedSize = sizeOverride ?? buttonSize;
@@ -144,7 +144,7 @@ function EmptyContent({ title = "No data found", subtitle, variant = "default",
 				children: control
 			})
 		});
-		return /* @__PURE__ */ jsx(Fragment, { children: control }, `${action.as ?? "button"}-${label}`);
+		return /* @__PURE__ */ jsx(Fragment, { children: control }, `${action.as ?? "button"}-${label}-${index}`);
 	};
 	return /* @__PURE__ */ jsxs("div", {
 		className: cn(containerVariants({
@@ -174,9 +174,9 @@ function EmptyContent({ title = "No data found", subtitle, variant = "default",
 			/* @__PURE__ */ jsxs("div", {
 				className: "dark:bg-background border-border relative flex max-w-[224px] flex-col items-center justify-center gap-3.5 rounded-lg border bg-white px-6 py-7",
 				children: [
-					/* @__PURE__ */ jsx("h3", {
+					title && /* @__PURE__ */ jsx("h3", {
 						className: titleVariants({ size }),
-						children: `Hey ${userName ?? "there"}, ${title || ""}`
+						children: `Hey ${userName ?? "there"}, ${title}`
 					}),
 					subtitle && /* @__PURE__ */ jsx("span", {
 						className: subtitleVariants({ size }),

package/dist/exports/map.d.ts

@@ -1,3 +1,2 @@
 export * from '../components/base/map';
 export * from '../components/base/place-autocomplete';
-//# sourceMappingURL=map.d.ts.map

package/dist/form/adapters/conform/index.mjs

@@ -1,5 +1,5 @@
 import { t as FormAdapterProvider } from "../../../adapter-context-h0jCVqGO.mjs";
-import { n as getFieldConstraints, t as useDisplayTouched } from "../../../use-display-touched-B31H1Ziq.mjs";
+import { n as getFieldConstraints, t as useDisplayTouched } from "../../../use-display-touched-CMEEv7aT.mjs";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 import { FormProvider, getFormProps, getInputProps, useForm, useFormMetadata, useInputControl } from "@conform-to/react";
@@ -40,21 +40,63 @@ function resolveConformField(fields, name) {
 }
 function convertFromString(value) {
 	if (value === void 0) return void 0;
-	if (Array.isArray(value)) return value[0];
+	if (Array.isArray(value)) return value;
 	if (value === "on") return true;
-	if (value.startsWith("[\"") && value.endsWith("]")) try {
-		return JSON.parse(value);
-	} catch {
-		return value;
-	}
+	const parsed = tryParseSerializedArray(value);
+	if (parsed !== void 0) return parsed;
 	return value;
 }
+/**
+* Parse a string only if it is the canonical JSON serialization of an array,
+* matching exactly what `convertToString` produces. Returns the parsed array,
+* or `undefined` when the string is not a serialized array.
+*/
+function tryParseSerializedArray(value) {
+	if (value.length < 2 || value[0] !== "[" || !value.endsWith("]")) return void 0;
+	try {
+		const parsed = JSON.parse(value);
+		if (Array.isArray(parsed) && JSON.stringify(parsed) === value) return parsed;
+	} catch {}
+}
 function convertToString(value) {
 	if (typeof value === "boolean") return value ? "on" : "";
 	if (value === null || value === void 0) return "";
 	if (Array.isArray(value)) return JSON.stringify(value);
 	return String(value);
 }
+/**
+* Whether a value is a plain object (an object literal or `Object.create(null)`),
+* as opposed to a class/exotic instance such as `Date`, `Map`, `Set`, or a Zod
+* coerced/class value. Only plain objects should be walked as nested field
+* groups; non-plain instances have no meaningful `Object.entries()` and must be
+* kept as leaf values so their default survives.
+*/
+function isPlainObject(value) {
+	if (value === null || typeof value !== "object") return false;
+	const proto = Object.getPrototypeOf(value);
+	return proto === Object.prototype || proto === null;
+}
+/**
+* Flatten nested object defaults into dot-notation keys (e.g.
+* `{ address: { city: 'x' } }` -> `{ 'address.city': 'x' }`) so they match the
+* flat field names Conform writes into FormData. Arrays are treated as leaf
+* values because convertToString serializes them into a single hidden input.
+*
+* Only *plain* objects are recursed into. Non-plain object instances (Date, Map,
+* Set, class instances, Zod-coerced values) are kept as leaf values — recursing
+* into them yields no `Object.entries()`, which would drop the field's default
+* and cause the dirty-tracking to flag the field as dirty on mount with no user
+* edit.
+*/
+function flattenDefaults(obj, prefix = "") {
+	const result = {};
+	for (const [key, value] of Object.entries(obj)) {
+		const path = prefix ? `${prefix}.${key}` : key;
+		if (isPlainObject(value)) Object.assign(result, flattenDefaults(value, path));
+		else result[path] = value;
+	}
+	return result;
+}
 /** Create a Conform form instance and normalize it to the adapter interface. */
 function useConformCreateForm(props) {
 	const { schema, defaultValues, mode, id, onSubmit, formRef } = props;
@@ -79,12 +121,8 @@ function useConformCreateForm(props) {
 	const formIsDirty = useFormData(formRef, (formData) => isDirty(formData, { defaultValue: defaultValues }) ?? false) ?? false;
 	const dirtyFields = useFormData(formRef, (formData) => {
 		const result = {};
-		const defaults = defaultValues ?? {};
-		for (const key of Object.keys(defaults)) {
-			const current = formData.get(key);
-			const defaultVal = defaults[key];
-			result[key] = current !== (defaultVal === true ? "on" : defaultVal === false || defaultVal === null || defaultVal === void 0 ? "" : String(defaultVal));
-		}
+		const defaults = flattenDefaults(defaultValues ?? {});
+		for (const key of Object.keys(defaults)) result[key] = formData.get(key) !== convertToString(defaults[key]);
 		for (const key of formData.keys()) if (!(key in result) && !key.startsWith("$")) {
 			const current = formData.get(key);
 			result[key] = current !== "" && current !== null;
@@ -117,16 +155,29 @@ function useConformCreateForm(props) {
 		formEl.addEventListener("focusout", handleFocusOut);
 		return () => formEl.removeEventListener("focusout", handleFocusOut);
 	}, [formRef]);
+	const [submitCount, setSubmitCount] = React.useState(0);
+	React.useEffect(() => {
+		const formEl = formRef?.current;
+		if (!formEl) return;
+		const handleSubmit = (event) => {
+			const submitter = event.submitter;
+			if (submitter instanceof HTMLButtonElement && submitter.hidden) return;
+			setSubmitCount((count) => count + 1);
+		};
+		formEl.addEventListener("submit", handleSubmit);
+		return () => formEl.removeEventListener("submit", handleSubmit);
+	}, [formRef]);
 	const formState = React.useMemo(() => ({
 		isDirty: formIsDirty,
 		isValid,
-		isSubmitted: false,
-		submitCount: 0,
+		isSubmitted: submitCount > 0,
+		submitCount,
 		dirtyFields,
 		touchedFields
 	}), [
 		formIsDirty,
 		isValid,
+		submitCount,
 		dirtyFields,
 		touchedFields
 	]);
@@ -161,7 +212,11 @@ function useConformCreateForm(props) {
 			if (!formRef?.current) return {};
 			const formData = new FormData(formRef.current);
 			const values = {};
-			for (const [key, value] of formData.entries()) values[key] = value;
+			for (const key of new Set(formData.keys())) {
+				if (key.startsWith("$")) continue;
+				const all = formData.getAll(key).map((entry) => String(entry));
+				values[key] = convertFromString(all.length > 1 ? all : all[0]);
+			}
 			return values;
 		},
 		touchedFields: displayTouchedFields,
@@ -196,7 +251,8 @@ function useConformField(name) {
 	if (!fieldMeta) throw new Error(`[Conform Adapter] Field "${name}" not found. Make sure the field name matches your schema.`);
 	const currentValue = convertFromString(control.value);
 	const defaultValue = convertFromString(fieldMeta.initialValue);
-	const fieldIsDirty = currentValue !== (defaultValue === void 0 ? "" : defaultValue);
+	const normalizedDefault = defaultValue === void 0 ? "" : defaultValue;
+	const fieldIsDirty = convertToString(currentValue) !== convertToString(normalizedDefault);
 	const fieldIsTouched = touchedFieldsRef.current.has(name);
 	return React.useMemo(() => ({
 		name: fieldMeta.name,

package/dist/form/adapters/rhf/index.mjs

@@ -1,5 +1,6 @@
 import { t as FormAdapterProvider } from "../../../adapter-context-h0jCVqGO.mjs";
-import { n as getFieldConstraints, r as getObjectShape, t as useDisplayTouched } from "../../../use-display-touched-B31H1Ziq.mjs";
+import { t as getObjectShape } from "../../../zod-helpers-YEhVo2S-.mjs";
+import { n as getFieldConstraints, t as useDisplayTouched } from "../../../use-display-touched-CMEEv7aT.mjs";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -60,6 +61,12 @@ function getFieldDefault(schema) {
 //#endregion
 //#region src/components/features/form/adapters/rhf/rhf-adapter.tsx
 const RHFFormIdContext = React.createContext("form");
+/**
+* Provides the normalized field metadata (keyed by field name) so per-field
+* hooks can read schema-derived data — notably `required` — that only
+* useCreateForm computes from the Zod schema.
+*/
+const RHFFieldsContext = React.createContext({});
 /** Create a React Hook Form instance and normalize it to the adapter interface. */
 function useRHFCreateForm(props) {
 	const { schema, defaultValues, mode, id, onSubmit, formRef } = props;
@@ -74,7 +81,7 @@ function useRHFCreateForm(props) {
 		mode,
 		reValidateMode: "onChange"
 	});
-	const { errors, isDirty, isValid, dirtyFields, touchedFields } = form.formState;
+	const { errors, isDirty, isValid, isSubmitted, submitCount, dirtyFields, touchedFields } = form.formState;
 	const constraints = React.useMemo(() => getFieldConstraints(schema), [schema]);
 	const onSubmitRef = React.useRef(onSubmit);
 	onSubmitRef.current = onSubmit;
@@ -101,13 +108,15 @@ function useRHFCreateForm(props) {
 	const formState = React.useMemo(() => ({
 		isDirty,
 		isValid,
-		isSubmitted: false,
-		submitCount: 0,
+		isSubmitted,
+		submitCount,
 		dirtyFields: Object.fromEntries(Object.entries(dirtyFields).map(([k, v]) => [k, Boolean(v)])),
 		touchedFields: Object.fromEntries(Object.entries(touchedFields).map(([k, v]) => [k, Boolean(v)]))
 	}), [
 		isDirty,
 		isValid,
+		isSubmitted,
+		submitCount,
 		dirtyFields,
 		touchedFields
 	]);
@@ -148,15 +157,17 @@ function useRHFCreateForm(props) {
 function useRHFField(name) {
 	const form = useFormContext();
 	const formId = React.use(RHFFormIdContext);
+	const fieldsMeta = React.use(RHFFieldsContext);
 	const { field, fieldState } = useController({
 		name,
 		control: form.control
 	});
+	const required = fieldsMeta[name]?.required ?? false;
 	return React.useMemo(() => ({
 		name: field.name,
 		id: `${formId}-${name}`,
 		errors: fieldState.error?.message ? [String(fieldState.error.message)] : [],
-		required: false,
+		required,
 		isDirty: fieldState.isDirty,
 		isTouched: fieldState.isTouched,
 		value: field.value,
@@ -168,7 +179,8 @@ function useRHFField(name) {
 		fieldState,
 		name,
 		formId,
-		form
+		form,
+		required
 	]);
 }
 /** Watch a single field's value reactively. */
@@ -220,9 +232,12 @@ function RHFFormProviderWrapper({ instance, children }) {
 	const form = instance.raw;
 	return /* @__PURE__ */ jsx(RHFFormIdContext, {
 		value: instance.id,
-		children: /* @__PURE__ */ jsx(FormProvider, {
-			...form,
-			children
+		children: /* @__PURE__ */ jsx(RHFFieldsContext, {
+			value: instance.fields,
+			children: /* @__PURE__ */ jsx(FormProvider, {
+				...form,
+				children
+			})
 		})
 	});
 }

package/dist/form/index.mjs

@@ -1,3 +1,3 @@
-import { A as FormCheckbox, C as FormDialog, D as FormCustom, E as FormDatePicker, M as FormAutosearch, N as FormAutocomplete, O as FormCopyBox, S as FormError, T as FormDateTimePicker, _ as FormRadioGroup, a as useField, b as FormFieldArray, c as useWatchAll, d as FormTextarea, f as FormSwitch, g as FormRoot, h as FormSelectItem, i as useFieldContext, j as FormButton, k as FormCombobox, l as FormTransfer, m as FormSelect, n as useFormState, o as FormWhen, p as FormSubmit, r as useFormContext, s as useWatch, t as Form, u as FormTimePicker, v as FormRadioItem, w as FormDescription, x as FormField, y as FormInput } from "../form-JM1Rqh6g.mjs";
+import { A as FormCheckbox, C as FormDialog, D as FormCustom, E as FormDatePicker, M as FormAutosearch, N as FormAutocomplete, O as FormCopyBox, S as FormError, T as FormDateTimePicker, _ as FormRadioGroup, a as useField, b as FormFieldArray, c as useWatchAll, d as FormTextarea, f as FormSwitch, g as FormRoot, h as FormSelectItem, i as useFieldContext, j as FormButton, k as FormCombobox, l as FormTransfer, m as FormSelect, n as useFormState, o as FormWhen, p as FormSubmit, r as useFormContext, s as useWatch, t as Form, u as FormTimePicker, v as FormRadioItem, w as FormDescription, x as FormField, y as FormInput } from "../form-2pTdgtYr.mjs";
 import { n as useAdapter, t as FormAdapterProvider } from "../adapter-context-h0jCVqGO.mjs";
 export { Form, FormAdapterProvider, FormAutocomplete, FormAutosearch, FormButton, FormCheckbox, FormCombobox, FormCopyBox, FormCustom, FormDatePicker, FormDateTimePicker, FormDescription, FormDialog, FormError, FormField, FormFieldArray, FormInput, FormRadioGroup, FormRadioItem, FormRoot, FormSelect, FormSelectItem, FormSubmit, FormSwitch, FormTextarea, FormTimePicker, FormTransfer, FormWhen, useAdapter, useField, useFieldContext, useFormContext, useFormState, useWatch, useWatchAll };

package/dist/form/stepper/index.mjs

@@ -1,8 +1,9 @@
-import { t as cn } from "../../cn-dlASUkDY.mjs";
-import { t as Button } from "../../button-B_N7A8gv.mjs";
+import { t as cn } from "../../utils-Bu32wN-x.mjs";
+import { t as Button } from "../../button-A1qTjZ8U.mjs";
 import { n as useFormContext, t as FormProvider } from "../../form-context-DzB2a-dw.mjs";
 import { n as useAdapter } from "../../adapter-context-h0jCVqGO.mjs";
-import { t as defineStepper } from "../../stepper-DV9FH5Cy.mjs";
+import { t as defineStepper } from "../../stepper-DJkYcilu.mjs";
+import { t as getObjectShape } from "../../zod-helpers-YEhVo2S-.mjs";
 import { CheckIcon } from "lucide-react";
 import * as React from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -14,6 +15,24 @@ function useFormStepperContext() {
 	return context;
 }
 /**
+* Pick only the fields that belong to a step's own schema out of a merged form
+* values object.
+*
+* The per-step form is seeded with the merged flow data of ALL steps as its
+* default values, so `instance.getValues()` returns every step's fields, not
+* just the current one. Persisting that whole object under the current step's
+* flow-data key would let stale copies of other steps' fields shadow their real
+* entries on final submit. Narrowing to the step's own schema keys keeps each
+* step's flow-data entry isolated.
+*/
+function pickStepValues(schema, values) {
+	const shape = getObjectShape(schema);
+	if (!shape) return values;
+	const picked = {};
+	for (const key of Object.keys(shape)) if (key in values) picked[key] = values[key];
+	return picked;
+}
+/**
 * Convert StepConfig[] to Stepperize step format
 */
 function toStepperizeSteps(steps) {
@@ -128,14 +147,11 @@ function StepForm({ steps, stepper, currentStepConfig, storedValues, children, o
 		if (stepper.isLast) {
 			setIsSubmitting(true);
 			try {
-				await onComplete({
-					...steps.reduce((acc, step) => ({
-						...acc,
-						...stepper.data.get(step.id) || {}
-					}), {}),
-					...data
-				});
-			} catch {} finally {
+				await onComplete(steps.reduce((acc, step) => ({
+					...acc,
+					...step.id === currentStepConfig.id ? data : stepper.data.get(step.id) || {}
+				}), {}));
+			} finally {
 				setIsSubmitting(false);
 			}
 		} else {
@@ -149,6 +165,7 @@ function StepForm({ steps, stepper, currentStepConfig, storedValues, children, o
 		stepper,
 		steps,
 		currentIndex,
+		currentStepConfig,
 		onComplete,
 		onStepChange
 	]);
@@ -164,8 +181,8 @@ function StepForm({ steps, stepper, currentStepConfig, storedValues, children, o
 		formRef.current?.requestSubmit();
 	}, []);
 	const prev = React.useCallback(() => {
-		const currentValues = instance.getValues();
-		if (Object.keys(currentValues).length > 0) stepper.data.set(currentValues);
+		const stepValues = pickStepValues(currentStepConfig.schema, instance.getValues());
+		if (Object.keys(stepValues).length > 0) stepper.data.set(currentStepConfig.id, stepValues);
 		const prevStepId = steps[currentIndex - 1]?.id;
 		if (prevStepId) {
 			stepper.goTo(prevStepId);
@@ -176,12 +193,13 @@ function StepForm({ steps, stepper, currentStepConfig, storedValues, children, o
 		stepper,
 		steps,
 		currentIndex,
+		currentStepConfig,
 		onStepChange
 	]);
 	const goTo = React.useCallback((stepId) => {
 		if (steps.findIndex((s) => s.id === stepId) < currentIndex) {
-			const currentValues = instance.getValues();
-			if (Object.keys(currentValues).length > 0) stepper.data.set(currentValues);
+			const stepValues = pickStepValues(currentStepConfig.schema, instance.getValues());
+			if (Object.keys(stepValues).length > 0) stepper.data.set(currentStepConfig.id, stepValues);
 			stepper.goTo(stepId);
 			onStepChange?.(stepId, "prev");
 		}
@@ -190,6 +208,7 @@ function StepForm({ steps, stepper, currentStepConfig, storedValues, children, o
 		stepper,
 		steps,
 		currentIndex,
+		currentStepConfig,
 		onStepChange
 	]);
 	const getStepData = React.useCallback((stepId) => stepper.data.get(stepId), [stepper]);

package/dist/{form-JM1Rqh6g.mjs → form-2pTdgtYr.mjs}

@@ -1,26 +1,27 @@
-import { t as cn } from "./cn-dlASUkDY.mjs";
-import { t as Button } from "./button-B_N7A8gv.mjs";
+import { t as cn } from "./utils-Bu32wN-x.mjs";
+import { t as Button } from "./button-A1qTjZ8U.mjs";
 import { t as Icon } from "./icon-wrapper-DKfJlJd0.mjs";
-import { t as Checkbox } from "./checkbox-BZr9bkke.mjs";
-import { t as Dialog } from "./dialog-ZmYSe4-x.mjs";
-import { t as Input } from "./input-DBzgl-pN.mjs";
-import { t as Label } from "./label-CiVSCTp9.mjs";
-import { n as RadioGroupItem, t as RadioGroup } from "./radio-group-kjKWAwdr.mjs";
-import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-DNnPDWSW.mjs";
-import { t as Tooltip } from "./tooltip-BqrOCH8l.mjs";
-import { t as Switch } from "./switch-Doft2t6-.mjs";
-import { t as Textarea } from "./textarea-BzQxX-oL.mjs";
-import { t as Autocomplete } from "./autocomplete-Bg187x6x.mjs";
-import { t as CalendarDatePicker } from "./calendar-date-picker-DAVXW7Jg.mjs";
-import { t as toast } from "./toast-qSJgeN-g.mjs";
+import { t as Checkbox } from "./checkbox-C6P12fio.mjs";
+import { t as Dialog } from "./dialog-N2pkQIc4.mjs";
+import { t as useControllableState } from "./use-controllable-state-Dna7u3r9.mjs";
+import { t as Input } from "./input-j4tbmYYz.mjs";
+import { t as Label } from "./label-Bk6FXsju.mjs";
+import { n as RadioGroupItem, t as RadioGroup } from "./radio-group-LduBVTnh.mjs";
+import { i as SelectItem, l as SelectTrigger, n as SelectContent, t as Select, u as SelectValue } from "./select-DCU44UO6.mjs";
+import { t as Tooltip } from "./tooltip-BhatUaar.mjs";
+import { t as Switch } from "./switch-DPHr3TcN.mjs";
+import { t as Textarea } from "./textarea-B6YhjFVC.mjs";
+import { t as Autocomplete } from "./autocomplete-G24AgvxU.mjs";
 import { Autosearch } from "./autosearch/index.mjs";
+import { t as CalendarDatePicker } from "./calendar-date-picker-C52Y05ZN.mjs";
+import { t as toast } from "./toast-BUPlDkN3.mjs";
+import { t as DateTimePicker } from "./date-time-picker-BbtA6JJJ.mjs";
 import { n as useFormContext$1, t as FormProvider } from "./form-context-DzB2a-dw.mjs";
-import { t as useCopyToClipboard } from "./use-copy-to-clipboard-BOCe6C1j.mjs";
-import { t as DateTimePicker } from "./date-time-picker-BWrS9k-c.mjs";
+import { t as useCopyToClipboard } from "./use-copy-to-clipboard-DZDq_85T.mjs";
 import { n as useAdapter } from "./adapter-context-h0jCVqGO.mjs";
 import { InputWithAddons } from "./input-with-addons/index.mjs";
-import { t as TimePicker } from "./time-picker-B52KLKGe.mjs";
-import { t as Transfer } from "./transfer-Dp6tTYeN.mjs";
+import { t as TimePicker } from "./time-picker-Bgt6R1fU.mjs";
+import { t as Transfer } from "./transfer-CEq9AhL7.mjs";
 import { CheckIcon, CircleHelp, CopyIcon } from "lucide-react";
 import * as React from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -292,8 +293,8 @@ function FormCopyBox({ variant = "default", className, contentClassName, buttonC
 	const displayValue = value || placeholder;
 	const copyToClipboard = () => {
 		if (!value) return;
-		copy(value).then(() => {
-			toast.success("Copied to clipboard");
+		copy(value).then((didCopy) => {
+			if (didCopy) toast.success("Copied to clipboard");
 		});
 	};
 	return /* @__PURE__ */ jsxs("div", {
@@ -308,6 +309,8 @@ function FormCopyBox({ variant = "default", className, contentClassName, buttonC
 			className: "flex items-center py-2 pr-3",
 			children: variant === "icon-only" ? /* @__PURE__ */ jsx("button", {
 				type: "button",
+				"aria-label": copied ? "Copied to clipboard" : "Copy to clipboard",
+				title: copied ? "Copied" : "Copy",
 				className: cn("text-muted-foreground hover:text-foreground flex size-7 items-center justify-center rounded-sm transition-colors", buttonClassName),
 				onClick: copyToClipboard,
 				children: copied ? /* @__PURE__ */ jsx(CheckIcon, { className: "size-4" }) : /* @__PURE__ */ jsx(CopyIcon, { className: "size-4" })
@@ -386,7 +389,13 @@ function FormDatePicker({ placeholder, disabled, className, triggerClassName, nu
 				to: date
 			};
 		}
-		if (typeof val === "object" && "from" in val) return val;
+		if (typeof val === "object" && "from" in val) {
+			const range = val;
+			return {
+				from: range.from ? new Date(range.from) : void 0,
+				to: range.to ? new Date(range.to) : void 0
+			};
+		}
 		return {
 			from: void 0,
 			to: void 0
@@ -538,31 +547,26 @@ FormDescription.displayName = "Form.Description";
 * ```
 */
 function FormDialog({ open, onOpenChange, defaultOpen, title, description, trigger, schema, defaultValues, onSubmit, onSuccess, onError, submitText = "Submit", submitTextLoading = "Submitting...", cancelText = "Cancel", showCancel = true, submitType = "primary", loading, formComponent, telemetry, className, formClassName, showHeaderClose = true, children }) {
-	const [internalOpen, setInternalOpen] = React.useState(defaultOpen ?? false);
-	const [internalIsSubmitting, setInternalIsSubmitting] = React.useState(false);
-	const isSubmitting = loading ?? internalIsSubmitting;
-	const isControlled = open !== void 0;
-	const isOpen = isControlled ? open : internalOpen;
+	const [isOpen, setOpen] = useControllableState(open, defaultOpen ?? false, onOpenChange);
+	const [isSubmitting, setIsSubmitting] = useControllableState(loading, false);
 	const handleOpenChange = React.useCallback((value) => {
 		if (!value && isSubmitting) return;
-		if (!isControlled) setInternalOpen(value);
-		onOpenChange?.(value);
-	}, [
-		isControlled,
-		isSubmitting,
-		onOpenChange
-	]);
+		setOpen(value);
+	}, [isSubmitting, setOpen]);
 	const handleSubmit = React.useCallback(async (data) => {
-		if (loading === void 0) setInternalIsSubmitting(true);
+		setIsSubmitting(true);
 		try {
 			await onSubmit?.(data);
 			onSuccess?.(data);
 		} finally {
-			if (loading === void 0) setInternalIsSubmitting(false);
+			setIsSubmitting(false);
 		}
+		if (!loading) setOpen(false);
 	}, [
 		onSubmit,
 		onSuccess,
+		setIsSubmitting,
+		setOpen,
 		loading
 	]);
 	const handleCancel = React.useCallback(() => {
@@ -1004,13 +1008,12 @@ FormRadioItem.displayName = "Form.RadioItem";
 */
 function FormRoot({ schema, children, onSubmit, action, method = "POST", formComponent: FormComp = "form", id, name, defaultValues, mode = "onChange", isSubmitting: externalIsSubmitting, onError, onSuccess, telemetry, className }) {
 	const adapter = useAdapter();
-	const [internalIsSubmitting, setInternalIsSubmitting] = React.useState(false);
-	const isSubmitting = externalIsSubmitting ?? internalIsSubmitting;
+	const [isSubmitting, setIsSubmitting] = useControllableState(externalIsSubmitting, false);
 	const [isSubmitted, setIsSubmitted] = React.useState(false);
 	const [submitCount, setSubmitCount] = React.useState(0);
 	const formRef = React.useRef(null);
 	const wrappedOnSubmit = React.useCallback(async (data) => {
-		setInternalIsSubmitting(true);
+		setIsSubmitting(true);
 		setIsSubmitted(true);
 		setSubmitCount((prev) => prev + 1);
 		try {
@@ -1022,6 +1025,7 @@ function FormRoot({ schema, children, onSubmit, action, method = "POST", formCom
 			onSuccess?.(data);
 		} catch (error) {
 			const err = error instanceof Error ? error : new Error(String(error));
+			const handled = Boolean(telemetry?.onError || telemetry?.captureError || onError);
 			telemetry?.onError?.({
 				formName: name ?? "",
 				formId: id,
@@ -1032,8 +1036,9 @@ function FormRoot({ schema, children, onSubmit, action, method = "POST", formCom
 				formId: id
 			});
 			onError?.(error);
+			if (!handled) throw err;
 		} finally {
-			setInternalIsSubmitting(false);
+			setIsSubmitting(false);
 		}
 	}, [
 		onSubmit,
@@ -1041,7 +1046,8 @@ function FormRoot({ schema, children, onSubmit, action, method = "POST", formCom
 		onError,
 		telemetry,
 		name,
-		id
+		id,
+		setIsSubmitting
 	]);
 	const instance = adapter.useCreateForm({
 		schema,
@@ -1110,11 +1116,21 @@ function FormRoot({ schema, children, onSubmit, action, method = "POST", formCom
 				onSubmit: (e) => {
 					const submitter = e.nativeEvent.submitter;
 					e.stopPropagation();
-					if (submitter && !submitter.hidden) instance.markAllFieldsTouched();
+					const isUserSubmit = submitter && !submitter.hidden;
+					if (isUserSubmit) instance.markAllFieldsTouched();
 					telemetry?.onSubmit?.({
 						formName: name ?? "",
 						formId: id
 					});
+					if (isUserSubmit && !onSubmit) {
+						setIsSubmitted(true);
+						setSubmitCount((prev) => prev + 1);
+						telemetry?.onSuccess?.({
+							formName: name ?? "",
+							formId: id
+						});
+						onSuccess?.(instance.getValues());
+					}
 					const adapterSubmit = instance.formProps.onSubmit;
 					adapterSubmit?.(e);
 				},

package/dist/grid/index.mjs

@@ -1,2 +1,2 @@
-import { a as getResponsiveValue, c as GRID_COLUMNS, d as RESPONSIVE_MAP, i as getGutter, l as GRID_PREFIX, n as Row, o as registerMediaQuery, r as RowContext, s as GRID_BREAKPOINTS, t as Col, u as RESPONSIVE_ARRAY } from "../col-DlpHgWOq.mjs";
+import { a as getResponsiveValue, c as GRID_COLUMNS, d as RESPONSIVE_MAP, i as getGutter, l as GRID_PREFIX, n as Row, o as registerMediaQuery, r as RowContext, s as GRID_BREAKPOINTS, t as Col, u as RESPONSIVE_ARRAY } from "../col-BYGWTB4j.mjs";
 export { Col, GRID_BREAKPOINTS, GRID_COLUMNS, GRID_PREFIX, RESPONSIVE_ARRAY, RESPONSIVE_MAP, Row, RowContext, getGutter, getResponsiveValue, registerMediaQuery };