@viasat/beam-react 2.29.1 → 2.36.0

package/lib/wip/Panel/Panel.Body.es.js

@@ -3,7 +3,7 @@ import e from "clsx";
 import { g as l } from "../../../chunks/classNames.BTJmrO_L.js";
 import "../../../chunks/constants.CKKGf1-i.js";
 import { Box as p } from "../../Box/Box.es.js";
-import { s as i } from "../../../chunks/panel.module.BblnuBjO.js";
+import { s as i } from "../../../chunks/panel.module.CnHWv4EZ.js";
 const { subElementClassPrefix: n } = l("panel"), c = `${n}body`, f = ({
   children: s,
   className: o,

package/lib/wip/Panel/Panel.Inline.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("@floating-ui/react"),q=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const b=require("./Panel.context.cjs.js"),F=require("../../FloatingUI/FloatingUI.root.cjs.js"),R=require("../../../chunks/FloatingUI.context.B15Tz_4h.js"),p=require("./Panel.Divider.cjs.js"),h=require("./Panel.ResizeHandle.cjs.js"),w=require("./Panel.useResize.cjs.js"),U=require("../../../chunks/panel.module.CVyUzyCZ.js"),{baseClassNamePrefix:N}=q.getBEMClassNames("panel"),v=({children:a,panelClassName:l,inlineWrapperClassName:r,resolvedPosition:n,dividerBefore:o,dividerInner:c,dividerAfter:u,alwaysVisible:i,dividerColor:t,resizeConfig:s,..._})=>{const{context:x,transitionConfig:d,refs:g}=R.useBmFloatingUIContext(),{isMounted:I,status:j}=m.useTransitionStatus(x,d),P=i&&j==="initial"?"open":j,{handleRef:f}=w.usePanelResize({resizeConfig:s,position:n,floatingRef:g.floating});return I?e.jsxs(e.Fragment,{children:[o&&e.jsx(p.InlineDivider,{position:n,dividerColor:t}),e.jsx("div",{ref:g.setFloating,className:r,"data-position":n,"data-status":P,children:e.jsxs("div",{className:U.styles[`${N}__inline-wrapper-content`],children:[c&&e.jsx(p.InlineDivider,{position:n,dividerColor:t}),e.jsxs("aside",{..._,className:l,children:[a,s&&e.jsx(h.PanelResizeHandle,{ref:f})]})]})}),u&&e.jsx(p.InlineDivider,{position:n,dividerColor:t})]}):null},y=({contextValue:a,panelClassName:l,inlineWrapperClassName:r,resolvedPosition:n,dividerBefore:o,dividerInner:c,dividerAfter:u,open:i,transitionConfig:t,dividerColor:s,children:_,resizeConfig:x,...d})=>e.jsx(b.PanelContext.Provider,{value:a,children:e.jsx(F.FloatingUIRoot,{open:i??!0,portalled:!1,transitionConfig:t,children:e.jsx(v,{panelClassName:l,inlineWrapperClassName:r,resolvedPosition:n,dividerBefore:o,dividerInner:c,dividerAfter:u,dividerColor:s,alwaysVisible:i===void 0,resizeConfig:x,...d,children:_})})});exports.InlinePanel=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("@floating-ui/react"),F=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const R=require("./Panel.context.cjs.js"),h=require("../../FloatingUI/FloatingUI.root.cjs.js"),w=require("../../../chunks/FloatingUI.context.B15Tz_4h.js"),j=require("./Panel.Divider.cjs.js"),U=require("./Panel.ResizeHandle.cjs.js"),N=require("./Panel.useResize.cjs.js"),y=require("../../../chunks/panel.module.BVmRxZHo.js"),{baseClassNamePrefix:v}=F.getBEMClassNames("panel"),C=({children:a,panelClassName:l,inlineWrapperClassName:r,resolvedPosition:n,dividerBefore:o,dividerInner:c,dividerAfter:u,alwaysVisible:i,skipMountAnimation:_,dividerColor:t,resizeConfig:s,sizeStyle:x,...d})=>{const{context:p,transitionConfig:g,refs:I}=w.useBmFloatingUIContext(),{isMounted:f,status:P}=b.useTransitionStatus(p,g),m=(i||_)&&P==="initial"?"open":P,{handleRef:q}=N.usePanelResize({resizeConfig:s,position:n,floatingRef:I.floating});return f?e.jsxs(e.Fragment,{children:[o&&e.jsx(j.InlineDivider,{position:n,dividerColor:t}),e.jsx("div",{ref:I.setFloating,className:r,"data-position":n,"data-status":m,style:x,children:e.jsxs("div",{className:y.styles[`${v}__inline-wrapper-content`],children:[c&&e.jsx(j.InlineDivider,{position:n,dividerColor:t}),e.jsxs("aside",{...d,className:l,children:[a,s&&e.jsx(U.PanelResizeHandle,{ref:q})]})]})}),u&&e.jsx(j.InlineDivider,{position:n,dividerColor:t})]}):null},D=({contextValue:a,panelClassName:l,inlineWrapperClassName:r,resolvedPosition:n,dividerBefore:o,dividerInner:c,dividerAfter:u,open:i,transitionConfig:_,dividerColor:t,children:s,resizeConfig:x,sizeStyle:d,skipMountAnimation:p,...g})=>e.jsx(R.PanelContext.Provider,{value:a,children:e.jsx(h.FloatingUIRoot,{open:i??!0,portalled:!1,transitionConfig:_,children:e.jsx(C,{panelClassName:l,inlineWrapperClassName:r,resolvedPosition:n,dividerBefore:o,dividerInner:c,dividerAfter:u,dividerColor:t,alwaysVisible:i===void 0,skipMountAnimation:p,resizeConfig:x,sizeStyle:d,...g,children:s})})});exports.InlinePanel=D;

package/lib/wip/Panel/Panel.Inline.d.ts

@@ -14,6 +14,10 @@ type InlinePanelProps = {
     children: React.ReactNode;
     dividerColor?: PanelDividerColor;
     resizeConfig?: PanelResizeConfig;
+    /** Forwarded from Panel: CSS custom-property override for the panel size. */
+    sizeStyle?: React.CSSProperties;
+    /** Forwarded from Panel: when true, suppress the slide-in animation on this mount. */
+    skipMountAnimation?: boolean;
 } & React.ComponentPropsWithoutRef<'aside'>;
-export declare const InlinePanel: ({ contextValue, panelClassName, inlineWrapperClassName, resolvedPosition, dividerBefore, dividerInner, dividerAfter, open, transitionConfig, dividerColor, children, resizeConfig, ...props }: InlinePanelProps) => import("react/jsx-runtime").JSX.Element;
+export declare const InlinePanel: ({ contextValue, panelClassName, inlineWrapperClassName, resolvedPosition, dividerBefore, dividerInner, dividerAfter, open, transitionConfig, dividerColor, children, resizeConfig, sizeStyle, skipMountAnimation, ...props }: InlinePanelProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/wip/Panel/Panel.Inline.es.js

@@ -1,16 +1,16 @@
-import { jsx as t, jsxs as d, Fragment as C } from "react/jsx-runtime";
-import { useTransitionStatus as F } from "@floating-ui/react";
-import { g as w } from "../../../chunks/classNames.BTJmrO_L.js";
+import { jsx as t, jsxs as x, Fragment as w } from "react/jsx-runtime";
+import { useTransitionStatus as y } from "@floating-ui/react";
+import { g as P } from "../../../chunks/classNames.BTJmrO_L.js";
 import "../../../chunks/constants.CKKGf1-i.js";
-import { PanelContext as P } from "./Panel.context.es.js";
-import { FloatingUIRoot as U } from "../../FloatingUI/FloatingUI.root.es.js";
-import { a as b } from "../../../chunks/FloatingUI.context.Dl4Y1y1z.js";
-import { InlineDivider as g } from "./Panel.Divider.es.js";
-import { PanelResizeHandle as j } from "./Panel.ResizeHandle.es.js";
-import { usePanelResize as y } from "./Panel.useResize.es.js";
-import { s as B } from "../../../chunks/panel.module.BblnuBjO.js";
-const { baseClassNamePrefix: M } = w("panel"), S = ({
-  children: s,
+import { PanelContext as U } from "./Panel.context.es.js";
+import { FloatingUIRoot as b } from "../../FloatingUI/FloatingUI.root.es.js";
+import { a as j } from "../../../chunks/FloatingUI.context.Dl4Y1y1z.js";
+import { InlineDivider as h } from "./Panel.Divider.es.js";
+import { PanelResizeHandle as B } from "./Panel.ResizeHandle.es.js";
+import { usePanelResize as M } from "./Panel.useResize.es.js";
+import { s as S } from "../../../chunks/panel.module.CnHWv4EZ.js";
+const { baseClassNamePrefix: _ } = P("panel"), z = ({
+  children: i,
   panelClassName: o,
   inlineWrapperClassName: r,
   resolvedPosition: n,
@@ -18,44 +18,47 @@ const { baseClassNamePrefix: M } = w("panel"), S = ({
   dividerInner: m,
   dividerAfter: p,
   alwaysVisible: e,
+  skipMountAnimation: f,
   dividerColor: a,
-  resizeConfig: i,
-  ...f
+  resizeConfig: s,
+  sizeStyle: c,
+  ...u
 }) => {
   const {
-    context: c,
-    transitionConfig: u,
-    refs: x
-  } = b(), { isMounted: I, status: h } = F(
-    c,
-    u
-  ), N = e && h === "initial" ? "open" : h, { handleRef: R } = y({
-    resizeConfig: i,
+    context: d,
+    transitionConfig: g,
+    refs: I
+  } = j(), { isMounted: R, status: N } = y(
+    d,
+    g
+  ), C = (e || f) && N === "initial" ? "open" : N, { handleRef: F } = M({
+    resizeConfig: s,
     position: n,
-    floatingRef: x.floating
+    floatingRef: I.floating
   });
-  return I ? /* @__PURE__ */ d(C, { children: [
-    l && /* @__PURE__ */ t(g, { position: n, dividerColor: a }),
+  return R ? /* @__PURE__ */ x(w, { children: [
+    l && /* @__PURE__ */ t(h, { position: n, dividerColor: a }),
     /* @__PURE__ */ t(
       "div",
       {
-        ref: x.setFloating,
+        ref: I.setFloating,
         className: r,
         "data-position": n,
-        "data-status": N,
-        children: /* @__PURE__ */ d("div", { className: B[`${M}__inline-wrapper-content`], children: [
-          m && /* @__PURE__ */ t(g, { position: n, dividerColor: a }),
-          /* @__PURE__ */ d("aside", { ...f, className: o, children: [
-            s,
-            i && /* @__PURE__ */ t(j, { ref: R })
+        "data-status": C,
+        style: c,
+        children: /* @__PURE__ */ x("div", { className: S[`${_}__inline-wrapper-content`], children: [
+          m && /* @__PURE__ */ t(h, { position: n, dividerColor: a }),
+          /* @__PURE__ */ x("aside", { ...u, className: o, children: [
+            i,
+            s && /* @__PURE__ */ t(B, { ref: F })
           ] })
         ] })
       }
     ),
-    p && /* @__PURE__ */ t(g, { position: n, dividerColor: a })
+    p && /* @__PURE__ */ t(h, { position: n, dividerColor: a })
   ] }) : null;
-}, A = ({
-  contextValue: s,
+}, J = ({
+  contextValue: i,
   panelClassName: o,
   inlineWrapperClassName: r,
   resolvedPosition: n,
@@ -63,19 +66,21 @@ const { baseClassNamePrefix: M } = w("panel"), S = ({
   dividerInner: m,
   dividerAfter: p,
   open: e,
-  transitionConfig: a,
-  dividerColor: i,
-  children: f,
+  transitionConfig: f,
+  dividerColor: a,
+  children: s,
   resizeConfig: c,
-  ...u
-}) => /* @__PURE__ */ t(P.Provider, { value: s, children: /* @__PURE__ */ t(
-  U,
+  sizeStyle: u,
+  skipMountAnimation: d,
+  ...g
+}) => /* @__PURE__ */ t(U.Provider, { value: i, children: /* @__PURE__ */ t(
+  b,
   {
     open: e ?? !0,
     portalled: !1,
-    transitionConfig: a,
+    transitionConfig: f,
     children: /* @__PURE__ */ t(
-      S,
+      z,
       {
         panelClassName: o,
         inlineWrapperClassName: r,
@@ -83,15 +88,17 @@ const { baseClassNamePrefix: M } = w("panel"), S = ({
         dividerBefore: l,
         dividerInner: m,
         dividerAfter: p,
-        dividerColor: i,
+        dividerColor: a,
         alwaysVisible: e === void 0,
+        skipMountAnimation: d,
         resizeConfig: c,
-        ...u,
-        children: f
+        sizeStyle: u,
+        ...g,
+        children: s
       }
     )
   }
 ) });
 export {
-  A as InlinePanel
+  J as InlinePanel
 };

package/lib/wip/Panel/Panel.Overlay.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),m=require("clsx"),p=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const F=require("./Panel.context.cjs.js"),I=require("./Panel.helpers.cjs.js"),j=require("../../FloatingUI/FloatingUI.root.cjs.js"),C=require("../../FloatingUI/FloatingUI.content.cjs.js"),R=require("../../../chunks/FloatingUI.context.B15Tz_4h.js"),U=require("./Panel.Divider.cjs.js"),N=require("./Panel.ResizeHandle.cjs.js"),h=require("./Panel.useResize.cjs.js"),q=require("../../../chunks/panel.module.CVyUzyCZ.js"),{baseClassNamePrefix:v,variable:y}=p.getBEMClassNames("panel"),w=({children:a,panelClassName:r,resolvedPosition:e,showDivider:o,dividerColor:l,resizeConfig:s,floatingOffset:i,overlayDividerClassName:c,isBlocking:u,style:t,..._})=>{const{refs:d}=R.useBmFloatingUIContext(),{handleRef:g}=h.usePanelResize({resizeConfig:s,position:e,floatingRef:d.floating,requireMount:!0}),P=i?{...t,[y("offset-x")]:i.x,[y("offset-y")]:i.y}:t;return n.jsxs(C.Content,{className:r,skipFloatingStyles:!0,overlay:u,..._,style:P,"data-position":e,children:[a,o&&n.jsx(U.InlineDivider,{position:e,className:c,dividerColor:l}),s&&n.jsx(N.PanelResizeHandle,{ref:g})]})},D=({contextValue:a,panelClassName:r,resolvedPosition:e,showDivider:o,modalType:l,closeOnOutsidePress:s,floatingOffset:i,open:c,onOpenChange:u,transitionConfig:t,dividerColor:_,children:d,resizeConfig:g,...P})=>{const x=l==="isModal"||l==="alert",b=I.getPanelDismissConfig(l,s),f=m(q.styles[`${v}__overlay-divider`],q.styles[`${v}__overlay-divider--${e}`]);return n.jsx(F.PanelContext.Provider,{value:a,children:n.jsx(j.FloatingUIRoot,{open:c,onOpenChange:u,portalled:!0,transitionConfig:t,dismiss:b,focusConfiguration:x?!0:{modal:!1,closeOnFocusOut:!1},children:n.jsx(w,{panelClassName:r,resolvedPosition:e,showDivider:o,dividerColor:_,floatingOffset:i,overlayDividerClassName:f,isBlocking:x,resizeConfig:g,...P,role:l==="alert"?"alertdialog":"dialog","aria-modal":x||void 0,children:d})})})};exports.OverlayPanel=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),M=require("clsx"),g=require("react"),h=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const w=require("./Panel.context.cjs.js"),S=require("./Panel.helpers.cjs.js"),k=require("../../FloatingUI/FloatingUI.root.cjs.js"),D=require("../../FloatingUI/FloatingUI.content.cjs.js"),B=require("../../../chunks/FloatingUI.context.B15Tz_4h.js"),$=require("./Panel.Divider.cjs.js"),z=require("./Panel.ResizeHandle.cjs.js"),A=require("./Panel.useResize.cjs.js"),p=require("../../../chunks/panel.module.BVmRxZHo.js"),{baseClassNamePrefix:C,variable:f}=h.getBEMClassNames("panel");function H(s,t,e){if(!(!s&&!t&&!e))return{...s,...t,...e?{[f("offset-x")]:e.x,[f("offset-y")]:e.y}:null}}const R=({children:s,panelClassName:t,resolvedPosition:e,showDivider:c,dividerColor:l,resizeConfig:a,floatingOffset:_,overlayDividerClassName:d,isBlocking:P,sizeStyle:v,skipMountAnimation:x,container:u,style:q,...b})=>{const{refs:y}=B.useBmFloatingUIContext(),{handleRef:r}=A.usePanelResize({resizeConfig:a,position:e,floatingRef:y.floating,requireMount:!0,container:u}),n=H(q,v,_);return i.jsxs(D.Content,{className:t,skipFloatingStyles:!0,overlay:P?u?{lockScroll:!1}:!0:!1,...b,style:n,"data-position":e,...x?{"data-status":"open"}:{},children:[s,c&&i.jsx($.InlineDivider,{position:e,className:d,dividerColor:l}),a&&i.jsx(z.PanelResizeHandle,{ref:r})]})},E=({contextValue:s,panelClassName:t,resolvedPosition:e,showDivider:c,modalType:l,closeOnOutsidePress:a,floatingOffset:_,open:d,onOpenChange:P,transitionConfig:v,dividerColor:x,children:u,resizeConfig:q,sizeStyle:b,skipMountAnimation:y,container:r,triggerRef:n,...j})=>{const m=l==="isModal"||l==="alert",I=g.useCallback(o=>{const F=(n==null?void 0:n.current)??null;return!(F&&o.target instanceof Node&&F.contains(o.target))},[n]),U=g.useMemo(()=>{const o=S.getPanelDismissConfig(l,a);return!n||!(l==="isModal"||l!=="alert"&&!!a)?o:{...o??{},outsidePress:I}},[l,a,n,I]),N=M(p.styles[`${C}__overlay-divider`],p.styles[`${C}__overlay-divider--${e}`]);return i.jsx(w.PanelContext.Provider,{value:s,children:i.jsx(k.FloatingUIRoot,{open:d,onOpenChange:P,portalled:r?{root:r}:!0,transitionConfig:v,dismiss:U,focusConfiguration:m?!0:{modal:!1,closeOnFocusOut:!1},children:i.jsx(R,{panelClassName:t,resolvedPosition:e,showDivider:c,dividerColor:x,floatingOffset:_,overlayDividerClassName:N,isBlocking:m,resizeConfig:q,sizeStyle:b,skipMountAnimation:y,container:r,...j,role:l==="alert"?"alertdialog":"dialog","aria-modal":m||void 0,children:u})})})};exports.OverlayPanel=E;

package/lib/wip/Panel/Panel.Overlay.d.ts

@@ -1,4 +1,5 @@
 import { UseTransitionStylesProps } from '@floating-ui/react';
+import { ComponentPropsWithoutRef, CSSProperties, RefObject } from 'react';
 import { PanelDividerColor, PanelModalType, PanelPosition, PanelResizeConfig, ResolvedPanelOffset } from './Panel.types';
 import { PanelContextValue } from './Panel.context';
 import { FloatingUIProps } from '../../FloatingUI/FloatingUI.context';
@@ -16,6 +17,23 @@ type OverlayPanelProps = {
     children: React.ReactNode;
     dividerColor?: PanelDividerColor;
     resizeConfig?: PanelResizeConfig;
-} & React.ComponentPropsWithoutRef<'aside'>;
-export declare const OverlayPanel: ({ contextValue, panelClassName, resolvedPosition, showDivider, modalType, closeOnOutsidePress, floatingOffset, open, onOpenChange, transitionConfig, dividerColor, children, resizeConfig, ...props }: OverlayPanelProps) => import("react/jsx-runtime").JSX.Element;
+    /** Forwarded from Panel: CSS custom-property override for the panel size. */
+    sizeStyle?: CSSProperties;
+    /** Forwarded from Panel: when true, suppress the slide-in animation on this mount. */
+    skipMountAnimation?: boolean;
+    /**
+     * Portal target; when set, panel renders inside this element using position: absolute.
+     * `undefined` means no container (full-screen). A pending container is handled upstream:
+     * Panel returns null before reaching here, so this is never `null`.
+     */
+    container?: HTMLElement;
+    /**
+     * The element that opens the panel; clicks on it are excluded from outside-press
+     * dismissal so it can toggle the panel without the close immediately re-firing.
+     * Focus returns to the previously-focused element (typically this trigger) on close.
+     * No effect on `kind="inline"`.
+     */
+    triggerRef?: RefObject<HTMLElement | null>;
+} & ComponentPropsWithoutRef<'aside'>;
+export declare const OverlayPanel: ({ contextValue, panelClassName, resolvedPosition, showDivider, modalType, closeOnOutsidePress, floatingOffset, open, onOpenChange, transitionConfig, dividerColor, children, resizeConfig, sizeStyle, skipMountAnimation, container, triggerRef, ...props }: OverlayPanelProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/wip/Panel/Panel.Overlay.es.js

@@ -1,104 +1,141 @@
-import { jsx as t, jsxs as P } from "react/jsx-runtime";
-import R from "clsx";
-import { g as h } from "../../../chunks/classNames.BTJmrO_L.js";
+import { jsx as n, jsxs as B } from "react/jsx-runtime";
+import D from "clsx";
+import { useCallback as S, useMemo as $ } from "react";
+import { g } from "../../../chunks/classNames.BTJmrO_L.js";
 import "../../../chunks/constants.CKKGf1-i.js";
-import { PanelContext as F } from "./Panel.context.es.js";
-import { getPanelDismissConfig as I } from "./Panel.helpers.es.js";
-import { FloatingUIRoot as B } from "../../FloatingUI/FloatingUI.root.es.js";
-import { Content as D } from "../../FloatingUI/FloatingUI.content.es.js";
-import { a as M } from "../../../chunks/FloatingUI.context.Dl4Y1y1z.js";
-import { InlineDivider as _ } from "./Panel.Divider.es.js";
-import { PanelResizeHandle as $ } from "./Panel.ResizeHandle.es.js";
-import { usePanelResize as b } from "./Panel.useResize.es.js";
-import { s as v } from "../../../chunks/panel.module.BblnuBjO.js";
-const { baseClassNamePrefix: x, variable: y } = h("panel"), j = ({
-  children: a,
-  panelClassName: l,
+import { PanelContext as j } from "./Panel.context.es.js";
+import { getPanelDismissConfig as A } from "./Panel.helpers.es.js";
+import { FloatingUIRoot as U } from "../../FloatingUI/FloatingUI.root.es.js";
+import { Content as q } from "../../FloatingUI/FloatingUI.content.es.js";
+import { a as E } from "../../../chunks/FloatingUI.context.Dl4Y1y1z.js";
+import { InlineDivider as H } from "./Panel.Divider.es.js";
+import { PanelResizeHandle as w } from "./Panel.ResizeHandle.es.js";
+import { usePanelResize as z } from "./Panel.useResize.es.js";
+import { s as h } from "../../../chunks/panel.module.CnHWv4EZ.js";
+const { baseClassNamePrefix: k, variable: F } = g("panel");
+function G(s, e, o) {
+  if (!(!s && !e && !o))
+    return {
+      ...s,
+      ...e,
+      ...o ? {
+        [F("offset-x")]: o.x,
+        [F("offset-y")]: o.y
+      } : null
+    };
+}
+const J = ({
+  children: s,
+  panelClassName: e,
   resolvedPosition: o,
-  showDivider: n,
-  dividerColor: e,
-  resizeConfig: i,
-  floatingOffset: r,
-  overlayDividerClassName: m,
-  isBlocking: f,
-  style: s,
-  ...c
+  showDivider: u,
+  dividerColor: t,
+  resizeConfig: a,
+  floatingOffset: c,
+  overlayDividerClassName: f,
+  isBlocking: d,
+  sizeStyle: p,
+  skipMountAnimation: v,
+  container: m,
+  style: x,
+  ...C
 }) => {
-  const { refs: p } = M(), { handleRef: d } = b({
-    resizeConfig: i,
+  const { refs: y } = E(), { handleRef: l } = z({
+    resizeConfig: a,
     position: o,
-    floatingRef: p.floating,
-    requireMount: !0
-  }), u = r ? {
-    ...s,
-    [y("offset-x")]: r.x,
-    [y("offset-y")]: r.y
-  } : s;
-  return /* @__PURE__ */ P(
-    D,
+    floatingRef: y.floating,
+    requireMount: !0,
+    container: m
+  }), r = G(x, p, c);
+  return /* @__PURE__ */ B(
+    q,
     {
-      className: l,
+      className: e,
       skipFloatingStyles: !0,
-      overlay: f,
-      ...c,
-      style: u,
+      overlay: d ? m ? { lockScroll: !1 } : !0 : !1,
+      ...C,
+      style: r,
       "data-position": o,
+      ...v ? { "data-status": "open" } : {},
       children: [
-        a,
-        n && /* @__PURE__ */ t(_, { position: o, className: m, dividerColor: e }),
-        i && /* @__PURE__ */ t($, { ref: d })
+        s,
+        u && /* @__PURE__ */ n(
+          H,
+          {
+            position: o,
+            className: f,
+            dividerColor: t
+          }
+        ),
+        a && /* @__PURE__ */ n(w, { ref: l })
       ]
     }
   );
-}, L = ({
-  contextValue: a,
-  panelClassName: l,
+}, so = ({
+  contextValue: s,
+  panelClassName: e,
   resolvedPosition: o,
-  showDivider: n,
-  modalType: e,
-  closeOnOutsidePress: i,
-  floatingOffset: r,
-  open: m,
-  onOpenChange: f,
-  transitionConfig: s,
-  dividerColor: c,
-  children: p,
-  resizeConfig: d,
-  ...u
+  showDivider: u,
+  modalType: t,
+  closeOnOutsidePress: a,
+  floatingOffset: c,
+  open: f,
+  onOpenChange: d,
+  transitionConfig: p,
+  dividerColor: v,
+  children: m,
+  resizeConfig: x,
+  sizeStyle: C,
+  skipMountAnimation: y,
+  container: l,
+  triggerRef: r,
+  ...I
 }) => {
-  const g = e === "isModal" || e === "alert", C = I(e, i), N = R(
-    v[`${x}__overlay-divider`],
-    v[`${x}__overlay-divider--${o}`]
+  const N = t === "isModal" || t === "alert", M = S(
+    (i) => {
+      const P = (r == null ? void 0 : r.current) ?? null;
+      return !(P && i.target instanceof Node && P.contains(i.target));
+    },
+    [r]
+  ), _ = $(() => {
+    const i = A(t, a);
+    return !r || !(t === "isModal" || t !== "alert" && !!a) ? i : { ...i ?? {}, outsidePress: M };
+  }, [t, a, r, M]), b = D(
+    h[`${k}__overlay-divider`],
+    h[`${k}__overlay-divider--${o}`]
   );
-  return /* @__PURE__ */ t(F.Provider, { value: a, children: /* @__PURE__ */ t(
-    B,
+  return /* @__PURE__ */ n(j.Provider, { value: s, children: /* @__PURE__ */ n(
+    U,
     {
-      open: m,
-      onOpenChange: f,
-      portalled: !0,
-      transitionConfig: s,
-      dismiss: C,
-      focusConfiguration: g ? !0 : { modal: !1, closeOnFocusOut: !1 },
-      children: /* @__PURE__ */ t(
-        j,
+      open: f,
+      onOpenChange: d,
+      portalled: l ? { root: l } : !0,
+      transitionConfig: p,
+      dismiss: _,
+      focusConfiguration: N ? !0 : { modal: !1, closeOnFocusOut: !1 },
+      children: /* @__PURE__ */ n(
+        J,
         {
-          panelClassName: l,
+          panelClassName: e,
           resolvedPosition: o,
-          showDivider: n,
-          dividerColor: c,
-          floatingOffset: r,
-          overlayDividerClassName: N,
-          isBlocking: g,
-          resizeConfig: d,
-          ...u,
-          role: e === "alert" ? "alertdialog" : "dialog",
-          "aria-modal": g || void 0,
-          children: p
+          showDivider: u,
+          dividerColor: v,
+          floatingOffset: c,
+          overlayDividerClassName: b,
+          isBlocking: N,
+          resizeConfig: x,
+          sizeStyle: C,
+          skipMountAnimation: y,
+          container: l,
+          ...I,
+          role: t === "alert" ? "alertdialog" : "dialog",
+          "aria-modal": N || void 0,
+          children: m
         }
       )
     }
   ) });
 };
 export {
-  L as OverlayPanel
+  so as OverlayPanel
 };

package/lib/wip/Panel/Panel.ResizeHandle.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("react"),n=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const l=require("../../../chunks/panel.module.CVyUzyCZ.js"),{baseClassNamePrefix:i}=n.getBEMClassNames("panel"),e=r.forwardRef((t,s)=>a.jsx("div",{ref:s,className:l.styles[`${i}__resize-handle`],"aria-hidden":!0,tabIndex:-1}));e.displayName="PanelResizeHandle";exports.PanelResizeHandle=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("react"),n=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const l=require("../../../chunks/panel.module.BVmRxZHo.js"),{baseClassNamePrefix:i}=n.getBEMClassNames("panel"),e=r.forwardRef((t,s)=>a.jsx("div",{ref:s,className:l.styles[`${i}__resize-handle`],"aria-hidden":!0,tabIndex:-1}));e.displayName="PanelResizeHandle";exports.PanelResizeHandle=e;

package/lib/wip/Panel/Panel.ResizeHandle.es.js

@@ -2,7 +2,7 @@ import { jsx as a } from "react/jsx-runtime";
 import { forwardRef as s } from "react";
 import { g as r } from "../../../chunks/classNames.BTJmrO_L.js";
 import "../../../chunks/constants.CKKGf1-i.js";
-import { s as o } from "../../../chunks/panel.module.BblnuBjO.js";
+import { s as o } from "../../../chunks/panel.module.CnHWv4EZ.js";
 const { baseClassNamePrefix: i } = r("panel"), m = s((t, e) => /* @__PURE__ */ a(
   "div",
   {

package/lib/wip/Panel/Panel.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("react/jsx-runtime"),M=require("clsx"),E=require("react"),V=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const W=require("./Header/Panel.Header.cjs.js"),G=require("./Panel.Body.cjs.js"),U=require("./Footer/Panel.Footer.cjs.js"),c=require("./Panel.helpers.cjs.js"),J=require("./Panel.Inline.cjs.js"),Q=require("./Panel.Overlay.cjs.js"),e=require("../../../chunks/panel.module.CVyUzyCZ.js"),X=165,Y=100,Z=(n,u)=>{if(!n||u==="full")return;const f=u==="bottom",l=typeof n=="object"?n:{},d=l.minSize??(f?Y:X),o=l.maxSize??1/0,P=l.storageKey??"";return{minSize:d,maxSize:o,storageKey:P}},{baseClassNamePrefix:s}=V.getBEMClassNames("panel"),_=({children:n,className:u,padding:f="md",onOpenChange:l,open:d,size:o="md",dismissible:P=!0,closeButtonAriaLabel:m="Close panel",kind:a="inline",position:y,divider:x=!0,dividerColor:g,isAnimated:v=!0,onBeforeClose:z,modalType:i,offset:N,resizable:B,id:O,...p})=>{const t=c.getResolvedPanelPosition(y),r=Z(B,t),D=!!r;if(process.env.NODE_ENV!=="production"){r&&!r.storageKey&&console.warn("Panel: provide a `storageKey` in the `resizable` config to persist panel size across sessions."),i==="alert"&&P&&console.warn('Panel: `dismissible` is ignored when `modalType="alert"`. The close button is always hidden.');const{closeOnOutsidePress:L}=p;L&&i!=="nonModal"&&i!==void 0&&console.warn('Panel: `closeOnOutsidePress` has no effect when `modalType` is not `"nonModal"`.')}const b=i==="alert"?!1:P,H=o&&(t!=="bottom"||o==="full"),w=a==="overlay"&&N?c.resolveOffset(N):void 0,q=!!w,$=M(e.styles[s],e.styles[`${s}--${a}`],H&&e.styles[`${s}--size-${o}`],e.styles[`${s}--padding-${f}`],e.styles[`${s}--position-${t}`],q&&e.styles[`${s}--floating`],D&&e.styles[`${s}--resizable`],u),T=M(e.styles[`${s}__inline-wrapper`],e.styles[`${s}__inline-wrapper--size-${o}`]),{requestClose:C,handleOverlayOpenChange:R}=c.usePanelClose(z,l),I=E.useMemo(()=>({kind:a,dismissible:b,closeButtonAriaLabel:m,position:y,requestClose:C}),[a,b,m,y,C]),{showDivider:j,dividerBefore:A,dividerInner:F,dividerAfter:K}=c.getPanelDividerState(x&&!q,t),h=E.useMemo(()=>({duration:v?c.PANEL_TRANSITION_DURATION_MS:0}),[v]);return a==="inline"?S.jsx(J.InlinePanel,{contextValue:I,panelClassName:$,inlineWrapperClassName:T,resolvedPosition:t,dividerBefore:A,dividerInner:F,dividerAfter:K,dividerColor:g,open:d,transitionConfig:h,resizeConfig:r,id:O,...p,children:n}):S.jsx(Q.OverlayPanel,{contextValue:I,panelClassName:$,resolvedPosition:t,showDivider:j,dividerColor:g,modalType:i,floatingOffset:w,open:d,onOpenChange:R,transitionConfig:h,resizeConfig:r,id:O,...p,children:n})};_.displayName="Panel";_.Header=W.Header;_.Body=G.Body;_.Footer=U.Footer;exports.Panel=_;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react/jsx-runtime"),T=require("clsx"),j=require("react"),ne=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const A=require("../../../utils/hooks/usePrevious.cjs.js"),oe=require("./Header/Panel.Header.cjs.js"),ie=require("./Panel.Body.cjs.js"),te=require("./Footer/Panel.Footer.cjs.js"),r=require("./Panel.helpers.cjs.js"),le=require("./Panel.Inline.cjs.js"),re=require("./Panel.Overlay.cjs.js"),n=require("../../../chunks/panel.module.BVmRxZHo.js"),ae=165,ce=100,ue=(e,f)=>{if(!e)return;const _=f==="bottom",a=typeof e=="object"?e:{},t=a.minSize??(_?ce:ae),y=a.maxSize??1/0,d=a.storageKey??"";return{minSize:t,maxSize:y,storageKey:d}},{baseClassNamePrefix:o,variable:ve}=ne.getBEMClassNames("panel");function de(e){return r.isPresetSize(e)?{overlaySizeClass:n.styles[`${o}--size-${e}`],inlineSizeClass:n.styles[`${o}__inline-wrapper--size-${e}`],sizeStyle:void 0}:e!==void 0?{overlaySizeClass:void 0,inlineSizeClass:void 0,sizeStyle:{[ve("size")]:e}}:{overlaySizeClass:void 0,inlineSizeClass:void 0,sizeStyle:void 0}}const v=({children:e,className:f,padding:_="md",onOpenChange:a,open:t,size:y,dismissible:d=!0,closeButtonAriaLabel:m="Close panel",kind:s="inline",position:P,divider:F=!0,dividerColor:S,isAnimated:C=!0,onBeforeClose:K,modalType:c,offset:w,resizable:L,id:z,...b})=>{const l=r.getResolvedPanelPosition(P),u=ue(L,l),V=!!u,{container:h,triggerRef:W,...N}=b,i=s==="overlay"?h:void 0;if(process.env.NODE_ENV!=="production"){u&&!u.storageKey&&console.warn("Panel: provide a `storageKey` in the `resizable` config to persist panel size across sessions."),c==="alert"&&d&&console.warn('Panel: `dismissible` is ignored when `modalType="alert"`. The close button is always hidden.');const{closeOnOutsidePress:se}=b;if(se&&c!=="nonModal"&&c!==void 0&&console.warn('Panel: `closeOnOutsidePress` has no effect when `modalType` is not `"nonModal"`.'),h&&s==="inline"&&console.warn('Panel: `container` has no effect when `kind="inline"`.'),i)try{if(typeof getComputedStyle=="function"){const p=getComputedStyle(i);p.position==="static"&&console.warn("Panel: container element should have `position: relative` (or another non-static value) for proper scoping.");const g=l==="bottom"?p.overflowY:p.overflowX;(g==="visible"||g==="auto"||g==="scroll")&&console.warn("Panel: container element should use `overflow: hidden` (or `clip`) so the slide-in/out transform does not trigger a transient scrollbar.")}}catch{}}const O=c==="alert"?!1:d,{overlaySizeClass:G,inlineSizeClass:U,sizeStyle:q}=de(y),$=s==="overlay"&&w?r.resolveOffset(w):void 0,I=!!$,M=T(n.styles[o],n.styles[`${o}--${s}`],s==="overlay"&&G,n.styles[`${o}--padding-${_}`],n.styles[`${o}--position-${l}`],I&&n.styles[`${o}--floating`],V&&n.styles[`${o}--resizable`],s==="overlay"&&i&&n.styles[`${o}--contained`],f),X=T(n.styles[`${o}__inline-wrapper`],U),{requestClose:x,handleOverlayOpenChange:Y}=r.usePanelClose(K,a),E=j.useMemo(()=>({kind:s,dismissible:O,closeButtonAriaLabel:m,position:P,requestClose:x}),[s,O,m,P,x]),{showDivider:J,dividerBefore:Q,dividerInner:Z,dividerAfter:k}=r.getPanelDividerState(F&&!I,l),B=j.useMemo(()=>({duration:C?r.PANEL_TRANSITION_DURATION_MS:0}),[C]),D=A.usePrevious(s),ee=A.usePrevious(i),H=D!==void 0&&D!==s&&t===!0||ee===null&&i!=null&&t===!0;return i===null?null:s==="inline"?R.jsx(le.InlinePanel,{contextValue:E,panelClassName:M,inlineWrapperClassName:X,resolvedPosition:l,dividerBefore:Q,dividerInner:Z,dividerAfter:k,dividerColor:S,open:t,transitionConfig:B,resizeConfig:u,skipMountAnimation:H,sizeStyle:q,id:z,...N,children:e}):R.jsx(re.OverlayPanel,{contextValue:E,panelClassName:M,resolvedPosition:l,showDivider:J,dividerColor:S,modalType:c,floatingOffset:$,open:t,onOpenChange:Y,transitionConfig:B,resizeConfig:u,skipMountAnimation:H,sizeStyle:q,id:z,...N,container:i,triggerRef:W,children:e})};v.displayName="Panel";v.Header=oe.Header;v.Body=ie.Body;v.Footer=te.Footer;exports.Panel=v;

package/lib/wip/Panel/Panel.d.ts

@@ -1,6 +1,6 @@
 import { PanelProps } from './Panel.types';
 export declare const Panel: {
-    ({ children, className: _className, padding, onOpenChange, open, size, dismissible, closeButtonAriaLabel, kind, position, divider, dividerColor, isAnimated, onBeforeClose, modalType, offset, resizable, id, ...panelProps }: PanelProps): JSX.Element;
+    ({ children, className: _className, padding, onOpenChange, open, size, dismissible, closeButtonAriaLabel, kind, position, divider, dividerColor, isAnimated, onBeforeClose, modalType, offset, resizable, id, ...panelProps }: PanelProps): JSX.Element | null;
     displayName: string;
     Header: {
         ({ children, className: _className, divider, dividerColor, backgroundColor, ...props }: import('./Panel.types').PanelHeaderProps): import("react/jsx-runtime").JSX.Element;