chakra-ui/zag @zag-js/dialog@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.

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.
• Updated dependencies [d6089c3,
  a87b07c,
  cb8e73d,
  a80b307,
  cbd4387,
  4f28f36,
  08ea850]:
  • @zag-js/aria-hidden@2.0.0-next.4
  • @zag-js/dismissable@2.0.0-next.4
  • @zag-js/dom-query@2.0.0-next.4
  • @zag-js/remove-scroll@2.0.0-next.4
  • @zag-js/core@2.0.0-next.4
  • @zag-js/focus-trap@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