@ark-ui/react 1.2.1 → 1.3.0

package/CHANGELOG.md

@@ -6,6 +6,29 @@ description: All notable changes to this project will be documented in this file
 
 ## [Unreleased]
 
+## [1.3.0] - 2024-01-17
+
+### Added
+
+- Added the `Progress` component.
+- Added `valueAsString` to `onValueChange` in `DatePicker` callback details
+- Exported change details typings, for example `AccordionValueChangeDetails` or `DialogOpenChangeDetails`
+- Redesign `Portal` component to support `getRootNode` and `disabled` props
+
+### Changed
+
+- Replaced the styling props for indicator with CSS variables in `RadioGroup`, `SegmentGroup`, and `Tabs`.
+
+### Fixed
+
+- Added missing `placeholder` prop to `SelectValueTextProps` type.
+- Changed `PopoverDescriptionProps` type from `div` to `p`
+- Fixed multiple rerenders on `Select` component with Next.js or Remix `useSearchParams`
+- Fixed the issue where setting `disabled` on `Combobox` does not reflect in combobox item
+- Fix an issue that breaks the `Combobox` when clicking on the input while the menu is open
+- Fixed the issue where `DatePicker` initial value isn't set when using controlled context
+- Resolved an issue that `Menu` option item could not be activated by keyboard
+
 ## [1.2.1] - 2023-12-13
 
 ### Fixed
@@ -17,7 +40,7 @@ description: All notable changes to this project will be documented in this file
 ### Added
 
 - Added the `ToastGroup` component.
-- Added entrypoint for the  `ark` factory at `@ark-ui/react/factory`
+- Added entrypoint for the `ark` factory at `@ark-ui/react/factory`
 
 ### Changed
 

package/README.md

