@serendie/ui 2.0.0 → 2.1.0

package/dist/components/Select/Select.js

@@ -1,22 +1,22 @@
 import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { SerendieSymbolChevronDown as h } from "@serendie/symbols";
-import { useId as b } from "react";
+import { SerendieSymbolChevronDown as S } from "@serendie/symbols";
 import { css as d } from "../../styled-system/css/css.js";
 import { cx as f } from "../../styled-system/css/cx.js";
 import "../../styled-system/helpers.js";
-import { sva as S } from "../../styled-system/css/sva.js";
-import { List as v } from "../List/List.js";
-import { ListItem as w } from "../List/ListItem.js";
-import { Portal as _ } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
-import { SelectRoot as C } from "../../node_modules/@ark-ui/react/dist/components/select/select-root.js";
-import { SelectLabel as T } from "../../node_modules/@ark-ui/react/dist/components/select/select-label.js";
-import { SelectControl as N } from "../../node_modules/@ark-ui/react/dist/components/select/select-control.js";
-import { SelectTrigger as z } from "../../node_modules/@ark-ui/react/dist/components/select/select-trigger.js";
-import { SelectValueText as R } from "../../node_modules/@ark-ui/react/dist/components/select/select-value-text.js";
-import { SelectPositioner as I } from "../../node_modules/@ark-ui/react/dist/components/select/select-positioner.js";
-import { SelectContent as V } from "../../node_modules/@ark-ui/react/dist/components/select/select-content.js";
-import { SelectItem as B } from "../../node_modules/@ark-ui/react/dist/components/select/select-item.js";
-const l = S({
+import { sva as v } from "../../styled-system/css/sva.js";
+import { List as w } from "../List/List.js";
+import { ListItem as _ } from "../List/ListItem.js";
+import { createListCollection as C } from "../../node_modules/@ark-ui/react/dist/components/collection/list-collection.js";
+import { Portal as T } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
+import { SelectRoot as N } from "../../node_modules/@ark-ui/react/dist/components/select/select-root.js";
+import { SelectLabel as z } from "../../node_modules/@ark-ui/react/dist/components/select/select-label.js";
+import { SelectControl as R } from "../../node_modules/@ark-ui/react/dist/components/select/select-control.js";
+import { SelectTrigger as V } from "../../node_modules/@ark-ui/react/dist/components/select/select-trigger.js";
+import { SelectValueText as L } from "../../node_modules/@ark-ui/react/dist/components/select/select-value-text.js";
+import { SelectPositioner as P } from "../../node_modules/@ark-ui/react/dist/components/select/select-positioner.js";
+import { SelectContent as B } from "../../node_modules/@ark-ui/react/dist/components/select/select-content.js";
+import { SelectItem as I } from "../../node_modules/@ark-ui/react/dist/components/select/select-item.js";
+const n = v({
   slots: ["root", "valueText", "trigger", "content", "item", "iconBox"],
   base: {
     root: {
@@ -153,22 +153,28 @@ const l = S({
   defaultVariants: {
     size: "medium"
   }
-}), Y = ({
+}), M = ({
   placeholder: c = "",
   label: r,
   required: p,
-  invalid: m,
-  invalidMessage: a,
+  invalid: a,
+  invalidMessage: m,
   className: y,
-  ...n
+  items: g = [],
+  ...u
 }) => {
-  const [o, g] = l.splitVariantProps(n), s = l(o), u = b();
+  const [t, x] = n.splitVariantProps(u), o = n(t), { collection: O, ...h } = x, l = C({
+    items: g,
+    itemToString: (s) => s.label,
+    itemToValue: (s) => s.value
+  });
   return /* @__PURE__ */ i(
-    C,
+    N,
     {
-      ...g,
-      invalid: m,
-      className: f(s.root, y),
+      ...h,
+      collection: l,
+      invalid: a,
+      className: f(o.root, y),
       positioning: {
         sameWidth: !0,
         offset: {
@@ -177,9 +183,9 @@ const l = S({
         }
       },
       children: [
-        r && o.size != "small" && // smallの場合はラベルを表示しない
+        r && t.size != "small" && // smallの場合はラベルを表示しない
         /* @__PURE__ */ i(
-          T,
+          z,
           {
             className: d({
               textStyle: {
@@ -203,17 +209,17 @@ const l = S({
             ]
           }
         ),
-        /* @__PURE__ */ e(N, { children: /* @__PURE__ */ i(z, { className: s.trigger, children: [
+        /* @__PURE__ */ e(R, { children: /* @__PURE__ */ i(V, { className: o.trigger, children: [
           /* @__PURE__ */ e(
-            R,
+            L,
             {
               placeholder: c,
-              className: s.valueText
+              className: o.valueText
             }
           ),
-          /* @__PURE__ */ e(h, { className: s.iconBox })
+          /* @__PURE__ */ e(S, { className: o.iconBox })
         ] }) }),
-        m && a && /* @__PURE__ */ e(
+        a && m && /* @__PURE__ */ e(
           "div",
           {
             className: d({
@@ -223,23 +229,23 @@ const l = S({
               },
               color: "sd.system.color.impression.negative"
             }),
-            children: a
+            children: m
           }
         ),
-        /* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(V, { className: s.content, children: /* @__PURE__ */ e(v, { id: u, children: n.items.map((t, x) => /* @__PURE__ */ e(B, { item: t, children: /* @__PURE__ */ e(
-          w,
+        /* @__PURE__ */ e(T, { children: /* @__PURE__ */ e(P, { children: /* @__PURE__ */ e(B, { className: o.content, children: /* @__PURE__ */ e(w, { children: l.items.map((s, b) => /* @__PURE__ */ e(I, { item: s, children: /* @__PURE__ */ e(
+          _,
           {
-            title: t.label,
-            value: t.value,
-            className: s.item,
-            size: o.size == "small" ? "small" : void 0
+            title: s.label,
+            value: s.value,
+            className: o.item,
+            size: t.size == "small" ? "small" : void 0
           }
-        ) }, x)) }) }) }) })
+        ) }, b)) }) }) }) })
       ]
     }
   );
 };
 export {
-  Y as Select,
-  l as SelectStyle
+  M as Select,
+  n as SelectStyle
 };

package/dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,14 @@
+import { ComponentProps } from 'react';
+import { RecipeVariantProps } from '../../../styled-system/css';
+declare const TooltipStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"content" | "arrow" | "arrowTip", import('../../../styled-system/types').SlotRecipeVariantRecord<"content" | "arrow" | "arrowTip">>;
+type TooltipVariantProps = RecipeVariantProps<typeof TooltipStyle>;
+export type TooltipProps = {
+    content: string;
+    children: React.ReactNode;
+    placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "right";
+    openDelay?: number;
+    closeDelay?: number;
+    disabled?: boolean;
+} & ComponentProps<"div"> & TooltipVariantProps;
+export declare const Tooltip: React.FC<TooltipProps>;
+export {};

package/dist/components/Tooltip/Tooltip.js

@@ -0,0 +1,70 @@
+import { jsxs as s, jsx as o } from "react/jsx-runtime";
+import "../../styled-system/css/css.js";
+import { cx as y } from "../../styled-system/css/cx.js";
+import "../../styled-system/helpers.js";
+import { sva as f } from "../../styled-system/css/sva.js";
+import { TooltipRoot as w } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-root.js";
+import { TooltipTrigger as T } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-trigger.js";
+import { TooltipPositioner as g } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-positioner.js";
+import { TooltipContent as h } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-content.js";
+import { TooltipArrow as u } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-arrow.js";
+import { TooltipArrowTip as S } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-arrow-tip.js";
+const t = f({
+  slots: ["content", "arrow", "arrowTip"],
+  base: {
+    content: {
+      backgroundColor: "sd.system.color.component.inverseSurface",
+      color: "sd.system.color.component.inverseOnSurface",
+      borderRadius: "sd.system.dimension.radius.small",
+      px: "sd.system.dimension.spacing.extraSmall",
+      py: "sd.system.dimension.spacing.twoExtraSmall",
+      boxShadow: "sd.system.elevation.shadow.level3",
+      maxWidth: "200px",
+      textStyle: "sd.system.typography.body.extraSmall_expanded",
+      zIndex: 1e3
+    },
+    arrow: {
+      "--arrow-size": "8px",
+      "--arrow-background": "colors.sd.system.color.component.inverseSurface",
+      zIndex: 1001
+    }
+  }
+}), v = ({
+  content: e,
+  children: i,
+  placement: a = "top",
+  openDelay: n = 700,
+  closeDelay: m = 300,
+  disabled: p = !1,
+  className: l,
+  ...d
+}) => {
+  const [c, x] = t.splitVariantProps(d), r = t(c);
+  return /* @__PURE__ */ s(
+    w,
+    {
+      openDelay: n,
+      closeDelay: m,
+      positioning: { placement: a, arrowPadding: 8 },
+      disabled: p,
+      children: [
+        /* @__PURE__ */ o(T, { asChild: !0, children: i }),
+        /* @__PURE__ */ o(g, { children: /* @__PURE__ */ s(
+          h,
+          {
+            className: y(r.content, l),
+            ...x,
+            children: [
+              /* @__PURE__ */ o(u, { className: r.arrow, children: /* @__PURE__ */ o(S, { className: r.arrowTip }) }),
+              e
+            ]
+          }
+        ) })
+      ]
+    }
+  );
+};
+v.displayName = "Tooltip";
+export {
+  v as Tooltip
+};

package/dist/components/Tooltip/index.d.ts

@@ -0,0 +1 @@
+export * from './Tooltip.tsx';

package/dist/components/Tooltip/index.js

@@ -0,0 +1,4 @@
+import { Tooltip as r } from "./Tooltip.js";
+export {
+  r as Tooltip
+};

package/dist/index.d.ts

@@ -28,4 +28,5 @@ export * from './components/Tabs/index.ts';
 export * from './components/TextArea/index.ts';
 export * from './components/TextField/index.ts';
 export * from './components/Toast/index.ts';
+export * from './components/Tooltip/index.ts';
 export * from './components/TopAppBar/index.ts';

package/dist/index.js

@@ -2,7 +2,7 @@ import { SerendiePreset as e } from "./preset.js";
 import { Accordion as a } from "./components/Accordion/Accordion.js";
 import { AccordionGroup as m } from "./components/Accordion/AccordionGroup.js";
 import { Avatar as x, AvatarStyle as n } from "./components/Avatar/Avatar.js";
-import { Badge as f, BadgeCloseButton as s, BadgeStyle as d } from "./components/Badge/Badge.js";
+import { Badge as c, BadgeCloseButton as s, BadgeStyle as l } from "./components/Badge/Badge.js";
 import { Banner as h } from "./components/Banner/Banner.js";
 import { BottomNavigation as S } from "./components/BottomNavigation/BottomNavigation.js";
 import { BottomNavigationItem as g, BottomNavigationItemStyle as y } from "./components/BottomNavigation/BottomNavigationItem.js";
@@ -18,7 +18,7 @@ import { Drawer as oo } from "./components/Drawer/Drawer.js";
 import { DropdownMenu as eo, DropdownMenuStyle as to } from "./components/DropdownMenu/DropdownMenu.js";
 import { IconButton as po, IconButtonStyle as mo } from "./components/IconButton/IconButton.js";
 import { List as xo } from "./components/List/List.js";
-import { ListItem as co, ListItemStyle as fo } from "./components/List/ListItem.js";
+import { ListItem as fo, ListItemStyle as co } from "./components/List/ListItem.js";
 import { ModalDialog as lo } from "./components/ModalDialog/ModalDialog.js";
 import { NotificationBadge as Co } from "./components/NotificationBadge/NotificationBadge.js";
 import { Pagination as Bo, PaginationStyle as go } from "./components/Pagination/Pagination.js";
@@ -34,16 +34,17 @@ import { TabItem as Oo, TabItemStyle as Qo } from "./components/Tabs/TabItem.js"
 import { TextArea as Xo } from "./components/TextArea/TextArea.js";
 import { TextField as Zo } from "./components/TextField/TextField.js";
 import { Toast as $o, ToastStyle as or, toaster as rr } from "./components/Toast/Toast.js";
-import { TopAppBar as tr } from "./components/TopAppBar/TopAppBar.js";
-import { DataTableComponent as pr } from "./components/DataTable/DataTableComponent.js";
+import { Tooltip as tr } from "./components/Tooltip/Tooltip.js";
+import { TopAppBar as pr } from "./components/TopAppBar/TopAppBar.js";
+import { DataTableComponent as ir } from "./components/DataTable/DataTableComponent.js";
 export {
   a as Accordion,
   m as AccordionGroup,
   x as Avatar,
   n as AvatarStyle,
-  f as Badge,
+  c as Badge,
   s as BadgeCloseButton,
-  d as BadgeStyle,
+  l as BadgeStyle,
   h as Banner,
   S as BottomNavigation,
   g as BottomNavigationItem,
@@ -56,7 +57,7 @@ export {
   K as ChoiceBoxStyle,
   Q as DashboardWidget,
   X as DataTable,
-  pr as DataTableComponent,
+  ir as DataTableComponent,
   Z as Divider,
   _ as DividerStyle,
   oo as Drawer,
@@ -65,8 +66,8 @@ export {
   po as IconButton,
   mo as IconButtonStyle,
   xo as List,
-  co as ListItem,
-  fo as ListItemStyle,
+  fo as ListItem,
+  co as ListItemStyle,
   lo as ModalDialog,
   Co as NotificationBadge,
   Bo as Pagination,
@@ -93,7 +94,8 @@ export {
   Zo as TextField,
   $o as Toast,
   or as ToastStyle,
-  tr as TopAppBar,
+  tr as Tooltip,
+  pr as TopAppBar,
   q as checkboxCheckedIconCss,
   z as checkboxIconCss,
   E as checkboxUncheckedIconCss,

package/dist/node_modules/@ark-ui/react/dist/components/accordion/accordion-item-content.js

@@ -5,12 +5,10 @@ import { CollapsibleContent as d } from "../collapsible/collapsible-content.js";
 import { useAccordionContext as a } from "./use-accordion-context.js";
 import { useAccordionItemPropsContext as f } from "./use-accordion-item-props-context.js";
 import { mergeProps as P } from "../../../../../@zag-js/core/dist/index.js";
-const C = c(), l = p(
-  (o, t) => {
-    const r = a(), e = f(), n = r.getItemContentProps(e), [, s] = C(n, ["hidden", "data-state"]), i = P(s, o);
-    return /* @__PURE__ */ m(d, { ref: t, ...i });
-  }
-);
+const C = c(), l = p((o, t) => {
+  const r = a(), e = f(), n = r.getItemContentProps(e), [, s] = C(n, ["hidden", "data-state"]), i = P(s, o);
+  return /* @__PURE__ */ m(d, { ref: t, ...i });
+});
 l.displayName = "AccordionItemContent";
 export {
   l as AccordionItemContent

package/dist/node_modules/@ark-ui/react/dist/components/accordion/accordion-item-indicator.js

@@ -4,12 +4,10 @@ import { ark as n } from "../factory.js";
 import { useAccordionContext as p } from "./use-accordion-context.js";
 import { useAccordionItemPropsContext as s } from "./use-accordion-item-props-context.js";
 import { mergeProps as d } from "../../../../../@zag-js/core/dist/index.js";
-const a = i(
-  (o, r) => {
-    const t = p(), m = s(), e = d(t.getItemIndicatorProps(m), o);
-    return /* @__PURE__ */ c(n.div, { ...e, ref: r });
-  }
-);
+const a = i((o, r) => {
+  const t = p(), m = s(), e = d(t.getItemIndicatorProps(m), o);
+  return /* @__PURE__ */ c(n.div, { ...e, ref: r });
+});
 a.displayName = "AccordionItemIndicator";
 export {
   a as AccordionItemIndicator

package/dist/node_modules/@ark-ui/react/dist/components/accordion/accordion-item-trigger.js

@@ -5,18 +5,16 @@ import { ark as a } from "../factory.js";
 import { useAccordionContext as g } from "./use-accordion-context.js";
 import { useAccordionItemPropsContext as d } from "./use-accordion-item-props-context.js";
 import { mergeProps as f } from "../../../../../@zag-js/core/dist/index.js";
-const l = c(
-  (r, t) => {
-    const e = g(), i = d(), m = p(), o = e.getItemTriggerProps(i), s = f(
-      {
-        ...o,
-        "aria-controls": m.isUnmounted ? void 0 : o["aria-controls"]
-      },
-      r
-    );
-    return /* @__PURE__ */ n(a.button, { ...s, ref: t });
-  }
-);
+const l = c((r, t) => {
+  const e = g(), i = d(), m = p(), o = e.getItemTriggerProps(i), s = f(
+    {
+      ...o,
+      "aria-controls": m.isUnmounted ? void 0 : o["aria-controls"]
+    },
+    r
+  );
+  return /* @__PURE__ */ n(a.button, { ...s, ref: t });
+});
 l.displayName = "AccordionItemTrigger";
 export {
   l as AccordionItemTrigger

package/dist/node_modules/@ark-ui/react/dist/components/accordion/accordion-item.js

@@ -1,26 +1,26 @@
 import { jsx as t } from "react/jsx-runtime";
-import { splitItemProps as d } from "../../../../../@zag-js/accordion/dist/index.js";
-import { forwardRef as a } from "react";
-import { useAccordionContext as P } from "./use-accordion-context.js";
-import { AccordionItemProvider as f } from "./use-accordion-item-context.js";
-import { CollapsibleRoot as l } from "../collapsible/collapsible-root.js";
-import { useRenderStrategyPropsContext as I } from "../../utils/render-strategy.js";
-import { AccordionItemPropsProvider as g } from "./use-accordion-item-props-context.js";
+import { forwardRef as d } from "react";
+import { useAccordionContext as a } from "./use-accordion-context.js";
+import { AccordionItemProvider as l } from "./use-accordion-item-context.js";
+import { CollapsibleRoot as P } from "../collapsible/collapsible-root.js";
+import { createSplitProps as f } from "../../utils/create-split-props.js";
+import { useRenderStrategyPropsContext as g } from "../../utils/render-strategy.js";
+import { AccordionItemPropsProvider as I } from "./use-accordion-item-props-context.js";
 import { mergeProps as u } from "../../../../../@zag-js/core/dist/index.js";
-const x = a((m, n) => {
-  const [o, i] = d(m), r = P(), p = I(), s = u(r.getItemProps(o), i), e = r.getItemState(o), c = r.getItemContentProps(o);
-  return /* @__PURE__ */ t(g, { value: o, children: /* @__PURE__ */ t(f, { value: e, children: /* @__PURE__ */ t(
-    l,
+const v = d((m, i) => {
+  const [o, n] = f()(m, ["value", "disabled"]), r = a(), p = g(), c = u(r.getItemProps(o), n), e = r.getItemState(o), s = r.getItemContentProps(o);
+  return /* @__PURE__ */ t(I, { value: o, children: /* @__PURE__ */ t(l, { value: e, children: /* @__PURE__ */ t(
+    P,
     {
-      ref: n,
+      ref: i,
       open: e.expanded,
-      ids: { content: c.id },
+      ids: { content: s.id },
       ...p,
-      ...s
+      ...c
     }
   ) }) });
 });
-x.displayName = "AccordionItem";
+v.displayName = "AccordionItem";
 export {
-  x as AccordionItem
+  v as AccordionItem
 };

package/dist/node_modules/@ark-ui/react/dist/components/accordion/use-accordion.js

@@ -1,24 +1,17 @@
-import { machine as u, connect as m } from "../../../../../@zag-js/accordion/dist/index.js";
-import { useMachine as s, normalizeProps as l } from "../../../../../@zag-js/react/dist/index.js";
-import { useId as d } from "react";
-import { useEnvironmentContext as f } from "../../providers/environment/use-environment-context.js";
-import { useLocaleContext as C } from "../../providers/locale/use-locale-context.js";
-import { useEvent as n } from "../../utils/use-event.js";
-const F = (o = {}) => {
-  const { getRootNode: t } = f(), { dir: a } = C(), e = {
-    id: d(),
-    dir: a,
-    getRootNode: t,
-    value: o.defaultValue,
+import { connect as i, machine as m } from "../../../../../@zag-js/accordion/dist/index.js";
+import { useMachine as s, normalizeProps as p } from "../../../../../@zag-js/react/dist/index.js";
+import { useId as u } from "react";
+import { useEnvironmentContext as a } from "../../providers/environment/use-environment-context.js";
+import { useLocaleContext as d } from "../../providers/locale/use-locale-context.js";
+const C = (o) => {
+  const t = u(), { getRootNode: e } = a(), { dir: r } = d(), n = {
+    id: t,
+    dir: r,
+    getRootNode: e,
     ...o
-  }, c = {
-    ...e,
-    value: o.value,
-    onFocusChange: n(o.onFocusChange),
-    onValueChange: n(o.onValueChange)
-  }, [i, r] = s(u(e), { context: c });
-  return m(i, r, l);
+  }, c = s(m, n);
+  return i(c, p);
 };
 export {
-  F as useAccordion
+  C as useAccordion
 };

package/dist/node_modules/@ark-ui/react/dist/components/avatar/avatar-root.js

@@ -6,11 +6,7 @@ import { useAvatar as v } from "./use-avatar.js";
 import { AvatarProvider as d } from "./use-avatar-context.js";
 import { mergeProps as n } from "../../../../../@zag-js/core/dist/index.js";
 const c = s((t, a) => {
-  const [e, m] = i()(t, [
-    "id",
-    "ids",
-    "onStatusChange"
-  ]), r = v(e), p = n(r.getRootProps(), m);
+  const [e, m] = i()(t, ["id", "ids", "onStatusChange"]), r = v(e), p = n(r.getRootProps(), m);
   return /* @__PURE__ */ o(d, { value: r, children: /* @__PURE__ */ o(f.div, { ...p, ref: a }) });
 });
 c.displayName = "AvatarRoot";

package/dist/node_modules/@ark-ui/react/dist/components/avatar/use-avatar.js

@@ -1,21 +1,17 @@
-import { machine as m, connect as a } from "../../../../../@zag-js/avatar/dist/index.js";
-import { useMachine as c, normalizeProps as u } from "../../../../../@zag-js/react/dist/index.js";
-import { useId as f } from "react";
-import { useEnvironmentContext as p } from "../../providers/environment/use-environment-context.js";
-import { useLocaleContext as d } from "../../providers/locale/use-locale-context.js";
-import { useEvent as x } from "../../utils/use-event.js";
-const S = (t = {}) => {
-  const { getRootNode: n } = p(), { dir: e } = d(), o = {
-    id: f(),
-    dir: e,
-    getRootNode: n,
-    ...t
-  }, r = {
-    ...o,
-    onStatusChange: x(t.onStatusChange)
-  }, [s, i] = c(m(o), { context: r });
-  return a(s, i, u);
+import { machine as m, connect as s } from "../../../../../@zag-js/avatar/dist/index.js";
+import { useMachine as i, normalizeProps as p } from "../../../../../@zag-js/react/dist/index.js";
+import { useId as a } from "react";
+import { useEnvironmentContext as u } from "../../providers/environment/use-environment-context.js";
+import { useLocaleContext as f } from "../../providers/locale/use-locale-context.js";
+const C = (o) => {
+  const t = a(), { getRootNode: e } = u(), { dir: r } = f(), n = {
+    id: t,
+    dir: r,
+    getRootNode: e,
+    ...o
+  }, c = i(m, n);
+  return s(c, p);
 };
 export {
-  S as useAvatar
+  C as useAvatar
 };

package/dist/node_modules/@ark-ui/react/dist/components/checkbox/checkbox-hidden-input.js

@@ -4,12 +4,10 @@ import { ark as n } from "../factory.js";
 import { useFieldContext as s } from "../field/use-field-context.js";
 import { useCheckboxContext as d } from "./use-checkbox-context.js";
 import { mergeProps as c } from "../../../../../@zag-js/core/dist/index.js";
-const a = p(
-  (r, e) => {
-    const t = d(), i = c(t.getHiddenInputProps(), r), o = s();
-    return /* @__PURE__ */ m(n.input, { "aria-describedby": o == null ? void 0 : o.ariaDescribedby, ...i, ref: e });
-  }
-);
+const a = p((r, e) => {
+  const t = d(), i = c(t.getHiddenInputProps(), r), o = s();
+  return /* @__PURE__ */ m(n.input, { "aria-describedby": o == null ? void 0 : o.ariaDescribedby, ...i, ref: e });
+});
 a.displayName = "CheckboxHiddenInput";
 export {
   a as CheckboxHiddenInput

package/dist/node_modules/@ark-ui/react/dist/components/checkbox/use-checkbox.js

@@ -1,34 +1,28 @@
-import { machine as u, connect as d } from "../../../../../@zag-js/checkbox/dist/index.js";
-import { useMachine as p, normalizeProps as h } from "../../../../../@zag-js/react/dist/index.js";
-import { useMemo as C, useId as x } from "react";
-import { useEnvironmentContext as k } from "../../providers/environment/use-environment-context.js";
-import { useLocaleContext as l } from "../../providers/locale/use-locale-context.js";
-import { useEvent as v } from "../../utils/use-event.js";
-import { useFieldContext as b } from "../field/use-field-context.js";
-import { useCheckboxGroupContext as g } from "./use-checkbox-group-context.js";
-import { mergeProps as y } from "../../../../../@zag-js/core/dist/index.js";
-const P = (n = {}) => {
-  const o = g(), e = b(), t = C(() => y(n, (o == null ? void 0 : o.getItemProps({ value: n.value })) ?? {}), [n, o]), { getRootNode: s } = k(), { dir: c } = l(), r = {
-    id: x(),
+import { machine as a, connect as u } from "../../../../../@zag-js/checkbox/dist/index.js";
+import { useMachine as p, normalizeProps as d } from "../../../../../@zag-js/react/dist/index.js";
+import { useMemo as v, useId as x } from "react";
+import { useEnvironmentContext as C } from "../../providers/environment/use-environment-context.js";
+import { useLocaleContext as b } from "../../providers/locale/use-locale-context.js";
+import { useFieldContext as h } from "../field/use-field-context.js";
+import { useCheckboxGroupContext as l } from "./use-checkbox-group-context.js";
+import { mergeProps as g } from "../../../../../@zag-js/core/dist/index.js";
+const E = (t = {}) => {
+  const r = l(), o = h(), e = v(() => g(t, (r == null ? void 0 : r.getItemProps({ value: t.value })) ?? {}), [t, r]), n = x(), { getRootNode: s } = C(), { dir: m } = b(), i = {
+    id: n,
     ids: {
-      label: e == null ? void 0 : e.ids.label,
-      hiddenInput: e == null ? void 0 : e.ids.control
+      label: o == null ? void 0 : o.ids.label,
+      hiddenInput: o == null ? void 0 : o.ids.control
     },
-    dir: c,
-    disabled: e == null ? void 0 : e.disabled,
-    readOnly: e == null ? void 0 : e.readOnly,
-    invalid: e == null ? void 0 : e.invalid,
-    required: e == null ? void 0 : e.required,
+    dir: m,
+    disabled: o == null ? void 0 : o.disabled,
+    readOnly: o == null ? void 0 : o.readOnly,
+    invalid: o == null ? void 0 : o.invalid,
+    required: o == null ? void 0 : o.required,
     getRootNode: s,
-    checked: t.defaultChecked,
-    ...t
-  }, m = {
-    ...r,
-    checked: t.checked,
-    onCheckedChange: v(t.onCheckedChange, { sync: !0 })
-  }, [i, a] = p(u(r), { context: m });
-  return d(i, a, h);
+    ...e
+  }, c = p(a, i);
+  return u(c, d);
 };
 export {
-  P as useCheckbox
+  E as useCheckbox
 };

package/dist/node_modules/@ark-ui/react/dist/components/collapsible/collapsible-content.js

@@ -3,15 +3,13 @@ import { forwardRef as n } from "react";
 import { ark as m } from "../factory.js";
 import { useCollapsibleContext as p } from "./use-collapsible-context.js";
 import { mergeProps as s } from "../../../../../@zag-js/core/dist/index.js";
-const i = n(
-  (r, t) => {
-    const o = p();
-    if (o.isUnmounted)
-      return null;
-    const e = s(o.getContentProps(), r);
-    return /* @__PURE__ */ l(m.div, { ...e, ref: t });
-  }
-);
+const i = n((r, t) => {
+  const o = p();
+  if (o.isUnmounted)
+    return null;
+  const e = s(o.getContentProps(), r);
+  return /* @__PURE__ */ l(m.div, { ...e, ref: t });
+});
 i.displayName = "CollapsibleContent";
 export {
   i as CollapsibleContent