@ark-ui/react 4.9.2 → 5.0.0

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

@@ -5,7 +5,7 @@ export { TabList, type TabListBaseProps, type TabListProps } from './tab-list';
 export { TabTrigger, type TabTriggerBaseProps, type TabTriggerProps } from './tab-trigger';
 export { TabsContext, type TabsContextProps } from './tabs-context';
 export { TabsRoot, type TabsRootBaseProps, type TabsRootProps } from './tabs-root';
-export { TabsRootProvider, type TabsRootProviderBaseProps, type TabsRootProviderProps, } from './tabs-root-provider';
+export { TabsRootProvider, type TabsRootProviderBaseProps, type TabsRootProviderProps } from './tabs-root-provider';
 export { tabsAnatomy } from './tabs.anatomy';
 export { useTabs, type UseTabsProps, type UseTabsReturn } from './use-tabs';
 export { useTabsContext, type UseTabsContext } from './use-tabs-context';

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

@@ -5,7 +5,7 @@ export { TabList, type TabListBaseProps, type TabListProps } from './tab-list';
 export { TabTrigger, type TabTriggerBaseProps, type TabTriggerProps } from './tab-trigger';
 export { TabsContext, type TabsContextProps } from './tabs-context';
 export { TabsRoot, type TabsRootBaseProps, type TabsRootProps } from './tabs-root';
-export { TabsRootProvider, type TabsRootProviderBaseProps, type TabsRootProviderProps, } from './tabs-root-provider';
+export { TabsRootProvider, type TabsRootProviderBaseProps, type TabsRootProviderProps } from './tabs-root-provider';
 export { tabsAnatomy } from './tabs.anatomy';
 export { useTabs, type UseTabsProps, type UseTabsReturn } from './use-tabs';
 export { useTabsContext, type UseTabsContext } from './use-tabs-context';

package/dist/components/tabs/tab-content.cjs

@@ -24,11 +24,7 @@ const TabContent = react.forwardRef((props, ref) => {
     present: useDebounce.useDebounce(tabs.value === props.value, 0),
     immediate: true
   });
-  const mergedProps = react$1.mergeProps(
-    tabs.getContentProps(contentProps),
-    presence.getPresenceProps(),
-    localProps
-  );
+  const mergedProps = react$1.mergeProps(tabs.getContentProps(contentProps), presence.getPresenceProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(usePresenceContext.PresenceProvider, { value: presence, children: presence.unmounted ? null : /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref: composeRefs.composeRefs(presence.ref, ref) }) });
 });
 TabContent.displayName = "TabContent";

package/dist/components/tabs/tab-content.js

@@ -20,11 +20,7 @@ const TabContent = forwardRef((props, ref) => {
     present: useDebounce(tabs.value === props.value, 0),
     immediate: true
   });
-  const mergedProps = mergeProps(
-    tabs.getContentProps(contentProps),
-    presence.getPresenceProps(),
-    localProps
-  );
+  const mergedProps = mergeProps(tabs.getContentProps(contentProps), presence.getPresenceProps(), localProps);
   return /* @__PURE__ */ jsx(PresenceProvider, { value: presence, children: presence.unmounted ? null : /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref: composeRefs(presence.ref, ref) }) });
 });
 TabContent.displayName = "TabContent";

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

@@ -1,8 +1,8 @@
 export type { FocusChangeDetails, ValueChangeDetails } from '@zag-js/tabs';
 export { TabContent as Content, type TabContentBaseProps as ContentBaseProps, type TabContentProps as ContentProps, } from './tab-content';
 export { TabIndicator as Indicator, type TabIndicatorBaseProps as IndicatorBaseProps, type TabIndicatorProps as IndicatorProps, } from './tab-indicator';
-export { TabList as List, type TabListBaseProps as ListBaseProps, type TabListProps as ListProps, } from './tab-list';
+export { TabList as List, type TabListBaseProps as ListBaseProps, type TabListProps as ListProps } from './tab-list';
 export { TabTrigger as Trigger, type TabTriggerBaseProps as TriggerBaseProps, type TabTriggerProps as TriggerProps, } from './tab-trigger';
 export { TabsContext as Context, type TabsContextProps as ContextProps } from './tabs-context';