@@ -28,6 +28,7 @@ Ark UI is available for the following JavaScript frameworks:
 - [Pagination](https://ark-ui.com/docs/components/pagination)
 - [Pin Input](https://ark-ui.com/docs/components/pin-input)
 - [Popover](https://ark-ui.com/docs/components/popover)
+- [Progress](https://ark-ui.com/docs/components/progress)
 - [Radio Group](https://ark-ui.com/docs/components/radio-group)
 - [Range Slider](https://ark-ui.com/docs/components/slider)
 - [Rating Group](https://ark-ui.com/docs/components/rating-group)

package/accordion/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { FocusChangeDetails as AccordionFocusChangeDetails, ValueChangeDetails as AccordionValueChangeDetails } from '@zag-js/accordion';
 import { type AccordionProps } from './accordion';
 import { useAccordionContext, type AccordionContext } from './accordion-context';
 import { AccordionItem, type AccordionItemProps } from './accordion-item';
@@ -15,4 +16,4 @@ declare const Accordion: ForwardRefExoticComponent<AccordionProps & RefAttribute
     ItemTrigger: ForwardRefExoticComponent<AccordionItemTriggerProps & RefAttributes<HTMLButtonElement>>;
 };
 export { Accordion, AccordionItem, AccordionItemContent, AccordionItemIndicator, AccordionItemTrigger, useAccordionContext, useAccordionItemContext, };
-export type { AccordionContext, AccordionItemContentProps, AccordionItemContext, AccordionItemIndicatorProps, AccordionItemProps, AccordionItemTriggerProps, AccordionProps, };
+export type { AccordionContext, AccordionFocusChangeDetails, AccordionItemContentProps, AccordionItemContext, AccordionItemIndicatorProps, AccordionItemProps, AccordionItemTriggerProps, AccordionProps, AccordionValueChangeDetails, };

package/accordion/{accordion.stories.d.ts → stories/accordion.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Accordion } from './';
+import { Accordion } from '../';
 type AccordionType = typeof Accordion;
 declare const meta: Meta<AccordionType>;
 export default meta;

package/avatar/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { StatusChangeDetails as AvatarStatusChangeDetails } from '@zag-js/avatar';
 import { type AvatarProps } from './avatar';
 import { useAvatarContext, type AvatarContext } from './avatar-context';
 import { AvatarFallback, type AvatarFallbackProps } from './avatar-fallback';
@@ -10,4 +11,4 @@ declare const Avatar: ForwardRefExoticComponent<AvatarProps & RefAttributes<HTML
     Image: ForwardRefExoticComponent<AvatarImageProps & RefAttributes<HTMLImageElement>>;
 };
 export { Avatar, AvatarFallback, AvatarImage, useAvatarContext };
-export type { AvatarContext, AvatarFallbackProps, AvatarImageProps, AvatarProps };
+export type { AvatarContext, AvatarFallbackProps, AvatarImageProps, AvatarProps, AvatarStatusChangeDetails, };

package/avatar/{avatar.stories.d.ts → stories/avatar.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Avatar } from './';
+import { Avatar } from '../';
 type AvatarType = typeof Avatar.Root;
 declare const meta: Meta<AvatarType>;
 export default meta;

package/carousel/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { SlideChangeDetails as CarouselSlideChangeDetails } from '@zag-js/carousel';
 import { type CarouselProps } from './carousel';
 import { useCarouselContext, type CarouselContext } from './carousel-context';
 import { CarouselControl, type CarouselControlProps } from './carousel-control';
@@ -22,4 +23,4 @@ declare const Carousel: ForwardRefExoticComponent<CarouselProps & RefAttributes<
     Viewport: ForwardRefExoticComponent<CarouselViewportProps & RefAttributes<HTMLDivElement>>;
 };
 export { Carousel, CarouselControl, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup, CarouselNextTrigger, CarouselPrevTrigger, CarouselViewport, useCarouselContext, };
-export type { CarouselContext, CarouselControlProps, CarouselIndicatorGroupProps, CarouselIndicatorProps, CarouselItemGroupProps, CarouselItemProps, CarouselNextTriggerProps, CarouselPrevTriggerProps, CarouselProps, CarouselViewportProps, };
+export type { CarouselContext, CarouselControlProps, CarouselIndicatorGroupProps, CarouselIndicatorProps, CarouselItemGroupProps, CarouselItemProps, CarouselNextTriggerProps, CarouselPrevTriggerProps, CarouselProps, CarouselSlideChangeDetails, CarouselViewportProps, };

package/carousel/{carousel.stories.d.ts → stories/carousel.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Carousel } from './';
+import { Carousel } from '../';
 type CarouselType = typeof Carousel;
 declare const meta: Meta<CarouselType>;
 export default meta;

package/checkbox/index.d.ts

@@ -1,6 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
-import type { CheckedState } from '@zag-js/checkbox';
+import type { CheckedChangeDetails as CheckboxCheckedChangeDetails, CheckedState } from '@zag-js/checkbox';
 import { type CheckboxProps } from './checkbox';
 import { useCheckboxContext, type CheckboxContext } from './checkbox-context';
 import { CheckboxControl, type CheckboxControlProps } from './checkbox-control';
@@ -13,4 +13,4 @@ declare const Checkbox: ForwardRefExoticComponent<CheckboxProps & RefAttributes<
     Indicator: ForwardRefExoticComponent<CheckboxIndicatorProps & RefAttributes<HTMLDivElement>>;
 };
 export { Checkbox, CheckboxControl, CheckboxIndicator, CheckboxLabel, useCheckboxContext };
-export type { CheckboxContext, CheckboxControlProps, CheckboxIndicatorProps, CheckboxLabelProps, CheckboxProps, CheckedState, };
+export type { CheckboxCheckedChangeDetails, CheckboxContext, CheckboxControlProps, CheckboxIndicatorProps, CheckboxLabelProps, CheckboxProps, CheckedState, };

package/checkbox/{checkbox.stories.d.ts → stories/checkbox.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Checkbox } from './';
+import { Checkbox } from '../';
 type CheckboxType = typeof Checkbox;
 declare const meta: Meta<CheckboxType>;
 export default meta;

package/color-picker/index.d.ts

@@ -1,6 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
-import type { ColorFormat } from '@zag-js/color-picker';
+import type { ColorFormat, FormatChangeDetails as ColorPickerFormatChangeDetails, OpenChangeDetails as ColorPickerOpenChangeDetails, ValueChangeDetails as ColorPickerValueChangeDetails } from '@zag-js/color-picker';
 import { type ColorPickerProps } from './color-picker';
 import { ColorPickerArea, type ColorPickerAreaProps } from './color-picker-area';
 import { ColorPickerAreaBackground, type ColorPickerAreaBackgroundProps } from './color-picker-area-background';
@@ -53,4 +53,4 @@ declare const ColorPicker: ForwardRefExoticComponent<ColorPickerProps & RefAttri
     View: ForwardRefExoticComponent<ColorPickerViewProps & RefAttributes<HTMLDivElement>>;
 };
 export { ColorPicker, ColorPickerArea, ColorPickerAreaBackground, ColorPickerAreaThumb, ColorPickerChannelInput, ColorPickerChannelSlider, ColorPickerChannelSliderThumb, ColorPickerChannelSliderTrack, ColorPickerContent, ColorPickerControl, ColorPickerEyeDropperTrigger, ColorPickerFormatSelect, ColorPickerFormatTrigger, ColorPickerLabel, ColorPickerPositioner, ColorPickerSwatch, ColorPickerSwatchGroup, ColorPickerSwatchIndicator, ColorPickerSwatchTrigger, ColorPickerTransparencyGrid, ColorPickerTrigger, ColorPickerValueText, ColorPickerView, useColorPickerAreaContext, useColorPickerChannelSliderContext, useColorPickerContext, };
-export type { ColorFormat, ColorPickerAreaBackgroundProps, ColorPickerAreaContext, ColorPickerAreaProps, ColorPickerAreaThumbProps, ColorPickerChannelInputProps, ColorPickerChannelSliderContext, ColorPickerChannelSliderProps, ColorPickerChannelSliderThumbProps, ColorPickerChannelSliderTrackProps, ColorPickerContentProps, ColorPickerContext, ColorPickerControlProps, ColorPickerEyeDropperTriggerProps, ColorPickerFormatSelectProps, ColorPickerFormatTriggerProps, ColorPickerLabelProps, ColorPickerPositionerProps, ColorPickerProps, ColorPickerSwatchGroupProps, ColorPickerSwatchIndicatorProps, ColorPickerSwatchProps, ColorPickerSwatchTriggerProps, ColorPickerTransparencyGridProps, ColorPickerTriggerProps, ColorPickerValueTextProps, ColorPickerViewProps, };
+export type { ColorFormat, ColorPickerAreaBackgroundProps, ColorPickerAreaContext, ColorPickerAreaProps, ColorPickerAreaThumbProps, ColorPickerChannelInputProps, ColorPickerChannelSliderContext, ColorPickerChannelSliderProps, ColorPickerChannelSliderThumbProps, ColorPickerChannelSliderTrackProps, ColorPickerContentProps, ColorPickerContext, ColorPickerControlProps, ColorPickerEyeDropperTriggerProps, ColorPickerFormatChangeDetails, ColorPickerFormatSelectProps, ColorPickerFormatTriggerProps, ColorPickerLabelProps, ColorPickerOpenChangeDetails, ColorPickerPositionerProps, ColorPickerProps, ColorPickerSwatchGroupProps, ColorPickerSwatchIndicatorProps, ColorPickerSwatchProps, ColorPickerSwatchTriggerProps, ColorPickerTransparencyGridProps, ColorPickerTriggerProps, ColorPickerValueChangeDetails, ColorPickerValueTextProps, ColorPickerViewProps, };

package/color-picker/{color-picker.stories.d.ts → stories/color-picker.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { ColorPicker } from './';
+import { ColorPicker } from '../';
 type ColorPickerType = typeof ColorPicker;
 declare const meta: Meta<ColorPickerType>;
 export default meta;

package/combobox/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { HighlightChangeDetails as ComboboxHighlightChangeDetails, InputValueChangeDetails as ComboboxInputValueChangeDetails, OpenChangeDetails as ComboboxOpenChangeDetails, ValueChangeDetails as ComboboxValueChangeDetails } from '@zag-js/combobox';
 import type { CollectionItem } from '../types';
 import { ComboboxComponent, type ComboboxProps } from './combobox';
 import { ComboboxClearTrigger, type ComboboxClearTriggerProps } from './combobox-clear-trigger';
@@ -31,4 +32,4 @@ declare const Combobox: ComboboxComponent & {
     Trigger: ForwardRefExoticComponent<ComboboxTriggerProps & RefAttributes<HTMLButtonElement>>;
 };
 export { Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxItemGroup, ComboboxItemGroupLabel, ComboboxItemIndicator, ComboboxItemText, ComboboxLabel, ComboboxPositioner, ComboboxTrigger, useComboboxContext, };
-export type { CollectionItem, ComboboxClearTriggerProps, ComboboxContentProps, ComboboxContext, ComboboxControlProps, ComboboxInputProps, ComboboxItemGroupLabelProps, ComboboxItemGroupProps, ComboboxItemIndicatorProps, ComboboxItemProps, ComboboxItemTextProps, ComboboxLabelProps, ComboboxPositionerProps, ComboboxProps, ComboboxTriggerProps, };
+export type { CollectionItem, ComboboxClearTriggerProps, ComboboxContentProps, ComboboxContext, ComboboxControlProps, ComboboxHighlightChangeDetails, ComboboxInputProps, ComboboxInputValueChangeDetails, ComboboxItemGroupLabelProps, ComboboxItemGroupProps, ComboboxItemIndicatorProps, ComboboxItemProps, ComboboxItemTextProps, ComboboxLabelProps, ComboboxOpenChangeDetails, ComboboxPositionerProps, ComboboxProps, ComboboxTriggerProps, ComboboxValueChangeDetails, };

package/combobox/{combobox.stories.d.ts → stories/combobox.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Combobox } from './';
+import { Combobox } from '../';
 type ComboboxType = typeof Combobox;
 declare const meta: Meta<ComboboxType>;
 export default meta;

package/date-picker/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { FocusChangeDetails as DatePickerFocusChangeDetails, OpenChangeDetails as DatePickerOpenChangeDetails, ValueChangeDetails as DatePickerValueChangeDetails, ViewChangeDetails as DatePickerViewChangeDetails } from '@zag-js/date-picker';
 import { type DatePickerProps } from './date-picker';
 import { DatePickerClearTrigger, type DatePickerClearTriggerProps } from './date-picker-clear-trigger';
 import { DatePickerContent, type DatePickerContentProps } from './date-picker-content';
@@ -53,4 +54,4 @@ declare const DatePicker: ForwardRefExoticComponent<DatePickerProps & RefAttribu
     YearSelect: ForwardRefExoticComponent<DatePickerYearSelectProps & RefAttributes<HTMLSelectElement>>;
 };
 export { DatePicker, DatePickerClearTrigger, DatePickerContent, DatePickerControl, DatePickerInput, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPrevTrigger, DatePickerRangeText, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerYearSelect, useDatePickerContext, useDatePickerTableCellContext, useDatePickerTableContext, useDatePickerViewContext, };
-export type { DatePickerClearTriggerProps, DatePickerContentProps, DatePickerContext, DatePickerControlProps, DatePickerInputProps, DatePickerLabelProps, DatePickerMonthSelectProps, DatePickerNextTriggerProps, DatePickerPositionerProps, DatePickerPrevTriggerProps, DatePickerProps, DatePickerRangeTextProps, DatePickerTableBodyProps, DatePickerTableCellContext, DatePickerTableCellProps, DatePickerTableCellTriggerProps, DatePickerTableContext, DatePickerTableHeadProps, DatePickerTableHeaderProps, DatePickerTableProps, DatePickerTableRowProps, DatePickerTriggerProps, DatePickerViewContext, DatePickerViewControlProps, DatePickerViewProps, DatePickerViewTriggerProps, DatePickerYearSelectProps, };
+export type { DatePickerClearTriggerProps, DatePickerContentProps, DatePickerContext, DatePickerControlProps, DatePickerFocusChangeDetails, DatePickerInputProps, DatePickerLabelProps, DatePickerMonthSelectProps, DatePickerNextTriggerProps, DatePickerOpenChangeDetails, DatePickerPositionerProps, DatePickerPrevTriggerProps, DatePickerProps, DatePickerRangeTextProps, DatePickerTableBodyProps, DatePickerTableCellContext, DatePickerTableCellProps, DatePickerTableCellTriggerProps, DatePickerTableContext, DatePickerTableHeadProps, DatePickerTableHeaderProps, DatePickerTableProps, DatePickerTableRowProps, DatePickerTriggerProps, DatePickerValueChangeDetails, DatePickerViewChangeDetails, DatePickerViewContext, DatePickerViewControlProps, DatePickerViewProps, DatePickerViewTriggerProps, DatePickerYearSelectProps, };

package/date-picker/{date-picker.stories.d.ts → stories/date-picker.stories.d.ts}

@@ -1,9 +1,8 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { DatePicker } from './';
+import { DatePicker } from '../';
 type DatePickerType = typeof DatePicker;
 declare const meta: Meta<DatePickerType>;
 export default meta;
 export declare const Basic: () => JSX.Element;
-export declare const RangeWithSingleGrid: () => JSX.Element;
 export declare const Standalone: () => JSX.Element;

package/date-picker/stories/date-range-picker.stories.d.ts

@@ -0,0 +1,8 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+import { DatePicker } from '../';
+type DatePickerType = typeof DatePicker;
+declare const meta: Meta<DatePickerType>;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const Standalone: () => JSX.Element;

package/dialog/index.d.ts

@@ -1,6 +1,7 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
 /// <reference types="react" />
+import type { OpenChangeDetails as DialogOpenChangeDetails } from '@zag-js/dialog';
 import { type DialogProps } from './dialog';
 import { DialogBackdrop, type DialogBackdropProps } from './dialog-backdrop';
 import { DialogCloseTrigger, type DialogCloseTriggerProps } from './dialog-close-trigger';
@@ -20,5 +21,5 @@ declare const Dialog: ((props: DialogProps) => JSX.Element) & {
     Title: ForwardRefExoticComponent<DialogTitleProps & RefAttributes<HTMLHeadingElement>>;
     Trigger: ForwardRefExoticComponent<DialogTriggerProps & RefAttributes<HTMLButtonElement>>;
 };
-export { Dialog, DialogBackdrop, DialogCloseTrigger, DialogContent, DialogDescription, DialogPositioner, DialogTitle, DialogTrigger, useDialogContext, };
-export type { DialogBackdropProps, DialogCloseTriggerProps, DialogContentProps, DialogContext, DialogDescriptionProps, DialogPositionerProps, DialogProps, DialogTitleProps, DialogTriggerProps, };
+export { Dialog, DialogBackdrop, DialogCloseTrigger, DialogContent, DialogDescription, DialogPositioner, DialogTitle, DialogTrigger, useDialogContext };
+export type { DialogBackdropProps, DialogCloseTriggerProps, DialogContentProps, DialogContext, DialogDescriptionProps, DialogOpenChangeDetails, DialogPositionerProps, DialogProps, DialogTitleProps, DialogTriggerProps };

package/dialog/{dialog.stories.d.ts → stories/dialog.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Dialog } from './';
+import { Dialog } from '../';
 type DialogType = typeof Dialog;
 declare const meta: Meta<DialogType>;
 export default meta;

package/editable/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { ValueChangeDetails as EditableValueChangeDetails } from '@zag-js/editable';
 import { type EditableProps } from './editable';
 import { EditableArea, type EditableAreaProps } from './editable-area';
 import { EditableCancelTrigger, type EditableCancelTriggerProps } from './editable-cancel-trigger';
@@ -22,4 +23,4 @@ declare const Editable: ForwardRefExoticComponent<EditableProps & RefAttributes<
     SubmitTrigger: ForwardRefExoticComponent<EditableSubmitTriggerProps & RefAttributes<HTMLButtonElement>>;
 };
 export { Editable, EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableSubmitTrigger, useEditableContext, };
-export type { EditableAreaProps, EditableCancelTriggerProps, EditableContext, EditableControlProps, EditableEditTriggerProps, EditableInputProps, EditableLabelProps, EditablePreviewProps, EditableProps, EditableSubmitTriggerProps, };
+export type { EditableAreaProps, EditableCancelTriggerProps, EditableContext, EditableControlProps, EditableEditTriggerProps, EditableInputProps, EditableLabelProps, EditablePreviewProps, EditableProps, EditableSubmitTriggerProps, EditableValueChangeDetails, };

package/editable/{editable.stories.d.ts → stories/editable.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Editable } from './';
+import { Editable } from '../';
 type EditableType = typeof Editable;
 declare const meta: Meta<EditableType>;
 export default meta;

package/environment/{environment.stories.d.ts → stories/environment.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Environment } from './';
+import { Environment } from '../';
 type EnvironmentType = typeof Environment;
 declare const meta: Meta<EnvironmentType>;
 export default meta;

package/file-upload/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { FileAcceptDetails as FileUploadFileAcceptDetails, FileChangeDetails as FileUploadFileChangeDetails, FileRejectDetails as FileUploadFileRejectDetails } from '@zag-js/file-upload';
 import { type FileUploadProps } from './file-upload';
 import { useFileUploadContext, type FileUploadContext } from './file-upload-context';
 import { FileUploadDropzone, type FileUploadDropzoneProps } from './file-upload-dropzone';
@@ -26,4 +27,4 @@ declare const FileUpload: ForwardRefExoticComponent<FileUploadProps & RefAttribu
     Trigger: ForwardRefExoticComponent<FileUploadTriggerProps & RefAttributes<HTMLButtonElement>>;
 };
 export { FileUpload, FileUploadDropzone, FileUploadItem, FileUploadItemDeleteTrigger, FileUploadItemGroup, FileUploadItemName, FileUploadItemPreviewImage, FileUploadItemSizeText, FileUploadLabel, FileUploadTrigger, useFileUploadContext, };
