ics-ui-kit 0.1.0-alpha.12 → 0.1.0-alpha.13

package/dist/components/form.js

@@ -1,104 +1,105 @@
-var ee = Object.defineProperty, te = Object.defineProperties;
-var re = Object.getOwnPropertyDescriptors;
-var A = Object.getOwnPropertySymbols;
-var T = Object.prototype.hasOwnProperty, D = Object.prototype.propertyIsEnumerable;
-var M = (e, r, t) => r in e ? ee(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, f = (e, r) => {
+var te = Object.defineProperty, re = Object.defineProperties;
+var se = Object.getOwnPropertyDescriptors;
+var E = Object.getOwnPropertySymbols;
+var D = Object.prototype.hasOwnProperty, B = Object.prototype.propertyIsEnumerable;
+var T = (e, r, t) => r in e ? te(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, f = (e, r) => {
   for (var t in r || (r = {}))
-    T.call(r, t) && M(e, t, r[t]);
-  if (A)
-    for (var t of A(r))
-      D.call(r, t) && M(e, t, r[t]);
+    D.call(r, t) && T(e, t, r[t]);
+  if (E)
+    for (var t of E(r))
+      B.call(r, t) && T(e, t, r[t]);
   return e;
-}, x = (e, r) => te(e, re(r));
-var h = (e, r) => {
+}, F = (e, r) => re(e, se(r));
+var b = (e, r) => {
   var t = {};
-  for (var o in e)
-    T.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
-  if (e != null && A)
-    for (var o of A(e))
-      r.indexOf(o) < 0 && D.call(e, o) && (t[o] = e[o]);
+  for (var s in e)
+    D.call(e, s) && r.indexOf(s) < 0 && (t[s] = e[s]);
+  if (e != null && E)
+    for (var s of E(e))
+      r.indexOf(s) < 0 && B.call(e, s) && (t[s] = e[s]);
   return t;
 };
-import { jsx as u, jsxs as N } from "react/jsx-runtime";
-import * as g from "react";
-import d from "react";
-import { S as H } from "../index-DPws5oAn.js";
+import { jsx as d, jsxs as N } from "react/jsx-runtime";
+import * as m from "react";
+import u from "react";
+import { S as H } from "../index-Bj6ZBhqh.js";
 import { c as v } from "../index-CR-odn5-.js";
-import { F as se } from "../FieldLabel-BGxT_RaE.js";
-import { F as oe } from "../Field-COOo8o9f.js";
-import { b as ne, d as ae, e as ie, F as le } from "../FormBody-DM52shm4.js";
-import { a as Ft } from "../FormBody-DM52shm4.js";
-import { D as ce } from "../Description-ZE34bSch.js";
-import { B as P } from "../Button-DhfE69q0.js";
-import { a as de } from "../CheckboxField-CL1Tc7P4.js";
-import { F as ue } from "../FeatureIcon-DUxmZx87.js";
-var fe = (e) => e.type === "checkbox", me = (e) => e instanceof Date, U = (e) => e == null;
-const pe = (e) => typeof e == "object";
-var C = (e) => !U(e) && !Array.isArray(e) && pe(e) && !me(e), ye = (e) => C(e) && e.target ? fe(e.target) ? e.target.checked : e.target.value : e, ge = (e) => e.substring(0, e.search(/\.\d+(\.|$)/)) || e, he = (e, r) => e.has(ge(r)), be = (e) => {
+import { F as oe } from "../FieldLabel-CAbVan3E.js";
+import { F as ne } from "../Field-3XJNFTql.js";
+import { b as ae, d as ie, e as le, F as ce } from "../FormBody-4HptEjhb.js";
+import { a as xt } from "../FormBody-4HptEjhb.js";
+import { D as de } from "../Description-ZE34bSch.js";
+import { B as j } from "../Button-DQtBfU9y.js";
+import { a as ue } from "../CheckboxField-i_-dPpFM.js";
+import { F as fe } from "../FeatureIcon-DUxmZx87.js";
+var me = (e) => e.type === "checkbox", pe = (e) => e instanceof Date, U = (e) => e == null;
+const ye = (e) => typeof e == "object";
+var C = (e) => !U(e) && !Array.isArray(e) && ye(e) && !pe(e), ge = (e) => C(e) && e.target ? me(e.target) ? e.target.checked : e.target.value : e, he = (e) => e.substring(0, e.search(/\.\d+(\.|$)/)) || e, be = (e, r) => e.has(he(r)), Fe = (e) => {
   const r = e.constructor && e.constructor.prototype;
   return C(r) && r.hasOwnProperty("isPrototypeOf");
-}, Fe = typeof window != "undefined" && typeof window.HTMLElement != "undefined" && typeof document != "undefined";
+}, xe = typeof window != "undefined" && typeof window.HTMLElement != "undefined" && typeof document != "undefined";
 function W(e) {
   let r;
-  const t = Array.isArray(e), o = typeof FileList != "undefined" ? e instanceof FileList : !1;
+  const t = Array.isArray(e), s = typeof FileList != "undefined" ? e instanceof FileList : !1;
   if (e instanceof Date)
     r = new Date(e);
   else if (e instanceof Set)
     r = new Set(e);
-  else if (!(Fe && (e instanceof Blob || o)) && (t || C(e)))
-    if (r = t ? [] : {}, !t && !be(e))
+  else if (!(xe && (e instanceof Blob || s)) && (t || C(e)))
+    if (r = t ? [] : {}, !t && !Fe(e))
       r = e;
     else
-      for (const s in e)
-        e.hasOwnProperty(s) && (r[s] = W(e[s]));
+      for (const o in e)
+        e.hasOwnProperty(o) && (r[o] = W(e[o]));
   else
     return e;
   return r;
 }
-var G = (e) => Array.isArray(e) ? e.filter(Boolean) : [], B = (e) => e === void 0, y = (e, r, t) => {
+var z = (e) => Array.isArray(e) ? e.filter(Boolean) : [], R = (e) => e === void 0, p = (e, r, t) => {
   if (!r || !C(e))
     return t;
-  const o = G(r.split(/[,[\].]+?/)).reduce((s, n) => U(s) ? s : s[n], e);
-  return B(o) || o === e ? B(e[r]) ? t : e[r] : o;
-}, O = (e) => typeof e == "boolean", xe = (e) => /^\w*$/.test(e), ve = (e) => G(e.replace(/["|']|\]/g, "").split(/\.|\[/)), j = (e, r, t) => {
-  let o = -1;
-  const s = xe(r) ? [r] : ve(r), n = s.length, i = n - 1;
-  for (; ++o < n; ) {
-    const l = s[o];
-    let a = t;
-    if (o !== i) {
+  const s = z(r.split(/[,[\].]+?/)).reduce((o, n) => U(o) ? o : o[n], e);
+  return R(s) || s === e ? R(e[r]) ? t : e[r] : s;
+}, O = (e) => typeof e == "boolean", ve = (e) => /^\w*$/.test(e), _e = (e) => z(e.replace(/["|']|\]/g, "").split(/\.|\[/)), Q = (e, r, t) => {
+  let s = -1;
+  const o = ve(r) ? [r] : _e(r), n = o.length, a = n - 1;
+  for (; ++s < n; ) {
+    const l = o[s];
+    let i = t;
+    if (s !== a) {
       const c = e[l];
-      a = C(c) || Array.isArray(c) ? c : isNaN(+s[o + 1]) ? {} : [];
+      i = C(c) || Array.isArray(c) ? c : isNaN(+o[s + 1]) ? {} : [];
     }
     if (l === "__proto__" || l === "constructor" || l === "prototype")
       return;
-    e[l] = a, e = e[l];
+    e[l] = i, e = e[l];
   }
 };
-const Q = {
+const P = {
   BLUR: "blur",
   CHANGE: "change"
 }, $ = {
   all: "all"
-}, K = d.createContext(null), V = () => d.useContext(K), _e = (e) => {
-  const o = e, { children: r } = o, t = h(o, ["children"]);
-  return d.createElement(K.Provider, { value: t }, r);
+}, G = u.createContext(null), V = () => u.useContext(G), we = (e) => {
+  const s = e, { children: r } = s, t = b(s, ["children"]);
+  return u.createElement(G.Provider, { value: t }, r);
 };
-var we = (e, r, t, o = !0) => {
-  const s = {
+var Se = (e, r, t, s = !0) => {
+  const o = {
     defaultValues: r._defaultValues
   };
   for (const n in e)
-    Object.defineProperty(s, n, {
+    Object.defineProperty(o, n, {
       get: () => {
-        const i = n;
-        return r._proxyFormState[i] !== $.all && (r._proxyFormState[i] = !o || $.all), t && (t[i] = !0), e[i];
+        const a = n;
+        return r._proxyFormState[a] !== $.all && (r._proxyFormState[a] = !s || $.all), t && (t[a] = !0), e[a];
       }
     });
-  return s;
+  return o;
 };
-function Se(e) {
-  const r = V(), { control: t = r.control, disabled: o, name: s, exact: n } = e || {}, [i, l] = d.useState(t._formState), a = d.useRef({
+const K = typeof window != "undefined" ? m.useLayoutEffect : m.useEffect;
+function Ne(e) {
+  const r = V(), { control: t = r.control, disabled: s, name: o, exact: n } = e || {}, [a, l] = u.useState(t._formState), i = u.useRef({
     isDirty: !1,
     isLoading: !1,
     dirtyFields: !1,
@@ -107,134 +108,132 @@ function Se(e) {
     isValidating: !1,
     isValid: !1,
     errors: !1
-  }), c = d.useRef(s);
-  return c.current = s, d.useEffect(() => t._subscribe({
-    name: c.current,
-    formState: a.current,
+  });
+  return K(() => t._subscribe({
+    name: o,
+    formState: i.current,
     exact: n,
-    callback: (p) => {
-      !o && l(f(f({}, t._formState), p));
+    callback: (c) => {
+      !s && l(f(f({}, t._formState), c));
     }
-  }), [t, o, n]), d.useEffect(() => {
-    a.current.isValid && t._setValid(!0);
-  }, [t]), d.useMemo(() => we(i, t, a.current, !1), [i, t]);
+  }), [o, s, n]), u.useEffect(() => {
+    i.current.isValid && t._setValid(!0);
+  }, [t]), u.useMemo(() => Se(a, t, i.current, !1), [a, t]);
 }
-var Ne = (e) => typeof e == "string", Ce = (e, r, t, o, s) => Ne(e) ? y(t, e, s) : Array.isArray(e) ? e.map((n) => y(t, n)) : t;
-function Ve(e) {
-  const r = V(), { control: t = r.control, name: o, defaultValue: s, disabled: n, exact: i } = e || {}, l = d.useRef(o), a = d.useRef(s);
-  l.current = o, d.useEffect(() => t._subscribe({
-    name: l.current,
+var Ce = (e) => typeof e == "string", Ve = (e, r, t, s, o) => Ce(e) ? p(t, e, o) : Array.isArray(e) ? e.map((n) => p(t, n)) : t;
+function ke(e) {
+  const r = V(), { control: t = r.control, name: s, defaultValue: o, disabled: n, exact: a } = e || {}, l = u.useRef(o), [i, c] = u.useState(t._getWatch(s, l.current));
+  return K(() => t._subscribe({
+    name: s,
     formState: {
       values: !0
     },
-    exact: i,
-    callback: (m) => !n && p(Ce(l.current, t._names, m.values || t._formValues, !1, a.current))
-  }), [t, n, i]);
-  const [c, p] = d.useState(t._getWatch(o, s));
-  return d.useEffect(() => t._removeUnmounted()), c;
+    exact: a,
+    callback: (h) => !n && c(Ve(s, t._names, h.values || t._formValues, !1, l.current))
+  }), [s, t, n, a]), u.useEffect(() => t._removeUnmounted()), i;
 }
-function ke(e) {
-  const r = V(), { name: t, disabled: o, control: s = r.control, shouldUnregister: n } = e, i = he(s._names.array, t), l = Ve({
-    control: s,
+function Ie(e) {
+  const r = V(), { name: t, disabled: s, control: o = r.control, shouldUnregister: n } = e, a = be(o._names.array, t), l = ke({
+    control: o,
     name: t,
-    defaultValue: y(s._formValues, t, y(s._defaultValues, t, e.defaultValue)),
+    defaultValue: p(o._formValues, t, p(o._defaultValues, t, e.defaultValue)),
     exact: !0
-  }), a = Se({
-    control: s,
+  }), i = Ne({
+    control: o,
     name: t,
     exact: !0
-  }), c = d.useRef(e), p = d.useRef(s.register(t, f(x(f({}, e.rules), {
+  }), c = u.useRef(e), h = u.useRef(o.register(t, f(F(f({}, e.rules), {
     value: l
-  }), O(e.disabled) ? { disabled: e.disabled } : {}))), m = d.useMemo(() => Object.defineProperties({}, {
+  }), O(e.disabled) ? { disabled: e.disabled } : {}))), y = u.useMemo(() => Object.defineProperties({}, {
     invalid: {
       enumerable: !0,
-      get: () => !!y(a.errors, t)
+      get: () => !!p(i.errors, t)
     },
     isDirty: {
       enumerable: !0,
-      get: () => !!y(a.dirtyFields, t)
+      get: () => !!p(i.dirtyFields, t)
     },
     isTouched: {
       enumerable: !0,
-      get: () => !!y(a.touchedFields, t)
+      get: () => !!p(i.touchedFields, t)
     },
     isValidating: {
       enumerable: !0,
-      get: () => !!y(a.validatingFields, t)
+      get: () => !!p(i.validatingFields, t)
     },
     error: {
       enumerable: !0,
-      get: () => y(a.errors, t)
+      get: () => p(i.errors, t)
     }
-  }), [a, t]), F = d.useCallback((b) => p.current.onChange({
+  }), [i, t]), x = u.useCallback((g) => h.current.onChange({
     target: {
-      value: ye(b),
+      value: ge(g),
       name: t
     },
-    type: Q.CHANGE
-  }), [t]), _ = d.useCallback(() => p.current.onBlur({
+    type: P.CHANGE
+  }), [t]), _ = u.useCallback(() => h.current.onBlur({
     target: {
-      value: y(s._formValues, t),
+      value: p(o._formValues, t),
       name: t
     },
-    type: Q.BLUR
-  }), [t, s._formValues]), k = d.useCallback((b) => {
-    const S = y(s._fields, t);
-    S && b && (S._f.ref = {
-      focus: () => b.focus(),
-      select: () => b.select(),
-      setCustomValidity: (w) => b.setCustomValidity(w),
-      reportValidity: () => b.reportValidity()
+    type: P.BLUR
+  }), [t, o._formValues]), k = u.useCallback((g) => {
+    const S = p(o._fields, t);
+    S && g && (S._f.ref = {
+      focus: () => g.focus && g.focus(),
+      select: () => g.select && g.select(),
+      setCustomValidity: (w) => g.setCustomValidity(w),
+      reportValidity: () => g.reportValidity()
     });
-  }, [s._fields, t]), I = d.useMemo(() => x(f({
+  }, [o._fields, t]), I = u.useMemo(() => F(f({
     name: t,
     value: l
-  }, O(o) || a.disabled ? { disabled: a.disabled || o } : {}), {
-    onChange: F,
+  }, O(s) || i.disabled ? { disabled: i.disabled || s } : {}), {
+    onChange: x,
     onBlur: _,
     ref: k
-  }), [t, o, a.disabled, F, _, k, l]);
-  return d.useEffect(() => {
-    const b = s._options.shouldUnregister || n;
-    s.register(t, f(f({}, c.current.rules), O(c.current.disabled) ? { disabled: c.current.disabled } : {}));
-    const S = (w, q) => {
-      const E = y(s._fields, w);
-      E && E._f && (E._f.mount = q);
+  }), [t, s, i.disabled, x, _, k, l]);
+  return u.useEffect(() => {
+    const g = o._options.shouldUnregister || n;
+    o.register(t, f(f({}, c.current.rules), O(c.current.disabled) ? { disabled: c.current.disabled } : {}));
+    const S = (w, ee) => {
+      const A = p(o._fields, w);
+      A && A._f && (A._f.mount = ee);
     };
-    if (S(t, !0), b) {
-      const w = W(y(s._options.defaultValues, t));
-      j(s._defaultValues, t, w), B(y(s._formValues, t)) && j(s._formValues, t, w);
+    if (S(t, !0), g) {
+      const w = W(p(o._options.defaultValues, t));
+      Q(o._defaultValues, t, w), R(p(o._formValues, t)) && Q(o._formValues, t, w);
     }
-    return !i && s.register(t), () => {
-      (i ? b && !s._state.action : b) ? s.unregister(t) : S(t, !1);
+    return !a && o.register(t), () => {
+      (a ? g && !o._state.action : g) ? o.unregister(t) : S(t, !1);
     };
-  }, [t, s, i, n]), d.useEffect(() => {
-    s._setDisabledField({
-      disabled: o,
+  }, [t, o, a, n]), u.useEffect(() => {
+    o._setDisabledField({
+      disabled: s,
       name: t
     });
-  }, [o, t, s]), d.useMemo(() => ({
+  }, [s, t, o]), u.useMemo(() => ({
     field: I,
-    formState: a,
-    fieldState: m
-  }), [I, a, m]);
+    formState: i,
+    fieldState: y
+  }), [I, i, y]);
 }
-const Ie = (e) => e.render(ke(e)), Ae = v({
-  base: "rounded-md border border-secondary-border"
-}), pt = (o) => {
-  var s = o, {
+const Ee = (e) => e.render(Ie(e)), Ae = v({
+  base: "rounded-md border border-secondary-border bg-secondary-bg"
+}), yt = (s) => {
+  var o = s, {
     className: e,
     asChild: r
-  } = s, t = h(s, [
+  } = o, t = b(o, [
     "className",
     "asChild"
   ]);
-  return /* @__PURE__ */ u(r ? H : "div", { className: Ae({ className: e }), children: /* @__PURE__ */ u(_e, f({}, t)) });
-}, z = g.createContext({}), Ee = (r) => {
-  var e = h(r, []);
-  return /* @__PURE__ */ u(z.Provider, { value: { name: e.name }, children: /* @__PURE__ */ u(Ie, f({}, e)) });
-}, L = () => {
-  const e = g.useContext(z), r = g.useContext(J), { getFieldState: t, formState: o } = V(), s = t(e.name, o);
+  return /* @__PURE__ */ d(r ? H : "div", { className: Ae({ className: e }), children: /* @__PURE__ */ d(we, f({}, t)) });
+}, J = m.createContext({}), Oe = (r) => {
+  var e = b(r, []);
+  return /* @__PURE__ */ d(J.Provider, { value: { name: e.name }, children: /* @__PURE__ */ d(Ee, f({}, e)) });
+}, M = () => {
+  const e = m.useContext(J), r = m.useContext(X), { getFieldState: t, formState: s } = V(), o = t(e.name, s);
   if (!e)
     throw new Error("useFormField should be used within <FormField>");
   const { id: n } = r;
@@ -244,145 +243,145 @@ const Ie = (e) => e.render(ke(e)), Ae = v({
     formItemId: `${n}-form-item`,
     formDescriptionId: `${n}-form-item-description`,
     formMessageId: `${n}-form-item-message`
-  }, s);
-}, J = g.createContext({}), Oe = v({
+  }, o);
+}, X = m.createContext({}), Le = v({
   base: "space-y-2"
-}), X = g.forwardRef(
-  (o, t) => {
-    var s = o, { className: e } = s, r = h(s, ["className"]);
-    const n = g.useId();
-    return /* @__PURE__ */ u(J.Provider, { value: { id: n }, children: /* @__PURE__ */ u("div", f({ ref: t, className: Oe({ className: e }) }, r)) });
+}), Y = m.forwardRef(
+  (s, t) => {
+    var o = s, { className: e } = o, r = b(o, ["className"]);
+    const n = m.useId();
+    return /* @__PURE__ */ d(X.Provider, { value: { id: n }, children: /* @__PURE__ */ d("div", f({ ref: t, className: Le({ className: e }) }, r)) });
   }
 );
-X.displayName = "FormItem";
-const Re = g.forwardRef(
-  (s, o) => {
-    var n = s, { className: e, required: r } = n, t = h(n, ["className", "required"]);
-    const { formItemId: i } = L();
-    return /* @__PURE__ */ u(se, f({ required: r, ref: o, className: e, htmlFor: i }, t));
+Y.displayName = "FormItem";
+const Re = m.forwardRef(
+  (o, s) => {
+    var n = o, { className: e, required: r } = n, t = b(n, ["className", "required"]);
+    const { formItemId: a } = M();
+    return /* @__PURE__ */ d(oe, f({ required: r, ref: s, className: e, htmlFor: a }, t));
   }
 );
 Re.displayName = "FormLabel";
-const Y = g.forwardRef(
+const Z = m.forwardRef(
   (t, r) => {
-    var e = h(t, []);
-    const { error: o, formItemId: s, formDescriptionId: n, formMessageId: i } = L();
-    return /* @__PURE__ */ u(
+    var e = b(t, []);
+    const { error: s, formItemId: o, formDescriptionId: n, formMessageId: a } = M();
+    return /* @__PURE__ */ d(
       H,
       f({
         ref: r,
-        id: s,
-        "aria-describedby": o ? `${n} ${i}` : `${n}`,
-        "aria-invalid": !!o
+        id: o,
+        "aria-describedby": s ? `${n} ${a}` : `${n}`,
+        "aria-invalid": !!s
       }, e)
     );
   }
 );
-Y.displayName = "FormControl";
-const Be = v({
+Z.displayName = "FormControl";
+const Me = v({
   base: "text-[0.8rem] font-medium text-destructive"
-}), Le = g.forwardRef(
-  (s, o) => {
-    var n = s, { className: e, children: r } = n, t = h(n, ["className", "children"]);
+}), Te = m.forwardRef(
+  (o, s) => {
+    var n = o, { className: e, children: r } = n, t = b(n, ["className", "children"]);
     var c;
-    const { error: i, formMessageId: l } = L(), a = i ? String((c = i == null ? void 0 : i.message) != null ? c : "") : r;
-    return a ? /* @__PURE__ */ u("p", x(f({ ref: o, id: l, className: Be({ className: e }) }, t), { children: a })) : null;
+    const { error: a, formMessageId: l } = M(), i = a ? String((c = a == null ? void 0 : a.message) != null ? c : "") : r;
+    return i ? /* @__PURE__ */ d("p", F(f({ ref: s, id: l, className: Me({ className: e }) }, t), { children: i })) : null;
   }
 );
-Le.displayName = "FormMessage";
-const Me = v({
+Te.displayName = "FormMessage";
+const De = v({
   base: "flex-col gap-2 lg:flex-row lg:gap-4",
   slots: {
     label: "h-4 lg:h-9"
   }
 });
-function yt({
+function gt({
   name: e,
   title: r,
   description: t,
-  control: o,
-  required: s,
+  control: s,
+  required: o,
   className: n,
-  labelClassName: i,
+  labelClassName: a,
   readonly: l
 }) {
-  const a = V(), c = Me();
-  return /* @__PURE__ */ u(
-    Ee,
+  const i = V(), c = De();
+  return /* @__PURE__ */ d(
+    Oe,
     {
-      control: a.control,
+      control: i.control,
       name: e,
-      render: ({ field: p, fieldState: m, formState: F }) => {
+      render: ({ field: h, fieldState: y, formState: x }) => {
         var _;
-        return /* @__PURE__ */ u(X, { children: /* @__PURE__ */ u(
-          oe,
+        return /* @__PURE__ */ d(Y, { children: /* @__PURE__ */ d(
+          ne,
           {
             title: r,
             description: t,
-            required: s,
-            error: (_ = m.error) == null ? void 0 : _.message,
-            labelClassName: c.label({ class: i }),
+            required: o,
+            error: (_ = y.error) == null ? void 0 : _.message,
+            labelClassName: c.label({ class: a }),
             readonly: l,
             className: c.base({ className: n }),
-            control: ({ id: k, readonly: I }) => /* @__PURE__ */ u(Y, { id: k, children: o({ field: p, fieldState: m, formState: F, readonly: I }) })
+            control: ({ id: k, readonly: I }) => /* @__PURE__ */ d(Z, { id: k, children: s({ field: h, fieldState: y, formState: x, readonly: I }) })
           }
         ) });
       }
     }
   );
 }
-const Te = v({
+const Be = v({
   base: "text-md font-semibold"
 });
-function gt({ children: e, className: r, as: t = "h3" }) {
-  return /* @__PURE__ */ u(t, { className: Te({ className: r }), children: e });
+function ht({ children: e, className: r, as: t = "h3" }) {
+  return /* @__PURE__ */ d(t, { className: Be({ className: r }), children: e });
 }
-const De = v({
+const je = v({
   slots: {
     container: "flex flex-row justify-between gap-3 lg:gap-4",
     textWrapper: "flex flex-col gap-0.5",
     header: "text-base font-semibold text-primary-fg"
   }
-}), Pe = d.forwardRef(
-  (i, n) => {
-    var l = i, { className: e, children: r, description: t, title: o } = l, s = h(l, ["className", "children", "description", "title"]);
-    const a = De();
-    return /* @__PURE__ */ N("div", x(f({ className: a.container({ className: e }), ref: n }, s), { children: [
-      /* @__PURE__ */ N("div", { className: a.textWrapper(), children: [
-        /* @__PURE__ */ u("h3", { className: a.header(), children: o }),
-        /* @__PURE__ */ u(ce, { children: t })
+}), Qe = u.forwardRef(
+  (a, n) => {
+    var l = a, { className: e, children: r, description: t, title: s } = l, o = b(l, ["className", "children", "description", "title"]);
+    const i = je();
+    return /* @__PURE__ */ N("div", F(f({ className: i.container({ className: e }), ref: n }, o), { children: [
+      /* @__PURE__ */ N("div", { className: i.textWrapper(), children: [
+        /* @__PURE__ */ d("h3", { className: i.header(), children: s }),
+        /* @__PURE__ */ d(de, { children: t })
       ] }),
       r
     ] }));
   }
 );
-Pe.displayName = "FormSection";
-function je(e, r) {
+Qe.displayName = "FormSection";
+function Pe(e, r) {
   if (r === e) return !1;
-  const t = Object.values(r), o = Object.values(e);
-  if (t.length !== o.length || t.some((n, i) => n !== o[i])) return !0;
-  const s = Object.keys(e);
-  return Object.keys(r).some((n, i) => n !== s[i]);
+  const t = Object.values(r), s = Object.values(e);
+  if (t.length !== s.length || t.some((n, a) => n !== s[a])) return !0;
+  const o = Object.keys(e);
+  return Object.keys(r).some((n, a) => n !== o[a]);
 }
-function Qe(e, r) {
+function $e(e, r) {
   return e.matches[r] = !1, e.mediaQueries[r] = {}, e;
 }
-function Z(e) {
+function q(e) {
   const r = Object.keys(e);
-  return typeof window == "undefined" ? r.reduce(Qe, {
+  return typeof window == "undefined" ? r.reduce($e, {
     mediaQueries: {},
     matches: {}
-  }) : r.reduce((t, o) => {
-    const s = window.matchMedia(e[o]);
-    return t.mediaQueries[o] = s, t.matches[o] = s.matches, t;
+  }) : r.reduce((t, s) => {
+    const o = window.matchMedia(e[s]);
+    return t.mediaQueries[s] = o, t.matches[s] = o.matches, t;
   }, {
     mediaQueries: {},
     matches: {}
   });
 }
-function $e(e, r) {
-  function t(o, s) {
-    return o[s] = e.mediaQueries[s].matches, o;
+function He(e, r) {
+  function t(s, o) {
+    return s[o] = e.mediaQueries[o].matches, s;
   }
   switch (r.type) {
     case "updateMatches":
@@ -391,80 +390,82 @@ function $e(e, r) {
         mediaQueries: e.mediaQueries
       };
     case "setQueries":
-      return Z(r.queries);
+      return q(r.queries);
   }
 }
-function He(e) {
-  const r = g.useRef(e), [t, o] = g.useReducer($e, e, Z);
-  g.useEffect(() => {
-    je(e, r.current) && (o({
+function Ue(e) {
+  const r = m.useRef(e), [t, s] = m.useReducer(He, e, q);
+  m.useEffect(() => {
+    Pe(e, r.current) && (s({
       type: "setQueries",
       queries: e
     }), r.current = e);
   }, [e]);
-  function s() {
-    return o({
+  function o() {
+    return s({
       type: "updateMatches"
     });
   }
-  function n(a) {
-    const c = s;
-    return typeof a.addListener != "undefined" ? a.addListener(c) : a.addEventListener("change", c), c;
+  function n(i) {
+    const c = o;
+    return typeof i.addListener != "undefined" ? i.addListener(c) : i.addEventListener("change", c), c;
   }
-  g.useEffect(() => {
-    const a = Object.values(t.mediaQueries), c = a.map(n);
-    function p(m, F) {
-      typeof m.addListener != "undefined" ? m.removeListener(c[F]) : m.removeEventListener("change", c[F]);
+  m.useEffect(() => {
+    const i = Object.values(t.mediaQueries), c = i.map(n);
+    function h(y, x) {
+      typeof y.addListener != "undefined" ? y.removeListener(c[x]) : y.removeEventListener("change", c[x]);
     }
     return () => {
-      a.forEach(p);
+      i.forEach(h);
     };
   }, [t.mediaQueries]);
   const {
-    matches: i
-  } = t, l = g.useMemo(() => Object.values(i), [i]);
+    matches: a
+  } = t, l = m.useMemo(() => Object.values(a), [a]);
   return {
-    matches: i,
+    matches: a,
     matchesAny: l.some(Boolean),
     matchesAll: l.length > 0 && l.every(Boolean)
   };
 }
-function Ue(e) {
-  return He(We(e)).matchesAll;
-}
-const R = {};
 function We(e) {
-  return R[e] === void 0 && (R[e] = {
+  return Ue(ze(e)).matchesAll;
+}
+const L = {};
+function ze(e) {
+  return L[e] === void 0 && (L[e] = {
     default: e
-  }), R[e];
+  }), L[e];
 }
 const Ge = {
   lg: "1024px"
-}, Ke = () => Ue(`(min-width: ${Ge.lg})`), ze = () => !Ke(), Je = v({
+}, Ke = () => We(`(min-width: ${Ge.lg})`), Je = () => !Ke(), Xe = v({
   slots: {
     container: "flex w-full flex-col gap-3 lg:flex-row",
-    startBlock: "flex items-center",
+    startBlock: "flex items-center py-1 lg:py-2.5",
     endBlock: "ml-auto flex w-full flex-col gap-3 lg:w-auto lg:flex-row"
   }
-}), Xe = d.forwardRef(
+}), Ye = u.forwardRef(
   ({
     className: e,
     primaryButton: r,
     secondaryButton: t,
-    checkboxLabel: o,
-    checkboxProps: s,
+    checkboxLabel: s,
+    checkboxProps: o,
     primaryButtonProps: n,
-    secondaryButtonProps: i
+    secondaryButtonProps: a
   }, l) => {
-    const a = ze(), { container: c, startBlock: p, endBlock: m } = Je(), F = r && /* @__PURE__ */ u(P, x(f({ variant: "primary" }, n), { children: r }), "primary-button"), _ = t && /* @__PURE__ */ u(P, x(f({ variant: "outline" }, i), { children: t }), "secondary-button");
-    return /* @__PURE__ */ u(ne, { className: e, ref: l, children: /* @__PURE__ */ N("div", { className: c(), children: [
-      o && /* @__PURE__ */ u("div", { className: p(), children: /* @__PURE__ */ u(de, f({ label: o }, s)) }),
-      /* @__PURE__ */ u("div", { className: m(), children: a ? [F, _] : [_, F] })
+    const i = Je(), { container: c, startBlock: h, endBlock: y } = Xe();
+    i && (n = F(f({}, n), { size: "xl" }), a = F(f({}, a), { size: "xl" }));
+    const x = r && /* @__PURE__ */ d(j, F(f({ variant: "primary" }, n), { children: r }), "primary-button"), _ = t && /* @__PURE__ */ d(j, F(f({ variant: "outline" }, a), { children: t }), "secondary-button");
+    return /* @__PURE__ */ d(ae, { className: e, ref: l, children: /* @__PURE__ */ N("div", { className: c(), children: [
+      s && /* @__PURE__ */ d("div", { className: h(), children: /* @__PURE__ */ d(ue, f({ label: s }, o)) }),
+      /* @__PURE__ */ d("div", { className: y(), children: i ? [x, _] : [_, x] })
     ] }) });
   }
 );
-Xe.displayName = "FormFooterTemplate";
-const Ye = v({
+Ye.displayName = "FormFooterTemplate";
+const Ze = v({
   slots: {
     header: "flex items-start gap-4",
     contentWrapper: "flex flex-col",
@@ -476,69 +477,69 @@ const Ye = v({
         header: "flex-row pr-9"
       },
       left: {
-        header: "flex-col gap-3 lg:gap-4"
+        header: "flex-col gap-2 lg:gap-3"
       },
       center: {
-        header: "flex-col items-center gap-3 text-center lg:gap-4"
+        header: "flex-col items-center gap-2 text-center lg:gap-3"
       }
     }
   },
   defaultVariants: {
     alignment: "compact"
   }
-}), Ze = d.forwardRef(
-  (l, i) => {
-    var a = l, { className: e, icon: r, title: t, alignment: o, description: s } = a, n = h(a, ["className", "icon", "title", "alignment", "description"]);
-    const { header: c, contentWrapper: p, icon: m } = Ye({ alignment: o });
-    return /* @__PURE__ */ N(le, x(f({ ref: i, className: c({ class: e }) }, n), { children: [
-      /* @__PURE__ */ u(ue, { size: "lg", type: "primary", icon: r, className: m() }),
-      /* @__PURE__ */ N("div", { className: p(), children: [
+}), qe = u.forwardRef(
+  (l, a) => {
+    var i = l, { className: e, icon: r, title: t, alignment: s, description: o } = i, n = b(i, ["className", "icon", "title", "alignment", "description"]);
+    const { header: c, contentWrapper: h, icon: y } = Ze({ alignment: s });
+    return /* @__PURE__ */ N(ce, F(f({ ref: a, className: c({ class: e }) }, n), { children: [
+      /* @__PURE__ */ d(fe, { size: "lg", type: "primary", icon: r, className: y() }),
+      /* @__PURE__ */ N("div", { className: h(), children: [
         t,
-        s
+        o
       ] })
     ] }));
   }
-), qe = d.forwardRef(
-  (s, o) => {
-    var n = s, { title: e, description: r } = n, t = h(n, ["title", "description"]);
-    return /* @__PURE__ */ u(
-      Ze,
+), et = u.forwardRef(
+  (o, s) => {
+    var n = o, { title: e, description: r } = n, t = b(n, ["title", "description"]);
+    return /* @__PURE__ */ d(
+      qe,
       f({
-        title: /* @__PURE__ */ u(ie, { children: e }),
-        description: /* @__PURE__ */ u(ae, { children: r }),
-        ref: o
+        title: /* @__PURE__ */ d(le, { children: e }),
+        description: /* @__PURE__ */ d(ie, { children: r }),
+        ref: s
       }, t)
     );
   }
 );
-qe.displayName = "FormHeaderTemplate";
-const et = v({
+et.displayName = "FormHeaderTemplate";
+const tt = v({
   base: "space-y-5 lg:space-y-4"
-}), tt = d.forwardRef(
-  (s, o) => {
-    var n = s, { className: e, children: r } = n, t = h(n, ["className", "children"]);
-    return /* @__PURE__ */ u("div", x(f({ ref: o, className: et({ className: e }) }, t), { children: r }));
+}), rt = u.forwardRef(
+  (o, s) => {
+    var n = o, { className: e, children: r } = n, t = b(n, ["className", "children"]);
+    return /* @__PURE__ */ d("div", F(f({ ref: s, className: tt({ className: e }) }, t), { children: r }));
   }
 );
-tt.displayName = "FormStack";
+rt.displayName = "FormStack";
 export {
-  pt as Form,
-  Ft as FormBody,
-  Y as FormControl,
-  ae as FormDescription,
-  yt as FormField,
-  Ee as FormFieldControl,
-  ne as FormFooter,
-  Xe as FormFooterTemplate,
-  le as FormHeader,
-  qe as FormHeaderTemplate,
-  X as FormItem,
+  yt as Form,
+  xt as FormBody,
+  Z as FormControl,
+  ie as FormDescription,
+  gt as FormField,
+  Oe as FormFieldControl,
+  ae as FormFooter,
+  Ye as FormFooterTemplate,
+  ce as FormHeader,
+  et as FormHeaderTemplate,
+  Y as FormItem,
   Re as FormLabel,
-  Le as FormMessage,
-  Pe as FormSection,
-  gt as FormSectionTitle,
-  tt as FormStack,
-  ie as FormTitle,
-  L as useFormField
+  Te as FormMessage,
+  Qe as FormSection,
+  ht as FormSectionTitle,
+  rt as FormStack,
+  le as FormTitle,
+  M as useFormField
 };
 //# sourceMappingURL=form.js.map