@stackone/malachite 2.63.0 → 2.65.0

package/dist/components/CloseButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CloseButton.js","sources":["../../src/components/CloseButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport DismissIcon from './CustomIcons/DismissIcon';\nimport { FOCUS_RING, FOCUS_RING_CLOSE_BUTTON_INVERSE } from './focusRing';\n\nexport type CloseButtonSize = 'small' | 'medium';\n\n/** `inverse` is for a surface that stays dark in every theme, e.g. `SplitScreenLayout`'s panel. */\nexport type CloseButtonSurface = 'default' | 'inverse';\n\nexport interface CloseButtonProps\n    extends Omit<\n        React.ButtonHTMLAttributes<HTMLButtonElement>,\n        | 'children'\n        | 'className'\n        | 'style'\n        | 'color'\n        | 'type'\n        | 'disabled'\n        | 'onClick'\n        | 'aria-label'\n        | 'aria-disabled'\n        | 'aria-busy'\n    > {\n    onClick?: React.MouseEventHandler<HTMLButtonElement>;\n    /** Accessible name. Defaults to \"Close\"; name what closes when there are several. */\n    'aria-label'?: string;\n    'aria-labelledby'?: string;\n    disabled?: boolean;\n    /** Shows a spinner in place of the X, sets `aria-busy` and ignores clicks. */\n    loading?: boolean;\n    /** `small` is a 24px target, `medium` a 32px one. The glyph is 12px in both. */\n    size?: CloseButtonSize;\n    surface?: CloseButtonSurface;\n    className?: string;\n}\n\nconst SIZE_PX: Record<CloseButtonSize, { target: number; glyph: number }> = {\n    small: { target: 24, glyph: 12 },\n    medium: { target: 32, glyph: 12 },\n};\n\nconst SURFACE_CLASSES: Record<\n    CloseButtonSurface,\n    { idle: string; interactive: string; disabled: string; focusRing: string }\n> = {\n    default: {\n        idle: 'text-[var(--malachite-text-secondary,rgb(123,123,123))]',\n        interactive:\n            'hover:text-[var(--malachite-text-primary,rgb(10,10,10))] focus-visible:text-[var(--malachite-text-primary,rgb(10,10,10))]',\n        disabled: 'text-[var(--malachite-text-dimmed,rgb(161,161,161))]',\n        focusRing: FOCUS_RING,\n    },\n    inverse: {\n        idle: 'text-[var(--malachite-close-button-inverse-foreground,rgba(255,255,255,0.7))]',\n        interactive:\n            'hover:text-[var(--malachite-close-button-inverse-hover-foreground,rgb(255,255,255))] focus-visible:text-[var(--malachite-close-button-inverse-hover-foreground,rgb(255,255,255))]',\n        disabled:\n            'text-[var(--malachite-close-button-inverse-disabled-foreground,rgba(255,255,255,0.35))]',\n        focusRing: FOCUS_RING_CLOSE_BUTTON_INVERSE,\n    },\n};\n\ntype CloseButtonState = 'enabled' | 'disabled' | 'loading';\n\nconst stateClassesOf = (surface: CloseButtonSurface, state: CloseButtonState): string => {\n    const { idle, interactive, disabled, focusRing } = SURFACE_CLASSES[surface];\n    const byState: Record<CloseButtonState, string> = {\n        enabled: `${idle} ${interactive} cursor-pointer`,\n        disabled: `${disabled} cursor-not-allowed`,\n        loading: `${idle} cursor-progress`,\n    };\n    return `${byState[state]} ${focusRing}`;\n};\n\nconst BASE_CLASSES =\n    'flex shrink-0 items-center justify-center rounded-md border-0 bg-transparent p-0 transition-colors';\n\n// A click on an aria-disabled button still dispatches, so stop it before an ancestor's handler runs.\nconst swallowClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    event.preventDefault();\n    event.stopPropagation();\n};\n\n/** The bare X that dismisses a screen or panel: no box at rest or on hover. */\nconst CloseButton = forwardRef<HTMLButtonElement, CloseButtonProps>(\n    (\n        {\n            onClick,\n            'aria-label': ariaLabel = 'Close',\n            'aria-labelledby': ariaLabelledBy,\n            disabled = false,\n            loading = false,\n            size = 'small',\n            surface = 'default',\n            className = '',\n            ...rest\n        },\n        ref,\n    ) => {\n        const { target, glyph } = SIZE_PX[size];\n        const state: CloseButtonState =\n            (disabled && 'disabled') || (loading && 'loading') || 'enabled';\n        const inactive = state !== 'enabled';\n\n        return (\n            <button\n                {...rest}\n                ref={ref}\n                type=\"button\"\n                aria-label={ariaLabel}\n                aria-labelledby={ariaLabelledBy}\n                // aria-disabled, not `disabled`: a disabled element gets no pointer events, so a\n                // wrapping Tooltip could never explain it, and focus would drop to <body> mid-request.\n                aria-disabled={inactive ? true : undefined}\n                aria-busy={loading ? true : undefined}\n                onClick={inactive ? swallowClick : onClick}\n                className={`${BASE_CLASSES} ${stateClassesOf(surface, state)} ${className}`}\n                style={{ width: target, height: target }}\n            >\n                {loading ? (\n                    // Not `Spinner`: its smallest step is 14px inside a min-height wrapper.\n                    <span\n                        aria-hidden\n                        className=\"box-border shrink-0 animate-spin rounded-full border-2 border-solid border-current border-t-transparent motion-reduce:animate-none motion-reduce:border-t-current\"\n                        style={{ width: glyph, height: glyph }}\n                    />\n                ) : (\n                    <DismissIcon size={glyph} />\n                )}\n            </button>\n        );\n    },\n);\n\nCloseButton.displayName = 'CloseButton';\n\nexport default CloseButton;\nexport { CloseButton };\n"],"names":["SIZE_PX","SURFACE_CLASSES","FOCUS_RING","FOCUS_RING_CLOSE_BUTTON_INVERSE","stateClassesOf","surface","state","idle","interactive","disabled","focusRing","BASE_CLASSES","swallowClick","event","CloseButton","forwardRef","onClick","ariaLabel","ariaLabelledBy","loading","size","className","rest","ref","target","glyph","inactive","jsx","DismissIcon"],"mappings":";;;;AAoCA,MAAMA,IAAsE;AAAA,EACxE,OAAO,EAAE,QAAQ,IAAI,OAAO,GAAA;AAAA,EAC5B,QAAQ,EAAE,QAAQ,IAAI,OAAO,GAAA;AACjC,GAEMC,IAGF;AAAA,EACA,SAAS;AAAA,IACL,MAAM;AAAA,IACN,aACI;AAAA,IACJ,UAAU;AAAA,IACV,WAAWC;AAAA,EAAA;AAAA,EAEf,SAAS;AAAA,IACL,MAAM;AAAA,IACN,aACI;AAAA,IACJ,UACI;AAAA,IACJ,WAAWC;AAAA,EAAA;AAEnB,GAIMC,IAAiB,CAACC,GAA6BC,MAAoC;AACrF,QAAM,EAAE,MAAAC,GAAM,aAAAC,GAAa,UAAAC,GAAU,WAAAC,EAAA,IAAcT,EAAgBI,CAAO;AAM1E,SAAO,GAL2C;AAAA,IAC9C,SAAS,GAAGE,CAAI,IAAIC,CAAW;AAAA,IAC/B,UAAU,GAAGC,CAAQ;AAAA,IACrB,SAAS,GAAGF,CAAI;AAAA,EAAA,EAEFD,CAAK,CAAC,IAAII,CAAS;AACzC,GAEMC,IACF,sGAGEC,IAAe,CAACC,MAA+C;AACjE,EAAAA,EAAM,eAAA,GACNA,EAAM,gBAAA;AACV,GAGMC,IAAcC;AAAA,EAChB,CACI;AAAA,IACI,SAAAC;AAAA,IACA,cAAcC,IAAY;AAAA,IAC1B,mBAAmBC;AAAA,IACnB,UAAAT,IAAW;AAAA,IACX,SAAAU,IAAU;AAAA,IACV,MAAAC,IAAO;AAAA,IACP,SAAAf,IAAU;AAAA,IACV,WAAAgB,IAAY;AAAA,IACZ,GAAGC;AAAA,EAAA,GAEPC,MACC;AACD,UAAM,EAAE,QAAAC,GAAQ,OAAAC,MAAUzB,EAAQoB,CAAI,GAChCd,IACDG,KAAY,cAAgBU,KAAW,aAAc,WACpDO,IAAWpB,MAAU;AAE3B,WACI,gBAAAqB;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAGL;AAAA,QACJ,KAAAC;AAAA,QACA,MAAK;AAAA,QACL,cAAYN;AAAA,QACZ,mBAAiBC;AAAA,QAGjB,iBAAeQ,IAAW,KAAO;AAAA,QACjC,aAAWP,IAAU,KAAO;AAAA,QAC5B,SAASO,IAAWd,IAAeI;AAAA,QACnC,WAAW,GAAGL,CAAY,IAAIP,EAAeC,GAASC,CAAK,CAAC,IAAIe,CAAS;AAAA,QACzE,OAAO,EAAE,OAAOG,GAAQ,QAAQA,EAAA;AAAA,QAE/B,UAAAL;AAAA;AAAA,UAEG,gBAAAQ;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,eAAW;AAAA,cACX,WAAU;AAAA,cACV,OAAO,EAAE,OAAOF,GAAO,QAAQA,EAAA;AAAA,YAAM;AAAA,UAAA;AAAA,YAGzC,gBAAAE,EAACC,GAAA,EAAY,MAAMH,EAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAI1C;AACJ;AAEAX,EAAY,cAAc;"}

