@okam/stack-ui 1.44.3 → 1.44.4

package/index26.mjs

@@ -1,170 +1,44 @@
 "use client";
-import { jsxs as M, jsx as i } from "react/jsx-runtime";
-import { isEmpty as A } from "radashi";
-import { useRef as T } from "react";
-import { useSelect as K, HiddenSelect as L } from "react-aria";
-import { useFormContext as V, Controller as C } from "react-hook-form";
-import { useSelectState as Q } from "react-stately";
-import { useTranslation as U } from "./index97.mjs";
-import W from "./index37.mjs";
-import { ButtonWithForwardRef as _ } from "./index6.mjs";
-import z from "./index24.mjs";
-import j from "./index3.mjs";
-import G from "./index50.mjs";
-import { ListBox as J } from "./index155.mjs";
-import X from "./index156.mjs";
-const Y = (q) => {
-  var S;
+import { isEmpty as m } from "radashi";
+import { useRef as b, useMemo as f } from "react";
+import { mergeProps as w } from "react-aria";
+function v(e, s) {
+  if (s.current == null || e == null)
+    return [];
+  const { slideClass: l = "swiper-slide" } = e.params;
+  return s.current?.className.split(" ").filter((i) => i.indexOf("swiper-slide") === 0 || i.indexOf(l) === 0);
+}
+function L(e) {
   const {
-    name: h,
-    placeholderLabel: v,
-    disabled: e,
-    required: u,
-    isInvalid: b,
-    hookFormRef: c,
-    isError: m = !1,
-    errorMessage: l,
-    themeName: r = "select",
-    tokens: p,
-    customTheme: O,
-    label: f,
-    onSelectionChange: I,
-    defaultValue: $,
-    value: x,
-    icon: y,
-    popoverMatchesWidth: P,
-    options: d,
-    ...t
-  } = q, s = T(null), n = T(null), D = (a) => {
-    a && (c == null || c(a), s.current = a);
-  }, E = d == null ? void 0 : d.filter((a) => {
-    var w;
-    return !((w = a.key) != null && w.includes("header-"));
-  }), o = Q({
-    ...t,
-    children: G,
-    selectedKey: x,
-    defaultSelectedKey: $,
-    items: E,
-    onSelectionChange: I,
-    isDisabled: e,
-    isRequired: u,
-    isInvalid: b
-  }), { triggerProps: F, menuProps: R, labelProps: g, valueProps: B } = K(
-    { ...t, label: f, isDisabled: e, isRequired: u, isInvalid: b },
-    o,
-    D
-  ), { onPress: N, onPressStart: k, ...H } = F;
-  return /* @__PURE__ */ M(W, { themeName: `${r}.wrapper`, children: [
-    f && /* @__PURE__ */ i(j, { ...g, as: "label", themeName: `${r}.label`, children: f }),
-    /* @__PURE__ */ i(L, { state: o, triggerRef: n, name: h, isDisabled: !0 }),
-    /* @__PURE__ */ M(W, { themeName: `${r}.container`, children: [
-      /* @__PURE__ */ M(
-        _,
-        {
-          ...H,
-          handlePress: (a) => {
-            N == null || N(a), k == null || k(a);
-          },
-          ref: n,
-          disabled: e,
-          themeName: `${r}.button`,
-          tokens: { ...p, intent: m ? "error" : "default" },
-          children: [
-            /* @__PURE__ */ i("span", { ...B, children: o.selectedItem ? o.selectedItem.rendered : v }),
-            /* @__PURE__ */ i(z, { icon: y ?? "ArrowDown" })
-          ]
-        }
-      ),
-      o.isOpen && n.current && /* @__PURE__ */ i(
-        X,
-        {
-          tokens: p,
-          state: o,
-          triggerRef: n,
-          placement: "bottom",
-          themeName: `${r}.popover`,
-          style: { [`--${r}-container-width`]: `${(S = n.current) == null ? void 0 : S.offsetWidth}px` },
-          children: /* @__PURE__ */ i(J, { ...R, themeName: r, state: o, optionsWithHeaders: d ?? [] })
-        }
-      ),
-      m && /* @__PURE__ */ i(j, { tokens: { ...p, isError: m }, themeName: `${r}.errorMessage`, children: l })
-    ] })
-  ] });
-}, fe = ({
-  id: q,
-  name: h,
-  label: v,
-  rules: e,
-  tokens: u,
-  defaultValue: b,
-  themeName: c = "select",
-  required: m,
-  onChange: l,
-  options: r,
-  placeholderLabel: p,
-  icon: O,
-  popoverMatchesWidth: f,
-  value: I,
-  ...$
-}) => {
-  const { control: x } = V(), { t: y } = U(), P = () => {
-    const t = Object.entries($).filter(([s, n]) => s.startsWith("aria-"));
-    return Object.fromEntries(t);
-  }, d = {
-    required: m ? y("FORM.ERROR.REQUIRED") ?? "required" : !1,
-    ...e
+    title: s,
+    id: l,
+    ariaLabel: n,
+    "aria-label": i,
+    children: x,
+    swiperSlideIndex: g,
+    swiper: a,
+    ...c
+  } = e, { itemRoleDescriptionMessage: d = "slide", slideRole: p = "group" } = a?.params?.a11y ?? {}, u = !m(s), t = b(null), o = f(() => {
+    const r = v(a, t);
+    return {
+      isActive: r?.includes("swiper-slide-active"),
+      isVisible: r?.includes("swiper-slide-visible"),
+      isPrev: r?.includes("swiper-slide-prev"),
+      isNext: r?.includes("swiper-slide-next")
+    };
+  }, [t.current]);
+  return {
+    ref: t,
+    slideProps: w(c, {
+      ...u ? { "aria-labelledby": l } : { "aria-label": n ?? i },
+      "aria-roledescription": d ?? void 0,
+      role: p,
+      inert: `!${o.isVisible}`
+    }),
+    titleProps: {},
+    ...o
   };
-  return /* @__PURE__ */ i(
-    C,
-    {
-      name: h,
-      control: x,
-      rules: d,
-      disabled: e == null ? void 0 : e.disabled,
-      defaultValue: b ?? I,
-      render: ({ field: t, fieldState: s }) => {
-        var R;
-        const { ref: n, ...D } = t, E = !A(s.error), o = {
-          isDisabled: t.disabled ?? !1,
-          isRequired: (e == null ? void 0 : e.required) === !0 || (e == null ? void 0 : e.required) === "required",
-          isInvalid: s.invalid,
-          isError: E
-        }, F = {
-          ...u,
-          ...o
-        };
-        return /* @__PURE__ */ i(
-          Y,
-          {
-            ...D,
-            ...o,
-            ...P(),
-            id: q,
-            hookFormRef: n,
-            name: h,
-            themeName: c,
-            label: v,
-            tokens: F,
-            disabled: t.disabled,
-            required: (e == null ? void 0 : e.required) === !0 || (e == null ? void 0 : e.required) === "required",
-            isInvalid: s.invalid,
-            errorMessage: (R = s.error) == null ? void 0 : R.message,
-            value: t.value,
-            options: r,
-            placeholderLabel: p,
-            icon: O,
-            popoverMatchesWidth: f,
-            onSelectionChange: (g) => {
-              t.onChange(g), l == null || l(g);
-            }
-          }
-        );
-      }
-    }
-  );
-};
+}
 export {
-  fe as ReactHookFormSelect,
-  Y as default
+  L as useCarouselSlide
 };

