ics-ui-kit 0.1.0-alpha.8 → 0.1.0

package/dist/components/form.js

@@ -1,419 +1,69 @@
-var Y = Object.defineProperty, Z = Object.defineProperties;
-var ee = Object.getOwnPropertyDescriptors;
-var N = Object.getOwnPropertySymbols;
-var P = Object.prototype.hasOwnProperty, O = Object.prototype.propertyIsEnumerable;
-var M = (e, r, t) => r in e ? Y(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, f = (e, r) => {
-  for (var t in r || (r = {}))
-    P.call(r, t) && M(e, t, r[t]);
-  if (N)
-    for (var t of N(r))
-      O.call(r, t) && M(e, t, r[t]);
-  return e;
-}, D = (e, r) => Z(e, ee(r));
-var F = (e, r) => {
-  var t = {};
-  for (var o in e)
-    P.call(e, o) && r.indexOf(o) < 0 && (t[o] = e[o]);
-  if (e != null && N)
-    for (var o of N(e))
-      r.indexOf(o) < 0 && O.call(e, o) && (t[o] = e[o]);
-  return t;
-};
-import { jsx as d, jsxs as A } from "react/jsx-runtime";
-import * as y from "react";
-import i, { useId as te } from "react";
-import { S as re } from "../index-DPws5oAn.js";
-import { c as w } from "../index-CR-odn5-.js";
-import { F as B } from "../FieldLabel--NVcQQhJ.js";
-import { F as se } from "../FieldDescription-DCE2z2nv.js";
-import { c as oe } from "../utils-2yE78m5l.js";
-import { I as ne } from "../Icon-CSPBHL_x.js";
-import { T as ae, a as le, b as ie, c as ce } from "../tooltip-CYQMPCEj.js";
-import { c as ue } from "../createLucideIcon-DgrNxRV5.js";
-/**
- * @license lucide-react v0.460.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const de = ue("CircleHelp", [
-  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
-  ["path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3", key: "1u773s" }],
-  ["path", { d: "M12 17h.01", key: "p32p05" }]
-]);
-var fe = (e) => e.type === "checkbox", me = (e) => e instanceof Date, U = (e) => e == null;
-const pe = (e) => typeof e == "object";
-var S = (e) => !U(e) && !Array.isArray(e) && pe(e) && !me(e), ye = (e) => S(e) && e.target ? fe(e.target) ? e.target.checked : e.target.value : e, ge = (e) => e.substring(0, e.search(/\.\d+(\.|$)/)) || e, be = (e, r) => e.has(ge(r)), he = (e) => {
-  const r = e.constructor && e.constructor.prototype;
-  return S(r) && r.hasOwnProperty("isPrototypeOf");
-}, Fe = typeof window != "undefined" && typeof window.HTMLElement != "undefined" && typeof document != "undefined";
-function H(e) {
-  let r;
-  const t = Array.isArray(e), o = 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 || S(e)))
-    if (r = t ? [] : {}, !t && !he(e))
-      r = e;
-    else
-      for (const s in e)
-        e.hasOwnProperty(s) && (r[s] = H(e[s]));
-  else
-    return e;
-  return r;
+import { F as i } from "../FormStack-DvlFQQiP.js";
+import { a as R, d as w, g as C, f as h, b as _, c as j, e as k, u as I } from "../FormStack-DvlFQQiP.js";
+import { jsx as t } from "react/jsx-runtime";
+import { T as a } from "../index-BVqs-uqP.js";
+import { F as M, d as q, a as z, b as A, e as E } from "../FormHeader--F6b2aRk.js";
+import { D as l } from "../Divider-DPW5ZhZ8.js";
+import s from "react";
+import { B as d } from "../Button-Dg89xRSi.js";
+import { F as J, a as K } from "../FormFooterTemplate-BPspyDbr.js";
+const F = a({
+  base: "text-md font-semibold"
+});
+function T({ children: o, className: e, as: r = "h3" }) {
+  return /* @__PURE__ */ t(r, { className: F({ className: e }), children: o });
 }
