@jobber/components 8.27.0 → 8.27.2-upgrade-ax-69e6080.0

package/dist/BottomSheet-cjs.js

@@ -7,7 +7,7 @@ var buttonRenderAdapter = require('./buttonRenderAdapter-cjs.js');
 var Button = require('./Button-cjs.js');
 var ScrollAreaViewport = require('./ScrollAreaViewport-cjs.js');
 
-var styles = {"backdrop":"Qf3IFhKJwQ0-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
+var styles = {"backdrop":"Qf3IFhKJwQ0-","viewport":"U069n8h0urk-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
 
 // `resolveBottomSheetTriggerRender` so an Atlantis `<Button>` works as a trigger
 // via `children` or `render`. Raw text children are wrapped in a default Button.
@@ -64,11 +64,12 @@ function BottomSheetPopup(_a) {
     const renderScrollArea = React.useContext(BottomSheetScrollAreaContext);
     return (React.createElement(ScrollAreaViewport.DrawerPortal, null,
         React.createElement(ScrollAreaViewport.DrawerBackdrop, { forceRender: true, className: styles.backdrop, "data-testid": "ATL-BottomSheet-Backdrop" }),
-        React.createElement(ScrollAreaViewport.DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
-        // The consumer manages its own scroll region (e.g. Dialog pins a
-        // header/footer outside a single scroll area) — often by composing
-        // `BottomSheet.ScrollArea` itself.
-        children) : (React.createElement(BottomSheetScrollArea, null, children)))));
+        React.createElement(ScrollAreaViewport.DrawerViewport, { className: styles.viewport, "data-testid": "ATL-BottomSheet-Viewport" },
+            React.createElement(ScrollAreaViewport.DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
+            // The consumer manages its own scroll region (e.g. Dialog pins a
+            // header/footer outside a single scroll area) — often by composing
+            // `BottomSheet.ScrollArea` itself.
+            children) : (React.createElement(BottomSheetScrollArea, null, children))))));
 }
 /**
  * The sheet's scroll region: a styled BaseUI `ScrollArea` (native scrollbar) with
@@ -78,7 +79,7 @@ function BottomSheetPopup(_a) {
  * directly.
  */
 function BottomSheetScrollArea({ children, className, style, }) {
-    return (React.createElement(ScrollAreaViewport.ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style },
+    return (React.createElement(ScrollAreaViewport.ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style, "data-testid": "ATL-BottomSheet-ScrollRegion" },
         React.createElement(ScrollAreaViewport.ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea", 
             // BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
             style: { overflow: "auto" } }, children),

package/dist/BottomSheet-es.js

@@ -3,9 +3,9 @@ import React__default from 'react';
 import classnames from 'classnames';
 import { n as normalizeBaseUiButtonProps, i as isAtlantisButtonRenderTarget, s as stripNativeTypeFromButtonRenderTarget, r as renderAtlantisButtonTarget } from './buttonRenderAdapter-es.js';
 import { B as Button } from './Button-es.js';
-import { D as DrawerTrigger, a as DrawerRoot, b as DrawerPortal, c as DrawerBackdrop, d as DrawerPopup, S as ScrollAreaRoot, e as ScrollAreaViewport, f as DrawerContent } from './ScrollAreaViewport-es.js';
+import { D as DrawerTrigger, a as DrawerRoot, b as DrawerPortal, c as DrawerBackdrop, d as DrawerViewport, e as DrawerPopup, S as ScrollAreaRoot, f as ScrollAreaViewport, g as DrawerContent } from './ScrollAreaViewport-es.js';
 
-var styles = {"backdrop":"Qf3IFhKJwQ0-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
+var styles = {"backdrop":"Qf3IFhKJwQ0-","viewport":"U069n8h0urk-","popup":"_868PDAA3U2M-","content":"eKuxReHyju8-","scrollRoot":"V--tRnN-P0I-","scrollArea":"_1I0eaFciaWo-","bottomFade":"BYEzqcZUGls-","spinning":"IJxq5fm5qdw-"};
 
 // `resolveBottomSheetTriggerRender` so an Atlantis `<Button>` works as a trigger
 // via `children` or `render`. Raw text children are wrapped in a default Button.
@@ -62,11 +62,12 @@ function BottomSheetPopup(_a) {
     const renderScrollArea = React__default.useContext(BottomSheetScrollAreaContext);
     return (React__default.createElement(DrawerPortal, null,
         React__default.createElement(DrawerBackdrop, { forceRender: true, className: styles.backdrop, "data-testid": "ATL-BottomSheet-Backdrop" }),
-        React__default.createElement(DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
-        // The consumer manages its own scroll region (e.g. Dialog pins a
-        // header/footer outside a single scroll area) — often by composing
-        // `BottomSheet.ScrollArea` itself.
-        children) : (React__default.createElement(BottomSheetScrollArea, null, children)))));
+        React__default.createElement(DrawerViewport, { className: styles.viewport, "data-testid": "ATL-BottomSheet-Viewport" },
+            React__default.createElement(DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
+            // The consumer manages its own scroll region (e.g. Dialog pins a
+            // header/footer outside a single scroll area) — often by composing
+            // `BottomSheet.ScrollArea` itself.
+            children) : (React__default.createElement(BottomSheetScrollArea, null, children))))));
 }
 /**
  * The sheet's scroll region: a styled BaseUI `ScrollArea` (native scrollbar) with
@@ -76,7 +77,7 @@ function BottomSheetPopup(_a) {
  * directly.
  */
 function BottomSheetScrollArea({ children, className, style, }) {
-    return (React__default.createElement(ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style },
+    return (React__default.createElement(ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style, "data-testid": "ATL-BottomSheet-ScrollRegion" },
         React__default.createElement(ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea", 
             // BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
             style: { overflow: "auto" } }, children),

package/dist/ComboboxChipRemove-es.js

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { z as useControlled, b as useStableCallback, m as useValueAsRef, k as useTransitionStatus, a as useIsoLayoutEffect, J as createGenericEventDetails, G as inputClear, F as inputChange, d as createChangeEventDetails, v as focusOut, Q as outsidePress, g as getTarget, V as itemPress, f as useOpenChangeComplete, O as useValueChanged, C as none, a5 as inputPress, q as contains, D as visuallyHiddenInput, E as visuallyHidden, h as useTimeout, c as useButton, o as ownerDocument, s as stopEvent, r as listNavigation, e as closePress, u as useBaseUiId, W as android, a0 as escapeKey, a6 as clearPress, t as transitionStatusMapping, A as ios, S as SafeReact, j as error, a7 as chipRemovePress } from './useButton-es.js';
+import { z as useControlled, b as useStableCallback, m as useValueAsRef, k as useTransitionStatus, a as useIsoLayoutEffect, J as createGenericEventDetails, G as inputClear, F as inputChange, d as createChangeEventDetails, v as focusOut, Q as outsidePress, g as getTarget, V as itemPress, f as useOpenChangeComplete, O as useValueChanged, C as none, a7 as inputPress, q as contains, D as visuallyHiddenInput, E as visuallyHidden, h as useTimeout, c as useButton, o as ownerDocument, s as stopEvent, r as listNavigation, e as closePress, u as useBaseUiId, a3 as android, _ as escapeKey, a8 as clearPress, t as transitionStatusMapping, A as ios, S as SafeReact, j as error, a9 as chipRemovePress } from './useButton-es.js';
 import { f as formatErrorMessage, b as EMPTY_ARRAY, a as useRefWithInit, E as EMPTY_OBJECT, N as NOOP, m as mergeProps, c as useMergedRefs, u as useRenderElement } from './useRenderElement-es.js';
 import { a as useFormContext, b as useFieldRootContext, c as useLabelableId, d as useRegisterFieldControl, f as fieldValidityMapping, u as useLabelableContext, F as FieldRootContext, e as DEFAULT_FIELD_ROOT_CONTEXT, g as DEFAULT_FIELD_STATE_ATTRIBUTES } from './useLabelableId-es.js';
 import { u as useFloatingRootContext, a as useListNavigation, b as useTypeahead, g as getPseudoElementBounds, C as CompositeList, d as useAnchorPositioning, c as useAnchoredPopupScrollLock, e as usePositioner, f as getDisabledMountTransitionStyles, h as useCompositeListItem, I as IndexGuessBehavior } from './useCompositeListItem-es.js';
 import { h as hasNullItemLabel, c as compareItemEquality, a as stringifyAsLabel, k as isGroupedItems, s as stringifyAsValue, i as selectedValueIncludes, j as removeItem, f as findItemIndex, d as defaultItemEquality, b as areArraysEqual, r as resolveAriaLabelledBy, l as getDefaultLabelId, e as resolveMultipleLabels, g as resolveSelectedLabel } from './resolveAriaLabelledBy-es.js';
-import { ak as getGridNavigatedIndex, e as isIndexOutOfListBounds, t as createSelector, r as useDirection, S as Store, w as useStore, v as useOpenInteractionType, x as useClick, y as useDismiss, F as FOCUSABLE_POPUP_PROPS, z as useOnFirstRender, B as pressableTriggerOpenStateMapping, al as gecko, a0 as isInteractiveElement, W as triggerOpenStateMapping, E as FloatingPortal, p as popupStateMapping, I as InternalBackdrop, G as inertValue, H as DROPDOWN_COLLISION_AVOIDANCE, a as FloatingFocusManager } from './useScrollLock-es.js';
+import { al as getGridNavigatedIndex, e as isIndexOutOfListBounds, t as createSelector, r as useDirection, S as Store, w as useStore, v as useOpenInteractionType, x as useClick, y as useDismiss, F as FOCUSABLE_POPUP_PROPS, z as useOnFirstRender, B as pressableTriggerOpenStateMapping, am as gecko, Q as isInteractiveElement, af as triggerOpenStateMapping, E as FloatingPortal, p as popupStateMapping, I as InternalBackdrop, G as inertValue, H as DROPDOWN_COLLISION_AVOIDANCE, a as FloatingFocusManager } from './useScrollLock-es.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import * as ReactDOM from 'react-dom';
 import { s as stringifyLocale } from './stringifyLocale-es.js';

package/dist/DrawerDescription-cjs.js

@@ -27,7 +27,7 @@ function _interopNamespaceDefault(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
-const stateAttributesMapping$2 = {
+const stateAttributesMapping$1 = {
   ...useScrollLock.popupStateMapping,
   ...useButton.transitionStatusMapping
 };
@@ -60,7 +60,7 @@ const DialogBackdrop = /*#__PURE__*/React__namespace.forwardRef(function DialogB
   return useRenderElement.useRenderElement('div', componentProps, {
     state,
     ref: [store.context.backdropRef, forwardedRef],
-    stateAttributesMapping: stateAttributesMapping$2,
+    stateAttributesMapping: stateAttributesMapping$1,
     props: [{
       role: 'presentation',
       hidden: !mounted,
@@ -139,7 +139,7 @@ let DialogPopupDataAttributes = function (DialogPopupDataAttributes) {
   return DialogPopupDataAttributes;
 }({});
 
-const stateAttributesMapping$1 = {
+const stateAttributesMapping = {
   ...useScrollLock.popupStateMapping,
   ...useButton.transitionStatusMapping,
   nestedDialogOpen(value) {
@@ -220,7 +220,7 @@ const DialogPopup = /*#__PURE__*/React__namespace.forwardRef(function DialogPopu
       }
     }, elementProps],
     ref: [forwardedRef, store.context.popupRef, setPopupElement],
-    stateAttributesMapping: stateAttributesMapping$1
+    stateAttributesMapping
   });
   return /*#__PURE__*/jsxRuntime.jsx(useScrollLock.FloatingFocusManager, {
     context: floatingRootContext,
@@ -236,98 +236,6 @@ const DialogPopup = /*#__PURE__*/React__namespace.forwardRef(function DialogPopu
 });
 if (process.env.NODE_ENV !== "production") DialogPopup.displayName = "DialogPopup";
 
-let DialogViewportDataAttributes = function (DialogViewportDataAttributes) {
-  /**
-   * Present when the dialog is open.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["open"] = useScrollLock.CommonPopupDataAttributes.open] = "open";
-  /**
-   * Present when the dialog is closed.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["closed"] = useScrollLock.CommonPopupDataAttributes.closed] = "closed";
-  /**
-   * Present when the dialog is animating in.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["startingStyle"] = useScrollLock.CommonPopupDataAttributes.startingStyle] = "startingStyle";
-  /**
-   * Present when the dialog is animating out.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["endingStyle"] = useScrollLock.CommonPopupDataAttributes.endingStyle] = "endingStyle";
-  /**
-   * Present when the dialog is nested within another dialog.
-   */
-  DialogViewportDataAttributes["nested"] = "data-nested";
-  /**
-   * Present when the dialog has other open dialogs nested within it.
-   */
-  DialogViewportDataAttributes["nestedDialogOpen"] = "data-nested-dialog-open";
-  return DialogViewportDataAttributes;
-}({});
-
-const stateAttributesMapping = {
-  ...useScrollLock.popupStateMapping,
-  ...useButton.transitionStatusMapping,
-  nested(value) {
-    return value ? {
-      [DialogViewportDataAttributes.nested]: ''
-    } : null;
-  },
-  nestedDialogOpen(value) {
-    return value ? {
-      [DialogViewportDataAttributes.nestedDialogOpen]: ''
-    } : null;
-  }
-};
-
-/**
- * A positioning container for the dialog popup that can be made scrollable.
- * Renders a `<div>` element.
- *
- * Documentation: [Base UI Dialog](https://base-ui.com/react/components/dialog)
- */
-const DialogViewport = /*#__PURE__*/React__namespace.forwardRef(function DialogViewport(componentProps, forwardedRef) {
-  const {
-    render,
-    className,
-    style,
-    children,
-    ...elementProps
-  } = componentProps;
-  const keepMounted = ScrollAreaViewport.useDialogPortalContext();
-  const {
-    store
-  } = ScrollAreaViewport.useDialogRootContext();
-  const open = store.useState('open');
-  const nested = store.useState('nested');
-  const transitionStatus = store.useState('transitionStatus');
-  const nestedOpenDialogCount = store.useState('nestedOpenDialogCount');
-  const mounted = store.useState('mounted');
-  const setViewportElement = store.useStateSetter('viewportElement');
-  const nestedDialogOpen = nestedOpenDialogCount > 0;
-  const state = {
-    open,
-    nested,
-    transitionStatus,
-    nestedDialogOpen
-  };
-  const shouldRender = keepMounted || mounted;
-  return useRenderElement.useRenderElement('div', componentProps, {
-    enabled: shouldRender,
-    state,
-    ref: [forwardedRef, setViewportElement],
-    stateAttributesMapping,
-    props: [{
-      role: 'presentation',
-      hidden: !mounted,
-      style: {
-        pointerEvents: !open ? 'none' : undefined
-      },
-      children
-    }, elementProps]
-  });
-});
-if (process.env.NODE_ENV !== "production") DialogViewport.displayName = "DialogViewport";
-
 /**
  * A handle to control a Dialog imperatively and to associate detached triggers with it.
  */
@@ -404,6 +312,5 @@ exports.DialogBackdrop = DialogBackdrop;
 exports.DialogDescription = DialogDescription;
 exports.DialogHandle = DialogHandle;
 exports.DialogPopup = DialogPopup;
-exports.DialogViewport = DialogViewport;
 exports.DrawerDescription = DrawerDescription;
 exports.createDialogHandle = createDialogHandle;

package/dist/DrawerDescription-es.js

@@ -1,12 +1,12 @@
 import * as React from 'react';
-import { u as useDialogRootContext, j as useDialogPortalContext, k as DialogStore } from './ScrollAreaViewport-es.js';
+import { u as useDialogRootContext, h as useDialogPortalContext, i as DialogStore } from './ScrollAreaViewport-es.js';
 import { u as useRenderElement } from './useRenderElement-es.js';
 import { p as popupStateMapping, C as CommonPopupDataAttributes, c as createDefaultInitialFocus, F as FOCUSABLE_POPUP_PROPS, a as FloatingFocusManager } from './useScrollLock-es.js';
 import { t as transitionStatusMapping, u as useBaseUiId, f as useOpenChangeComplete, d as createChangeEventDetails, i as imperativeAction } from './useButton-es.js';
 import { C as COMPOSITE_KEYS } from './scrollEdges-es.js';
 import { jsx } from 'react/jsx-runtime';
 
-const stateAttributesMapping$2 = {
+const stateAttributesMapping$1 = {
   ...popupStateMapping,
   ...transitionStatusMapping
 };
@@ -39,7 +39,7 @@ const DialogBackdrop = /*#__PURE__*/React.forwardRef(function DialogBackdrop(com
   return useRenderElement('div', componentProps, {
     state,
     ref: [store.context.backdropRef, forwardedRef],
-    stateAttributesMapping: stateAttributesMapping$2,
+    stateAttributesMapping: stateAttributesMapping$1,
     props: [{
       role: 'presentation',
       hidden: !mounted,
@@ -118,7 +118,7 @@ let DialogPopupDataAttributes = function (DialogPopupDataAttributes) {
   return DialogPopupDataAttributes;
 }({});
 
-const stateAttributesMapping$1 = {
+const stateAttributesMapping = {
   ...popupStateMapping,
   ...transitionStatusMapping,
   nestedDialogOpen(value) {
@@ -199,7 +199,7 @@ const DialogPopup = /*#__PURE__*/React.forwardRef(function DialogPopup(component
       }
     }, elementProps],
     ref: [forwardedRef, store.context.popupRef, setPopupElement],
-    stateAttributesMapping: stateAttributesMapping$1
+    stateAttributesMapping
   });
   return /*#__PURE__*/jsx(FloatingFocusManager, {
     context: floatingRootContext,
@@ -215,98 +215,6 @@ const DialogPopup = /*#__PURE__*/React.forwardRef(function DialogPopup(component
 });
 if (process.env.NODE_ENV !== "production") DialogPopup.displayName = "DialogPopup";
 
-let DialogViewportDataAttributes = function (DialogViewportDataAttributes) {
-  /**
-   * Present when the dialog is open.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["open"] = CommonPopupDataAttributes.open] = "open";
-  /**
-   * Present when the dialog is closed.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["closed"] = CommonPopupDataAttributes.closed] = "closed";
-  /**
-   * Present when the dialog is animating in.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["startingStyle"] = CommonPopupDataAttributes.startingStyle] = "startingStyle";
-  /**
-   * Present when the dialog is animating out.
-   */
-  DialogViewportDataAttributes[DialogViewportDataAttributes["endingStyle"] = CommonPopupDataAttributes.endingStyle] = "endingStyle";
-  /**
-   * Present when the dialog is nested within another dialog.
-   */
-  DialogViewportDataAttributes["nested"] = "data-nested";
-  /**
-   * Present when the dialog has other open dialogs nested within it.
-   */
-  DialogViewportDataAttributes["nestedDialogOpen"] = "data-nested-dialog-open";
-  return DialogViewportDataAttributes;
-}({});
-
-const stateAttributesMapping = {
-  ...popupStateMapping,
-  ...transitionStatusMapping,
-  nested(value) {
-    return value ? {
-      [DialogViewportDataAttributes.nested]: ''
-    } : null;
-  },
-  nestedDialogOpen(value) {
-    return value ? {
-      [DialogViewportDataAttributes.nestedDialogOpen]: ''
-    } : null;
-  }
-};
-
-/**
- * A positioning container for the dialog popup that can be made scrollable.
- * Renders a `<div>` element.
- *
- * Documentation: [Base UI Dialog](https://base-ui.com/react/components/dialog)
- */
-const DialogViewport = /*#__PURE__*/React.forwardRef(function DialogViewport(componentProps, forwardedRef) {
-  const {
-    render,
-    className,
-    style,
-    children,
-    ...elementProps
-  } = componentProps;
-  const keepMounted = useDialogPortalContext();
-  const {
-    store
-  } = useDialogRootContext();
-  const open = store.useState('open');
-  const nested = store.useState('nested');
-  const transitionStatus = store.useState('transitionStatus');
-  const nestedOpenDialogCount = store.useState('nestedOpenDialogCount');
-  const mounted = store.useState('mounted');
-  const setViewportElement = store.useStateSetter('viewportElement');
-  const nestedDialogOpen = nestedOpenDialogCount > 0;
-  const state = {
-    open,
-    nested,
-    transitionStatus,
-    nestedDialogOpen
-  };
-  const shouldRender = keepMounted || mounted;
-  return useRenderElement('div', componentProps, {
-    enabled: shouldRender,
-    state,
-    ref: [forwardedRef, setViewportElement],
-    stateAttributesMapping,
-    props: [{
-      role: 'presentation',
-      hidden: !mounted,
-      style: {
-        pointerEvents: !open ? 'none' : undefined
-      },
-      children
-    }, elementProps]
-  });
-});
-if (process.env.NODE_ENV !== "production") DialogViewport.displayName = "DialogViewport";
-
 /**
  * A handle to control a Dialog imperatively and to associate detached triggers with it.
  */
@@ -379,4 +287,4 @@ function createDialogHandle() {
  */
 const DrawerDescription = DialogDescription;
 
-export { DrawerDescription as D, DialogBackdrop as a, DialogViewport as b, DialogPopup as c, DialogDescription as d, createDialogHandle as e, DialogHandle as f };
+export { DrawerDescription as D, DialogBackdrop as a, DialogPopup as b, DialogDescription as c, createDialogHandle as d, DialogHandle as e };

package/dist/MenuSubmenuTrigger-es.js

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { a as useRefWithInit, f as formatErrorMessage, u as useRenderElement, m as mergeProps, c as useMergedRefs, E as EMPTY_OBJECT, b as EMPTY_ARRAY, w as warn } from './useRenderElement-es.js';
-import { X as mergeCleanups, Y as isTypeableElement, Z as matchesFocusVisible, _ as isTargetInsideEnabledTrigger, $ as createAttribute, J as webkit, d as useFloatingTree, u as useFloatingParentNodeId, a0 as isInteractiveElement, a1 as getNodeChildren, p as popupStateMapping, a as FloatingFocusManager, E as FloatingPortal, a2 as POPUP_COLLISION_AVOIDANCE, I as InternalBackdrop, G as inertValue, a3 as FloatingNode, H as DROPDOWN_COLLISION_AVOIDANCE, t as createSelector, R as ReactStore, P as PopupTriggerMap, a4 as FloatingTreeStore, a5 as fastComponent, a6 as useInitialOpenSync, a7 as useFloatingNodeId, v as useOpenInteractionType, L as useImplicitActiveTrigger, M as useOpenStateTransitions, a8 as attachPreventUnmountOnClose, O as setPopupOpenState, a9 as useSyncedFloatingRootContext, y as useDismiss, r as useDirection, aa as TYPEAHEAD_RESET_MS, F as FOCUSABLE_POPUP_PROPS, N as usePopupInteractionProps, ab as FloatingTree, ac as getTabbableBeforeElement, ad as isOutsideEvent, ae as getTabbableAfterElement, af as getNextTabbable, ag as fastComponentRef, T as useTriggerDataForwarding, x as useClick, B as pressableTriggerOpenStateMapping, ah as FocusGuard, ai as PATIENT_CLICK_THRESHOLD, aj as useTriggerRegistration, W as triggerOpenStateMapping } from './useScrollLock-es.js';
-import { Y as isMouseLikePointerType, h as useTimeout, B as addEventListener, g as getTarget, d as createChangeEventDetails, Z as triggerFocus, p as activeElement, o as ownerDocument, q as contains, _ as mac, $ as triggerPress, a0 as escapeKey, L as useOnMount, T as Timeout, b as useStableCallback, a as useIsoLayoutEffect, a1 as triggerHover, m as useValueAsRef, t as transitionStatusMapping, V as itemPress, c as useButton, u as useBaseUiId, f as useOpenChangeComplete, Q as outsidePress, a2 as useAnimationsFinished, a3 as siblingOpen, z as useControlled, k as useTransitionStatus, l as useId, v as focusOut, r as listNavigation, i as imperativeAction, a4 as useCompositeRootContext, R as cancelOpen, S as SafeReact } from './useButton-es.js';
+import { K as mergeCleanups, L as isTypeableElement, M as matchesFocusVisible, N as isTargetInsideEnabledTrigger, O as createAttribute, J as webkit, d as useFloatingTree, u as useFloatingParentNodeId, Q as isInteractiveElement, R as getNodeChildren, p as popupStateMapping, a as FloatingFocusManager, E as FloatingPortal, T as POPUP_COLLISION_AVOIDANCE, I as InternalBackdrop, G as inertValue, U as FloatingNode, H as DROPDOWN_COLLISION_AVOIDANCE, t as createSelector, V as ReactStore, P as PopupTriggerMap, W as FloatingTreeStore, X as fastComponent, Y as useInitialOpenSync, Z as useFloatingNodeId, v as useOpenInteractionType, _ as useImplicitActiveTrigger, $ as useOpenStateTransitions, a0 as attachPreventUnmountOnClose, a1 as setPopupOpenState, a2 as useSyncedFloatingRootContext, y as useDismiss, r as useDirection, a3 as TYPEAHEAD_RESET_MS, F as FOCUSABLE_POPUP_PROPS, a4 as usePopupInteractionProps, a5 as FloatingTree, a6 as getTabbableBeforeElement, a7 as isOutsideEvent, a8 as getTabbableAfterElement, a9 as getNextTabbable, aa as fastComponentRef, ab as useTriggerDataForwarding, x as useClick, B as pressableTriggerOpenStateMapping, ac as FocusGuard, ad as PATIENT_CLICK_THRESHOLD, ae as useTriggerRegistration, af as triggerOpenStateMapping } from './useScrollLock-es.js';
+import { W as isMouseLikePointerType, h as useTimeout, B as addEventListener, g as getTarget, d as createChangeEventDetails, X as triggerFocus, p as activeElement, o as ownerDocument, q as contains, Y as mac, Z as triggerPress, _ as escapeKey, L as useOnMount, T as Timeout, b as useStableCallback, a as useIsoLayoutEffect, $ as triggerHover, m as useValueAsRef, t as transitionStatusMapping, V as itemPress, c as useButton, u as useBaseUiId, f as useOpenChangeComplete, Q as outsidePress, a0 as useAnimationsFinished, a1 as siblingOpen, z as useControlled, k as useTransitionStatus, l as useId, v as focusOut, r as listNavigation, i as imperativeAction, a2 as useCompositeRootContext, R as cancelOpen, S as SafeReact } from './useButton-es.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { h as useCompositeListItem, f as getDisabledMountTransitionStyles, d as useAnchorPositioning, i as adaptiveOrigin, c as useAnchoredPopupScrollLock, e as usePositioner, C as CompositeList, a as useListNavigation, b as useTypeahead, g as getPseudoElementBounds } from './useCompositeListItem-es.js';
 import { u as useToolbarRootContext, i as isElementDisabled } from './isElementDisabled-es.js';
 import { C as COMPOSITE_KEYS } from './scrollEdges-es.js';
 import { o as getWindow, b as isElement, i as isHTMLElement, d as isLastTraversableNode, e as getParentNode } from './floating-ui.utils.dom-es.js';
-import { p as popupStoreSelectors, l as createInitialPopupStoreState } from './ScrollAreaViewport-es.js';
+import { p as popupStoreSelectors, n as createInitialPopupStoreState } from './ScrollAreaViewport-es.js';
 import * as ReactDOM from 'react-dom';
 
 function resolveValue(value, pointerType) {

package/dist/Modal/index.cjs

@@ -42,8 +42,7 @@ function ModalLegacy({ open = false, title, size, dismissible = true, children,
     const containerClassName = classnames(styles$1.container, size === "fullScreen" && styles$1.containerFullScreen);
     jobberHooks.useRefocusOnActivator(open);
     const modalRef = jobberHooks.useFocusTrap(open);
-    jobberHooks.useOnKeyDown(handleRequestClose, "Escape");
-    const template = (React.createElement(framerMotion.AnimatePresence, null, open && (React.createElement("div", { ref: modalRef, role: "dialog", className: containerClassName, tabIndex: 0, "aria-modal": "true", "aria-labelledby": title ? MODAL_HEADER_ID : undefined, "aria-label": ariaLabel },
+    const template = (React.createElement(framerMotion.AnimatePresence, null, open && (React.createElement("div", { ref: modalRef, role: "dialog", className: containerClassName, tabIndex: 0, "aria-modal": "true", "aria-labelledby": title ? MODAL_HEADER_ID : undefined, "aria-label": ariaLabel, onKeyDown: handleKeyDown },
         React.createElement(framerMotion.motion.div, { key: styles$1.overlay, className: styles$1.overlay, onClick: onRequestClose, initial: { opacity: 0 }, animate: { opacity: 0.8 }, exit: { opacity: 0 }, transition: { duration: 0.2 } }),
         React.createElement(framerMotion.motion.div, { key: styles$1.modal, className: modalClassName, initial: { scale: 0.9, opacity: 0 }, animate: { scale: 1, opacity: 1 }, exit: { scale: 0.9, opacity: 0 }, transition: {
                 duration: 0.2,
@@ -60,6 +59,17 @@ function ModalLegacy({ open = false, title, size, dismissible = true, children,
             onRequestClose();
         }
     }
+    function handleKeyDown(event) {
+        if (event.key === "Escape") {
+            // Stop the Escape from bubbling to outer overlays (e.g. a Base UI Dialog
+            // this Modal is nested within, whose dismissal listens at the document
+            // level). Without this, one Escape closes both layers; instead only the
+            // top-most layer — this Modal — should close. Mirrors SideDrawer's
+            // Escape containment.
+            event.stopPropagation();
+            handleRequestClose();
+        }
+    }
 }
 function Header({ title, dismissible, onRequestClose }) {
     return (React.createElement("div", { className: styles$1.header, "data-testid": "modal-header" },

package/dist/Modal/index.mjs

@@ -2,7 +2,7 @@ import React__default, { useRef, useEffect, createContext, useContext } from 're
 import ReactDOM__default from 'react-dom';
 import classnames from 'classnames';
 import { AnimatePresence, motion } from 'framer-motion';
-import { useRefocusOnActivator, useFocusTrap, useOnKeyDown } from '@jobber/hooks';
+import { useRefocusOnActivator, useFocusTrap } from '@jobber/hooks';
 import { H as Heading } from '../Heading-es.js';
 import { B as Button } from '../Button-es.js';
 import { B as ButtonDismiss } from '../ButtonDismiss-es.js';
@@ -40,8 +40,7 @@ function ModalLegacy({ open = false, title, size, dismissible = true, children,
     const containerClassName = classnames(styles$1.container, size === "fullScreen" && styles$1.containerFullScreen);
     useRefocusOnActivator(open);
     const modalRef = useFocusTrap(open);
-    useOnKeyDown(handleRequestClose, "Escape");
-    const template = (React__default.createElement(AnimatePresence, null, open && (React__default.createElement("div", { ref: modalRef, role: "dialog", className: containerClassName, tabIndex: 0, "aria-modal": "true", "aria-labelledby": title ? MODAL_HEADER_ID : undefined, "aria-label": ariaLabel },
+    const template = (React__default.createElement(AnimatePresence, null, open && (React__default.createElement("div", { ref: modalRef, role: "dialog", className: containerClassName, tabIndex: 0, "aria-modal": "true", "aria-labelledby": title ? MODAL_HEADER_ID : undefined, "aria-label": ariaLabel, onKeyDown: handleKeyDown },
         React__default.createElement(motion.div, { key: styles$1.overlay, className: styles$1.overlay, onClick: onRequestClose, initial: { opacity: 0 }, animate: { opacity: 0.8 }, exit: { opacity: 0 }, transition: { duration: 0.2 } }),
         React__default.createElement(motion.div, { key: styles$1.modal, className: modalClassName, initial: { scale: 0.9, opacity: 0 }, animate: { scale: 1, opacity: 1 }, exit: { scale: 0.9, opacity: 0 }, transition: {
                 duration: 0.2,
@@ -58,6 +57,17 @@ function ModalLegacy({ open = false, title, size, dismissible = true, children,
             onRequestClose();
         }
     }
+    function handleKeyDown(event) {
+        if (event.key === "Escape") {
+            // Stop the Escape from bubbling to outer overlays (e.g. a Base UI Dialog
+            // this Modal is nested within, whose dismissal listens at the document
+            // level). Without this, one Escape closes both layers; instead only the
+            // top-most layer — this Modal — should close. Mirrors SideDrawer's
+            // Escape containment.
+            event.stopPropagation();
+            handleRequestClose();
+        }
+    }
 }
 function Header({ title, dismissible, onRequestClose }) {
     return (React__default.createElement("div", { className: styles$1.header, "data-testid": "modal-header" },