themelia-react-ui 2.0.6 → 3.0.0

package/dist/features/schema-form.js

@@ -1,28 +1,27 @@
 "use client";
 import { useStrings as e } from "../lib/strings.js";
-import { t } from "../utils-DhuoqFy4.js";
-import { n } from "../buttons-DeW0bQeK.js";
-import { c as r } from "../typography-C7-YMW1S.js";
-import { t as i } from "../text.styles-B64My8RZ.js";
-import { t as a } from "../structure-DZJ2wbAU.js";
-import { t as o } from "../smart-card-B6vLxqa_.js";
+import { t } from "../utils-BVbAG2J6.js";
+import { c as n } from "../typography-C0dELqYV.js";
+import { t as r } from "../text.styles-B64My8RZ.js";
+import { n as i } from "../buttons-pZVgPTZn.js";
+import { t as a } from "../structure-DElaQwwN.js";
+import { t as o } from "../smart-card-C59z6KFO.js";
 import { n as s } from "../composition.recipes-COdiFhxB.js";
-import { t as c } from "../input-7KAc7XQL.js";
-import { t as l } from "../form-field-CAPdwdnZ.js";
-import { d as u } from "../text-inputs-jdkS3ReG.js";
-import { a as d, i as f, l as p, o as m, r as h } from "../choice-inputs-DHGtx0QV.js";
-import { n as g } from "../display-CT_N2a3w.js";
-import { u as _ } from "../value-inputs-D3aPgq9H.js";
-import { d as v } from "../forms-numeric-CwjQJe-O.js";
-import { s as y } from "../data-display-Cmj-xZYl.js";
-import { Fragment as b, useCallback as x, useEffect as S, useId as C, useLayoutEffect as w, useMemo as T, useRef as E, useState as D } from "react";
-import { jsx as O, jsxs as k } from "react/jsx-runtime";
+import { t as c } from "../input-DfJyrjoR.js";
+import { t as l } from "../form-field-BdfCwSoQ.js";
+import { d as u } from "../text-inputs-ljyBYaCd.js";
+import { a as d, i as f, l as p, o as m, r as h } from "../choice-inputs-oJEsrb5Y.js";
+import { u as g } from "../value-inputs-h5MwjGCo.js";
+import { p as _ } from "../forms-numeric-DOBswjKj.js";
+import { s as v } from "../data-display-CWe9SOYh.js";
+import { Fragment as y, useCallback as b, useEffect as x, useId as S, useLayoutEffect as C, useMemo as w, useRef as T, useState as E } from "react";
+import { jsx as D, jsxs as O } from "react/jsx-runtime";
 //#region src/components/features/schema-form/schema-form.utils.ts
