npm - @flipdish/ui-library - Versions diffs - 0.44.0 → 0.45.0 - Mend

@flipdish/ui-library 0.44.0 → 0.45.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (56) hide show

package/dist/components/organisms/SidePanel/components/SidePanelRegion.cjs CHANGED Viewed

@@ -5,6 +5,7 @@ var cx = require('@flipdish/ui-library/utilities/cx');
 var react = require('motion/react');
 var React = require('react');
 var usePanelFocus = require('../../../../hooks/__internal__/usePanelFocus/usePanelFocus.cjs');
+var pageCover_utils = require('../../../../utilities/__internal__/pageCoverUtils/pageCover.utils.cjs');
 /** Width of the panel from `lg` in pixels. Matches `w-100`. Below `lg` the panel is as wide as the page. */
 const SIDE_PANEL_WIDTH = 400;
@@ -23,6 +24,13 @@ const SidePanelRegion = ({ 'aria-label': ariaLabel, children, className, content
     const panelRef = React.useRef(null);
     const isPresent = react.useIsPresent();
     const shouldReduceMotion = react.useReducedMotion();
+    // Starting to cover the page, on open below `lg` or on narrowing, is announced so a slideout over the page can close. Declared
+    // before the focus hook, so a slideout lifts its cover before this panel's focus call, which the cover would refuse.
+    const isCovering = isPresent && !isDesktop;
+    React.useEffect(() => {
+        if (isCovering && panelRef.current)
+            pageCover_utils.dispatchPageCover(panelRef.current);
+    }, [isCovering]);
     const { onFocusCapture } = usePanelFocus.usePanelFocus({ panelRef, isPresent, isDesktop, shouldFocusOnMount, contentKey });
     // The first content arrives with the panel's own opening animation; only a later swap fades in.
     const firstContentKey = React.useRef(contentKey);

package/dist/components/organisms/SidePanel/components/SidePanelRegion.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePanelRegion.cjs","sources":["../../../../../src/components/organisms/SidePanel/components/SidePanelRegion.tsx"],"sourcesContent":[null],"names":["useRef","useIsPresent","useReducedMotion","~~usePanelFocus~~","~~useEffect~~","_jsx","motion","cx"],"mappings":"~~;;;;;;;;AAQA~~;AACO,MAAM,gBAAgB,GAAG;AAEhC;AACA,MAAM,MAAM,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,GAAG,EAAW;AAEvE,MAAM,MAAM,GAAG;IACb,MAAM,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IAC1B,IAAI,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,CAAC,EAAE,CAAC,EAAE;CAC/B;AAEV,MAAM,SAAS,GAAG;IAChB,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE;IACpC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE;CACrB;AAYV;MACa,eAAe,GAAG,CAAC,EAC9B,YAAY,EAAE,SAAS,EACvB,QAAQ,EACR,SAAS,EACT,UAAU,EACV,MAAM,EACN,SAAS,EACT,kBAAkB,GACG,KAAI;AACzB,IAAA,MAAM,QAAQ,GAAGA,YAAM,CAAc,IAAI,CAAC;AAC1C,IAAA,MAAM,SAAS,GAAGC,kBAAY,EAAE;AAChC,IAAA,MAAM,kBAAkB,GAAGC,sBAAgB,EAAE;~~AAC7C~~,IAAA,MAAM,EAAE,cAAc,EAAE,GAAGC,2BAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,UAAU,EAAE,CAAC;;AAG5G,IAAA,MAAM,eAAe,~~GAAGH~~,YAAM,CAAC,UAAU,CAAC;AAC1C,IAAA,MAAM,iBAAiB,GAAGA,YAAM,CAAC,KAAK,CAAC;AACvC,IAAA,IAAI,eAAe,CAAC,OAAO,KAAK,UAAU;AAAE,QAAA,iBAAiB,CAAC,OAAO,GAAG,IAAI;;AAG5E,IAAA,MAAM,iBAAiB,GAAGA,YAAM,CAAC,SAAS,CAAC;AAC3C,IAAA,MAAM,oBAAoB,GAAG,iBAAiB,CAAC,OAAO,KAAK,SAAS;~~IACpEI~~,eAAS,CAAC,MAAK;AACb,QAAA,iBAAiB,CAAC,OAAO,GAAG,SAAS;AACvC,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;IAEf,MAAM,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS;AAEnD,IAAA,~~QACEC~~,cAAA,CAACC,YAAM,CAAC,KAAK,EAAA,EACX,GAAG,EAAE,QAAQ,EAAA,YAAA,EACD,SAAS,EAAA,aAAA,EACR,MAAM;;AAEnB,QAAA,QAAQ,EAAE,EAAE,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,YAAY,CAAC,MAAM,EAC5B,OAAO,EAAE,YAAY,CAAC,IAAI,EAC1B,IAAI,EAAE,YAAY,CAAC,MAAM,EACzB,UAAU,EAAE,kBAAkB,IAAI,oBAAoB,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,MAAM;;;QAGjF,SAAS,EAAEC,KAAE,CACX,kJAAkJ,EAClJ,CAAC,SAAS,IAAI,iCAAiC,EAC/C,SAAS,CACV,YAGDF,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEE,KAAE,CAAC,+BAA+B,EAAE,SAAS,GAAG,iCAAiC,GAAG,QAAQ,CAAC,EAAA,QAAA,EAE3GF,cAAA,CAAA,KAAA,EAAA,EAEE,SAAS,EAAEE,KAAE,CAAC,8BAA8B,EAAE,iBAAiB,CAAC,OAAO,IAAI,4DAA4D,CAAC,EAAA,QAAA,EAEvI,QAAQ,EAAA,EAHJ,UAAU,CAIX,EAAA,CACF,EAAA,CACO;AAEnB;;;"}
1	+ {"version":3,"file":"SidePanelRegion.cjs","sources":["../../../../../src/components/organisms/SidePanel/components/SidePanelRegion.tsx"],"sourcesContent":[null],"names":["useRef","useIsPresent","useReducedMotion","useEffect","dispatchPageCover","usePanelFocus","_jsx","motion","cx"],"mappings":";;;;;;;;;AASA;AACO,MAAM,gBAAgB,GAAG;AAEhC;AACA,MAAM,MAAM,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,GAAG,EAAW;AAEvE,MAAM,MAAM,GAAG;IACb,MAAM,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IAC1B,IAAI,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,CAAC,EAAE,CAAC,EAAE;CAC/B;AAEV,MAAM,SAAS,GAAG;IAChB,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE;IACpC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE;CACrB;AAYV;MACa,eAAe,GAAG,CAAC,EAC9B,YAAY,EAAE,SAAS,EACvB,QAAQ,EACR,SAAS,EACT,UAAU,EACV,MAAM,EACN,SAAS,EACT,kBAAkB,GACG,KAAI;AACzB,IAAA,MAAM,QAAQ,GAAGA,YAAM,CAAc,IAAI,CAAC;AAC1C,IAAA,MAAM,SAAS,GAAGC,kBAAY,EAAE;AAChC,IAAA,MAAM,kBAAkB,GAAGC,sBAAgB,EAAE;;;AAI7C,IAAA,MAAM,UAAU,GAAG,SAAS,IAAI,CAAC,SAAS;IAC1CC,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,UAAU,IAAI,QAAQ,CAAC,OAAO;AAAE,YAAAC,iCAAiB,CAAC,QAAQ,CAAC,OAAO,CAAC;AACzE,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;AAEhB,IAAA,MAAM,EAAE,cAAc,EAAE,GAAGC,2BAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,UAAU,EAAE,CAAC;;AAG5G,IAAA,MAAM,eAAe,GAAGL,YAAM,CAAC,UAAU,CAAC;AAC1C,IAAA,MAAM,iBAAiB,GAAGA,YAAM,CAAC,KAAK,CAAC;AACvC,IAAA,IAAI,eAAe,CAAC,OAAO,KAAK,UAAU;AAAE,QAAA,iBAAiB,CAAC,OAAO,GAAG,IAAI;;AAG5E,IAAA,MAAM,iBAAiB,GAAGA,YAAM,CAAC,SAAS,CAAC;AAC3C,IAAA,MAAM,oBAAoB,GAAG,iBAAiB,CAAC,OAAO,KAAK,SAAS;IACpEG,eAAS,CAAC,MAAK;AACb,QAAA,iBAAiB,CAAC,OAAO,GAAG,SAAS;AACvC,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;IAEf,MAAM,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS;AAEnD,IAAA,QACEG,cAAA,CAACC,YAAM,CAAC,KAAK,EAAA,EACX,GAAG,EAAE,QAAQ,EAAA,YAAA,EACD,SAAS,EAAA,aAAA,EACR,MAAM;;AAEnB,QAAA,QAAQ,EAAE,EAAE,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,YAAY,CAAC,MAAM,EAC5B,OAAO,EAAE,YAAY,CAAC,IAAI,EAC1B,IAAI,EAAE,YAAY,CAAC,MAAM,EACzB,UAAU,EAAE,kBAAkB,IAAI,oBAAoB,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,MAAM;;;QAGjF,SAAS,EAAEC,KAAE,CACX,kJAAkJ,EAClJ,CAAC,SAAS,IAAI,iCAAiC,EAC/C,SAAS,CACV,YAGDF,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEE,KAAE,CAAC,+BAA+B,EAAE,SAAS,GAAG,iCAAiC,GAAG,QAAQ,CAAC,EAAA,QAAA,EAE3GF,cAAA,CAAA,KAAA,EAAA,EAEE,SAAS,EAAEE,KAAE,CAAC,8BAA8B,EAAE,iBAAiB,CAAC,OAAO,IAAI,4DAA4D,CAAC,EAAA,QAAA,EAEvI,QAAQ,EAAA,EAHJ,UAAU,CAIX,EAAA,CACF,EAAA,CACO;AAEnB;;;"}

package/dist/components/organisms/SidePanel/components/SidePanelRegion.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePanelRegion.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidePanel/components/SidePanelRegion.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;~~AAIvC~~,4GAA4G;AAC5G,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAepC,UAAU,oBAAoB;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,OAAO,CAAC;CAC7B;AAED,2GAA2G;AAC3G,eAAO,MAAM,eAAe,GAAI,sGAQ7B,oBAAoB,~~gCAoDtB~~,CAAC"}
1	+ {"version":3,"file":"SidePanelRegion.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidePanel/components/SidePanelRegion.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,4GAA4G;AAC5G,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAepC,UAAU,oBAAoB;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,OAAO,CAAC;CAC7B;AAED,2GAA2G;AAC3G,eAAO,MAAM,eAAe,GAAI,sGAQ7B,oBAAoB,gCA4DtB,CAAC"}

package/dist/components/organisms/SidePanel/components/SidePanelRegion.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { cx } from '@flipdish/ui-library/utilities/cx';
 import { useIsPresent, useReducedMotion, motion } from 'motion/react';
 import { useRef, useEffect } from 'react';
 import { usePanelFocus } from '../../../../hooks/__internal__/usePanelFocus/usePanelFocus.js';
+import { dispatchPageCover } from '../../../../utilities/__internal__/pageCoverUtils/pageCover.utils.js';
 /** Width of the panel from `lg` in pixels. Matches `w-100`. Below `lg` the panel is as wide as the page. */
 const SIDE_PANEL_WIDTH = 400;
@@ -21,6 +22,13 @@ const SidePanelRegion = ({ 'aria-label': ariaLabel, children, className, content
     const panelRef = useRef(null);
     const isPresent = useIsPresent();
     const shouldReduceMotion = useReducedMotion();
+    // Starting to cover the page, on open below `lg` or on narrowing, is announced so a slideout over the page can close. Declared
+    // before the focus hook, so a slideout lifts its cover before this panel's focus call, which the cover would refuse.
+    const isCovering = isPresent && !isDesktop;
+    useEffect(() => {
+        if (isCovering && panelRef.current)
+            dispatchPageCover(panelRef.current);
+    }, [isCovering]);
     const { onFocusCapture } = usePanelFocus({ panelRef, isPresent, isDesktop, shouldFocusOnMount, contentKey });
     // The first content arrives with the panel's own opening animation; only a later swap fades in.
     const firstContentKey = useRef(contentKey);

package/dist/components/organisms/SidePanel/components/SidePanelRegion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePanelRegion.js","sources":["../../../../../src/components/organisms/SidePanel/components/SidePanelRegion.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"~~;;;;;;AAQA~~;AACO,MAAM,gBAAgB,GAAG;AAEhC;AACA,MAAM,MAAM,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,SAAS,EAAE,GAAG,EAAW;AAEvE,MAAM,MAAM,GAAG;IACb,MAAM,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IAC1B,IAAI,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,CAAC,EAAE,CAAC,EAAE;CAC/B;AAEV,MAAM,SAAS,GAAG;IAChB,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE;IACpC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE;CACrB;AAYV;MACa,eAAe,GAAG,CAAC,EAC9B,YAAY,EAAE,SAAS,EACvB,QAAQ,EACR,SAAS,EACT,UAAU,EACV,MAAM,EACN,SAAS,EACT,kBAAkB,GACG,KAAI;AACzB,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAc,IAAI,CAAC;AAC1C,IAAA,MAAM,SAAS,GAAG,YAAY,EAAE;AAChC,IAAA,MAAM,kBAAkB,GAAG,gBAAgB,EAAE;~~AAC7C~~,IAAA,MAAM,EAAE,cAAc,EAAE,GAAG,aAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,UAAU,EAAE,CAAC;;AAG5G,IAAA,MAAM,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC;AAC1C,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAC,KAAK,CAAC;AACvC,IAAA,IAAI,eAAe,CAAC,OAAO,KAAK,UAAU;AAAE,QAAA,iBAAiB,CAAC,OAAO,GAAG,IAAI;;AAG5E,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAC,SAAS,CAAC;AAC3C,IAAA,MAAM,oBAAoB,GAAG,iBAAiB,CAAC,OAAO,KAAK,SAAS;IACpE,SAAS,CAAC,MAAK;AACb,QAAA,iBAAiB,CAAC,OAAO,GAAG,SAAS;AACvC,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;IAEf,MAAM,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS;AAEnD,IAAA,QACEA,GAAA,CAAC,MAAM,CAAC,KAAK,EAAA,EACX,GAAG,EAAE,QAAQ,EAAA,YAAA,EACD,SAAS,EAAA,aAAA,EACR,MAAM;;AAEnB,QAAA,QAAQ,EAAE,EAAE,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,YAAY,CAAC,MAAM,EAC5B,OAAO,EAAE,YAAY,CAAC,IAAI,EAC1B,IAAI,EAAE,YAAY,CAAC,MAAM,EACzB,UAAU,EAAE,kBAAkB,IAAI,oBAAoB,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,MAAM;;;QAGjF,SAAS,EAAE,EAAE,CACX,kJAAkJ,EAClJ,CAAC,SAAS,IAAI,iCAAiC,EAC/C,SAAS,CACV,YAGDA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,GAAG,iCAAiC,GAAG,QAAQ,CAAC,EAAA,QAAA,EAE3GA,GAAA,CAAA,KAAA,EAAA,EAEE,SAAS,EAAE,EAAE,CAAC,8BAA8B,EAAE,iBAAiB,CAAC,OAAO,IAAI,4DAA4D,CAAC,EAAA,QAAA,EAEvI,QAAQ,EAAA,EAHJ,UAAU,CAIX,EAAA,CACF,EAAA,CACO;AAEnB;;"}
1	+ {"version":3,"file":"SidePanelRegion.js","sources":["../../../../../src/components/organisms/SidePanel/components/SidePanelRegion.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"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"}

package/dist/components/organisms/SlideoutMenu/components/SlideoutShell.cjs CHANGED Viewed

@@ -2,7 +2,6 @@
 var jsxRuntime = require('react/jsx-runtime');
 var useBreakpoints = require('@flipdish/ui-library/hooks/useBreakpoints');
-var ThemeProvider = require('@flipdish/ui-library/providers/ThemeProvider');
 var cx = require('@flipdish/ui-library/utilities/cx');
 var testIdUtils = require('@flipdish/ui-library/utilities/testIdUtils');
 var react = require('motion/react');
@@ -12,6 +11,8 @@ var reactAriaComponents = require('react-aria-components');
 var usePanelFocus = require('../../../../hooks/__internal__/usePanelFocus/usePanelFocus.cjs');
 var focus_utils = require('../../../../utilities/__internal__/focusUtils/focus.utils.cjs');
 var hotkeys_utils = require('../../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs');
+var Theme_context = require('../../../../providers/ThemeProvider/Theme.context.cjs');
+var useCloseWhenCovered = require('../hooks/useCloseWhenCovered.cjs');
 var useSlideoutState = require('../hooks/useSlideoutState.cjs');
 var OverlayBounds_context = require('../providers/OverlayBounds.context.cjs');
 var PageArea_context = require('../providers/PageArea.context.cjs');
@@ -19,18 +20,19 @@ var SlideoutMenu_context = require('../providers/SlideoutMenu.context.cjs');
 var slideoutMenu_utils = require('../utilities/slideoutMenu.utils.cjs');
 const SLIDE = { type: 'tween', duration: 0.3, ease: 'easeOut' };
-const SLIDE_OUT = { type: 'tween', duration: 0.3, ease: 'easeIn' };
+// Leaves faster than it arrives, as `Modal` and the navigation drawer do.
+const SLIDE_OUT = { type: 'tween', duration: 0.2, ease: 'easeIn' };
 /** The panel itself. A component of its own so it can tell, while animating out, that it is leaving. */
-const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId, isDesktop, isKeyboardDismissDisabled, pageAreaRef, children, className, dialogClassName, }) => {
+const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId, isDesktop, isKeyboardDismissDisabled, children, className, dialogClassName, }) => {
     const panelRef = React.useRef(null);
     const dialogRef = React.useRef(null);
     const isPresent = react.useIsPresent();
     const shouldReduceMotion = react.useReducedMotion();
-    const shellPageAreaRef = React.useContext(PageArea_context.PageAreaContext);
-    // Outside `AppShell` the panel covers the app itself: in a micro-frontend the themed root is the page area under the host's
-    // chrome, and with `scopeId` overlays portal outside it. The hook leaves a root the panel sits inside alone, so an app that
-    // portals into its root passes `pageAreaRef`.
-    const themeRoot = ThemeProvider.useThemeRoot();
+    const pageAreaRef = React.useContext(PageArea_context.PageAreaContext);
+    // Without `AppShell` or `SlideoutMenu.PageArea` the panel covers the app itself: in a micro-frontend the themed root is the
+    // page area under the host's chrome, and with `scopeId` overlays portal outside it. The hook leaves a root the panel sits
+    // inside alone, so an app that portals into its root names its page area instead.
+    const themeRoot = Theme_context.useThemeRoot();
     const themeRootRef = React.useMemo(() => ({ current: themeRoot }), [themeRoot]);
     // Escape inside the panel; nothing outside is listened to for clicks, so the page stays usable and a click there never closes it.
     const { overlayProps } = reactAria.useOverlay({ isOpen: isPresent, onClose: openState.close, isDismissable: false, shouldCloseOnBlur: false, isKeyboardDismissDisabled }, panelRef);
@@ -56,15 +58,22 @@ const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId,
     }, [isPresent, isKeyboardDismissDisabled]);
     // react-aria's `useDialog` already focuses the dialog on mount; this hook is here for the hand-back on close, the inert exit,
     // and below `lg` the page area under the panel, which it takes out of reach: keyboard and screen reader skip what nobody can
-    // see. The host's own page area wins over the shell's, and the shell's over the app root. `shouldFocusOnMount` is what makes
-    // the hook record the opener.
-    const { onFocusCapture, setOpener } = usePanelFocus.usePanelFocus({
+    // see. A named page area wins over the app root. `shouldFocusOnMount` is what makes the hook record the opener.
+    const coveredRef = pageAreaRef ?? themeRootRef;
+    const { onFocusCapture, setOpener, liftCover } = usePanelFocus.usePanelFocus({
         panelRef: dialogRef,
         isPresent,
         isDesktop,
-        coveredRef: pageAreaRef ?? shellPageAreaRef ?? themeRootRef,
+        coveredRef,
         shouldFocusOnMount: true,
     });
+    // A side panel starting to cover the page below `lg`, the shell's or a host's, closes the panel: it would otherwise sit over
+    // what the user just opened. The cover lifts at once, so that panel, mounting under it, can take focus in the same pass.
+    const closeForCoveringPanel = React.useCallback(() => {
+        liftCover();
+        openState.close();
+    }, [liftCover, openState.close]);
+    useCloseWhenCovered.useCloseWhenCovered({ isOpen: isPresent, onClose: closeForCoveringPanel });
     // A row opened by mouse selects on pointerdown, so the panel focuses itself before the browser's own mousedown focus lands
     // back on the row. Settle one frame later: if nothing inside holds focus by then, the dialog takes it. A new gesture before
     // that frame means the user has moved on, such as to the next row, and the frame is dropped so focus is not pulled back.
@@ -120,7 +129,7 @@ const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId,
  * and shares the open state with a surrounding `SlideoutMenu.Trigger`. Nothing is dimmed or locked; from
  * `lg` the page beside the panel stays usable, and below `lg` only the page area it covers goes inert.
  */
-const SlideoutShell = ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDisabled, bounds, pageAreaRef, 'aria-label': ariaLabel, 'aria-labelledby': labelledBy, children, className, dialogClassName, 'data-testid': dataTestId, }) => {
+const SlideoutShell = ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDisabled, bounds, 'aria-label': ariaLabel, 'aria-labelledby': labelledBy, children, className, dialogClassName, 'data-testid': dataTestId, }) => {
     const rootTestId = testIdUtils.useResolvedTestId({ testId: dataTestId, segment: 'slideout-menu', rootName: 'slideout-menu' });
     const triggerState = React.useContext(reactAriaComponents.OverlayTriggerStateContext);
     const local = useSlideoutState.useSlideoutState({ isOpen, defaultOpen, onOpenChange });
@@ -131,7 +140,7 @@ const SlideoutShell = ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDis
     const isDesktop = useBreakpoints.useBreakpoints('lg');
     // A heading named through `aria-labelledby` replaces the default name; an explicit `aria-label` still wins.
     const label = ariaLabel ?? (labelledBy ? undefined : 'Slideout menu');
-    return (jsxRuntime.jsx(testIdUtils.TestIdProvider, { value: rootTestId, children: jsxRuntime.jsx(react.AnimatePresence, { children: openState.isOpen && (jsxRuntime.jsx(reactAria.Overlay, { disableFocusManagement: true, children: jsxRuntime.jsx(reactAriaComponents.OverlayTriggerStateContext.Provider, { value: openState, children: jsxRuntime.jsx(SlideoutPanel, { openState: openState, label: label, labelledBy: labelledBy, boundsStyle: boundsStyle, rootTestId: rootTestId, isDesktop: isDesktop, isKeyboardDismissDisabled: isKeyboardDismissDisabled, pageAreaRef: pageAreaRef, className: className, dialogClassName: dialogClassName, children: children }) }) }, "slideout-menu")) }) }));
+    return (jsxRuntime.jsx(testIdUtils.TestIdProvider, { value: rootTestId, children: jsxRuntime.jsx(react.AnimatePresence, { children: openState.isOpen && (jsxRuntime.jsx(reactAria.Overlay, { disableFocusManagement: true, children: jsxRuntime.jsx(reactAriaComponents.OverlayTriggerStateContext.Provider, { value: openState, children: jsxRuntime.jsx(SlideoutPanel, { openState: openState, label: label, labelledBy: labelledBy, boundsStyle: boundsStyle, rootTestId: rootTestId, isDesktop: isDesktop, isKeyboardDismissDisabled: isKeyboardDismissDisabled, className: className, dialogClassName: dialogClassName, children: children }) }) }, "slideout-menu")) }) }));
 };
 SlideoutShell.displayName = 'SlideoutShell';

