@ark-ui/react 4.9.1 → 5.0.0

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

@@ -5,13 +5,11 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useSelectContext } from './use-select-context.js';
 
-const SelectClearTrigger = forwardRef(
-  (props, ref) => {
-    const select = useSelectContext();
-    const mergedProps = mergeProps(select.getClearTriggerProps(), props);
-    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
-  }
-);
+const SelectClearTrigger = forwardRef((props, ref) => {
+  const select = useSelectContext();
+  const mergedProps = mergeProps(select.getClearTriggerProps(), props);
+  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+});
 SelectClearTrigger.displayName = "SelectClearTrigger";
 
 export { SelectClearTrigger };

package/dist/components/select/select-context.d.cts

@@ -4,4 +4,4 @@ import { UseSelectContext } from './use-select-context';
 export interface SelectContextProps<T extends CollectionItem> {
     children: (context: UseSelectContext<T>) => ReactNode;
 }
-export declare const SelectContext: <T extends unknown>(props: SelectContextProps<T>) => ReactNode;
+export declare const SelectContext: <T extends CollectionItem>(props: SelectContextProps<T>) => ReactNode;

package/dist/components/select/select-context.d.ts

@@ -4,4 +4,4 @@ import { UseSelectContext } from './use-select-context';
 export interface SelectContextProps<T extends CollectionItem> {
     children: (context: UseSelectContext<T>) => ReactNode;
 }
-export declare const SelectContext: <T extends unknown>(props: SelectContextProps<T>) => ReactNode;
+export declare const SelectContext: <T extends CollectionItem>(props: SelectContextProps<T>) => ReactNode;

package/dist/components/select/select-hidden-select.cjs

@@ -10,25 +10,24 @@ const factory = require('../factory.cjs');
 const useFieldContext = require('../field/use-field-context.cjs');
 const useSelectContext = require('./use-select-context.cjs');
 
-const SelectHiddenSelect = react.forwardRef(
-  (props, ref) => {
-    const select = useSelectContext.useSelectContext();
-    const mergedProps = react$1.mergeProps(select.getHiddenSelectProps(), props);
-    const isValueEmpty = select.value.length === 0;
-    const field = useFieldContext.useFieldContext();
-    return /* @__PURE__ */ jsxRuntime.jsxs(factory.ark.select, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref, children: [
-      isValueEmpty && /* @__PURE__ */ jsxRuntime.jsx("option", { value: "" }),
-      select.collection.items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
-        "option",
-        {
-          value: select.collection.getItemValue(item) ?? "",
-          disabled: select.collection.getItemDisabled(item)
-        },
-        index
-      ))
-    ] });
-  }
-);
+const SelectHiddenSelect = react.forwardRef((props, ref) => {
+  const select = useSelectContext.useSelectContext();
+  const mergedProps = react$1.mergeProps(select.getHiddenSelectProps(), props);
+  const isValueEmpty = select.value.length === 0;
+  const field = useFieldContext.useFieldContext();
+  return /* @__PURE__ */ jsxRuntime.jsxs(factory.ark.select, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref, children: [
+    isValueEmpty && /* @__PURE__ */ jsxRuntime.jsx("option", { value: "" }),
+    select.collection.items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      "option",
+      {
+        value: select.collection.getItemValue(item) ?? "",
+        disabled: select.collection.getItemDisabled(item),
+        children: select.collection.stringifyItem(item)
+      },
+      index
+    ))
+  ] });
+});
 SelectHiddenSelect.displayName = "SelectHiddenSelect";
 
 exports.SelectHiddenSelect = SelectHiddenSelect;

package/dist/components/select/select-hidden-select.js

@@ -6,25 +6,24 @@ import { ark } from '../factory.js';
 import { useFieldContext } from '../field/use-field-context.js';
 import { useSelectContext } from './use-select-context.js';
 
