@ark-ui/react 5.37.2 → 5.38.1

package/dist/utils/compose-refs.d.cts

@@ -1,4 +1,5 @@
-import { Ref } from 'react';
+import { Ref, RefCallback } from 'react';
 type PossibleRef<T> = Ref<T | null> | undefined;
-export declare function composeRefs<T>(...refs: PossibleRef<T>[]): (node: T | null) => void;
+export declare function composeRefs<T>(...refs: PossibleRef<T>[]): RefCallback<T>;
+export declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): RefCallback<T>;
 export {};

package/dist/utils/compose-refs.d.ts

@@ -1,4 +1,5 @@
-import { Ref } from 'react';
+import { Ref, RefCallback } from 'react';
 type PossibleRef<T> = Ref<T | null> | undefined;
-export declare function composeRefs<T>(...refs: PossibleRef<T>[]): (node: T | null) => void;
+export declare function composeRefs<T>(...refs: PossibleRef<T>[]): RefCallback<T>;
+export declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): RefCallback<T>;
 export {};

package/dist/utils/compose-refs.js

@@ -1,15 +1,28 @@
+import { useCallback } from "react";
 //#region src/utils/compose-refs.ts
 function composeRefs(...refs) {
 	return (node) => {
 		const cleanUps = [];
+		let hasCustomCleanUp = false;
 		for (const ref of refs) if (typeof ref === "function") {
 			const cb = ref(node);
-			if (typeof cb === "function") cleanUps.push(cb);
-		} else if (ref) ref.current = node;
-		if (cleanUps.length) return () => {
+			if (typeof cb === "function") {
+				hasCustomCleanUp = true;
+				cleanUps.push(cb);
+			} else cleanUps.push(() => ref(null));
+		} else if (ref) {
+			ref.current = node;
+			cleanUps.push(() => {
+				ref.current = null;
+			});
+		}
+		if (hasCustomCleanUp) return () => {
 			for (const cleanUp of cleanUps) cleanUp();
 		};
 	};
 }
+function useComposedRefs(...refs) {
+	return useCallback(composeRefs(...refs), refs);
+}
 //#endregion
-export { composeRefs };
+export { composeRefs, useComposedRefs };

package/dist/utils/render-strategy.cjs

@@ -7,7 +7,11 @@ var [RenderStrategyPropsProvider, useRenderStrategyPropsContext] = require_creat
 	hookName: "useRenderStrategyContext",
 	providerName: "<RenderStrategyPropsProvider />"
 });
-var splitRenderStrategyProps = (props) => require_create_split_props.createSplitProps()(props, ["lazyMount", "unmountOnExit"]);
+var splitRenderStrategyProps = (props) => require_create_split_props.createSplitProps()(props, [
+	"lazyMount",
+	"unmountOnExit",
+	"hideMode"
+]);
 //#endregion
 exports.RenderStrategyPropsProvider = RenderStrategyPropsProvider;
 exports.splitRenderStrategyProps = splitRenderStrategyProps;

package/dist/utils/render-strategy.d.cts

@@ -1,4 +1,5 @@
 import { Provider } from 'react';
+export type HideMode = 'display-none' | 'activity';
 export interface RenderStrategyProps {
     /**
      * Whether to enable lazy mounting
@@ -10,6 +11,13 @@ export interface RenderStrategyProps {
      * @default false
      */
     unmountOnExit?: boolean | undefined;
+    /**
+     * How to hide content when mounted but not present.
+     * - `'display-none'`: HTML `hidden` attribute. Effects stay alive.
+     * - `'activity'`: React 19 `<Activity mode="hidden">`. Effects pause. Requires React 19+.
+     * @default 'display-none'
+     */
+    hideMode?: HideMode | undefined;
 }
 export declare const RenderStrategyPropsProvider: Provider<RenderStrategyProps>, useRenderStrategyPropsContext: () => RenderStrategyProps;