package/index27.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),N=require("./index157.js"),p=require("@react-aria/focus"),H=require("./index158.js"),O=require("./index159.js"),S=require("./index160.js"),B=require("radashi"),D=require("react"),C=require("react-hook-form"),q=require("./index89.js"),I=require("./index97.js"),V=require("./index24.js"),E=require("./index3.js"),P=i=>{const{id:g,label:e,isDisabled:d=!1,isError:l=!1,errorMessage:u,ariaLabel:j,icon:h,themeName:r="checkbox",tokens:a,customTheme:o}=i,k=S.useToggleState(i),x=D.useRef(null),{inputProps:f,labelProps:R}=N.useCheckbox(i,k,x),{isSelected:F}=k,{focusProps:c,isFocusVisible:n}=p.useFocusRing(),t={...a,selected:F,isDisabled:d,isError:l,isFocusVisible:n},T=q(`${r}.container`,t,o),M=q(`${r}.checkBox`,t,o),v=q(`${r}.checkMark`,t,o),m=q(`${r}.checkMarkIcon`,t,o);return s.jsxs("div",{children:[s.jsx(p.FocusRing,{focusRingClass:"has-focus-ring",within:!0,children:s.jsxs("label",{className:T,htmlFor:g,"aria-label":j,"aria-disabled":d,...R,children:[s.jsx(O.VisuallyHidden,{children:s.jsx("input",{type:"checkbox",ref:x,...H.mergeProps(f,c)})}),s.jsx("div",{className:M,children:s.jsx("div",{className:v,children:h&&s.jsx(V,{icon:h,customTheme:m})})}),s.jsx(E.default,{themeName:`${r}.label`,tokens:t,children:e})]})}),l&&u&&s.jsx(E.default,{themeName:`${r}.errorMessage`,tokens:t,children:u})]})},_=({name:i,label:g,rules:e,tokens:d,ariaLabel:l,defaultValue:u=!1,themeName:j="checkbox",isDisabled:h=!1,icon:r,onChange:a,onBlur:o,...k})=>{const{control:x}=C.useFormContext(),{t:f}=I.useTranslation(),R=()=>{const c=Object.entries(k).filter(([n,t])=>n.startsWith("aria-"));return Object.fromEntries(c)},F={required:e!=null&&e.required?f("FORM.ERROR.REQUIRED")??"required":!1,...e};return s.jsx(C.Controller,{name:i,control:x,rules:F,disabled:e==null?void 0:e.disabled,defaultValue:u,render:({field:c,fieldState:n})=>{var $;const{ref:t,value:T,...M}=c,v=!B.isEmpty(n.error),m={isDisabled:c.disabled??h,isRequired:(e==null?void 0:e.required)===!0||(e==null?void 0:e.required)==="required",isError:v},y={...d,...m};return s.jsx(P,{...M,...m,...R(),id:i,isSelected:T,name:i,themeName:j,label:g,tokens:y,ariaLabel:l,icon:r,errorMessage:($=n.error)==null?void 0:$.message,onChange:b=>{c.onChange(b),a==null||a(b)},onBlur:b=>{c.onBlur(),o==null||o(b)}})}})};exports.ReactHookFormCheckBox=_;exports.default=P;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("@react-aria/utils"),P=require("react-aria"),y=require("swiper/modules"),S=require("./index82.js");function M(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,n.get?n:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const x=M(y),O=["A11y","Controller"],C="Pagination";function j(e){const{children:o,...r}=e,{controller:n,setController:a,modules:s,slides:l,id:c,nextNavigationRef:u,prevNavigationRef:p,swiperProps:d,swiperRef:f,setActiveIndex:g}=S.useCarousel(),{a11y:i}=n?.params??{},b=[...s?.filter(t=>t!==C)??[],...O].map(t=>x[t]),{containerRoleDescriptionMessage:w="carousel"}=i??{},m={navigation:{nextEl:u.current,prevEl:p.current,enabled:s?.includes("Navigation")},id:c,watchSlidesProgress:!0,role:"group",onSwiper:a,onSlideChange:t=>{g(t.activeIndex)},modules:b,keyboard:{enabled:!0,onlyInViewport:!1},a11y:{enabled:!0,...i},"aria-roledescription":w??void 0,tabIndex:0};return{swiperProps:P.mergeProps(d,m,v.filterDOMProps(r)),slides:l,ref:f}}exports.useCarouselSwiper=j;

package/index27.mjs

@@ -1,115 +1,54 @@
 "use client";
-import { jsxs as v, jsx as o } from "react/jsx-runtime";
-import { useCheckbox as N } from "./index157.mjs";
-import { useFocusRing as P, FocusRing as j } from "@react-aria/focus";
-import { mergeProps as D } from "./index158.mjs";
-import { VisuallyHidden as I } from "./index159.mjs";
-import { useToggleState as O } from "./index160.mjs";
-import { isEmpty as B } from "radashi";
-import { useRef as H } from "react";
-import { useFormContext as S, Controller as V } from "react-hook-form";
-import x from "./index89.mjs";
-import { useTranslation as w } from "./index97.mjs";
-import A from "./index24.mjs";
-import y from "./index3.mjs";
-const L = (i) => {
-  const {
-    id: $,
-    label: e,
-    isDisabled: m = !1,
-    isError: d = !1,
-    errorMessage: h,
-    ariaLabel: u,
-    icon: f,
-    themeName: r = "checkbox",
-    tokens: n,
-    customTheme: c
-  } = i, l = O(i), k = H(null), { inputProps: g, labelProps: R } = N(i, l, k), { isSelected: T } = l, { focusProps: t, isFocusVisible: a } = P(), s = { ...n, selected: T, isDisabled: m, isError: d, isFocusVisible: a }, F = x(`${r}.container`, s, c), M = x(`${r}.checkBox`, s, c), q = x(`${r}.checkMark`, s, c), p = x(`${r}.checkMarkIcon`, s, c);
-  return /* @__PURE__ */ v("div", { children: [
-    /* @__PURE__ */ o(j, { focusRingClass: "has-focus-ring", within: !0, children: /* @__PURE__ */ v(
-      "label",
-      {
-        className: F,
-        htmlFor: $,
-        "aria-label": u,
-        "aria-disabled": m,
-        ...R,
-        children: [
-          /* @__PURE__ */ o(I, { children: /* @__PURE__ */ o("input", { type: "checkbox", ref: k, ...D(g, t) }) }),
-          /* @__PURE__ */ o("div", { className: M, children: /* @__PURE__ */ o("div", { className: q, children: f && /* @__PURE__ */ o(A, { icon: f, customTheme: p }) }) }),
-          /* @__PURE__ */ o(y, { themeName: `${r}.label`, tokens: s, children: e })
-        ]
-      }
-    ) }),
-    d && h && /* @__PURE__ */ o(y, { themeName: `${r}.errorMessage`, tokens: s, children: h })
-  ] });
-}, re = ({
-  name: i,
-  label: $,
-  rules: e,
-  tokens: m,
-  ariaLabel: d,
-  defaultValue: h = !1,
-  themeName: u = "checkbox",
-  isDisabled: f = !1,
-  icon: r,
-  onChange: n,
-  onBlur: c,
-  ...l
-}) => {
-  const { control: k } = S(), { t: g } = w(), R = () => {
-    const t = Object.entries(l).filter(([a, s]) => a.startsWith("aria-"));
-    return Object.fromEntries(t);
-  }, T = {
-    required: e != null && e.required ? g("FORM.ERROR.REQUIRED") ?? "required" : !1,
-    ...e
+import { filterDOMProps as v } from "@react-aria/utils";
+import { mergeProps as P } from "react-aria";
+import * as x from "swiper/modules";
+import { useCarousel as M } from "./index82.mjs";
+const b = ["A11y", "Controller"], y = "Pagination";
+function h(t) {
+  const { children: C, ...n } = t, {
+    controller: s,
+    setController: i,
+    modules: r,
+    slides: a,
+    id: l,
+    nextNavigationRef: p,
+    prevNavigationRef: d,
+    swiperProps: c,
+    swiperRef: u,
+    setActiveIndex: m
+  } = M(), { a11y: o } = s?.params ?? {}, f = [...r?.filter((e) => e !== y) ?? [], ...b].map(
+    (e) => x[e]
+  ), { containerRoleDescriptionMessage: g = "carousel" } = o ?? {}, w = {
+    navigation: {
+      nextEl: p.current,
+      prevEl: d.current,
+      enabled: r?.includes("Navigation")
+    },
+    id: l,
+    watchSlidesProgress: !0,
+    role: "group",
+    onSwiper: i,
+    onSlideChange: (e) => {
+      m(e.activeIndex);
+    },
+    modules: f,
+    keyboard: {
+      enabled: !0,
+      onlyInViewport: !1
+    },
+    a11y: {
+      enabled: !0,
+      ...o
+    },
+    "aria-roledescription": g ?? void 0,
+    tabIndex: 0
   };
-  return /* @__PURE__ */ o(
-    V,
-    {
-      name: i,
-      control: k,
-      rules: T,
-      disabled: e == null ? void 0 : e.disabled,
-      defaultValue: h,
-      render: ({ field: t, fieldState: a }) => {
-        var E;
-        const { ref: s, value: F, ...M } = t, q = !B(a.error), p = {
-          isDisabled: t.disabled ?? f,
-          isRequired: (e == null ? void 0 : e.required) === !0 || (e == null ? void 0 : e.required) === "required",
-          isError: q
-        }, C = {
-          ...m,
-          ...p
-        };
-        return /* @__PURE__ */ o(
-          L,
-          {
-            ...M,
-            ...p,
-            ...R(),
-            id: i,
-            isSelected: F,
-            name: i,
-            themeName: u,
-            label: $,
-            tokens: C,
-            ariaLabel: d,
-            icon: r,
-            errorMessage: (E = a.error) == null ? void 0 : E.message,
-            onChange: (b) => {
-              t.onChange(b), n == null || n(b);
-            },
-            onBlur: (b) => {
-              t.onBlur(), c == null || c(b);
-            }
-          }
-        );
-      }
-    }
-  );
-};
+  return {
+    swiperProps: P(c, w, v(n)),
+    slides: a,
+    ref: u
+  };
+}
 export {
-  re as ReactHookFormCheckBox,
-  L as default
+  h as useCarouselSwiper
 };

package/index28.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";const e=require("react/jsx-runtime"),x=require("react"),f=require("react-aria"),R=require("react-stately"),v=require("./index89.js"),w=require("./index95.js"),c=require("./index37.js"),F=require("./index6.js"),B=require("./index69.js"),I=require("./index153.js"),M=require("./index3.js"),T=({value:a})=>a===""?e.jsx(I,{width:"16",height:"16"}):e.jsx(B,{width:"16",height:"16"}),Q=a=>{const{setUserSearchQuery:u}=w.useUserQueryValHook(),{label:h,themeName:s="search",tokens:g,customTheme:j,disabled:q,errorMessage:i,placeholder:k,icon:o,isDisabled:$}=a,r=$||q,d={...a,isDisabled:r},l=R.useSearchFieldState(d),m=x.useRef(null),{labelProps:S,inputProps:n,errorMessageProps:p,clearButtonProps:N}=f.useSearchField(d,l,m),C=x.useCallback(P=>{var b;u(l.value),(b=n.onChange)==null||b.call(n,P)},[u,l.value,n]),D=i!=null,t={...g,isError:D,isDisabled:r??!1},y=v(`${s}.input`,t,j);return e.jsxs(c.default,{themeName:`${s}.wrapper`,tokens:t,"aria-disabled":r??!1,children:[h&&e.jsx(c.default,{...S,as:"label",themeName:`${s}.label`,tokens:t,children:h}),e.jsxs(c.default,{themeName:`${s}.container`,tokens:t,children:[e.jsx("input",{ref:m,...n,onChange:C,placeholder:k,className:y,disabled:r}),e.jsx(f.FocusRing,{focusRingClass:"has-focus-ring",children:e.jsxs(F.default,{isDisabled:r,handlePress:N.onPress,tokens:{isIconOnly:!0,buttonStyle:"hollow",isDisabled:r??!1},themeName:`${s}.icon`,"aria-label":"clear",children:[o==null&&e.jsx(T,{value:l.value}),o!=null&&o]})})]}),i&&e.jsx(M.default,{themeName:`${s}.errorMessage`,tokens:t,...p,children:i})]})};module.exports=Q;
+"use strict";const p=require("react/jsx-runtime"),S=require("radashi"),r=require("react-aria"),f=require("./index88.js");function l(o){const{as:s="time",date:n,tokens:a,customTheme:m,dateFormatterOptions:c={month:"long",day:"numeric",year:"numeric"},themeName:i="typography",...u}=o,d=r.useIsSSR(),t=new Date(n),e=r.useDateFormatter(c).format(t),h=f(i,a,m);return d||S.isEmpty(e)?null:p.jsx(s,{...u,dateTime:t.toISOString(),className:h,children:e})}module.exports=l;

package/index28.mjs

@@ -1,66 +1,20 @@
 "use client";
-import { jsxs as c, jsx as e } from "react/jsx-runtime";
-import T, { useCallback as v } from "react";
-import { useSearchField as w, FocusRing as F } from "react-aria";
-import { useSearchFieldState as R } from "react-stately";
-import I from "./index89.mjs";
-import { useUserQueryValHook as M } from "./index95.mjs";
-import m from "./index37.mjs";
-import j from "./index6.mjs";
-import Q from "./index69.mjs";
-import U from "./index153.mjs";
-import _ from "./index3.mjs";
-const E = ({ value: a }) => a === "" ? /* @__PURE__ */ e(U, { width: "16", height: "16" }) : /* @__PURE__ */ e(Q, { width: "16", height: "16" }), X = (a) => {
-  const { setUserSearchQuery: h } = M(), {
-    label: u,
-    themeName: s = "search",
-    tokens: b,
-    customTheme: g,
-    disabled: k,
-    errorMessage: l,
-    placeholder: C,
-    icon: i,
-    isDisabled: N
-  } = a, r = N || k, d = { ...a, isDisabled: r }, n = R(d), f = T.useRef(null), { labelProps: S, inputProps: o, errorMessageProps: y, clearButtonProps: D } = w(d, n, f), $ = v(
-    (P) => {
-      var p;
-      h(n.value), (p = o.onChange) == null || p.call(o, P);
-    },
-    [h, n.value, o]
-  ), x = l != null, t = { ...b, isError: x, isDisabled: r ?? !1 }, B = I(`${s}.input`, t, g);
-  return /* @__PURE__ */ c(m, { themeName: `${s}.wrapper`, tokens: t, "aria-disabled": r ?? !1, children: [
-    u && // eslint-disable-next-line jsx-a11y/label-has-associated-control
-    /* @__PURE__ */ e(m, { ...S, as: "label", themeName: `${s}.label`, tokens: t, children: u }),
-    /* @__PURE__ */ c(m, { themeName: `${s}.container`, tokens: t, children: [
-      /* @__PURE__ */ e(
-        "input",
-        {
-          ref: f,
-          ...o,
-          onChange: $,
-          placeholder: C,
-          className: B,
-          disabled: r
-        }
-      ),
-      /* @__PURE__ */ e(F, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ c(
-        j,
-        {
-          isDisabled: r,
-          handlePress: D.onPress,
-          tokens: { isIconOnly: !0, buttonStyle: "hollow", isDisabled: r ?? !1 },
-          themeName: `${s}.icon`,
-          "aria-label": "clear",
-          children: [
-            i == null && /* @__PURE__ */ e(E, { value: n.value }),
-            i != null && i
-          ]
-        }
-      ) })
-    ] }),
-    l && /* @__PURE__ */ e(_, { themeName: `${s}.errorMessage`, tokens: t, ...y, children: l })
-  ] });
-};
+import { jsx as u } from "react/jsx-runtime";
+import { isEmpty as d } from "radashi";
+import { useIsSSR as h, useDateFormatter as l } from "react-aria";
+import S from "./index88.mjs";
+function T(o) {
+  const {
+    as: m = "time",
+    date: r,
+    tokens: a,
+    customTheme: n,
+    dateFormatterOptions: s = { month: "long", day: "numeric", year: "numeric" },
+    themeName: i = "typography",
+    ...c
+  } = o, p = h(), t = new Date(r), e = l(s).format(t), f = S(i, a, n);
+  return p || d(e) ? null : /* @__PURE__ */ u(m, { ...c, dateTime: t.toISOString(), className: f, children: e });
+}
 export {
-  X as default
+  T as default
 };

package/index29.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";const e=require("react/jsx-runtime"),p=require("./index161.js"),G=require("react-aria"),m=require("./index162.js"),n=require("./index37.js"),i=require("./index3.js"),f=r=>{const{label:s,isError:a=!1,errorMessage:o,isDisabled:t=!1,children:x,themeName:c="checkboxGroup",tokens:h}=r,u=p.useCheckboxGroupState(r),{groupProps:l,labelProps:d,errorMessageProps:k}=G.useCheckboxGroup(r,u),b={...h,isDisabled:t};return e.jsxs(n.default,{...l,"aria-disabled":t,themeName:`${c}.checkboxGroup`,tokens:b,children:[s&&e.jsx(i.default,{...d,tokens:{size:"h6"},children:s}),e.jsx(n.default,{themeName:`${c}.checkboxGroupItemsGroup`,children:e.jsx(m.CheckboxGroupProvider,{state:u,children:x})}),a&&o&&e.jsx(i.default,{...k,tokens:{isError:!0},children:o})]})};module.exports=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),E=require("radashi"),N=require("react"),a=require("react-aria"),M=require("react-hook-form"),P=require("react-stately"),g=require("./index88.js"),O=require("./index89.js"),S=require("./index48.js"),B=require("./index74.js");function $(t){const{id:q,label:r,isDisabled:l=!1,isError:u=!1,errorMessage:d,ariaLabel:j,icon:h,themeName:s="checkbox",tokens:R,customTheme:n}=t,k=P.useToggleState(t),x=N.useRef(null),{inputProps:f,labelProps:T}=a.useCheckbox(t,k,x),{isSelected:F}=k,{focusProps:o,isFocusVisible:i}=a.useFocusRing(),c={...R,selected:F,isDisabled:l,isError:u,isFocusVisible:i},y=g(`${s}.container`,c,n),C=g(`${s}.checkBox`,c,n),p=g(`${s}.checkMark`,c,n),m=g(`${s}.checkMarkIcon`,c,n);return e.jsxs("div",{children:[e.jsx(a.FocusRing,{focusRingClass:"has-focus-ring",within:!0,children:e.jsxs("label",{className:y,htmlFor:q,"aria-label":j,"aria-disabled":l,...T,children:[e.jsx(a.VisuallyHidden,{children:e.jsx("input",{type:"checkbox",ref:x,...a.mergeProps(f,o)})}),e.jsx("div",{className:C,children:e.jsx("div",{className:p,children:h!=null&&e.jsx(S,{icon:h,customTheme:m})})}),e.jsx(B.Typography,{themeName:`${s}.label`,tokens:c,children:r})]})}),u&&d!=null&&e.jsx(B.Typography,{themeName:`${s}.errorMessage`,tokens:c,children:d})]})}function H({name:t,label:q,rules:r,tokens:l,ariaLabel:u,defaultValue:d=!1,themeName:j="checkbox",isDisabled:h=!1,icon:s,onChange:R,onBlur:n,...k}){const{control:x}=M.useFormContext(),{t:f}=O.useTranslation(),T=()=>{const o=Object.entries(k).filter(([i,c])=>i.startsWith("aria-"));return Object.fromEntries(o)},F={required:r?.required!=null&&r.required!==!1?f("FORM.ERROR.REQUIRED")??"required":!1,...r};return e.jsx(M.Controller,{name:t??"",control:x,rules:F,disabled:r?.disabled,defaultValue:d,render:({field:o,fieldState:i})=>{const{ref:c,value:y,...C}=o,p=!E.isEmpty(i.error),m={isDisabled:o.disabled??h,isRequired:r?.required===!0||r?.required==="required",isError:p},v={...l,...m};return e.jsx($,{...C,...m,...T(),id:t,isSelected:y,name:t,themeName:j,label:q,tokens:v,ariaLabel:u,icon:s,errorMessage:i.error?.message,onChange:b=>{o.onChange(b),R?.(b)},onBlur:b=>{o.onBlur(),n?.(b)}})}})}exports.Checkbox=$;exports.ReactHookFormCheckBox=H;

package/index29.mjs

@@ -1,35 +1,112 @@
 "use client";
-import { jsxs as k, jsx as e } from "react/jsx-runtime";
-import { useCheckboxGroupState as x } from "./index161.mjs";
-import { useCheckboxGroup as f } from "react-aria";
-import { CheckboxGroupProvider as G } from "./index162.mjs";
-import i from "./index37.mjs";
-import m from "./index3.mjs";
-const y = (o) => {
+import { jsxs as B, jsx as e } from "react/jsx-runtime";
+import { isEmpty as y } from "radashi";
+import { useRef as N } from "react";
+import { useCheckbox as $, useFocusRing as P, FocusRing as j, VisuallyHidden as D, mergeProps as I } from "react-aria";
+import { useFormContext as O, Controller as H } from "react-hook-form";
+import { useToggleState as S } from "react-stately";
+import b from "./index88.mjs";
+import { useTranslation as V } from "./index89.mjs";
+import w from "./index48.mjs";
+import { Typography as E } from "./index74.mjs";
+function A(t) {
   const {
+    id: p,
     label: r,
-    isError: p = !1,
-    errorMessage: s,
-    isDisabled: t = !1,
-    children: h,
-    themeName: a = "checkboxGroup",
-    tokens: n
-  } = o, c = x(o), { groupProps: d, labelProps: u, errorMessageProps: l } = f(o, c), b = { ...n, isDisabled: t };
-  return /* @__PURE__ */ k(
-    i,
+    isDisabled: a = !1,
+    isError: l = !1,
+    errorMessage: m,
+    ariaLabel: g,
+    icon: h,
+    themeName: o = "checkbox",
+    tokens: x,
+    customTheme: i
+  } = t, d = S(t), u = N(null), { inputProps: R, labelProps: T } = $(t, d, u), { isSelected: C } = d, { focusProps: s, isFocusVisible: n } = P(), c = { ...x, selected: C, isDisabled: a, isError: l, isFocusVisible: n }, F = b(`${o}.container`, c, i), M = b(`${o}.checkBox`, c, i), q = b(`${o}.checkMark`, c, i), k = b(`${o}.checkMarkIcon`, c, i);
+  return /* @__PURE__ */ B("div", { children: [
+    /* @__PURE__ */ e(j, { focusRingClass: "has-focus-ring", within: !0, children: /* @__PURE__ */ B(
+      "label",
+      {
+        className: F,
+        htmlFor: p,
+        "aria-label": g,
+        "aria-disabled": a,
+        ...T,
+        children: [
+          /* @__PURE__ */ e(D, { children: /* @__PURE__ */ e("input", { type: "checkbox", ref: u, ...I(R, s) }) }),
+          /* @__PURE__ */ e("div", { className: M, children: /* @__PURE__ */ e("div", { className: q, children: h != null && /* @__PURE__ */ e(w, { icon: h, customTheme: k }) }) }),
+          /* @__PURE__ */ e(E, { themeName: `${o}.label`, tokens: c, children: r })
+        ]
+      }
+    ) }),
+    l && m != null && /* @__PURE__ */ e(E, { themeName: `${o}.errorMessage`, tokens: c, children: m })
+  ] });
+}
+function Y({
+  name: t,
+  label: p,
+  rules: r,
+  tokens: a,
+  ariaLabel: l,
+  defaultValue: m = !1,
+  themeName: g = "checkbox",
+  isDisabled: h = !1,
+  icon: o,
+  onChange: x,
+  onBlur: i,
+  ...d
+}) {
+  const { control: u } = O(), { t: R } = V(), T = () => {
+    const s = Object.entries(d).filter(([n, c]) => n.startsWith("aria-"));
+    return Object.fromEntries(s);
+  }, C = {
+    required: r?.required != null && r.required !== !1 ? R("FORM.ERROR.REQUIRED") ?? "required" : !1,
+    ...r
+  };
+  return /* @__PURE__ */ e(
+    H,
     {
-      ...d,
-      "aria-disabled": t,
-      themeName: `${a}.checkboxGroup`,
-      tokens: b,
-      children: [
-        r && /* @__PURE__ */ e(m, { ...u, tokens: { size: "h6" }, children: r }),
-        /* @__PURE__ */ e(i, { themeName: `${a}.checkboxGroupItemsGroup`, children: /* @__PURE__ */ e(G, { state: c, children: h }) }),
-        p && s && /* @__PURE__ */ e(m, { ...l, tokens: { isError: !0 }, children: s })
-      ]
+      name: t ?? "",
+      control: u,
+      rules: C,
+      disabled: r?.disabled,
+      defaultValue: m,
+      render: ({ field: s, fieldState: n }) => {
+        const { ref: c, value: F, ...M } = s, q = !y(n.error), k = {
+          isDisabled: s.disabled ?? h,
+          isRequired: r?.required === !0 || r?.required === "required",
+          isError: q
+        }, v = {
+          ...a,
+          ...k
+        };
+        return /* @__PURE__ */ e(
+          A,
+          {
+            ...M,
+            ...k,
+            ...T(),
+            id: t,
+            isSelected: F,
+            name: t,
+            themeName: g,
+            label: p,
+            tokens: v,
+            ariaLabel: l,
+            icon: o,
+            errorMessage: n.error?.message,
+            onChange: (f) => {
+              s.onChange(f), x?.(f);
+            },
+            onBlur: (f) => {
+              s.onBlur(), i?.(f);
+            }
+          }
+        );
+      }
     }
   );
-};
+}
 export {
-  y as default
+  A as Checkbox,
+  Y as ReactHookFormCheckBox
 };

package/index3.js

@@ -1,2 +1 @@
-"use client";
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react/jsx-runtime"),i=require("react"),p=require("./index89.js"),m=({as:e="span",themeName:t="typography",tokens:r,customTheme:o,children:s,...a})=>{const n=p(t,r,o);return c.jsx(e,{...a,className:n,children:s})},y=i.forwardRef((e,t)=>{const{as:r="span",tokens:o,themeName:s="typography",customTheme:a,children:n,...u}=e,h=p(s,o,a);return c.jsx(r,{...u,ref:t,className:h,children:n})});exports.TypographyWithForwardRef=y;exports.default=m;
+"use strict";const d=require("react");function s(l){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(e,t,n.get?n:{enumerable:!0,get:()=>l[t]})}}return e.default=l,Object.freeze(e)}const u=s(d);function c(l){return null}c.getCollectionNode=function*(e){const{children:t,childItems:n,title:o}=e,r=e.textValue||(typeof t=="string"?t:"")||e["aria-label"]||"";yield{type:"item",props:e,rendered:t,textValue:r,"aria-label":e["aria-label"],hasChildNodes:!1,*childNodes(){if(n!=null)for(const i of n)yield{type:"item",value:i};else if(o!=null){const i=[];u.Children.forEach(t,a=>{i.push({type:"item",element:a})}),yield*i}}}};const f=c;module.exports=f;