-export { TabsRoot as Root, type TabsRootBaseProps as RootBaseProps, type TabsRootProps as RootProps, } from './tabs-root';
+export { TabsRoot as Root, type TabsRootBaseProps as RootBaseProps, type TabsRootProps as RootProps } from './tabs-root';
 export { TabsRootProvider as RootProvider, type TabsRootProviderBaseProps as RootProviderBaseProps, type TabsRootProviderProps as RootProviderProps, } from './tabs-root-provider';

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

@@ -1,8 +1,8 @@
 export type { FocusChangeDetails, ValueChangeDetails } from '@zag-js/tabs';
 export { TabContent as Content, type TabContentBaseProps as ContentBaseProps, type TabContentProps as ContentProps, } from './tab-content';
 export { TabIndicator as Indicator, type TabIndicatorBaseProps as IndicatorBaseProps, type TabIndicatorProps as IndicatorProps, } from './tab-indicator';
-export { TabList as List, type TabListBaseProps as ListBaseProps, type TabListProps as ListProps, } from './tab-list';
+export { TabList as List, type TabListBaseProps as ListBaseProps, type TabListProps as ListProps } from './tab-list';
 export { TabTrigger as Trigger, type TabTriggerBaseProps as TriggerBaseProps, type TabTriggerProps as TriggerProps, } from './tab-trigger';
 export { TabsContext as Context, type TabsContextProps as ContextProps } from './tabs-context';
-export { TabsRoot as Root, type TabsRootBaseProps as RootBaseProps, type TabsRootProps as RootProps, } from './tabs-root';
+export { TabsRoot as Root, type TabsRootBaseProps as RootBaseProps, type TabsRootProps as RootProps } from './tabs-root';
 export { TabsRootProvider as RootProvider, type TabsRootProviderBaseProps as RootProviderBaseProps, type TabsRootProviderProps as RootProviderProps, } from './tabs-root-provider';

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

@@ -8,7 +8,6 @@ const tabs = require('@zag-js/tabs');
 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' } });