package/dist/components/organisms/SlideoutMenu/components/SlideoutShell.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SlideoutShell.cjs","sources":["../../../../../src/components/organisms/SlideoutMenu/components/SlideoutShell.tsx"],"sourcesContent":[null],"names":["useRef","useIsPresent","useReducedMotion","useContext","PageAreaContext","useThemeRoot","useMemo","useOverlay","useEffect","isTypingInField","usePanelFocus","~~getFocusedElement~~","~~useState~~","~~useCallback~~","_jsx","_jsxs","motion","cx","SlideoutMenuContext","FocusScope","AriaDialog","useResolvedTestId","OverlayTriggerStateContext","useSlideoutState","OverlayBoundsContext","resolveSlideoutBounds","useBreakpoints","TestIdProvider","AnimatePresence","Overlay"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;~~AA2CA,MAAM,KAAK,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,SAAS,EAAW;AACxE,MAAM,SAAS,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAW;~~AAa3E~~;AACA,MAAM,aAAa,GAAG,CAAC,EACrB,SAAS,EACT,KAAK,EACL,UAAU,EACV,WAAW,EACX,UAAU,EACV,SAAS,EACT,yBAAyB,EACzB,~~WAAW,EACX,~~QAAQ,EACR,SAAS,EACT,eAAe,GACI,KAAI;AACvB,IAAA,MAAM,QAAQ,GAAGA,YAAM,CAAiB,IAAI,CAAC;AAC7C,IAAA,MAAM,SAAS,GAAGA,YAAM,CAAc,IAAI,CAAC;AAC3C,IAAA,MAAM,SAAS,GAAGC,kBAAY,EAAE;AAChC,IAAA,MAAM,kBAAkB,GAAGC,sBAAgB,EAAE;AAC7C,IAAA,MAAM,~~gBAAgB~~,GAAGC,gBAAU,CAACC,gCAAe,CAAC;;;;~~AAIpD~~,IAAA,MAAM,SAAS,GAAGC,0BAAY,EAAE;AAChC,IAAA,MAAM,YAAY,GAAGC,aAAO,CAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;;AAGzE,IAAA,MAAM,EAAE,YAAY,EAAE,GAAGC,oBAAU,CACjC,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,yBAAyB,EAAE,EAC1H,QAAQ,CACT;;;;IAKD,MAAM,QAAQ,GAAGP,YAAM,CAAC,SAAS,CAAC,KAAK,CAAC;AACxC,IAAA,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,KAAK;IAClCQ,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,IAAI,yBAAyB;YAAE;AAC7C,QAAA,MAAM,SAAS,GAAG,CAAC,KAAoB,KAAI;AACzC,YAAA,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,WAAW;gBAAE;AAC3E,YAAA,IAAI,KAAK,CAAC,MAAM,YAAY,IAAI,IAAI,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC;gBAAE;YAC9E,IAAIC,6BAAe,CAAC,KAAK,CAAC;gBAAE;YAC5B,QAAQ,CAAC,OAAO,EAAE;AACpB,QAAA,CAAC;AACD,QAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC;QAC/C,OAAO,MAAM,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC;AACjE,IAAA,CAAC,EAAE,CAAC,SAAS,EAAE,yBAAyB,CAAC,CAAC~~;;;;;AAK1C~~,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAGC,2BAAa,CAAC;~~AAClD~~,QAAA,QAAQ,EAAE,SAAS;QACnB,SAAS;QACT,SAAS;~~AACT~~,QAAA,~~UAAU~~,EAAE,~~WAAW,~~IAAI,~~gBAAgB~~,~~IAAI~~,~~YAAY~~;~~AAC3D~~,QAAA,~~kBAAkB~~,EAAE,~~IAAI~~;~~AACzB~~,~~KAAA~~,CAAC;;;;~~IAKFF~~,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,SAAS;YAAE;QAChB,MAAM,YAAY,GAAG,MAAK;YACxB,QAAQ,CAAC,mBAAmB,CAAC,aAAa,EAAE,MAAM,EAAE,IAAI,CAAC;YACzD,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC;AACvD,QAAA,CAAC;AACD,QAAA,MAAM,KAAK,GAAG,qBAAqB,CAAC,MAAK;AACvC,YAAA,YAAY,EAAE;AACd,YAAA,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO;AAChC,YAAA,MAAM,OAAO,~~GAAGG~~,6BAAiB,EAAE;AACnC,YAAA,IAAI,MAAM,IAAI,EAAE,OAAO,IAAI,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;gBAAE,MAAM,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;AAC7F,QAAA,CAAC,CAAC;QACF,MAAM,MAAM,GAAG,MAAK;YAClB,oBAAoB,CAAC,KAAK,CAAC;AAC3B,YAAA,YAAY,EAAE;AAChB,QAAA,CAAC;QACD,QAAQ,CAAC,gBAAgB,CAAC,aAAa,EAAE,MAAM,EAAE,IAAI,CAAC;QACtD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC;AAClD,QAAA,OAAO,MAAM;AACf,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;;;;IAKf,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAGC,cAAQ,CAAC,EAAE,CAAC;AACpD,IAAA,MAAM,SAAS,~~GAAGZ~~,YAAM,CAAgB,IAAI,CAAC;AAC7C,IAAA,MAAM,aAAa,~~GAAGa~~,iBAAW,CAC/B,CAAC,KAAa,KAAI;AAChB,QAAA,MAAM,QAAQ,GAAG,SAAS,CAAC,OAAO;AAClC,QAAA,SAAS,CAAC,OAAO,GAAG,KAAK;AACzB,QAAA,IAAI,QAAQ,KAAK,IAAI,IAAI,KAAK,KAAK,QAAQ;YAAE;AAC7C,QAAA,MAAM,OAAO,~~GAAGF~~,6BAAiB,EAAE;QACnC,IAAI,OAAO,IAAI,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC;YAAE;;AAEpD,QAAA,IAAI,OAAO;YAAE,SAAS,CAAC,OAAO,CAAC;QAC/B,eAAe,CAAC,KAAK,CAAC;AACxB,IAAA,CAAC,EACD,CAAC,SAAS,CAAC,CACZ;IAED;;;AAGE,~~IAAAG~~,cAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,WAAW,EAAE,SAAS,EAAC,8CAA8C,EAAA,QAAA,EAC/EC,eAAA,CAACC,YAAM,CAAC,GAAG,EAAA,EACT,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,YAAY,CAAC,SAAS,EACjC,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,EAAE,CAAC,EAAE,MAAM,EAAE,EACtB,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EACjB,IAAI,EAAE,EAAE,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,kBAAkB,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,SAAS,EAAE,EACjF,UAAU,EAAE,kBAAkB,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,KAAK;;YAExD,SAAS,EAAEC,KAAE,CAAC,iGAAiG,EAAE,SAAS,CAAC,aAE3HH,cAAA,CAACI,wCAAmB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,CAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,YAEnFJ,cAAA,CAACK,oBAAU,IAAC,YAAY,EAAA,IAAA,EAAA,QAAA,EACtBL,cAAA,CAACM,0BAAU,EAAA,EACT,GAAG,EAAE,SAAS,EACd,IAAI,EAAC,QAAQ,gBACD,KAAK,EAAA,iBAAA,EACA,UAAU,EAAA,aAAA,EACd,UAAU,EACvB,SAAS,EAAEH,KAAE,CACX,wHAAwH,EACxH,eAAe,CAChB,EAAA,QAAA,EAEA,CAAC,EAAE,KAAK,EAAE,MAAM,OAAO,QAAQ,KAAK,UAAU,GAAG,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,QAAQ,CAAC,EAAA,CACtE,EAAA,CACF,EAAA,CACgB,EAC/BH,cAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAC,SAAS,EAAA,QAAA,EAAE,YAAY,EAAA,CAAU,CAAA,EAAA,CACxC,EAAA,CACT;AAEV,CAAC;AAED;;;;AAIG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,MAAM,EACN,WAAW,EACX,YAAY,EACZ,yBAAyB,EACzB,MAAM,EACN,~~WAAW,EACX,~~YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,UAAU,EAC7B,QAAQ,EACR,SAAS,EACT,eAAe,EACf,aAAa,EAAE,UAAU,GACN,KAAI;AACvB,IAAA,MAAM,UAAU,GAAGO,6BAAiB,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,eAAe,EAAE,CAAC;AACjH,IAAA,MAAM,YAAY,~~GAAGlB~~,gBAAU,~~CAACmB~~,8CAA0B,CAAC;AAC3D,IAAA,MAAM,KAAK,GAAGC,iCAAgB,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,CAAC;;IAErE,MAAM,SAAS,GAAsB,MAAM,KAAK,SAAS,IAAI,WAAW,KAAK,SAAS,IAAI,CAAC,YAAY,GAAG,KAAK,GAAG,YAAY;AAC9H,IAAA,MAAM,QAAQ,~~GAAGpB~~,gBAAU,~~CAACqB~~,0CAAoB,CAAC;IACjD,MAAM,WAAW,GAAGC,wCAAqB,CAAC,MAAM,EAAE,QAAQ,CAAC;AAC3D,IAAA,MAAM,SAAS,GAAGC,6BAAc,CAAC,IAAI,CAAC;;AAEtC,IAAA,MAAM,KAAK,GAAG,SAAS,KAAK,UAAU,GAAG,SAAS,GAAG,eAAe,CAAC;AAErE,IAAA,QACEZ,cAAA,CAACa,0BAAc,EAAA,EAAC,KAAK,EAAE,UAAU,EAAA,QAAA,EAC/Bb,cAAA,CAACc,qBAAe,cACb,SAAS,CAAC,MAAM,KACfd,~~eAACe~~,iBAAO,EAAA,EAAqB,sBAAsB,~~EAAA~~,~~IAAA~~,~~EAAA~~,~~QAAA,EACjDf,eAACQ,~~8CAA0B,CAAC,QAAQ,~~EAAA~~,~~EAAC,~~KAAK,EAAE,SAAS,EAAA,QAAA,EACnDR,~~cAAA~~,~~CAAC,~~aAAa,~~IACZ~~,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,yBAAyB,EAAE,yBAAyB,EACpD,~~WAAW,EAAE,WAAW,EACxB,~~SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,eAAe,EAAA,QAAA,EAE/B,QAAQ,EAAA,CACK,EAAA,CACoB,~~IAhB3B~~,eAAe,~~CAiBlB~~,CACX,EAAA,CACe,EAAA,CACH;AAErB;AACA,aAAa,CAAC,WAAW,GAAG,eAAe;;"}
1	+ {"version":3,"file":"SlideoutShell.cjs","sources":["../../../../../src/components/organisms/SlideoutMenu/components/SlideoutShell.tsx"],"sourcesContent":[null],"names":["useRef","useIsPresent","useReducedMotion","useContext","PageAreaContext","useThemeRoot","useMemo","useOverlay","useEffect","isTypingInField","usePanelFocus","useCallback","useCloseWhenCovered","getFocusedElement","useState","_jsx","_jsxs","motion","cx","SlideoutMenuContext","FocusScope","AriaDialog","useResolvedTestId","OverlayTriggerStateContext","useSlideoutState","OverlayBoundsContext","resolveSlideoutBounds","useBreakpoints","TestIdProvider","AnimatePresence","Overlay"],"mappings":"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"}