-export type { FileUploadContext, FileUploadDropzoneProps, FileUploadItemDeleteTriggerProps, FileUploadItemGroupProps, FileUploadItemNameProps, FileUploadItemPreviewImageProps, FileUploadItemPreviewProps, FileUploadItemProps, FileUploadItemSizeTextProps, FileUploadLabelProps, FileUploadProps, FileUploadTriggerProps, };
+export type { FileUploadContext, FileUploadDropzoneProps, FileUploadFileAcceptDetails, FileUploadFileChangeDetails, FileUploadFileRejectDetails, FileUploadItemDeleteTriggerProps, FileUploadItemGroupProps, FileUploadItemNameProps, FileUploadItemPreviewImageProps, FileUploadItemPreviewProps, FileUploadItemProps, FileUploadItemSizeTextProps, FileUploadLabelProps, FileUploadProps, FileUploadTriggerProps, };

package/file-upload/{file-upload.stories.d.ts → stories/file-upload.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { FileUpload } from './';
+import { FileUpload } from '../';
 type FileUploadType = typeof FileUpload;
 declare const meta: Meta<FileUploadType>;
 export default meta;

package/hover-card/index.d.ts

@@ -1,6 +1,7 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
 /// <reference types="react" />
+import type { OpenChangeDetails as HoverCardOpenChangeDetails } from '@zag-js/color-picker';
 import { type HoverCardProps } from './hover-card';
 import { HoverCardArrow, type HoverCardArrowProps } from './hover-card-arrow';
 import { HoverCardArrowTip, type HoverCardArrowTipProps } from './hover-card-arrow-tip';
@@ -17,4 +18,4 @@ declare const HoverCard: ((props: HoverCardProps) => JSX.Element) & {
     Trigger: ForwardRefExoticComponent<HoverCardTriggerProps & RefAttributes<HTMLButtonElement>>;
 };
 export { HoverCard, HoverCardArrow, HoverCardArrowTip, HoverCardContent, HoverCardPositioner, HoverCardTrigger, useHoverCardContext, };
-export type { HoverCardArrowProps, HoverCardArrowTipProps, HoverCardContentProps, HoverCardContext, HoverCardPositionerProps, HoverCardProps, HoverCardTriggerProps, };
+export type { HoverCardArrowProps, HoverCardArrowTipProps, HoverCardContentProps, HoverCardContext, HoverCardOpenChangeDetails, HoverCardPositionerProps, HoverCardProps, HoverCardTriggerProps, };

package/hover-card/{hover-card.stories.d.ts → stories/hover-card.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { HoverCard } from './';
+import { HoverCard } from '../';
 type HoverCardType = typeof HoverCard;
 declare const meta: Meta<HoverCardType>;
 export default meta;

package/index.cjs

@@ -22,18 +22,19 @@ const index$f = require('./pin-input/index.cjs');
 const index$g = require('./popover/index.cjs');
 const portal = require('./portal.cjs');
 const index$h = require('./presence/index.cjs');
-const index$i = require('./radio-group/index.cjs');
-const index$j = require('./rating-group/index.cjs');
-const index$k = require('./segment-group/index.cjs');
-const index$l = require('./select/index.cjs');
-const index$m = require('./slider/index.cjs');
-const index$n = require('./splitter/index.cjs');
-const index$o = require('./switch/index.cjs');
-const index$p = require('./tabs/index.cjs');
-const index$q = require('./tags-input/index.cjs');
-const index$r = require('./toast/index.cjs');
-const index$s = require('./toggle-group/index.cjs');
-const index$t = require('./tooltip/index.cjs');
+const index$i = require('./progress/index.cjs');
+const index$j = require('./radio-group/index.cjs');
+const index$k = require('./rating-group/index.cjs');
+const index$l = require('./segment-group/index.cjs');
+const index$m = require('./select/index.cjs');
+const index$n = require('./slider/index.cjs');
+const index$o = require('./splitter/index.cjs');
+const index$p = require('./switch/index.cjs');
+const index$q = require('./tabs/index.cjs');
+const index$r = require('./tags-input/index.cjs');
+const index$s = require('./toast/index.cjs');
+const index$t = require('./toggle-group/index.cjs');
+const index$u = require('./tooltip/index.cjs');
 const accordionItem = require('./accordion/accordion-item.cjs');
 const accordionItemContent = require('./accordion/accordion-item-content.cjs');
 const accordionItemIndicator = require('./accordion/accordion-item-indicator.cjs');
@@ -198,6 +199,15 @@ const presencePropsContext = require('./presence/presence-props-context.cjs');
 const presenceContext = require('./presence/presence-context.cjs');
 const splitPresenceProps = require('./presence/split-presence-props.cjs');
 const usePresence = require('./presence/use-presence.cjs');
+const progressCircle = require('./progress/progress-circle.cjs');
+const progressCircleRange = require('./progress/progress-circle-range.cjs');
+const progressCircleTrack = require('./progress/progress-circle-track.cjs');
+const progressIndicator = require('./progress/progress-indicator.cjs');
+const progressLabel = require('./progress/progress-label.cjs');
+const progressRange = require('./progress/progress-range.cjs');
+const progressTrack = require('./progress/progress-track.cjs');
+const progressValueText = require('./progress/progress-value-text.cjs');
+const progressContext = require('./progress/progress-context.cjs');
 const radioGroupItem = require('./radio-group/radio-group-item.cjs');
 const radioGroupItemControl = require('./radio-group/radio-group-item-control.cjs');
 const radioGroupItemText = require('./radio-group/radio-group-item-text.cjs');
@@ -299,18 +309,19 @@ exports.PinInput = index$f.PinInput;
 exports.Popover = index$g.Popover;
 exports.Portal = portal.Portal;
 exports.Presence = index$h.Presence;
-exports.RadioGroup = index$i.RadioGroup;
-exports.RatingGroup = index$j.RatingGroup;
-exports.SegmentGroup = index$k.SegmentGroup;
-exports.Select = index$l.Select;
-exports.Slider = index$m.Slider;
-exports.Splitter = index$n.Splitter;
-exports.Switch = index$o.Switch;
-exports.Tabs = index$p.Tabs;
-exports.TagsInput = index$q.TagsInput;
-exports.Toast = index$r.Toast;
-exports.ToggleGroup = index$s.ToggleGroup;
-exports.Tooltip = index$t.Tooltip;
+exports.Progress = index$i.Progress;
+exports.RadioGroup = index$j.RadioGroup;
+exports.RatingGroup = index$k.RatingGroup;
+exports.SegmentGroup = index$l.SegmentGroup;
+exports.Select = index$m.Select;
+exports.Slider = index$n.Slider;
+exports.Splitter = index$o.Splitter;
+exports.Switch = index$p.Switch;
+exports.Tabs = index$q.Tabs;
+exports.TagsInput = index$r.TagsInput;
+exports.Toast = index$s.Toast;
+exports.ToggleGroup = index$t.ToggleGroup;
+exports.Tooltip = index$u.Tooltip;
 exports.AccordionItem = accordionItem.AccordionItem;
 exports.AccordionItemContent = accordionItemContent.AccordionItemContent;
 exports.AccordionItemIndicator = accordionItemIndicator.AccordionItemIndicator;
@@ -477,6 +488,15 @@ exports.PresenceProvider = presenceContext.PresenceProvider;
 exports.usePresenceContext = presenceContext.usePresenceContext;
 exports.splitPresenceProps = splitPresenceProps.splitPresenceProps;
 exports.usePresence = usePresence.usePresence;
+exports.ProgressCircle = progressCircle.ProgressCircle;
+exports.ProgressCircleRange = progressCircleRange.ProgressCircleRange;
+exports.ProgressCircleTrack = progressCircleTrack.ProgressCircleTrack;
+exports.ProgressIndicator = progressIndicator.ProgressIndicator;
+exports.ProgressLabel = progressLabel.ProgressLabel;
+exports.ProgressRange = progressRange.ProgressRange;
+exports.ProgressTrack = progressTrack.ProgressTrack;
+exports.ProgressValueText = progressValueText.ProgressValueText;
+exports.useProgressContext = progressContext.useProgressContext;
 exports.RadioGroupItem = radioGroupItem.RadioGroupItem;
 exports.RadioGroupItemControl = radioGroupItemControl.RadioGroupItemControl;
 exports.RadioGroupItemText = radioGroupItemText.RadioGroupItemText;

package/index.d.ts

@@ -18,6 +18,7 @@ export * from './pin-input';
 export * from './popover';
 export * from './portal';
 export * from './presence';
+export * from './progress';
 export * from './radio-group';
 export * from './rating-group';
 export * from './segment-group';

package/index.mjs

@@ -18,6 +18,7 @@ export { PinInput } from './pin-input/index.mjs';
 export { Popover } from './popover/index.mjs';
 export { Portal } from './portal.mjs';
 export { Presence } from './presence/index.mjs';
+export { Progress } from './progress/index.mjs';
 export { RadioGroup } from './radio-group/index.mjs';
 export { RatingGroup } from './rating-group/index.mjs';
 export { SegmentGroup } from './segment-group/index.mjs';
@@ -194,6 +195,15 @@ export { PresencePropsProvider, usePresencePropsContext } from './presence/prese
 export { PresenceProvider, usePresenceContext } from './presence/presence-context.mjs';
 export { splitPresenceProps } from './presence/split-presence-props.mjs';
 export { usePresence } from './presence/use-presence.mjs';
+export { ProgressCircle } from './progress/progress-circle.mjs';
+export { ProgressCircleRange } from './progress/progress-circle-range.mjs';
+export { ProgressCircleTrack } from './progress/progress-circle-track.mjs';
+export { ProgressIndicator } from './progress/progress-indicator.mjs';
+export { ProgressLabel } from './progress/progress-label.mjs';
+export { ProgressRange } from './progress/progress-range.mjs';
+export { ProgressTrack } from './progress/progress-track.mjs';
+export { ProgressValueText } from './progress/progress-value-text.mjs';
+export { useProgressContext } from './progress/progress-context.mjs';
 export { RadioGroupItem } from './radio-group/radio-group-item.mjs';
 export { RadioGroupItemControl } from './radio-group/radio-group-item-control.mjs';
 export { RadioGroupItemText } from './radio-group/radio-group-item-text.mjs';

package/menu/index.d.ts

@@ -1,6 +1,7 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
 /// <reference types="react" />
+import type { OpenChangeDetails as MenuOpenChangeDetails, ValueChangeDetails as MenuValueChangeDetails } from '@zag-js/menu';
 import { type MenuProps } from './menu';
 import { MenuArrow, type MenuArrowProps } from './menu-arrow';
 import { MenuArrowTip, type MenuArrowTipProps } from './menu-arrow-tip';
@@ -31,4 +32,4 @@ declare const Menu: ((props: MenuProps) => JSX.Element) & {
     TriggerItem: ForwardRefExoticComponent<MenuTriggerItemProps & RefAttributes<HTMLDivElement>>;
 };
 export { Menu, MenuArrow, MenuArrowTip, MenuContent, MenuContextTrigger, MenuItem, MenuItemGroup, MenuItemGroupLabel, MenuOptionItem, MenuPositioner, MenuSeparator, MenuTrigger, MenuTriggerItem, useMenuContext, };
-export type { MenuArrowProps, MenuArrowTipProps, MenuContentProps, MenuContextTriggerProps, MenuItemGroupLabelProps, MenuItemGroupProps, MenuItemProps, MenuOptionItemProps, MenuPositionerProps, MenuProps, MenuSeparatorProps, MenuTriggerItemProps, MenuTriggerProps, };
+export type { MenuArrowProps, MenuArrowTipProps, MenuContentProps, MenuContextTriggerProps, MenuItemGroupLabelProps, MenuItemGroupProps, MenuItemProps, MenuOpenChangeDetails, MenuOptionItemProps, MenuPositionerProps, MenuProps, MenuSeparatorProps, MenuTriggerItemProps, MenuTriggerProps, MenuValueChangeDetails, };

package/menu/stories/context-menu.stories.d.ts

@@ -0,0 +1,7 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+import { Menu } from '../';
+type MenuType = typeof Menu;
+declare const meta: Meta<MenuType>;
+export default meta;
+export declare const Basic: () => JSX.Element;

package/menu/{menu.stories.d.ts → stories/menu.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { Menu } from './';
+import { Menu } from '../';
 type MenuType = typeof Menu;
 declare const meta: Meta<MenuType>;
 export default meta;
@@ -8,7 +8,4 @@ export declare const Basic: () => JSX.Element;
 export declare const Controlled: () => JSX.Element;
 export declare const Group: () => JSX.Element;
 export declare const Separator: () => JSX.Element;
-export declare const ContextMenu: () => JSX.Element;
-export declare const SubMenu: () => JSX.Element;
 export declare const Options: () => JSX.Element;
-export declare const ComplexSubMenu: () => JSX.Element;

package/menu/stories/nested-menu.stories.d.ts

@@ -0,0 +1,8 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+import { Menu } from '../';
+type MenuType = typeof Menu;
+declare const meta: Meta<MenuType>;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const Advanced: () => JSX.Element;

package/number-input/index.d.ts

@@ -1,5 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
+import type { FocusChangeDetails as NumberInputFocusChangeDetails, ValueChangeDetails as NumberInputValueChangeDetails, ValueInvalidDetails as NumberInputValueInvalidDetails } from '@zag-js/number-input';
 import { type NumberInputProps } from './number-input';
 import { useNumberInputContext, type NumberInputContext } from './number-input-context';
 import { NumberInputControl, type NumberInputControlProps } from './number-input-control';
@@ -18,4 +19,4 @@ declare const NumberInput: ForwardRefExoticComponent<NumberInputProps & RefAttri
     Scrubber: ForwardRefExoticComponent<NumberInputScrubberProps & RefAttributes<HTMLDivElement>>;
 };
 export { NumberInput, NumberInputControl, NumberInputDecrementTrigger, NumberInputIncrementTrigger, NumberInputInput, NumberInputLabel, NumberInputScrubber, useNumberInputContext, };
-export type { NumberInputContext, NumberInputControlProps, NumberInputDecrementTriggerProps, NumberInputIncrementTriggerProps, NumberInputInputProps, NumberInputLabelProps, NumberInputProps, NumberInputScrubberProps, };
+export type { NumberInputContext, NumberInputControlProps, NumberInputDecrementTriggerProps, NumberInputFocusChangeDetails, NumberInputIncrementTriggerProps, NumberInputInputProps, NumberInputLabelProps, NumberInputProps, NumberInputScrubberProps, NumberInputValueChangeDetails, NumberInputValueInvalidDetails, };

package/number-input/{number-input.stories.d.ts → stories/number-input.stories.d.ts}

@@ -1,6 +1,6 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-import { NumberInput } from './';
+import { NumberInput } from '../';
 type NumberInputType = typeof NumberInput.Root;
 declare const meta: Meta<NumberInputType>;
 export default meta;