@@ -30,23 +29,17 @@ function _interopNamespaceDefault(e) {
 const tabs__namespace = /*#__PURE__*/_interopNamespaceDefault(tabs);
 
 const useTabs = (props = {}) => {
+  const id = react.useId();
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
-  const initialContext = {
-    id: react.useId(),
+  const machineProps = {
+    id,
     dir,
     getRootNode,
-    value: props.defaultValue,
     ...props
   };
-  const context = {
-    ...initialContext,
-    value: props.value,
-    onValueChange: useEvent.useEvent(props.onValueChange, { sync: true }),
-    onFocusChange: useEvent.useEvent(props.onFocusChange)
-  };
-  const [state, send] = react$1.useMachine(tabs__namespace.machine(initialContext), { context });
-  return tabs__namespace.connect(state, send, react$1.normalizeProps);
+  const service = react$1.useMachine(tabs__namespace.machine, machineProps);
+  return tabs__namespace.connect(service, react$1.normalizeProps);
 };
 
 exports.useTabs = useTabs;

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

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

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

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

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

@@ -4,26 +4,19 @@ import * as tabs from '@zag-js/tabs';
 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 useTabs = (props = {}) => {
+  const id = useId();
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
-  const initialContext = {
-    id: useId(),
+  const machineProps = {
+    id,
     dir,
     getRootNode,
-    value: props.defaultValue,
     ...props
   };
-  const context = {
-    ...initialContext,
-    value: props.value,
-    onValueChange: useEvent(props.onValueChange, { sync: true }),
-    onFocusChange: useEvent(props.onFocusChange)
-  };
-  const [state, send] = useMachine(tabs.machine(initialContext), { context });
-  return tabs.connect(state, send, normalizeProps);
+  const service = useMachine(tabs.machine, machineProps);
+  return tabs.connect(service, normalizeProps);
 };
 
 export { useTabs };

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

@@ -1,20 +1,20 @@
 export type { HighlightChangeDetails as TagsInputHighlightChangeDetails, ValidityChangeDetails as TagsInputValidityChangeDetails, ValueChangeDetails as TagsInputValueChangeDetails, } from '@zag-js/tags-input';
 export { TagsInputClearTrigger, type TagsInputClearTriggerBaseProps, type TagsInputClearTriggerProps, } from './tags-input-clear-trigger';
 export { TagsInputContext, type TagsInputContextProps } from './tags-input-context';
-export { TagsInputControl, type TagsInputControlBaseProps, type TagsInputControlProps, } from './tags-input-control';
+export { TagsInputControl, type TagsInputControlBaseProps, type TagsInputControlProps } from './tags-input-control';
 export { TagsInputHiddenInput, type TagsInputHiddenInputBaseProps, type TagsInputHiddenInputProps, } from './tags-input-hidden-input';
-export { TagsInputInput, type TagsInputInputBaseProps, type TagsInputInputProps, } from './tags-input-input';
-export { TagsInputItem, type TagsInputItemBaseProps, type TagsInputItemProps, } from './tags-input-item';
+export { TagsInputInput, type TagsInputInputBaseProps, type TagsInputInputProps } from './tags-input-input';
+export { TagsInputItem, type TagsInputItemBaseProps, type TagsInputItemProps } from './tags-input-item';
 export { TagsInputItemContext, type TagsInputItemContextProps } from './tags-input-item-context';
 export { TagsInputItemDeleteTrigger, type TagsInputItemDeleteTriggerBaseProps, type TagsInputItemDeleteTriggerProps, } from './tags-input-item-delete-trigger';
 export { TagsInputItemInput, type TagsInputItemInputBaseProps, type TagsInputItemInputProps, } from './tags-input-item-input';
 export { TagsInputItemPreview, type TagsInputItemPreviewBaseProps, type TagsInputItemPreviewProps, } from './tags-input-item-preview';
-export { TagsInputItemText, type TagsInputItemTextBaseProps, type TagsInputItemTextProps, } from './tags-input-item-text';
-export { TagsInputLabel, type TagsInputLabelBaseProps, type TagsInputLabelProps, } from './tags-input-label';
-export { TagsInputRoot, type TagsInputRootBaseProps, type TagsInputRootProps, } from './tags-input-root';
+export { TagsInputItemText, type TagsInputItemTextBaseProps, type TagsInputItemTextProps } from './tags-input-item-text';
+export { TagsInputLabel, type TagsInputLabelBaseProps, type TagsInputLabelProps } from './tags-input-label';
+export { TagsInputRoot, type TagsInputRootBaseProps, type TagsInputRootProps } from './tags-input-root';
 export { TagsInputRootProvider, type TagsInputRootProviderBaseProps, type TagsInputRootProviderProps, } from './tags-input-root-provider';
 export { tagsInputAnatomy } from './tags-input.anatomy';
 export { useTagsInput, type UseTagsInputProps, type UseTagsInputReturn } from './use-tags-input';
 export { useTagsInputContext, type UseTagsInputContext } from './use-tags-input-context';
-export { useTagsInputItemContext, type UseTagsInputItemContext, } from './use-tags-input-item-context';
+export { useTagsInputItemContext, type UseTagsInputItemContext } from './use-tags-input-item-context';
 export * as TagsInput from './tags-input';

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

@@ -1,20 +1,20 @@
 export type { HighlightChangeDetails as TagsInputHighlightChangeDetails, ValidityChangeDetails as TagsInputValidityChangeDetails, ValueChangeDetails as TagsInputValueChangeDetails, } from '@zag-js/tags-input';
 export { TagsInputClearTrigger, type TagsInputClearTriggerBaseProps, type TagsInputClearTriggerProps, } from './tags-input-clear-trigger';
 export { TagsInputContext, type TagsInputContextProps } from './tags-input-context';
-export { TagsInputControl, type TagsInputControlBaseProps, type TagsInputControlProps, } from './tags-input-control';
+export { TagsInputControl, type TagsInputControlBaseProps, type TagsInputControlProps } from './tags-input-control';
 export { TagsInputHiddenInput, type TagsInputHiddenInputBaseProps, type TagsInputHiddenInputProps, } from './tags-input-hidden-input';
-export { TagsInputInput, type TagsInputInputBaseProps, type TagsInputInputProps, } from './tags-input-input';
-export { TagsInputItem, type TagsInputItemBaseProps, type TagsInputItemProps, } from './tags-input-item';
+export { TagsInputInput, type TagsInputInputBaseProps, type TagsInputInputProps } from './tags-input-input';
+export { TagsInputItem, type TagsInputItemBaseProps, type TagsInputItemProps } from './tags-input-item';
 export { TagsInputItemContext, type TagsInputItemContextProps } from './tags-input-item-context';
 export { TagsInputItemDeleteTrigger, type TagsInputItemDeleteTriggerBaseProps, type TagsInputItemDeleteTriggerProps, } from './tags-input-item-delete-trigger';
 export { TagsInputItemInput, type TagsInputItemInputBaseProps, type TagsInputItemInputProps, } from './tags-input-item-input';
 export { TagsInputItemPreview, type TagsInputItemPreviewBaseProps, type TagsInputItemPreviewProps, } from './tags-input-item-preview';
-export { TagsInputItemText, type TagsInputItemTextBaseProps, type TagsInputItemTextProps, } from './tags-input-item-text';
-export { TagsInputLabel, type TagsInputLabelBaseProps, type TagsInputLabelProps, } from './tags-input-label';
-export { TagsInputRoot, type TagsInputRootBaseProps, type TagsInputRootProps, } from './tags-input-root';
+export { TagsInputItemText, type TagsInputItemTextBaseProps, type TagsInputItemTextProps } from './tags-input-item-text';
+export { TagsInputLabel, type TagsInputLabelBaseProps, type TagsInputLabelProps } from './tags-input-label';
+export { TagsInputRoot, type TagsInputRootBaseProps, type TagsInputRootProps } from './tags-input-root';
 export { TagsInputRootProvider, type TagsInputRootProviderBaseProps, type TagsInputRootProviderProps, } from './tags-input-root-provider';
 export { tagsInputAnatomy } from './tags-input.anatomy';
 export { useTagsInput, type UseTagsInputProps, type UseTagsInputReturn } from './use-tags-input';
 export { useTagsInputContext, type UseTagsInputContext } from './use-tags-input-context';
-export { useTagsInputItemContext, type UseTagsInputItemContext, } from './use-tags-input-item-context';
+export { useTagsInputItemContext, type UseTagsInputItemContext } from './use-tags-input-item-context';
 export * as TagsInput from './tags-input';

package/dist/components/tags-input/tags-input-clear-trigger.cjs

@@ -9,13 +9,11 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useTagsInputContext = require('./use-tags-input-context.cjs');
 
-const TagsInputClearTrigger = react.forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext.useTagsInputContext();
-    const mergedProps = react$1.mergeProps(tagsInput.getClearTriggerProps(), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
-  }
-);
+const TagsInputClearTrigger = react.forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext.useTagsInputContext();
+  const mergedProps = react$1.mergeProps(tagsInput.getClearTriggerProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+});
 TagsInputClearTrigger.displayName = "TagsInputClearTrigger";
 
 exports.TagsInputClearTrigger = TagsInputClearTrigger;

package/dist/components/tags-input/tags-input-clear-trigger.js

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

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

@@ -10,14 +10,12 @@ const factory = require('../factory.cjs');
 const useFieldContext = require('../field/use-field-context.cjs');
 const useTagsInputContext = require('./use-tags-input-context.cjs');
 
-const TagsInputHiddenInput = react.forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext.useTagsInputContext();
-    const mergedProps = react$1.mergeProps(tagsInput.getHiddenInputProps(), props);
-    const field = useFieldContext.useFieldContext();
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
-  }
-);
+const TagsInputHiddenInput = react.forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext.useTagsInputContext();
+  const mergedProps = react$1.mergeProps(tagsInput.getHiddenInputProps(), props);
+  const field = useFieldContext.useFieldContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
+});
 TagsInputHiddenInput.displayName = "TagsInputHiddenInput";
 
 exports.TagsInputHiddenInput = TagsInputHiddenInput;

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