package/dist/components/organisms/SlideoutMenu/components/SlideoutShell.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { ReactNode, RefObject } from 'react';
+import type { ReactNode } from 'react';
 import type { SlideoutBounds } from '../utilities/slideoutMenu.utils';
 /** What the render-prop form of `children` receives. */
 export interface SlideoutRenderProps {
@@ -11,7 +11,6 @@ export interface SlideoutShellProps {
     onOpenChange?: (isOpen: boolean) => void;
     isKeyboardDismissDisabled?: boolean;
     bounds?: SlideoutBounds;
-    pageAreaRef?: RefObject<HTMLElement | null>;
     'aria-label'?: string;
     'aria-labelledby'?: string;
     children: ReactNode | ((state: SlideoutRenderProps) => ReactNode);
@@ -25,7 +24,7 @@ export interface SlideoutShellProps {
  * `lg` the page beside the panel stays usable, and below `lg` only the page area it covers goes inert.
  */
 export declare const SlideoutShell: {
-    ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDisabled, bounds, pageAreaRef, "aria-label": ariaLabel, "aria-labelledby": labelledBy, children, className, dialogClassName, "data-testid": dataTestId, }: SlideoutShellProps): import("react").JSX.Element;
+    ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDisabled, bounds, "aria-label": ariaLabel, "aria-labelledby": labelledBy, children, className, dialogClassName, "data-testid": dataTestId, }: SlideoutShellProps): import("react").JSX.Element;
     displayName: string;
 };
 //# sourceMappingURL=SlideoutShell.d.ts.map

