Skip to content

Releases: chakra-ui/ark

@ark-ui/vue@5.36.0

10 Apr 07:45
6019c78

Choose a tag to compare

@ark-ui/vue

[5.36.0] - 2026-04-10

Added

  • Add new DateInput component for typing dates with keyboard input.

    <DateInput.Root>
      <DateInput.Label>Date</DateInput.Label>
      <DateInput.Control>
        <DateInput.SegmentGroup>
          {segments.map((segment) => (
            <DateInput.Segment segment={segment} />
          ))}
        </DateInput.SegmentGroup>
      </DateInput.Control>
      <DateInput.HiddenInput />
    </DateInput.Root>
  • Added

    • Dialog, Drawer, Hover Card, Menu, Popover, Tooltip: Add support for multiple triggers. A single component
      instance can now be shared across multiple trigger elements. Each trigger is identified by a value passed to
      getTriggerProps. When the component is open and a different trigger is activated, it switches and repositions
      without closing.
    • Splitter: Add multi-drag support for nested splitter layouts. When a horizontal and vertical splitter meet at
      the same point (e.g. a grid layout), users can drag the intersection to resize both directions at once. Create a
      shared registry via createSplitterRegistry() and pass it to each splitter instance.
    • Tags Input: Add sanitizeValue prop to normalize tag values before they are added. This runs on every new tag,
      so you can enforce consistent formatting in one place — strip whitespace, lowercase, remove special characters, etc.
      Defaults to (v) => v.trim().
    • Toast: Add priority-based queue system. When the max number of visible toasts is reached, incoming toasts are
      queued and sorted by priority so the most important ones display first. You can override the automatic priority by
      passing a custom priority value.
    • Floating Panel: Add initialFocusEl, finalFocusEl, and restoreFocus props for focus management when the
      panel opens or closes.

    Fixed

    • Date Input: Fix crash in non-React frameworks (Vue, Solid, Svelte) where event.nativeEvent.isComposing is
      undefined. The composing check now uses a framework-agnostic utility that works across all adapters.
    • Dialog / Drawer: Avoid setting inline pointer-events when modal, letting the dismissable layer manage it
      instead.
    • File Upload: Automatically reject duplicate files with FILE_EXISTS error. Previously, uploading the same file
      twice was silently accepted and deleting one duplicate removed all of them.
    • Splitter: Fix onResizeStart and onResizeEnd callbacks to fire for programmatic resizes.
    • Tags Input: Set enterKeyHint to "done" on the input element so mobile virtual keyboards show a "Done" button
      that triggers tag addition.
    • Toast: Restore role="region" on the toast group element. The role was previously removed to reduce screen
      reader landmark noise, but this caused an axe aria-prohibited-attr violation since aria-label is not permitted
      on a div without a valid role.
    • Tour: Fix step navigation events (next, prev, setStep) firing when the tour is inactive, bypassing the
      start flow. Fix popper styles not being cleaned up when transitioning from a tooltip step to a dialog step.
    • Tree View: Add data-checked and data-indeterminate attributes to item and branch control elements for
      styling based on checked state.
    • Accordion: Fix missing data-focus attribute on getItemTriggerProps.
    • Combobox: Fix VoiceOver not announcing combobox options when navigating with arrow keys. Safari/VoiceOver
      ignores aria-activedescendant changes on combobox inputs, so a live region is now used to announce the highlighted
      item on Apple devices.
    • Menu: Fix issue where quick diagonal pointer movement toward an open submenu could flash the highlight across
      sibling items you skim past.
    • Popper: Fix incorrect positioning when the anchor or floating element changes while the popover is still open
      (e.g. switching between multiple triggers without closing first).
    • Vue: Fix keyboard navigation for nested menus. ArrowRight now correctly opens submenus when using nested
      component patterns.

Fixed

  • Fix keyboard navigation not working in DatePicker month and year views.

