@ark-ui/react 4.6.0 → 4.7.0

package/dist/components/clipboard/clipboard-value-text.cjs

@@ -0,0 +1,19 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
+const factory = require('../factory.cjs');
+const useClipboardContext = require('./use-clipboard-context.cjs');
+
+const ClipboardValueText = react.forwardRef(
+  (props, ref) => {
+    const clipboard = useClipboardContext.useClipboardContext();
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...props, ref, children: props.children || clipboard.value });
+  }
+);
+ClipboardValueText.displayName = "ClipboardValueText";
+
+exports.ClipboardValueText = ClipboardValueText;

package/dist/components/clipboard/clipboard-value-text.d.cts

@@ -0,0 +1,7 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface ClipboardValueTextBaseProps extends PolymorphicProps {
+}
+export interface ClipboardValueTextProps extends HTMLProps<'span'>, ClipboardValueTextBaseProps {
+}
+export declare const ClipboardValueText: ForwardRefExoticComponent<ClipboardValueTextProps & RefAttributes<HTMLDivElement>>;

package/dist/components/clipboard/clipboard-value-text.d.ts

@@ -0,0 +1,7 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface ClipboardValueTextBaseProps extends PolymorphicProps {
+}
+export interface ClipboardValueTextProps extends HTMLProps<'span'>, ClipboardValueTextBaseProps {
+}
+export declare const ClipboardValueText: ForwardRefExoticComponent<ClipboardValueTextProps & RefAttributes<HTMLDivElement>>;

package/dist/components/clipboard/clipboard-value-text.js

@@ -0,0 +1,15 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { ark } from '../factory.js';
+import { useClipboardContext } from './use-clipboard-context.js';
+
+const ClipboardValueText = forwardRef(
+  (props, ref) => {
+    const clipboard = useClipboardContext();
+    return /* @__PURE__ */ jsx(ark.span, { ...props, ref, children: props.children || clipboard.value });
+  }
+);
+ClipboardValueText.displayName = "ClipboardValueText";
+
+export { ClipboardValueText };

package/dist/components/clipboard/clipboard.cjs

@@ -10,6 +10,7 @@ const clipboardLabel = require('./clipboard-label.cjs');
 const clipboardRoot = require('./clipboard-root.cjs');
 const clipboardRootProvider = require('./clipboard-root-provider.cjs');
 const clipboardTrigger = require('./clipboard-trigger.cjs');
+const clipboardValueText = require('./clipboard-value-text.cjs');
 
 
 
@@ -21,3 +22,4 @@ exports.Label = clipboardLabel.ClipboardLabel;
 exports.Root = clipboardRoot.ClipboardRoot;
 exports.RootProvider = clipboardRootProvider.ClipboardRootProvider;
 exports.Trigger = clipboardTrigger.ClipboardTrigger;
+exports.ValueText = clipboardValueText.ClipboardValueText;

package/dist/components/clipboard/clipboard.d.cts

