chakra-ui/zag @zag-js/cascade-select@2.0.0-next.4 on GitHub

Major Changes

#3342
08ea850 Thanks
@github-actions! - Zag no longer sets a z-index on overlays. Set it in
CSS, using --layer-index for the overlay's place in the stack.
- Fix a z-index set on the positioner in CSS being overridden.
- Fix overlays dropping behind other layers while they animate out. --layer-index stays set after close.
Breaking: Move the z-index to the positioner (or the backdrop) and add --layer-index.
```
- [data-popover-content] {
+ [data-popover-positioner] {
-   z-index: 1400;
+   z-index: calc(1400 + var(--layer-index));
  }
```
- Popover, menu, select, combobox, hover card, tooltip, date picker, color picker and cascade select no longer copy
  the content's z-index onto the positioner or set --z-index.
- Dialog and drawer no longer set --z-index. Use --layer-index on the backdrop and positioner.
- The floating panel no longer sets a z-index. Style the positioner as above to bring the focused panel to the
  front.
- The tour no longer copies the content's z-index onto dialog steps. Style the positioner with --tour-layer.
- The toast group no longer sets an inline z-index. Set it on [data-toast-group] in CSS.
- Remove the zIndex and zIndexFallback options from getDismissableLayerStyle.
#3342
12f18ab Thanks
@github-actions! - - Add a filter input and an empty state to menu and
select with popupType: "dialog". You filter the items; the input keeps focus while the arrow keys move the
highlight.
```
<div {...api.getContentProps()}>
  <input {...api.getInputProps()} />
  <div {...api.getEmptyProps()}>{items.length === 0 && "No results"}</div>
  <div {...api.getListProps()}>{/* items */}</div>
</div>
```
- Add getEmptyProps() to combobox and listbox. It's a polite live region, so keep it rendered and toggle its text.
- Fix a lazily mounted popup inside nested dialogs rendering behind the dialog.
Breaking: Set the highlight with setHighlightedValue in every list component, and pass null to clear it.
```
- api.setHighlightValue("react") // select, combobox, cascade select
- api.highlightValue("react") // listbox
+ api.setHighlightedValue("react")

- api.clearHighlightValue()
+ api.setHighlightedValue(null)
```
Breaking (menu): Replace composite with popupType, matching select and combobox.
```
- menu.machine({ composite: false })
+ menu.machine({ popupType: "dialog" })
```
- Menu: Add autoHighlight to highlight the first item as the query changes. A submenu can have its own input;
  Escape, Shift+Tab or ArrowLeft on an empty input returns to the parent's. onHighlightChange reports a
  reason.
- Select: Home and End jump to the first or last item when the input is empty, and alignItemWithTrigger
  keeps the selected item of a long list next to the trigger.

Minor Changes

#3342
4f28f36 Thanks
@github-actions! - - Add reason to onOpenChange details, such as
trigger-click, escape-key, interact-outside, item-select or script. Each component exports its
OpenChangeReason type.
- Add an optional reason to api.setOpen(open, reason), defaulting to script.

Patch Changes

#3342
730ea29 Thanks
@github-actions! - - Fix focus, scroll and sync work scheduled for the next
frame running after the component unmounts.
#3634
772248d Thanks
@anubra266! - Fix the selected and highlighted state getting out of sync with value
and highlightedValue.
- The trigger now shows valueAsString for a defaultValue, a controlled value, and a controlled value changed
  from outside.
- When a controlled value rejects a selection, the trigger keeps showing the controlled value instead of the
  rejected one.
- A controlled highlightedValue now opens the matching nested lists.
- Opening the menu now scrolls every list to its part of the highlighted path, not only the last list.
Updated dependencies [d6089c3,
a87b07c,
cb8e73d,
a80b307,
4f28f36,
08ea850]:
- @zag-js/collection@2.0.0-next.4
- @zag-js/dismissable@2.0.0-next.4
- @zag-js/dom-query@2.0.0-next.4
- @zag-js/popper@2.0.0-next.4
- @zag-js/core@2.0.0-next.4
- @zag-js/focus-visible@2.0.0-next.4
- @zag-js/anatomy@2.0.0-next.4
- @zag-js/types@2.0.0-next.4
- @zag-js/utils@2.0.0-next.4
- @zag-js/rect-utils@2.0.0-next.4