@@ -6,14 +6,12 @@ import { ark } from '../factory.js';
 import { useFieldContext } from '../field/use-field-context.js';
 import { useTagsInputContext } from './use-tags-input-context.js';
 
-const TagsInputHiddenInput = forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext();
-    const mergedProps = mergeProps(tagsInput.getHiddenInputProps(), props);
-    const field = useFieldContext();
-    return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
-  }
-);
+const TagsInputHiddenInput = forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext();
+  const mergedProps = mergeProps(tagsInput.getHiddenInputProps(), props);
+  const field = useFieldContext();
+  return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
+});
 TagsInputHiddenInput.displayName = "TagsInputHiddenInput";
 
 export { TagsInputHiddenInput };

package/dist/components/tags-input/tags-input-item-delete-trigger.cjs

@@ -10,12 +10,14 @@ const factory = require('../factory.cjs');
 const useTagsInputContext = require('./use-tags-input-context.cjs');
 const useTagsInputItemPropsContext = require('./use-tags-input-item-props-context.cjs');
 
-const TagsInputItemDeleteTrigger = react.forwardRef((props, ref) => {
-  const tagsInput = useTagsInputContext.useTagsInputContext();
-  const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
-  const mergedProps = react$1.mergeProps(tagsInput.getItemDeleteTriggerProps(itemProps), props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
-});
+const TagsInputItemDeleteTrigger = react.forwardRef(
+  (props, ref) => {
+    const tagsInput = useTagsInputContext.useTagsInputContext();
+    const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
+    const mergedProps = react$1.mergeProps(tagsInput.getItemDeleteTriggerProps(itemProps), props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
 TagsInputItemDeleteTrigger.displayName = "TagsInputItemDeleteTrigger";
 
 exports.TagsInputItemDeleteTrigger = TagsInputItemDeleteTrigger;

package/dist/components/tags-input/tags-input-item-delete-trigger.js

@@ -6,12 +6,14 @@ import { ark } from '../factory.js';
 import { useTagsInputContext } from './use-tags-input-context.js';
 import { useTagsInputItemPropsContext } from './use-tags-input-item-props-context.js';
 
-const TagsInputItemDeleteTrigger = forwardRef((props, ref) => {
-  const tagsInput = useTagsInputContext();
-  const itemProps = useTagsInputItemPropsContext();
-  const mergedProps = mergeProps(tagsInput.getItemDeleteTriggerProps(itemProps), props);
-  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
-});
+const TagsInputItemDeleteTrigger = forwardRef(
+  (props, ref) => {
+    const tagsInput = useTagsInputContext();
+    const itemProps = useTagsInputItemPropsContext();
+    const mergedProps = mergeProps(tagsInput.getItemDeleteTriggerProps(itemProps), props);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
 TagsInputItemDeleteTrigger.displayName = "TagsInputItemDeleteTrigger";
 
 export { TagsInputItemDeleteTrigger };

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

@@ -10,14 +10,12 @@ const factory = require('../factory.cjs');
 const useTagsInputContext = require('./use-tags-input-context.cjs');
 const useTagsInputItemPropsContext = require('./use-tags-input-item-props-context.cjs');
 
-const TagsInputItemInput = react.forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext.useTagsInputContext();
-    const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
-    const mergedProps = react$1.mergeProps(tagsInput.getItemInputProps(itemProps), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
-  }
-);
+const TagsInputItemInput = react.forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext.useTagsInputContext();
+  const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
+  const mergedProps = react$1.mergeProps(tagsInput.getItemInputProps(itemProps), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
+});
 TagsInputItemInput.displayName = "TagsInputItemInput";
 
 exports.TagsInputItemInput = TagsInputItemInput;

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

@@ -6,14 +6,12 @@ import { ark } from '../factory.js';
 import { useTagsInputContext } from './use-tags-input-context.js';
 import { useTagsInputItemPropsContext } from './use-tags-input-item-props-context.js';
 
-const TagsInputItemInput = forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext();
-    const itemProps = useTagsInputItemPropsContext();
-    const mergedProps = mergeProps(tagsInput.getItemInputProps(itemProps), props);
-    return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
-  }
-);
+const TagsInputItemInput = forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext();
+  const itemProps = useTagsInputItemPropsContext();
+  const mergedProps = mergeProps(tagsInput.getItemInputProps(itemProps), props);
+  return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
+});
 TagsInputItemInput.displayName = "TagsInputItemInput";
 
 export { TagsInputItemInput };