package/dist/components/organisms/SlideoutMenu/components/SlideoutShell.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SlideoutShell.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SlideoutMenu/components/SlideoutShell.tsx"],"names":[],"mappings":"~~AAOA~~,OAAO,KAAK,EAAiB,SAAS,EAAE,~~SAAS,EAAE,~~MAAM,OAAO,CAAC;~~AAYjE~~,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAGtE,wDAAwD;AACxD,MAAM,WAAW,mBAAmB;IAClC,wBAAwB;IACxB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,~~WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC5C,~~YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,mBAAmB,KAAK,SAAS,CAAC,CAAC;IAClE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;~~AA6JD~~;;;;GAIG;AACH,eAAO,MAAM,aAAa;~~sNAavB~~,kBAAkB;;~~CAsCpB~~,CAAC"}
1	+ {"version":3,"file":"SlideoutShell.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SlideoutMenu/components/SlideoutShell.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AActD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAGtE,wDAAwD;AACxD,MAAM,WAAW,mBAAmB;IAClC,wBAAwB;IACxB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,EAAE,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,mBAAmB,KAAK,SAAS,CAAC,CAAC;IAClE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAmKD;;;;GAIG;AACH,eAAO,MAAM,aAAa;yMAYvB,kBAAkB;;CAqCpB,CAAC"}

