@ark-ui/react 4.1.1 → 4.2.0

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

@@ -7,7 +7,7 @@ import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
 import { useEvent } from '../../utils/use-event.js';
 import { useFieldContext } from '../field/use-field-context.js';
 
-const useSwitch = (props) => {
+const useSwitch = (props = {}) => {
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
   const field = useFieldContext();

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

@@ -29,7 +29,7 @@ function _interopNamespaceDefault(e) {
 
 const tabs__namespace = /*#__PURE__*/_interopNamespaceDefault(tabs);
 
-const useTabs = (props) => {
+const useTabs = (props = {}) => {
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
   const initialContext = {

package/dist/components/tabs/use-tabs.d.cts

@@ -10,4 +10,4 @@ export interface UseTabsProps extends Optional<Omit<tabs.Context, 'dir' | 'getRo
 }
 export interface UseTabsReturn extends tabs.Api<PropTypes> {
 }
-export declare const useTabs: (props: UseTabsProps) => UseTabsReturn;
+export declare const useTabs: (props?: UseTabsProps) => UseTabsReturn;

package/dist/components/tabs/use-tabs.d.ts

@@ -10,4 +10,4 @@ export interface UseTabsProps extends Optional<Omit<tabs.Context, 'dir' | 'getRo
 }
 export interface UseTabsReturn extends tabs.Api<PropTypes> {
 }
-export declare const useTabs: (props: UseTabsProps) => UseTabsReturn;
+export declare const useTabs: (props?: UseTabsProps) => UseTabsReturn;

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

@@ -6,7 +6,7 @@ import { useEnvironmentContext } from '../../providers/environment/use-environme
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
 import { useEvent } from '../../utils/use-event.js';
 
-const useTabs = (props) => {
+const useTabs = (props = {}) => {
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
   const initialContext = {

package/dist/components/tags-input/use-tags-input.cjs

@@ -30,7 +30,7 @@ function _interopNamespaceDefault(e) {
 
 const tagsInput__namespace = /*#__PURE__*/_interopNamespaceDefault(tagsInput);
 
-const useTagsInput = (props) => {
+const useTagsInput = (props = {}) => {
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
   const field = useFieldContext.useFieldContext();

package/dist/components/tags-input/use-tags-input.d.cts

@@ -10,4 +10,4 @@ export interface UseTagsInputProps extends Optional<Omit<tagsInput.Context, 'dir
 }
 export interface UseTagsInputReturn extends tagsInput.Api<PropTypes> {
 }
-export declare const useTagsInput: (props: UseTagsInputProps) => UseTagsInputReturn;
+export declare const useTagsInput: (props?: UseTagsInputProps) => UseTagsInputReturn;

package/dist/components/tags-input/use-tags-input.d.ts

@@ -10,4 +10,4 @@ export interface UseTagsInputProps extends Optional<Omit<tagsInput.Context, 'dir
 }
 export interface UseTagsInputReturn extends tagsInput.Api<PropTypes> {
 }
-export declare const useTagsInput: (props: UseTagsInputProps) => UseTagsInputReturn;
+export declare const useTagsInput: (props?: UseTagsInputProps) => UseTagsInputReturn;

package/dist/components/tags-input/use-tags-input.js

@@ -7,7 +7,7 @@ import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
 import { useEvent } from '../../utils/use-event.js';
 import { useFieldContext } from '../field/use-field-context.js';
 
-const useTagsInput = (props) => {
+const useTagsInput = (props = {}) => {
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
   const field = useFieldContext();

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

@@ -28,7 +28,7 @@ function _interopNamespaceDefault(e) {
 
 const timer__namespace = /*#__PURE__*/_interopNamespaceDefault(timer);
 
-const useTimer = (props) => {
+const useTimer = (props = {}) => {
   const env = useEnvironmentContext.useEnvironmentContext();
   const initialContext = {
     id: react.useId(),

package/dist/components/timer/use-timer.d.cts

@@ -5,4 +5,4 @@ export interface UseTimerProps extends Optional<Omit<timer.Context, 'dir' | 'get
 }
 export interface UseTimerReturn extends timer.Api<PropTypes> {
 }
-export declare const useTimer: (props: UseTimerProps) => UseTimerReturn;
+export declare const useTimer: (props?: UseTimerProps) => UseTimerReturn;

package/dist/components/timer/use-timer.d.ts

@@ -5,4 +5,4 @@ export interface UseTimerProps extends Optional<Omit<timer.Context, 'dir' | 'get
 }
 export interface UseTimerReturn extends timer.Api<PropTypes> {
 }
-export declare const useTimer: (props: UseTimerProps) => UseTimerReturn;
+export declare const useTimer: (props?: UseTimerProps) => UseTimerReturn;

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

@@ -5,7 +5,7 @@ import { useId } from 'react';
 import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
 import { useEvent } from '../../utils/use-event.js';
 
-const useTimer = (props) => {
+const useTimer = (props = {}) => {
   const env = useEnvironmentContext();
   const initialContext = {
     id: useId(),

package/dist/components/toggle-group/use-toggle-group.cjs

@@ -29,7 +29,7 @@ function _interopNamespaceDefault(e) {
 
 const toggleGroup__namespace = /*#__PURE__*/_interopNamespaceDefault(toggleGroup);
 
-const useToggleGroup = (props) => {
+const useToggleGroup = (props = {}) => {
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
   const initialContext = {

package/dist/components/toggle-group/use-toggle-group.d.cts

@@ -10,4 +10,4 @@ export interface UseToggleGroupProps extends Optional<Omit<toggleGroup.Context,
 }
 export interface UseToggleGroupReturn extends toggleGroup.Api<PropTypes> {
 }
-export declare const useToggleGroup: (props: UseToggleGroupProps) => UseToggleGroupReturn;
+export declare const useToggleGroup: (props?: UseToggleGroupProps) => UseToggleGroupReturn;

package/dist/components/toggle-group/use-toggle-group.d.ts

@@ -10,4 +10,4 @@ export interface UseToggleGroupProps extends Optional<Omit<toggleGroup.Context,
 }
 export interface UseToggleGroupReturn extends toggleGroup.Api<PropTypes> {
 }
-export declare const useToggleGroup: (props: UseToggleGroupProps) => UseToggleGroupReturn;
+export declare const useToggleGroup: (props?: UseToggleGroupProps) => UseToggleGroupReturn;

package/dist/components/toggle-group/use-toggle-group.js

@@ -6,7 +6,7 @@ import { useEnvironmentContext } from '../../providers/environment/use-environme
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
 import { useEvent } from '../../utils/use-event.js';
 
-const useToggleGroup = (props) => {
+const useToggleGroup = (props = {}) => {
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
   const initialContext = {

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

@@ -29,7 +29,7 @@ function _interopNamespaceDefault(e) {
 
 const tooltip__namespace = /*#__PURE__*/_interopNamespaceDefault(tooltip);
 
-const useTooltip = (props) => {
+const useTooltip = (props = {}) => {
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
   const initialContext = {

package/dist/components/tooltip/use-tooltip.d.cts

@@ -10,4 +10,4 @@ export interface UseTooltipProps extends Optional<Omit<tooltip.Context, 'dir' |
 }
 export interface UseTooltipReturn extends tooltip.Api<PropTypes> {
 }
-export declare const useTooltip: (props: UseTooltipProps) => UseTooltipReturn;
+export declare const useTooltip: (props?: UseTooltipProps) => UseTooltipReturn;

package/dist/components/tooltip/use-tooltip.d.ts

@@ -10,4 +10,4 @@ export interface UseTooltipProps extends Optional<Omit<tooltip.Context, 'dir' |
 }
 export interface UseTooltipReturn extends tooltip.Api<PropTypes> {
 }
-export declare const useTooltip: (props: UseTooltipProps) => UseTooltipReturn;
+export declare const useTooltip: (props?: UseTooltipProps) => UseTooltipReturn;

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

@@ -6,7 +6,7 @@ import { useEnvironmentContext } from '../../providers/environment/use-environme
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
 import { useEvent } from '../../utils/use-event.js';
 
-const useTooltip = (props) => {
+const useTooltip = (props = {}) => {
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
   const initialContext = {

package/dist/index.cjs

@@ -51,6 +51,7 @@ const useCheckboxContext = require('./components/checkbox/use-checkbox-context.c
 const useCheckboxGroup = require('./components/checkbox/use-checkbox-group.cjs');
 const useCheckboxGroupContext = require('./components/checkbox/use-checkbox-group-context.cjs');
 const checkbox = require('./components/checkbox/checkbox.cjs');
+const clientOnly = require('./components/client-only/client-only.cjs');
 const clipboardContext = require('./components/clipboard/clipboard-context.cjs');
 const clipboardControl = require('./components/clipboard/clipboard-control.cjs');
 const clipboardIndicator = require('./components/clipboard/clipboard-indicator.cjs');
@@ -194,6 +195,7 @@ const fieldRoot = require('./components/field/field-root.cjs');
 const fieldRootProvider = require('./components/field/field-root-provider.cjs');
 const fieldSelect = require('./components/field/field-select.cjs');
 const fieldTextarea = require('./components/field/field-textarea.cjs');
+const fieldRequiredIndicator = require('./components/field/field-required-indicator.cjs');
 const field_anatomy = require('./components/field/field.anatomy.cjs');
 const useFieldContext = require('./components/field/use-field-context.cjs');
 const field = require('./components/field/field.cjs');
@@ -421,6 +423,7 @@ const useSignaturePadContext = require('./components/signature-pad/use-signature
 const signaturePad$1 = require('./components/signature-pad/signature-pad.cjs');
 const sliderContext = require('./components/slider/slider-context.cjs');
 const sliderControl = require('./components/slider/slider-control.cjs');
+const sliderDraggingIndicator = require('./components/slider/slider-dragging-indicator.cjs');
 const sliderHiddenInput = require('./components/slider/slider-hidden-input.cjs');
 const sliderLabel = require('./components/slider/slider-label.cjs');
 const sliderMarker = require('./components/slider/slider-marker.cjs');
@@ -667,6 +670,7 @@ exports.useCheckboxContext = useCheckboxContext.useCheckboxContext;
 exports.useCheckboxGroup = useCheckboxGroup.useCheckboxGroup;
 exports.useCheckboxGroupContext = useCheckboxGroupContext.useCheckboxGroupContext;
 exports.Checkbox = checkbox;
+exports.ClientOnly = clientOnly.ClientOnly;
 exports.ClipboardContext = clipboardContext.ClipboardContext;
 exports.ClipboardControl = clipboardControl.ClipboardControl;
 exports.ClipboardIndicator = clipboardIndicator.ClipboardIndicator;
@@ -817,6 +821,7 @@ exports.FieldRoot = fieldRoot.FieldRoot;
 exports.FieldRootProvider = fieldRootProvider.FieldRootProvider;
 exports.FieldSelect = fieldSelect.FieldSelect;
 exports.FieldTextarea = fieldTextarea.FieldTextarea;
+exports.FieldRequiredIndicator = fieldRequiredIndicator.FieldRequiredIndicator;
 exports.fieldAnatomy = field_anatomy.fieldAnatomy;
 exports.useFieldContext = useFieldContext.useFieldContext;
 exports.Field = field;
@@ -1045,6 +1050,7 @@ exports.useSignaturePadContext = useSignaturePadContext.useSignaturePadContext;
 exports.SignaturePad = signaturePad$1;
 exports.SliderContext = sliderContext.SliderContext;
 exports.SliderControl = sliderControl.SliderControl;
+exports.SliderDraggingIndicator = sliderDraggingIndicator.SliderDraggingIndicator;
 exports.SliderHiddenInput = sliderHiddenInput.SliderHiddenInput;
 exports.SliderLabel = sliderLabel.SliderLabel;
 exports.SliderMarker = sliderMarker.SliderMarker;

package/dist/index.js

@@ -51,6 +51,7 @@ export { useCheckboxGroup } from './components/checkbox/use-checkbox-group.js';
 export { useCheckboxGroupContext } from './components/checkbox/use-checkbox-group-context.js';
 import * as checkbox from './components/checkbox/checkbox.js';
 export { checkbox as Checkbox };
+export { ClientOnly } from './components/client-only/client-only.js';
 export { ClipboardContext } from './components/clipboard/clipboard-context.js';
 export { ClipboardControl } from './components/clipboard/clipboard-control.js';
 export { ClipboardIndicator } from './components/clipboard/clipboard-indicator.js';
@@ -201,6 +202,7 @@ export { FieldRoot } from './components/field/field-root.js';
 export { FieldRootProvider } from './components/field/field-root-provider.js';
 export { FieldSelect } from './components/field/field-select.js';
 export { FieldTextarea } from './components/field/field-textarea.js';
+export { FieldRequiredIndicator } from './components/field/field-required-indicator.js';
 export { fieldAnatomy } from './components/field/field.anatomy.js';
 export { useFieldContext } from './components/field/use-field-context.js';
 import * as field from './components/field/field.js';
@@ -445,6 +447,7 @@ import * as signaturePad from './components/signature-pad/signature-pad.js';
 export { signaturePad as SignaturePad };
 export { SliderContext } from './components/slider/slider-context.js';
 export { SliderControl } from './components/slider/slider-control.js';
+export { SliderDraggingIndicator } from './components/slider/slider-dragging-indicator.js';
 export { SliderHiddenInput } from './components/slider/slider-hidden-input.js';
 export { SliderLabel } from './components/slider/slider-label.js';
 export { SliderMarker } from './components/slider/slider-marker.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ark-ui/react",
-  "version": "4.1.1",
+  "version": "4.2.0",
   "description": "A collection of unstyled, accessible UI components for React, utilizing state machines for seamless interaction.",
   "keywords": [
     "accordion",
@@ -149,86 +149,86 @@
   "sideEffects": false,
   "dependencies": {
     "@internationalized/date": "3.5.6",
-    "@zag-js/accordion": "0.74.2",
-    "@zag-js/anatomy": "0.74.2",
-    "@zag-js/avatar": "0.74.2",
-    "@zag-js/carousel": "0.74.2",
-    "@zag-js/checkbox": "0.74.2",
-    "@zag-js/clipboard": "0.74.2",
-    "@zag-js/collapsible": "0.74.2",
-    "@zag-js/collection": "0.74.2",
-    "@zag-js/color-picker": "0.74.2",
-    "@zag-js/color-utils": "0.74.2",
-    "@zag-js/combobox": "0.74.2",
-    "@zag-js/core": "0.74.2",
-    "@zag-js/date-picker": "0.74.2",
-    "@zag-js/date-utils": "0.74.2",
-    "@zag-js/dialog": "0.74.2",
-    "@zag-js/dom-query": "0.74.2",
-    "@zag-js/editable": "0.74.2",
-    "@zag-js/file-upload": "0.74.2",
-    "@zag-js/file-utils": "0.74.2",
-    "@zag-js/highlight-word": "0.74.2",
-    "@zag-js/hover-card": "0.74.2",
-    "@zag-js/i18n-utils": "0.74.2",
-    "@zag-js/menu": "0.74.2",
-    "@zag-js/number-input": "0.74.2",
-    "@zag-js/pagination": "0.74.2",
-    "@zag-js/pin-input": "0.74.2",
-    "@zag-js/popover": "0.74.2",
-    "@zag-js/presence": "0.74.2",
-    "@zag-js/progress": "0.74.2",
-    "@zag-js/qr-code": "0.74.2",
-    "@zag-js/radio-group": "0.74.2",
-    "@zag-js/rating-group": "0.74.2",
-    "@zag-js/react": "0.74.2",
-    "@zag-js/select": "0.74.2",
-    "@zag-js/signature-pad": "0.74.2",
-    "@zag-js/slider": "0.74.2",
-    "@zag-js/splitter": "0.74.2",
-    "@zag-js/steps": "0.74.2",
-    "@zag-js/switch": "0.74.2",
-    "@zag-js/tabs": "0.74.2",
-    "@zag-js/tags-input": "0.74.2",
-    "@zag-js/time-picker": "0.74.2",
-    "@zag-js/timer": "0.74.2",
-    "@zag-js/toast": "0.74.2",
-    "@zag-js/toggle-group": "0.74.2",
-    "@zag-js/tooltip": "0.74.2",
-    "@zag-js/tree-view": "0.74.2",
-    "@zag-js/types": "0.74.2"
+    "@zag-js/accordion": "0.76.0",
+    "@zag-js/anatomy": "0.76.0",
+    "@zag-js/avatar": "0.76.0",
+    "@zag-js/carousel": "0.76.0",
+    "@zag-js/checkbox": "0.76.0",
+    "@zag-js/clipboard": "0.76.0",
+    "@zag-js/collapsible": "0.76.0",
+    "@zag-js/collection": "0.76.0",
+    "@zag-js/color-picker": "0.76.0",
+    "@zag-js/color-utils": "0.76.0",
+    "@zag-js/combobox": "0.76.0",
+    "@zag-js/core": "0.76.0",
+    "@zag-js/date-picker": "0.76.0",
+    "@zag-js/date-utils": "0.76.0",
+    "@zag-js/dialog": "0.76.0",
+    "@zag-js/dom-query": "0.76.0",
+    "@zag-js/editable": "0.76.0",
+    "@zag-js/file-upload": "0.76.0",
+    "@zag-js/file-utils": "0.76.0",
+    "@zag-js/highlight-word": "0.76.0",
+    "@zag-js/hover-card": "0.76.0",
+    "@zag-js/i18n-utils": "0.76.0",
+    "@zag-js/menu": "0.76.0",
+    "@zag-js/number-input": "0.76.0",
+    "@zag-js/pagination": "0.76.0",
+    "@zag-js/pin-input": "0.76.0",
+    "@zag-js/popover": "0.76.0",
+    "@zag-js/presence": "0.76.0",
+    "@zag-js/progress": "0.76.0",
+    "@zag-js/qr-code": "0.76.0",
+    "@zag-js/radio-group": "0.76.0",
+    "@zag-js/rating-group": "0.76.0",
+    "@zag-js/react": "0.76.0",
+    "@zag-js/select": "0.76.0",
+    "@zag-js/signature-pad": "0.76.0",
+    "@zag-js/slider": "0.76.0",
+    "@zag-js/splitter": "0.76.0",
+    "@zag-js/steps": "0.76.0",
+    "@zag-js/switch": "0.76.0",
+    "@zag-js/tabs": "0.76.0",
+    "@zag-js/tags-input": "0.76.0",
+    "@zag-js/time-picker": "0.76.0",
+    "@zag-js/timer": "0.76.0",
+    "@zag-js/toast": "0.76.0",
+    "@zag-js/toggle-group": "0.76.0",
+    "@zag-js/tooltip": "0.76.0",
+    "@zag-js/tree-view": "0.76.0",
+    "@zag-js/types": "0.76.0"
   },
   "devDependencies": {
-    "@biomejs/biome": "1.9.3",
+    "@biomejs/biome": "1.9.4",
     "@release-it/keep-a-changelog": "5.0.0",
-    "@storybook/addon-a11y": "8.3.5",
-    "@storybook/addon-essentials": "8.3.5",
-    "@storybook/react-vite": "8.3.5",
-    "@storybook/react": "8.3.5",
+    "@storybook/addon-a11y": "8.3.6",
+    "@storybook/addon-essentials": "8.3.6",
+    "@storybook/react-vite": "8.3.6",
+    "@storybook/react": "8.3.6",
     "@testing-library/dom": "10.4.0",
-    "@testing-library/jest-dom": "6.5.0",
+    "@testing-library/jest-dom": "6.6.1",
     "@testing-library/react": "16.0.1",
     "@testing-library/user-event": "14.5.2",
     "@types/jsdom": "21.1.7",
-    "@types/react": "18.3.11",
-    "@types/react-dom": "18.3.0",
-    "@vitejs/plugin-react": "4.3.2",
-    "@zag-js/stringify-state": "0.74.2",
+    "@types/react": "18.3.12",
+    "@types/react-dom": "18.3.1",
+    "@vitejs/plugin-react": "4.3.3",
+    "@zag-js/stringify-state": "0.76.0",
     "clean-package": "2.2.0",
     "globby": "14.0.2",
     "jsdom": "25.0.1",
-    "lucide-react": "0.451.0",
+    "lucide-react": "0.453.0",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-frame-component": "5.2.7",
-    "react-hook-form": "7.53.0",
-    "release-it": "17.8.0",
+    "react-hook-form": "7.53.1",
+    "release-it": "17.10.0",
     "resize-observer-polyfill": "1.5.1",
-    "storybook": "8.3.5",
+    "storybook": "8.3.6",
     "typescript": "5.6.3",
-    "vite": "5.4.8",
-    "vite-plugin-dts": "4.2.3",
-    "vitest": "2.1.2",
+    "vite": "5.4.10",
+    "vite-plugin-dts": "4.3.0",
+    "vitest": "2.1.3",
     "vitest-axe": "1.0.0-pre.3"
   },
   "peerDependencies": {

package/dist/utils/use-is-server.cjs

@@ -1,16 +0,0 @@
-'use client';
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const react = require('react');
-
-const useIsServer = () => {
-  const [isServer, setServer] = react.useState(true);
-  react.useEffect(() => {
-    setServer(false);
-  }, []);
-  return isServer;
-};
-
-exports.useIsServer = useIsServer;

package/dist/utils/use-is-server.d.cts

@@ -1 +0,0 @@
-export declare const useIsServer: () => boolean;

package/dist/utils/use-is-server.d.ts

@@ -1 +0,0 @@
-export declare const useIsServer: () => boolean;

package/dist/utils/use-is-server.js

@@ -1,12 +0,0 @@
-'use client';
-import { useState, useEffect } from 'react';
-
-const useIsServer = () => {
-  const [isServer, setServer] = useState(true);
-  useEffect(() => {
-    setServer(false);
-  }, []);
-  return isServer;
-};
-
-export { useIsServer };