package/dist/components/Popover.js

@@ -1,29 +1,29 @@
-import { jsxs as ve, Fragment as he, jsx as D } from "react/jsx-runtime";
-import be, { useContext as Pe, useState as W, useSyncExternalStore as ge, useRef as h, useCallback as xe, useEffect as j, useMemo as we } from "react";
-import { createPortal as Ee } from "react-dom";
-import { ShadowRootWrapper as Le } from "../ShadowRootWrapper.js";
-import { PopoverEmpty as Me, PopoverSection as ye, PopoverList as Te, PopoverAction as Se, PopoverHeader as _e } from "./PopoverParts.js";
-import { getDeepActiveElement as U } from "./activeElement.js";
-import { elementRef as Ae, composeRefs as De, chainHandler as v } from "./composeRefs.js";
+import { jsxs as he, Fragment as be, jsx as C } from "react/jsx-runtime";
+import Pe, { useContext as Ee, useState as W, useSyncExternalStore as xe, useRef as h, useCallback as ge, useEffect as j, useMemo as we } from "react";
+import { createPortal as Te } from "react-dom";
+import { ShadowRootWrapper as ye } from "../ShadowRootWrapper.js";
+import { PopoverEmpty as Le, PopoverSection as Me, PopoverList as Se, PopoverAction as De, PopoverHeader as _e } from "./PopoverParts.js";
+import { getDeepActiveElement as G } from "./activeElement.js";
+import { elementRef as Ae, composeRefs as Ce, chainHandler as p } from "./composeRefs.js";
 import { pushEscapeLayer as Ie } from "./escapeLayers.js";
-import { MENU_VIEWPORT_PADDING_PX as Ce } from "./floatingMenuGeometry.js";
-import { firstTabStopIn as Ne } from "./overlayBehaviour.js";
-import { usePopupLayer as Oe } from "./overlayLayers.js";
-import { PopoverTreeContext as G } from "./popoverTree.js";
-import { useHoverClose as ke } from "./useHoverClose.js";
+import { MENU_VIEWPORT_PADDING_PX as Ne } from "./floatingMenuGeometry.js";
+import { firstTabStopIn as Oe } from "./overlayBehaviour.js";
+import { usePopupLayer as ke } from "./overlayLayers.js";
+import { PopoverTreeContext as V } from "./popoverTree.js";
+import { useHoverClose as Ke } from "./useHoverClose.js";
 import { useLatestRef as I } from "./useLatestRef.js";