-const SelectHiddenSelect = forwardRef(
-  (props, ref) => {
-    const select = useSelectContext();
-    const mergedProps = mergeProps(select.getHiddenSelectProps(), props);
-    const isValueEmpty = select.value.length === 0;
-    const field = useFieldContext();
-    return /* @__PURE__ */ jsxs(ark.select, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref, children: [
-      isValueEmpty && /* @__PURE__ */ jsx("option", { value: "" }),
-      select.collection.items.map((item, index) => /* @__PURE__ */ jsx(
-        "option",
-        {
-          value: select.collection.getItemValue(item) ?? "",
-          disabled: select.collection.getItemDisabled(item)
-        },
-        index
-      ))
-    ] });
-  }
-);
+const SelectHiddenSelect = forwardRef((props, ref) => {
+  const select = useSelectContext();
+  const mergedProps = mergeProps(select.getHiddenSelectProps(), props);
+  const isValueEmpty = select.value.length === 0;
+  const field = useFieldContext();
+  return /* @__PURE__ */ jsxs(ark.select, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref, children: [
+    isValueEmpty && /* @__PURE__ */ jsx("option", { value: "" }),
+    select.collection.items.map((item, index) => /* @__PURE__ */ jsx(
+      "option",
+      {
+        value: select.collection.getItemValue(item) ?? "",
+        disabled: select.collection.getItemDisabled(item),
+        children: select.collection.stringifyItem(item)
+      },
+      index
+    ))
+  ] });
+});
 SelectHiddenSelect.displayName = "SelectHiddenSelect";
 
 export { SelectHiddenSelect };

package/dist/components/select/select-item-group-label.cjs

@@ -10,17 +10,12 @@ const factory = require('../factory.cjs');
 const useSelectContext = require('./use-select-context.cjs');
 const useSelectItemGroupProps = require('./use-select-item-group-props.cjs');
 