package/dist/components/tags-input/tags-input-item-preview.cjs

@@ -10,14 +10,12 @@ const factory = require('../factory.cjs');
 const useTagsInputContext = require('./use-tags-input-context.cjs');
 const useTagsInputItemPropsContext = require('./use-tags-input-item-props-context.cjs');
 
-const TagsInputItemPreview = react.forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext.useTagsInputContext();
-    const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
-    const mergedProps = react$1.mergeProps(tagsInput.getItemPreviewProps(itemProps), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const TagsInputItemPreview = react.forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext.useTagsInputContext();
+  const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
+  const mergedProps = react$1.mergeProps(tagsInput.getItemPreviewProps(itemProps), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 TagsInputItemPreview.displayName = "TagsInputItemPreview";
 
 exports.TagsInputItemPreview = TagsInputItemPreview;

package/dist/components/tags-input/tags-input-item-preview.js

@@ -6,14 +6,12 @@ import { ark } from '../factory.js';
 import { useTagsInputContext } from './use-tags-input-context.js';
 import { useTagsInputItemPropsContext } from './use-tags-input-item-props-context.js';
 
-const TagsInputItemPreview = forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext();
-    const itemProps = useTagsInputItemPropsContext();
-    const mergedProps = mergeProps(tagsInput.getItemPreviewProps(itemProps), props);
-    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-  }
-);
+const TagsInputItemPreview = forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext();
+  const itemProps = useTagsInputItemPropsContext();
+  const mergedProps = mergeProps(tagsInput.getItemPreviewProps(itemProps), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
 TagsInputItemPreview.displayName = "TagsInputItemPreview";
 
 export { TagsInputItemPreview };

package/dist/components/tags-input/tags-input-item-text.cjs

@@ -10,14 +10,12 @@ const factory = require('../factory.cjs');
 const useTagsInputContext = require('./use-tags-input-context.cjs');
 const useTagsInputItemPropsContext = require('./use-tags-input-item-props-context.cjs');
 
-const TagsInputItemText = react.forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext.useTagsInputContext();
-    const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
-    const mergedProps = react$1.mergeProps(tagsInput.getItemTextProps(itemProps), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref });
-  }
-);
+const TagsInputItemText = react.forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext.useTagsInputContext();
+  const itemProps = useTagsInputItemPropsContext.useTagsInputItemPropsContext();
+  const mergedProps = react$1.mergeProps(tagsInput.getItemTextProps(itemProps), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref });
+});
 TagsInputItemText.displayName = "TagsInputItemText";
 
 exports.TagsInputItemText = TagsInputItemText;