-export declare const splitRenderStrategyProps: <T extends RenderStrategyProps>(props: T) => [RenderStrategyProps, Omit<T, "lazyMount" | "unmountOnExit">];
+export declare const splitRenderStrategyProps: <T extends RenderStrategyProps>(props: T) => [RenderStrategyProps, Omit<T, "lazyMount" | "unmountOnExit" | "hideMode">];

package/dist/utils/render-strategy.d.ts

@@ -1,4 +1,5 @@
 import { Provider } from 'react';
+export type HideMode = 'display-none' | 'activity';
 export interface RenderStrategyProps {
     /**
      * Whether to enable lazy mounting
@@ -10,6 +11,13 @@ export interface RenderStrategyProps {
      * @default false
      */
     unmountOnExit?: boolean | undefined;
+    /**
+     * How to hide content when mounted but not present.
+     * - `'display-none'`: HTML `hidden` attribute. Effects stay alive.
+     * - `'activity'`: React 19 `<Activity mode="hidden">`. Effects pause. Requires React 19+.
+     * @default 'display-none'
+     */
+    hideMode?: HideMode | undefined;
 }
 export declare const RenderStrategyPropsProvider: Provider<RenderStrategyProps>, useRenderStrategyPropsContext: () => RenderStrategyProps;
-export declare const splitRenderStrategyProps: <T extends RenderStrategyProps>(props: T) => [RenderStrategyProps, Omit<T, "lazyMount" | "unmountOnExit">];
+export declare const splitRenderStrategyProps: <T extends RenderStrategyProps>(props: T) => [RenderStrategyProps, Omit<T, "lazyMount" | "unmountOnExit" | "hideMode">];

package/dist/utils/render-strategy.js

@@ -7,6 +7,10 @@ var [RenderStrategyPropsProvider, useRenderStrategyPropsContext] = createContext
 	hookName: "useRenderStrategyContext",
 	providerName: "<RenderStrategyPropsProvider />"
 });
-var splitRenderStrategyProps = (props) => createSplitProps()(props, ["lazyMount", "unmountOnExit"]);
+var splitRenderStrategyProps = (props) => createSplitProps()(props, [
+	"lazyMount",
+	"unmountOnExit",
+	"hideMode"
+]);
 //#endregion
 export { RenderStrategyPropsProvider, splitRenderStrategyProps, useRenderStrategyPropsContext };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ark-ui/react",
   "type": "module",
