@viasat/beam-react 2.29.1 → 2.30.0

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

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

@@ -14,6 +14,8 @@ type InlinePanelProps = {
     children: React.ReactNode;
     dividerColor?: PanelDividerColor;
     resizeConfig?: PanelResizeConfig;
+    /** 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, skipMountAnimation, ...props }: InlinePanelProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,15 +1,15 @@
-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 g, Fragment as F } from "react/jsx-runtime";
+import { useTransitionStatus as w } 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 = ({
+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 x } from "./Panel.Divider.es.js";
+import { PanelResizeHandle as y } from "./Panel.ResizeHandle.es.js";
+import { usePanelResize as B } from "./Panel.useResize.es.js";
+import { s as M } from "../../../chunks/panel.module.BblnuBjO.js";
+const { baseClassNamePrefix: S } = P("panel"), _ = ({
   children: s,
   panelClassName: o,
   inlineWrapperClassName: r,
@@ -18,43 +18,44 @@ const { baseClassNamePrefix: M } = w("panel"), S = ({
   dividerInner: m,
   dividerAfter: p,
   alwaysVisible: e,
+  skipMountAnimation: f,
   dividerColor: a,
   resizeConfig: i,
-  ...f
+  ...c
 }) => {
   const {
-    context: c,
-    transitionConfig: u,
-    refs: x
-  } = b(), { isMounted: I, status: h } = F(
-    c,
-    u
-  ), N = e && h === "initial" ? "open" : h, { handleRef: R } = y({
+    context: u,
+    transitionConfig: d,
+    refs: h
+  } = j(), { isMounted: N, status: I } = w(
+    u,
+    d
+  ), R = (e || f) && I === "initial" ? "open" : I, { handleRef: C } = B({
     resizeConfig: i,
     position: n,
-    floatingRef: x.floating
+    floatingRef: h.floating
   });
-  return I ? /* @__PURE__ */ d(C, { children: [
-    l && /* @__PURE__ */ t(g, { position: n, dividerColor: a }),
+  return N ? /* @__PURE__ */ g(F, { children: [
+    l && /* @__PURE__ */ t(x, { position: n, dividerColor: a }),
     /* @__PURE__ */ t(
       "div",
       {
-        ref: x.setFloating,
+        ref: h.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: [
+        "data-status": R,
+        children: /* @__PURE__ */ g("div", { className: M[`${S}__inline-wrapper-content`], children: [
+          m && /* @__PURE__ */ t(x, { position: n, dividerColor: a }),
+          /* @__PURE__ */ g("aside", { ...c, className: o, children: [
             s,
-            i && /* @__PURE__ */ t(j, { ref: R })
+            i && /* @__PURE__ */ t(y, { ref: C })
           ] })
         ] })
       }
     ),
-    p && /* @__PURE__ */ t(g, { position: n, dividerColor: a })
+    p && /* @__PURE__ */ t(x, { position: n, dividerColor: a })
   ] }) : null;
-}, A = ({
+}, G = ({
   contextValue: s,
   panelClassName: o,
   inlineWrapperClassName: r,
@@ -63,19 +64,20 @@ const { baseClassNamePrefix: M } = w("panel"), S = ({
   dividerInner: m,
   dividerAfter: p,
   open: e,
-  transitionConfig: a,
-  dividerColor: i,
-  children: f,
+  transitionConfig: f,
+  dividerColor: a,
+  children: i,
   resizeConfig: c,
-  ...u
-}) => /* @__PURE__ */ t(P.Provider, { value: s, children: /* @__PURE__ */ t(
-  U,
+  skipMountAnimation: u,
+  ...d
+}) => /* @__PURE__ */ t(U.Provider, { value: s, children: /* @__PURE__ */ t(
+  b,
   {
     open: e ?? !0,
     portalled: !1,
-    transitionConfig: a,
+    transitionConfig: f,
     children: /* @__PURE__ */ t(
-      S,
+      _,
       {
         panelClassName: o,
         inlineWrapperClassName: r,
@@ -83,15 +85,16 @@ const { baseClassNamePrefix: M } = w("panel"), S = ({
         dividerBefore: l,
         dividerInner: m,
         dividerAfter: p,
-        dividerColor: i,
+        dividerColor: a,
         alwaysVisible: e === void 0,
+        skipMountAnimation: u,
         resizeConfig: c,
-        ...u,
-        children: f
+        ...d,
+        children: i
       }
     )
   }
 ) });
 export {
-  A as InlinePanel
+  G 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 l=require("react/jsx-runtime"),p=require("clsx"),F=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const I=require("./Panel.context.cjs.js"),j=require("./Panel.helpers.cjs.js"),C=require("../../FloatingUI/FloatingUI.root.cjs.js"),R=require("../../FloatingUI/FloatingUI.content.cjs.js"),U=require("../../../chunks/FloatingUI.context.B15Tz_4h.js"),N=require("./Panel.Divider.cjs.js"),h=require("./Panel.ResizeHandle.cjs.js"),w=require("./Panel.useResize.cjs.js"),v=require("../../../chunks/panel.module.CVyUzyCZ.js"),{baseClassNamePrefix:y,variable:b}=F.getBEMClassNames("panel"),D=({children:a,panelClassName:r,resolvedPosition:e,showDivider:o,dividerColor:n,resizeConfig:s,floatingOffset:i,overlayDividerClassName:c,isBlocking:u,skipMountAnimation:_,style:t,...d})=>{const{refs:g}=U.useBmFloatingUIContext(),{handleRef:P}=w.usePanelResize({resizeConfig:s,position:e,floatingRef:g.floating,requireMount:!0}),x=i?{...t,[b("offset-x")]:i.x,[b("offset-y")]:i.y}:t;return l.jsxs(R.Content,{className:r,skipFloatingStyles:!0,overlay:u,...d,style:x,"data-position":e,..._?{"data-status":"open"}:{},children:[a,o&&l.jsx(N.InlineDivider,{position:e,className:c,dividerColor:n}),s&&l.jsx(h.PanelResizeHandle,{ref:P})]})},M=({contextValue:a,panelClassName:r,resolvedPosition:e,showDivider:o,modalType:n,closeOnOutsidePress:s,floatingOffset:i,open:c,onOpenChange:u,transitionConfig:_,dividerColor:t,children:d,resizeConfig:g,skipMountAnimation:P,...x})=>{const q=n==="isModal"||n==="alert",f=j.getPanelDismissConfig(n,s),m=p(v.styles[`${y}__overlay-divider`],v.styles[`${y}__overlay-divider--${e}`]);return l.jsx(I.PanelContext.Provider,{value:a,children:l.jsx(C.FloatingUIRoot,{open:c,onOpenChange:u,portalled:!0,transitionConfig:_,dismiss:f,focusConfiguration:q?!0:{modal:!1,closeOnFocusOut:!1},children:l.jsx(D,{panelClassName:r,resolvedPosition:e,showDivider:o,dividerColor:t,floatingOffset:i,overlayDividerClassName:m,isBlocking:q,resizeConfig:g,skipMountAnimation:P,...x,role:n==="alert"?"alertdialog":"dialog","aria-modal":q||void 0,children:d})})})};exports.OverlayPanel=M;

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

@@ -16,6 +16,8 @@ type OverlayPanelProps = {
     children: React.ReactNode;
     dividerColor?: PanelDividerColor;
     resizeConfig?: PanelResizeConfig;
+    /** Forwarded from Panel: when true, suppress the slide-in animation on this mount. */
+    skipMountAnimation?: boolean;
 } & 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;
+export declare const OverlayPanel: ({ contextValue, panelClassName, resolvedPosition, showDivider, modalType, closeOnOutsidePress, floatingOffset, open, onOpenChange, transitionConfig, dividerColor, children, resizeConfig, skipMountAnimation, ...props }: OverlayPanelProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,98 +1,109 @@
-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 t, jsxs as R } from "react/jsx-runtime";
+import h from "clsx";
+import { g as F } 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,
+import { PanelContext as I } from "./Panel.context.es.js";
+import { getPanelDismissConfig as B } from "./Panel.helpers.es.js";
+import { FloatingUIRoot as D } from "../../FloatingUI/FloatingUI.root.es.js";
+import { Content as M } from "../../FloatingUI/FloatingUI.content.es.js";
+import { a as _ } from "../../../chunks/FloatingUI.context.Dl4Y1y1z.js";
+import { InlineDivider as $ } from "./Panel.Divider.es.js";
+import { PanelResizeHandle as b } from "./Panel.ResizeHandle.es.js";
+import { usePanelResize as j } from "./Panel.useResize.es.js";
+import { s as x } from "../../../chunks/panel.module.BblnuBjO.js";
+const { baseClassNamePrefix: y, variable: C } = F("panel"), k = ({
+  children: i,
   panelClassName: l,
   resolvedPosition: o,
   showDivider: n,
   dividerColor: e,
-  resizeConfig: i,
+  resizeConfig: a,
   floatingOffset: r,
   overlayDividerClassName: m,
   isBlocking: f,
+  skipMountAnimation: c,
   style: s,
-  ...c
+  ...p
 }) => {
-  const { refs: p } = M(), { handleRef: d } = b({
-    resizeConfig: i,
+  const { refs: d } = _(), { handleRef: u } = j({
+    resizeConfig: a,
     position: o,
-    floatingRef: p.floating,
+    floatingRef: d.floating,
     requireMount: !0
-  }), u = r ? {
+  }), g = r ? {
     ...s,
-    [y("offset-x")]: r.x,
-    [y("offset-y")]: r.y
+    [C("offset-x")]: r.x,
+    [C("offset-y")]: r.y
   } : s;
-  return /* @__PURE__ */ P(
-    D,
+  return /* @__PURE__ */ R(
+    M,
     {
       className: l,
       skipFloatingStyles: !0,
       overlay: f,
-      ...c,
-      style: u,
+      ...p,
+      style: g,
       "data-position": o,
+      ...c ? { "data-status": "open" } : {},
       children: [
-        a,
-        n && /* @__PURE__ */ t(_, { position: o, className: m, dividerColor: e }),
-        i && /* @__PURE__ */ t($, { ref: d })
+        i,
+        n && /* @__PURE__ */ t(
+          $,
+          {
+            position: o,
+            className: m,
+            dividerColor: e
+          }
+        ),
+        a && /* @__PURE__ */ t(b, { ref: u })
       ]
     }
   );
-}, L = ({
-  contextValue: a,
+}, Q = ({
+  contextValue: i,
   panelClassName: l,
   resolvedPosition: o,
   showDivider: n,
   modalType: e,
-  closeOnOutsidePress: i,
+  closeOnOutsidePress: a,
   floatingOffset: r,
   open: m,
   onOpenChange: f,
-  transitionConfig: s,
-  dividerColor: c,
+  transitionConfig: c,
+  dividerColor: s,
   children: p,
   resizeConfig: d,
-  ...u
+  skipMountAnimation: u,
+  ...g
 }) => {
-  const g = e === "isModal" || e === "alert", C = I(e, i), N = R(
-    v[`${x}__overlay-divider`],
-    v[`${x}__overlay-divider--${o}`]
+  const v = e === "isModal" || e === "alert", N = B(e, a), P = h(
+    x[`${y}__overlay-divider`],
+    x[`${y}__overlay-divider--${o}`]
   );
-  return /* @__PURE__ */ t(F.Provider, { value: a, children: /* @__PURE__ */ t(
-    B,
+  return /* @__PURE__ */ t(I.Provider, { value: i, children: /* @__PURE__ */ t(
+    D,
     {
       open: m,
       onOpenChange: f,
       portalled: !0,
-      transitionConfig: s,
-      dismiss: C,
-      focusConfiguration: g ? !0 : { modal: !1, closeOnFocusOut: !1 },
+      transitionConfig: c,
+      dismiss: N,
+      focusConfiguration: v ? !0 : { modal: !1, closeOnFocusOut: !1 },
       children: /* @__PURE__ */ t(
-        j,
+        k,
         {
           panelClassName: l,
           resolvedPosition: o,
           showDivider: n,
-          dividerColor: c,
+          dividerColor: s,
           floatingOffset: r,
-          overlayDividerClassName: N,
-          isBlocking: g,
+          overlayDividerClassName: P,
+          isBlocking: v,
           resizeConfig: d,
-          ...u,
+          skipMountAnimation: u,
+          ...g,
           role: e === "alert" ? "alertdialog" : "dialog",
-          "aria-modal": g || void 0,
+          "aria-modal": v || void 0,
           children: p
         }
       )
@@ -100,5 +111,5 @@ const { baseClassNamePrefix: x, variable: y } = h("panel"), j = ({
   ) });
 };
 export {
-  L as OverlayPanel
+  Q as OverlayPanel
 };

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 x=require("react/jsx-runtime"),z=require("clsx"),g=require("react"),W=require("../../../chunks/classNames.DAeKwerT.js");require("../../../chunks/constants.hwjHOsvT.js");const G=require("./Header/Panel.Header.cjs.js"),U=require("./Panel.Body.cjs.js"),Q=require("./Footer/Panel.Footer.cjs.js"),u=require("./Panel.helpers.cjs.js"),X=require("./Panel.Inline.cjs.js"),Y=require("./Panel.Overlay.cjs.js"),e=require("../../../chunks/panel.module.CVyUzyCZ.js"),Z=165,k=100,ee=(t,d)=>{if(!t||d==="full")return;const f=d==="bottom",i=typeof t=="object"?t:{},r=i.minSize??(f?k:Z),o=i.maxSize??1/0,P=i.storageKey??"";return{minSize:r,maxSize:o,storageKey:P}},{baseClassNamePrefix:s}=W.getBEMClassNames("panel"),_=({children:t,className:d,padding:f="md",onOpenChange:i,open:r,size:o="md",dismissible:P=!0,closeButtonAriaLabel:v="Close panel",kind:n="inline",position:y,divider:R=!0,dividerColor:N,isAnimated:O=!0,onBeforeClose:B,modalType:a,offset:b,resizable:D,id:w,...p})=>{const l=u.getResolvedPanelPosition(y),c=ee(D,l),H=!!c;if(process.env.NODE_ENV!=="production"){c&&!c.storageKey&&console.warn("Panel: provide a `storageKey` in the `resizable` config to persist panel size across sessions."),a==="alert"&&P&&console.warn('Panel: `dismissible` is ignored when `modalType="alert"`. The close button is always hidden.');const{closeOnOutsidePress:V}=p;V&&a!=="nonModal"&&a!==void 0&&console.warn('Panel: `closeOnOutsidePress` has no effect when `modalType` is not `"nonModal"`.')}const C=a==="alert"?!1:P,T=o&&(l!=="bottom"||o==="full"),h=n==="overlay"&&b?u.resolveOffset(b):void 0,q=!!h,$=z(e.styles[s],e.styles[`${s}--${n}`],T&&e.styles[`${s}--size-${o}`],e.styles[`${s}--padding-${f}`],e.styles[`${s}--position-${l}`],q&&e.styles[`${s}--floating`],H&&e.styles[`${s}--resizable`],d),A=z(e.styles[`${s}__inline-wrapper`],e.styles[`${s}__inline-wrapper--size-${o}`]),{requestClose:I,handleOverlayOpenChange:j}=u.usePanelClose(B,i),M=g.useMemo(()=>({kind:n,dismissible:C,closeButtonAriaLabel:v,position:y,requestClose:I}),[n,C,v,y,I]),{showDivider:F,dividerBefore:K,dividerInner:J,dividerAfter:L}=u.getPanelDividerState(R&&!q,l),S=g.useMemo(()=>({duration:O?u.PANEL_TRANSITION_DURATION_MS:0}),[O]),m=g.useRef(void 0),E=m.current!==void 0&&m.current!==n&&r===!0;return m.current=n,n==="inline"?x.jsx(X.InlinePanel,{contextValue:M,panelClassName:$,inlineWrapperClassName:A,resolvedPosition:l,dividerBefore:K,dividerInner:J,dividerAfter:L,dividerColor:N,open:r,transitionConfig:S,resizeConfig:c,skipMountAnimation:E,id:w,...p,children:t}):x.jsx(Y.OverlayPanel,{contextValue:M,panelClassName:$,resolvedPosition:l,showDivider:F,dividerColor:N,modalType:a,floatingOffset:h,open:r,onOpenChange:j,transitionConfig:S,resizeConfig:c,skipMountAnimation:E,id:w,...p,children:t})};_.displayName="Panel";_.Header=G.Header;_.Body=U.Body;_.Footer=Q.Footer;exports.Panel=_;

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

@@ -1,116 +1,124 @@
-import { jsx as E } from "react/jsx-runtime";
-import S from "clsx";
-import { useMemo as z } from "react";
-import { g as V } from "../../../chunks/classNames.BTJmrO_L.js";
+import { jsx as S } from "react/jsx-runtime";
+import z from "clsx";
+import { useMemo as x, useRef as W } from "react";
+import { g as q } from "../../../chunks/classNames.BTJmrO_L.js";
 import "../../../chunks/constants.CKKGf1-i.js";
-import { Header as W } from "./Header/Panel.Header.es.js";
-import { Body as q } from "./Panel.Body.es.js";
-import { Footer as G } from "./Footer/Panel.Footer.es.js";
-import { resolveOffset as U, usePanelClose as J, getPanelDividerState as Q, PANEL_TRANSITION_DURATION_MS as X, getResolvedPanelPosition as Y } from "./Panel.helpers.es.js";
-import { InlinePanel as Z } from "./Panel.Inline.es.js";
-import { OverlayPanel as k } from "./Panel.Overlay.es.js";
+import { Header as G } from "./Header/Panel.Header.es.js";
+import { Body as U } from "./Panel.Body.es.js";
+import { Footer as Q } from "./Footer/Panel.Footer.es.js";
+import { resolveOffset as X, usePanelClose as Y, getPanelDividerState as Z, PANEL_TRANSITION_DURATION_MS as k, getResolvedPanelPosition as ee } from "./Panel.helpers.es.js";
+import { InlinePanel as oe } from "./Panel.Inline.es.js";
+import { OverlayPanel as se } from "./Panel.Overlay.es.js";
 import { s as e } from "../../../chunks/panel.module.BblnuBjO.js";
-const ee = 165, oe = 100, se = (s, m) => {
-  if (!s || m === "full") return;
-  const p = m === "bottom", r = typeof s == "object" ? s : {}, c = r.minSize ?? (p ? oe : ee), n = r.maxSize ?? 1 / 0, f = r.storageKey ?? "";
-  return { minSize: c, maxSize: n, storageKey: f };
-}, { baseClassNamePrefix: o } = V("panel"), d = ({
-  children: s,
+const ne = 165, te = 100, re = (n, m) => {
+  if (!n || m === "full") return;
+  const p = m === "bottom", i = typeof n == "object" ? n : {}, a = i.minSize ?? (p ? te : ne), t = i.maxSize ?? 1 / 0, f = i.storageKey ?? "";
+  return { minSize: a, maxSize: t, storageKey: f };
+}, { baseClassNamePrefix: o } = q("panel"), d = ({
+  children: n,
   className: m,
   padding: p = "md",
-  onOpenChange: r,
-  open: c,
-  size: n = "md",
+  onOpenChange: i,
+  open: a,
+  size: t = "md",
   dismissible: f = !0,
   closeButtonAriaLabel: N = "Close panel",
-  kind: i = "inline",
-  position: g,
-  divider: M = !0,
-  dividerColor: v,
-  isAnimated: P = !0,
-  onBeforeClose: x,
-  modalType: a,
-  offset: O,
-  resizable: D,
+  kind: s = "inline",
+  position: u,
+  divider: D = !0,
+  dividerColor: P,
+  isAnimated: O = !0,
+  onBeforeClose: A,
+  modalType: l,
+  offset: C,
+  resizable: B,
   id: _,
-  ...u
+  ...g
 }) => {
-  const t = Y(g), l = se(D, t), B = !!l;
+  const r = ee(u), c = re(B, r), R = !!c;
   if (process.env.NODE_ENV !== "production") {
-    l && !l.storageKey && console.warn("Panel: provide a `storageKey` in the `resizable` config to persist panel size across sessions."), a === "alert" && f && console.warn('Panel: `dismissible` is ignored when `modalType="alert"`. The close button is always hidden.');
-    const { closeOnOutsidePress: L } = u;
-    L && a !== "nonModal" && a !== void 0 && console.warn('Panel: `closeOnOutsidePress` has no effect when `modalType` is not `"nonModal"`.');
+    c && !c.storageKey && console.warn(
+      "Panel: provide a `storageKey` in the `resizable` config to persist panel size across sessions."
+    ), l === "alert" && f && console.warn(
+      'Panel: `dismissible` is ignored when `modalType="alert"`. The close button is always hidden.'
+    );
+    const { closeOnOutsidePress: V } = g;
+    V && l !== "nonModal" && l !== void 0 && console.warn(
+      'Panel: `closeOnOutsidePress` has no effect when `modalType` is not `"nonModal"`.'
+    );
   }
-  const y = a === "alert" ? !1 : f, T = n && (t !== "bottom" || n === "full"), $ = i === "overlay" && O ? U(O) : void 0, C = !!$, I = S(
+  const y = l === "alert" ? !1 : f, T = t && (r !== "bottom" || t === "full"), $ = s === "overlay" && C ? X(C) : void 0, h = !!$, I = z(
     e[o],
-    e[`${o}--${i}`],
-    T && e[`${o}--size-${n}`],
+    e[`${o}--${s}`],
+    T && e[`${o}--size-${t}`],
     e[`${o}--padding-${p}`],
-    e[`${o}--position-${t}`],
-    C && e[`${o}--floating`],
-    B && e[`${o}--resizable`],
+    e[`${o}--position-${r}`],
+    h && e[`${o}--floating`],
+    R && e[`${o}--resizable`],
     m
-  ), A = S(
+  ), H = z(
     e[`${o}__inline-wrapper`],
-    e[`${o}__inline-wrapper--size-${n}`]
-  ), { requestClose: h, handleOverlayOpenChange: H } = J(
-    x,
-    r
-  ), b = z(
+    e[`${o}__inline-wrapper--size-${t}`]
+  ), { requestClose: b, handleOverlayOpenChange: K } = Y(
+    A,
+    i
+  ), w = x(
     () => ({
-      kind: i,
+      kind: s,
       dismissible: y,
       closeButtonAriaLabel: N,
-      position: g,
-      requestClose: h
+      position: u,
+      requestClose: b
     }),
-    [i, y, N, g, h]
-  ), { showDivider: K, dividerBefore: R, dividerInner: F, dividerAfter: j } = Q(M && !C, t), w = z(
-    () => ({ duration: P ? X : 0 }),
-    [P]
-  );
-  return i === "inline" ? /* @__PURE__ */ E(
-    Z,
+    [s, y, N, u, b]
+  ), { showDivider: F, dividerBefore: j, dividerInner: J, dividerAfter: L } = Z(D && !h, r), E = x(
+    () => ({ duration: O ? k : 0 }),
+    [O]
+  ), v = W(void 0), M = v.current !== void 0 && v.current !== s && a === !0;
+  return v.current = s, s === "inline" ? /* @__PURE__ */ S(
+    oe,
     {
-      contextValue: b,
+      contextValue: w,
       panelClassName: I,
-      inlineWrapperClassName: A,
-      resolvedPosition: t,
-      dividerBefore: R,
-      dividerInner: F,
-      dividerAfter: j,
-      dividerColor: v,
-      open: c,
-      transitionConfig: w,
-      resizeConfig: l,
+      inlineWrapperClassName: H,
+      resolvedPosition: r,
+      dividerBefore: j,
+      dividerInner: J,
+      dividerAfter: L,
+      dividerColor: P,
+      open: a,
+      transitionConfig: E,
+      resizeConfig: c,
+      skipMountAnimation: M,
       id: _,
-      ...u,
-      children: s
+      ...g,
+      children: n
     }
-  ) : /* @__PURE__ */ E(
-    k,
+  ) : /* @__PURE__ */ S(
+    se,
     {
-      contextValue: b,
+      contextValue: w,
       panelClassName: I,
-      resolvedPosition: t,
-      showDivider: K,
-      dividerColor: v,
-      modalType: a,
+      resolvedPosition: r,
+      showDivider: F,
+      dividerColor: P,
+      modalType: l,
       floatingOffset: $,
-      open: c,
-      onOpenChange: H,
-      transitionConfig: w,
-      resizeConfig: l,
+      open: a,
+      onOpenChange: K,
+      transitionConfig: E,
+      resizeConfig: c,
+      skipMountAnimation: M,
       id: _,
-      ...u,
-      children: s
+      ...g,
+      children: n
     }
   );
 };
 d.displayName = "Panel";
-d.Header = W;
-d.Body = q;
-d.Footer = G;
+d.Header = G;
+d.Body = U;
+d.Footer = Q;
 export {
   d as Panel
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viasat/beam-react",
-  "version": "2.29.1",
+  "version": "2.30.0",
   "description": "React component library for the Beam design system",
   "license": "MIT",
   "author": "Viasat",
@@ -59,11 +59,11 @@
     "access": "public"
   },
   "dependencies": {
-    "@viasat/beam-fonts": "2.29.1",
-    "@viasat/beam-shared": "2.29.1",
-    "@viasat/beam-styles": "2.29.1",
-    "@viasat/beam-tokens": "2.29.1",
-    "@viasat/beam-icons": "2.29.1",
+    "@viasat/beam-fonts": "2.30.0",
+    "@viasat/beam-shared": "2.30.0",
+    "@viasat/beam-styles": "2.30.0",
+    "@viasat/beam-tokens": "2.30.0",
+    "@viasat/beam-icons": "2.30.0",
     "clsx": "^1.2.1",
     "@floating-ui/react": "^0.26.18",
     "@stepperize/react": "^5.1.5",