@ark-ui/react 3.8.0 → 3.10.0

package/dist/components/checkbox/checkbox-group.cjs

@@ -17,6 +17,7 @@ const CheckboxGroup = react.forwardRef((props, ref) => {
     "value",
     "onValueChange",
     "disabled",
+    "invalid",
     "readOnly",
     "name"
   ]);

package/dist/components/checkbox/checkbox-group.js

@@ -13,6 +13,7 @@ const CheckboxGroup = forwardRef((props, ref) => {
     "value",
     "onValueChange",
     "disabled",
+    "invalid",
     "readOnly",
     "name"
   ]);

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

@@ -7,7 +7,15 @@ const useControllableState = require('../../utils/use-controllable-state.cjs');
 const useEvent = require('../../utils/use-event.cjs');
 
 function useCheckboxGroup(props = {}) {
-  const { defaultValue, value: controlledValue, onValueChange, disabled, readOnly, name } = props;
+  const {
+    defaultValue,
+    value: controlledValue,
+    onValueChange,
+    disabled,
+    readOnly,
+    name,
+    invalid
+  } = props;
   const interative = !(disabled || readOnly);
   const onChangeProp = useEvent.useEvent(onValueChange, { sync: true });
   const [value, setValue] = useControllableState.useControllableState({
@@ -40,15 +48,17 @@ function useCheckboxGroup(props = {}) {
       },
       name,
       disabled,
-      readOnly
+      readOnly,
+      invalid
     };
   };
   return {
     isChecked,
     value,
     name,
-    disabled,
-    readOnly,
+    disabled: !!disabled,
+    readOnly: !!readOnly,
+    invalid: !!invalid,
     setValue,
     addValue,
     toggleValue,

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

@@ -24,6 +24,10 @@ export interface UseCheckboxGroupProps {
      * If `true`, the checkbox group is read-only
      */
     readOnly?: boolean;
+    /**
+     * If `true`, the checkbox group is invalid
+     */
+    invalid?: boolean;
 }
 export interface CheckboxGroupItemProps {
     value: string | undefined;
@@ -32,8 +36,9 @@ export declare function useCheckboxGroup(props?: UseCheckboxGroupProps): {
     isChecked: (val: string | undefined) => boolean;
     value: string[];
     name: string | undefined;
-    disabled: boolean | undefined;
-    readOnly: boolean | undefined;
+    disabled: boolean;
+    readOnly: boolean;
+    invalid: boolean;
     setValue: (value: string[]) => void | undefined;
     addValue: (val: string) => void;
     toggleValue: (val: string) => void;
@@ -43,6 +48,7 @@ export declare function useCheckboxGroup(props?: UseCheckboxGroupProps): {
         name: string | undefined;
         disabled: boolean | undefined;
         readOnly: boolean | undefined;
+        invalid: boolean | undefined;
     };
 };
 export type UseCheckboxGroupReturn = ReturnType<typeof useCheckboxGroup>;

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

@@ -24,6 +24,10 @@ export interface UseCheckboxGroupProps {
      * If `true`, the checkbox group is read-only
      */
     readOnly?: boolean;
+    /**
+     * If `true`, the checkbox group is invalid
+     */
+    invalid?: boolean;
 }
 export interface CheckboxGroupItemProps {
     value: string | undefined;
@@ -32,8 +36,9 @@ export declare function useCheckboxGroup(props?: UseCheckboxGroupProps): {
     isChecked: (val: string | undefined) => boolean;
     value: string[];
     name: string | undefined;
-    disabled: boolean | undefined;
-    readOnly: boolean | undefined;
+    disabled: boolean;
+    readOnly: boolean;
+    invalid: boolean;
     setValue: (value: string[]) => void | undefined;
     addValue: (val: string) => void;
     toggleValue: (val: string) => void;
@@ -43,6 +48,7 @@ export declare function useCheckboxGroup(props?: UseCheckboxGroupProps): {
         name: string | undefined;
         disabled: boolean | undefined;
         readOnly: boolean | undefined;
+        invalid: boolean | undefined;
     };
 };
 export type UseCheckboxGroupReturn = ReturnType<typeof useCheckboxGroup>;

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

@@ -3,7 +3,15 @@ import { useControllableState } from '../../utils/use-controllable-state.js';
 import { useEvent } from '../../utils/use-event.js';
 
 function useCheckboxGroup(props = {}) {
-  const { defaultValue, value: controlledValue, onValueChange, disabled, readOnly, name } = props;
+  const {
+    defaultValue,
+    value: controlledValue,
+    onValueChange,
+    disabled,
+    readOnly,
+    name,
+    invalid
+  } = props;
   const interative = !(disabled || readOnly);
   const onChangeProp = useEvent(onValueChange, { sync: true });
   const [value, setValue] = useControllableState({
@@ -36,15 +44,17 @@ function useCheckboxGroup(props = {}) {
       },
       name,
       disabled,
-      readOnly
+      readOnly,
+      invalid
     };
   };
   return {
     isChecked,
     value,
     name,
-    disabled,
-    readOnly,
+    disabled: !!disabled,
+    readOnly: !!readOnly,
+    invalid: !!invalid,
     setValue,
     addValue,
     toggleValue,

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

@@ -15,8 +15,10 @@ const EditableRoot = react.forwardRef((props, ref) => {
   const [useEditableProps, localProps] = createSplitProps.createSplitProps()(props, [
     "activationMode",
     "autoResize",
+    "defaultEdit",
     "defaultValue",
     "disabled",
+    "edit",
     "finalFocusEl",
     "form",
     "id",
@@ -24,7 +26,7 @@ const EditableRoot = react.forwardRef((props, ref) => {
     "invalid",
     "maxLength",
     "name",
-    "onEdit",
+    "onEditChange",
     "onFocusOutside",
     "onInteractOutside",
     "onPointerDownOutside",
@@ -35,7 +37,6 @@ const EditableRoot = react.forwardRef((props, ref) => {
     "readOnly",
     "required",
     "selectOnFocus",
-    "startWithEditView",
     "submitMode",
     "translations",
     "value"

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

@@ -11,8 +11,10 @@ const EditableRoot = forwardRef((props, ref) => {
   const [useEditableProps, localProps] = createSplitProps()(props, [
     "activationMode",
     "autoResize",
+    "defaultEdit",
     "defaultValue",
     "disabled",
+    "edit",
     "finalFocusEl",
     "form",
     "id",
@@ -20,7 +22,7 @@ const EditableRoot = forwardRef((props, ref) => {
     "invalid",
     "maxLength",
     "name",
-    "onEdit",
+    "onEditChange",
     "onFocusOutside",
     "onInteractOutside",
     "onPointerDownOutside",
@@ -31,7 +33,6 @@ const EditableRoot = forwardRef((props, ref) => {
     "readOnly",
     "required",
     "selectOnFocus",
-    "startWithEditView",
     "submitMode",
     "translations",
     "value"

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

@@ -1,4 +1,7 @@
 export type { ValueChangeDetails as EditableValueChangeDetails } from '@zag-js/editable';
+export interface EditableEditChangeDetails {
+    edit: boolean;
+}
 export { EditableArea, type EditableAreaProps, type EditableAreaBaseProps, } from './editable-area';
 export { EditableCancelTrigger, type EditableCancelTriggerProps, type EditableCancelTriggerBaseProps, } from './editable-cancel-trigger';
 export { EditableContext, type EditableContextProps, } from './editable-context';

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

@@ -1,4 +1,7 @@
 export type { ValueChangeDetails as EditableValueChangeDetails } from '@zag-js/editable';
+export interface EditableEditChangeDetails {
+    edit: boolean;
+}
 export { EditableArea, type EditableAreaProps, type EditableAreaBaseProps, } from './editable-area';
 export { EditableCancelTrigger, type EditableCancelTriggerProps, type EditableCancelTriggerBaseProps, } from './editable-cancel-trigger';
 export { EditableContext, type EditableContextProps, } from './editable-context';

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

@@ -46,14 +46,16 @@ const useEditable = (props = {}) => {
     readOnly: field?.readOnly,
     required: field?.required,
     getRootNode,
+    edit: props.defaultEdit,
     value: props.defaultValue,
+    "edit.controlled": props.edit !== void 0,
     ...props
   };
   const context = {
     ...initialContext,
     value: props.value,
     onValueChange: useEvent.useEvent(props.onValueChange, { sync: true }),
-    onEdit: useEvent.useEvent(props.onEdit),
+    onEditChange: useEvent.useEvent(props.onEditChange),
     onValueCommit: useEvent.useEvent(props.onValueCommit),
     onValueRevert: useEvent.useEvent(props.onValueRevert)
   };

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

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

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

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

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

@@ -23,14 +23,16 @@ const useEditable = (props = {}) => {
     readOnly: field?.readOnly,
     required: field?.required,
     getRootNode,
+    edit: props.defaultEdit,
     value: props.defaultValue,
+    "edit.controlled": props.edit !== void 0,
     ...props
   };
   const context = {
     ...initialContext,
     value: props.value,
     onValueChange: useEvent(props.onValueChange, { sync: true }),
-    onEdit: useEvent(props.onEdit),
+    onEditChange: useEvent(props.onEditChange),
     onValueCommit: useEvent(props.onValueCommit),
     onValueRevert: useEvent(props.onValueRevert)
   };

package/dist/components/index.cjs

@@ -437,6 +437,24 @@ const splitterRootProvider = require('./splitter/splitter-root-provider.cjs');
 const useSplitter = require('./splitter/use-splitter.cjs');
 const useSplitterContext = require('./splitter/use-splitter-context.cjs');
 const splitter$1 = require('./splitter/splitter.cjs');
+const stepsCompletedContent = require('./steps/steps-completed-content.cjs');
+const stepsContent = require('./steps/steps-content.cjs');
+const stepsContext = require('./steps/steps-context.cjs');
+const stepsIndicator = require('./steps/steps-indicator.cjs');
+const stepsItem = require('./steps/steps-item.cjs');
+const stepsItemContext = require('./steps/steps-item-context.cjs');
+const stepsList = require('./steps/steps-list.cjs');
+const stepsNextTrigger = require('./steps/steps-next-trigger.cjs');
+const stepsPrevTrigger = require('./steps/steps-prev-trigger.cjs');
+const stepsProgress = require('./steps/steps-progress.cjs');
+const stepsRoot = require('./steps/steps-root.cjs');
+const stepsRootProvider = require('./steps/steps-root-provider.cjs');
+const stepsSeparator = require('./steps/steps-separator.cjs');
+const stepsTrigger = require('./steps/steps-trigger.cjs');
+const useSteps = require('./steps/use-steps.cjs');
+const useStepsContext = require('./steps/use-steps-context.cjs');
+const useStepsItemContext = require('./steps/use-steps-item-context.cjs');
+const steps$1 = require('./steps/steps.cjs');
 const switchContext = require('./switch/switch-context.cjs');
 const switchControl = require('./switch/switch-control.cjs');
 const switchHiddenInput = require('./switch/switch-hidden-input.cjs');
@@ -569,6 +587,7 @@ const select = require('@zag-js/select');
 const signaturePad = require('@zag-js/signature-pad');
 const slider = require('@zag-js/slider');
 const splitter = require('@zag-js/splitter');
+const steps = require('@zag-js/steps');
 const zagSwitch = require('@zag-js/switch');
 const tabs = require('@zag-js/tabs');
 const tagsInput = require('@zag-js/tags-input');
@@ -1016,6 +1035,24 @@ exports.SplitterRootProvider = splitterRootProvider.SplitterRootProvider;
 exports.useSplitter = useSplitter.useSplitter;
 exports.useSplitterContext = useSplitterContext.useSplitterContext;
 exports.Splitter = splitter$1;
+exports.StepsCompletedContent = stepsCompletedContent.StepsCompletedContent;
+exports.StepsContent = stepsContent.StepsContent;
+exports.StepsContext = stepsContext.StepsContext;
+exports.StepsIndicator = stepsIndicator.StepsIndicator;
+exports.StepsItem = stepsItem.StepsItem;
+exports.StepsItemContext = stepsItemContext.StepsItemContext;
+exports.StepsList = stepsList.StepsList;
+exports.StepsNextTrigger = stepsNextTrigger.StepsNextTrigger;
+exports.StepsPrevTrigger = stepsPrevTrigger.StepsPrevTrigger;
+exports.StepsProgress = stepsProgress.StepsProgress;
+exports.StepsRoot = stepsRoot.StepsRoot;
+exports.StepsRootProvider = stepsRootProvider.StepsRootProvider;
+exports.StepsSeparator = stepsSeparator.StepsSeparator;
+exports.StepsTrigger = stepsTrigger.StepsTrigger;
+exports.useSteps = useSteps.useSteps;
+exports.useStepsContext = useStepsContext.useStepsContext;
+exports.useStepsItemContext = useStepsItemContext.useStepsItemContext;
+exports.Steps = steps$1;
 exports.SwitchContext = switchContext.SwitchContext;
 exports.SwitchControl = switchControl.SwitchControl;
 exports.SwitchHiddenInput = switchHiddenInput.SwitchHiddenInput;
@@ -1214,6 +1251,10 @@ Object.defineProperty(exports, "splitterAnatomy", {
 	enumerable: true,
 	get: () => splitter.anatomy
 });
+Object.defineProperty(exports, "stepsAnatomy", {
+	enumerable: true,
+	get: () => steps.anatomy
+});
 Object.defineProperty(exports, "switchAnatomy", {
 	enumerable: true,
 	get: () => zagSwitch.anatomy

package/dist/components/index.d.cts

@@ -32,6 +32,7 @@ export * from './select';
 export * from './signature-pad';
 export * from './slider';
 export * from './splitter';
+export * from './steps';
 export * from './switch';
 export * from './tabs';
 export * from './tags-input';

package/dist/components/index.d.ts

@@ -32,6 +32,7 @@ export * from './select';
 export * from './signature-pad';
 export * from './slider';
 export * from './splitter';
+export * from './steps';
 export * from './switch';
 export * from './tabs';
 export * from './tags-input';

package/dist/components/index.js

@@ -463,6 +463,25 @@ export { useSplitter } from './splitter/use-splitter.js';
 export { useSplitterContext } from './splitter/use-splitter-context.js';
 import * as splitter from './splitter/splitter.js';
 export { splitter as Splitter };
+export { StepsCompletedContent } from './steps/steps-completed-content.js';
+export { StepsContent } from './steps/steps-content.js';
+export { StepsContext } from './steps/steps-context.js';
+export { StepsIndicator } from './steps/steps-indicator.js';
+export { StepsItem } from './steps/steps-item.js';
+export { StepsItemContext } from './steps/steps-item-context.js';
+export { StepsList } from './steps/steps-list.js';
+export { StepsNextTrigger } from './steps/steps-next-trigger.js';
+export { StepsPrevTrigger } from './steps/steps-prev-trigger.js';
+export { StepsProgress } from './steps/steps-progress.js';
+export { StepsRoot } from './steps/steps-root.js';
+export { StepsRootProvider } from './steps/steps-root-provider.js';
+export { StepsSeparator } from './steps/steps-separator.js';
+export { StepsTrigger } from './steps/steps-trigger.js';
+export { useSteps } from './steps/use-steps.js';
+export { useStepsContext } from './steps/use-steps-context.js';
+export { useStepsItemContext } from './steps/use-steps-item-context.js';
+import * as steps from './steps/steps.js';
+export { steps as Steps };
 export { SwitchContext } from './switch/switch-context.js';
 export { SwitchControl } from './switch/switch-control.js';
 export { SwitchHiddenInput } from './switch/switch-hidden-input.js';
@@ -604,6 +623,7 @@ export { anatomy as selectAnatomy } from '@zag-js/select';
 export { anatomy as signaturePadAnatomy } from '@zag-js/signature-pad';
 export { anatomy as sliderAnatomy } from '@zag-js/slider';
 export { anatomy as splitterAnatomy } from '@zag-js/splitter';
+export { anatomy as stepsAnatomy } from '@zag-js/steps';
 export { anatomy as switchAnatomy } from '@zag-js/switch';
 export { anatomy as tabsAnatomy } from '@zag-js/tabs';
 export { anatomy as tagsInputAnatomy } from '@zag-js/tags-input';

package/dist/components/steps/index.cjs

@@ -4,6 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const stepsCompletedContent = require('./steps-completed-content.cjs');
 const stepsContent = require('./steps-content.cjs');
+const stepsContext = require('./steps-context.cjs');
 const stepsIndicator = require('./steps-indicator.cjs');
 const stepsItem = require('./steps-item.cjs');
 const stepsItemContext = require('./steps-item-context.cjs');
@@ -18,12 +19,14 @@ const stepsTrigger = require('./steps-trigger.cjs');
 const useSteps = require('./use-steps.cjs');
 const useStepsContext = require('./use-steps-context.cjs');
 const useStepsItemContext = require('./use-steps-item-context.cjs');
-const steps = require('./steps.cjs');
+const steps$1 = require('./steps.cjs');
+const steps = require('@zag-js/steps');
 
 
 
 exports.StepsCompletedContent = stepsCompletedContent.StepsCompletedContent;
 exports.StepsContent = stepsContent.StepsContent;
+exports.StepsContext = stepsContext.StepsContext;
 exports.StepsIndicator = stepsIndicator.StepsIndicator;
 exports.StepsItem = stepsItem.StepsItem;
 exports.StepsItemContext = stepsItemContext.StepsItemContext;
@@ -38,4 +41,8 @@ exports.StepsTrigger = stepsTrigger.StepsTrigger;
 exports.useSteps = useSteps.useSteps;
 exports.useStepsContext = useStepsContext.useStepsContext;
 exports.useStepsItemContext = useStepsItemContext.useStepsItemContext;
-exports.Steps = steps;
+exports.Steps = steps$1;
+Object.defineProperty(exports, "stepsAnatomy", {
+  enumerable: true,
+  get: () => steps.anatomy
+});

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

@@ -1,6 +1,7 @@
 export type { StepChangeDetails } from '@zag-js/steps';
 export { StepsCompletedContent, type StepsCompletedContentBaseProps, type StepsCompletedContentProps, } from './steps-completed-content';
 export { StepsContent, type StepsContentBaseProps, type StepsContentProps } from './steps-content';
+export { StepsContext, type StepsContextProps } from './steps-context';
 export { StepsIndicator, type StepsIndicatorBaseProps, type StepsIndicatorProps, } from './steps-indicator';
 export { StepsItem, type StepsItemBaseProps, type StepsItemProps } from './steps-item';
 export { StepsItemContext, type StepsItemContextProps } from './steps-item-context';
@@ -12,6 +13,7 @@ export { StepsRoot, type StepsRootBaseProps, type StepsRootProps } from './steps
 export { StepsRootProvider, type StepsRootProviderBaseProps, type StepsRootProviderProps, } from './steps-root-provider';
 export { StepsSeparator, type StepsSeparatorBaseProps, type StepsSeparatorProps, } from './steps-separator';
 export { StepsTrigger, type StepsTriggerBaseProps, type StepsTriggerProps } from './steps-trigger';
+export { stepsAnatomy } from './steps.anatomy';
 export { useSteps, type UseStepsProps, type UseStepsReturn } from './use-steps';
 export { useStepsContext, type UseStepsContext } from './use-steps-context';
 export { useStepsItemContext, type UseStepsItemContext } from './use-steps-item-context';

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

@@ -1,6 +1,7 @@
 export type { StepChangeDetails } from '@zag-js/steps';
 export { StepsCompletedContent, type StepsCompletedContentBaseProps, type StepsCompletedContentProps, } from './steps-completed-content';
 export { StepsContent, type StepsContentBaseProps, type StepsContentProps } from './steps-content';
+export { StepsContext, type StepsContextProps } from './steps-context';
 export { StepsIndicator, type StepsIndicatorBaseProps, type StepsIndicatorProps, } from './steps-indicator';
 export { StepsItem, type StepsItemBaseProps, type StepsItemProps } from './steps-item';
 export { StepsItemContext, type StepsItemContextProps } from './steps-item-context';
@@ -12,6 +13,7 @@ export { StepsRoot, type StepsRootBaseProps, type StepsRootProps } from './steps
 export { StepsRootProvider, type StepsRootProviderBaseProps, type StepsRootProviderProps, } from './steps-root-provider';
 export { StepsSeparator, type StepsSeparatorBaseProps, type StepsSeparatorProps, } from './steps-separator';
 export { StepsTrigger, type StepsTriggerBaseProps, type StepsTriggerProps } from './steps-trigger';
+export { stepsAnatomy } from './steps.anatomy';
 export { useSteps, type UseStepsProps, type UseStepsReturn } from './use-steps';
 export { useStepsContext, type UseStepsContext } from './use-steps-context';
 export { useStepsItemContext, type UseStepsItemContext } from './use-steps-item-context';

package/dist/components/steps/index.js

@@ -1,5 +1,6 @@
 export { StepsCompletedContent } from './steps-completed-content.js';
 export { StepsContent } from './steps-content.js';
+export { StepsContext } from './steps-context.js';
 export { StepsIndicator } from './steps-indicator.js';
 export { StepsItem } from './steps-item.js';
 export { StepsItemContext } from './steps-item-context.js';
@@ -16,3 +17,4 @@ export { useStepsContext } from './use-steps-context.js';
 export { useStepsItemContext } from './use-steps-item-context.js';
 import * as steps from './steps.js';
 export { steps as Steps };
+export { anatomy as stepsAnatomy } from '@zag-js/steps';

package/dist/components/steps/steps-context.cjs

@@ -0,0 +1,14 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const useStepsContext = require('./use-steps-context.cjs');
+
+const StepsContext = (props) => {
+  const context = useStepsContext.useStepsContext();
+  return props.children(context);
+};
+StepsContext.displayName = "StepsContext";
+
+exports.StepsContext = StepsContext;

package/dist/components/steps/steps-context.js

@@ -0,0 +1,10 @@
+'use client';
+import { useStepsContext } from './use-steps-context.js';
+
+const StepsContext = (props) => {
+  const context = useStepsContext();
+  return props.children(context);
+};
+StepsContext.displayName = "StepsContext";
+
+export { StepsContext };

package/dist/components/steps/steps.anatomy.d.cts

@@ -0,0 +1 @@
+export { anatomy as stepsAnatomy } from '@zag-js/steps';

package/dist/components/steps/steps.anatomy.d.ts

@@ -0,0 +1 @@
+export { anatomy as stepsAnatomy } from '@zag-js/steps';

package/dist/components/steps/steps.cjs

@@ -14,6 +14,8 @@ const stepsRoot = require('./steps-root.cjs');
 const stepsRootProvider = require('./steps-root-provider.cjs');
 const stepsSeparator = require('./steps-separator.cjs');
 const stepsTrigger = require('./steps-trigger.cjs');
+const stepsItemContext = require('./steps-item-context.cjs');
+const stepsContext = require('./steps-context.cjs');
 
 
 
@@ -29,3 +31,5 @@ exports.Root = stepsRoot.StepsRoot;
 exports.RootProvider = stepsRootProvider.StepsRootProvider;
 exports.Separator = stepsSeparator.StepsSeparator;
 exports.Trigger = stepsTrigger.StepsTrigger;
+exports.ItemContext = stepsItemContext.StepsItemContext;
+exports.Context = stepsContext.StepsContext;

package/dist/components/steps/steps.d.cts

@@ -11,3 +11,5 @@ export { StepsRoot as Root, type StepsRootBaseProps as RootBaseProps, type Steps
 export { StepsRootProvider as RootProvider, type StepsRootProviderBaseProps as RootProviderBaseProps, type StepsRootProviderProps as RootProviderProps, } from './steps-root-provider';
 export { StepsSeparator as Separator, type StepsSeparatorBaseProps as SeparatorBaseProps, type StepsSeparatorProps as SeparatorProps, } from './steps-separator';
 export { StepsTrigger as Trigger, type StepsTriggerBaseProps as TriggerBaseProps, type StepsTriggerProps as TriggerProps, } from './steps-trigger';
+export { StepsItemContext as ItemContext, type StepsItemContextProps as ItemContextProps, } from './steps-item-context';
+export { StepsContext as Context, type StepsContextProps as ContextProps } from './steps-context';

package/dist/components/steps/steps.d.ts

@@ -11,3 +11,5 @@ export { StepsRoot as Root, type StepsRootBaseProps as RootBaseProps, type Steps
 export { StepsRootProvider as RootProvider, type StepsRootProviderBaseProps as RootProviderBaseProps, type StepsRootProviderProps as RootProviderProps, } from './steps-root-provider';
 export { StepsSeparator as Separator, type StepsSeparatorBaseProps as SeparatorBaseProps, type StepsSeparatorProps as SeparatorProps, } from './steps-separator';
 export { StepsTrigger as Trigger, type StepsTriggerBaseProps as TriggerBaseProps, type StepsTriggerProps as TriggerProps, } from './steps-trigger';
+export { StepsItemContext as ItemContext, type StepsItemContextProps as ItemContextProps, } from './steps-item-context';
+export { StepsContext as Context, type StepsContextProps as ContextProps } from './steps-context';

package/dist/components/steps/steps.js

@@ -10,3 +10,5 @@ export { StepsRoot as Root } from './steps-root.js';
 export { StepsRootProvider as RootProvider } from './steps-root-provider.js';
 export { StepsSeparator as Separator } from './steps-separator.js';
 export { StepsTrigger as Trigger } from './steps-trigger.js';
+export { StepsItemContext as ItemContext } from './steps-item-context.js';
+export { StepsContext as Context } from './steps-context.js';

package/dist/index.cjs

@@ -437,6 +437,24 @@ const splitterRootProvider = require('./components/splitter/splitter-root-provid
 const useSplitter = require('./components/splitter/use-splitter.cjs');
 const useSplitterContext = require('./components/splitter/use-splitter-context.cjs');
 const splitter$1 = require('./components/splitter/splitter.cjs');
+const stepsCompletedContent = require('./components/steps/steps-completed-content.cjs');
+const stepsContent = require('./components/steps/steps-content.cjs');
+const stepsContext = require('./components/steps/steps-context.cjs');
+const stepsIndicator = require('./components/steps/steps-indicator.cjs');
+const stepsItem = require('./components/steps/steps-item.cjs');
+const stepsItemContext = require('./components/steps/steps-item-context.cjs');
+const stepsList = require('./components/steps/steps-list.cjs');
+const stepsNextTrigger = require('./components/steps/steps-next-trigger.cjs');
+const stepsPrevTrigger = require('./components/steps/steps-prev-trigger.cjs');
+const stepsProgress = require('./components/steps/steps-progress.cjs');
+const stepsRoot = require('./components/steps/steps-root.cjs');
+const stepsRootProvider = require('./components/steps/steps-root-provider.cjs');
+const stepsSeparator = require('./components/steps/steps-separator.cjs');
+const stepsTrigger = require('./components/steps/steps-trigger.cjs');
+const useSteps = require('./components/steps/use-steps.cjs');
+const useStepsContext = require('./components/steps/use-steps-context.cjs');
+const useStepsItemContext = require('./components/steps/use-steps-item-context.cjs');
+const steps$1 = require('./components/steps/steps.cjs');
 const switchContext = require('./components/switch/switch-context.cjs');
 const switchControl = require('./components/switch/switch-control.cjs');
 const switchHiddenInput = require('./components/switch/switch-hidden-input.cjs');
@@ -573,6 +591,7 @@ const select = require('@zag-js/select');
 const signaturePad = require('@zag-js/signature-pad');
 const slider = require('@zag-js/slider');
 const splitter = require('@zag-js/splitter');
+const steps = require('@zag-js/steps');
 const zagSwitch = require('@zag-js/switch');
 const tabs = require('@zag-js/tabs');
 const tagsInput = require('@zag-js/tags-input');
@@ -1020,6 +1039,24 @@ exports.SplitterRootProvider = splitterRootProvider.SplitterRootProvider;
 exports.useSplitter = useSplitter.useSplitter;
 exports.useSplitterContext = useSplitterContext.useSplitterContext;
 exports.Splitter = splitter$1;
+exports.StepsCompletedContent = stepsCompletedContent.StepsCompletedContent;
+exports.StepsContent = stepsContent.StepsContent;
+exports.StepsContext = stepsContext.StepsContext;
+exports.StepsIndicator = stepsIndicator.StepsIndicator;
+exports.StepsItem = stepsItem.StepsItem;
+exports.StepsItemContext = stepsItemContext.StepsItemContext;
+exports.StepsList = stepsList.StepsList;
+exports.StepsNextTrigger = stepsNextTrigger.StepsNextTrigger;
+exports.StepsPrevTrigger = stepsPrevTrigger.StepsPrevTrigger;
+exports.StepsProgress = stepsProgress.StepsProgress;
+exports.StepsRoot = stepsRoot.StepsRoot;
+exports.StepsRootProvider = stepsRootProvider.StepsRootProvider;
+exports.StepsSeparator = stepsSeparator.StepsSeparator;
+exports.StepsTrigger = stepsTrigger.StepsTrigger;
+exports.useSteps = useSteps.useSteps;
+exports.useStepsContext = useStepsContext.useStepsContext;
+exports.useStepsItemContext = useStepsItemContext.useStepsItemContext;
+exports.Steps = steps$1;
 exports.SwitchContext = switchContext.SwitchContext;
 exports.SwitchControl = switchControl.SwitchControl;
 exports.SwitchHiddenInput = switchHiddenInput.SwitchHiddenInput;
@@ -1222,6 +1259,10 @@ Object.defineProperty(exports, "splitterAnatomy", {
 	enumerable: true,
 	get: () => splitter.anatomy
 });
+Object.defineProperty(exports, "stepsAnatomy", {
+	enumerable: true,
+	get: () => steps.anatomy
+});
 Object.defineProperty(exports, "switchAnatomy", {
 	enumerable: true,
 	get: () => zagSwitch.anatomy