@ark-ui/react 5.38.1 → 5.38.2

package/dist/components/format/format-relative-time.js

@@ -6,10 +6,11 @@ import { formatRelativeTime } from "@zag-js/i18n-utils";
 //#region src/components/format/format-relative-time.tsx
 var FormatRelativeTime = (props) => {
 	const { locale } = useLocaleContext();
-	return /* @__PURE__ */ jsx(Fragment$1, { children: useMemo(() => {
+	const text = useMemo(() => {
 		const { value, ...intlOptions } = props;
 		return formatRelativeTime(value, locale, intlOptions);
-	}, [props, locale]) });
+	}, [props, locale]);
+	return /* @__PURE__ */ jsx(Fragment$1, { children: text });
 };
 FormatRelativeTime.displayName = "FormatRelativeTime";
 //#endregion

package/dist/components/format/format-time.cjs

@@ -6,10 +6,11 @@ let _zag_js_i18n_utils = require("@zag-js/i18n-utils");
 //#region src/components/format/format-time.tsx
 var FormatTime = (props) => {
 	const { locale } = require_use_locale_context.useLocaleContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: (0, react.useMemo)(() => {
+	const text = (0, react.useMemo)(() => {
 		const { value, ...intlOptions } = props;
 		return (0, _zag_js_i18n_utils.formatTime)(value, locale, intlOptions);
-	}, [props, locale]) });
+	}, [props, locale]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: text });
 };
 FormatTime.displayName = "FormatTime";
 //#endregion

package/dist/components/format/format-time.js

@@ -6,10 +6,11 @@ import { formatTime } from "@zag-js/i18n-utils";
 //#region src/components/format/format-time.tsx
 var FormatTime = (props) => {
 	const { locale } = useLocaleContext();
-	return /* @__PURE__ */ jsx(Fragment$1, { children: useMemo(() => {
+	const text = useMemo(() => {
 		const { value, ...intlOptions } = props;
 		return formatTime(value, locale, intlOptions);
-	}, [props, locale]) });
+	}, [props, locale]);
+	return /* @__PURE__ */ jsx(Fragment$1, { children: text });
 };
 FormatTime.displayName = "FormatTime";
 //#endregion

package/dist/components/highlight/highlight.cjs