package/dist/components/organisms/SlideoutMenu/components/SlideoutShell.js CHANGED Viewed

@@ -1,15 +1,16 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useBreakpoints } from '@flipdish/ui-library/hooks/useBreakpoints';
-import { useThemeRoot } from '@flipdish/ui-library/providers/ThemeProvider';
 import { cx } from '@flipdish/ui-library/utilities/cx';
 import { useResolvedTestId, TestIdProvider } from '@flipdish/ui-library/utilities/testIdUtils';
 import { AnimatePresence, useIsPresent, useReducedMotion, motion } from 'motion/react';
-import { useContext, useRef, useMemo, useEffect, useState, useCallback } from 'react';
+import { useContext, useRef, useMemo, useEffect, useCallback, useState } from 'react';
 import { Overlay, useOverlay, FocusScope } from 'react-aria';
 import { OverlayTriggerStateContext, Dialog } from 'react-aria-components';
 import { usePanelFocus } from '../../../../hooks/__internal__/usePanelFocus/usePanelFocus.js';
 import { getFocusedElement } from '../../../../utilities/__internal__/focusUtils/focus.utils.js';
 import { isTypingInField } from '../../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.js';
+import { useThemeRoot } from '../../../../providers/ThemeProvider/Theme.context.js';
+import { useCloseWhenCovered } from '../hooks/useCloseWhenCovered.js';
 import { useSlideoutState } from '../hooks/useSlideoutState.js';
 import { OverlayBoundsContext } from '../providers/OverlayBounds.context.js';
 import { PageAreaContext } from '../providers/PageArea.context.js';
@@ -17,17 +18,18 @@ import { SlideoutMenuContext } from '../providers/SlideoutMenu.context.js';
 import { resolveSlideoutBounds } from '../utilities/slideoutMenu.utils.js';
 const SLIDE = { type: 'tween', duration: 0.3, ease: 'easeOut' };
-const SLIDE_OUT = { type: 'tween', duration: 0.3, ease: 'easeIn' };
+// Leaves faster than it arrives, as `Modal` and the navigation drawer do.
+const SLIDE_OUT = { type: 'tween', duration: 0.2, ease: 'easeIn' };
 /** The panel itself. A component of its own so it can tell, while animating out, that it is leaving. */
-const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId, isDesktop, isKeyboardDismissDisabled, pageAreaRef, children, className, dialogClassName, }) => {
+const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId, isDesktop, isKeyboardDismissDisabled, children, className, dialogClassName, }) => {
     const panelRef = useRef(null);
     const dialogRef = useRef(null);
     const isPresent = useIsPresent();
     const shouldReduceMotion = useReducedMotion();
-    const shellPageAreaRef = useContext(PageAreaContext);
-    // Outside `AppShell` the panel covers the app itself: in a micro-frontend the themed root is the page area under the host's
-    // chrome, and with `scopeId` overlays portal outside it. The hook leaves a root the panel sits inside alone, so an app that
-    // portals into its root passes `pageAreaRef`.
+    const pageAreaRef = useContext(PageAreaContext);
+    // Without `AppShell` or `SlideoutMenu.PageArea` the panel covers the app itself: in a micro-frontend the themed root is the
+    // page area under the host's chrome, and with `scopeId` overlays portal outside it. The hook leaves a root the panel sits
+    // inside alone, so an app that portals into its root names its page area instead.
     const themeRoot = useThemeRoot();
     const themeRootRef = useMemo(() => ({ current: themeRoot }), [themeRoot]);
     // Escape inside the panel; nothing outside is listened to for clicks, so the page stays usable and a click there never closes it.
@@ -54,15 +56,22 @@ const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId,
     }, [isPresent, isKeyboardDismissDisabled]);
     // react-aria's `useDialog` already focuses the dialog on mount; this hook is here for the hand-back on close, the inert exit,
     // and below `lg` the page area under the panel, which it takes out of reach: keyboard and screen reader skip what nobody can