@@ -7,3 +7,4 @@ export { ClipboardLabel as Label, type ClipboardLabelProps as LabelProps, type C
 export { ClipboardRoot as Root, type ClipboardRootProps as RootProps, type ClipboardRootBaseProps as RootBaseProps, } from './clipboard-root';
 export { ClipboardRootProvider as RootProvider, type ClipboardRootProviderProps as RootProviderProps, type ClipboardRootProviderBaseProps as RootProviderBaseProps, } from './clipboard-root-provider';
 export { ClipboardTrigger as Trigger, type ClipboardTriggerProps as TriggerProps, type ClipboardTriggerBaseProps as TriggerBaseProps, } from './clipboard-trigger';
+export { ClipboardValueText as ValueText, type ClipboardValueTextProps as ValueTextProps, type ClipboardValueTextBaseProps as ValueTextBaseProps, } from './clipboard-value-text';

package/dist/components/clipboard/clipboard.d.ts

@@ -7,3 +7,4 @@ export { ClipboardLabel as Label, type ClipboardLabelProps as LabelProps, type C
 export { ClipboardRoot as Root, type ClipboardRootProps as RootProps, type ClipboardRootBaseProps as RootBaseProps, } from './clipboard-root';
 export { ClipboardRootProvider as RootProvider, type ClipboardRootProviderProps as RootProviderProps, type ClipboardRootProviderBaseProps as RootProviderBaseProps, } from './clipboard-root-provider';
 export { ClipboardTrigger as Trigger, type ClipboardTriggerProps as TriggerProps, type ClipboardTriggerBaseProps as TriggerBaseProps, } from './clipboard-trigger';
+export { ClipboardValueText as ValueText, type ClipboardValueTextProps as ValueTextProps, type ClipboardValueTextBaseProps as ValueTextBaseProps, } from './clipboard-value-text';

package/dist/components/clipboard/clipboard.js

@@ -6,3 +6,4 @@ export { ClipboardLabel as Label } from './clipboard-label.js';
 export { ClipboardRoot as Root } from './clipboard-root.js';
 export { ClipboardRootProvider as RootProvider } from './clipboard-root-provider.js';
 export { ClipboardTrigger as Trigger } from './clipboard-trigger.js';
+export { ClipboardValueText as ValueText } from './clipboard-value-text.js';

package/dist/components/clipboard/index.cjs

@@ -10,6 +10,7 @@ const clipboardLabel = require('./clipboard-label.cjs');
 const clipboardRoot = require('./clipboard-root.cjs');
 const clipboardRootProvider = require('./clipboard-root-provider.cjs');
 const clipboardTrigger = require('./clipboard-trigger.cjs');
+const clipboardValueText = require('./clipboard-value-text.cjs');
 const useClipboard = require('./use-clipboard.cjs');
 const useClipboardContext = require('./use-clipboard-context.cjs');
 const clipboard$1 = require('./clipboard.cjs');
@@ -25,6 +26,7 @@ exports.ClipboardLabel = clipboardLabel.ClipboardLabel;
 exports.ClipboardRoot = clipboardRoot.ClipboardRoot;
 exports.ClipboardRootProvider = clipboardRootProvider.ClipboardRootProvider;
 exports.ClipboardTrigger = clipboardTrigger.ClipboardTrigger;
+exports.ClipboardValueText = clipboardValueText.ClipboardValueText;
 exports.useClipboard = useClipboard.useClipboard;
 exports.useClipboardContext = useClipboardContext.useClipboardContext;
 exports.Clipboard = clipboard$1;

package/dist/components/clipboard/index.d.cts

@@ -1,5 +1,5 @@
 export type { CopyStatusDetails as ClipboardCopyStatusDetails } from '@zag-js/clipboard';
-export { ClipboardContext, type ClipboardContextProps, } from './clipboard-context';
+export { ClipboardContext, type ClipboardContextProps } from './clipboard-context';
 export { ClipboardControl, type ClipboardControlBaseProps, type ClipboardControlProps, } from './clipboard-control';
 export { ClipboardIndicator, type ClipboardIndicatorBaseProps, type ClipboardIndicatorProps, } from './clipboard-indicator';
 export { ClipboardInput, type ClipboardInputBaseProps, type ClipboardInputProps, } from './clipboard-input';
@@ -7,6 +7,7 @@ export { ClipboardLabel, type ClipboardLabelBaseProps, type ClipboardLabelProps,
 export { ClipboardRoot, type ClipboardRootBaseProps, type ClipboardRootProps, } from './clipboard-root';
 export { ClipboardRootProvider, type ClipboardRootProviderBaseProps, type ClipboardRootProviderProps, } from './clipboard-root-provider';
 export { ClipboardTrigger, type ClipboardTriggerBaseProps, type ClipboardTriggerProps, } from './clipboard-trigger';
+export { ClipboardValueText, type ClipboardValueTextBaseProps, type ClipboardValueTextProps, } from './clipboard-value-text';
 export { clipboardAnatomy } from './clipboard.anatomy';
 export { useClipboard, type UseClipboardProps, type UseClipboardReturn } from './use-clipboard';
 export { useClipboardContext, type UseClipboardContext } from './use-clipboard-context';

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

@@ -1,5 +1,5 @@
 export type { CopyStatusDetails as ClipboardCopyStatusDetails } from '@zag-js/clipboard';
-export { ClipboardContext, type ClipboardContextProps, } from './clipboard-context';
+export { ClipboardContext, type ClipboardContextProps } from './clipboard-context';
 export { ClipboardControl, type ClipboardControlBaseProps, type ClipboardControlProps, } from './clipboard-control';
 export { ClipboardIndicator, type ClipboardIndicatorBaseProps, type ClipboardIndicatorProps, } from './clipboard-indicator';
 export { ClipboardInput, type ClipboardInputBaseProps, type ClipboardInputProps, } from './clipboard-input';
@@ -7,6 +7,7 @@ export { ClipboardLabel, type ClipboardLabelBaseProps, type ClipboardLabelProps,
 export { ClipboardRoot, type ClipboardRootBaseProps, type ClipboardRootProps, } from './clipboard-root';
 export { ClipboardRootProvider, type ClipboardRootProviderBaseProps, type ClipboardRootProviderProps, } from './clipboard-root-provider';
 export { ClipboardTrigger, type ClipboardTriggerBaseProps, type ClipboardTriggerProps, } from './clipboard-trigger';
+export { ClipboardValueText, type ClipboardValueTextBaseProps, type ClipboardValueTextProps, } from './clipboard-value-text';
 export { clipboardAnatomy } from './clipboard.anatomy';
 export { useClipboard, type UseClipboardProps, type UseClipboardReturn } from './use-clipboard';
 export { useClipboardContext, type UseClipboardContext } from './use-clipboard-context';

package/dist/components/clipboard/index.js

@@ -6,6 +6,7 @@ export { ClipboardLabel } from './clipboard-label.js';
 export { ClipboardRoot } from './clipboard-root.js';
 export { ClipboardRootProvider } from './clipboard-root-provider.js';
 export { ClipboardTrigger } from './clipboard-trigger.js';
+export { ClipboardValueText } from './clipboard-value-text.js';
 export { useClipboard } from './use-clipboard.js';
 export { useClipboardContext } from './use-clipboard-context.js';
 import * as clipboard from './clipboard.js';

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

@@ -36,6 +36,7 @@ const ComboboxImpl = (props, ref) => {
     "loopFocus",
     "multiple",
     "name",
+    "navigate",
     "onFocusOutside",
     "onHighlightChange",
     "onInputValueChange",

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

@@ -32,6 +32,7 @@ const ComboboxImpl = (props, ref) => {
     "loopFocus",
     "multiple",
     "name",
+    "navigate",
     "onFocusOutside",
     "onHighlightChange",
     "onInputValueChange",

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

@@ -44,7 +44,7 @@ export declare const useField: (props: UseFieldProps) => {
         helperText: string;
     };
     refs: {
-        rootRef: RefObject<HTMLDivElement>;
+        rootRef: RefObject<HTMLDivElement | null>;
     };
     disabled: boolean;
     invalid: boolean;

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

@@ -44,7 +44,7 @@ export declare const useField: (props: UseFieldProps) => {
         helperText: string;
     };
     refs: {
-        rootRef: RefObject<HTMLDivElement>;
+        rootRef: RefObject<HTMLDivElement | null>;
     };
     disabled: boolean;
     invalid: boolean;

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

@@ -17,7 +17,7 @@ export interface UseFieldsetProps {
 export type UseFieldsetReturn = ReturnType<typeof useFieldset>;
 export declare const useFieldset: (props: UseFieldsetProps) => {
     refs: {
-        rootRef: RefObject<HTMLFieldSetElement>;
+        rootRef: RefObject<HTMLFieldSetElement | null>;
     };
     disabled: boolean;
     invalid: boolean;

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

@@ -17,7 +17,7 @@ export interface UseFieldsetProps {
 export type UseFieldsetReturn = ReturnType<typeof useFieldset>;
 export declare const useFieldset: (props: UseFieldsetProps) => {
     refs: {
-        rootRef: RefObject<HTMLFieldSetElement>;
+        rootRef: RefObject<HTMLFieldSetElement | null>;
     };
     disabled: boolean;
     invalid: boolean;

package/dist/components/file-upload/file-upload-root.cjs

@@ -29,6 +29,7 @@ const FileUploadRoot = react.forwardRef((props, ref) => {
     "onFileAccept",
     "onFileChange",
     "onFileReject",
+    "preventDocumentDrop",
     "required",
     "translations",
     "validate"

package/dist/components/file-upload/file-upload-root.js

@@ -25,6 +25,7 @@ const FileUploadRoot = forwardRef((props, ref) => {
     "onFileAccept",
     "onFileChange",
     "onFileReject",
+    "preventDocumentDrop",
     "required",
     "translations",
     "validate"

package/dist/components/index.cjs

@@ -59,6 +59,7 @@ const clipboardLabel = require('./clipboard/clipboard-label.cjs');
 const clipboardRoot = require('./clipboard/clipboard-root.cjs');
 const clipboardRootProvider = require('./clipboard/clipboard-root-provider.cjs');
 const clipboardTrigger = require('./clipboard/clipboard-trigger.cjs');
+const clipboardValueText = require('./clipboard/clipboard-value-text.cjs');
 const useClipboard = require('./clipboard/use-clipboard.cjs');
 const useClipboardContext = require('./clipboard/use-clipboard-context.cjs');
 const clipboard$1 = require('./clipboard/clipboard.cjs');
@@ -336,6 +337,7 @@ const useProgress = require('./progress/use-progress.cjs');
 const useProgressContext = require('./progress/use-progress-context.cjs');
 const progress$1 = require('./progress/progress.cjs');
 const qrCodeContext = require('./qr-code/qr-code-context.cjs');
+const qrCodeDownloadTrigger = require('./qr-code/qr-code-download-trigger.cjs');
 const qrCodeFrame = require('./qr-code/qr-code-frame.cjs');
 const qrCodeOverlay = require('./qr-code/qr-code-overlay.cjs');
 const qrCodePattern = require('./qr-code/qr-code-pattern.cjs');
@@ -675,6 +677,7 @@ exports.ClipboardLabel = clipboardLabel.ClipboardLabel;
 exports.ClipboardRoot = clipboardRoot.ClipboardRoot;
 exports.ClipboardRootProvider = clipboardRootProvider.ClipboardRootProvider;
 exports.ClipboardTrigger = clipboardTrigger.ClipboardTrigger;
+exports.ClipboardValueText = clipboardValueText.ClipboardValueText;
 exports.useClipboard = useClipboard.useClipboard;
 exports.useClipboardContext = useClipboardContext.useClipboardContext;
 exports.Clipboard = clipboard$1;
@@ -962,6 +965,7 @@ exports.useProgress = useProgress.useProgress;
 exports.useProgressContext = useProgressContext.useProgressContext;
 exports.Progress = progress$1;
 exports.QrCodeContext = qrCodeContext.QrCodeContext;
+exports.QrCodeDownloadTrigger = qrCodeDownloadTrigger.QrCodeDownloadTrigger;
 exports.QrCodeFrame = qrCodeFrame.QrCodeFrame;
 exports.QrCodeOverlay = qrCodeOverlay.QrCodeOverlay;
 exports.QrCodePattern = qrCodePattern.QrCodePattern;

package/dist/components/index.js

@@ -59,6 +59,7 @@ export { ClipboardLabel } from './clipboard/clipboard-label.js';
 export { ClipboardRoot } from './clipboard/clipboard-root.js';
 export { ClipboardRootProvider } from './clipboard/clipboard-root-provider.js';
 export { ClipboardTrigger } from './clipboard/clipboard-trigger.js';
+export { ClipboardValueText } from './clipboard/clipboard-value-text.js';
 export { useClipboard } from './clipboard/use-clipboard.js';
 export { useClipboardContext } from './clipboard/use-clipboard-context.js';
 import * as clipboard from './clipboard/clipboard.js';
@@ -354,6 +355,7 @@ export { useProgressContext } from './progress/use-progress-context.js';
 import * as progress from './progress/progress.js';
 export { progress as Progress };
 export { QrCodeContext } from './qr-code/qr-code-context.js';
+export { QrCodeDownloadTrigger } from './qr-code/qr-code-download-trigger.js';
 export { QrCodeFrame } from './qr-code/qr-code-frame.js';
 export { QrCodeOverlay } from './qr-code/qr-code-overlay.js';
 export { QrCodePattern } from './qr-code/qr-code-pattern.js';

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

@@ -28,6 +28,7 @@ const MenuRoot = (props) => {
     "id",
     "ids",
     "loopFocus",
+    "navigate",
     "onEscapeKeyDown",
     "onFocusOutside",
     "onHighlightChange",

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

@@ -24,6 +24,7 @@ const MenuRoot = (props) => {
     "id",
     "ids",
     "loopFocus",
+    "navigate",
     "onEscapeKeyDown",
     "onFocusOutside",
     "onHighlightChange",

package/dist/components/portal/portal.d.cts

@@ -1,6 +1,6 @@
 import { PropsWithChildren, RefObject } from 'react';
 export interface PortalProps {
     disabled?: boolean;
-    container?: RefObject<HTMLElement>;
+    container?: RefObject<HTMLElement | null>;
 }
 export declare const Portal: (props: PropsWithChildren<PortalProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/portal/portal.d.ts

@@ -1,6 +1,6 @@
 import { PropsWithChildren, RefObject } from 'react';
 export interface PortalProps {
     disabled?: boolean;
-    container?: RefObject<HTMLElement>;
+    container?: RefObject<HTMLElement | null>;
 }
 export declare const Portal: (props: PropsWithChildren<PortalProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/progress/examples/circular/controlled.d.cts

@@ -0,0 +1 @@
+export declare const Controlled: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/progress/examples/circular/controlled.d.ts

@@ -0,0 +1 @@
+export declare const Controlled: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/progress/examples/linear/controlled.d.cts

@@ -0,0 +1 @@
+export declare const Controlled: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/progress/examples/linear/controlled.d.ts

@@ -0,0 +1 @@
+export declare const Controlled: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/progress/examples/linear/root-provider.d.cts

@@ -1 +1 @@
-export declare const Basic: () => import("react/jsx-runtime").JSX.Element;
+export declare const RootProvider: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/progress/examples/linear/root-provider.d.ts

@@ -1 +1 @@
-export declare const Basic: () => import("react/jsx-runtime").JSX.Element;
+export declare const RootProvider: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/progress/progress-root.cjs

@@ -13,10 +13,12 @@ const useProgressContext = require('./use-progress-context.cjs');
 
 const ProgressRoot = react.forwardRef((props, ref) => {
   const [progressProps, localProps] = createSplitProps.createSplitProps()(props, [
+    "defaultValue",
     "id",
     "ids",
     "max",
     "min",
+    "onValueChange",
     "orientation",
     "translations",
     "value"

package/dist/components/progress/progress-root.d.cts

@@ -1,8 +1,9 @@
+import { Assign } from '../../types';
 import { HTMLProps, PolymorphicProps } from '../factory';
 import { UseProgressProps } from './use-progress';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 export interface ProgressRootBaseProps extends UseProgressProps, PolymorphicProps {
 }
-export interface ProgressRootProps extends HTMLProps<'div'>, ProgressRootBaseProps {
+export interface ProgressRootProps extends Assign<HTMLProps<'div'>, ProgressRootBaseProps> {
 }
 export declare const ProgressRoot: ForwardRefExoticComponent<ProgressRootProps & RefAttributes<HTMLDivElement>>;

package/dist/components/progress/progress-root.d.ts

@@ -1,8 +1,9 @@
+import { Assign } from '../../types';
 import { HTMLProps, PolymorphicProps } from '../factory';
 import { UseProgressProps } from './use-progress';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 export interface ProgressRootBaseProps extends UseProgressProps, PolymorphicProps {
 }
-export interface ProgressRootProps extends HTMLProps<'div'>, ProgressRootBaseProps {
+export interface ProgressRootProps extends Assign<HTMLProps<'div'>, ProgressRootBaseProps> {
 }
 export declare const ProgressRoot: ForwardRefExoticComponent<ProgressRootProps & RefAttributes<HTMLDivElement>>;

package/dist/components/progress/progress-root.js

@@ -9,10 +9,12 @@ import { ProgressProvider } from './use-progress-context.js';
 
 const ProgressRoot = forwardRef((props, ref) => {
   const [progressProps, localProps] = createSplitProps()(props, [
+    "defaultValue",
     "id",
     "ids",
     "max",
     "min",
+    "onValueChange",
     "orientation",
     "translations",
     "value"

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

@@ -8,6 +8,7 @@ const react$1 = require('@zag-js/react');
 const react = require('react');
 const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
 const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
+const useEvent = require('../../utils/use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
@@ -35,11 +36,13 @@ const useProgress = (props = {}) => {
     id: react.useId(),
     dir,
     getRootNode,
+    value: props.defaultValue,
     ...props
   };
   const context = {
     ...initialContext,
-    value: props.value
+    value: props.value,
+    onValueChange: useEvent.useEvent(props.onValueChange, { sync: true })
   };
   const [state, send] = react$1.useMachine(progress__namespace.machine(initialContext), { context });
   return progress__namespace.connect(state, send, react$1.normalizeProps);

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

@@ -2,6 +2,11 @@ import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import * as progress from '@zag-js/progress';
 export interface UseProgressProps extends Optional<Omit<progress.Context, 'dir' | 'getRootNode'>, 'id'> {
+    /**
+     * The initial value of the progress when it is first rendered.
+     * Use when you do not need to control the state of the progress.
+     */
+    defaultValue?: progress.Context['value'];
 }
 export interface UseProgressReturn extends progress.Api<PropTypes> {
 }

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

@@ -2,6 +2,11 @@ import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import * as progress from '@zag-js/progress';
 export interface UseProgressProps extends Optional<Omit<progress.Context, 'dir' | 'getRootNode'>, 'id'> {
+    /**
+     * The initial value of the progress when it is first rendered.
+     * Use when you do not need to control the state of the progress.
+     */
+    defaultValue?: progress.Context['value'];
 }
 export interface UseProgressReturn extends progress.Api<PropTypes> {
 }

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

@@ -4,6 +4,7 @@ import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
 import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
+import { useEvent } from '../../utils/use-event.js';
 
 const useProgress = (props = {}) => {
   const { getRootNode } = useEnvironmentContext();
@@ -12,11 +13,13 @@ const useProgress = (props = {}) => {
     id: useId(),
     dir,
     getRootNode,
+    value: props.defaultValue,
     ...props
   };
   const context = {
     ...initialContext,
-    value: props.value
+    value: props.value,
+    onValueChange: useEvent(props.onValueChange, { sync: true })
   };
   const [state, send] = useMachine(progress.machine(initialContext), { context });
   return progress.connect(state, send, normalizeProps);

package/dist/components/qr-code/index.cjs

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const qrCodeContext = require('./qr-code-context.cjs');
+const qrCodeDownloadTrigger = require('./qr-code-download-trigger.cjs');
 const qrCodeFrame = require('./qr-code-frame.cjs');
 const qrCodeOverlay = require('./qr-code-overlay.cjs');
 const qrCodePattern = require('./qr-code-pattern.cjs');
@@ -16,6 +17,7 @@ const qrcode = require('@zag-js/qr-code');
 
 
 exports.QrCodeContext = qrCodeContext.QrCodeContext;
+exports.QrCodeDownloadTrigger = qrCodeDownloadTrigger.QrCodeDownloadTrigger;
 exports.QrCodeFrame = qrCodeFrame.QrCodeFrame;
 exports.QrCodeOverlay = qrCodeOverlay.QrCodeOverlay;
 exports.QrCodePattern = qrCodePattern.QrCodePattern;

package/dist/components/qr-code/index.d.cts

@@ -1,5 +1,6 @@
 export type { QrCodeGenerateOptions, QrCodeGenerateResult } from '@zag-js/qr-code';
 export { QrCodeContext, type QrCodeContextProps, } from './qr-code-context';
+export { QrCodeDownloadTrigger, type QrCodeDownloadTriggerBaseProps, type QrCodeDownloadTriggerProps, } from './qr-code-download-trigger';
 export { QrCodeFrame, type QrCodeFrameBaseProps, type QrCodeFrameProps, } from './qr-code-frame';
 export { QrCodeOverlay, type QrCodeOverlayBaseProps, type QrCodeOverlayProps, } from './qr-code-overlay';
 export { QrCodePattern, type QrCodePatternBaseProps, type QrCodePatternProps, } from './qr-code-pattern';

package/dist/components/qr-code/index.d.ts

@@ -1,5 +1,6 @@
 export type { QrCodeGenerateOptions, QrCodeGenerateResult } from '@zag-js/qr-code';
 export { QrCodeContext, type QrCodeContextProps, } from './qr-code-context';
+export { QrCodeDownloadTrigger, type QrCodeDownloadTriggerBaseProps, type QrCodeDownloadTriggerProps, } from './qr-code-download-trigger';
 export { QrCodeFrame, type QrCodeFrameBaseProps, type QrCodeFrameProps, } from './qr-code-frame';
 export { QrCodeOverlay, type QrCodeOverlayBaseProps, type QrCodeOverlayProps, } from './qr-code-overlay';
 export { QrCodePattern, type QrCodePatternBaseProps, type QrCodePatternProps, } from './qr-code-pattern';

package/dist/components/qr-code/index.js

@@ -1,4 +1,5 @@
 export { QrCodeContext } from './qr-code-context.js';
+export { QrCodeDownloadTrigger } from './qr-code-download-trigger.js';
 export { QrCodeFrame } from './qr-code-frame.js';
 export { QrCodeOverlay } from './qr-code-overlay.js';
 export { QrCodePattern } from './qr-code-pattern.js';

package/dist/components/qr-code/qr-code-download-trigger.cjs

@@ -0,0 +1,27 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
+const factory = require('../factory.cjs');
+const useQrCodeContext = require('./use-qr-code-context.cjs');
+
+const QrCodeDownloadTrigger = react.forwardRef(
+  (props, ref) => {
+    const [downloadTriggerProps, localProps] = createSplitProps.createSplitProps()(props, [
+      "fileName",
+      "mimeType",
+      "quality"
+    ]);
+    const qrCode = useQrCodeContext.useQrCodeContext();
+    const mergedProps = react$1.mergeProps(qrCode.getDownloadTriggerProps(downloadTriggerProps), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
+QrCodeDownloadTrigger.displayName = "QrCodeDownloadTrigger";
+
+exports.QrCodeDownloadTrigger = QrCodeDownloadTrigger;

package/dist/components/qr-code/qr-code-download-trigger.d.cts

@@ -0,0 +1,8 @@
+import { DownloadTriggerProps } from '@zag-js/qr-code';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface QrCodeDownloadTriggerBaseProps extends DownloadTriggerProps, PolymorphicProps {
+}
+export interface QrCodeDownloadTriggerProps extends HTMLProps<'button'>, QrCodeDownloadTriggerBaseProps {
+}
+export declare const QrCodeDownloadTrigger: ForwardRefExoticComponent<QrCodeDownloadTriggerProps & RefAttributes<HTMLButtonElement>>;

package/dist/components/qr-code/qr-code-download-trigger.d.ts

@@ -0,0 +1,8 @@
+import { DownloadTriggerProps } from '@zag-js/qr-code';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface QrCodeDownloadTriggerBaseProps extends DownloadTriggerProps, PolymorphicProps {
+}
+export interface QrCodeDownloadTriggerProps extends HTMLProps<'button'>, QrCodeDownloadTriggerBaseProps {
+}
+export declare const QrCodeDownloadTrigger: ForwardRefExoticComponent<QrCodeDownloadTriggerProps & RefAttributes<HTMLButtonElement>>;

package/dist/components/qr-code/qr-code-download-trigger.js

@@ -0,0 +1,23 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
+import { ark } from '../factory.js';
+import { useQrCodeContext } from './use-qr-code-context.js';
+
+const QrCodeDownloadTrigger = forwardRef(
+  (props, ref) => {
+    const [downloadTriggerProps, localProps] = createSplitProps()(props, [
+      "fileName",
+      "mimeType",
+      "quality"
+    ]);
+    const qrCode = useQrCodeContext();
+    const mergedProps = mergeProps(qrCode.getDownloadTriggerProps(downloadTriggerProps), localProps);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
+QrCodeDownloadTrigger.displayName = "QrCodeDownloadTrigger";
+
+export { QrCodeDownloadTrigger };

package/dist/components/qr-code/qr-code-root.cjs

@@ -13,9 +13,11 @@ const useQrCodeContext = require('./use-qr-code-context.cjs');
 
 const QrCodeRoot = react.forwardRef((props, ref) => {
   const [qrcodeProps, localProps] = createSplitProps.createSplitProps()(props, [
+    "defaultValue",
     "encoding",
     "id",
     "ids",
+    "onValueChange",
     "value"
   ]);
   const qrCode = useQrCode.useQrCode(qrcodeProps);

package/dist/components/qr-code/qr-code-root.d.cts

@@ -1,8 +1,9 @@
+import { Assign } from '../../types';
 import { HTMLProps, PolymorphicProps } from '../factory';
 import { UseQrCodeProps } from './use-qr-code';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 export interface QrCodeRootBaseProps extends UseQrCodeProps, PolymorphicProps {
 }
-export interface QrCodeRootProps extends HTMLProps<'div'>, QrCodeRootBaseProps {
+export interface QrCodeRootProps extends Assign<HTMLProps<'div'>, QrCodeRootBaseProps> {
 }
 export declare const QrCodeRoot: ForwardRefExoticComponent<QrCodeRootProps & RefAttributes<HTMLDivElement>>;

package/dist/components/qr-code/qr-code-root.d.ts

@@ -1,8 +1,9 @@
+import { Assign } from '../../types';
 import { HTMLProps, PolymorphicProps } from '../factory';
 import { UseQrCodeProps } from './use-qr-code';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 export interface QrCodeRootBaseProps extends UseQrCodeProps, PolymorphicProps {
 }
-export interface QrCodeRootProps extends HTMLProps<'div'>, QrCodeRootBaseProps {
+export interface QrCodeRootProps extends Assign<HTMLProps<'div'>, QrCodeRootBaseProps> {
 }
 export declare const QrCodeRoot: ForwardRefExoticComponent<QrCodeRootProps & RefAttributes<HTMLDivElement>>;

package/dist/components/qr-code/qr-code-root.js

@@ -9,9 +9,11 @@ import { QrCodeProvider } from './use-qr-code-context.js';
 
 const QrCodeRoot = forwardRef((props, ref) => {
   const [qrcodeProps, localProps] = createSplitProps()(props, [
+    "defaultValue",
     "encoding",
     "id",
     "ids",
+    "onValueChange",
     "value"
   ]);
   const qrCode = useQrCode(qrcodeProps);

package/dist/components/qr-code/qr-code.cjs

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const qrCodeContext = require('./qr-code-context.cjs');
+const qrCodeDownloadTrigger = require('./qr-code-download-trigger.cjs');
 const qrCodeFrame = require('./qr-code-frame.cjs');
 const qrCodeOverlay = require('./qr-code-overlay.cjs');
 const qrCodePattern = require('./qr-code-pattern.cjs');
@@ -12,6 +13,7 @@ const qrCodeRootProvider = require('./qr-code-root-provider.cjs');
 
 
 exports.Context = qrCodeContext.QrCodeContext;
+exports.DownloadTrigger = qrCodeDownloadTrigger.QrCodeDownloadTrigger;
 exports.Frame = qrCodeFrame.QrCodeFrame;
 exports.Overlay = qrCodeOverlay.QrCodeOverlay;
 exports.Pattern = qrCodePattern.QrCodePattern;

package/dist/components/qr-code/qr-code.d.cts

@@ -1,7 +1,8 @@
 export type { QrCodeGenerateOptions as GenerateOptions, QrCodeGenerateResult as GenerateResult, } from '@zag-js/qr-code';
 export { QrCodeContext as Context, type QrCodeContextProps as ContextProps, } from './qr-code-context';
-export { QrCodeFrame as Frame, type QrCodeFrameProps as FrameProps, type QrCodeFrameBaseProps as FrameBaseProps, } from './qr-code-frame';
-export { QrCodeOverlay as Overlay, type QrCodeOverlayProps as OverlayProps, type QrCodeOverlayBaseProps as OverlayBaseProps, } from './qr-code-overlay';
-export { QrCodePattern as Pattern, type QrCodePatternProps as PatternProps, type QrCodePatternBaseProps as PatternBaseProps, } from './qr-code-pattern';
-export { QrCodeRoot as Root, type QrCodeRootProps as RootProps, type QrCodeRootBaseProps as RootBaseProps, } from './qr-code-root';
-export { QrCodeRootProvider as RootProvider, type QrCodeRootProviderProps as RootProviderProps, type QrCodeRootProviderBaseProps as RootProviderBaseProps, } from './qr-code-root-provider';
+export { QrCodeDownloadTrigger as DownloadTrigger, type QrCodeDownloadTriggerBaseProps as DownloadTriggerBaseProps, type QrCodeDownloadTriggerProps as DownloadTriggerProps, } from './qr-code-download-trigger';
+export { QrCodeFrame as Frame, type QrCodeFrameBaseProps as FrameBaseProps, type QrCodeFrameProps as FrameProps, } from './qr-code-frame';
+export { QrCodeOverlay as Overlay, type QrCodeOverlayBaseProps as OverlayBaseProps, type QrCodeOverlayProps as OverlayProps, } from './qr-code-overlay';
+export { QrCodePattern as Pattern, type QrCodePatternBaseProps as PatternBaseProps, type QrCodePatternProps as PatternProps, } from './qr-code-pattern';
+export { QrCodeRoot as Root, type QrCodeRootBaseProps as RootBaseProps, type QrCodeRootProps as RootProps, } from './qr-code-root';
+export { QrCodeRootProvider as RootProvider, type QrCodeRootProviderBaseProps as RootProviderBaseProps, type QrCodeRootProviderProps as RootProviderProps, } from './qr-code-root-provider';

package/dist/components/qr-code/qr-code.d.ts

@@ -1,7 +1,8 @@
 export type { QrCodeGenerateOptions as GenerateOptions, QrCodeGenerateResult as GenerateResult, } from '@zag-js/qr-code';
 export { QrCodeContext as Context, type QrCodeContextProps as ContextProps, } from './qr-code-context';
-export { QrCodeFrame as Frame, type QrCodeFrameProps as FrameProps, type QrCodeFrameBaseProps as FrameBaseProps, } from './qr-code-frame';
-export { QrCodeOverlay as Overlay, type QrCodeOverlayProps as OverlayProps, type QrCodeOverlayBaseProps as OverlayBaseProps, } from './qr-code-overlay';
-export { QrCodePattern as Pattern, type QrCodePatternProps as PatternProps, type QrCodePatternBaseProps as PatternBaseProps, } from './qr-code-pattern';
-export { QrCodeRoot as Root, type QrCodeRootProps as RootProps, type QrCodeRootBaseProps as RootBaseProps, } from './qr-code-root';
-export { QrCodeRootProvider as RootProvider, type QrCodeRootProviderProps as RootProviderProps, type QrCodeRootProviderBaseProps as RootProviderBaseProps, } from './qr-code-root-provider';
+export { QrCodeDownloadTrigger as DownloadTrigger, type QrCodeDownloadTriggerBaseProps as DownloadTriggerBaseProps, type QrCodeDownloadTriggerProps as DownloadTriggerProps, } from './qr-code-download-trigger';
+export { QrCodeFrame as Frame, type QrCodeFrameBaseProps as FrameBaseProps, type QrCodeFrameProps as FrameProps, } from './qr-code-frame';
+export { QrCodeOverlay as Overlay, type QrCodeOverlayBaseProps as OverlayBaseProps, type QrCodeOverlayProps as OverlayProps, } from './qr-code-overlay';
+export { QrCodePattern as Pattern, type QrCodePatternBaseProps as PatternBaseProps, type QrCodePatternProps as PatternProps, } from './qr-code-pattern';
+export { QrCodeRoot as Root, type QrCodeRootBaseProps as RootBaseProps, type QrCodeRootProps as RootProps, } from './qr-code-root';
+export { QrCodeRootProvider as RootProvider, type QrCodeRootProviderBaseProps as RootProviderBaseProps, type QrCodeRootProviderProps as RootProviderProps, } from './qr-code-root-provider';

package/dist/components/qr-code/qr-code.js

@@ -1,4 +1,5 @@
 export { QrCodeContext as Context } from './qr-code-context.js';
+export { QrCodeDownloadTrigger as DownloadTrigger } from './qr-code-download-trigger.js';
 export { QrCodeFrame as Frame } from './qr-code-frame.js';
 export { QrCodeOverlay as Overlay } from './qr-code-overlay.js';
 export { QrCodePattern as Pattern } from './qr-code-pattern.js';

package/dist/components/qr-code/use-qr-code.cjs

@@ -8,6 +8,7 @@ const react$1 = require('@zag-js/react');
 const react = require('react');
 const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
 const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
+const useEvent = require('../../utils/use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
@@ -31,13 +32,20 @@ const qrcode__namespace = /*#__PURE__*/_interopNamespaceDefault(qrcode);
 const useQrCode = (props = {}) => {
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
-  const context = {
+  const initialContext = {
     id: react.useId(),
     dir,
+    value: props.defaultValue,
     getRootNode,
+    onValueChange: useEvent.useEvent(props.onValueChange, { sync: true }),
     ...props
   };
-  const [state, send] = react$1.useMachine(qrcode__namespace.machine(context), { context });
+  const context = {
+    ...initialContext,
+    value: props.value,
+    onValueChange: useEvent.useEvent(props.onValueChange, { sync: true })
+  };
+  const [state, send] = react$1.useMachine(qrcode__namespace.machine(initialContext), { context });
   return qrcode__namespace.connect(state, send, react$1.normalizeProps);
 };
 

package/dist/components/qr-code/use-qr-code.d.cts

@@ -2,6 +2,11 @@ import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import * as qrcode from '@zag-js/qr-code';
 export interface UseQrCodeProps extends Optional<Omit<qrcode.Context, 'dir' | 'getRootNode'>, 'id'> {
+    /**
+     * The initial value of the qr code when it is first rendered.
+     * Use when you do not need to control the state of the qr code.
+     */
+    defaultValue?: qrcode.Context['value'];
 }
 export interface UseQrCodeReturn extends qrcode.Api<PropTypes> {
 }

package/dist/components/qr-code/use-qr-code.d.ts

@@ -2,6 +2,11 @@ import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import * as qrcode from '@zag-js/qr-code';
 export interface UseQrCodeProps extends Optional<Omit<qrcode.Context, 'dir' | 'getRootNode'>, 'id'> {
+    /**
+     * The initial value of the qr code when it is first rendered.
+     * Use when you do not need to control the state of the qr code.
+     */
+    defaultValue?: qrcode.Context['value'];
 }
 export interface UseQrCodeReturn extends qrcode.Api<PropTypes> {
 }

package/dist/components/qr-code/use-qr-code.js

@@ -4,17 +4,25 @@ import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
 import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
+import { useEvent } from '../../utils/use-event.js';
 
 const useQrCode = (props = {}) => {
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
-  const context = {
+  const initialContext = {
     id: useId(),
     dir,
+    value: props.defaultValue,
     getRootNode,
+    onValueChange: useEvent(props.onValueChange, { sync: true }),
     ...props
   };
-  const [state, send] = useMachine(qrcode.machine(context), { context });
+  const context = {
+    ...initialContext,
+    value: props.value,
+    onValueChange: useEvent(props.onValueChange, { sync: true })
+  };
+  const [state, send] = useMachine(qrcode.machine(initialContext), { context });
   return qrcode.connect(state, send, normalizeProps);
 };
 

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

@@ -22,6 +22,7 @@ const TabsRoot = react.forwardRef((props, ref) => {
     "id",
     "ids",
     "loopFocus",
+    "navigate",
     "onFocusChange",
     "onValueChange",
     "orientation",

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

@@ -18,6 +18,7 @@ const TabsRoot = forwardRef((props, ref) => {
     "id",
     "ids",
     "loopFocus",
+    "navigate",
     "onFocusChange",
     "onValueChange",
     "orientation",

package/dist/components/tree-view/tree-view-root-provider.d.cts

@@ -1,3 +1,4 @@
+import { JSX } from 'react';
 import { RenderStrategyProps } from '../../utils/render-strategy';
 import { TreeNode } from '../collection';
 import { HTMLProps, PolymorphicProps } from '../factory';

package/dist/components/tree-view/tree-view-root-provider.d.ts

@@ -1,3 +1,4 @@
+import { JSX } from 'react';
 import { RenderStrategyProps } from '../../utils/render-strategy';
 import { TreeNode } from '../collection';
 import { HTMLProps, PolymorphicProps } from '../factory';

package/dist/components/tree-view/tree-view-root.d.cts

@@ -1,3 +1,4 @@
+import { JSX } from 'react';
 import { RenderStrategyProps } from '../../utils/render-strategy';
 import { TreeNode } from '../collection';
 import { HTMLProps, PolymorphicProps } from '../factory';

package/dist/components/tree-view/tree-view-root.d.ts

@@ -1,3 +1,4 @@
+import { JSX } from 'react';
 import { RenderStrategyProps } from '../../utils/render-strategy';
 import { TreeNode } from '../collection';
 import { HTMLProps, PolymorphicProps } from '../factory';

package/dist/index.cjs

@@ -59,6 +59,7 @@ const clipboardLabel = require('./components/clipboard/clipboard-label.cjs');
 const clipboardRoot = require('./components/clipboard/clipboard-root.cjs');
 const clipboardRootProvider = require('./components/clipboard/clipboard-root-provider.cjs');
 const clipboardTrigger = require('./components/clipboard/clipboard-trigger.cjs');
+const clipboardValueText = require('./components/clipboard/clipboard-value-text.cjs');
 const useClipboard = require('./components/clipboard/use-clipboard.cjs');
 const useClipboardContext = require('./components/clipboard/use-clipboard-context.cjs');
 const clipboard$1 = require('./components/clipboard/clipboard.cjs');
@@ -336,6 +337,7 @@ const useProgress = require('./components/progress/use-progress.cjs');
 const useProgressContext = require('./components/progress/use-progress-context.cjs');
 const progress$1 = require('./components/progress/progress.cjs');
 const qrCodeContext = require('./components/qr-code/qr-code-context.cjs');
+const qrCodeDownloadTrigger = require('./components/qr-code/qr-code-download-trigger.cjs');
 const qrCodeFrame = require('./components/qr-code/qr-code-frame.cjs');
 const qrCodeOverlay = require('./components/qr-code/qr-code-overlay.cjs');
 const qrCodePattern = require('./components/qr-code/qr-code-pattern.cjs');
@@ -679,6 +681,7 @@ exports.ClipboardLabel = clipboardLabel.ClipboardLabel;
 exports.ClipboardRoot = clipboardRoot.ClipboardRoot;
 exports.ClipboardRootProvider = clipboardRootProvider.ClipboardRootProvider;
 exports.ClipboardTrigger = clipboardTrigger.ClipboardTrigger;
+exports.ClipboardValueText = clipboardValueText.ClipboardValueText;
 exports.useClipboard = useClipboard.useClipboard;
 exports.useClipboardContext = useClipboardContext.useClipboardContext;
 exports.Clipboard = clipboard$1;
@@ -966,6 +969,7 @@ exports.useProgress = useProgress.useProgress;
 exports.useProgressContext = useProgressContext.useProgressContext;
 exports.Progress = progress$1;
 exports.QrCodeContext = qrCodeContext.QrCodeContext;
+exports.QrCodeDownloadTrigger = qrCodeDownloadTrigger.QrCodeDownloadTrigger;
 exports.QrCodeFrame = qrCodeFrame.QrCodeFrame;
 exports.QrCodeOverlay = qrCodeOverlay.QrCodeOverlay;
 exports.QrCodePattern = qrCodePattern.QrCodePattern;

package/dist/index.js

@@ -59,6 +59,7 @@ export { ClipboardLabel } from './components/clipboard/clipboard-label.js';
 export { ClipboardRoot } from './components/clipboard/clipboard-root.js';
 export { ClipboardRootProvider } from './components/clipboard/clipboard-root-provider.js';
 export { ClipboardTrigger } from './components/clipboard/clipboard-trigger.js';
+export { ClipboardValueText } from './components/clipboard/clipboard-value-text.js';
 export { useClipboard } from './components/clipboard/use-clipboard.js';
 export { useClipboardContext } from './components/clipboard/use-clipboard-context.js';
 import * as clipboard from './components/clipboard/clipboard.js';
@@ -354,6 +355,7 @@ export { useProgressContext } from './components/progress/use-progress-context.j
 import * as progress from './components/progress/progress.js';
 export { progress as Progress };
 export { QrCodeContext } from './components/qr-code/qr-code-context.js';
+export { QrCodeDownloadTrigger } from './components/qr-code/qr-code-download-trigger.js';
 export { QrCodeFrame } from './components/qr-code/qr-code-frame.js';
 export { QrCodeOverlay } from './components/qr-code/qr-code-overlay.js';
 export { QrCodePattern } from './components/qr-code/qr-code-pattern.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ark-ui/react",
-  "version": "4.6.0",
+  "version": "4.7.0",
   "description": "A collection of unstyled, accessible UI components for React, utilizing state machines for seamless interaction.",
   "keywords": [
     "accordion",
@@ -161,55 +161,55 @@
   "sideEffects": false,
   "dependencies": {
     "@internationalized/date": "3.6.0",
-    "@zag-js/accordion": "0.79.1",
-    "@zag-js/anatomy": "0.79.1",
-    "@zag-js/auto-resize": "0.79.1",
-    "@zag-js/avatar": "0.79.1",
-    "@zag-js/carousel": "0.79.1",
-    "@zag-js/checkbox": "0.79.1",
-    "@zag-js/clipboard": "0.79.1",
-    "@zag-js/collapsible": "0.79.1",
-    "@zag-js/collection": "0.79.1",
-    "@zag-js/color-picker": "0.79.1",
-    "@zag-js/color-utils": "0.79.1",
-    "@zag-js/combobox": "0.79.1",
-    "@zag-js/core": "0.79.1",
-    "@zag-js/date-picker": "0.79.1",
-    "@zag-js/date-utils": "0.79.1",
-    "@zag-js/dialog": "0.79.1",
-    "@zag-js/dom-query": "0.79.1",
-    "@zag-js/editable": "0.79.1",
-    "@zag-js/file-upload": "0.79.1",
-    "@zag-js/file-utils": "0.79.1",
-    "@zag-js/highlight-word": "0.79.1",
-    "@zag-js/hover-card": "0.79.1",
-    "@zag-js/i18n-utils": "0.79.1",
-    "@zag-js/menu": "0.79.1",
-    "@zag-js/number-input": "0.79.1",
-    "@zag-js/pagination": "0.79.1",
-    "@zag-js/pin-input": "0.79.1",
-    "@zag-js/popover": "0.79.1",
-    "@zag-js/presence": "0.79.1",
-    "@zag-js/progress": "0.79.1",
-    "@zag-js/qr-code": "0.79.1",
-    "@zag-js/radio-group": "0.79.1",
-    "@zag-js/rating-group": "0.79.1",
-    "@zag-js/react": "0.79.1",
-    "@zag-js/select": "0.79.1",
-    "@zag-js/signature-pad": "0.79.1",
-    "@zag-js/slider": "0.79.1",
-    "@zag-js/splitter": "0.79.1",
-    "@zag-js/steps": "0.79.1",
-    "@zag-js/switch": "0.79.1",
-    "@zag-js/tabs": "0.79.1",
-    "@zag-js/tags-input": "0.79.1",
-    "@zag-js/time-picker": "0.79.1",
-    "@zag-js/timer": "0.79.1",
-    "@zag-js/toast": "0.79.1",
-    "@zag-js/toggle-group": "0.79.1",
-    "@zag-js/tooltip": "0.79.1",
-    "@zag-js/tree-view": "0.79.1",
-    "@zag-js/types": "0.79.1"
+    "@zag-js/accordion": "0.81.0",
+    "@zag-js/anatomy": "0.81.0",
+    "@zag-js/auto-resize": "0.81.0",
+    "@zag-js/avatar": "0.81.0",
+    "@zag-js/carousel": "0.81.0",
+    "@zag-js/checkbox": "0.81.0",
+    "@zag-js/clipboard": "0.81.0",
+    "@zag-js/collapsible": "0.81.0",
+    "@zag-js/collection": "0.81.0",
+    "@zag-js/color-picker": "0.81.0",
+    "@zag-js/color-utils": "0.81.0",
+    "@zag-js/combobox": "0.81.0",
+    "@zag-js/core": "0.81.0",
+    "@zag-js/date-picker": "0.81.0",
+    "@zag-js/date-utils": "0.81.0",
+    "@zag-js/dialog": "0.81.0",
+    "@zag-js/dom-query": "0.81.0",
+    "@zag-js/editable": "0.81.0",
+    "@zag-js/file-upload": "0.81.0",
+    "@zag-js/file-utils": "0.81.0",
+    "@zag-js/highlight-word": "0.81.0",
+    "@zag-js/hover-card": "0.81.0",
+    "@zag-js/i18n-utils": "0.81.0",
+    "@zag-js/menu": "0.81.0",
+    "@zag-js/number-input": "0.81.0",
+    "@zag-js/pagination": "0.81.0",
+    "@zag-js/pin-input": "0.81.0",
+    "@zag-js/popover": "0.81.0",
+    "@zag-js/presence": "0.81.0",
+    "@zag-js/progress": "0.81.0",
+    "@zag-js/qr-code": "0.81.0",
+    "@zag-js/radio-group": "0.81.0",
+    "@zag-js/rating-group": "0.81.0",
+    "@zag-js/react": "0.81.0",
+    "@zag-js/select": "0.81.0",
+    "@zag-js/signature-pad": "0.81.0",
+    "@zag-js/slider": "0.81.0",
+    "@zag-js/splitter": "0.81.0",
+    "@zag-js/steps": "0.81.0",
+    "@zag-js/switch": "0.81.0",
+    "@zag-js/tabs": "0.81.0",
+    "@zag-js/tags-input": "0.81.0",
+    "@zag-js/time-picker": "0.81.0",
+    "@zag-js/timer": "0.81.0",
+    "@zag-js/toast": "0.81.0",
+    "@zag-js/toggle-group": "0.81.0",
+    "@zag-js/tooltip": "0.81.0",
+    "@zag-js/tree-view": "0.81.0",
+    "@zag-js/types": "0.81.0"
   },
   "devDependencies": {
     "@biomejs/biome": "1.9.4",
@@ -220,19 +220,19 @@
     "@storybook/react": "8.4.7",
     "@testing-library/dom": "10.4.0",
     "@testing-library/jest-dom": "6.6.3",
-    "@testing-library/react": "16.0.1",
+    "@testing-library/react": "16.1.0",
     "@testing-library/user-event": "14.5.2",
     "@types/jsdom": "21.1.7",
-    "@types/react": "18.3.18",
-    "@types/react-dom": "18.3.5",
+    "@types/react": "19.0.2",
+    "@types/react-dom": "19.0.2",
     "@vitejs/plugin-react": "4.3.4",
-    "@zag-js/stringify-state": "0.79.1",
+    "@zag-js/stringify-state": "0.81.0",
     "clean-package": "2.2.0",
     "globby": "14.0.2",
     "jsdom": "25.0.1",
     "lucide-react": "0.469.0",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
     "react-frame-component": "5.2.7",
     "react-hook-form": "7.54.2",
     "release-it": "17.11.0",