[5.35.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.

  • Pin Input: Fixed crash when typing the same character in a completed pin input.

  • Radio Group, Tabs: Fixed indicator only animating on value change, not on initial render or resize.

  • Splitter: Fixed shadow root compatibility.

    • Fixed global cursor styles when splitter is used in a s...
Read more

@ark-ui/svelte@5.21.0

10 Apr 07:45
6019c78

Choose a tag to compare

@ark-ui/svelte

[5.21.0] - 2026-04-10

Added

  • Add new DateInput component for typing dates with keyboard input.

    <DateInput.Root>
      <DateInput.Label>Date</DateInput.Label>
      <DateInput.Control>
        <DateInput.SegmentGroup>
          {segments.map((segment) => (
            <DateInput.Segment segment={segment} />
          ))}
        </DateInput.SegmentGroup>
      </DateInput.Control>
      <DateInput.HiddenInput />
    </DateInput.Root>
  • Added

    • Dialog, Drawer, Hover Card, Menu, Popover, Tooltip: Add support for multiple triggers. A single component
      instance can now be shared across multiple trigger elements. Each trigger is identified by a value passed to
      getTriggerProps. When the component is open and a different trigger is activated, it switches and repositions
      without closing.
    • Splitter: Add multi-drag support for nested splitter layouts. When a horizontal and vertical splitter meet at
      the same point (e.g. a grid layout), users can drag the intersection to resize both directions at once. Create a
      shared registry via createSplitterRegistry() and pass it to each splitter instance.
    • Tags Input: Add sanitizeValue prop to normalize tag values before they are added. This runs on every new tag,
      so you can enforce consistent formatting in one place — strip whitespace, lowercase, remove special characters, etc.
      Defaults to (v) => v.trim().
    • Toast: Add priority-based queue system. When the max number of visible toasts is reached, incoming toasts are
      queued and sorted by priority so the most important ones display first. You can override the automatic priority by
      passing a custom priority value.
    • Floating Panel: Add initialFocusEl, finalFocusEl, and restoreFocus props for focus management when the
      panel opens or closes.

    Fixed

    • Date Input: Fix crash in non-React frameworks (Vue, Solid, Svelte) where event.nativeEvent.isComposing is
      undefined. The composing check now uses a framework-agnostic utility that works across all adapters.
    • Dialog / Drawer: Avoid setting inline pointer-events when modal, letting the dismissable layer manage it
      instead.
    • File Upload: Automatically reject duplicate files with FILE_EXISTS error. Previously, uploading the same file
      twice was silently accepted and deleting one duplicate removed all of them.
    • Splitter: Fix onResizeStart and onResizeEnd callbacks to fire for programmatic resizes.
    • Tags Input: Set enterKeyHint to "done" on the input element so mobile virtual keyboards show a "Done" button
      that triggers tag addition.
    • Toast: Restore role="region" on the toast group element. The role was previously removed to reduce screen
      reader landmark noise, but this caused an axe aria-prohibited-attr violation since aria-label is not permitted
      on a div without a valid role.
    • Tour: Fix step navigation events (next, prev, setStep) firing when the tour is inactive, bypassing the
      start flow. Fix popper styles not being cleaned up when transitioning from a tooltip step to a dialog step.
    • Tree View: Add data-checked and data-indeterminate attributes to item and branch control elements for
      styling based on checked state.
    • Accordion: Fix missing data-focus attribute on getItemTriggerProps.
    • Combobox: Fix VoiceOver not announcing combobox options when navigating with arrow keys. Safari/VoiceOver
      ignores aria-activedescendant changes on combobox inputs, so a live region is now used to announce the highlighted
      item on Apple devices.
    • Menu: Fix issue where quick diagonal pointer movement toward an open submenu could flash the highlight across
      sibling items you skim past.
    • Popper: Fix incorrect positioning when the anchor or floating element changes while the popover is still open
      (e.g. switching between multiple triggers without closing first).
    • Vue: Fix keyboard navigation for nested menus. ArrowRight now correctly opens submenus when using nested
      component patterns.

Fixed

  • Fix lazyMount and unmountOnExit not working for backdrop in Dialog, Drawer, NavigationMenu, Tabs, and Tour
    components.

  • Fix NumberInput and Progress not passing locale from LocaleProvider to the underlying machine.

    • Select, TagsInput, RadioGroup, RatingGroup, Pagination: Fixed issues where unwanted props were forwarded to the
      DOM elements.

[5.20.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.
    ...

Read more

@ark-ui/solid@5.36.0

10 Apr 07:45
6019c78

Choose a tag to compare

@ark-ui/solid

[5.36.0] - 2026-04-10

Added

  • Add new DateInput component for typing dates with keyboard input.

    <DateInput.Root>
      <DateInput.Label>Date</DateInput.Label>
      <DateInput.Control>
        <DateInput.SegmentGroup>
          {segments.map((segment) => (
            <DateInput.Segment segment={segment} />
          ))}
        </DateInput.SegmentGroup>
      </DateInput.Control>
      <DateInput.HiddenInput />
    </DateInput.Root>
  • Added

    • Dialog, Drawer, Hover Card, Menu, Popover, Tooltip: Add support for multiple triggers. A single component
      instance can now be shared across multiple trigger elements. Each trigger is identified by a value passed to
      getTriggerProps. When the component is open and a different trigger is activated, it switches and repositions
      without closing.
    • Splitter: Add multi-drag support for nested splitter layouts. When a horizontal and vertical splitter meet at
      the same point (e.g. a grid layout), users can drag the intersection to resize both directions at once. Create a
      shared registry via createSplitterRegistry() and pass it to each splitter instance.
    • Tags Input: Add sanitizeValue prop to normalize tag values before they are added. This runs on every new tag,
      so you can enforce consistent formatting in one place — strip whitespace, lowercase, remove special characters, etc.
      Defaults to (v) => v.trim().
    • Toast: Add priority-based queue system. When the max number of visible toasts is reached, incoming toasts are
      queued and sorted by priority so the most important ones display first. You can override the automatic priority by
      passing a custom priority value.
    • Floating Panel: Add initialFocusEl, finalFocusEl, and restoreFocus props for focus management when the
      panel opens or closes.

    Fixed

    • Date Input: Fix crash in non-React frameworks (Vue, Solid, Svelte) where event.nativeEvent.isComposing is
      undefined. The composing check now uses a framework-agnostic utility that works across all adapters.
    • Dialog / Drawer: Avoid setting inline pointer-events when modal, letting the dismissable layer manage it
      instead.
    • File Upload: Automatically reject duplicate files with FILE_EXISTS error. Previously, uploading the same file
      twice was silently accepted and deleting one duplicate removed all of them.
    • Splitter: Fix onResizeStart and onResizeEnd callbacks to fire for programmatic resizes.
    • Tags Input: Set enterKeyHint to "done" on the input element so mobile virtual keyboards show a "Done" button
      that triggers tag addition.
    • Toast: Restore role="region" on the toast group element. The role was previously removed to reduce screen
      reader landmark noise, but this caused an axe aria-prohibited-attr violation since aria-label is not permitted
      on a div without a valid role.
    • Tour: Fix step navigation events (next, prev, setStep) firing when the tour is inactive, bypassing the
      start flow. Fix popper styles not being cleaned up when transitioning from a tooltip step to a dialog step.
    • Tree View: Add data-checked and data-indeterminate attributes to item and branch control elements for
      styling based on checked state.
    • Accordion: Fix missing data-focus attribute on getItemTriggerProps.
    • Combobox: Fix VoiceOver not announcing combobox options when navigating with arrow keys. Safari/VoiceOver
      ignores aria-activedescendant changes on combobox inputs, so a live region is now used to announce the highlighted
      item on Apple devices.
    • Menu: Fix issue where quick diagonal pointer movement toward an open submenu could flash the highlight across
      sibling items you skim past.
    • Popper: Fix incorrect positioning when the anchor or floating element changes while the popover is still open
      (e.g. switching between multiple triggers without closing first).
    • Vue: Fix keyboard navigation for nested menus. ArrowRight now correctly opens submenus when using nested
      component patterns.

[5.35.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.

  • Pin Input: Fixed crash when typing the same character in a completed pin input.

  • Radio Group, Tabs: Fixed indicator only animating on value change, not on initial render or resize.

  • Splitter: Fixed shadow root compatibility.

    • Fixed global cursor styles when splitter is used in a shadow root.

[5.34.1] - 2026-03-03

Fixed

  • Carousel:
    • Fixed issu...
Read more

@ark-ui/react@5.36.0

10 Apr 07:45
6019c78

Choose a tag to compare

@ark-ui/react

[5.36.0] - 2026-04-10

Added

  • Add new DateInput component for typing dates with keyboard input.

    <DateInput.Root>
      <DateInput.Label>Date</DateInput.Label>
      <DateInput.Control>
        <DateInput.SegmentGroup>
          {segments.map((segment) => (
            <DateInput.Segment segment={segment} />
          ))}
        </DateInput.SegmentGroup>
      </DateInput.Control>
      <DateInput.HiddenInput />
    </DateInput.Root>
  • Added

    • Dialog, Drawer, Hover Card, Menu, Popover, Tooltip: Add support for multiple triggers. A single component
      instance can now be shared across multiple trigger elements. Each trigger is identified by a value passed to
      getTriggerProps. When the component is open and a different trigger is activated, it switches and repositions
      without closing.
    • Splitter: Add multi-drag support for nested splitter layouts. When a horizontal and vertical splitter meet at
      the same point (e.g. a grid layout), users can drag the intersection to resize both directions at once. Create a
      shared registry via createSplitterRegistry() and pass it to each splitter instance.
    • Tags Input: Add sanitizeValue prop to normalize tag values before they are added. This runs on every new tag,
      so you can enforce consistent formatting in one place — strip whitespace, lowercase, remove special characters, etc.
      Defaults to (v) => v.trim().
    • Toast: Add priority-based queue system. When the max number of visible toasts is reached, incoming toasts are
      queued and sorted by priority so the most important ones display first. You can override the automatic priority by
      passing a custom priority value.
    • Floating Panel: Add initialFocusEl, finalFocusEl, and restoreFocus props for focus management when the
      panel opens or closes.

    Fixed

    • Date Input: Fix crash in non-React frameworks (Vue, Solid, Svelte) where event.nativeEvent.isComposing is
      undefined. The composing check now uses a framework-agnostic utility that works across all adapters.
    • Dialog / Drawer: Avoid setting inline pointer-events when modal, letting the dismissable layer manage it
      instead.
    • File Upload: Automatically reject duplicate files with FILE_EXISTS error. Previously, uploading the same file
      twice was silently accepted and deleting one duplicate removed all of them.
    • Splitter: Fix onResizeStart and onResizeEnd callbacks to fire for programmatic resizes.
    • Tags Input: Set enterKeyHint to "done" on the input element so mobile virtual keyboards show a "Done" button
      that triggers tag addition.
    • Toast: Restore role="region" on the toast group element. The role was previously removed to reduce screen
      reader landmark noise, but this caused an axe aria-prohibited-attr violation since aria-label is not permitted
      on a div without a valid role.
    • Tour: Fix step navigation events (next, prev, setStep) firing when the tour is inactive, bypassing the
      start flow. Fix popper styles not being cleaned up when transitioning from a tooltip step to a dialog step.
    • Tree View: Add data-checked and data-indeterminate attributes to item and branch control elements for
      styling based on checked state.
    • Accordion: Fix missing data-focus attribute on getItemTriggerProps.
    • Combobox: Fix VoiceOver not announcing combobox options when navigating with arrow keys. Safari/VoiceOver
      ignores aria-activedescendant changes on combobox inputs, so a live region is now used to announce the highlighted
      item on Apple devices.
    • Menu: Fix issue where quick diagonal pointer movement toward an open submenu could flash the highlight across
      sibling items you skim past.
    • Popper: Fix incorrect positioning when the anchor or floating element changes while the popover is still open
      (e.g. switching between multiple triggers without closing first).
    • Vue: Fix keyboard navigation for nested menus. ArrowRight now correctly opens submenus when using nested
      component patterns.

[5.35.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.

  • Pin Input: Fixed crash when typing the same character in a completed pin input.

  • Radio Group, Tabs: Fixed indicator only animating on value change, not on initial render or resize.

  • Splitter: Fixed shadow root compatibility.

    • Fixed global cursor styles when splitter is used in a shadow root.

[5.34.1] - 2026-03-03

Fixed

  • Carousel:
    • Fixed issu...
Read more

@ark-ui/vue@5.35.0

26 Mar 13:32
c0fa333

Choose a tag to compare

@ark-ui/vue

[5.35.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.

  • Pin Input: Fixed crash when typing the same character in a completed pin input.

  • Radio Group, Tabs: Fixed indicator only animating on value change, not on initial render or resize.

  • Splitter: Fixed shadow root compatibility.

    • Fixed global cursor styles when splitter is used in a shadow root.

[5.34.1] - 2026-03-03

Fixed

  • Carousel:
    • Fixed issue where carousel inside a Portal (e.g., Dialog) computes incorrect page count due to incomplete DOM layout
      at mount time
    • Keep page and indicators in sync after drag release and scroll settling
    • Handle rapid mixed interactions (drag, wheel, buttons, indicators) more consistently
    • Keep page state valid when slidesPerPage, slidesPerMove, direction, or orientation change
    • Make slidesPerMove progression more predictable
  • Combobox, Listbox, Select: Improved controlled-mode synchronization and callback/item resolution behavior across
    filtered collections

Changed

  • Format: Format.Time now accepts amLabel and pmLabel as separate props instead of the previous amPmLabels
    object

[5.34.0] - 2026-02-27

Added

  • Format: Added Format.Time for formatting time values and examples for basic, date input, seconds, custom AM/PM
    labels, and locale

Fixed

  • Build: Fixed CJS build issues in downstream Zag.js packages

[5.33.0] - 2026-02-26

Added

  • Date Picker: Added non-Gregorian calendar support via createCalendar prop (Persian, Buddhist, Islamic, Hebrew,
    and other calendar systems)

    <script setup>
    import { PersianCalendar } from '@internationalized/date'
    
    function createCalendar(identifier) {
      switch (identifier) {
        case 'persian':
          return new PersianCalendar()
        default:
          throw new Error(`Unsupported calendar: ${identifier}`)
      }
    }
    </script>
    
    <DatePicker.Root locale="fa-IR" :create-calendar="createCalendar">
      <!-- ... -->
    </DatePicker.Root>
  • Date Picker: Added data-type attribute to weekend table header and cell

Fixed

  • Combobox: Fixed onValueChange returning empty items array when using controlled value
  • Popover: Fixed nested popover z-index layering
  • Toast: Fixed types to ensure parent/index are exposed as props and expand/collapse are exposed on the
    store
  • Radio Group, Listbox, Progress, Segment Group: Fixed group labels rendering orphan label elements; now render as
    span per W3C ARIA pattern

[5.32.0] - 2026-02-21

Added

  • Locale: Added useDateFormatter hook for localized date formatting using @internationalized/date
  • Swap: Added new Swap component for toggling between two visual states with CSS animations using dual presence
    instances
  • Checkbox: Added maxSelectedValues prop to CheckboxGroup to limit the number of selected values
  • Drawer: Replaced BottomSheet with new Drawer component supporting multi-directional swipe via swipeDirection
    prop (up, down, left, right), a new Positioner part, and snapToSequentialPoints option
  • Date Picker:
    • Added focus option to api.clearValue({ focus?: boolean })
    • Added api.setTime(time, index?) for date-time picker support
    • Added maxSelectedDates prop to limit selected dates in multiple selection mode
    • Added api.isMaxSelected to check if maximum number of dates has been selected
    • Added openOnClick prop to open the calendar when clicking the input field
    • Added showWeekNumbers support to display ISO 8601 week number column in the day view
  • Popover: Added sizeMiddleware positioning option to optionally disable the size middleware
  • Select: Added autoComplete prop for browser autofill hints

Fixed

  • useForwardExpose: Fixed crash when element bound with forwardRef does not exist (e.g. conditionally rendered
    with v-if)
  • Combobox:
    • Fixed aria-selected being set on highlighted items instead of selected items
    • Fixed selectedItems getting out of sync with value in controlled mode
    • Fixed item disabled state not accounting for root-level disabled prop
  • Date Picker:
    • Fixed api.selectToday() sending incorrect value format
    • Preserve time/timezone when selecting new dates (CalendarDateTime and ZonedDateTime)
    • Improved focus management in trigger-only mode
  • Dialog: Fixed non-modal dialog closing on outside click when modal is false
  • Listbox: Fixed DOM IDs
  • Number Input: Fixed invalid prop being ignored when v...
Read more

@ark-ui/svelte@5.20.0

26 Mar 13:32
c0fa333

Choose a tag to compare

@ark-ui/svelte

[5.20.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.

  • Pin Input: Fixed crash when typing the same character in a completed pin input.

  • Radio Group, Tabs: Fixed indicator only animating on value change, not on initial render or resize.

  • Splitter: Fixed shadow root compatibility.

    • Fixed global cursor styles when splitter is used in a shadow root.

[5.19.1] - 2026-03-03

Fixed

  • Carousel:
    • Fixed issue where carousel inside a Portal (e.g., Dialog) computes incorrect page count due to incomplete DOM layout
      at mount time
    • Keep page and indicators in sync after drag release and scroll settling
    • Handle rapid mixed interactions (drag, wheel, buttons, indicators) more consistently
    • Keep page state valid when slidesPerPage, slidesPerMove, direction, or orientation change
    • Make slidesPerMove progression more predictable
  • Combobox, Listbox, Select: Improved controlled-mode synchronization and callback/item resolution behavior across
    filtered collections

Changed

  • Format: Format.Time now accepts amLabel and pmLabel as separate props instead of the previous amPmLabels
    object

[5.19.0] - 2026-02-27

Added

  • Format: Added Format.Time for formatting time values and examples for basic, date input, seconds, custom AM/PM
    labels, and locale

Fixed

  • Build: Fixed CJS build issues in downstream Zag.js packages
  • Download Trigger: Fixed window resolution to use environment context in custom environments (for example, iframes)

[5.18.0] - 2026-02-26

Added

  • Date Picker: Added non-Gregorian calendar support via createCalendar prop (Persian, Buddhist, Islamic, Hebrew,
    and other calendar systems)

    <script>
      import { PersianCalendar } from '@internationalized/date'
    
      function createCalendar(identifier) {
        switch (identifier) {
          case 'persian':
            return new PersianCalendar()
          default:
            throw new Error(`Unsupported calendar: ${identifier}`)
        }
      }
    </script>
    
    <DatePicker.Root locale="fa-IR" {createCalendar}>
      <!-- ... -->
    </DatePicker.Root>
  • Date Picker: Added data-type attribute to weekend table header and cell

Fixed

  • Combobox: Fixed onValueChange returning empty items array when using controlled value
  • Popover: Fixed nested popover z-index layering
  • Toast: Fixed types to ensure parent/index are exposed as props and expand/collapse are exposed on the
    store
  • Radio Group, Listbox, Progress, Segment Group: Fixed group labels rendering orphan label elements; now render as
    span per W3C ARIA pattern

Added

  • Locale: Added useDateFormatter hook for localized date formatting using @internationalized/date
  • Swap: Added new Swap component for toggling between two visual states with CSS animations using dual presence
    instances
  • Checkbox: Added maxSelectedValues prop to CheckboxGroup to limit the number of selected values
  • Drawer: Replaced BottomSheet with new Drawer component supporting multi-directional swipe via swipeDirection
    prop (up, down, left, right), a new Positioner part, and snapToSequentialPoints option
  • Date Picker:
    • Added focus option to api.clearValue({ focus?: boolean })
    • Added api.setTime(time, index?) for date-time picker support
    • Added maxSelectedDates prop to limit selected dates in multiple selection mode
    • Added api.isMaxSelected to check if maximum number of dates has been selected
    • Added openOnClick prop to open the calendar when clicking the input field
    • Added showWeekNumbers support to display ISO 8601 week number column in the day view
  • Popover: Added sizeMiddleware positioning option to optionally disable the size middleware
  • Select: Added autoComplete prop for browser autofill hints

Fixed

  • Combobox:
    • Fixed aria-selected being set on highlighted items instead of selected items
    • Fixed selectedItems getting out of sync with value in controlled mode
    • Fixed item disabled state not accounting for root-level disabled prop
  • Date Picker:
    • Fixed api.selectToday() sending incorrect value format
    • Preserve time/timezone when selecting new dates (CalendarDateTime and ZonedDateTime)
    • Improved focus management in trigger-only mode
  • Dialog: Fixed non-modal dialog closing on outside click when modal is false
  • Listbox: Fixed DOM IDs
  • Number Input: Fixed invalid prop being ignored when value is out of range
  • Popover: ...
Read more

@ark-ui/solid@5.35.0

26 Mar 13:32
c0fa333

Choose a tag to compare

@ark-ui/solid

[5.35.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.

  • Pin Input: Fixed crash when typing the same character in a completed pin input.

  • Radio Group, Tabs: Fixed indicator only animating on value change, not on initial render or resize.

  • Splitter: Fixed shadow root compatibility.

    • Fixed global cursor styles when splitter is used in a shadow root.

[5.34.1] - 2026-03-03

Fixed

  • Carousel:
    • Fixed issue where carousel inside a Portal (e.g., Dialog) computes incorrect page count due to incomplete DOM layout
      at mount time
    • Keep page and indicators in sync after drag release and scroll settling
    • Handle rapid mixed interactions (drag, wheel, buttons, indicators) more consistently
    • Keep page state valid when slidesPerPage, slidesPerMove, direction, or orientation change
    • Make slidesPerMove progression more predictable
  • Combobox, Listbox, Select: Improved controlled-mode synchronization and callback/item resolution behavior across
    collections
  • Menu: Fixed MenuCheckboxItem to use getOptionItemState for optionItemState context lookup

Changed

  • Format: Format.Time now accepts amLabel and pmLabel as separate props instead of the previous amPmLabels
    object

[5.34.0] - 2026-02-27

Added

  • Format: Added Format.Time for formatting time values and examples for basic, date input, seconds, custom AM/PM
    labels, and locale

Fixed

  • Build: Fixed CJS build issues in downstream Zag.js packages

[5.33.0] - 2026-02-26

Added

  • Date Picker: Added non-Gregorian calendar support via createCalendar prop (Persian, Buddhist, Islamic, Hebrew,
    and other calendar systems)

    import { PersianCalendar } from '@internationalized/date'
    
    function createCalendar(identifier) {
      switch (identifier) {
        case 'persian':
          return new PersianCalendar()
        default:
          throw new Error(`Unsupported calendar: ${identifier}`)
      }
    }
    
    ;<DatePicker.Root locale="fa-IR" createCalendar={createCalendar}>
      {/* ... */}
    </DatePicker.Root>
  • Date Picker: Added data-type attribute to weekend table header and cell

Fixed

  • Combobox: Fixed onValueChange returning empty items array when using controlled value
  • Popover: Fixed nested popover z-index layering
  • Toast: Fixed types to ensure parent/index are exposed as props and expand/collapse are exposed on the
    store
  • Radio Group, Listbox, Progress, Segment Group: Fixed group labels rendering orphan label elements; now render as
    span per W3C ARIA pattern

[5.32.0] - 2026-02-21

Added

  • Locale: Added useDateFormatter hook for localized date formatting using @internationalized/date
  • Swap: Added new Swap component for toggling between two visual states with CSS animations using dual presence
    instances
  • Checkbox: Added maxSelectedValues prop to CheckboxGroup to limit the number of selected values
  • Drawer: Replaced BottomSheet with new Drawer component supporting multi-directional swipe via swipeDirection
    prop (up, down, left, right), a new Positioner part, and snapToSequentialPoints option
  • Date Picker:
    • Added focus option to api.clearValue({ focus?: boolean })
    • Added api.setTime(time, index?) for date-time picker support
    • Added maxSelectedDates prop to limit selected dates in multiple selection mode
    • Added api.isMaxSelected to check if maximum number of dates has been selected
    • Added openOnClick prop to open the calendar when clicking the input field
    • Added showWeekNumbers support to display ISO 8601 week number column in the day view
  • Popover: Added sizeMiddleware positioning option to optionally disable the size middleware
  • Select: Added autoComplete prop for browser autofill hints

Fixed

  • Combobox:
    • Fixed aria-selected being set on highlighted items instead of selected items
    • Fixed selectedItems getting out of sync with value in controlled mode
    • Fixed item disabled state not accounting for root-level disabled prop
  • Date Picker:
    • Fixed api.selectToday() sending incorrect value format
    • Preserve time/timezone when selecting new dates (CalendarDateTime and ZonedDateTime)
    • Improved focus management in trigger-only mode
  • Dialog: Fixed non-modal dialog closing on outside click when modal is false
  • Listbox: Fixed DOM IDs
  • Number Input: Fixed invalid prop being ignored when value is out of range
  • Popover: Improved performance by reducing sty...
Read more

@ark-ui/react@5.35.0

26 Mar 13:32
c0fa333

Choose a tag to compare

@ark-ui/react

[5.35.0] - 2026-03-26

Added

  • Date Picker: Improved range picker mode with new data attributes and state properties.

    • Added missing range data attributes (data-range-start, data-range-end, data-in-hover-range,
      data-hover-range-start, data-hover-range-end) to month and year cell triggers.
    • TableCellState now includes firstInRange, lastInRange, inHoveredRange, firstInHoveredRange,
      lastInHoveredRange, and outsideRange.
    • Range boundary dates now announce "Starting range from {date}" and "Range ending at {date}" for better screen reader
      context.
    • Fixed inverted year cell selectable state that caused years outside the visible decade or min/max range to appear
      selectable.
    • Breaking: DayTableCellState.formattedDate removed — use valueText instead (inherited from TableCellState).
  • Drawer: Added new anatomy parts and improved swipe gestures.

    • Added description anatomy part with aria-describedby support on the content element.
    • Added SwipeArea part for swipe-to-open gestures from screen edges.
    • Require intentional swipe movement before showing the drawer (no flash on pointer down).
    • Smooth settle animation from release point to fully open position.
    • Added cross-axis scroll preservation to prevent drawer drag when scrolling horizontally.
    • Added initial focus management for non-modal mode.
    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Fixed swipe-to-dismiss in controlled mode (open: true without onOpenChange now blocks dismiss).
  • Field: Added Field.Item component and target prop on Field.Root for multi-control fields (e.g., currency
    select + amount input). Use Field.Item with a value to scope controls, and target to specify which item the
    label should focus when clicked.

  • Interaction: Added useInteractionModality and useFocusVisible hooks for tracking user input method (keyboard,
    pointer, virtual) and conditionally showing focus rings.

  • Listbox: Added keyboardPriority to input props to control whether key handling prioritizes text editing or list
    navigation for Home/End and horizontal arrows in grid collections. Added highlightFirst, highlightLast,
    highlightNext, and highlightPrevious to the API for programmatic highlight navigation.

  • Pin Input: Overhauled deletion, focus management, and added new props.

    • Delete and Backspace now splice values left instead of leaving empty gaps. Deleting "2" from [1, 2, 3] yields
      [1, 3, ""] — not [1, "", 3].
    • Smarter focus management: Backspace always moves back, click and ArrowRight are clamped to the insertion point,
      same-key skip advances focus, and roving tabIndex treats the entire pin input as a single tab stop.
    • Added Home/End to jump to first slot or last filled slot.
    • Added enterKeyHint showing "next" on intermediate slots and "done" on the last.
    • Added autoSubmit prop to automatically submit the owning form when all inputs are filled.
    • Added sanitizeValue prop to sanitize pasted values before validation (e.g. strip dashes from "1-2-3").
  • Tags Input: Added allowDuplicates prop to allow duplicate tags.

  • Clipboard, Navigation Menu, Popover, Select, Timer, Tree View: Added translations prop for localizing hardcoded
    accessibility labels.

Fixed

  • Carousel: Fixed controlled carousel inside dialog jumping or skipping pages. Fixed navigation inside
    CSS-transformed containers (e.g., dialogs with open/close animations). Fixed scroll position drifting when container
    layout shifts (e.g., scrollbar removal).

  • Color Picker: Fixed vertical slider orientation not preserved on pointer updates.

  • Date Input: Improved focus management.

  • Dialog: Improved non-modal mode behavior.

    • Set pointer-events: none on positioner in non-modal mode so the page stays interactive.
    • Added initial focus management for non-modal mode (mirrors popover behavior).
    • Fixed aria-modal to reflect actual modal prop value instead of hardcoded true.
  • Floating Panel: Fixed open taking precedence over defaultOpen during initialization. Fixed setPosition and
    setSize to work independently of drag/resize state. Fixed maximize/minimize restore reverting to (0, 0) in
    controlled mode. Fixed Maximum update depth exceeded when content uses ResizeObserver (React). Fixed Escape during
    drag/resize to cancel and revert to original position/size.

  • Focus Trap: Fixed edge cases in focus trapping.

    • Fixed focus trapping when the content has a single effective tab stop, such as a native radio group.
    • Handle disconnected initialFocus nodes more safely.
  • Interact Outside: Fixed Safari-specific interaction issue.

    • Fixed issue where nested popovers and select within popovers didn't toggle correctly in Safari due to focusin
      events racing with pointer interactions.
  • Menu: Fixed trigger to keep aria-expanded="false" when closed.

  • Pin Input: Fixed crash when typing the same character in a completed pin input.

  • Radio Group, Tabs: Fixed indicator only animating on value change, not on initial render or resize.

  • Splitter: Fixed shadow root compatibility.

    • Fixed global cursor styles when splitter is used in a shadow root.

[5.34.1] - 2026-03-03

Fixed

  • Carousel:
    • Fixed issue where carousel inside a Portal (e.g., Dialog) computes incorrect page count due to incomplete DOM layout
      at mount time
    • Keep page and indicators in sync after drag release and scroll settling
    • Handle rapid mixed interactions (drag, wheel, buttons, indicators) more consistently
    • Keep page state valid when slidesPerPage, slidesPerMove, direction, or orientation change
    • Make slidesPerMove progression more predictable
  • Combobox, Listbox, Select: Improved controlled-mode synchronization and callback/item resolution behavior across
    filtered collections

Changed

  • Format: Format.Time now accepts amLabel and pmLabel as separate props instead of the previous amPmLabels
    object

[5.34.0] - 2026-02-27

Added

  • Format: Added Format.Time for formatting time values and examples for basic, date input, seconds, custom AM/PM
    labels, and locale

Fixed

  • Build: Fixed CJS build issues in downstream Zag.js packages

[5.33.0] - 2026-02-26

Added

  • Date Picker: Added non-Gregorian calendar support via createCalendar prop (Persian, Buddhist, Islamic, Hebrew,
    and other calendar systems)

    import { PersianCalendar } from '@internationalized/date'
    
    function createCalendar(identifier) {
      switch (identifier) {
        case 'persian':
          return new PersianCalendar()
        default:
          throw new Error(`Unsupported calendar: ${identifier}`)
      }
    }
    
    ;<DatePicker.Root locale="fa-IR" createCalendar={createCalendar}>
      {/* ... */}
    </DatePicker.Root>
  • Date Picker: Added data-type attribute to weekend table header and cell

Fixed

  • Combobox: Fixed onValueChange returning empty items array when using controlled value
  • Popover: Fixed nested popover z-index layering
  • Toast: Fixed types to ensure parent/index are exposed as props and expand/collapse are exposed on the
    store
  • Radio Group, Listbox, Progress, Segment Group: Fixed group labels rendering orphan label elements; now render as
    span per W3C ARIA pattern

[5.32.0] - 2026-02-21

Added

  • Locale: Added useDateFormatter hook for localized date formatting using @internationalized/date
  • Swap: Added new Swap component for toggling between two visual states with CSS animations using dual presence
    instances
  • Checkbox: Added maxSelectedValues prop to CheckboxGroup to limit the number of selected values
  • Drawer: Replaced BottomSheet with new Drawer component supporting multi-directional swipe via swipeDirection
    prop (up, down, left, right), a new Positioner part, and snapToSequentialPoints option
  • Date Picker:
    • Added focus option to api.clearValue({ focus?: boolean })
    • Added api.setTime(time, index?) for date-time picker support
    • Added maxSelectedDates prop to limit selected dates in multiple selection mode
    • Added api.isMaxSelected to check if maximum number of dates has been selected
    • Added openOnClick prop to open the calendar when clicking the input field
    • Added showWeekNumbers support to display ISO 8601 week number column in the day view
  • Popover: Added sizeMiddleware positioning option to optionally disable the size middleware
  • Select: Added autoComplete prop for browser autofill hints

Fixed

  • Combobox:
    • Fixed aria-selected being set on highlighted items instead of selected items
    • Fixed selectedItems getting out of sync with value in controlled mode
    • Fixed item disabled state not accounting for root-level disabled prop
  • Date Picker:
    • Fixed api.selectToday() sending incorrect value format
    • Preserve time/timezone when selecting new dates (CalendarDateTime and ZonedDateTime)
    • Improved focus management in trigger-only mode
  • Dialog: Fixed non-modal dialog closing on outside click when modal is false
  • Listbox: Fixed DOM IDs
  • Number Input: Fixed invalid prop being ignored when value is out of range
  • Popover: Improved performance by reducing style recalculations when scrolling
  • Select: Fixed autofill not updating value when hidden ...
Read more

@ark-ui/mcp@1.2.1

26 Mar 13:32
c0fa333

Choose a tag to compare

@ark-ui/mcp

[1.2.1] - 2026-03-26

Fixed

  • Fixed MCP server startup error in Google Antigravity and other MCP clients by using console.error instead of
    console.info for startup messages, preventing stdout pollution of the MCP protocol.

[1.2.0] - 2025-09-04

Added

  • Added get_component_props tool to retrieve component props/properties for specific Ark UI components

[1.1.2] - 2025-09-03

Fixed

Add missing node shebang to the stdio script.

[1.1.1] - 2025-09-01

Fixed

Don't ship the src directory to the package.

[1.1.0] - 2025-09-01

Added

  • Initial release of the official MCP server for Ark UI

@ark-ui/vue@5.34.1

03 Mar 13:10

Choose a tag to compare

Fixed

  • Carousel:
    • Fixed issue where carousel inside a Portal (e.g., Dialog) computes incorrect page count due to incomplete DOM layout
      at mount time
    • Keep page and indicators in sync after drag release and scroll settling
    • Handle rapid mixed interactions (drag, wheel, buttons, indicators) more consistently
    • Keep page state valid when slidesPerPage, slidesPerMove, direction, or orientation change
    • Make slidesPerMove progression more predictable
  • Combobox, Listbox, Select: Improved controlled-mode synchronization and callback/item resolution behavior across
    filtered collections

Changed

  • Format: Format.Time now accepts amLabel and pmLabel as separate props instead of the previous amPmLabels
    object