-    // see. The host's own page area wins over the shell's, and the shell's over the app root. `shouldFocusOnMount` is what makes
-    // the hook record the opener.
-    const { onFocusCapture, setOpener } = usePanelFocus({
+    // see. A named page area wins over the app root. `shouldFocusOnMount` is what makes the hook record the opener.
+    const coveredRef = pageAreaRef ?? themeRootRef;
+    const { onFocusCapture, setOpener, liftCover } = usePanelFocus({
         panelRef: dialogRef,
         isPresent,
         isDesktop,
-        coveredRef: pageAreaRef ?? shellPageAreaRef ?? themeRootRef,
+        coveredRef,
         shouldFocusOnMount: true,
     });
+    // A side panel starting to cover the page below `lg`, the shell's or a host's, closes the panel: it would otherwise sit over
+    // what the user just opened. The cover lifts at once, so that panel, mounting under it, can take focus in the same pass.
+    const closeForCoveringPanel = useCallback(() => {
+        liftCover();
+        openState.close();
+    }, [liftCover, openState.close]);
+    useCloseWhenCovered({ isOpen: isPresent, onClose: closeForCoveringPanel });
     // A row opened by mouse selects on pointerdown, so the panel focuses itself before the browser's own mousedown focus lands
     // back on the row. Settle one frame later: if nothing inside holds focus by then, the dialog takes it. A new gesture before
     // that frame means the user has moved on, such as to the next row, and the frame is dropped so focus is not pulled back.
@@ -118,7 +127,7 @@ const SlideoutPanel = ({ openState, label, labelledBy, boundsStyle, rootTestId,
  * and shares the open state with a surrounding `SlideoutMenu.Trigger`. Nothing is dimmed or locked; from
  * `lg` the page beside the panel stays usable, and below `lg` only the page area it covers goes inert.
  */
-const SlideoutShell = ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDisabled, bounds, pageAreaRef, 'aria-label': ariaLabel, 'aria-labelledby': labelledBy, children, className, dialogClassName, 'data-testid': dataTestId, }) => {
+const SlideoutShell = ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDisabled, bounds, 'aria-label': ariaLabel, 'aria-labelledby': labelledBy, children, className, dialogClassName, 'data-testid': dataTestId, }) => {
     const rootTestId = useResolvedTestId({ testId: dataTestId, segment: 'slideout-menu', rootName: 'slideout-menu' });
     const triggerState = useContext(OverlayTriggerStateContext);
     const local = useSlideoutState({ isOpen, defaultOpen, onOpenChange });
@@ -129,7 +138,7 @@ const SlideoutShell = ({ isOpen, defaultOpen, onOpenChange, isKeyboardDismissDis
     const isDesktop = useBreakpoints('lg');
     // A heading named through `aria-labelledby` replaces the default name; an explicit `aria-label` still wins.
     const label = ariaLabel ?? (labelledBy ? undefined : 'Slideout menu');
-    return (jsx(TestIdProvider, { value: rootTestId, children: jsx(AnimatePresence, { children: openState.isOpen && (jsx(Overlay, { disableFocusManagement: true, children: jsx(OverlayTriggerStateContext.Provider, { value: openState, children: jsx(SlideoutPanel, { openState: openState, label: label, labelledBy: labelledBy, boundsStyle: boundsStyle, rootTestId: rootTestId, isDesktop: isDesktop, isKeyboardDismissDisabled: isKeyboardDismissDisabled, pageAreaRef: pageAreaRef, className: className, dialogClassName: dialogClassName, children: children }) }) }, "slideout-menu")) }) }));
+    return (jsx(TestIdProvider, { value: rootTestId, children: jsx(AnimatePresence, { children: openState.isOpen && (jsx(Overlay, { disableFocusManagement: true, children: jsx(OverlayTriggerStateContext.Provider, { value: openState, children: jsx(SlideoutPanel, { openState: openState, label: label, labelledBy: labelledBy, boundsStyle: boundsStyle, rootTestId: rootTestId, isDesktop: isDesktop, isKeyboardDismissDisabled: isKeyboardDismissDisabled, className: className, dialogClassName: dialogClassName, children: children }) }) }, "slideout-menu")) }) }));
 };
 SlideoutShell.displayName = 'SlideoutShell';

package/dist/components/organisms/SlideoutMenu/components/SlideoutShell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SlideoutShell.js","sources":["../../../../../src/components/organisms/SlideoutMenu/components/SlideoutShell.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaDialog"],"mappings":"~~;;;;;;;;;;;;;;;;;;~~AA2CA,MAAM,KAAK,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,SAAS,EAAW;AACxE,MAAM,SAAS,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAW;~~AAa3E~~;AACA,MAAM,aAAa,GAAG,CAAC,EACrB,SAAS,EACT,KAAK,EACL,UAAU,EACV,WAAW,EACX,UAAU,EACV,SAAS,EACT,yBAAyB,EACzB,~~WAAW,EACX,~~QAAQ,EACR,SAAS,EACT,eAAe,GACI,KAAI;AACvB,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;AAC7C,IAAA,MAAM,SAAS,GAAG,MAAM,CAAc,IAAI,CAAC;AAC3C,IAAA,MAAM,SAAS,GAAG,YAAY,EAAE;AAChC,IAAA,MAAM,kBAAkB,GAAG,gBAAgB,EAAE;AAC7C,IAAA,MAAM,~~gBAAgB~~,GAAG,UAAU,CAAC,eAAe,CAAC;;;;~~AAIpD~~,IAAA,MAAM,SAAS,GAAG,YAAY,EAAE;AAChC,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;;AAGzE,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,UAAU,CACjC,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,yBAAyB,EAAE,EAC1H,QAAQ,CACT;;;;IAKD,MAAM,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC;AACxC,IAAA,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,KAAK;IAClC,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,IAAI,yBAAyB;YAAE;AAC7C,QAAA,MAAM,SAAS,GAAG,CAAC,KAAoB,KAAI;AACzC,YAAA,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,WAAW;gBAAE;AAC3E,YAAA,IAAI,KAAK,CAAC,MAAM,YAAY,IAAI,IAAI,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC;gBAAE;YAC9E,IAAI,eAAe,CAAC,KAAK,CAAC;gBAAE;YAC5B,QAAQ,CAAC,OAAO,EAAE;AACpB,QAAA,CAAC;AACD,QAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC;QAC/C,OAAO,MAAM,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC;AACjE,IAAA,CAAC,EAAE,CAAC,SAAS,EAAE,yBAAyB,CAAC,CAAC~~;;;;;AAK1C~~,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,aAAa,CAAC;~~AAClD~~,QAAA,QAAQ,EAAE,SAAS;QACnB,SAAS;QACT,SAAS;~~AACT~~,QAAA,~~UAAU~~,EAAE,~~WAAW,~~IAAI,~~gBAAgB~~,~~IAAI~~,~~YAAY~~;~~AAC3D~~,QAAA,~~kBAAkB~~,EAAE,~~IAAI~~;~~AACzB~~,~~KAAA~~,CAAC;;;;~~IAKF~~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~~WAAW,EACX,~~YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,UAAU,EAC7B,QAAQ,EACR,SAAS,EACT,eAAe,EACf,aAAa,EAAE,UAAU,GACN,KAAI;AACvB,IAAA,MAAM,UAAU,GAAG,iBAAiB,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,eAAe,EAAE,CAAC;AACjH,IAAA,MAAM,YAAY,GAAG,UAAU,CAAC,0BAA0B,CAAC;AAC3D,IAAA,MAAM,KAAK,GAAG,gBAAgB,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,CAAC;;IAErE,MAAM,SAAS,GAAsB,MAAM,KAAK,SAAS,IAAI,WAAW,KAAK,SAAS,IAAI,CAAC,YAAY,GAAG,KAAK,GAAG,YAAY;AAC9H,IAAA,MAAM,QAAQ,GAAG,UAAU,CAAC,oBAAoB,CAAC;IACjD,MAAM,WAAW,GAAG,qBAAqB,CAAC,MAAM,EAAE,QAAQ,CAAC;AAC3D,IAAA,MAAM,SAAS,GAAG,cAAc,CAAC,IAAI,CAAC;;AAEtC,IAAA,MAAM,KAAK,GAAG,SAAS,KAAK,UAAU,GAAG,SAAS,GAAG,eAAe,CAAC;AAErE,IAAA,QACEA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,UAAU,EAAA,QAAA,EAC/BA,GAAA,CAAC,eAAe,cACb,SAAS,CAAC,MAAM,KACfA,~~IAAC~~,OAAO,EAAA,EAAqB,sBAAsB,~~EAAA~~,~~IAAA~~,~~EAAA~~,~~QAAA,EACjDA,IAAC,~~0BAA0B,CAAC,QAAQ,~~EAAA~~,~~EAAC,~~KAAK,EAAE,SAAS,EAAA,QAAA,EACnDA,~~GAAA~~,~~CAAC,~~aAAa,~~IACZ~~,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,yBAAyB,EAAE,yBAAyB,EACpD,~~WAAW,EAAE,WAAW,EACxB,~~SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,eAAe,EAAA,QAAA,EAE/B,QAAQ,EAAA,CACK,EAAA,CACoB,~~IAhB3B~~,eAAe,~~CAiBlB~~,CACX,EAAA,CACe,EAAA,CACH;AAErB;AACA,aAAa,CAAC,WAAW,GAAG,eAAe;;"}
1	+ {"version":3,"file":"SlideoutShell.js","sources":["../../../../../src/components/organisms/SlideoutMenu/components/SlideoutShell.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaDialog"],"mappings":"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"}

package/dist/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.cjs ADDED Viewed

@@ -0,0 +1,31 @@
+'use strict';
+var React = require('react');
+var pageCover_utils = require('../../../../utilities/__internal__/pageCoverUtils/pageCover.utils.cjs');
+/**
+ * Closes the panel when a side panel starts covering the page, in the shell or in a host such as the Portal. The panel is
+ * the transient thing the user opened, and left open it would sit over what they just asked for.
+ *
+ * @param options Whether the panel is open, and how to close it.
+ */
+const useCloseWhenCovered = ({ isOpen, onClose }) => {
+    // Written in an effect, so a render React discards never leaves the listener a callback from a state it threw away; a
+    // layout effect, declared first, so the listener below calls the committed one even in the commit that opened the panel.
+    const closeRef = React.useRef(onClose);
+    React.useLayoutEffect(() => {
+        closeRef.current = onClose;
+    });
+    // Listening for as long as the panel is open, not only once it covers the page itself: narrowing flips the side panel and
+    // this panel at once, and a host's panel in another React root may announce before this one has re-rendered. The event
+    // only fires below `lg`, where a side panel covers the page, so it never closes a panel docked beside one. A layout
+    // effect, so a listener mounting in the same commit as the announcement is in place before passive effects run.
+    React.useLayoutEffect(() => {
+        if (!isOpen)
+            return;
+        return pageCover_utils.subscribePageCover(() => closeRef.current());
+    }, [isOpen]);
+};
+exports.useCloseWhenCovered = useCloseWhenCovered;
+//# sourceMappingURL=useCloseWhenCovered.cjs.map

package/dist/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useCloseWhenCovered.cjs","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.ts"],"sourcesContent":[null],"names":["useRef","useLayoutEffect","subscribePageCover"],"mappings":";;;;;AAYA;;;;;AAKG;AACI,MAAM,mBAAmB,GAAG,CAAC,EAAE,MAAM,EAAE,OAAO,EAA8B,KAAU;;;AAG3F,IAAA,MAAM,QAAQ,GAAGA,YAAM,CAAC,OAAO,CAAC;IAChCC,qBAAe,CAAC,MAAK;AACnB,QAAA,QAAQ,CAAC,OAAO,GAAG,OAAO;AAC5B,IAAA,CAAC,CAAC;;;;;IAMFA,qBAAe,CAAC,MAAK;AACnB,QAAA,IAAI,CAAC,MAAM;YAAE;QACb,OAAOC,kCAAkB,CAAC,MAAM,QAAQ,CAAC,OAAO,EAAE,CAAC;AACrD,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;AACd;;"}

package/dist/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.d.ts ADDED Viewed

@@ -0,0 +1,15 @@
+interface UseCloseWhenCoveredOptions {
+    /** True while the panel is open, until it starts to leave. */
+    isOpen: boolean;
+    /** Closes the panel. */
+    onClose: () => void;
+}
+/**
+ * Closes the panel when a side panel starts covering the page, in the shell or in a host such as the Portal. The panel is
+ * the transient thing the user opened, and left open it would sit over what they just asked for.
+ *
+ * @param options Whether the panel is open, and how to close it.
+ */
+export declare const useCloseWhenCovered: ({ isOpen, onClose }: UseCloseWhenCoveredOptions) => void;
+export {};
+//# sourceMappingURL=useCloseWhenCovered.d.ts.map

package/dist/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"useCloseWhenCovered.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.ts"],"names":[],"mappings":"AAKA,UAAU,0BAA0B;IAClC,8DAA8D;IAC9D,MAAM,EAAE,OAAO,CAAC;IAChB,wBAAwB;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,GAAI,qBAAqB,0BAA0B,KAAG,IAgBrF,CAAC"}

package/dist/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.js ADDED Viewed

@@ -0,0 +1,29 @@
+import { useRef, useLayoutEffect } from 'react';
+import { subscribePageCover } from '../../../../utilities/__internal__/pageCoverUtils/pageCover.utils.js';
+/**
+ * Closes the panel when a side panel starts covering the page, in the shell or in a host such as the Portal. The panel is
+ * the transient thing the user opened, and left open it would sit over what they just asked for.
+ *
+ * @param options Whether the panel is open, and how to close it.
+ */
+const useCloseWhenCovered = ({ isOpen, onClose }) => {
+    // Written in an effect, so a render React discards never leaves the listener a callback from a state it threw away; a
+    // layout effect, declared first, so the listener below calls the committed one even in the commit that opened the panel.
+    const closeRef = useRef(onClose);
+    useLayoutEffect(() => {
+        closeRef.current = onClose;
+    });
+    // Listening for as long as the panel is open, not only once it covers the page itself: narrowing flips the side panel and
+    // this panel at once, and a host's panel in another React root may announce before this one has re-rendered. The event
+    // only fires below `lg`, where a side panel covers the page, so it never closes a panel docked beside one. A layout
+    // effect, so a listener mounting in the same commit as the announcement is in place before passive effects run.
+    useLayoutEffect(() => {
+        if (!isOpen)
+            return;
+        return subscribePageCover(() => closeRef.current());
+    }, [isOpen]);
+};
+export { useCloseWhenCovered };
+//# sourceMappingURL=useCloseWhenCovered.js.map

package/dist/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useCloseWhenCovered.js","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useCloseWhenCovered.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAYA;;;;;AAKG;AACI,MAAM,mBAAmB,GAAG,CAAC,EAAE,MAAM,EAAE,OAAO,EAA8B,KAAU;;;AAG3F,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC;IAChC,eAAe,CAAC,MAAK;AACnB,QAAA,QAAQ,CAAC,OAAO,GAAG,OAAO;AAC5B,IAAA,CAAC,CAAC;;;;;IAMF,eAAe,CAAC,MAAK;AACnB,QAAA,IAAI,CAAC,MAAM;YAAE;QACb,OAAO,kBAAkB,CAAC,MAAM,QAAQ,CAAC,OAAO,EAAE,CAAC;AACrD,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;AACd;;"}

package/dist/components/organisms/SlideoutMenu/hooks/useSlideoutState.cjs CHANGED Viewed

@@ -13,10 +13,11 @@ const useSlideoutState = ({ isOpen, defaultOpen, onOpenChange }) => {
     const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen ?? false);
     const isOpenControlled = isOpen !== undefined;
     const resolvedOpen = isOpenControlled ? isOpen : uncontrolledOpen;
-    // The latest callback and value live in refs so the returned API keeps its identity across renders.
+    // The latest callback and value live in refs so the returned API keeps its identity across renders. Synced in a layout
+    // effect, so a close asked for from a passive effect in the same commit, such as a side panel's cover, sees the open state.
     const onOpenChangeRef = React.useRef(onOpenChange);
     const isOpenRef = React.useRef(resolvedOpen);
-    React.useEffect(() => {
+    React.useLayoutEffect(() => {
         onOpenChangeRef.current = onOpenChange;
         isOpenRef.current = resolvedOpen;
     });

package/dist/components/organisms/SlideoutMenu/hooks/useSlideoutState.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useSlideoutState.cjs","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useSlideoutState.ts"],"sourcesContent":[null],"names":["useState","useRef","~~useEffect~~","useCallback","useMemo"],"mappings":";;;;AAmBA;;;;;;AAMG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,YAAY,EAA2B,KAAuB;AACpH,IAAA,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAGA,cAAQ,CAAC,WAAW,IAAI,KAAK,CAAC;AAC9E,IAAA,MAAM,gBAAgB,GAAG,MAAM,KAAK,SAAS;IAC7C,MAAM,YAAY,GAAG,gBAAgB,GAAG,MAAM,GAAG,gBAAgB~~;;AAGjE~~,IAAA,MAAM,eAAe,GAAGC,YAAM,CAAC,YAAY,CAAC;AAC5C,IAAA,MAAM,SAAS,GAAGA,YAAM,CAAC,YAAY,CAAC;IACtCC,~~eAAS~~,CAAC,MAAK;~~AACb~~,QAAA,eAAe,CAAC,OAAO,GAAG,YAAY;AACtC,QAAA,SAAS,CAAC,OAAO,GAAG,YAAY;AAClC,IAAA,CAAC,CAAC;AAEF,IAAA,MAAM,OAAO,GAAGC,iBAAW,CACzB,CAAC,IAAa,KAAI;AAChB,QAAA,IAAI,CAAC,gBAAgB;YAAE,mBAAmB,CAAC,IAAI,CAAC;AAChD,QAAA,IAAI,IAAI,KAAK,SAAS,CAAC,OAAO;AAAE,YAAA,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;AACjE,IAAA,CAAC,EACD,CAAC,gBAAgB,CAAC,CACnB;AAED,IAAA,OAAOC,aAAO,CACZ,OAAO;AACL,QAAA,MAAM,EAAE,YAAY;QACpB,OAAO;AACP,QAAA,IAAI,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC;AACzB,QAAA,KAAK,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC;QAC3B,MAAM,EAAE,MAAM,OAAO,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC;AAC1C,KAAA,CAAC,EACF,CAAC,YAAY,EAAE,OAAO,CAAC,CACxB;AACH;;"}
1	+ {"version":3,"file":"useSlideoutState.cjs","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useSlideoutState.ts"],"sourcesContent":[null],"names":["useState","useRef","useLayoutEffect","useCallback","useMemo"],"mappings":";;;;AAmBA;;;;;;AAMG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,YAAY,EAA2B,KAAuB;AACpH,IAAA,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAGA,cAAQ,CAAC,WAAW,IAAI,KAAK,CAAC;AAC9E,IAAA,MAAM,gBAAgB,GAAG,MAAM,KAAK,SAAS;IAC7C,MAAM,YAAY,GAAG,gBAAgB,GAAG,MAAM,GAAG,gBAAgB;;;AAIjE,IAAA,MAAM,eAAe,GAAGC,YAAM,CAAC,YAAY,CAAC;AAC5C,IAAA,MAAM,SAAS,GAAGA,YAAM,CAAC,YAAY,CAAC;IACtCC,qBAAe,CAAC,MAAK;AACnB,QAAA,eAAe,CAAC,OAAO,GAAG,YAAY;AACtC,QAAA,SAAS,CAAC,OAAO,GAAG,YAAY;AAClC,IAAA,CAAC,CAAC;AAEF,IAAA,MAAM,OAAO,GAAGC,iBAAW,CACzB,CAAC,IAAa,KAAI;AAChB,QAAA,IAAI,CAAC,gBAAgB;YAAE,mBAAmB,CAAC,IAAI,CAAC;AAChD,QAAA,IAAI,IAAI,KAAK,SAAS,CAAC,OAAO;AAAE,YAAA,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;AACjE,IAAA,CAAC,EACD,CAAC,gBAAgB,CAAC,CACnB;AAED,IAAA,OAAOC,aAAO,CACZ,OAAO;AACL,QAAA,MAAM,EAAE,YAAY;QACpB,OAAO;AACP,QAAA,IAAI,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC;AACzB,QAAA,KAAK,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC;QAC3B,MAAM,EAAE,MAAM,OAAO,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC;AAC1C,KAAA,CAAC,EACF,CAAC,YAAY,EAAE,OAAO,CAAC,CACxB;AACH;;"}

package/dist/components/organisms/SlideoutMenu/hooks/useSlideoutState.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useSlideoutState.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useSlideoutState.ts"],"names":[],"mappings":"AAIA,UAAU,uBAAuB;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED,wHAAwH;AACxH,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,GAAI,uCAAuC,uBAAuB,KAAG,~~iBA+BjG~~,CAAC"}
1	+ {"version":3,"file":"useSlideoutState.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useSlideoutState.ts"],"names":[],"mappings":"AAIA,UAAU,uBAAuB;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED,wHAAwH;AACxH,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,GAAI,uCAAuC,uBAAuB,KAAG,iBAgCjG,CAAC"}

package/dist/components/organisms/SlideoutMenu/hooks/useSlideoutState.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { useState, useRef, useEffect, useCallback, useMemo } from 'react';
+import { useState, useRef, useLayoutEffect, useCallback, useMemo } from 'react';
 /**
  * Owns the panel's open state, controlled or uncontrolled by the usual pair of props, in the shape
@@ -11,10 +11,11 @@ const useSlideoutState = ({ isOpen, defaultOpen, onOpenChange }) => {
     const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen ?? false);
     const isOpenControlled = isOpen !== undefined;
     const resolvedOpen = isOpenControlled ? isOpen : uncontrolledOpen;
-    // The latest callback and value live in refs so the returned API keeps its identity across renders.
+    // The latest callback and value live in refs so the returned API keeps its identity across renders. Synced in a layout
+    // effect, so a close asked for from a passive effect in the same commit, such as a side panel's cover, sees the open state.
     const onOpenChangeRef = useRef(onOpenChange);
     const isOpenRef = useRef(resolvedOpen);
-    useEffect(() => {
+    useLayoutEffect(() => {
         onOpenChangeRef.current = onOpenChange;
         isOpenRef.current = resolvedOpen;
     });

package/dist/components/organisms/SlideoutMenu/hooks/useSlideoutState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useSlideoutState.js","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useSlideoutState.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAmBA;;;;;;AAMG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,YAAY,EAA2B,KAAuB;AACpH,IAAA,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,WAAW,IAAI,KAAK,CAAC;AAC9E,IAAA,MAAM,gBAAgB,GAAG,MAAM,KAAK,SAAS;IAC7C,MAAM,YAAY,GAAG,gBAAgB,GAAG,MAAM,GAAG,gBAAgB~~;;AAGjE~~,IAAA,MAAM,eAAe,GAAG,MAAM,CAAC,YAAY,CAAC;AAC5C,IAAA,MAAM,SAAS,GAAG,MAAM,CAAC,YAAY,CAAC;IACtC,~~SAAS~~,CAAC,MAAK;~~AACb~~,QAAA,eAAe,CAAC,OAAO,GAAG,YAAY;AACtC,QAAA,SAAS,CAAC,OAAO,GAAG,YAAY;AAClC,IAAA,CAAC,CAAC;AAEF,IAAA,MAAM,OAAO,GAAG,WAAW,CACzB,CAAC,IAAa,KAAI;AAChB,QAAA,IAAI,CAAC,gBAAgB;YAAE,mBAAmB,CAAC,IAAI,CAAC;AAChD,QAAA,IAAI,IAAI,KAAK,SAAS,CAAC,OAAO;AAAE,YAAA,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;AACjE,IAAA,CAAC,EACD,CAAC,gBAAgB,CAAC,CACnB;AAED,IAAA,OAAO,OAAO,CACZ,OAAO;AACL,QAAA,MAAM,EAAE,YAAY;QACpB,OAAO;AACP,QAAA,IAAI,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC;AACzB,QAAA,KAAK,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC;QAC3B,MAAM,EAAE,MAAM,OAAO,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC;AAC1C,KAAA,CAAC,EACF,CAAC,YAAY,EAAE,OAAO,CAAC,CACxB;AACH;;"}
1	+ {"version":3,"file":"useSlideoutState.js","sources":["../../../../../src/components/organisms/SlideoutMenu/hooks/useSlideoutState.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAmBA;;;;;;AAMG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,YAAY,EAA2B,KAAuB;AACpH,IAAA,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,WAAW,IAAI,KAAK,CAAC;AAC9E,IAAA,MAAM,gBAAgB,GAAG,MAAM,KAAK,SAAS;IAC7C,MAAM,YAAY,GAAG,gBAAgB,GAAG,MAAM,GAAG,gBAAgB;;;AAIjE,IAAA,MAAM,eAAe,GAAG,MAAM,CAAC,YAAY,CAAC;AAC5C,IAAA,MAAM,SAAS,GAAG,MAAM,CAAC,YAAY,CAAC;IACtC,eAAe,CAAC,MAAK;AACnB,QAAA,eAAe,CAAC,OAAO,GAAG,YAAY;AACtC,QAAA,SAAS,CAAC,OAAO,GAAG,YAAY;AAClC,IAAA,CAAC,CAAC;AAEF,IAAA,MAAM,OAAO,GAAG,WAAW,CACzB,CAAC,IAAa,KAAI;AAChB,QAAA,IAAI,CAAC,gBAAgB;YAAE,mBAAmB,CAAC,IAAI,CAAC;AAChD,QAAA,IAAI,IAAI,KAAK,SAAS,CAAC,OAAO;AAAE,YAAA,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;AACjE,IAAA,CAAC,EACD,CAAC,gBAAgB,CAAC,CACnB;AAED,IAAA,OAAO,OAAO,CACZ,OAAO;AACL,QAAA,MAAM,EAAE,YAAY;QACpB,OAAO;AACP,QAAA,IAAI,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC;AACzB,QAAA,KAAK,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC;QAC3B,MAAM,EAAE,MAAM,OAAO,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC;AAC1C,KAAA,CAAC,EACF,CAAC,YAAY,EAAE,OAAO,CAAC,CACxB;AACH;;"}

package/dist/components/organisms/SlideoutMenu/index.cjs CHANGED Viewed

@@ -10,6 +10,7 @@ var utils = require('@react-aria/utils');
 var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var SlideoutShell = require('./components/SlideoutShell.cjs');
+var PageArea_context = require('./providers/PageArea.context.cjs');
 var SlideoutMenu_context = require('./providers/SlideoutMenu.context.cjs');
 var slideoutMenu_utils = require('./utilities/slideoutMenu.utils.cjs');
@@ -47,6 +48,9 @@ const Footer = ({ 'data-testid': dataTestId, ...props }) => {
     return (jsxRuntime.jsx("div", { ...props, "data-testid": footerTestId, className: cx.cx('w-full p-4 shadow-[inset_0px_1px_0px_0px] shadow-border-secondary md:px-6', props.className) }));
 };
 Footer.displayName = 'SlideoutFooter';
+/** Names what the slideouts below it cover below `lg`, for a layout of its own; `AppShell` does it for its page area. */
+const PageArea = ({ areaRef, children }) => jsxRuntime.jsx(PageArea_context.PageAreaContext.Provider, { value: areaRef, children: children });
+PageArea.displayName = 'SlideoutPageArea';
 /**
  * Panel that slides in from the right edge and floats over the page without dimming or blocking it,
  * for the detail of the record the user just selected. It covers the page area only, never the header, the
@@ -61,6 +65,7 @@ SlideoutMenu.Trigger = reactAriaComponents.DialogTrigger;
 SlideoutMenu.Content = Content;
 SlideoutMenu.Header = Header;
 SlideoutMenu.Footer = Footer;
+SlideoutMenu.PageArea = PageArea;
 exports.APP_HEADER_HEIGHT_VAR = slideoutMenu_utils.APP_HEADER_HEIGHT_VAR;
 exports.APP_SIDEBAR_WIDTH_VAR = slideoutMenu_utils.APP_SIDEBAR_WIDTH_VAR;

package/dist/components/organisms/SlideoutMenu/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs","sources":["../../../../src/components/organisms/SlideoutMenu/index.tsx"],"sourcesContent":[null],"names":["_jsx","SlideoutShell","useTestIdPrefix","joinTestId","cx","useContext","SlideoutMenuContext","useRef","useObjectRef","useLayoutEffect","_jsxs","ButtonUtility","ArrowUpRight","CloseButton","AriaDialogTrigger"],"mappings":"~~;;;;;;;;;;;;;;;AA8DA~~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~~AAErC~~;;;;;;;AAOG;AACH,MAAM,YAAY,GAAG;~~AAMrB~~,YAAY,CAAC,WAAW,GAAG,cAAc;AAEzC,YAAY,CAAC,OAAO,~~GAAGU~~,iCAAiB;AACxC,YAAY,CAAC,OAAO,GAAG,OAAO;AAC9B,YAAY,CAAC,MAAM,GAAG,MAAM;AAC5B,YAAY,CAAC,MAAM,GAAG,MAAM;;;;;"}
1	+ {"version":3,"file":"index.cjs","sources":["../../../../src/components/organisms/SlideoutMenu/index.tsx"],"sourcesContent":[null],"names":["_jsx","SlideoutShell","useTestIdPrefix","joinTestId","cx","useContext","SlideoutMenuContext","useRef","useObjectRef","useLayoutEffect","_jsxs","ButtonUtility","ArrowUpRight","CloseButton","PageAreaContext","AriaDialogTrigger"],"mappings":"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"}