-  "version": "5.37.2",
+  "version": "5.38.1",
   "description": "A collection of unstyled, accessible UI components for React, utilizing state machines for seamless interaction.",
   "keywords": [
     "accordion",
@@ -150,105 +150,105 @@
   "sideEffects": false,
   "dependencies": {
     "@internationalized/date": "3.12.2",
-    "@zag-js/accordion": "1.41.2",
-    "@zag-js/anatomy": "1.41.2",
-    "@zag-js/angle-slider": "1.41.2",
-    "@zag-js/async-list": "1.41.2",
-    "@zag-js/auto-resize": "1.41.2",
-    "@zag-js/avatar": "1.41.2",
-    "@zag-js/carousel": "1.41.2",
-    "@zag-js/cascade-select": "1.41.2",
-    "@zag-js/checkbox": "1.41.2",
-    "@zag-js/clipboard": "1.41.2",
-    "@zag-js/collapsible": "1.41.2",
-    "@zag-js/collection": "1.41.2",
-    "@zag-js/color-picker": "1.41.2",
-    "@zag-js/color-utils": "1.41.2",
-    "@zag-js/combobox": "1.41.2",
-    "@zag-js/core": "1.41.2",
-    "@zag-js/date-input": "1.41.2",
-    "@zag-js/date-picker": "1.41.2",
-    "@zag-js/date-utils": "1.41.2",
-    "@zag-js/dialog": "1.41.2",
-    "@zag-js/dom-query": "1.41.2",
-    "@zag-js/drawer": "1.41.2",
-    "@zag-js/editable": "1.41.2",
-    "@zag-js/file-upload": "1.41.2",
-    "@zag-js/focus-visible": "1.41.2",
-    "@zag-js/file-utils": "1.41.2",
-    "@zag-js/floating-panel": "1.41.2",
-    "@zag-js/focus-trap": "1.41.2",
-    "@zag-js/highlight-word": "1.41.2",
-    "@zag-js/hover-card": "1.41.2",
-    "@zag-js/i18n-utils": "1.41.2",
-    "@zag-js/image-cropper": "1.41.2",
-    "@zag-js/json-tree-utils": "1.41.2",
-    "@zag-js/listbox": "1.41.2",
-    "@zag-js/marquee": "1.41.2",
-    "@zag-js/menu": "1.41.2",
-    "@zag-js/navigation-menu": "1.41.2",
-    "@zag-js/number-input": "1.41.2",
-    "@zag-js/pagination": "1.41.2",
-    "@zag-js/password-input": "1.41.2",
-    "@zag-js/pin-input": "1.41.2",
-    "@zag-js/popover": "1.41.2",
-    "@zag-js/presence": "1.41.2",
-    "@zag-js/progress": "1.41.2",
-    "@zag-js/qr-code": "1.41.2",
-    "@zag-js/radio-group": "1.41.2",
-    "@zag-js/rating-group": "1.41.2",
-    "@zag-js/react": "1.41.2",
-    "@zag-js/scroll-area": "1.41.2",
-    "@zag-js/select": "1.41.2",
-    "@zag-js/signature-pad": "1.41.2",
-    "@zag-js/slider": "1.41.2",
-    "@zag-js/splitter": "1.41.2",
-    "@zag-js/steps": "1.41.2",
-    "@zag-js/switch": "1.41.2",
-    "@zag-js/tabs": "1.41.2",
-    "@zag-js/tags-input": "1.41.2",
-    "@zag-js/timer": "1.41.2",
-    "@zag-js/toast": "1.41.2",
-    "@zag-js/toggle": "1.41.2",
-    "@zag-js/toggle-group": "1.41.2",
-    "@zag-js/tooltip": "1.41.2",
-    "@zag-js/tour": "1.41.2",
-    "@zag-js/tree-view": "1.41.2",
-    "@zag-js/types": "1.41.2",
-    "@zag-js/utils": "1.41.2"
+    "@zag-js/accordion": "1.43.0",
+    "@zag-js/anatomy": "1.43.0",
+    "@zag-js/angle-slider": "1.43.0",
+    "@zag-js/async-list": "1.43.0",
+    "@zag-js/auto-resize": "1.43.0",
+    "@zag-js/avatar": "1.43.0",
+    "@zag-js/carousel": "1.43.0",
+    "@zag-js/cascade-select": "1.43.0",
+    "@zag-js/checkbox": "1.43.0",
+    "@zag-js/clipboard": "1.43.0",
+    "@zag-js/collapsible": "1.43.0",
+    "@zag-js/collection": "1.43.0",
+    "@zag-js/color-picker": "1.43.0",
+    "@zag-js/color-utils": "1.43.0",
+    "@zag-js/combobox": "1.43.0",
+    "@zag-js/core": "1.43.0",
+    "@zag-js/date-input": "1.43.0",
+    "@zag-js/date-picker": "1.43.0",
+    "@zag-js/date-utils": "1.43.0",
+    "@zag-js/dialog": "1.43.0",
+    "@zag-js/dom-query": "1.43.0",
+    "@zag-js/drawer": "1.43.0",
+    "@zag-js/editable": "1.43.0",
+    "@zag-js/file-upload": "1.43.0",
+    "@zag-js/focus-visible": "1.43.0",
+    "@zag-js/file-utils": "1.43.0",
+    "@zag-js/floating-panel": "1.43.0",
+    "@zag-js/focus-trap": "1.43.0",
+    "@zag-js/highlight-word": "1.43.0",
+    "@zag-js/hover-card": "1.43.0",
+    "@zag-js/i18n-utils": "1.43.0",
+    "@zag-js/image-cropper": "1.43.0",
+    "@zag-js/json-tree-utils": "1.43.0",
+    "@zag-js/listbox": "1.43.0",
+    "@zag-js/marquee": "1.43.0",
+    "@zag-js/menu": "1.43.0",
+    "@zag-js/navigation-menu": "1.43.0",
+    "@zag-js/number-input": "1.43.0",
+    "@zag-js/pagination": "1.43.0",
+    "@zag-js/password-input": "1.43.0",
+    "@zag-js/pin-input": "1.43.0",
+    "@zag-js/popover": "1.43.0",
+    "@zag-js/presence": "1.43.0",
+    "@zag-js/progress": "1.43.0",
+    "@zag-js/qr-code": "1.43.0",
+    "@zag-js/radio-group": "1.43.0",
+    "@zag-js/rating-group": "1.43.0",
+    "@zag-js/react": "1.43.0",
+    "@zag-js/scroll-area": "1.43.0",
+    "@zag-js/select": "1.43.0",
+    "@zag-js/signature-pad": "1.43.0",
+    "@zag-js/slider": "1.43.0",
+    "@zag-js/splitter": "1.43.0",
+    "@zag-js/steps": "1.43.0",
+    "@zag-js/switch": "1.43.0",
+    "@zag-js/tabs": "1.43.0",
+    "@zag-js/tags-input": "1.43.0",
+    "@zag-js/timer": "1.43.0",
+    "@zag-js/toast": "1.43.0",
+    "@zag-js/toggle": "1.43.0",
+    "@zag-js/toggle-group": "1.43.0",
+    "@zag-js/tooltip": "1.43.0",
+    "@zag-js/tour": "1.43.0",
+    "@zag-js/tree-view": "1.43.0",
+    "@zag-js/types": "1.43.0",
+    "@zag-js/utils": "1.43.0"
   },
   "devDependencies": {
-    "@biomejs/biome": "2.4.16",
-    "@storybook/addon-a11y": "10.4.2",
-    "@storybook/react-vite": "10.4.2",
-    "@tanstack/react-virtual": "3.14.2",
+    "@biomejs/biome": "2.5.5",
+    "@storybook/addon-a11y": "10.5.3",
+    "@storybook/react-vite": "10.5.3",
+    "@tanstack/react-virtual": "3.14.8",
     "@testing-library/dom": "10.4.1",
-    "@testing-library/jest-dom": "6.9.1",
+    "@testing-library/jest-dom": "7.0.0",
     "@testing-library/react": "16.3.2",
     "@testing-library/user-event": "14.6.1",
     "@types/jsdom": "28.0.3",
-    "@types/react": "19.2.16",
+    "@types/react": "19.2.17",
     "@types/react-dom": "19.2.3",
-    "@vitejs/plugin-react": "6.0.1",
-    "@vitest/coverage-v8": "4.1.8",
+    "@vitejs/plugin-react": "6.0.4",
+    "@vitest/coverage-v8": "4.1.10",
     "check-password-strength": "3.0.0",
     "clean-package": "2.2.0",
-    "globby": "16.2.0",
-    "happy-dom": "20.10.1",
+    "globby": "16.2.2",
+    "happy-dom": "20.11.1",
     "image-conversion": "2.1.1",
-    "lucide-react": "1.17.0",
-    "react": "19.2.7",
-    "react-dom": "19.2.7",
-    "react-frame-component": "5.2.7",
-    "react-hook-form": "7.77.0",
+    "lucide-react": "1.26.0",
+    "react": "19.2.8",
+    "react-dom": "19.2.8",
+    "react-frame-component": "5.3.2",
+    "react-hook-form": "7.82.0",
     "react-shadow": "20.6.0",
-    "react-use": "17.6.0",
+    "react-use": "17.6.1",
     "resize-observer-polyfill": "1.5.1",
-    "storybook": "10.4.2",
+    "storybook": "10.5.3",
     "typescript": "6.0.3",
-    "vite": "8.0.16",
-    "vite-plugin-dts": "4.5.4",
-    "vitest": "4.1.8",
+    "vite": "8.1.5",
+    "vite-plugin-dts": "5.0.3",
+    "vitest": "4.1.10",
     "vitest-axe": "1.0.0-pre.5"
   },
   "peerDependencies": {