package/dist/components/tags-input/tags-input-item-text.js

@@ -6,14 +6,12 @@ import { ark } from '../factory.js';
 import { useTagsInputContext } from './use-tags-input-context.js';
 import { useTagsInputItemPropsContext } from './use-tags-input-item-props-context.js';
 
-const TagsInputItemText = forwardRef(
-  (props, ref) => {
-    const tagsInput = useTagsInputContext();
-    const itemProps = useTagsInputItemPropsContext();
-    const mergedProps = mergeProps(tagsInput.getItemTextProps(itemProps), props);
-    return /* @__PURE__ */ jsx(ark.span, { ...mergedProps, ref });
-  }
-);
+const TagsInputItemText = forwardRef((props, ref) => {
+  const tagsInput = useTagsInputContext();
+  const itemProps = useTagsInputItemPropsContext();
+  const mergedProps = mergeProps(tagsInput.getItemTextProps(itemProps), props);
+  return /* @__PURE__ */ jsx(ark.span, { ...mergedProps, ref });
+});
 TagsInputItemText.displayName = "TagsInputItemText";
 
 export { TagsInputItemText };

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

@@ -13,11 +13,7 @@ const useTagsInputItemContext = require('./use-tags-input-item-context.cjs');
 const useTagsInputItemPropsContext = require('./use-tags-input-item-props-context.cjs');
 
 const TagsInputItem = react.forwardRef((props, ref) => {
-  const [itemProps, localProps] = createSplitProps.createSplitProps()(props, [
-    "index",
-    "disabled",
-    "value"
-  ]);
+  const [itemProps, localProps] = createSplitProps.createSplitProps()(props, ["index", "disabled", "value"]);
   const tagsInput = useTagsInputContext.useTagsInputContext();
   const mergedProps = react$1.mergeProps(tagsInput.getItemProps(itemProps), localProps);
   const tagsInputItem = tagsInput.getItemState(itemProps);

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

@@ -9,11 +9,7 @@ import { TagsInputItemProvider } from './use-tags-input-item-context.js';
 import { TagsInputItemPropsProvider } from './use-tags-input-item-props-context.js';
 
 const TagsInputItem = forwardRef((props, ref) => {
-  const [itemProps, localProps] = createSplitProps()(props, [
-    "index",
-    "disabled",
-    "value"
-  ]);
+  const [itemProps, localProps] = createSplitProps()(props, ["index", "disabled", "value"]);
   const tagsInput = useTagsInputContext();
   const mergedProps = mergeProps(tagsInput.getItemProps(itemProps), localProps);
   const tagsInputItem = tagsInput.getItemState(itemProps);

package/dist/components/tags-input/tags-input-root-provider.cjs

@@ -10,15 +10,11 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useTagsInputContext = require('./use-tags-input-context.cjs');
 
-const TagsInputRootProvider = react.forwardRef(
-  (props, ref) => {
-    const [{ value: tagsInput }, localProps] = createSplitProps.createSplitProps()(props, [
-      "value"
-    ]);
-    const mergedProps = react$1.mergeProps(tagsInput.getRootProps(), localProps);
-    return /* @__PURE__ */ jsxRuntime.jsx(useTagsInputContext.TagsInputProvider, { value: tagsInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
-  }
-);
+const TagsInputRootProvider = react.forwardRef((props, ref) => {
+  const [{ value: tagsInput }, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const mergedProps = react$1.mergeProps(tagsInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(useTagsInputContext.TagsInputProvider, { value: tagsInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+});
 TagsInputRootProvider.displayName = "TagsInputRootProvider";
 
 exports.TagsInputRootProvider = TagsInputRootProvider;

package/dist/components/tags-input/tags-input-root-provider.js

@@ -6,15 +6,11 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { TagsInputProvider } from './use-tags-input-context.js';
 
-const TagsInputRootProvider = forwardRef(
-  (props, ref) => {
-    const [{ value: tagsInput }, localProps] = createSplitProps()(props, [
-      "value"
-    ]);
-    const mergedProps = mergeProps(tagsInput.getRootProps(), localProps);
-    return /* @__PURE__ */ jsx(TagsInputProvider, { value: tagsInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
-  }
-);
+const TagsInputRootProvider = forwardRef((props, ref) => {
+  const [{ value: tagsInput }, localProps] = createSplitProps()(props, ["value"]);
+  const mergedProps = mergeProps(tagsInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsx(TagsInputProvider, { value: tagsInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+});
 TagsInputRootProvider.displayName = "TagsInputRootProvider";
 
 export { TagsInputRootProvider };

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

@@ -17,6 +17,7 @@ const TagsInputRoot = react.forwardRef((props, ref) => {
     "allowOverflow",
     "autoFocus",
     "blurBehavior",
+    "defaultInputValue",
     "defaultValue",
     "delimiter",
     "disabled",

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

@@ -13,6 +13,7 @@ const TagsInputRoot = forwardRef((props, ref) => {
     "allowOverflow",
     "autoFocus",
     "blurBehavior",
+    "defaultInputValue",
     "defaultValue",
     "delimiter",
     "disabled",

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

@@ -1,6 +1,6 @@
-export type { HighlightChangeDetails, ValidityChangeDetails, ValueChangeDetails, } from '@zag-js/tags-input';
+export type { HighlightChangeDetails, ValidityChangeDetails, ValueChangeDetails } from '@zag-js/tags-input';
 export { TagsInputClearTrigger as ClearTrigger, type TagsInputClearTriggerBaseProps as ClearTriggerBaseProps, type TagsInputClearTriggerProps as ClearTriggerProps, } from './tags-input-clear-trigger';
-export { TagsInputContext as Context, type TagsInputContextProps as ContextProps, } from './tags-input-context';
+export { TagsInputContext as Context, type TagsInputContextProps as ContextProps } from './tags-input-context';
 export { TagsInputControl as Control, type TagsInputControlBaseProps as ControlBaseProps, type TagsInputControlProps as ControlProps, } from './tags-input-control';
 export { TagsInputHiddenInput as HiddenInput, type TagsInputHiddenInputBaseProps as HiddenInputBaseProps, type TagsInputHiddenInputProps as HiddenInputProps, } from './tags-input-hidden-input';
 export { TagsInputInput as Input, type TagsInputInputBaseProps as InputBaseProps, type TagsInputInputProps as InputProps, } from './tags-input-input';