-var j = (e) => Array.isArray(e) ? e.filter(Boolean) : [], E = (e) => e === void 0, m = (e, r, t) => {
-  if (!r || !S(e))
-    return t;
-  const o = j(r.split(/[,[\].]+?/)).reduce((s, n) => U(s) ? s : s[n], e);
-  return E(o) || o === e ? E(e[r]) ? t : e[r] : o;
-}, R = (e) => typeof e == "boolean", xe = (e) => /^\w*$/.test(e), _e = (e) => j(e.replace(/["|']|\]/g, "").split(/\.|\[/)), L = (e, r, t) => {
-  let o = -1;
-  const s = xe(r) ? [r] : _e(r), n = s.length, a = n - 1;
-  for (; ++o < n; ) {
-    const c = s[o];
-    let l = t;
-    if (o !== a) {
-      const u = e[c];
-      l = S(u) || Array.isArray(u) ? u : isNaN(+s[o + 1]) ? {} : [];
-    }
-    if (c === "__proto__" || c === "constructor" || c === "prototype")
-      return;
-    e[c] = l, e = e[c];
+const c = a({
+  base: "mb-4 mt-4 lg:mb-3.5 lg:mt-5"
+}), f = s.forwardRef(({ className: o, ...e }, r) => /* @__PURE__ */ t(l, { ref: r, className: c({ className: o }), ...e }));
+f.displayName = "FormDivider";
+const p = a({
+  slots: {
+    button: "h-full rounded-none p-0",
+    container: "leading-none"
   }
-};
-const W = {
-  BLUR: "blur",
-  CHANGE: "change"
-}, $ = {
-  all: "all"
-}, z = i.createContext(null), V = () => i.useContext(z), ve = (e) => {
-  const o = e, { children: r } = o, t = F(o, ["children"]);
-  return i.createElement(z.Provider, { value: t }, r);
-};
-var Ce = (e, r, t, o = !0) => {
-  const s = {
-    defaultValues: r._defaultValues
-  };
-  for (const n in e)
-    Object.defineProperty(s, n, {
-      get: () => {
-        const a = n;
-        return r._proxyFormState[a] !== $.all && (r._proxyFormState[a] = !o || $.all), t && (t[a] = !0), e[a];
+}), u = s.forwardRef(
+  ({ className: o, children: e, ...r }, m) => {
+    const n = p();
+    return /* @__PURE__ */ t(
+      d,
+      {
+        ref: m,
+        containerClassName: n.container(),
+        className: n.button({ class: o }),
+        ...r,
+        children: e
       }
-    });
-  return s;
-};
-function we(e) {
-  const r = V(), { control: t = r.control, disabled: o, name: s, exact: n } = e || {}, [a, c] = i.useState(t._formState), l = i.useRef({
-    isDirty: !1,
-    isLoading: !1,
-    dirtyFields: !1,
-    touchedFields: !1,
-    validatingFields: !1,
-    isValidating: !1,
-    isValid: !1,
-    errors: !1
-  }), u = i.useRef(s);
-  return u.current = s, i.useEffect(() => t._subscribe({
-    name: u.current,
-    formState: l.current,
-    exact: n,
-    callback: (g) => {
-      !o && c(f(f({}, t._formState), g));
-    }
-  }), [t, o, n]), i.useEffect(() => {
-    l.current.isValid && t._setValid(!0);
-  }, [t]), i.useMemo(() => Ce(a, t, l.current, !1), [a, t]);
-}
-var Ie = (e) => typeof e == "string", Se = (e, r, t, o, s) => Ie(e) ? m(t, e, s) : Array.isArray(e) ? e.map((n) => m(t, n)) : t;
-function Ve(e) {
-  const r = V(), { control: t = r.control, name: o, defaultValue: s, disabled: n, exact: a } = e || {}, c = i.useRef(o), l = i.useRef(s);
-  c.current = o, i.useEffect(() => t._subscribe({
-    name: c.current,
-    formState: {
-      values: !0
-    },
-    exact: a,
-    callback: (b) => !n && g(Se(c.current, t._names, b.values || t._formValues, !1, l.current))
-  }), [t, n, a]);
-  const [u, g] = i.useState(t._getWatch(o, s));
-  return i.useEffect(() => t._removeUnmounted()), u;
-}
-function Ne(e) {
-  const r = V(), { name: t, disabled: o, control: s = r.control, shouldUnregister: n } = e, a = be(s._names.array, t), c = Ve({
-    control: s,
-    name: t,
-    defaultValue: m(s._formValues, t, m(s._defaultValues, t, e.defaultValue)),
-    exact: !0
-  }), l = we({
-    control: s,
-    name: t,
-    exact: !0
-  }), u = i.useRef(e), g = i.useRef(s.register(t, f(D(f({}, e.rules), {
-    value: c
-  }), R(e.disabled) ? { disabled: e.disabled } : {}))), b = i.useMemo(() => Object.defineProperties({}, {
-    invalid: {
-      enumerable: !0,
-      get: () => !!m(l.errors, t)
-    },
-    isDirty: {
-      enumerable: !0,
-      get: () => !!m(l.dirtyFields, t)
-    },
-    isTouched: {
-      enumerable: !0,
-      get: () => !!m(l.touchedFields, t)
-    },
-    isValidating: {
-      enumerable: !0,
-      get: () => !!m(l.validatingFields, t)
-    },
-    error: {
-      enumerable: !0,
-      get: () => m(l.errors, t)
-    }
-  }), [l, t]), h = i.useCallback((p) => g.current.onChange({
-    target: {
-      value: ye(p),
-      name: t
-    },
-    type: W.CHANGE
-  }), [t]), x = i.useCallback(() => g.current.onBlur({
-    target: {
-      value: m(s._formValues, t),
-      name: t
-    },
-    type: W.BLUR
-  }), [t, s._formValues]), _ = i.useCallback((p) => {
-    const I = m(s._fields, t);
-    I && p && (I._f.ref = {
-      focus: () => p.focus(),
-      select: () => p.select(),
-      setCustomValidity: (C) => p.setCustomValidity(C),
-      reportValidity: () => p.reportValidity()
-    });
-  }, [s._fields, t]), v = i.useMemo(() => D(f({
-    name: t,
-    value: c
-  }, R(o) || l.disabled ? { disabled: l.disabled || o } : {}), {
-    onChange: h,
-    onBlur: x,
-    ref: _
-  }), [t, o, l.disabled, h, x, _, c]);
-  return i.useEffect(() => {
-    const p = s._options.shouldUnregister || n;
-    s.register(t, f(f({}, u.current.rules), R(u.current.disabled) ? { disabled: u.current.disabled } : {}));
-    const I = (C, X) => {
-      const k = m(s._fields, C);
-      k && k._f && (k._f.mount = X);
-    };
-    if (I(t, !0), p) {
-      const C = H(m(s._options.defaultValues, t));
-      L(s._defaultValues, t, C), E(m(s._formValues, t)) && L(s._formValues, t, C);
-    }
-    return !a && s.register(t), () => {
-      (a ? p && !s._state.action : p) ? s.unregister(t) : I(t, !1);
-    };
-  }, [t, s, a, n]), i.useEffect(() => {
-    s._setDisabledField({
-      disabled: o,
-      name: t
-    });
-  }, [o, t, s]), i.useMemo(() => ({
-    field: v,
-    formState: l,
-    fieldState: b
-  }), [v, l, b]);
-}
-const De = (e) => e.render(Ne(e)), Ye = ve, G = y.createContext({}), Ae = (r) => {
-  var e = F(r, []);
-  return /* @__PURE__ */ d(G.Provider, { value: { name: e.name }, children: /* @__PURE__ */ d(De, f({}, e)) });
-}, T = () => {
-  const e = y.useContext(G), r = y.useContext(q), { getFieldState: t, formState: o } = V(), s = t(e.name, o);
-  if (!e)
-    throw new Error("useFormField should be used within <FormField>");
-  const { id: n } = r;
-  return f({
-    id: n,
-    name: e.name,
-    formItemId: `${n}-form-item`,
-    formDescriptionId: `${n}-form-item-description`,
-    formMessageId: `${n}-form-item-message`
-  }, s);
-}, q = y.createContext({}), Te = w({
-  base: "space-y-2"
-}), K = y.forwardRef(
-  (o, t) => {
-    var s = o, { className: e } = s, r = F(s, ["className"]);
-    const n = y.useId();
-    return /* @__PURE__ */ d(q.Provider, { value: { id: n }, children: /* @__PURE__ */ d("div", f({ ref: t, className: Te({ className: e }) }, r)) });
-  }
-);
-K.displayName = "FormItem";
-const ke = y.forwardRef(
-  (s, o) => {
-    var n = s, { className: e, required: r } = n, t = F(n, ["className", "required"]);
-    const { formItemId: a } = T();
-    return /* @__PURE__ */ d(B, f({ required: r, ref: o, className: e, htmlFor: a }, t));
-  }
-);
-ke.displayName = "FormLabel";
-const J = y.forwardRef(
-  (t, r) => {
-    var e = F(t, []);
-    const { error: o, formItemId: s, formDescriptionId: n, formMessageId: a } = T();
-    return /* @__PURE__ */ d(
-      re,
-      f({
-        ref: r,
-        id: s,
-        "aria-describedby": o ? `${n} ${a}` : `${n}`,
-        "aria-invalid": !!o
-      }, e)
     );
   }
 );
-J.displayName = "FormControl";
-const Re = w({
-  base: "text-xs text-muted"
-}), Ee = y.forwardRef(
-  (o, t) => {
-    var s = o, { className: e } = s, r = F(s, ["className"]);
-    const { formDescriptionId: n } = T();
-    return /* @__PURE__ */ d("p", f({ ref: t, id: n, className: Re({ className: e }) }, r));
-  }
-);
-Ee.displayName = "FormDescription";
-const Me = w({
-  base: "text-[0.8rem] font-medium text-destructive"
-}), Pe = y.forwardRef(
-  (s, o) => {
-    var n = s, { className: e, children: r } = n, t = F(n, ["className", "children"]);
-    var u;
-    const { error: a, formMessageId: c } = T(), l = a ? String((u = a == null ? void 0 : a.message) != null ? u : "") : r;
-    return l ? /* @__PURE__ */ d("p", D(f({ ref: o, id: c, className: Me({ className: e }) }, t), { children: l })) : null;
-  }
-);
-Pe.displayName = "FormMessage";
-const Oe = ({ content: e, icon: r, className: t }) => /* @__PURE__ */ d(ae, { children: /* @__PURE__ */ A(le, { children: [
-  /* @__PURE__ */ d(ie, { asChild: !0, children: /* @__PURE__ */ d("span", { className: t, children: /* @__PURE__ */ d(ne, { size: "sm", icon: r }) }) }),
-  /* @__PURE__ */ d(ce, { children: e })
-] }) }), Le = w({
-  slots: {
-    wrapper: "flex w-full space-y-0",
-    labelWrapper: "flex items-center gap-1",
-    controlWrapper: "flex w-full flex-1 flex-col gap-y-2",
-    description: "text-xs",
-    error: "text-status-error"
-  },
-  variants: {
-    layout: {
-      horizontal: {
-        wrapper: "flex-row gap-4",
-        labelWrapper: "h-10 lg:h-9"
-      },
-      vertical: {
-        wrapper: "flex-col gap-2",
-        labelWrapper: "h-4"
-      }
-    }
-  },
-  defaultVariants: {
-    layout: "horizontal"
-  }
-}), Q = y.forwardRef(
-  ({
-    title: e,
-    description: r,
-    descriptionPlacement: t = "text",
-    control: o,
-    required: s,
-    error: n,
-    className: a,
-    labelClassName: c,
-    layout: l,
-    readonly: u
-  }, g) => {
-    const b = te(), h = Le({ layout: l }), x = r && t !== "icon", _ = r && t === "icon", v = n || x, p = n || r;
-    return /* @__PURE__ */ A("div", { ref: g, className: h.wrapper({ className: a }), children: [
-      /* @__PURE__ */ A("div", { className: h.labelWrapper({ className: c }), children: [
-        /* @__PURE__ */ d(B, { required: !u && s, htmlFor: b, children: e }),
-        _ && /* @__PURE__ */ d(Oe, { content: r, icon: de })
-      ] }),
-      /* @__PURE__ */ A("div", { className: h.controlWrapper(), children: [
-        o({ readonly: u, id: b }),
-        v && /* @__PURE__ */ d(
-          se,
-          {
-            className: oe(h.description(), n ? h.error() : ""),
-            children: p
-          }
-        )
-      ] })
-    ] });
-  }
+u.displayName = "FormSectionHeaderButton";
+const b = a({
+  base: "rounded-xl border border-secondary-border p-4 lg:p-6"
+}), S = s.forwardRef(
+  ({ className: o, children: e, ...r }, m) => /* @__PURE__ */ t(i, { ref: m, className: b({ className: o }), ...r, children: e })
 );
-Q.displayName = "Field";
-const We = w({
-  base: "flex-col gap-2 lg:flex-row lg:gap-4",
-  slots: {
-    label: "h-4 lg:h-9"
-  }
-});
-function Ze({
-  name: e,
-  title: r,
-  description: t,
-  control: o,
-  required: s,
-  className: n,
-  labelClassName: a,
-  readonly: c
-}) {
-  const l = V(), u = We();
-  return /* @__PURE__ */ d(
-    Ae,
-    {
-      control: l.control,
-      name: e,
-      render: ({ field: g, fieldState: b, formState: h }) => {
-        var x;
-        return /* @__PURE__ */ d(K, { children: /* @__PURE__ */ d(
-          Q,
-          {
-            title: r,
-            description: t,
-            required: s,
-            error: (x = b.error) == null ? void 0 : x.message,
-            labelClassName: u.label({ class: a }),
-            readonly: c,
-            className: u.base({ className: n }),
-            control: ({ id: _, readonly: v }) => /* @__PURE__ */ d(J, { id: _, children: o({ field: g, fieldState: b, formState: h, readonly: v }) })
-          }
-        ) });
-      }
-    }
-  );
-}
-const $e = w({
-  base: "text-md font-semibold"
-});
-function et({ children: e, className: r, as: t = "h3" }) {
-  return /* @__PURE__ */ d(t, { className: $e({ className: r }), children: e });
-}
+S.displayName = "FormFieldSet";
 export {
-  Ye as Form,
-  J as FormControl,
-  Ee as FormDescription,
-  Ze as FormField,
-  Ae as FormFieldControl,
-  K as FormItem,
-  ke as FormLabel,
-  Pe as FormMessage,
-  et as FormSectionTitle,
-  T as useFormField
+  R as Form,
+  M as FormBody,
+  w as FormControl,
+  q as FormDescription,
+  f as FormDivider,
+  C as FormField,
+  h as FormFieldControl,
+  S as FormFieldSet,
+  z as FormFooter,
+  J as FormFooterTemplate,
+  A as FormHeader,
+  K as FormHeaderTemplate,
+  _ as FormItem,
+  j as FormLabel,
+  k as FormMessage,
+  u as FormSectionHeaderButton,
+  T as FormSectionTitle,
+  i as FormStack,
+  E as FormTitle,
+  I as useFormField
 };
 //# sourceMappingURL=form.js.map