-const SelectItemGroupLabel = react.forwardRef(
-  (props, ref) => {
-    const select = useSelectContext.useSelectContext();
-    const itemGroupProps = useSelectItemGroupProps.useSelectItemGroupPropsContext();
-    const mergedProps = react$1.mergeProps(
-      select.getItemGroupLabelProps({ htmlFor: itemGroupProps.id }),
-      props
-    );
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const SelectItemGroupLabel = react.forwardRef((props, ref) => {
+  const select = useSelectContext.useSelectContext();
+  const itemGroupProps = useSelectItemGroupProps.useSelectItemGroupPropsContext();
+  const mergedProps = react$1.mergeProps(select.getItemGroupLabelProps({ htmlFor: itemGroupProps.id }), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 SelectItemGroupLabel.displayName = "SelectItemGroupLabel";
 
 exports.SelectItemGroupLabel = SelectItemGroupLabel;

package/dist/components/select/select-item-group-label.js

@@ -6,17 +6,12 @@ import { ark } from '../factory.js';
 import { useSelectContext } from './use-select-context.js';
 import { useSelectItemGroupPropsContext } from './use-select-item-group-props.js';
 
-const SelectItemGroupLabel = forwardRef(
-  (props, ref) => {
-    const select = useSelectContext();
-    const itemGroupProps = useSelectItemGroupPropsContext();
-    const mergedProps = mergeProps(
-      select.getItemGroupLabelProps({ htmlFor: itemGroupProps.id }),
-      props
-    );
-    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-  }
-);
+const SelectItemGroupLabel = forwardRef((props, ref) => {
+  const select = useSelectContext();
+  const itemGroupProps = useSelectItemGroupPropsContext();
+  const mergedProps = mergeProps(select.getItemGroupLabelProps({ htmlFor: itemGroupProps.id }), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
 SelectItemGroupLabel.displayName = "SelectItemGroupLabel";
 
 export { SelectItemGroupLabel };

package/dist/components/select/select-item-indicator.cjs

@@ -10,14 +10,12 @@ const factory = require('../factory.cjs');
 const useSelectContext = require('./use-select-context.cjs');
 const useSelectItemPropsContext = require('./use-select-item-props-context.cjs');
 
-const SelectItemIndicator = react.forwardRef(
-  (props, ref) => {
-    const select = useSelectContext.useSelectContext();
-    const itemProps = useSelectItemPropsContext.useSelectItemPropsContext();
-    const mergedProps = react$1.mergeProps(select.getItemIndicatorProps(itemProps), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const SelectItemIndicator = react.forwardRef((props, ref) => {
+  const select = useSelectContext.useSelectContext();
+  const itemProps = useSelectItemPropsContext.useSelectItemPropsContext();
+  const mergedProps = react$1.mergeProps(select.getItemIndicatorProps(itemProps), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 SelectItemIndicator.displayName = "SelectItemIndicator";
 
 exports.SelectItemIndicator = SelectItemIndicator;

package/dist/components/select/select-item-indicator.js

@@ -6,14 +6,12 @@ import { ark } from '../factory.js';
 import { useSelectContext } from './use-select-context.js';
 import { useSelectItemPropsContext } from './use-select-item-props-context.js';
 
-const SelectItemIndicator = forwardRef(
-  (props, ref) => {
-    const select = useSelectContext();
-    const itemProps = useSelectItemPropsContext();
-    const mergedProps = mergeProps(select.getItemIndicatorProps(itemProps), props);
-    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-  }
-);
+const SelectItemIndicator = forwardRef((props, ref) => {
+  const select = useSelectContext();
+  const itemProps = useSelectItemPropsContext();
+  const mergedProps = mergeProps(select.getItemIndicatorProps(itemProps), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
 SelectItemIndicator.displayName = "SelectItemIndicator";
 
 export { SelectItemIndicator };

package/dist/components/select/select-root-provider.cjs

@@ -15,9 +15,7 @@ const useSelectContext = require('./use-select-context.cjs');
 
 const SelectImpl = (props, ref) => {
   const [presenceProps, selectProps] = splitPresenceProps.splitPresenceProps(props);
-  const [{ value: select }, localProps] = createSplitProps.createSplitProps()(selectProps, [
-    "value"
-  ]);
+  const [{ value: select }, localProps] = createSplitProps.createSplitProps()(selectProps, ["value"]);
   const presence = usePresence.usePresence(react$1.mergeProps({ present: select.open }, presenceProps));
   const mergedProps = react$1.mergeProps(select.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useSelectContext.SelectProvider, { value: select, children: /* @__PURE__ */ jsxRuntime.jsx(usePresenceContext.PresenceProvider, { value: presence, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) }) });

package/dist/components/select/select-root-provider.js

@@ -11,9 +11,7 @@ import { SelectProvider } from './use-select-context.js';
 
 const SelectImpl = (props, ref) => {
   const [presenceProps, selectProps] = splitPresenceProps(props);
-  const [{ value: select }, localProps] = createSplitProps()(selectProps, [
-    "value"
-  ]);
+  const [{ value: select }, localProps] = createSplitProps()(selectProps, ["value"]);
   const presence = usePresence(mergeProps({ present: select.open }, presenceProps));
   const mergedProps = mergeProps(select.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(SelectProvider, { value: select, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presence, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) }) });

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

@@ -20,6 +20,7 @@ const SelectImpl = (props, ref) => {
     "closeOnSelect",
     "collection",
     "composite",
+    "defaultHighlightedValue",
     "defaultOpen",
     "defaultValue",
     "deselectable",

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

@@ -16,6 +16,7 @@ const SelectImpl = (props, ref) => {
     "closeOnSelect",
     "collection",
     "composite",
+    "defaultHighlightedValue",
     "defaultOpen",
     "defaultValue",
     "deselectable",

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

@@ -8,7 +8,6 @@ const select = require('@zag-js/select');
 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');
 const useFieldContext = require('../field/use-field-context.cjs');
 
 function _interopNamespaceDefault(e) {
@@ -31,12 +30,12 @@ function _interopNamespaceDefault(e) {
 const select__namespace = /*#__PURE__*/_interopNamespaceDefault(select);
 
 const useSelect = (props) => {
-  const { collection, ...selectProps } = props;
-  const locale = useLocaleContext.useLocaleContext();
-  const environment = useEnvironmentContext.useEnvironmentContext();
+  const id = react.useId();
+  const { dir } = useLocaleContext.useLocaleContext();
+  const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const field = useFieldContext.useFieldContext();
-  const initialContext = {
-    id: react.useId(),
+  const machineProps = {
+    id,
     ids: {
       label: field?.ids.label,
       hiddenSelect: field?.ids.control
@@ -45,31 +44,12 @@ const useSelect = (props) => {
     readOnly: field?.readOnly,
     invalid: field?.invalid,
     required: field?.required,
-    dir: locale.dir,
-    getRootNode: environment.getRootNode,
-    collection,
-    open: props.defaultOpen,
-    value: props.defaultValue,
-    "open.controlled": props.open !== void 0,
-    ...selectProps
+    dir,
+    getRootNode,
+    ...props
   };
-  const context = (() => {
-    const { collection: _, ...restProps } = initialContext;
-    return {
-      ...restProps,
-      value: props.value,
-      onValueChange: useEvent.useEvent(props.onValueChange, { sync: true }),
-      onHighlightChange: useEvent.useEvent(props.onHighlightChange),
-      onOpenChange: useEvent.useEvent(props.onOpenChange)
-    };
-  })();
-  const [state, send, service] = react$1.useMachine(select__namespace.machine(initialContext), {
-    context
-  });
-  react.useEffect(() => {
-    service.setContext({ collection });
-  }, [collection]);
-  return select__namespace.connect(state, send, react$1.normalizeProps);
+  const service = react$1.useMachine(select__namespace.machine, machineProps);
+  return select__namespace.connect(service, react$1.normalizeProps);
 };
 
 exports.useSelect = useSelect;

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

@@ -2,17 +2,7 @@ import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import { CollectionItem, ListCollection } from '../collection';
 import * as select from '@zag-js/select';
-export interface UseSelectProps<T extends CollectionItem> extends Optional<Omit<select.Context<T>, 'dir' | 'getRootNode' | 'open.controlled' | 'collection'>, 'id'> {
-    /**
-     * The initial open state of the select when it is first rendered.
-     * Use when you do not need to control its open state.
-     */
-    defaultOpen?: select.Context['open'];
-    /**
-     * The initial value of the select when it is first rendered.
-     * Use when you do not need to control the state of the select.
-     */
-    defaultValue?: select.Context<T>['value'];
+export interface UseSelectProps<T extends CollectionItem> extends Optional<Omit<select.Props<T>, 'dir' | 'getRootNode' | 'collection'>, 'id'> {
     /**
      * The collection of items
      */
@@ -20,4 +10,4 @@ export interface UseSelectProps<T extends CollectionItem> extends Optional<Omit<
 }
 export interface UseSelectReturn<T extends CollectionItem> extends select.Api<PropTypes, T> {
 }
-export declare const useSelect: <T extends unknown>(props: UseSelectProps<T>) => UseSelectReturn<T>;
+export declare const useSelect: <T extends CollectionItem>(props: UseSelectProps<T>) => UseSelectReturn<T>;

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

@@ -2,17 +2,7 @@ import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import { CollectionItem, ListCollection } from '../collection';
 import * as select from '@zag-js/select';
-export interface UseSelectProps<T extends CollectionItem> extends Optional<Omit<select.Context<T>, 'dir' | 'getRootNode' | 'open.controlled' | 'collection'>, 'id'> {
-    /**
-     * The initial open state of the select when it is first rendered.
-     * Use when you do not need to control its open state.
-     */
-    defaultOpen?: select.Context['open'];
-    /**
-     * The initial value of the select when it is first rendered.
-     * Use when you do not need to control the state of the select.
-     */
-    defaultValue?: select.Context<T>['value'];
+export interface UseSelectProps<T extends CollectionItem> extends Optional<Omit<select.Props<T>, 'dir' | 'getRootNode' | 'collection'>, 'id'> {
     /**
      * The collection of items
      */
@@ -20,4 +10,4 @@ export interface UseSelectProps<T extends CollectionItem> extends Optional<Omit<
 }
 export interface UseSelectReturn<T extends CollectionItem> extends select.Api<PropTypes, T> {
 }
-export declare const useSelect: <T extends unknown>(props: UseSelectProps<T>) => UseSelectReturn<T>;
+export declare const useSelect: <T extends CollectionItem>(props: UseSelectProps<T>) => UseSelectReturn<T>;

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

@@ -1,19 +1,18 @@
 'use client';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import * as select from '@zag-js/select';
-import { useId, useEffect } from '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';
 import { useFieldContext } from '../field/use-field-context.js';
 
 const useSelect = (props) => {
-  const { collection, ...selectProps } = props;
-  const locale = useLocaleContext();
-  const environment = useEnvironmentContext();
+  const id = useId();
+  const { dir } = useLocaleContext();
+  const { getRootNode } = useEnvironmentContext();
   const field = useFieldContext();
-  const initialContext = {
-    id: useId(),
+  const machineProps = {
+    id,
     ids: {
       label: field?.ids.label,
       hiddenSelect: field?.ids.control
@@ -22,31 +21,12 @@ const useSelect = (props) => {
     readOnly: field?.readOnly,
     invalid: field?.invalid,
     required: field?.required,
-    dir: locale.dir,
-    getRootNode: environment.getRootNode,
-    collection,
-    open: props.defaultOpen,
-    value: props.defaultValue,
-    "open.controlled": props.open !== void 0,
-    ...selectProps
+    dir,
+    getRootNode,
+    ...props
   };
-  const context = (() => {
-    const { collection: _, ...restProps } = initialContext;
-    return {
-      ...restProps,
-      value: props.value,
-      onValueChange: useEvent(props.onValueChange, { sync: true }),
-      onHighlightChange: useEvent(props.onHighlightChange),
-      onOpenChange: useEvent(props.onOpenChange)
-    };
-  })();
-  const [state, send, service] = useMachine(select.machine(initialContext), {
-    context
-  });
-  useEffect(() => {
-    service.setContext({ collection });
-  }, [collection]);
-  return select.connect(state, send, normalizeProps);
+  const service = useMachine(select.machine, machineProps);
+  return select.connect(service, normalizeProps);
 };
 
 export { useSelect };

package/dist/components/signature-pad/index.d.cts

@@ -2,13 +2,13 @@ export type { DrawDetails as SignaturePadDrawDetails, DrawEndDetails as Signatur
 export { SignaturePadClearTrigger, type SignaturePadClearTriggerBaseProps, type SignaturePadClearTriggerProps, } from './signature-pad-clear-trigger';
 export { SignaturePadContext, type SignaturePadContextProps } from './signature-pad-context';
 export { SignaturePadControl, type SignaturePadControlBaseProps, type SignaturePadControlProps, } from './signature-pad-control';
-export { SignaturePadGuide, type SignaturePadGuideBaseProps, type SignaturePadGuideProps, } from './signature-pad-guide';
+export { SignaturePadGuide, type SignaturePadGuideBaseProps, type SignaturePadGuideProps } from './signature-pad-guide';
 export { SignaturePadHiddenInput, type SignaturePadHiddenInputBaseProps, type SignaturePadHiddenInputProps, } from './signature-pad-hidden-input';
-export { SignaturePadLabel, type SignaturePadLabelBaseProps, type SignaturePadLabelProps, } from './signature-pad-label';
-export { SignaturePadRoot, type SignaturePadRootBaseProps, type SignaturePadRootProps, } from './signature-pad-root';
+export { SignaturePadLabel, type SignaturePadLabelBaseProps, type SignaturePadLabelProps } from './signature-pad-label';
+export { SignaturePadRoot, type SignaturePadRootBaseProps, type SignaturePadRootProps } from './signature-pad-root';
 export { SignaturePadRootProvider, type SignaturePadRootProviderBaseProps, type SignaturePadRootProviderProps, } from './signature-pad-root-provider';
 export { SignaturePadSegment, type SignaturePadSegmentBaseProps, type SignaturePadSegmentProps, } from './signature-pad-segment';
 export { signaturePadAnatomy } from './signature-pad.anatomy';
-export { useSignaturePad, type UseSignaturePadProps, type UseSignaturePadReturn, } from './use-signature-pad';
+export { useSignaturePad, type UseSignaturePadProps, type UseSignaturePadReturn } from './use-signature-pad';
 export { useSignaturePadContext, type UseSignaturePadContext } from './use-signature-pad-context';
 export * as SignaturePad from './signature-pad';

package/dist/components/signature-pad/index.d.ts

@@ -2,13 +2,13 @@ export type { DrawDetails as SignaturePadDrawDetails, DrawEndDetails as Signatur
 export { SignaturePadClearTrigger, type SignaturePadClearTriggerBaseProps, type SignaturePadClearTriggerProps, } from './signature-pad-clear-trigger';
 export { SignaturePadContext, type SignaturePadContextProps } from './signature-pad-context';
 export { SignaturePadControl, type SignaturePadControlBaseProps, type SignaturePadControlProps, } from './signature-pad-control';
-export { SignaturePadGuide, type SignaturePadGuideBaseProps, type SignaturePadGuideProps, } from './signature-pad-guide';
+export { SignaturePadGuide, type SignaturePadGuideBaseProps, type SignaturePadGuideProps } from './signature-pad-guide';
 export { SignaturePadHiddenInput, type SignaturePadHiddenInputBaseProps, type SignaturePadHiddenInputProps, } from './signature-pad-hidden-input';
-export { SignaturePadLabel, type SignaturePadLabelBaseProps, type SignaturePadLabelProps, } from './signature-pad-label';
-export { SignaturePadRoot, type SignaturePadRootBaseProps, type SignaturePadRootProps, } from './signature-pad-root';
+export { SignaturePadLabel, type SignaturePadLabelBaseProps, type SignaturePadLabelProps } from './signature-pad-label';
+export { SignaturePadRoot, type SignaturePadRootBaseProps, type SignaturePadRootProps } from './signature-pad-root';
 export { SignaturePadRootProvider, type SignaturePadRootProviderBaseProps, type SignaturePadRootProviderProps, } from './signature-pad-root-provider';
 export { SignaturePadSegment, type SignaturePadSegmentBaseProps, type SignaturePadSegmentProps, } from './signature-pad-segment';
 export { signaturePadAnatomy } from './signature-pad.anatomy';
-export { useSignaturePad, type UseSignaturePadProps, type UseSignaturePadReturn, } from './use-signature-pad';
+export { useSignaturePad, type UseSignaturePadProps, type UseSignaturePadReturn } from './use-signature-pad';
 export { useSignaturePadContext, type UseSignaturePadContext } from './use-signature-pad-context';
 export * as SignaturePad from './signature-pad';

package/dist/components/signature-pad/signature-pad-control.cjs

@@ -9,13 +9,11 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useSignaturePadContext = require('./use-signature-pad-context.cjs');
 
-const SignaturePadControl = react.forwardRef(
-  (props, ref) => {
-    const signaturePad = useSignaturePadContext.useSignaturePadContext();
-    const mergedProps = react$1.mergeProps(signaturePad.getControlProps(), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const SignaturePadControl = react.forwardRef((props, ref) => {
+  const signaturePad = useSignaturePadContext.useSignaturePadContext();
+  const mergedProps = react$1.mergeProps(signaturePad.getControlProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 SignaturePadControl.displayName = "SignaturePadControl";
 
 exports.SignaturePadControl = SignaturePadControl;

package/dist/components/signature-pad/signature-pad-control.js

@@ -5,13 +5,11 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useSignaturePadContext } from './use-signature-pad-context.js';
 
-const SignaturePadControl = forwardRef(
-  (props, ref) => {
-    const signaturePad = useSignaturePadContext();
-    const mergedProps = mergeProps(signaturePad.getControlProps(), props);
-    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-  }
-);
+const SignaturePadControl = forwardRef((props, ref) => {
+  const signaturePad = useSignaturePadContext();
+  const mergedProps = mergeProps(signaturePad.getControlProps(), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
 SignaturePadControl.displayName = "SignaturePadControl";
 
 export { SignaturePadControl };

package/dist/components/signature-pad/signature-pad-guide.cjs

@@ -9,13 +9,11 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useSignaturePadContext = require('./use-signature-pad-context.cjs');
 
-const SignaturePadGuide = react.forwardRef(
-  (props, ref) => {
-    const signaturePad = useSignaturePadContext.useSignaturePadContext();
-    const mergedProps = react$1.mergeProps(signaturePad.getGuideProps(), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const SignaturePadGuide = react.forwardRef((props, ref) => {
+  const signaturePad = useSignaturePadContext.useSignaturePadContext();
+  const mergedProps = react$1.mergeProps(signaturePad.getGuideProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 SignaturePadGuide.displayName = "SignaturePadGuide";
 
 exports.SignaturePadGuide = SignaturePadGuide;

package/dist/components/signature-pad/signature-pad-guide.js

@@ -5,13 +5,11 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useSignaturePadContext } from './use-signature-pad-context.js';
 
-const SignaturePadGuide = forwardRef(
-  (props, ref) => {
-    const signaturePad = useSignaturePadContext();
-    const mergedProps = mergeProps(signaturePad.getGuideProps(), props);
-    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-  }
-);
+const SignaturePadGuide = forwardRef((props, ref) => {
+  const signaturePad = useSignaturePadContext();
+  const mergedProps = mergeProps(signaturePad.getGuideProps(), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
 SignaturePadGuide.displayName = "SignaturePadGuide";
 
 export { SignaturePadGuide };

package/dist/components/signature-pad/signature-pad-hidden-input.cjs

@@ -11,15 +11,13 @@ const factory = require('../factory.cjs');
 const useFieldContext = require('../field/use-field-context.cjs');
 const useSignaturePadContext = require('./use-signature-pad-context.cjs');
 
-const SignaturePadHiddenInput = react.forwardRef(
-  (props, ref) => {
-    const [hiddenInputProps, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
-    const signaturePad = useSignaturePadContext.useSignaturePadContext();
-    const mergedProps = react$1.mergeProps(signaturePad.getHiddenInputProps(hiddenInputProps), localProps);
-    const field = useFieldContext.useFieldContext();
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
-  }
-);
+const SignaturePadHiddenInput = react.forwardRef((props, ref) => {
+  const [hiddenInputProps, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const signaturePad = useSignaturePadContext.useSignaturePadContext();
+  const mergedProps = react$1.mergeProps(signaturePad.getHiddenInputProps(hiddenInputProps), localProps);
+  const field = useFieldContext.useFieldContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
+});
 SignaturePadHiddenInput.displayName = "SignaturePadHiddenInput";
 
 exports.SignaturePadHiddenInput = SignaturePadHiddenInput;

package/dist/components/signature-pad/signature-pad-hidden-input.js

@@ -7,15 +7,13 @@ import { ark } from '../factory.js';
 import { useFieldContext } from '../field/use-field-context.js';
 import { useSignaturePadContext } from './use-signature-pad-context.js';
 
-const SignaturePadHiddenInput = forwardRef(
-  (props, ref) => {
-    const [hiddenInputProps, localProps] = createSplitProps()(props, ["value"]);
-    const signaturePad = useSignaturePadContext();
-    const mergedProps = mergeProps(signaturePad.getHiddenInputProps(hiddenInputProps), localProps);
-    const field = useFieldContext();
-    return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
-  }
-);
+const SignaturePadHiddenInput = forwardRef((props, ref) => {
+  const [hiddenInputProps, localProps] = createSplitProps()(props, ["value"]);
+  const signaturePad = useSignaturePadContext();
+  const mergedProps = mergeProps(signaturePad.getHiddenInputProps(hiddenInputProps), localProps);
+  const field = useFieldContext();
+  return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
+});
 SignaturePadHiddenInput.displayName = "SignaturePadHiddenInput";
 
 export { SignaturePadHiddenInput };