@@ -13,7 +13,8 @@ var Highlight = (props) => {
 		"matchAll",
 		"exactMatch"
 	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, { children: require_use_highlight.useHighlight(highlightProps).map(({ text, match }, i) => match ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("mark", {
+	const chunks = require_use_highlight.useHighlight(highlightProps);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, { children: chunks.map(({ text, match }, i) => match ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("mark", {
 		...localProps,
 		children: text
 	}, i) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, { children: text }, i)) });

package/dist/components/highlight/highlight.js

@@ -13,7 +13,8 @@ var Highlight = (props) => {
 		"matchAll",
 		"exactMatch"
 	]);
-	return /* @__PURE__ */ jsx(Fragment, { children: useHighlight(highlightProps).map(({ text, match }, i) => match ? /* @__PURE__ */ jsx("mark", {
+	const chunks = useHighlight(highlightProps);
+	return /* @__PURE__ */ jsx(Fragment, { children: chunks.map(({ text, match }, i) => match ? /* @__PURE__ */ jsx("mark", {
 		...localProps,
 		children: text
 	}, i) : /* @__PURE__ */ jsx(Fragment, { children: text }, i)) });

package/dist/components/hover-card/hover-card-arrow-tip.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/hover-card/hover-card-arrow-tip.tsx
 var HoverCardArrowTip = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_hover_card_context.useHoverCardContext().getArrowTipProps(), props);
+	const hoverCard = require_use_hover_card_context.useHoverCardContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(hoverCard.getArrowTipProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/hover-card/hover-card-arrow-tip.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/hover-card/hover-card-arrow-tip.tsx
 var HoverCardArrowTip = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useHoverCardContext().getArrowTipProps(), props);
+	const hoverCard = useHoverCardContext();
+	const mergedProps = mergeProps(hoverCard.getArrowTipProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/hover-card/hover-card-arrow.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/hover-card/hover-card-arrow.tsx
 var HoverCardArrow = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_hover_card_context.useHoverCardContext().getArrowProps(), props);
+	const hoverCard = require_use_hover_card_context.useHoverCardContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(hoverCard.getArrowProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/hover-card/hover-card-arrow.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/hover-card/hover-card-arrow.tsx
 var HoverCardArrow = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useHoverCardContext().getArrowProps(), props);
+	const hoverCard = useHoverCardContext();
+	const mergedProps = mergeProps(hoverCard.getArrowProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/hover-card/hover-card-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/hover-card/hover-card-positioner.tsx
 var HoverCardPositioner = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_hover_card_context.useHoverCardContext().getPositionerProps(), props);
+	const hoverCard = require_use_hover_card_context.useHoverCardContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(hoverCard.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/hover-card/hover-card-positioner.js

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

package/dist/components/hover-card/hover-card-root-provider.cjs

@@ -8,10 +8,11 @@ let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/hover-card/hover-card-root-provider.tsx
 var HoverCardRootProvider = (props) => {
 	const [presenceProps, { value: hoverCard, children }] = require_split_presence_props.splitPresenceProps(props);
+	const presence = require_use_presence.usePresence((0, _zag_js_react.mergeProps)({ present: hoverCard.open }, presenceProps));
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_hover_card_context.HoverCardProvider, {
 		value: hoverCard,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_presence_context.PresenceProvider, {
-			value: require_use_presence.usePresence((0, _zag_js_react.mergeProps)({ present: hoverCard.open }, presenceProps)),
+			value: presence,
 			children
 		})
 	});

package/dist/components/hover-card/hover-card-root-provider.js

@@ -8,10 +8,11 @@ import { jsx } from "react/jsx-runtime";
 //#region src/components/hover-card/hover-card-root-provider.tsx
 var HoverCardRootProvider = (props) => {
 	const [presenceProps, { value: hoverCard, children }] = splitPresenceProps(props);
+	const presence = usePresence(mergeProps({ present: hoverCard.open }, presenceProps));
 	return /* @__PURE__ */ jsx(HoverCardProvider, {
 		value: hoverCard,
 		children: /* @__PURE__ */ jsx(PresenceProvider, {
-			value: usePresence(mergeProps({ present: hoverCard.open }, presenceProps)),
+			value: presence,
 			children
 		})
 	});

package/dist/components/hover-card/hover-card-root.cjs

@@ -10,10 +10,11 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var HoverCardRoot = (props) => {
 	const [presenceProps, { children, ...localProps }] = require_split_presence_props.splitPresenceProps(props);
 	const hoverCard = require_use_hover_card.useHoverCard(localProps);
+	const presence = require_use_presence.usePresence((0, _zag_js_react.mergeProps)({ present: hoverCard.open }, presenceProps));
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_hover_card_context.HoverCardProvider, {
 		value: hoverCard,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_presence_context.PresenceProvider, {
-			value: require_use_presence.usePresence((0, _zag_js_react.mergeProps)({ present: hoverCard.open }, presenceProps)),
+			value: presence,
 			children
 		})
 	});

package/dist/components/hover-card/hover-card-root.js

@@ -10,10 +10,11 @@ import { jsx } from "react/jsx-runtime";
 var HoverCardRoot = (props) => {
 	const [presenceProps, { children, ...localProps }] = splitPresenceProps(props);
 	const hoverCard = useHoverCard(localProps);
+	const presence = usePresence(mergeProps({ present: hoverCard.open }, presenceProps));
 	return /* @__PURE__ */ jsx(HoverCardProvider, {
 		value: hoverCard,
 		children: /* @__PURE__ */ jsx(PresenceProvider, {
-			value: usePresence(mergeProps({ present: hoverCard.open }, presenceProps)),
+			value: presence,
 			children
 		})
 	});

package/dist/components/hover-card/hover-card-trigger.cjs

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

package/dist/components/hover-card/hover-card-trigger.js

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

package/dist/components/image-cropper/image-cropper-grid.cjs

@@ -7,7 +7,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/image-cropper/image-cropper-grid.tsx
 var ImageCropperGrid = (0, react.forwardRef)((props, ref) => {
 	const { axis, ...localProps } = props;
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_image_cropper_context.useImageCropperContext().getGridProps({ axis }), localProps);
+	const imageCropper = require_use_image_cropper_context.useImageCropperContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(imageCropper.getGridProps({ axis }), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-grid.js

@@ -7,7 +7,8 @@ import { jsx } from "react/jsx-runtime";
 //#region src/components/image-cropper/image-cropper-grid.tsx
 var ImageCropperGrid = forwardRef((props, ref) => {
 	const { axis, ...localProps } = props;
-	const mergedProps = mergeProps(useImageCropperContext().getGridProps({ axis }), localProps);
+	const imageCropper = useImageCropperContext();
+	const mergedProps = mergeProps(imageCropper.getGridProps({ axis }), localProps);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-handle.cjs

@@ -7,7 +7,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/image-cropper/image-cropper-handle.tsx
 var ImageCropperHandle = (0, react.forwardRef)((props, ref) => {
 	const { position, ...localProps } = props;
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_image_cropper_context.useImageCropperContext().getHandleProps({ position }), localProps);
+	const imageCropper = require_use_image_cropper_context.useImageCropperContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(imageCropper.getHandleProps({ position }), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-handle.js

@@ -7,7 +7,8 @@ import { jsx } from "react/jsx-runtime";
 //#region src/components/image-cropper/image-cropper-handle.tsx
 var ImageCropperHandle = forwardRef((props, ref) => {
 	const { position, ...localProps } = props;
-	const mergedProps = mergeProps(useImageCropperContext().getHandleProps({ position }), localProps);
+	const imageCropper = useImageCropperContext();
+	const mergedProps = mergeProps(imageCropper.getHandleProps({ position }), localProps);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-image.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/image-cropper/image-cropper-image.tsx
 var ImageCropperImage = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_image_cropper_context.useImageCropperContext().getImageProps(), props);
+	const imageCropper = require_use_image_cropper_context.useImageCropperContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(imageCropper.getImageProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.img, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-image.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/image-cropper/image-cropper-image.tsx
 var ImageCropperImage = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useImageCropperContext().getImageProps(), props);
+	const imageCropper = useImageCropperContext();
+	const mergedProps = mergeProps(imageCropper.getImageProps(), props);
 	return /* @__PURE__ */ jsx(ark.img, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-selection.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/image-cropper/image-cropper-selection.tsx
 var ImageCropperSelection = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_image_cropper_context.useImageCropperContext().getSelectionProps(), props);
+	const imageCropper = require_use_image_cropper_context.useImageCropperContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(imageCropper.getSelectionProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-selection.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/image-cropper/image-cropper-selection.tsx
 var ImageCropperSelection = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useImageCropperContext().getSelectionProps(), props);
+	const imageCropper = useImageCropperContext();
+	const mergedProps = mergeProps(imageCropper.getSelectionProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-viewport.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/image-cropper/image-cropper-viewport.tsx
 var ImageCropperViewport = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_image_cropper_context.useImageCropperContext().getViewportProps(), props);
+	const imageCropper = require_use_image_cropper_context.useImageCropperContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(imageCropper.getViewportProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/image-cropper/image-cropper-viewport.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/image-cropper/image-cropper-viewport.tsx
 var ImageCropperViewport = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useImageCropperContext().getViewportProps(), props);
+	const imageCropper = useImageCropperContext();
+	const mergedProps = mergeProps(imageCropper.getViewportProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/json-tree-view/json-tree-view-root.js

@@ -25,14 +25,15 @@ var JsonTreeViewRoot = forwardRef((props, ref) => {
 			rootNode: getRootNode(data)
 		});
 	}, [data]);
+	const defaultExpandedValue = useMemo(() => {
+		return defaultExpandedDepth != null ? getBranchValues(collection, defaultExpandedDepth) : void 0;
+	}, [collection, defaultExpandedDepth]);
 	return /* @__PURE__ */ jsx(JsonTreeViewPropsProvider, {
 		value: jsonTreeProps,
 		children: /* @__PURE__ */ jsx(TreeViewRoot, {
 			"data-scope": "json-tree-view",
 			collection,
-			defaultExpandedValue: useMemo(() => {
-				return defaultExpandedDepth != null ? getBranchValues(collection, defaultExpandedDepth) : void 0;
-			}, [collection, defaultExpandedDepth]),
+			defaultExpandedValue,
 			...restProps,
 			ref
 		})

package/dist/components/json-tree-view/use-json-tree-view.cjs

@@ -23,11 +23,12 @@ var useJsonTreeView = (props) => {
 			rootNode: (0, _zag_js_json_tree_utils.getRootNode)(data)
 		});
 	}, [data]);
+	const defaultExpandedValue = (0, react.useMemo)(() => {
+		return defaultExpandedDepth != null ? require_get_branch_value.getBranchValues(collection, defaultExpandedDepth) : void 0;
+	}, [collection, defaultExpandedDepth]);
 	return {
 		...require_use_tree_view.useTreeView({
-			defaultExpandedValue: (0, react.useMemo)(() => {
-				return defaultExpandedDepth != null ? require_get_branch_value.getBranchValues(collection, defaultExpandedDepth) : void 0;
-			}, [collection, defaultExpandedDepth]),
+			defaultExpandedValue,
 			...restProps,
 			collection,
 			typeahead: false

package/dist/components/json-tree-view/use-json-tree-view.js

@@ -23,11 +23,12 @@ var useJsonTreeView = (props) => {
 			rootNode: getRootNode(data)
 		});
 	}, [data]);
+	const defaultExpandedValue = useMemo(() => {
+		return defaultExpandedDepth != null ? getBranchValues(collection, defaultExpandedDepth) : void 0;
+	}, [collection, defaultExpandedDepth]);
 	return {
 		...useTreeView({
-			defaultExpandedValue: useMemo(() => {
-				return defaultExpandedDepth != null ? getBranchValues(collection, defaultExpandedDepth) : void 0;
-			}, [collection, defaultExpandedDepth]),
+			defaultExpandedValue,
 			...restProps,
 			collection,
 			typeahead: false

package/dist/components/listbox/listbox-content.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/listbox/listbox-content.tsx
 var ListboxContent = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_listbox_context.useListboxContext().getContentProps(), props);
+	const listbox = require_use_listbox_context.useListboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(listbox.getContentProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/listbox/listbox-content.js

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

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

@@ -9,7 +9,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitInputProps = require_create_split_props.createSplitProps();
 var ListboxInput = (0, react.forwardRef)((props, ref) => {
 	const [inputProps, localProps] = splitInputProps(props, ["autoHighlight", "keyboardPriority"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_listbox_context.useListboxContext().getInputProps(inputProps), localProps);
+	const listbox = require_use_listbox_context.useListboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(listbox.getInputProps(inputProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.input, {
 		...mergedProps,
 		ref

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

@@ -9,7 +9,8 @@ import { jsx } from "react/jsx-runtime";
 var splitInputProps = createSplitProps();
 var ListboxInput = forwardRef((props, ref) => {
 	const [inputProps, localProps] = splitInputProps(props, ["autoHighlight", "keyboardPriority"]);
-	const mergedProps = mergeProps(useListboxContext().getInputProps(inputProps), localProps);
+	const listbox = useListboxContext();
+	const mergedProps = mergeProps(listbox.getInputProps(inputProps), localProps);
 	return /* @__PURE__ */ jsx(ark.input, {
 		...mergedProps,
 		ref

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

@@ -15,7 +15,8 @@ var ListboxItemGroup = (0, react.forwardRef)((props, ref) => {
 		id,
 		..._itemGroupProps
 	};
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_listbox_context.useListboxContext().getItemGroupProps(itemGroupProps), localProps);
+	const listbox = require_use_listbox_context.useListboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(listbox.getItemGroupProps(itemGroupProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_listbox_item_group_props.ListboxItemGroupPropsProvider, {
 		value: itemGroupProps,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {

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

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

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

@@ -13,10 +13,11 @@ var ListboxItem = (0, react.forwardRef)((props, ref) => {
 	const [itemProps, localProps] = splitItemProps(props, ["item", "highlightOnHover"]);
 	const listbox = require_use_listbox_context.useListboxContext();
 	const mergedProps = (0, _zag_js_react.mergeProps)(listbox.getItemProps(itemProps), localProps);
+	const itemState = listbox.getItemState(itemProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_listbox_item_props_context.ListboxItemPropsProvider, {
 		value: itemProps,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_use_listbox_item_context.ListboxItemProvider, {
-			value: listbox.getItemState(itemProps),
+			value: itemState,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 				...mergedProps,
 				ref

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

@@ -13,10 +13,11 @@ var ListboxItem = forwardRef((props, ref) => {
 	const [itemProps, localProps] = splitItemProps(props, ["item", "highlightOnHover"]);
 	const listbox = useListboxContext();
 	const mergedProps = mergeProps(listbox.getItemProps(itemProps), localProps);
+	const itemState = listbox.getItemState(itemProps);
 	return /* @__PURE__ */ jsx(ListboxItemPropsProvider, {
 		value: itemProps,
 		children: /* @__PURE__ */ jsx(ListboxItemProvider, {
-			value: listbox.getItemState(itemProps),
+			value: itemState,
 			children: /* @__PURE__ */ jsx(ark.div, {
 				...mergedProps,
 				ref

package/dist/components/listbox/listbox-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/listbox/listbox-label.tsx
 var ListboxLabel = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_listbox_context.useListboxContext().getLabelProps(), props);
+	const listbox = require_use_listbox_context.useListboxContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(listbox.getLabelProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.span, {
 		...mergedProps,
 		ref

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

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

package/dist/components/marquee/marquee-edge.cjs

@@ -9,7 +9,8 @@ let react_jsx_runtime = require("react/jsx-runtime");
 var splitEdgeProps = require_create_split_props.createSplitProps();
 var MarqueeEdge = (0, react.forwardRef)((props, ref) => {
 	const [edgeProps, localProps] = splitEdgeProps(props, ["side"]);
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_marquee_context.useMarqueeContext().getEdgeProps(edgeProps), localProps);
+	const marquee = require_use_marquee_context.useMarqueeContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(marquee.getEdgeProps(edgeProps), localProps);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/marquee/marquee-edge.js

@@ -9,7 +9,8 @@ import { jsx } from "react/jsx-runtime";
 var splitEdgeProps = createSplitProps();
 var MarqueeEdge = forwardRef((props, ref) => {
 	const [edgeProps, localProps] = splitEdgeProps(props, ["side"]);
-	const mergedProps = mergeProps(useMarqueeContext().getEdgeProps(edgeProps), localProps);
+	const marquee = useMarqueeContext();
+	const mergedProps = mergeProps(marquee.getEdgeProps(edgeProps), localProps);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

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

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/marquee/marquee-item.tsx
 var MarqueeItem = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_marquee_context.useMarqueeContext().getItemProps(), props);
+	const marquee = require_use_marquee_context.useMarqueeContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(marquee.getItemProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

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

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

package/dist/components/marquee/marquee-viewport.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/marquee/marquee-viewport.tsx
 var MarqueeViewport = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_marquee_context.useMarqueeContext().getViewportProps(), props);
+	const marquee = require_use_marquee_context.useMarqueeContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(marquee.getViewportProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/marquee/marquee-viewport.js

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

package/dist/components/menu/menu-arrow-tip.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/menu/menu-arrow-tip.tsx
 var MenuArrowTip = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_menu_context.useMenuContext().getArrowTipProps(), props);
+	const menu = require_use_menu_context.useMenuContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(menu.getArrowTipProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/menu/menu-arrow-tip.js

@@ -6,7 +6,8 @@ import { mergeProps } from "@zag-js/react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/menu/menu-arrow-tip.tsx
 var MenuArrowTip = forwardRef((props, ref) => {
-	const mergedProps = mergeProps(useMenuContext().getArrowTipProps(), props);
+	const menu = useMenuContext();
+	const mergedProps = mergeProps(menu.getArrowTipProps(), props);
 	return /* @__PURE__ */ jsx(ark.div, {
 		...mergedProps,
 		ref

package/dist/components/menu/menu-arrow.cjs

@@ -6,7 +6,8 @@ let _zag_js_react = require("@zag-js/react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/menu/menu-arrow.tsx
 var MenuArrow = (0, react.forwardRef)((props, ref) => {
-	const mergedProps = (0, _zag_js_react.mergeProps)(require_use_menu_context.useMenuContext().getArrowProps(), props);
+	const menu = require_use_menu_context.useMenuContext();
+	const mergedProps = (0, _zag_js_react.mergeProps)(menu.getArrowProps(), props);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.ark.div, {
 		...mergedProps,
 		ref

package/dist/components/menu/menu-arrow.js

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