@viasat/beam-react 2.29.0 → 2.30.0

package/lib/_Options/useSelectValue.es.js

@@ -1,109 +1,123 @@
-import q, { useRef as h, useState as D, useEffect as L, useCallback as f, useMemo as O } from "react";
-import { useUniversalRef as G } from "../Form/hooks/useUniversalRef.hook.es.js";
+import q, { useRef as V, useState as G, useEffect as T, useCallback as f, useMemo as I } from "react";
+import { useUniversalRef as H } from "../Form/hooks/useUniversalRef.hook.es.js";
 import "../../chunks/constants.CKKGf1-i.js";
 import "react/jsx-runtime";
-import { F as H } from "../../chunks/form.context.D7b4066_.js";
+import { F as J } from "../../chunks/form.context.D7b4066_.js";
 import "../Form/contexts/label.context.es.js";
 import "../Form/contexts/helperText.context.es.js";
-const _ = ({
+const ee = ({
   value: e,
   defaultValue: b,
-  onChange: u,
+  onChange: l,
   name: d,
-  multiple: A = !1
-}, P) => {
-  const { refFn: g, ref: l } = G(P), { ctxInitialValues: T } = q.useContext(H), i = b || T[d], V = h(i);
-  V.current = i;
-  const [k, p] = D(i), y = e !== void 0, a = h(y);
+  multiple: x = !1
+}, k) => {
+  const { refFn: C, ref: c } = H(k), { ctxInitialValues: D } = q.useContext(J), i = b || D[d], F = V(i);
+  F.current = i;
+  const [U, v] = G(i), y = e !== void 0, a = V(y);
   a.current = y;
-  const R = y ? e : k, n = h(u);
-  n.current = u, L(() => {
-    a.current || p(i);
+  const M = y ? e : U, s = V(l);
+  s.current = l, T(() => {
+    a.current || v(i);
   }, [i]);
-  const x = f(
-    (t) => {
-      var S;
-      const s = Array.isArray(t) ? t : t !== void 0 && t !== "" && t !== null ? [t] : [], r = l.current;
-      if (!r) {
+  const p = f(
+    (r) => {
+      var L;
+      const n = P(r), t = c.current;
+      if (!t) {
         console.warn(
           "Component is controlled but selectRef is not set. This may lead to unexpected behavior."
-        ), (S = n.current) == null || S.call(n, {
-          target: { value: t }
+        ), (L = s.current) == null || L.call(s, {
+          target: { value: r }
         });
         return;
       }
-      const c = Array.from(r.options), U = Array.from(r.selectedOptions);
-      c.forEach((o) => {
-        o.selected = s.includes(o.value);
-      }), s.forEach((o) => {
-        const B = c.find((j) => j.value === o);
-        B && r.appendChild(B);
+      const u = Array.from(t.options), h = Array.from(t.selectedOptions);
+      u.forEach((o) => {
+        o.selected = n.includes(o.value);
+      }), n.forEach((o) => {
+        const O = u.find((j) => j.value === o);
+        O && t.appendChild(O);
       });
-      const w = new Event("change", { bubbles: !0 });
-      if (r.dispatchEvent(w), w.defaultPrevented) {
-        Array.from(r.options).forEach((o) => {
-          o.selected = U.includes(o);
-        }), c.reverse().forEach((o) => {
-          r.appendChild(o);
+      const B = new Event("change", { bubbles: !0 });
+      if (t.dispatchEvent(B), B.defaultPrevented) {
+        Array.from(t.options).forEach((o) => {
+          o.selected = h.includes(o);
+        }), u.reverse().forEach((o) => {
+          t.appendChild(o);
         });
         return;
       }
     },
-    [l]
+    [c]
   );
-  L(() => {
-    a.current && p(e);
+  T(() => {
+    a.current && v(e);
   }, [e]);
-  const C = f((t) => {
-    var s;
-    a.current ? (s = n.current) == null || s.call(n, t) : p(
-      Array.from(t.target.selectedOptions).filter((r) => r.selected && r.value !== "").map((r) => r.value)
+  const S = f((r) => {
+    var n;
+    a.current ? (n = s.current) == null || n.call(s, r) : v(
+      Array.from(r.target.selectedOptions).filter((t) => t.selected && t.value !== "").map((t) => t.value)
     );
-  }, []), F = f(() => {
-    var r, c;
-    const t = new FocusEvent("blur", { bubbles: !1 }), s = new FocusEvent("focusout", { bubbles: !0 });
-    (r = l.current) == null || r.dispatchEvent(t), (c = l.current) == null || c.dispatchEvent(s);
-  }, [l]), v = f(() => {
+  }, []), w = f(() => {
+    var t, u;
+    const r = new FocusEvent("blur", { bubbles: !1 }), n = new FocusEvent("focusout", { bubbles: !0 });
+    (t = c.current) == null || t.dispatchEvent(r), (u = c.current) == null || u.dispatchEvent(n);
+  }, [c]), A = f(() => {
     var t;
-    a.current ? (t = n.current) == null || t.call(n, {
-      target: { value: V.current }
-    }) : p(V.current);
-  }, []), m = h(null), M = f(
-    (t) => {
-      var s, r;
-      g(t), t ? (m.current = t.form, (r = m.current) == null || r.addEventListener("reset", v)) : ((s = m.current) == null || s.removeEventListener("reset", v), m.current = null);
+    const r = c.current, n = F.current;
+    if (r) {
+      const u = P(n);
+      Array.from(r.options).forEach((h) => {
+        h.defaultSelected = u.includes(h.value);
+      });
+    }
+    if (a.current) {
+      (t = s.current) == null || t.call(s, {
+        target: { value: n }
+      });
+      return;
+    }
+    r && p(n);
+  }, [p, c]), m = V(null), z = f(
+    (r) => {
+      var n, t;
+      C(r), r ? (m.current = r.form, (t = m.current) == null || t.addEventListener("reset", A)) : ((n = m.current) == null || n.removeEventListener("reset", A), m.current = null);
     },
-    [v, g]
-  ), E = O(() => ({
-    ref: M,
-    value: J(R, A),
-    onChange: C,
+    [A, C]
+  ), E = I(() => ({
+    ref: z,
+    value: K(M, x),
+    onChange: S,
     name: d
-  }), [M, A, R, C, d]);
-  return O(
+  }), [z, x, M, S, d]);
+  return I(
     () => ({
       selectProps: E,
       value: E.value,
-      singleValue: K(E.value),
-      setValue: x,
-      handleBlur: F
+      singleValue: N(E.value),
+      setValue: p,
+      handleBlur: w
     }),
-    [E, x, F]
+    [E, p, w]
   );
 };
-function z(e) {
+function g(e) {
   return e == null || e === "" || Array.isArray(e) && e.length === 0;
 }
-function I(e) {
+function R(e) {
   return Array.isArray(e);
 }
-function J(e, b) {
-  const u = I(e);
-  return b ? u ? e : z(e) ? [] : [e] : u ? z(e) ? "" : e[0] ?? "" : e ?? "";
+function P(e) {
+  return R(e) ? e : g(e) ? [] : [e];
+}
+function K(e, b) {
+  const l = R(e);
+  return b ? l ? e : g(e) ? [] : [e] : l ? g(e) ? "" : e[0] ?? "" : e ?? "";
 }
-function K(e) {
-  return I(e) ? e.length > 0 ? e[e.length - 1] : void 0 : e;
+function N(e) {
+  return R(e) ? e.length > 0 ? e[e.length - 1] : void 0 : e;
 }
 export {
-  _ as useSelectValue
+  ee as useSelectValue
 };

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=_;