-var ee = {
+var k = {
 	1: "grid grid-cols-1 gap-space-xl",
 	2: "grid grid-cols-1 gap-space-xl @md/schema-form:grid-cols-2",
 	3: "grid grid-cols-1 gap-space-xl @md/schema-form:grid-cols-2 @xl/schema-form:grid-cols-3"
-}, te = {
+}, ee = {
 	auto: "",
 	half: "@md/schema-form:col-span-1",
 	third: "@xl/schema-form:col-span-1",
@@ -36,7 +35,7 @@ function A(e, t, n) {
 	}
 	return e.hidden ?? !1;
 }
-function ne(e, t, n) {
+function te(e, t, n) {
 	if (typeof e.disabled == "function") try {
 		return e.disabled(t);
 	} catch (e) {
@@ -44,11 +43,11 @@ function ne(e, t, n) {
 	}
 	return e.disabled ?? !1;
 }
-function re(e, t, n) {
+function j(e, t, n) {
 	return e.filter((e) => !A(e, t, n));
 }
-function ie(e, t, n, r, i) {
-	let a = re(e.fields, t, i), o = new Map(a.map((e) => [e.key, e])), s = /* @__PURE__ */ new Set(), c = [];
+function ne(e, t, n, r, i) {
+	let a = j(e.fields, t, i), o = new Map(a.map((e) => [e.key, e])), s = /* @__PURE__ */ new Set(), c = [];
 	for (let t of e.sections ?? []) {
 		let e = t.fields ? t.fields.map((e) => o.get(e)).filter((e) => e !== void 0) : a.filter((e) => e.sectionId === t.id);
 		for (let t of e) s.add(t.key);
@@ -71,22 +70,22 @@ function ie(e, t, n, r, i) {
 		columns: r
 	}), c.filter((e) => e.fields.length > 0);
 }
-function j(e) {
+function M(e) {
 	return e == null ? "" : typeof e == "string" ? e : typeof e == "number" || typeof e == "boolean" ? String(e) : JSON.stringify(e);
 }
-function M(e) {
+function N(e) {
 	return Array.isArray(e) ? e.map((e) => String(e)) : [];
 }
-function N(e) {
+function re(e) {
 	return e === !0 || e === "true" || e === 1;
 }
-function P(e, t = !1) {
+function ie(e, t = !1) {
 	let n = e.trim();
 	if (n.length === 0) return null;
 	let r = t ? Number.parseInt(n, 10) : Number.parseFloat(n);
 	return Number.isNaN(r) ? null : r;
 }
-function F(e, t = 2, n = !1) {
+function P(e, t = 2, n = !1) {
 	if (e == null) return "";
 	if (typeof e == "string") return n ? JSON.stringify(e) : e;
 	try {
@@ -95,7 +94,7 @@ function F(e, t = 2, n = !1) {
 		return String(e);
 	}
 }
-function I(e) {
+function F(e) {
 	let t = e.trim();
 	if (t.length === 0) return {
 		value: null,
@@ -115,21 +114,21 @@ function I(e) {
 }
 //#endregion
 //#region src/components/features/schema-form/hooks/use-schema-form.ts
-function L(e, t) {
+function I(e, t) {
 	let n = { ...t };
 	for (let t of e) t.defaultValue !== void 0 && n[t.key] === void 0 && (n[t.key] = t.defaultValue);
 	return n;
 }
-function R(e) {
+function L(e) {
 	return e == null ? !0 : typeof e == "string" ? e.trim().length === 0 : Array.isArray(e) ? e.length === 0 : !1;
 }
-function z(e) {
+function R(e) {
 	let t = {};
 	for (let [n, r] of Object.entries(e ?? {})) r && (t[n] = r);
 	return t;
 }
-function B(e) {
-	let { fields: t, value: n, defaultValue: r, errors: i } = e, a = n !== void 0, o = T(() => L(t, r), [r, t]), [s, c] = D(() => o), [l, u] = D({}), d = E(/* @__PURE__ */ new Set()), f = T(() => a ? {
+function ae(e) {
+	let { fields: t, value: n, defaultValue: r, errors: i } = e, a = n !== void 0, o = w(() => I(t, r), [r, t]), [s, c] = E(() => o), [l, u] = E({}), d = T(/* @__PURE__ */ new Set()), f = T([]), p = w(() => a ? {
 		...o,
 		...n
 	} : s, [
@@ -137,51 +136,51 @@ function B(e) {
 		s,
 		a,
 		n
-	]), p = E(f), m = E(f), h = E(e);
-	w(() => {
-		p.current = f, m.current = f;
-	}, [f]), w(() => {
-		h.current = e;
+	]), m = T(p), h = T(p), g = T(e);
+	C(() => {
+		m.current = p, h.current = p;
+	}, [p]), C(() => {
+		g.current = e;
 	}, [e]);
-	let g = T(() => ({
+	let _ = w(() => ({
 		...l,
-		...z(i)
-	}), [i, l]), _ = x((e) => {
-		if (m.current = e, h.current.value === void 0) {
+		...R(i)
+	}), [i, l]), v = b((e) => {
+		if (h.current = e, g.current.value === void 0) {
 			c(e);
 			return;
 		}
 		queueMicrotask(() => {
-			m.current === e && (m.current = p.current);
+			h.current === e && (h.current = m.current);
 		});
-	}, []), v = x((e) => {
-		_(e), h.current.onValueChange?.(e);
-	}, [_]), y = x((e, t) => {
+	}, []), y = b((e) => {
+		v(e), g.current.onValueChange?.(e);
+	}, [v]), x = b((e, t) => {
 		let n = {
-			...m.current,
+			...h.current,
 			[e]: t
 		};
-		_(n), u((t) => {
+		v(n), u((t) => {
 			if (!t[e]) return t;
 			let n = { ...t };
 			return delete n[e], n;
-		}), h.current.onFieldChange?.(e, t, n), h.current.onValueChange?.(n);
-	}, [_]), b = x((e, t) => {
+		}), g.current.onFieldChange?.(e, t, n), g.current.onValueChange?.(n);
+	}, [v]), S = b((e, t) => {
 		t ? d.current.delete(e) : d.current.add(e);
-	}, []), S = x(() => {
-		let { fields: e, defaultValue: t, onValueChange: n } = h.current, r = L(e, t);
-		return _(r), d.current.clear(), u({}), n?.(r), r;
-	}, [_]), C = x(() => {
-		let { fields: e, formatRequiredError: t, onError: n, validationError: r } = h.current, i = m.current, a = {}, o = !1;
+	}, []), D = b(() => {
+		let { fields: e, defaultValue: t, onValueChange: n } = g.current, r = I(e, t);
+		return v(r), d.current.clear(), f.current = [], u({}), n?.(r), r;
+	}, [v]), O = b(() => {
+		let { fields: e, formatRequiredError: t, onError: n, validationError: r } = g.current, i = h.current, a = {}, o = [];
 		for (let s of e) {
 			if (A(s, i, n)) continue;
 			if (s.type === "json" && d.current.has(s.key)) {
-				o = !0;
+				o.push(s.key);
 				continue;
 			}
 			let e = i[s.key];
-			if (s.required && R(e)) {
-				a[s.key] = t(s.label);
+			if (s.required && L(e)) {
+				a[s.key] = t(s.label), o.push(s.key);
 				continue;
 			}
 			let c = Array.isArray(s.validate) ? s.validate : s.validate ? [s.validate] : [];
@@ -203,39 +202,41 @@ function B(e) {
 				};
 				(t !== void 0 && e < t || n !== void 0 && e > n) && (a[s.key] = r);
 			}
+			a[s.key] && o.push(s.key);
 		}
-		return u(a), !o && Object.keys(a).length === 0;
+		return f.current = o, u(a), o.length === 0;
 	}, []);
 	return {
-		values: f,
-		errors: g,
-		getFieldError: x((e) => g[e], [g]),
-		getFieldValue: x((e) => f[e], [f]),
-		getValues: x(() => m.current, []),
-		setFieldValue: y,
-		setValues: v,
-		setFieldParseValidity: b,
-		reset: S,
-		validate: C
+		values: p,
+		errors: _,
+		getFieldError: b((e) => _[e], [_]),
+		getFieldValue: b((e) => p[e], [p]),
+		getValues: b(() => h.current, []),
+		setFieldValue: x,
+		setValues: y,
+		setFieldParseValidity: S,
+		reset: D,
+		validate: O,
+		getInvalidKeys: b(() => f.current, [])
 	};
 }
 //#endregion
 //#region src/components/features/schema-form/partials/schema-form-actions.tsx
-function V({ submitLabel: e, resetLabel: r, showReset: i = !1, disabled: o = !1, submitDisabled: c = !1, resetDisabled: l = !1, submitting: u = !1, onReset: d, className: f }) {
-	return /* @__PURE__ */ k(a, {
+function z({ submitLabel: e, resetLabel: n, showReset: r = !1, disabled: o = !1, submitDisabled: c = !1, resetDisabled: l = !1, submitting: u = !1, onReset: d, className: f }) {
+	return /* @__PURE__ */ O(a, {
 		direction: "horizontal",
 		align: "center",
 		justify: "end",
 		gap: s.commands,
 		className: t("schema-form-actions--component", f),
-		children: [!!i && /* @__PURE__ */ O(n, {
+		children: [!!r && /* @__PURE__ */ D(i, {
 			type: "button",
 			tone: "secondary",
 			buttonStyle: "outline",
 			disabled: o || l || u,
 			onClick: d,
-			children: r
-		}), /* @__PURE__ */ O(n, {
+			children: n
+		}), /* @__PURE__ */ D(i, {
 			type: "submit",
 			tone: "primary",
 			loading: u,
@@ -244,33 +245,33 @@ function V({ submitLabel: e, resetLabel: r, showReset: i = !1, disabled: o = !1,
 		})]
 	});
 }
-V.displayName = "SchemaFormActions";
+z.displayName = "SchemaFormActions";
 //#endregion
 //#region src/components/features/schema-form/partials/schema-form-empty.tsx
-function H({ title: e, description: n, className: r }) {
-	return /* @__PURE__ */ O(y, {
+function B({ title: e, description: n, className: r }) {
+	return /* @__PURE__ */ D(v, {
 		title: e,
 		description: n,
 		padding: "md",
-		border: !0,
-		className: t("schema-form-empty--component bg-muted/30", r)
+		surface: "wash",
+		className: t("schema-form-empty--component", r)
 	});
 }
-H.displayName = "SchemaFormEmpty";
+B.displayName = "SchemaFormEmpty";
 //#endregion
 //#region src/components/features/schema-form/partials/schema-form-field.tsx
-function U(e) {
+function V(e) {
 	return e.hint ?? e.description;
 }
-function W(e, t, n, r) {
+function H(e, t, n, r) {
 	if (e.formatValue) try {
 		return e.formatValue(t, n);
 	} catch (e) {
 		r?.(e);
 	}
-	return j(t);
+	return M(t);
 }
-function G(e, t, n, r) {
+function U(e, t, n, r) {
 	if (e.parseValue) try {
 		return e.parseValue(t, n);
 	} catch (e) {
@@ -278,19 +279,19 @@ function G(e, t, n, r) {
 	}
 	return t;
 }
-function K(e, t, n, r, i) {
+function W(e, t, n, r, i) {
 	if (e.parseValue) try {
 		return e.parseValue(t, n);
 	} catch (e) {
 		i?.(e);
 	}
-	return P(t, r);
+	return ie(t, r);
 }
-function ae({ field: e, value: t, values: n, onParsedChange: r, onParseError: i, onFocus: a, onBlur: o, ...s }) {
-	let c = E(!1), [l, u] = D(null), d = l && Object.is(l.value, t) ? l : null;
-	return l && !d && u(null), /* @__PURE__ */ O(v, {
+function G({ field: e, value: t, values: n, onParsedChange: r, onParseError: i, onFocus: a, onBlur: o, ...s }) {
+	let c = T(!1), [l, u] = E(null), d = l && Object.is(l.value, t) ? l : null;
+	return l && !d && u(null), /* @__PURE__ */ D(_, {
 		...s,
-		value: d?.text ?? W(e, t, n, i),
+		value: d?.text ?? H(e, t, n, i),
 		onFocus: (e) => {
 			c.current = !0, a?.(e);
 		},
@@ -298,7 +299,7 @@ function ae({ field: e, value: t, values: n, onParsedChange: r, onParseError: i,
 			c.current = !1, u(null), o?.(e);
 		},
 		onChange: (t) => {
-			let a = t.target.value, o = K(e, a, n, e.type === "integer", i);
+			let a = t.target.value, o = W(e, a, n, e.type === "integer", i);
 			c.current && u({
 				text: a,
 				value: o
@@ -306,7 +307,7 @@ function ae({ field: e, value: t, values: n, onParsedChange: r, onParseError: i,
 		}
 	});
 }
-function q(e, t, n, r) {
+function oe(e, t, n, r) {
 	if (e.type === "json" && e.parseValue) try {
 		return {
 			value: e.parseValue(t, n),
@@ -318,22 +319,22 @@ function q(e, t, n, r) {
 			valid: !1
 		};
 	}
-	return I(t);
+	return F(t);
 }
-function J(e) {
+function se(e) {
 	if (!e.icon) return;
 	let t = e.icon;
-	return /* @__PURE__ */ O(t, {
+	return /* @__PURE__ */ D(t, {
 		className: "size-icon",
 		"aria-hidden": "true"
 	});
 }
-function Y({ field: e, value: n, values: r, error: i, disabled: a, fieldId: o, onValueChange: s, onError: c, strings: d, onParseValidityChange: f }) {
-	let p = e.type === "json" ? e.jsonIndent ?? 2 : 2, m = !e.parseValue, [h, g] = D(() => F(n, p)), [_, v] = D(), [y, b] = D(!1), x = E(null);
-	if (S(() => {
+function K({ field: e, value: n, values: r, error: i, disabled: a, fieldId: o, onValueChange: s, onError: c, strings: d, onParseValidityChange: f }) {
+	let p = e.type === "json" ? e.jsonIndent ?? 2 : 2, m = !e.parseValue, [h, g] = E(() => P(n, p)), [_, v] = E(), [y, b] = E(!1), S = T(null);
+	if (x(() => {
 		if (y) return;
-		let t = x.current && Object.is(x.current.value, n) ? x.current : null;
-		g(F(n, p, m && !!t?.valid)), !t && x.current && (x.current = null, v(void 0), f?.(e.key, !0));
+		let t = S.current && Object.is(S.current.value, n) ? S.current : null;
+		g(P(n, p, m && !!t?.valid)), !t && S.current && (S.current = null, v(void 0), f?.(e.key, !0));
 	}, [
 		e.key,
 		p,
@@ -341,21 +342,21 @@ function Y({ field: e, value: n, values: r, error: i, disabled: a, fieldId: o, o
 		f,
 		m,
 		n
-	]), S(() => () => f?.(e.key, !0), [e.key, f]), e.type !== "json") return null;
+	]), x(() => () => f?.(e.key, !0), [e.key, f]), e.type !== "json") return null;
 	let C = (t) => {
-		let n = q(e, t, r, c);
-		return x.current = n, v(n.valid ? void 0 : d.jsonParseError), f?.(e.key, n.valid), s(n.value), n;
+		let n = oe(e, t, r, c);
+		return S.current = n, v(n.valid ? void 0 : d.jsonParseError), f?.(e.key, n.valid), s(n.value), n;
 	};
-	return /* @__PURE__ */ O(l, {
+	return /* @__PURE__ */ D(l, {
 		label: e.label,
 		required: e.required,
-		hint: U(e),
+		hint: V(e),
 		helperText: e.helperText,
 		error: i ?? _,
 		htmlFor: o,
 		supportingTextId: `${o}-supporting`,
 		className: "schema-form-field--component schema-form-field--json",
-		children: /* @__PURE__ */ O(u, {
+		children: /* @__PURE__ */ D(u, {
 			id: o,
 			name: e.key,
 			value: h,
@@ -373,25 +374,25 @@ function Y({ field: e, value: n, values: r, error: i, disabled: a, fieldId: o, o
 			onBlur: () => {
 				b(!1);
 				let e = C(h);
-				e.valid && g(F(e.value, p, m));
+				e.valid && g(P(e.value, p, m));
 			},
 			...e.textareaProps,
-			"aria-describedby": [e.textareaProps?.["aria-describedby"], i || _ || e.helperText || U(e) ? `${o}-supporting` : void 0].filter(Boolean).join(" ") || void 0
+			"aria-describedby": [e.textareaProps?.["aria-describedby"], i || _ || e.helperText || V(e) ? `${o}-supporting` : void 0].filter(Boolean).join(" ") || void 0
 		})
 	});
 }
-function X({ field: e, value: n, values: r, error: i, disabled: a, required: o, fieldId: s, onValueChange: g, onError: v, strings: y, className: b, onParseValidityChange: x }) {
+function q({ field: e, value: n, values: r, error: i, disabled: a, required: o, fieldId: s, onValueChange: _, onError: v, strings: y, className: b, onParseValidityChange: x }) {
 	let S = e.type ?? "text", C = {
 		label: e.label,
 		required: o,
-		hint: U(e),
+		hint: V(e),
 		helperText: e.helperText,
 		error: i,
 		htmlFor: s,
 		supportingTextId: `${s}-supporting`,
 		className: t("schema-form-field--component", b)
-	}, w = e.controlClassName, T = i || e.helperText || U(e) ? `${s}-supporting` : void 0;
-	if (S === "custom" && e.type === "custom") return /* @__PURE__ */ O("div", {
+	}, w = e.controlClassName, T = i || e.helperText || V(e) ? `${s}-supporting` : void 0;
+	if (S === "custom" && e.type === "custom") return /* @__PURE__ */ D("div", {
 		className: t("schema-form-field--component schema-form-field--custom", b),
 		children: e.render({
 			field: e,
@@ -401,17 +402,17 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 			disabled: a,
 			required: o,
 			fieldId: s,
-			onValueChange: g,
+			onValueChange: _,
 			onError: v
 		})
 	});
 	if (S === "switch" && e.type === "switch") {
-		let r = N(n);
-		return e.switchStyle === "card" ? /* @__PURE__ */ O(l, {
+		let r = re(n);
+		return e.switchStyle === "card" ? /* @__PURE__ */ D(l, {
 			error: i,
 			supportingTextId: `${s}-supporting`,
 			className: t("schema-form-field--component schema-form-field--switch-card", b),
-			children: /* @__PURE__ */ O(m, {
+			children: /* @__PURE__ */ D(m, {
 				label: e.label,
 				description: e.description,
 				hint: e.hint,
@@ -420,15 +421,15 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 				disabled: a,
 				invalid: !!i,
 				className: w,
-				onValueChange: (e) => g(e),
+				onValueChange: (e) => _(e),
 				...e.switchCardProps,
 				"aria-describedby": [e.switchCardProps?.["aria-describedby"], i ? `${s}-supporting` : void 0].filter(Boolean).join(" ") || void 0
 			})
-		}) : /* @__PURE__ */ O(l, {
+		}) : /* @__PURE__ */ D(l, {
 			error: i,
 			supportingTextId: `${s}-supporting`,
 			className: t("schema-form-field--component schema-form-field--switch", b),
-			children: /* @__PURE__ */ O(d, {
+			children: /* @__PURE__ */ D(d, {
 				label: e.label,
 				description: e.description ?? e.hint,
 				name: e.key,
@@ -436,13 +437,13 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 				disabled: a,
 				invalid: !!i,
 				className: w,
-				onValueChange: (e) => g(e),
+				onValueChange: (e) => _(e),
 				...e.switchProps,
 				"aria-describedby": [e.switchProps?.["aria-describedby"], i ? `${s}-supporting` : void 0].filter(Boolean).join(" ") || void 0
 			})
 		});
 	}
-	if (S === "json") return /* @__PURE__ */ O(Y, {
+	if (S === "json") return /* @__PURE__ */ D(K, {
 		field: e,
 		value: n,
 		values: r,
@@ -450,16 +451,16 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 		disabled: a,
 		required: o,
 		fieldId: s,
-		onValueChange: g,
+		onValueChange: _,
 		onError: v,
 		strings: y,
 		onParseValidityChange: x
 	});
 	if (S === "textarea" && e.type === "textarea") {
-		let t = W(e, n, r, v);
-		return /* @__PURE__ */ O(l, {
+		let t = H(e, n, r, v);
+		return /* @__PURE__ */ D(l, {
 			...C,
-			children: /* @__PURE__ */ O(u, {
+			children: /* @__PURE__ */ D(u, {
 				"aria-describedby": T,
 				id: s,
 				name: e.key,
@@ -470,20 +471,20 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 				invalid: !!i,
 				placeholder: e.placeholder,
 				className: w,
-				onChange: (t) => g(G(e, t.target.value, r, v)),
+				onChange: (t) => _(U(e, t.target.value, r, v)),
 				...e.textareaProps
 			})
 		});
 	}
 	if ((S === "number" || S === "integer" || S === "decimal") && (e.type === "number" || e.type === "integer" || e.type === "decimal")) {
 		let t = e.type === "integer" ? 0 : e.decimalPlaces ?? (e.type === "decimal" ? 2 : 4);
-		return /* @__PURE__ */ O(l, {
+		return /* @__PURE__ */ D(l, {
 			...C,
-			children: /* @__PURE__ */ O(ae, {
+			children: /* @__PURE__ */ D(G, {
 				field: e,
 				value: n,
 				values: r,
-				onParsedChange: g,
+				onParsedChange: _,
 				onParseError: v,
 				id: s,
 				name: e.key,
@@ -506,13 +507,13 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 			value: e.value,
 			label: e.label,
 			disabled: e.disabled,
-			icon: J(e)
+			icon: se(e)
 		}));
-		return /* @__PURE__ */ O(l, {
+		return /* @__PURE__ */ D(l, {
 			...C,
-			children: /* @__PURE__ */ O(p, {
+			children: /* @__PURE__ */ D(p, {
 				name: e.key,
-				value: j(n),
+				value: M(n),
 				options: t,
 				allowClear: e.allowClear,
 				disabled: a,
@@ -521,62 +522,62 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 				placeholder: e.placeholder,
 				"aria-label": e.label,
 				className: w,
-				onValueChange: (e) => g(e ?? null),
+				onValueChange: (e) => _(e ?? null),
 				...e.selectProps,
 				"aria-describedby": [e.selectProps?.["aria-describedby"], T].filter(Boolean).join(" ") || void 0
 			})
 		});
 	}
-	if (S === "radio-cards" && e.type === "radio-cards") return /* @__PURE__ */ O(l, {
+	if (S === "radio-cards" && e.type === "radio-cards") return /* @__PURE__ */ D(l, {
 		...C,
-		children: /* @__PURE__ */ O(h, {
+		children: /* @__PURE__ */ D(h, {
 			name: e.key,
-			value: j(n),
+			value: M(n),
 			options: e.options,
 			columns: e.columns,
 			disabled: a,
 			invalid: !!i,
 			className: w,
-			onValueChange: (e) => g(e),
+			onValueChange: (e) => _(e),
 			...e.radioProps,
 			"aria-describedby": [e.radioProps?.["aria-describedby"], T].filter(Boolean).join(" ") || void 0
 		})
 	});
-	if (S === "checkbox-cards" && e.type === "checkbox-cards") return /* @__PURE__ */ O(l, {
+	if (S === "checkbox-cards" && e.type === "checkbox-cards") return /* @__PURE__ */ D(l, {
 		...C,
-		children: /* @__PURE__ */ O(f, {
+		children: /* @__PURE__ */ D(f, {
 			name: e.key,
-			value: M(n),
+			value: N(n),
 			options: e.options,
 			columns: e.columns,
 			disabled: a,
 			invalid: !!i,
 			className: w,
-			onValueChange: (e) => g(e),
+			onValueChange: (e) => _(e),
 			...e.checkboxProps,
 			"aria-describedby": [e.checkboxProps?.["aria-describedby"], T].filter(Boolean).join(" ") || void 0
 		})
 	});
-	if (S === "tags" && e.type === "tags") return /* @__PURE__ */ O(l, {
+	if (S === "tags" && e.type === "tags") return /* @__PURE__ */ D(l, {
 		...C,
-		children: /* @__PURE__ */ O(_, {
+		children: /* @__PURE__ */ D(g, {
 			id: s,
-			value: M(n),
+			value: N(n),
 			recommendations: e.recommendations,
 			maxTags: e.maxTags,
 			disabled: a,
 			invalid: !!i,
 			placeholder: e.placeholder,
 			className: w,
-			onValueChange: (e) => g(e),
+			onValueChange: (e) => _(e),
 			...e.tagsProps,
 			"aria-describedby": [e.tagsProps?.["aria-describedby"], T].filter(Boolean).join(" ") || void 0
 		})
 	});
-	let E = S === "text" ? "text" : S, D = e.type === void 0 || e.type === "text" || e.type === "email" || e.type === "password" || e.type === "url" || e.type === "tel" || e.type === "search" ? e.inputProps : void 0, k = W(e, n, r, v);
-	return /* @__PURE__ */ O(l, {
+	let E = S === "text" ? "text" : S, O = e.type === void 0 || e.type === "text" || e.type === "email" || e.type === "password" || e.type === "url" || e.type === "tel" || e.type === "search" ? e.inputProps : void 0, k = H(e, n, r, v);
+	return /* @__PURE__ */ D(l, {
 		...C,
-		children: /* @__PURE__ */ O(c, {
+		children: /* @__PURE__ */ D(c, {
 			id: s,
 			name: e.key,
 			type: E,
@@ -586,16 +587,16 @@ function X({ field: e, value: n, values: r, error: i, disabled: a, required: o,
 			invalid: !!i,
 			placeholder: e.placeholder,
 			className: w,
-			onChange: (t) => g(G(e, t.target.value, r, v)),
-			...D,
-			"aria-describedby": [D?.["aria-describedby"], T].filter(Boolean).join(" ") || void 0
+			onChange: (t) => _(U(e, t.target.value, r, v)),
+			...O,
+			"aria-describedby": [O?.["aria-describedby"], T].filter(Boolean).join(" ") || void 0
 		})
 	});
 }
-X.displayName = "SchemaFormFieldRenderer";
+q.displayName = "SchemaFormFieldRenderer";
 //#endregion
 //#region src/components/features/schema-form/schema-form.strings.ts
-var oe = {
+var ce = {
 	submitLabel: "Save changes",
 	resetLabel: "Reset",
 	defaultSectionTitle: "General",
@@ -607,48 +608,60 @@ var oe = {
 };
 //#endregion
 //#region src/components/features/schema-form/schema-form.tsx
-function se(e) {
+function le(e) {
 	return e.replace(/[^a-zA-Z0-9_-]/g, "-");
 }
-function ce({ section: e }) {
-	return !e.title && !e.description ? null : /* @__PURE__ */ k(a, {
+var J = [
+	"input:not([type=\"hidden\"])",
+	"textarea",
+	"select",
+	"button",
+	"[tabindex]"
+].map((e) => `${e}:not([disabled]):not([tabindex="-1"]):not([aria-hidden="true"])`).join(", ");
+function ue(e, t) {
+	if (!e) return !1;
+	let n = e.querySelector(`[id="${t}"]`) ?? e.querySelector(J);
+	return n ? (n.focus(), !0) : !1;
+}
+function de({ section: e }) {
+	return !e.title && !e.description ? null : /* @__PURE__ */ O(a, {
 		gap: "normal",
 		className: "schema-form--section-heading",
-		children: [!!e.title && /* @__PURE__ */ O(r, {
-			...i.subsection,
+		children: [!!e.title && /* @__PURE__ */ D(n, {
+			...r.subsection,
 			className: "schema-form--section-title",
 			children: e.title
-		}), !!e.description && /* @__PURE__ */ O(r, {
-			...i.structuralDescription,
+		}), !!e.description && /* @__PURE__ */ D(n, {
+			...r.structuralDescription,
 			className: "schema-form--section-description",
 			children: e.description
 		})]
 	});
 }
-function Z({ schema: n, value: i, defaultValue: c, errors: l, disabled: u = !1, layout: d = "form", columns: f = 2, id: p, name: m, title: h, description: _, headerSlot: v, footerSlot: y, actionsSlot: x, emptySlot: S, showActions: w, submitLabel: E, resetLabel: D, submitDisabled: A = !1, resetDisabled: re = !1, submitting: j = !1, onValueChange: M, onFieldChange: N, onSubmit: P, onReset: F, onError: I, renderField: L, renderSection: R, strings: z, className: U, contentClassName: W, sectionClassName: G, fieldClassName: K }) {
-	let ae = C(), q = p ?? `schema-form-${ae}`, J = e(oe, z), Y = B({
-		fields: n.fields,
+function Y({ schema: r, value: i, defaultValue: c, errors: l, disabled: u = !1, layout: d = "form", columns: f = 2, id: p, name: m, title: h, description: g, headerSlot: _, footerSlot: v, actionsSlot: b, emptySlot: x, showActions: C, submitDisabled: j = !1, resetDisabled: M = !1, submitting: N, hiddenValues: re = "keep", onValueChange: ie, onFieldChange: P, onSubmit: F, onReset: I, onError: L, renderField: R, renderSection: V, strings: H, className: U, contentClassName: W, sectionClassName: G, fieldClassName: oe }) {
+	let se = S(), K = p ?? `schema-form-${se}`, J = e(ce, H), Y = ae({
+		fields: r.fields,
 		value: i,
 		defaultValue: c,
 		errors: l,
-		onValueChange: M,
-		onFieldChange: N,
+		onValueChange: ie,
+		onFieldChange: P,
 		formatRequiredError: J.formatRequiredError,
 		validationError: J.validationError,
-		onError: I
-	}), Z = T(() => ie(n, Y.values, J.defaultSectionTitle, f, I), [
+		onError: L
+	}), X = w(() => ne(r, Y.values, J.defaultSectionTitle, f, L), [
 		f,
 		Y.values,
-		I,
-		n,
+		L,
+		r,
 		J.defaultSectionTitle
-	]), le = Z.some((e) => e.fields.length > 0), ue = {
+	]), fe = X.some((e) => e.fields.length > 0), Z = T(/* @__PURE__ */ new Map()), Q = T(!1), [pe, me] = E(!1), he = N ?? pe, ge = {
 		setFieldValue: Y.setFieldValue,
 		setValues: Y.setValues,
 		reset: Y.reset,
 		validate: Y.validate
-	}, de = w ?? !!(P || F || x), fe = E ?? J.submitLabel, pe = D ?? J.resetLabel, me = (e) => {
-		let n = `${q}-${se(e.key)}`, r = u || ne(e, Y.values, I), i = {
+	}, _e = C ?? !!(F || I || b), ve = (e) => {
+		let n = `${K}-${le(e.key)}`, r = u || te(e, Y.values, L), i = {
 			field: e,
 			value: Y.getFieldValue(e.key),
 			values: Y.values,
@@ -657,136 +670,175 @@ function Z({ schema: n, value: i, defaultValue: c, errors: l, disabled: u = !1,
 			required: !!e.required,
 			fieldId: n,
 			onValueChange: (t) => Y.setFieldValue(e.key, t),
-			onError: I
-		}, a = /* @__PURE__ */ O(X, {
+			onError: L
+		}, a = /* @__PURE__ */ D(q, {
 			...i,
 			strings: J,
 			onParseValidityChange: Y.setFieldParseValidity
 		});
-		return /* @__PURE__ */ O("div", {
-			className: t("schema-form--field", te[e.width ?? "auto"], e.className, K),
-			children: L?.({
+		return /* @__PURE__ */ D("div", {
+			ref: (t) => {
+				t ? Z.current.set(e.key, t) : Z.current.delete(e.key);
+			},
+			className: t("schema-form--field", ee[e.width ?? "auto"], e.className, oe),
+			children: R?.({
 				...i,
 				defaultField: a
 			}) ?? a
 		}, e.key);
-	}, he = (e) => /* @__PURE__ */ O("div", {
-		className: t("schema-form--section-fields", ee[e.columns]),
-		children: e.fields.map(me)
-	}), ge = (e) => {
-		let n = he(e), r = R?.({
+	}, ye = (e) => /* @__PURE__ */ D("div", {
+		className: t("schema-form--section-fields", k[e.columns]),
+		children: e.fields.map(ve)
+	}), be = (e) => {
+		let n = ye(e), r = V?.({
 			section: e,
 			fields: n,
 			values: Y.values
 		});
-		return r == null ? /* @__PURE__ */ k(a, {
-			render: /* @__PURE__ */ O("section", {}),
+		return r == null ? /* @__PURE__ */ O(a, {
+			render: /* @__PURE__ */ D("section", {}),
 			gap: "lg",
 			className: t("schema-form--section", e.className, G),
 			children: [
-				/* @__PURE__ */ O(ce, { section: e }),
+				/* @__PURE__ */ D(de, { section: e }),
 				n,
-				!!e.footerSlot && /* @__PURE__ */ O("div", {
+				!!e.footerSlot && /* @__PURE__ */ D("div", {
 					className: "schema-form--section-footer",
 					children: e.footerSlot
 				})
 			]
-		}, e.id) : /* @__PURE__ */ O(b, { children: r }, e.id);
-	}, _e = (e) => {
-		let n = he(e), r = R?.({
+		}, e.id) : /* @__PURE__ */ D(y, { children: r }, e.id);
+	}, xe = (e) => {
+		let n = ye(e), r = V?.({
 			section: e,
 			fields: n,
 			values: Y.values
 		});
-		return r == null ? /* @__PURE__ */ O(g, {
-			className: t("schema-form--section-card", e.className, G),
+		return r == null ? /* @__PURE__ */ D(o, {
+			surface: "flat",
+			padding: "none",
+			"data-component": "content-block",
+			"data-slot": "content-block",
+			className: t("content-block--component schema-form--section-card", e.className, G),
+			headerClassName: "content-block--header",
+			contentClassName: "content-block--content",
+			footerClassName: "content-block--footer",
 			icon: e.icon,
 			title: e.title,
 			description: e.description,
 			footerSlot: e.footerSlot,
 			children: n
-		}, e.id) : /* @__PURE__ */ O(b, { children: r }, e.id);
-	}, Q = x ?? (de ? /* @__PURE__ */ O(V, {
-		submitLabel: fe,
-		resetLabel: pe,
-		showReset: !!F,
+		}, e.id) : /* @__PURE__ */ D(y, { children: r }, e.id);
+	}, $ = b ?? (_e ? /* @__PURE__ */ D(z, {
+		submitLabel: J.submitLabel,
+		resetLabel: J.resetLabel,
+		showReset: !!I,
 		disabled: u,
-		submitDisabled: A,
-		resetDisabled: re,
-		submitting: j,
+		submitDisabled: j,
+		resetDisabled: M,
+		submitting: he,
 		onReset: () => {
 			let e = Y.reset();
-			F?.(e, ue);
+			I?.(e, ge);
 		}
-	}) : null), $ = S ?? /* @__PURE__ */ O(H, {
+	}) : null), Se = x ?? /* @__PURE__ */ D(B, {
 		title: J.emptyTitle,
 		description: J.emptyDescription
 	});
-	return /* @__PURE__ */ O("form", {
-		id: q,
+	return /* @__PURE__ */ D("form", {
+		id: K,
 		name: m,
 		noValidate: !0,
 		className: t("schema-form--component @container/schema-form", U),
 		onSubmit: async (e) => {
-			if (e.preventDefault(), u || A || j) return;
+			if (e.preventDefault(), u || j || N || Q.current) return;
 			let t = Y.getValues();
-			if (Y.validate()) try {
-				await P?.(t, ue, e);
+			if (!Y.validate()) {
+				let e = new Set(Y.getInvalidKeys());
+				for (let t of X) {
+					let n = t.fields.find((t) => e.has(t.key));
+					if (n) {
+						ue(Z.current.get(n.key), `${K}-${le(n.key)}`);
+						break;
+					}
+				}
+				return;
+			}
+			if (!F) return;
+			let n = t;
+			if (re === "omit") {
+				n = { ...t };
+				for (let e of r.fields) A(e, t, L) && delete n[e.key];
+			}
+			let i;
+			try {
+				i = F(n, ge, e);
 			} catch (e) {
-				I?.(e);
+				L?.(e);
+				return;
+			}
+			if (i && typeof i.then == "function") {
+				Q.current = !0, me(!0);
+				try {
+					await i;
+				} catch (e) {
+					L?.(e);
+				} finally {
+					Q.current = !1, me(!1);
+				}
 			}
 		},
-		children: d === "cards" ? /* @__PURE__ */ k(a, {
+		children: d === "cards" ? /* @__PURE__ */ O(a, {
 			gap: s.subjects,
 			className: t("schema-form--cards", W),
 			children: [
-				!!(h ?? n.title ?? _ ?? n.description ?? v) && /* @__PURE__ */ k(a, {
+				!!(h ?? r.title ?? g ?? r.description ?? _) && /* @__PURE__ */ O(a, {
 					direction: "horizontal",
 					align: "start",
 					justify: "between",
 					gap: "xl",
 					className: "schema-form--header",
-					children: [/* @__PURE__ */ k(a, {
+					children: [/* @__PURE__ */ O(a, {
 						gap: "normal",
 						className: "min-w-0",
-						children: [!!(h ?? n.title) && /* @__PURE__ */ O(r, {
+						children: [!!(h ?? r.title) && /* @__PURE__ */ D(n, {
 							type: "inherit",
 							size: "base",
 							weight: "semibold",
 							className: "schema-form--title",
-							children: h ?? n.title
-						}), !!(_ ?? n.description) && /* @__PURE__ */ O(r, {
+							children: h ?? r.title
+						}), !!(g ?? r.description) && /* @__PURE__ */ D(n, {
 							type: "secondary",
 							className: "schema-form--description",
-							children: _ ?? n.description
+							children: g ?? r.description
 						})]
-					}), v]
+					}), _]
 				}),
-				le ? Z.map(_e) : $,
-				y,
-				Q
+				fe ? X.map(xe) : Se,
+				v,
+				$
 			]
-		}) : /* @__PURE__ */ O(o, {
+		}) : /* @__PURE__ */ D(o, {
 			surface: "flat",
 			padding: "none",
 			className: "schema-form--surface",
 			gap: s.subjects,
 			contentGap: s.subjects,
 			contentClassName: t("schema-form--content", W),
-			title: h ?? n.title,
-			description: _ ?? n.description,
-			headerEnd: v,
-			footerSlot: y || Q ? /* @__PURE__ */ k(a, {
+			title: h ?? r.title,
+			description: g ?? r.description,
+			headerEnd: _,
+			footerSlot: v || $ ? /* @__PURE__ */ O(a, {
 				gap: "lg",
 				className: "schema-form--footer",
-				children: [y, Q]
+				children: [v, $]
 			}) : void 0,
-			children: le ? Z.map(ge) : $
+			children: fe ? X.map(be) : Se
 		})
 	});
 }
-Z.displayName = "SchemaForm";
+Y.displayName = "SchemaForm";
 //#endregion
-export { Z as SchemaForm, V as SchemaFormActions, H as SchemaFormEmpty, X as SchemaFormFieldRenderer, oe as defaultSchemaFormStrings, B as useSchemaForm };
+export { Y as SchemaForm, z as SchemaFormActions, B as SchemaFormEmpty, q as SchemaFormFieldRenderer, ce as defaultSchemaFormStrings, ae as useSchemaForm };
 
 //# sourceMappingURL=schema-form.js.map