-import { usePopoverPosition as Ke } from "./usePopoverPosition.js";
-import { usePopoverTree as Re } from "./usePopoverTree.js";
-const Be = "font-sans box-border overflow-auto outline-none rounded-[var(--malachite-radius-xl,12px)] border border-solid border-[var(--malachite-card-border,rgb(232,232,232))] bg-[var(--malachite-card-background,rgb(255,255,255))] text-[var(--malachite-text-primary,rgb(10,10,10))]", $e = {
+import { usePopoverPosition as Re } from "./usePopoverPosition.js";
+import { usePopoverTree as Be } from "./usePopoverTree.js";
+const He = "font-sans box-border overflow-auto outline-none rounded-[var(--malachite-radius-xl,12px)] border border-solid border-[var(--malachite-card-border,rgb(232,232,232))] bg-[var(--malachite-card-background,rgb(255,255,255))] text-[var(--malachite-text-primary,rgb(10,10,10))]", $e = {
   default: "[box-shadow:0px_4px_10px_0px_var(--malachite-card-shadow,rgba(0,0,0,0.1))]",
   raised: "[box-shadow:0px_8px_24px_0px_var(--malachite-card-shadow,rgba(0,0,0,0.1))]"
-}, He = {
+}, Ue = {
   none: "p-0",
   small: "p-1",
   medium: "p-2"
-}, We = (o, c) => {
+}, We = (r, c) => {
   for (const b of c)
-    if (b && o.includes(b))
+    if (b && r.includes(b))
       return !0;
   return !1;
 }, je = {
@@ -31,216 +31,224 @@ const Be = "font-sans box-border overflow-auto outline-none rounded-[var(--malac
   top: "ArrowUp",
   right: "ArrowRight",
   left: "ArrowLeft"
-}, Y = (o) => {
-  if (!(o instanceof Node))
+}, Ge = (r) => r instanceof HTMLElement && (r.isContentEditable || ["INPUT", "TEXTAREA", "SELECT"].includes(r.tagName)), Y = (r) => {
+  if (!(r instanceof Node))
     return [];
-  const c = o.getRootNode();
-  return [o, ...c instanceof ShadowRoot ? Y(c.host) : []];
-}, Ue = () => () => {
-}, Ge = () => !0, Ve = () => !1, V = (o, c) => c ?? Ne(o) ?? o, Ye = ({
-  trigger: o,
+  const c = r.getRootNode();
+  return [r, ...c instanceof ShadowRoot ? Y(c.host) : []];
+}, Ve = () => () => {
+}, Xe = () => !0, Ye = () => !1, X = (r, c) => c ?? Oe(r) ?? r, qe = ({
+  trigger: r,
   children: c,
   open: b,
   defaultOpen: q = !1,
-  onOpenChange: X,
-  placement: C = "bottom-start",
-  openOn: i = "click",
-  width: z = "content",
-  padding: J = "small",
-  anchorRef: Q,
-  offset: Z = "small",
-  elevation: F = "default",
-  initialFocusRef: p,
-  role: N = "dialog",
-  "aria-label": ee,
-  "aria-labelledby": re,
-  className: oe = ""
+  onOpenChange: z,
+  placement: N = "bottom-start",
+  openOn: f = "click",
+  width: J = "content",
+  padding: Q = "small",
+  anchorRef: Z,
+  offset: F = "small",
+  elevation: ee = "default",
+  initialFocusRef: d,
+  openOnArrowKey: re = !1,
+  role: O = "dialog",
+  "aria-label": oe,
+  "aria-labelledby": te,
+  className: ne = ""
 }) => {
-  const te = Pe(G), [ne, se] = W(q), t = b ?? ne, ce = ge(Ue, Ge, Ve), P = h(null), g = h(null), ue = Oe("popover", t, g), [u, ae] = W(null), O = h(0), _ = h(!1), E = h(!1), L = h(!1), M = I(t), k = I(b), y = I(X), n = xe(
+  const se = Ee(V), [ce, ue] = W(q), t = b ?? ce, ae = xe(Ve, Xe, Ye), P = h(null), E = h(null), le = ke("popover", t, E), [u, ie] = W(null), k = h(0), D = h(!1), w = h(!1), T = h(!1), y = I(t), K = I(b), L = I(z), n = ge(
     (e) => {
-      var m;
-      e !== M.current && (k.current === void 0 && se(e), (m = y.current) == null || m.call(y, e));
+      var v;
+      e !== y.current && (K.current === void 0 && ue(e), (v = L.current) == null || v.call(L, e));
     },
-    [M, k, y]
-  ), { pointerInside: x, focusInside: w, triggerFocused: K, cancelClose: d, scheduleClose: T } = ke({
-    isOpenRef: M,
-    heldByChildren: O,
+    [y, K, L]
+  ), { pointerInside: x, focusInside: g, triggerFocused: R, cancelClose: m, scheduleClose: M } = Ke({
+    isOpenRef: y,
+    heldByChildren: k,
     setOpen: n
-  }), { tree: le, ownedSources: A } = Re({
-    parent: te,
+  }), { tree: pe, ownedSources: _ } = Be({
+    parent: se,
     isOpen: t,
-    openOn: i,
-    isOpenRef: M,
-    heldByChildren: O,
-    cancelClose: d,
-    scheduleClose: T
-  }), r = Ke({
+    openOn: f,
+    isOpenRef: y,
+    heldByChildren: k,
+    cancelClose: m,
+    scheduleClose: M
+  }), o = Re({
     isOpen: t,
     panel: u,
-    hostRef: g,
+    hostRef: E,
     triggerRef: P,
-    anchorRef: Q,
-    placement: C,
-    width: z,
-    offset: Z
+    anchorRef: Z,
+    placement: N,
+    width: J,
+    offset: F
   });
   j(() => {
     if (!t)
       return;
-    const e = (a) => {
-      const l = a.composedPath();
-      We(l, [
+    const e = (l) => {
+      const i = l.composedPath();
+      We(i, [
         P.current,
-        g.current,
-        ...[...A.current].map((me) => me())
+        E.current,
+        ...[..._.current].map((ve) => ve())
       ]) || n(!1);
     };
     document.addEventListener("mousedown", e, !0);
-    const m = Ie(() => n(!1));
+    const v = Ie(() => n(!1));
     return () => {
-      var l;
-      document.removeEventListener("mousedown", e, !0), m(), x.current = !1;
-      const a = U();
-      w.current && (!a || a === document.body) && (E.current = !0, (l = P.current) == null || l.focus({ preventScroll: !0 }), E.current = !1), w.current = !1;
+      var i;
+      document.removeEventListener("mousedown", e, !0), v(), x.current = !1;
+      const l = G();
+      g.current && (!l || l === document.body) && (w.current = !0, (i = P.current) == null || i.focus({ preventScroll: !0 }), w.current = !1), g.current = !1;
     };
-  }, [t, n, A, x, w]);
-  const R = t && u !== null && r !== null;
+  }, [t, n, _, x, g]);
+  const B = t && u !== null && o !== null;
   j(() => {
-    const e = i === "click" || _.current;
-    !R || !u || !e || (_.current = !1, V(u, p == null ? void 0 : p.current).focus({ preventScroll: !0 }));
-  }, [R, u, i, p]);
-  const B = () => {
-    if (d(), t && u) {
-      V(u, p == null ? void 0 : p.current).focus({ preventScroll: !0 });
+    const e = f === "click" || D.current;
+    !B || !u || !e || (D.current = !1, X(u, d == null ? void 0 : d.current).focus({ preventScroll: !0 }));
+  }, [B, u, f, d]);
+  const A = () => {
+    if (m(), t && u) {
+      X(u, d == null ? void 0 : d.current).focus({ preventScroll: !0 });
       return;
     }
-    _.current = !0, n(!0);
+    D.current = !0, n(!0);
   }, S = (e) => {
-    const m = [
+    const v = [
       P.current,
-      g.current,
+      E.current,
       u,
-      ...[...A.current].map((a) => a())
+      ...[..._.current].map((l) => l())
     ];
     return Y(e).some(
-      (a) => m.some((l) => l == null ? void 0 : l.contains(a))
+      (l) => v.some((i) => i == null ? void 0 : i.contains(l))
     );
-  }, $ = (e) => {
+  }, H = (e) => {
     e && queueMicrotask(() => {
-      !S(e) && !S(U()) && n(!1);
+      !S(e) && !S(G()) && n(!1);
     });
-  }, s = i === "hover" ? {
+  }, s = f === "hover" ? {
     onMouseEnter: () => {
-      x.current = !0, d(), n(!0);
+      x.current = !0, m(), n(!0);
     },
     onMouseLeave: () => {
-      x.current = !1, T();
+      x.current = !1, M();
     },
     onPanelMouseOver: () => {
-      x.current = !0, d();
+      x.current = !0, m();
     }
-  } : null, f = o.props, H = Ae(o), ie = we(
-    () => De(H, P),
-    [H]
-  ), pe = je[C.split("-")[0]], de = be.cloneElement(o, {
-    ref: ie,
-    "aria-haspopup": N,
+  } : null, a = r.props, $ = Ae(r), fe = we(
+    () => Ce($, P),
+    [$]
+  ), U = je[N.split("-")[0]], de = Pe.cloneElement(r, {
+    ref: fe,
+    "aria-haspopup": O,
     "aria-expanded": t,
-    onClick: v(
-      f.onClick,
+    onClick: p(
+      a.onClick,
       (e) => {
-        if (i !== "hover") {
+        if (f !== "hover") {
           n(!t);
           return;
         }
         if (e.detail === 0) {
-          B();
+          A();
           return;
         }
-        d(), n(!0);
+        m(), n(!0);
       }
     ),
     ...s ? {
-      onMouseEnter: v(
-        f.onMouseEnter,
+      onMouseEnter: p(
+        a.onMouseEnter,
         s.onMouseEnter
       ),
-      onMouseLeave: v(
-        f.onMouseLeave,
+      onMouseLeave: p(
+        a.onMouseLeave,
         s.onMouseLeave
       ),
-      onMouseDown: v(
-        f.onMouseDown,
+      onMouseDown: p(
+        a.onMouseDown,
         () => {
-          L.current = !0, setTimeout(() => {
-            L.current = !1;
+          T.current = !0, setTimeout(() => {
+            T.current = !1;
           });
         }
       ),
-      onFocus: v(f.onFocus, () => {
-        const e = L.current;
-        L.current = !1, K.current = !e && !E.current, !E.current && (d(), n(!0));
+      onFocus: p(a.onFocus, () => {
+        const e = T.current;
+        T.current = !1, R.current = !e && !w.current, !w.current && (m(), n(!0));
       }),
-      onKeyDown: v(
-        f.onKeyDown,
+      onKeyDown: p(
+        a.onKeyDown,
         (e) => {
-          e.key === pe && (e.preventDefault(), B());
+          e.key === U && (e.preventDefault(), A());
+        }
+      )
+    } : re ? {
+      onKeyDown: p(
+        a.onKeyDown,
+        (e) => {
+          e.key !== U || Ge(e.target) || (e.preventDefault(), A());
         }
       )
     } : {},
-    onBlur: v(
-      f.onBlur,
+    onBlur: p(
+      a.onBlur,
       (e) => {
-        if (K.current = !1, !(!t || S(e.relatedTarget))) {
-          if (i === "hover") {
-            T();
+        if (R.current = !1, !(!t || S(e.relatedTarget))) {
+          if (f === "hover") {
+            M();
             return;
           }
-          $(e.relatedTarget);
+          H(e.relatedTarget);
         }
       }
     )
-  }), fe = {
-    maxHeight: r == null ? void 0 : r.maxHeight,
-    maxWidth: `calc(100vw - ${Ce * 2}px)`,
-    visibility: r ? "visible" : "hidden"
+  }), me = {
+    maxHeight: o == null ? void 0 : o.maxHeight,
+    maxWidth: `calc(100vw - ${Ne * 2}px)`,
+    visibility: o ? "visible" : "hidden"
   };
-  return /* @__PURE__ */ ve(he, { children: [
+  return /* @__PURE__ */ he(be, { children: [
     de,
-    t && ce && Ee(
-      /* @__PURE__ */ D(G.Provider, { value: le, children: /* @__PURE__ */ D(
-        Le,
+    t && ae && Te(
+      /* @__PURE__ */ C(V.Provider, { value: pe, children: /* @__PURE__ */ C(
+        ye,
         {
-          hostRef: g,
-          hostProps: ue,
+          hostRef: E,
+          hostProps: le,
           hostStyle: {
             position: "fixed",
-            top: (r == null ? void 0 : r.top) ?? 0,
-            left: (r == null ? void 0 : r.left) ?? 0
+            top: (o == null ? void 0 : o.top) ?? 0,
+            left: (o == null ? void 0 : o.left) ?? 0
           },
-          children: /* @__PURE__ */ D(
+          children: /* @__PURE__ */ C(
             "div",
             {
-              ref: ae,
-              role: N,
-              "aria-label": ee,
-              "aria-labelledby": re,
-              "data-side": r == null ? void 0 : r.side,
+              ref: ie,
+              role: O,
+              "aria-label": oe,
+              "aria-labelledby": te,
+              "data-side": o == null ? void 0 : o.side,
               tabIndex: -1,
-              className: `${Be} ${$e[F]} ${He[J]} ${oe}`.trim(),
-              style: fe,
+              className: `${He} ${$e[ee]} ${Ue[Q]} ${ne}`.trim(),
+              style: me,
               onMouseOver: s == null ? void 0 : s.onPanelMouseOver,
               onMouseLeave: s == null ? void 0 : s.onMouseLeave,
               onFocus: () => {
-                w.current = !0, d();
+                g.current = !0, m();
               },
               onBlur: (e) => {
                 if (!S(e.relatedTarget)) {
-                  if (w.current = !1, i === "hover") {
-                    T();
+                  if (g.current = !1, f === "hover") {
+                    M();
                     return;
                   }
-                  $(e.relatedTarget);
+                  H(e.relatedTarget);
                 }
               },
               children: c
@@ -251,15 +259,15 @@ const Be = "font-sans box-border overflow-auto outline-none rounded-[var(--malac
       document.body
     )
   ] });
-}, ir = Object.assign(Ye, {
+}, fr = Object.assign(qe, {
   Header: _e,
-  Action: Se,
-  List: Te,
-  Section: ye,
-  Empty: Me
+  Action: De,
+  List: Se,
+  Section: Me,
+  Empty: Le
 });
 export {
-  ir as Popover,
-  ir as default
+  fr as Popover,
+  fr as default
 };
 //# sourceMappingURL=Popover.js.map

package/dist/components/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../src/components/Popover.tsx"],"sourcesContent":["import React, {\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    useSyncExternalStore,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ShadowRootWrapper } from '../ShadowRootWrapper';\nimport {\n    PopoverAction,\n    PopoverEmpty,\n    PopoverHeader,\n    PopoverList,\n    PopoverSection,\n} from './PopoverParts';\nimport { getDeepActiveElement } from './activeElement';\nimport { chainHandler, composeRefs, elementRef } from './composeRefs';\nimport { pushEscapeLayer } from './escapeLayers';\nimport {\n    type FloatingOffset,\n    type FloatingPlacement,\n    MENU_VIEWPORT_PADDING_PX,\n} from './floatingMenuGeometry';\nimport { firstTabStopIn } from './overlayBehaviour';\nimport { usePopupLayer } from './overlayLayers';\nimport { PopoverTreeContext } from './popoverTree';\nimport { useHoverClose } from './useHoverClose';\nimport { useLatestRef } from './useLatestRef';\nimport { usePopoverPosition } from './usePopoverPosition';\nimport { usePopoverTree } from './usePopoverTree';\n\nexport type PopoverPlacement = FloatingPlacement;\n\ninterface PopoverBaseProps {\n    trigger: React.ReactElement;\n    children?: React.ReactNode;\n    open?: boolean;\n    defaultOpen?: boolean;\n    onOpenChange?: (open: boolean) => void;\n    placement?: PopoverPlacement;\n    openOn?: 'click' | 'hover';\n    width?: 'content' | 'trigger';\n    padding?: 'none' | 'small' | 'medium';\n    anchorRef?: React.RefObject<HTMLElement | null>;\n    offset?: FloatingOffset;\n    elevation?: 'default' | 'raised';\n    initialFocusRef?: React.RefObject<HTMLElement | null>;\n    role?: 'dialog' | 'menu' | 'listbox';\n    className?: string;\n}\n\ntype PopoverName =\n    | { 'aria-label': string; 'aria-labelledby'?: string }\n    | { 'aria-label'?: string; 'aria-labelledby': string };\n\nexport type PopoverProps = PopoverBaseProps & PopoverName;\n\nconst PANEL =\n    'font-sans box-border overflow-auto outline-none rounded-[var(--malachite-radius-xl,12px)] border border-solid border-[var(--malachite-card-border,rgb(232,232,232))] bg-[var(--malachite-card-background,rgb(255,255,255))] text-[var(--malachite-text-primary,rgb(10,10,10))]';\n\nconst ELEVATION: Record<NonNullable<PopoverBaseProps['elevation']>, string> = {\n    default: '[box-shadow:0px_4px_10px_0px_var(--malachite-card-shadow,rgba(0,0,0,0.1))]',\n    raised: '[box-shadow:0px_8px_24px_0px_var(--malachite-card-shadow,rgba(0,0,0,0.1))]',\n};\n\nconst PADDING: Record<NonNullable<PopoverBaseProps['padding']>, string> = {\n    none: 'p-0',\n    small: 'p-1',\n    medium: 'p-2',\n};\n\nconst pathHits = (path: EventTarget[], nodes: Iterable<Element | null | undefined>): boolean => {\n    for (const node of nodes) {\n        if (node && path.includes(node)) {\n            return true;\n        }\n    }\n    return false;\n};\n\nconst KEYBOARD_OPEN_KEY: Record<string, string> = {\n    bottom: 'ArrowDown',\n    top: 'ArrowUp',\n    right: 'ArrowRight',\n    left: 'ArrowLeft',\n};\n\nconst composedPathOf = (node: EventTarget | null): Node[] => {\n    if (!(node instanceof Node)) {\n        return [];\n    }\n    const root = node.getRootNode();\n    return [node, ...(root instanceof ShadowRoot ? composedPathOf(root.host) : [])];\n};\n\nconst subscribeToNothing = () => () => undefined;\nconst onClient = () => true;\nconst onServer = () => false;\n\nconst focusTarget = (panel: HTMLElement, initial: HTMLElement | null | undefined): HTMLElement =>\n    initial ?? firstTabStopIn(panel) ?? panel;\n\n/** An anchored, non-modal panel; nested Popovers count as inside their parent. */\nconst PopoverRoot: React.FC<PopoverProps> = ({\n    trigger,\n    children,\n    open: controlledOpen,\n    defaultOpen = false,\n    onOpenChange,\n    placement = 'bottom-start',\n    openOn = 'click',\n    width = 'content',\n    padding = 'small',\n    anchorRef,\n    offset = 'small',\n    elevation = 'default',\n    initialFocusRef,\n    role = 'dialog',\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    className = '',\n}) => {\n    const parent = useContext(PopoverTreeContext);\n    const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n    const isOpen = controlledOpen ?? uncontrolledOpen;\n    const isClient = useSyncExternalStore(subscribeToNothing, onClient, onServer);\n\n    const triggerRef = useRef<HTMLElement | null>(null);\n    const hostRef = useRef<HTMLDivElement | null>(null);\n    const popupIdentity = usePopupLayer('popover', isOpen, hostRef);\n    const [panel, setPanel] = useState<HTMLDivElement | null>(null);\n    const heldByChildren = useRef(0);\n    const focusOnOpen = useRef(false);\n    const returningFocus = useRef(false);\n    const pointerPressedTrigger = useRef(false);\n\n    const isOpenRef = useLatestRef(isOpen);\n    const controlledRef = useLatestRef(controlledOpen);\n    const onOpenChangeRef = useLatestRef(onOpenChange);\n\n    const setOpen = useCallback(\n        (next: boolean) => {\n            if (next === isOpenRef.current) {\n                return;\n            }\n            if (controlledRef.current === undefined) {\n                setUncontrolledOpen(next);\n            }\n            onOpenChangeRef.current?.(next);\n        },\n        [isOpenRef, controlledRef, onOpenChangeRef],\n    );\n\n    const { pointerInside, focusInside, triggerFocused, cancelClose, scheduleClose } =\n        useHoverClose({\n            isOpenRef,\n            heldByChildren,\n            setOpen,\n        });\n\n    const { tree, ownedSources } = usePopoverTree({\n        parent,\n        isOpen,\n        openOn,\n        isOpenRef,\n        heldByChildren,\n        cancelClose,\n        scheduleClose,\n    });\n\n    const geometry = usePopoverPosition({\n        isOpen,\n        panel,\n        hostRef,\n        triggerRef,\n        anchorRef,\n        placement,\n        width,\n        offset,\n    });\n\n    useEffect(() => {\n        if (!isOpen) {\n            return;\n        }\n        const closeOnOutsidePress = (event: MouseEvent) => {\n            const path = event.composedPath();\n            const inside = pathHits(path, [\n                triggerRef.current,\n                hostRef.current,\n                ...[...ownedSources.current].map((source) => source()),\n            ]);\n            if (!inside) {\n                setOpen(false);\n            }\n        };\n        document.addEventListener('mousedown', closeOnOutsidePress, true);\n        const popEscapeLayer = pushEscapeLayer(() => setOpen(false));\n        return () => {\n            document.removeEventListener('mousedown', closeOnOutsidePress, true);\n            popEscapeLayer();\n            pointerInside.current = false;\n            const active = getDeepActiveElement();\n            if (focusInside.current && (!active || active === document.body)) {\n                returningFocus.current = true;\n                triggerRef.current?.focus({ preventScroll: true });\n                returningFocus.current = false;\n            }\n            focusInside.current = false;\n        };\n    }, [isOpen, setOpen, ownedSources, pointerInside, focusInside]);\n\n    const shown = isOpen && panel !== null && geometry !== null;\n\n    useEffect(() => {\n        const shouldFocus = openOn === 'click' || focusOnOpen.current;\n        if (!shown || !panel || !shouldFocus) {\n            return;\n        }\n        focusOnOpen.current = false;\n        focusTarget(panel, initialFocusRef?.current).focus({ preventScroll: true });\n    }, [shown, panel, openOn, initialFocusRef]);\n\n    const openWithFocus = () => {\n        cancelClose();\n        if (isOpen && panel) {\n            focusTarget(panel, initialFocusRef?.current).focus({ preventScroll: true });\n            return;\n        }\n        focusOnOpen.current = true;\n        setOpen(true);\n    };\n\n    const isInside = (node: EventTarget | null): boolean => {\n        const containers = [\n            triggerRef.current,\n            hostRef.current,\n            panel,\n            ...[...ownedSources.current].map((source) => source()),\n        ];\n        return composedPathOf(node).some((step) =>\n            containers.some((container) => container?.contains(step)),\n        );\n    };\n\n    const closeIfFocusLeft = (next: EventTarget | null) => {\n        if (!next) {\n            return;\n        }\n        queueMicrotask(() => {\n            if (!isInside(next) && !isInside(getDeepActiveElement())) {\n                setOpen(false);\n            }\n        });\n    };\n\n    const hoverHandlers =\n        openOn === 'hover'\n            ? {\n                  onMouseEnter: () => {\n                      pointerInside.current = true;\n                      cancelClose();\n                      setOpen(true);\n                  },\n                  onMouseLeave: () => {\n                      pointerInside.current = false;\n                      scheduleClose();\n                  },\n                  onPanelMouseOver: () => {\n                      pointerInside.current = true;\n                      cancelClose();\n                  },\n              }\n            : null;\n\n    const triggerProps = trigger.props as Record<string, unknown>;\n    type Handler<E extends React.SyntheticEvent> = ((event: E) => void) | undefined;\n\n    const ownTriggerRef = elementRef<HTMLElement>(trigger);\n    const composedTriggerRef = useMemo(\n        () => composeRefs(ownTriggerRef, triggerRef),\n        [ownTriggerRef],\n    );\n    const openKey = KEYBOARD_OPEN_KEY[placement.split('-')[0]];\n\n    const clonedTrigger = React.cloneElement(trigger, {\n        ref: composedTriggerRef,\n        'aria-haspopup': role,\n        'aria-expanded': isOpen,\n        onClick: chainHandler(\n            triggerProps.onClick as Handler<React.MouseEvent>,\n            (event: React.MouseEvent) => {\n                if (openOn !== 'hover') {\n                    setOpen(!isOpen);\n                    return;\n                }\n                const fromKeyboard = event.detail === 0;\n                if (fromKeyboard) {\n                    openWithFocus();\n                    return;\n                }\n                cancelClose();\n                setOpen(true);\n            },\n        ),\n        ...(hoverHandlers\n            ? {\n                  onMouseEnter: chainHandler(\n                      triggerProps.onMouseEnter as Handler<React.MouseEvent>,\n                      hoverHandlers.onMouseEnter,\n                  ),\n                  onMouseLeave: chainHandler(\n                      triggerProps.onMouseLeave as Handler<React.MouseEvent>,\n                      hoverHandlers.onMouseLeave,\n                  ),\n                  onMouseDown: chainHandler(\n                      triggerProps.onMouseDown as Handler<React.MouseEvent>,\n                      () => {\n                          pointerPressedTrigger.current = true;\n                          setTimeout(() => {\n                              pointerPressedTrigger.current = false;\n                          });\n                      },\n                  ),\n                  onFocus: chainHandler(triggerProps.onFocus as Handler<React.FocusEvent>, () => {\n                      const fromPointer = pointerPressedTrigger.current;\n                      pointerPressedTrigger.current = false;\n                      triggerFocused.current = !fromPointer && !returningFocus.current;\n                      if (returningFocus.current) {\n                          return;\n                      }\n                      cancelClose();\n                      setOpen(true);\n                  }),\n                  onKeyDown: chainHandler(\n                      triggerProps.onKeyDown as Handler<React.KeyboardEvent>,\n                      (event: React.KeyboardEvent) => {\n                          if (event.key !== openKey) {\n                              return;\n                          }\n                          event.preventDefault();\n                          openWithFocus();\n                      },\n                  ),\n              }\n            : {}),\n        onBlur: chainHandler(\n            triggerProps.onBlur as Handler<React.FocusEvent>,\n            (event: React.FocusEvent) => {\n                triggerFocused.current = false;\n                if (!isOpen || isInside(event.relatedTarget)) {\n                    return;\n                }\n                if (openOn === 'hover') {\n                    scheduleClose();\n                    return;\n                }\n                closeIfFocusLeft(event.relatedTarget);\n            },\n        ),\n    } as Record<string, unknown>);\n\n    const panelStyle: React.CSSProperties = {\n        maxHeight: geometry?.maxHeight,\n        maxWidth: `calc(100vw - ${MENU_VIEWPORT_PADDING_PX * 2}px)`,\n        visibility: geometry ? 'visible' : 'hidden',\n    };\n\n    return (\n        <>\n            {clonedTrigger}\n            {isOpen &&\n                isClient &&\n                createPortal(\n                    <PopoverTreeContext.Provider value={tree}>\n                        <ShadowRootWrapper\n                            hostRef={hostRef}\n                            hostProps={popupIdentity}\n                            hostStyle={{\n                                position: 'fixed',\n                                top: geometry?.top ?? 0,\n                                left: geometry?.left ?? 0,\n                            }}\n                        >\n                            <div\n                                ref={setPanel}\n                                role={role}\n                                aria-label={ariaLabel}\n                                aria-labelledby={ariaLabelledBy}\n                                data-side={geometry?.side}\n                                tabIndex={-1}\n                                className={`${PANEL} ${ELEVATION[elevation]} ${PADDING[padding]} ${className}`.trim()}\n                                style={panelStyle}\n                                // React's mouseenter stops at the shadow host, so the panel listens for mouseover.\n                                onMouseOver={hoverHandlers?.onPanelMouseOver}\n                                onMouseLeave={hoverHandlers?.onMouseLeave}\n                                onFocus={() => {\n                                    focusInside.current = true;\n                                    cancelClose();\n                                }}\n                                onBlur={(event) => {\n                                    if (isInside(event.relatedTarget)) {\n                                        return;\n                                    }\n                                    focusInside.current = false;\n                                    if (openOn === 'hover') {\n                                        scheduleClose();\n                                        return;\n                                    }\n                                    closeIfFocusLeft(event.relatedTarget);\n                                }}\n                            >\n                                {children}\n                            </div>\n                        </ShadowRootWrapper>\n                    </PopoverTreeContext.Provider>,\n                    document.body,\n                )}\n        </>\n    );\n};\n\nexport const Popover = Object.assign(PopoverRoot, {\n    Header: PopoverHeader,\n    Action: PopoverAction,\n    List: PopoverList,\n    Section: PopoverSection,\n    Empty: PopoverEmpty,\n});\n\nexport default Popover;\n"],"names":["PANEL","ELEVATION","PADDING","pathHits","path","nodes","node","KEYBOARD_OPEN_KEY","composedPathOf","root","subscribeToNothing","onClient","onServer","focusTarget","panel","initial","firstTabStopIn","PopoverRoot","trigger","children","controlledOpen","defaultOpen","onOpenChange","placement","openOn","width","padding","anchorRef","offset","elevation","initialFocusRef","role","ariaLabel","ariaLabelledBy","className","parent","useContext","PopoverTreeContext","uncontrolledOpen","setUncontrolledOpen","useState","isOpen","isClient","useSyncExternalStore","triggerRef","useRef","hostRef","popupIdentity","usePopupLayer","setPanel","heldByChildren","focusOnOpen","returningFocus","pointerPressedTrigger","isOpenRef","useLatestRef","controlledRef","onOpenChangeRef","setOpen","useCallback","next","_a","pointerInside","focusInside","triggerFocused","cancelClose","scheduleClose","useHoverClose","tree","ownedSources","usePopoverTree","geometry","usePopoverPosition","useEffect","closeOnOutsidePress","event","source","popEscapeLayer","pushEscapeLayer","active","getDeepActiveElement","shown","shouldFocus","openWithFocus","isInside","containers","step","container","closeIfFocusLeft","hoverHandlers","triggerProps","ownTriggerRef","elementRef","composedTriggerRef","useMemo","composeRefs","openKey","clonedTrigger","React","chainHandler","fromPointer","panelStyle","MENU_VIEWPORT_PADDING_PX","jsxs","Fragment","createPortal","jsx","ShadowRootWrapper","Popover","PopoverHeader","PopoverAction","PopoverList","PopoverSection","PopoverEmpty"],"mappings":"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"}
+{"version":3,"file":"Popover.js","sources":["../../src/components/Popover.tsx"],"sourcesContent":["import React, {\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    useSyncExternalStore,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ShadowRootWrapper } from '../ShadowRootWrapper';\nimport {\n    PopoverAction,\n    PopoverEmpty,\n    PopoverHeader,\n    PopoverList,\n    PopoverSection,\n} from './PopoverParts';\nimport { getDeepActiveElement } from './activeElement';\nimport { chainHandler, composeRefs, elementRef } from './composeRefs';\nimport { pushEscapeLayer } from './escapeLayers';\nimport {\n    type FloatingOffset,\n    type FloatingPlacement,\n    MENU_VIEWPORT_PADDING_PX,\n} from './floatingMenuGeometry';\nimport { firstTabStopIn } from './overlayBehaviour';\nimport { usePopupLayer } from './overlayLayers';\nimport { PopoverTreeContext } from './popoverTree';\nimport { useHoverClose } from './useHoverClose';\nimport { useLatestRef } from './useLatestRef';\nimport { usePopoverPosition } from './usePopoverPosition';\nimport { usePopoverTree } from './usePopoverTree';\n\nexport type PopoverPlacement = FloatingPlacement;\n\ninterface PopoverBaseProps {\n    trigger: React.ReactElement;\n    children?: React.ReactNode;\n    open?: boolean;\n    defaultOpen?: boolean;\n    onOpenChange?: (open: boolean) => void;\n    placement?: PopoverPlacement;\n    openOn?: 'click' | 'hover';\n    width?: 'content' | 'trigger';\n    padding?: 'none' | 'small' | 'medium';\n    anchorRef?: React.RefObject<HTMLElement | null>;\n    offset?: FloatingOffset;\n    elevation?: 'default' | 'raised';\n    initialFocusRef?: React.RefObject<HTMLElement | null>;\n    /** A click panel also opens, focus inside, on the arrow key its placement points at. */\n    openOnArrowKey?: boolean;\n    role?: 'dialog' | 'menu' | 'listbox';\n    className?: string;\n}\n\ntype PopoverName =\n    | { 'aria-label': string; 'aria-labelledby'?: string }\n    | { 'aria-label'?: string; 'aria-labelledby': string };\n\nexport type PopoverProps = PopoverBaseProps & PopoverName;\n\nconst PANEL =\n    'font-sans box-border overflow-auto outline-none rounded-[var(--malachite-radius-xl,12px)] border border-solid border-[var(--malachite-card-border,rgb(232,232,232))] bg-[var(--malachite-card-background,rgb(255,255,255))] text-[var(--malachite-text-primary,rgb(10,10,10))]';\n\nconst ELEVATION: Record<NonNullable<PopoverBaseProps['elevation']>, string> = {\n    default: '[box-shadow:0px_4px_10px_0px_var(--malachite-card-shadow,rgba(0,0,0,0.1))]',\n    raised: '[box-shadow:0px_8px_24px_0px_var(--malachite-card-shadow,rgba(0,0,0,0.1))]',\n};\n\nconst PADDING: Record<NonNullable<PopoverBaseProps['padding']>, string> = {\n    none: 'p-0',\n    small: 'p-1',\n    medium: 'p-2',\n};\n\nconst pathHits = (path: EventTarget[], nodes: Iterable<Element | null | undefined>): boolean => {\n    for (const node of nodes) {\n        if (node && path.includes(node)) {\n            return true;\n        }\n    }\n    return false;\n};\n\nconst KEYBOARD_OPEN_KEY: Record<string, string> = {\n    bottom: 'ArrowDown',\n    top: 'ArrowUp',\n    right: 'ArrowRight',\n    left: 'ArrowLeft',\n};\n\nconst isTextEntry = (target: EventTarget): boolean =>\n    target instanceof HTMLElement &&\n    (target.isContentEditable || ['INPUT', 'TEXTAREA', 'SELECT'].includes(target.tagName));\n\nconst composedPathOf = (node: EventTarget | null): Node[] => {\n    if (!(node instanceof Node)) {\n        return [];\n    }\n    const root = node.getRootNode();\n    return [node, ...(root instanceof ShadowRoot ? composedPathOf(root.host) : [])];\n};\n\nconst subscribeToNothing = () => () => undefined;\nconst onClient = () => true;\nconst onServer = () => false;\n\nconst focusTarget = (panel: HTMLElement, initial: HTMLElement | null | undefined): HTMLElement =>\n    initial ?? firstTabStopIn(panel) ?? panel;\n\n/** An anchored, non-modal panel; nested Popovers count as inside their parent. */\nconst PopoverRoot: React.FC<PopoverProps> = ({\n    trigger,\n    children,\n    open: controlledOpen,\n    defaultOpen = false,\n    onOpenChange,\n    placement = 'bottom-start',\n    openOn = 'click',\n    width = 'content',\n    padding = 'small',\n    anchorRef,\n    offset = 'small',\n    elevation = 'default',\n    initialFocusRef,\n    openOnArrowKey = false,\n    role = 'dialog',\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    className = '',\n}) => {\n    const parent = useContext(PopoverTreeContext);\n    const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n    const isOpen = controlledOpen ?? uncontrolledOpen;\n    const isClient = useSyncExternalStore(subscribeToNothing, onClient, onServer);\n\n    const triggerRef = useRef<HTMLElement | null>(null);\n    const hostRef = useRef<HTMLDivElement | null>(null);\n    const popupIdentity = usePopupLayer('popover', isOpen, hostRef);\n    const [panel, setPanel] = useState<HTMLDivElement | null>(null);\n    const heldByChildren = useRef(0);\n    const focusOnOpen = useRef(false);\n    const returningFocus = useRef(false);\n    const pointerPressedTrigger = useRef(false);\n\n    const isOpenRef = useLatestRef(isOpen);\n    const controlledRef = useLatestRef(controlledOpen);\n    const onOpenChangeRef = useLatestRef(onOpenChange);\n\n    const setOpen = useCallback(\n        (next: boolean) => {\n            if (next === isOpenRef.current) {\n                return;\n            }\n            if (controlledRef.current === undefined) {\n                setUncontrolledOpen(next);\n            }\n            onOpenChangeRef.current?.(next);\n        },\n        [isOpenRef, controlledRef, onOpenChangeRef],\n    );\n\n    const { pointerInside, focusInside, triggerFocused, cancelClose, scheduleClose } =\n        useHoverClose({\n            isOpenRef,\n            heldByChildren,\n            setOpen,\n        });\n\n    const { tree, ownedSources } = usePopoverTree({\n        parent,\n        isOpen,\n        openOn,\n        isOpenRef,\n        heldByChildren,\n        cancelClose,\n        scheduleClose,\n    });\n\n    const geometry = usePopoverPosition({\n        isOpen,\n        panel,\n        hostRef,\n        triggerRef,\n        anchorRef,\n        placement,\n        width,\n        offset,\n    });\n\n    useEffect(() => {\n        if (!isOpen) {\n            return;\n        }\n        const closeOnOutsidePress = (event: MouseEvent) => {\n            const path = event.composedPath();\n            const inside = pathHits(path, [\n                triggerRef.current,\n                hostRef.current,\n                ...[...ownedSources.current].map((source) => source()),\n            ]);\n            if (!inside) {\n                setOpen(false);\n            }\n        };\n        document.addEventListener('mousedown', closeOnOutsidePress, true);\n        const popEscapeLayer = pushEscapeLayer(() => setOpen(false));\n        return () => {\n            document.removeEventListener('mousedown', closeOnOutsidePress, true);\n            popEscapeLayer();\n            pointerInside.current = false;\n            const active = getDeepActiveElement();\n            if (focusInside.current && (!active || active === document.body)) {\n                returningFocus.current = true;\n                triggerRef.current?.focus({ preventScroll: true });\n                returningFocus.current = false;\n            }\n            focusInside.current = false;\n        };\n    }, [isOpen, setOpen, ownedSources, pointerInside, focusInside]);\n\n    const shown = isOpen && panel !== null && geometry !== null;\n\n    useEffect(() => {\n        const shouldFocus = openOn === 'click' || focusOnOpen.current;\n        if (!shown || !panel || !shouldFocus) {\n            return;\n        }\n        focusOnOpen.current = false;\n        focusTarget(panel, initialFocusRef?.current).focus({ preventScroll: true });\n    }, [shown, panel, openOn, initialFocusRef]);\n\n    const openWithFocus = () => {\n        cancelClose();\n        if (isOpen && panel) {\n            focusTarget(panel, initialFocusRef?.current).focus({ preventScroll: true });\n            return;\n        }\n        focusOnOpen.current = true;\n        setOpen(true);\n    };\n\n    const isInside = (node: EventTarget | null): boolean => {\n        const containers = [\n            triggerRef.current,\n            hostRef.current,\n            panel,\n            ...[...ownedSources.current].map((source) => source()),\n        ];\n        return composedPathOf(node).some((step) =>\n            containers.some((container) => container?.contains(step)),\n        );\n    };\n\n    const closeIfFocusLeft = (next: EventTarget | null) => {\n        if (!next) {\n            return;\n        }\n        queueMicrotask(() => {\n            if (!isInside(next) && !isInside(getDeepActiveElement())) {\n                setOpen(false);\n            }\n        });\n    };\n\n    const hoverHandlers =\n        openOn === 'hover'\n            ? {\n                  onMouseEnter: () => {\n                      pointerInside.current = true;\n                      cancelClose();\n                      setOpen(true);\n                  },\n                  onMouseLeave: () => {\n                      pointerInside.current = false;\n                      scheduleClose();\n                  },\n                  onPanelMouseOver: () => {\n                      pointerInside.current = true;\n                      cancelClose();\n                  },\n              }\n            : null;\n\n    const triggerProps = trigger.props as Record<string, unknown>;\n    type Handler<E extends React.SyntheticEvent> = ((event: E) => void) | undefined;\n\n    const ownTriggerRef = elementRef<HTMLElement>(trigger);\n    const composedTriggerRef = useMemo(\n        () => composeRefs(ownTriggerRef, triggerRef),\n        [ownTriggerRef],\n    );\n    const openKey = KEYBOARD_OPEN_KEY[placement.split('-')[0]];\n\n    const clonedTrigger = React.cloneElement(trigger, {\n        ref: composedTriggerRef,\n        'aria-haspopup': role,\n        'aria-expanded': isOpen,\n        onClick: chainHandler(\n            triggerProps.onClick as Handler<React.MouseEvent>,\n            (event: React.MouseEvent) => {\n                if (openOn !== 'hover') {\n                    setOpen(!isOpen);\n                    return;\n                }\n                const fromKeyboard = event.detail === 0;\n                if (fromKeyboard) {\n                    openWithFocus();\n                    return;\n                }\n                cancelClose();\n                setOpen(true);\n            },\n        ),\n        ...(hoverHandlers\n            ? {\n                  onMouseEnter: chainHandler(\n                      triggerProps.onMouseEnter as Handler<React.MouseEvent>,\n                      hoverHandlers.onMouseEnter,\n                  ),\n                  onMouseLeave: chainHandler(\n                      triggerProps.onMouseLeave as Handler<React.MouseEvent>,\n                      hoverHandlers.onMouseLeave,\n                  ),\n                  onMouseDown: chainHandler(\n                      triggerProps.onMouseDown as Handler<React.MouseEvent>,\n                      () => {\n                          pointerPressedTrigger.current = true;\n                          setTimeout(() => {\n                              pointerPressedTrigger.current = false;\n                          });\n                      },\n                  ),\n                  onFocus: chainHandler(triggerProps.onFocus as Handler<React.FocusEvent>, () => {\n                      const fromPointer = pointerPressedTrigger.current;\n                      pointerPressedTrigger.current = false;\n                      triggerFocused.current = !fromPointer && !returningFocus.current;\n                      if (returningFocus.current) {\n                          return;\n                      }\n                      cancelClose();\n                      setOpen(true);\n                  }),\n                  onKeyDown: chainHandler(\n                      triggerProps.onKeyDown as Handler<React.KeyboardEvent>,\n                      (event: React.KeyboardEvent) => {\n                          if (event.key !== openKey) {\n                              return;\n                          }\n                          event.preventDefault();\n                          openWithFocus();\n                      },\n                  ),\n              }\n            : openOnArrowKey\n              ? {\n                    onKeyDown: chainHandler(\n                        triggerProps.onKeyDown as Handler<React.KeyboardEvent>,\n                        (event: React.KeyboardEvent) => {\n                            if (event.key !== openKey || isTextEntry(event.target)) {\n                                return;\n                            }\n                            event.preventDefault();\n                            openWithFocus();\n                        },\n                    ),\n                }\n              : {}),\n        onBlur: chainHandler(\n            triggerProps.onBlur as Handler<React.FocusEvent>,\n            (event: React.FocusEvent) => {\n                triggerFocused.current = false;\n                if (!isOpen || isInside(event.relatedTarget)) {\n                    return;\n                }\n                if (openOn === 'hover') {\n                    scheduleClose();\n                    return;\n                }\n                closeIfFocusLeft(event.relatedTarget);\n            },\n        ),\n    } as Record<string, unknown>);\n\n    const panelStyle: React.CSSProperties = {\n        maxHeight: geometry?.maxHeight,\n        maxWidth: `calc(100vw - ${MENU_VIEWPORT_PADDING_PX * 2}px)`,\n        visibility: geometry ? 'visible' : 'hidden',\n    };\n\n    return (\n        <>\n            {clonedTrigger}\n            {isOpen &&\n                isClient &&\n                createPortal(\n                    <PopoverTreeContext.Provider value={tree}>\n                        <ShadowRootWrapper\n                            hostRef={hostRef}\n                            hostProps={popupIdentity}\n                            hostStyle={{\n                                position: 'fixed',\n                                top: geometry?.top ?? 0,\n                                left: geometry?.left ?? 0,\n                            }}\n                        >\n                            <div\n                                ref={setPanel}\n                                role={role}\n                                aria-label={ariaLabel}\n                                aria-labelledby={ariaLabelledBy}\n                                data-side={geometry?.side}\n                                tabIndex={-1}\n                                className={`${PANEL} ${ELEVATION[elevation]} ${PADDING[padding]} ${className}`.trim()}\n                                style={panelStyle}\n                                // React's mouseenter stops at the shadow host, so the panel listens for mouseover.\n                                onMouseOver={hoverHandlers?.onPanelMouseOver}\n                                onMouseLeave={hoverHandlers?.onMouseLeave}\n                                onFocus={() => {\n                                    focusInside.current = true;\n                                    cancelClose();\n                                }}\n                                onBlur={(event) => {\n                                    if (isInside(event.relatedTarget)) {\n                                        return;\n                                    }\n                                    focusInside.current = false;\n                                    if (openOn === 'hover') {\n                                        scheduleClose();\n                                        return;\n                                    }\n                                    closeIfFocusLeft(event.relatedTarget);\n                                }}\n                            >\n                                {children}\n                            </div>\n                        </ShadowRootWrapper>\n                    </PopoverTreeContext.Provider>,\n                    document.body,\n                )}\n        </>\n    );\n};\n\nexport const Popover = Object.assign(PopoverRoot, {\n    Header: PopoverHeader,\n    Action: PopoverAction,\n    List: PopoverList,\n    Section: PopoverSection,\n    Empty: PopoverEmpty,\n});\n\nexport default Popover;\n"],"names":["PANEL","ELEVATION","PADDING","pathHits","path","nodes","node","KEYBOARD_OPEN_KEY","isTextEntry","target","composedPathOf","root","subscribeToNothing","onClient","onServer","focusTarget","panel","initial","firstTabStopIn","PopoverRoot","trigger","children","controlledOpen","defaultOpen","onOpenChange","placement","openOn","width","padding","anchorRef","offset","elevation","initialFocusRef","openOnArrowKey","role","ariaLabel","ariaLabelledBy","className","parent","useContext","PopoverTreeContext","uncontrolledOpen","setUncontrolledOpen","useState","isOpen","isClient","useSyncExternalStore","triggerRef","useRef","hostRef","popupIdentity","usePopupLayer","setPanel","heldByChildren","focusOnOpen","returningFocus","pointerPressedTrigger","isOpenRef","useLatestRef","controlledRef","onOpenChangeRef","setOpen","useCallback","next","_a","pointerInside","focusInside","triggerFocused","cancelClose","scheduleClose","useHoverClose","tree","ownedSources","usePopoverTree","geometry","usePopoverPosition","useEffect","closeOnOutsidePress","event","source","popEscapeLayer","pushEscapeLayer","active","getDeepActiveElement","shown","shouldFocus","openWithFocus","isInside","containers","step","container","closeIfFocusLeft","hoverHandlers","triggerProps","ownTriggerRef","elementRef","composedTriggerRef","useMemo","composeRefs","openKey","clonedTrigger","React","chainHandler","fromPointer","panelStyle","MENU_VIEWPORT_PADDING_PX","jsxs","Fragment","createPortal","jsx","ShadowRootWrapper","Popover","PopoverHeader","PopoverAction","PopoverList","PopoverSection","PopoverEmpty"],"mappings":"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"}