@ark-ui/react 5.38.0 → 5.38.2

package/dist/components/collapsible/collapsible-indicator.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/collapsible/collapsible-indicator.tsx
 var CollapsibleIndicator = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useCollapsibleContext().getIndicatorProps(), props);
+	const collapsible = useCollapsibleContext();
+	const mergedProps = mergeProps(collapsible.getIndicatorProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/collapsible/collapsible-trigger.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/collapsible/collapsible-trigger.tsx
 var CollapsibleTrigger = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_collapsible_context.useCollapsibleContext().getTriggerProps(), props);
+	const collapsible = require_use_collapsible_context.useCollapsibleContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(collapsible.getTriggerProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.button, {
 		...mergedProps,
 		ref

package/dist/components/collapsible/collapsible-trigger.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/collapsible/collapsible-trigger.tsx
 var CollapsibleTrigger = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useCollapsibleContext().getTriggerProps(), props);
+	const collapsible = useCollapsibleContext();
+	const mergedProps = mergeProps(collapsible.getTriggerProps(), props);
 	return /* @__PURE__ */ jsx(ark.button, {
 		...mergedProps,
 		ref

package/dist/components/collapsible/use-collapsible.cjs

@@ -1,5 +1,6 @@
 "use client";
 const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+const require_react_activity = require("../../utils/react-activity.cjs");
 const require_use_environment_context = require("../../providers/environment/use-environment-context.cjs");
 const require_use_locale_context = require("../../providers/locale/use-locale-context.cjs");
 let _zag_js_collapsible = require("@zag-js/collapsible");
@@ -7,7 +8,6 @@ _zag_js_collapsible = require_runtime.__toESM(_zag_js_collapsible, 1);
 let react = require("react");
 let _zag_js_react = require("@zag-js/react");
 //#region src/components/collapsible/use-collapsible.ts
-var supportsActivity = typeof react.Activity !== "undefined";
 var useCollapsible = (props = {}) => {
 	const { lazyMount, unmountOnExit, hideMode = "display-none", ...collapsibleProps } = props;
 	const id = (0, react.useId)();
@@ -24,7 +24,7 @@ var useCollapsible = (props = {}) => {
 	const api = _zag_js_collapsible.connect(service, _zag_js_react.normalizeProps);
 	if (api.visible) wasVisible.current = true;
 	const isUnmounted = !api.visible && !wasVisible.current && lazyMount || unmountOnExit && !api.visible && wasVisible.current;
-	const resolvedHideMode = hideMode === "activity" && supportsActivity ? "activity" : "display-none";
+	const resolvedHideMode = hideMode === "activity" && require_react_activity.supportsActivity ? "activity" : "display-none";
 	return {
 		...api,
 		isUnmounted,

package/dist/components/collapsible/use-collapsible.js

@@ -1,11 +1,11 @@
 "use client";
+import { supportsActivity } from "../../utils/react-activity.js";
 import { useEnvironmentContext } from "../../providers/environment/use-environment-context.js";
 import { useLocaleContext } from "../../providers/locale/use-locale-context.js";
 import * as collapsible from "@zag-js/collapsible";
-import { Activity, useId, useRef } from "react";
+import { useId, useRef } from "react";
 import { normalizeProps, useMachine } from "@zag-js/react";
 //#region src/components/collapsible/use-collapsible.ts
-var supportsActivity = typeof Activity !== "undefined";
 var useCollapsible = (props = {}) => {
 	const { lazyMount, unmountOnExit, hideMode = "display-none", ...collapsibleProps } = props;
 	const id = useId();

package/dist/components/color-picker/color-picker-area.cjs

@@ -10,7 +10,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitAreaProps = require_create_split_props.createSplitProps();
 var ColorPickerArea = (0, react.forwardRef)((props, ref) => {
 	const [areaProps, localProps] = splitAreaProps(props, ["xChannel", "yChannel"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getAreaProps(areaProps), localProps);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getAreaProps(areaProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_color_picker_area_props_context.ColorPickerAreaPropsProvider, {
 		value: areaProps,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {

package/dist/components/color-picker/color-picker-area.js

@@ -10,7 +10,8 @@ import { jsx } from "react/jsx-runtime";
 var splitAreaProps = createSplitProps();
 var ColorPickerArea = forwardRef((props, ref) => {
 	const [areaProps, localProps] = splitAreaProps(props, ["xChannel", "yChannel"]);
-	const mergedProps = mergeProps(useColorPickerContext().getAreaProps(areaProps), localProps);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getAreaProps(areaProps), localProps);
 	return /* @__PURE__ */ jsx(ColorPickerAreaPropsProvider, {
 		value: areaProps,
 		children: /* @__PURE__ */ jsx(ark.div, {

package/dist/components/color-picker/color-picker-channel-input.cjs

@@ -9,7 +9,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitChannelInputProps = require_create_split_props.createSplitProps();
 var ColorPickerChannelInput = (0, react.forwardRef)((props, ref) => {
 	const [channelProps, localProps] = splitChannelInputProps(props, ["channel", "orientation"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getChannelInputProps(channelProps), localProps);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getChannelInputProps(channelProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.input, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-channel-input.js

@@ -9,7 +9,8 @@ import { jsx } from "react/jsx-runtime";
 var splitChannelInputProps = createSplitProps();
 var ColorPickerChannelInput = forwardRef((props, ref) => {
 	const [channelProps, localProps] = splitChannelInputProps(props, ["channel", "orientation"]);
-	const mergedProps = mergeProps(useColorPickerContext().getChannelInputProps(channelProps), localProps);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getChannelInputProps(channelProps), localProps);
 	return /* @__PURE__ */ jsx(ark.input, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-control.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-control.tsx
 var ColorPickerControl = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getControlProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getControlProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-control.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-control.tsx
 var ColorPickerControl = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getControlProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getControlProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-eye-dropper-trigger.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-eye-dropper-trigger.tsx
 var ColorPickerEyeDropperTrigger = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getEyeDropperTriggerProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getEyeDropperTriggerProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.button, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-eye-dropper-trigger.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-eye-dropper-trigger.tsx
 var ColorPickerEyeDropperTrigger = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getEyeDropperTriggerProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getEyeDropperTriggerProps(), props);
 	return /* @__PURE__ */ jsx(ark.button, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-format-select.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-format-select.tsx
 var ColorPickerFormatSelect = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getFormatSelectProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getFormatSelectProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.select, {
 		...mergedProps,
 		ref,

package/dist/components/color-picker/color-picker-format-select.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-format-select.tsx
 var ColorPickerFormatSelect = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getFormatSelectProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getFormatSelectProps(), props);
 	return /* @__PURE__ */ jsx(ark.select, {
 		...mergedProps,
 		ref,

package/dist/components/color-picker/color-picker-format-trigger.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-format-trigger.tsx
 var ColorPickerFormatTrigger = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getFormatTriggerProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getFormatTriggerProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.button, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-format-trigger.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-format-trigger.tsx
 var ColorPickerFormatTrigger = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getFormatTriggerProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getFormatTriggerProps(), props);
 	return /* @__PURE__ */ jsx(ark.button, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-hidden-input.cjs

@@ -7,7 +7,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-hidden-input.tsx
 var ColorPickerHiddenInput = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getHiddenInputProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getHiddenInputProps(), props);
 	const field = require_use_field_context.useFieldContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.input, {
 		"aria-describedby": field?.ariaDescribedby,

package/dist/components/color-picker/color-picker-hidden-input.js

@@ -7,7 +7,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-hidden-input.tsx
 var ColorPickerHiddenInput = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getHiddenInputProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getHiddenInputProps(), props);
 	const field = useFieldContext();
 	return /* @__PURE__ */ jsx(ark.input, {
 		"aria-describedby": field?.ariaDescribedby,

package/dist/components/color-picker/color-picker-label.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-label.tsx
 var ColorPickerLabel = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getLabelProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getLabelProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.label, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-label.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-label.tsx
 var ColorPickerLabel = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getLabelProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getLabelProps(), props);
 	return /* @__PURE__ */ jsx(ark.label, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-positioner.cjs

@@ -7,7 +7,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-positioner.tsx
 var ColorPickerPositioner = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getPositionerProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getPositionerProps(), props);
 	if (require_use_presence_context.usePresenceContext().unmounted) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,

package/dist/components/color-picker/color-picker-positioner.js

@@ -7,7 +7,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-positioner.tsx
 var ColorPickerPositioner = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getPositionerProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getPositionerProps(), props);
 	if (usePresenceContext().unmounted) return null;
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,

package/dist/components/color-picker/color-picker-swatch-group.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-swatch-group.tsx
 var ColorPickerSwatchGroup = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getSwatchGroupProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getSwatchGroupProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-swatch-group.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-swatch-group.tsx
 var ColorPickerSwatchGroup = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getSwatchGroupProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getSwatchGroupProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-swatch-trigger.cjs

@@ -9,7 +9,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitSwatchTriggerProps = require_create_split_props.createSplitProps();
 var ColorPickerSwatchTrigger = (0, react.forwardRef)((props, ref) => {
 	const [triggerProps, localProps] = splitSwatchTriggerProps(props, ["value", "disabled"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getSwatchTriggerProps(triggerProps), localProps);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getSwatchTriggerProps(triggerProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.button, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-swatch-trigger.js

@@ -9,7 +9,8 @@ import { jsx } from "react/jsx-runtime";
 var splitSwatchTriggerProps = createSplitProps();
 var ColorPickerSwatchTrigger = forwardRef((props, ref) => {
 	const [triggerProps, localProps] = splitSwatchTriggerProps(props, ["value", "disabled"]);
-	const mergedProps = mergeProps(useColorPickerContext().getSwatchTriggerProps(triggerProps), localProps);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getSwatchTriggerProps(triggerProps), localProps);
 	return /* @__PURE__ */ jsx(ark.button, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-swatch.cjs

@@ -10,7 +10,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitSwatchProps = require_create_split_props.createSplitProps();
 var ColorPickerSwatch = (0, react.forwardRef)((props, ref) => {
 	const [swatwchProps, localProps] = splitSwatchProps(props, ["respectAlpha", "value"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getSwatchProps(swatwchProps), localProps);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getSwatchProps(swatwchProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_color_picker_swatch_props_context.ColorPickerSwatchPropsProvider, {
 		value: swatwchProps,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {

package/dist/components/color-picker/color-picker-swatch.js

@@ -10,7 +10,8 @@ import { jsx } from "react/jsx-runtime";
 var splitSwatchProps = createSplitProps();
 var ColorPickerSwatch = forwardRef((props, ref) => {
 	const [swatwchProps, localProps] = splitSwatchProps(props, ["respectAlpha", "value"]);
-	const mergedProps = mergeProps(useColorPickerContext().getSwatchProps(swatwchProps), localProps);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getSwatchProps(swatwchProps), localProps);
 	return /* @__PURE__ */ jsx(ColorPickerSwatchPropsProvider, {
 		value: swatwchProps,
 		children: /* @__PURE__ */ jsx(ark.div, {

package/dist/components/color-picker/color-picker-transparency-grid.cjs

@@ -9,7 +9,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitTransparencyGridProps = require_create_split_props.createSplitProps();
 var ColorPickerTransparencyGrid = (0, react.forwardRef)((props, ref) => {
 	const [gridProps, localProps] = splitTransparencyGridProps(props, ["size"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getTransparencyGridProps(gridProps), localProps);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getTransparencyGridProps(gridProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-transparency-grid.js

@@ -9,7 +9,8 @@ import { jsx } from "react/jsx-runtime";
 var splitTransparencyGridProps = createSplitProps();
 var ColorPickerTransparencyGrid = forwardRef((props, ref) => {
 	const [gridProps, localProps] = splitTransparencyGridProps(props, ["size"]);
-	const mergedProps = mergeProps(useColorPickerContext().getTransparencyGridProps(gridProps), localProps);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getTransparencyGridProps(gridProps), localProps);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-trigger.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/color-picker/color-picker-trigger.tsx
 var ColorPickerTrigger = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_color_picker_context.useColorPickerContext().getTriggerProps(), props);
+	const colorPicker = require_use_color_picker_context.useColorPickerContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(colorPicker.getTriggerProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.button, {
 		...mergedProps,
 		ref

package/dist/components/color-picker/color-picker-trigger.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/color-picker/color-picker-trigger.tsx
 var ColorPickerTrigger = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useColorPickerContext().getTriggerProps(), props);
+	const colorPicker = useColorPickerContext();
+	const mergedProps = mergeProps(colorPicker.getTriggerProps(), props);
 	return /* @__PURE__ */ jsx(ark.button, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-clear-trigger.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/combobox/combobox-clear-trigger.tsx
 var ComboboxClearTrigger = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_combobox_context.useComboboxContext().getClearTriggerProps(), props);
+	const combobox = require_use_combobox_context.useComboboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getClearTriggerProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.button, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-clear-trigger.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/combobox/combobox-clear-trigger.tsx
 var ComboboxClearTrigger = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useComboboxContext().getClearTriggerProps(), props);
+	const combobox = useComboboxContext();
+	const mergedProps = mergeProps(combobox.getClearTriggerProps(), props);
 	return /* @__PURE__ */ jsx(ark.button, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-control.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/combobox/combobox-control.tsx
 var ComboboxControl = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_combobox_context.useComboboxContext().getControlProps(), props);
+	const combobox = require_use_combobox_context.useComboboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getControlProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-control.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/combobox/combobox-control.tsx
 var ComboboxControl = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useComboboxContext().getControlProps(), props);
+	const combobox = useComboboxContext();
+	const mergedProps = mergeProps(combobox.getControlProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-input.cjs

@@ -7,7 +7,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/combobox/combobox-input.tsx
 var ComboboxInput = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_combobox_context.useComboboxContext().getInputProps(), props);
+	const combobox = require_use_combobox_context.useComboboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getInputProps(), props);
 	const field = require_use_field_context.useFieldContext();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.input, {
 		"aria-describedby": field?.ariaDescribedby,

package/dist/components/combobox/combobox-input.js

@@ -7,7 +7,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/combobox/combobox-input.tsx
 var ComboboxInput = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useComboboxContext().getInputProps(), props);
+	const combobox = useComboboxContext();
+	const mergedProps = mergeProps(combobox.getInputProps(), props);
 	const field = useFieldContext();
 	return /* @__PURE__ */ jsx(ark.input, {
 		"aria-describedby": field?.ariaDescribedby,

package/dist/components/combobox/combobox-item-group.cjs

@@ -15,7 +15,8 @@ var ComboboxItemGroup = (0, react.forwardRef)((props, ref) => {
 		id,
 		..._itemGroupProps
 	};
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_combobox_context.useComboboxContext().getItemGroupProps(itemGroupProps), localProps);
+	const combobox = require_use_combobox_context.useComboboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getItemGroupProps(itemGroupProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_combobox_item_group_props_context.ComboboxItemGroupPropsProvider, {
 		value: itemGroupProps,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {

package/dist/components/combobox/combobox-item-group.js

@@ -15,7 +15,8 @@ var ComboboxItemGroup = forwardRef((props, ref) => {
 		id,
 		..._itemGroupProps
 	};
-	const mergedProps = mergeProps(useComboboxContext().getItemGroupProps(itemGroupProps), localProps);
+	const combobox = useComboboxContext();
+	const mergedProps = mergeProps(combobox.getItemGroupProps(itemGroupProps), localProps);
 	return /* @__PURE__ */ jsx(ComboboxItemGroupPropsProvider, {
 		value: itemGroupProps,
 		children: /* @__PURE__ */ jsx(ark.div, {

package/dist/components/combobox/combobox-item.cjs

@@ -13,10 +13,11 @@ var ComboboxItem = (0, react.forwardRef)((props, ref) => {
 	const [itemProps, localProps] = splitItemProps(props, ["item", "persistFocus"]);
 	const combobox = require_use_combobox_context.useComboboxContext();
 	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getItemProps(itemProps), localProps);
+	const itemState = combobox.getItemState(itemProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_combobox_item_props_context.ComboboxItemPropsProvider, {
 		value: itemProps,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_combobox_item_context.ComboboxItemProvider, {
-			value: combobox.getItemState(itemProps),
+			value: itemState,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 				...mergedProps,
 				ref

package/dist/components/combobox/combobox-item.js

@@ -13,10 +13,11 @@ var ComboboxItem = forwardRef((props, ref) => {
 	const [itemProps, localProps] = splitItemProps(props, ["item", "persistFocus"]);
 	const combobox = useComboboxContext();
 	const mergedProps = mergeProps(combobox.getItemProps(itemProps), localProps);
+	const itemState = combobox.getItemState(itemProps);
 	return /* @__PURE__ */ jsx(ComboboxItemPropsProvider, {
 		value: itemProps,
 		children: /* @__PURE__ */ jsx(ComboboxItemProvider, {
-			value: combobox.getItemState(itemProps),
+			value: itemState,
 			children: /* @__PURE__ */ jsx(ark.div, {
 				...mergedProps,
 				ref

package/dist/components/combobox/combobox-label.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/combobox/combobox-label.tsx
 var ComboboxLabel = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_combobox_context.useComboboxContext().getLabelProps(), props);
+	const combobox = require_use_combobox_context.useComboboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getLabelProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.label, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-label.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/combobox/combobox-label.tsx
 var ComboboxLabel = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useComboboxContext().getLabelProps(), props);
+	const combobox = useComboboxContext();
+	const mergedProps = mergeProps(combobox.getLabelProps(), props);
 	return /* @__PURE__ */ jsx(ark.label, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-list.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/combobox/combobox-list.tsx
 var ComboboxList = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_combobox_context.useComboboxContext().getListProps(), props);
+	const combobox = require_use_combobox_context.useComboboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getListProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-list.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/combobox/combobox-list.tsx
 var ComboboxList = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useComboboxContext().getListProps(), props);
+	const combobox = useComboboxContext();
+	const mergedProps = mergeProps(combobox.getListProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-trigger.cjs

@@ -9,7 +9,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitTriggerProps = require_create_split_props.createSplitProps();
 var ComboboxTrigger = (0, react.forwardRef)((props, ref) => {
 	const [triggerProps, localProps] = splitTriggerProps(props, ["focusable"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_combobox_context.useComboboxContext().getTriggerProps(triggerProps), localProps);
+	const combobox = require_use_combobox_context.useComboboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(combobox.getTriggerProps(triggerProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.button, {
 		...mergedProps,
 		ref

package/dist/components/combobox/combobox-trigger.js

@@ -9,7 +9,8 @@ import { jsx } from "react/jsx-runtime";
 var splitTriggerProps = createSplitProps();
 var ComboboxTrigger = forwardRef((props, ref) => {
 	const [triggerProps, localProps] = splitTriggerProps(props, ["focusable"]);
-	const mergedProps = mergeProps(useComboboxContext().getTriggerProps(triggerProps), localProps);
+	const combobox = useComboboxContext();
+	const mergedProps = mergeProps(combobox.getTriggerProps(triggerProps), localProps);
 	return /* @__PURE__ */ jsx(ark.button, {
 		...mergedProps,
 		ref

package/dist/components/date-input/date-input-control.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/date-input/date-input-control.tsx
 var DateInputControl = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_date_input_context.useDateInputContext().getControlProps(), props);
+	const dateInput = require_use_date_input_context.useDateInputContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(dateInput.getControlProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/date-input/date-input-control.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/date-input/date-input-control.tsx
 var DateInputControl = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useDateInputContext().getControlProps(), props);
+	const dateInput = useDateInputContext();
+	const mergedProps = mergeProps(dateInput.getControlProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref