@seekbuddy/dsh-ui 0.2.0-beta.0 → 0.2.0-beta.1

package/dist/chunks/chunk-3HCOU44R.js

@@ -1,697 +0,0 @@
-import {
-  ShortcutKeys,
-  overlayTopMargin,
-  usePointerGrace
-} from "./chunk-OQPH36OI.js";
-import {
-  IconCheckOutlineRegular
-} from "./chunk-LA3QDZYN.js";
-
-// src/StateDot.tsx
-import clsx from "clsx";
-
-// .build/css/StateDot.module.mjs
-var id = "@seekbuddy/dsh-ui/StateDot.module.css";
-if (typeof document !== "undefined" && !document.querySelector('style[data-dsh-ui-primitives="' + id + '"]')) {
-  const element = document.createElement("style");
-  element.setAttribute("data-dsh-ui-primitives", id);
-  element.textContent = '.vSoTLq_dot{flex:none;display:inline-block;position:relative}.vSoTLq_dot:after{content:"";corner-shape:round;background:currentColor;border-radius:50%;position:absolute;inset:20%}.vSoTLq_dot[data-state=done]{color:var(--dsw-alias-state-success-primary)}.vSoTLq_dot[data-state=warning]{color:var(--dsw-alias-state-warn-primary)}.vSoTLq_dot[data-state=error]{color:var(--dsw-alias-state-error-primary)}.vSoTLq_dot[data-state=idle]{color:var(--dsw-alias-state-idle-primary)}.vSoTLq_spinner{color:var(--dsw-alias-label-tertiary);flex:none}.vSoTLq_spinnerMotion{transform-origin:50%;animation:1.5s linear infinite vSoTLq_dsh-state-dot-spin}.vSoTLq_spinnerTrack,.vSoTLq_spinnerArc{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round}.vSoTLq_spinnerTrack{opacity:.25}.vSoTLq_spinnerArc{stroke-dasharray:12 150;animation:1.5s ease-in-out infinite vSoTLq_dsh-state-dot-dash}@keyframes vSoTLq_dsh-state-dot-spin{to{transform:rotate(360deg)}}@keyframes vSoTLq_dsh-state-dot-dash{0%{stroke-dasharray:12 150;stroke-dashoffset:0}50%{stroke-dasharray:24 150;stroke-dashoffset:-6px}to{stroke-dasharray:12 150;stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){.vSoTLq_spinnerMotion,.vSoTLq_spinnerArc{animation:none}.vSoTLq_spinnerArc{stroke-dasharray:18 150;stroke-dashoffset:-3px}}.vSoTLq_step{box-sizing:border-box;corner-shape:round;border:1.5px solid var(--dsw-alias-label-tertiary);color:var(--dsw-alias-label-primary-foreground);border-radius:50%;flex:none;justify-content:center;align-items:center;display:inline-flex}.vSoTLq_step[data-state=done]{border-color:var(--dsw-alias-state-success-primary);background:var(--dsw-alias-state-success-primary)}.vSoTLq_step[data-state=error]{border-color:var(--dsw-alias-state-error-primary);background:var(--dsw-alias-state-error-primary)}.vSoTLq_step[data-state=warning]{border-color:var(--dsw-alias-state-warn-primary)}';
-  document.head.appendChild(element);
-}
-var StateDot_module_default = { "dot": "vSoTLq_dot", "dsh-state-dot-dash": "vSoTLq_dsh-state-dot-dash", "spinner": "vSoTLq_spinner", "step": "vSoTLq_step", "spinnerTrack": "vSoTLq_spinnerTrack", "spinnerArc": "vSoTLq_spinnerArc", "dsh-state-dot-spin": "vSoTLq_dsh-state-dot-spin", "spinnerMotion": "vSoTLq_spinnerMotion" };
-
-// src/StateDot.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-function syncSpinner(element) {
-  if (element === null) return;
-  const spinner = element;
-  for (const animation of spinner.getAnimations?.({ subtree: true }) ?? []) animation.startTime = 0;
-}
-function StateDot({
-  state,
-  size,
-  className,
-  appearance = "dot"
-}) {
-  const edge = size ?? (state === "ongoing" ? 14 : 10);
-  if (state === "ongoing") {
-    return /* @__PURE__ */ jsx(
-      "svg",
-      {
-        ref: syncSpinner,
-        className: clsx(StateDot_module_default.spinner, className),
-        "data-state": "ongoing",
-        width: edge,
-        height: edge,
-        viewBox: "0 0 24 24",
-        "aria-hidden": "true",
-        children: /* @__PURE__ */ jsxs("g", { className: StateDot_module_default.spinnerMotion, children: [
-          /* @__PURE__ */ jsx("circle", { className: StateDot_module_default.spinnerTrack, cx: "12", cy: "12", r: "9.5" }),
-          /* @__PURE__ */ jsx("circle", { className: StateDot_module_default.spinnerArc, cx: "12", cy: "12", r: "9.5" })
-        ] })
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: clsx(appearance === "step" ? StateDot_module_default.step : StateDot_module_default.dot, className),
-      "data-state": state,
-      style: { width: edge, height: edge },
-      "aria-hidden": "true",
-      children: appearance === "step" && state === "done" && /* @__PURE__ */ jsx(IconCheckOutlineRegular, { size: edge - 2 })
-    }
-  );
-}
-
-// src/Pill.tsx
-import clsx2 from "clsx";
-
-// .build/css/Pill.module.mjs
-var id2 = "@seekbuddy/dsh-ui/Pill.module.css";
-if (typeof document !== "undefined" && !document.querySelector('style[data-dsh-ui-primitives="' + id2 + '"]')) {
-  const element = document.createElement("style");
-  element.setAttribute("data-dsh-ui-primitives", id2);
-  element.textContent = ".c2tx2W_pill{corner-shape:round;height:24px;color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-2);border:none;border-radius:999px;align-items:center;gap:4px;padding:0 8px;font-size:12px;line-height:18px;display:inline-flex}.c2tx2W_interactive{cursor:pointer}.c2tx2W_interactive:hover{background:var(--dsw-alias-interactive-bg-hover)}.c2tx2W_active{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-button-ghost-active-fill);box-shadow:inset 0 0 0 1px var(--dsw-alias-button-ghost-active-border)}";
-  document.head.appendChild(element);
-}
-var Pill_module_default = { "pill": "c2tx2W_pill", "interactive": "c2tx2W_interactive", "active": "c2tx2W_active" };
-
-// src/Pill.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-function Pill({
-  active = false,
-  className,
-  children,
-  onClick,
-  ...rest
-}) {
-  if (!onClick) {
-    return /* @__PURE__ */ jsx2("span", { className: clsx2(Pill_module_default.pill, active && Pill_module_default.active, className), children });
-  }
-  return /* @__PURE__ */ jsx2(
-    "button",
-    {
-      type: "button",
-      className: clsx2(Pill_module_default.pill, Pill_module_default.interactive, active && Pill_module_default.active, className),
-      onClick,
-      ...rest,
-      children
-    }
-  );
-}
-
-// src/keyboard-composition.ts
-function observeComposition(document2) {
-  let composing = false;
-  let ended = false;
-  const start = () => {
-    composing = true;
-  };
-  const end = () => {
-    composing = false;
-    ended = true;
-  };
-  const release = () => {
-    ended = false;
-  };
-  const blur = () => {
-    composing = false;
-    ended = false;
-  };
-  document2.addEventListener("compositionstart", start, true);
-  document2.addEventListener("compositionend", end, true);
-  document2.addEventListener("keyup", release, true);
-  document2.defaultView?.addEventListener("blur", blur);
-  return {
-    guards: (event) => {
-      const guarded = composing || ended || event.isComposing || event.keyCode === 229;
-      ended = false;
-      return guarded;
-    },
-    dispose: () => {
-      document2.removeEventListener("compositionstart", start, true);
-      document2.removeEventListener("compositionend", end, true);
-      document2.removeEventListener("keyup", release, true);
-      document2.defaultView?.removeEventListener("blur", blur);
-    }
-  };
-}
-
-// src/focus.ts
-var releases = /* @__PURE__ */ new WeakMap();
-var navigationKeys = /* @__PURE__ */ new Set(["Tab", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "Home", "End"]);
-function focusWithoutRing(element, options) {
-  releases.get(element)?.();
-  const release = () => {
-    element.removeAttribute("data-dsh-automatic-focus");
-    element.removeEventListener("blur", release);
-    element.removeEventListener("keydown", navigate, true);
-    releases.delete(element);
-  };
-  const navigate = (event) => {
-    if (!event.isComposing && !event.ctrlKey && !event.altKey && !event.metaKey && navigationKeys.has(event.key))
-      release();
-  };
-  releases.set(element, release);
-  element.setAttribute("data-dsh-automatic-focus", "");
-  element.addEventListener("blur", release);
-  element.addEventListener("keydown", navigate, true);
-  element.focus(options);
-  if (!element.matches(":focus")) release();
-}
-
-// src/useModalLayer.ts
-import { useLayoutEffect, useRef } from "react";
-var modalSelector = '[role="dialog"][aria-modal="true"], [role="menu"]';
-var layers = /* @__PURE__ */ new WeakMap();
-function closeTopModal(document2) {
-  const top = layers.get(document2)?.at(-1);
-  if (top === void 0) return;
-  const foreground = [...document2.querySelectorAll(modalSelector)].at(-1);
-  if (foreground === top.element) top.close();
-}
-function isBehindModal(anchor) {
-  if (anchor === null) return false;
-  const top = layers.get(anchor.ownerDocument)?.at(-1);
-  return top !== void 0 && !top.element.contains(anchor);
-}
-var focusable = 'button:not(:disabled), input:not(:disabled), textarea:not(:disabled), select:not(:disabled), a[href], [tabindex="0"]';
-function useModalLayer(dialog, open, onClose) {
-  const close = useRef(onClose);
-  close.current = onClose;
-  useLayoutEffect(() => {
-    const element = dialog.current;
-    if (!open || element === null) return;
-    const document2 = element.ownerDocument;
-    const composition = observeComposition(document2);
-    const previous = document2.activeElement;
-    const stack = layers.get(document2) ?? [];
-    layers.set(document2, stack);
-    const layer = {
-      element,
-      close: () => {
-        close.current();
-      }
-    };
-    stack.push(layer);
-    const initial = element.querySelector("[data-modal-autofocus]") ?? element.querySelector(focusable) ?? element;
-    if (!element.contains(document2.activeElement)) focusWithoutRing(initial);
-    const keydown = (event) => {
-      const composing = composition.guards(event);
-      if (stack.at(-1) !== layer || event.defaultPrevented || composing || event.ctrlKey || event.altKey || event.metaKey)
-        return;
-      if (event.key === "Escape" && !event.shiftKey) {
-        event.preventDefault();
-        if (!event.repeat) close.current();
-      }
-      if (event.key !== "Tab") return;
-      if (document2.activeElement?.closest('[role="menu"]')) return;
-      const items = [...element.querySelectorAll(focusable)].filter(
-        (item) => !item.closest("[inert], [hidden]")
-      );
-      const first = items[0] ?? element;
-      const last = items.at(-1) ?? element;
-      const atEdge = event.shiftKey ? document2.activeElement === first : document2.activeElement === last;
-      if (document2.activeElement === element || !element.contains(document2.activeElement) || atEdge) {
-        event.preventDefault();
-        const target = event.shiftKey ? last : first;
-        target.focus();
-      }
-    };
-    document2.addEventListener("keydown", keydown);
-    return () => {
-      composition.dispose();
-      const wasTop = stack.at(-1) === layer;
-      stack.splice(stack.indexOf(layer), 1);
-      document2.removeEventListener("keydown", keydown);
-      if (stack.length === 0) layers.delete(document2);
-      if (wasTop) {
-        const target = previous instanceof HTMLElement && previous.isConnected ? previous : stack.at(-1)?.element;
-        if (target !== void 0) focusWithoutRing(target);
-      }
-    };
-  }, [dialog, open]);
-}
-
-// src/MenuSurface.tsx
-import { forwardRef, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef2 } from "react";
-import { createPortal } from "react-dom";
-import clsx3 from "clsx";
-
-// .build/css/MenuSurface.module.mjs
-var id3 = "@seekbuddy/dsh-ui/MenuSurface.module.css";
-if (typeof document !== "undefined" && !document.querySelector('style[data-dsh-ui-primitives="' + id3 + '"]')) {
-  const element = document.createElement("style");
-  element.setAttribute("data-dsh-ui-primitives", id3);
-  element.textContent = "._J1jQq_surface,._J1jQq_backing{border-radius:var(--dsw-radius-lg)}._J1jQq_compact{border-radius:var(--dsw-radius-md)}:where(._J1jQq_surface){position:relative}._J1jQq_surface{anchor-name:var(--dsh-menu-anchor);isolation:isolate}._J1jQq_material{z-index:-1;border-radius:inherit;background:var(--dsw-menu-surface-fill);backdrop-filter:var(--dsw-menu-backdrop-filter);pointer-events:none;position:absolute;inset:0}._J1jQq_backing{display:none}html[data-platform=darwin] ._J1jQq_backing{position-anchor:var(--dsh-menu-anchor);top:anchor(top);left:anchor(left);width:anchor-size(width, 0px);height:anchor-size(height, 0px);z-index:-1;background:var(--dsw-alias-bg-base);pointer-events:none;display:block;position:fixed}";
-  document.head.appendChild(element);
-}
-var MenuSurface_module_default = { "compact": "_J1jQq_compact", "backing": "_J1jQq_backing", "surface": "_J1jQq_surface", "material": "_J1jQq_material" };
-
-// src/MenuSurface.tsx
-import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var MenuSurface = forwardRef(function MenuSurface2({ compact = false, className, style, children, ...props }, ref) {
-  const id5 = useId();
-  const backingRef = useRef2(null);
-  useLayoutEffect2(() => {
-    document.body.appendChild(backingRef.current);
-  }, []);
-  const anchorStyle = {
-    "--dsh-menu-anchor": `--dsh-menu-${id5.replaceAll(":", "")}`
-  };
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsxs2(
-      "div",
-      {
-        ...props,
-        ref,
-        "data-menu-material": "translucent",
-        className: clsx3(MenuSurface_module_default.surface, compact && MenuSurface_module_default.compact, className),
-        style: { ...style, ...anchorStyle },
-        children: [
-          /* @__PURE__ */ jsx3("div", { "aria-hidden": "true", className: MenuSurface_module_default.material }),
-          children
-        ]
-      }
-    ),
-    createPortal(
-      /* @__PURE__ */ jsx3(
-        "div",
-        {
-          ref: backingRef,
-          "aria-hidden": "true",
-          "data-menu-backing": "",
-          className: clsx3(MenuSurface_module_default.backing, compact && MenuSurface_module_default.compact),
-          style: { ...anchorStyle, visibility: style?.visibility }
-        }
-      ),
-      document.body
-    )
-  ] });
-});
-
-// src/Menu.tsx
-import { useEffect, useLayoutEffect as useLayoutEffect3, useRef as useRef3, useState } from "react";
-import { createPortal as createPortal2 } from "react-dom";
-import clsx4 from "clsx";
-
-// .build/css/Menu.module.mjs
-var id4 = "@seekbuddy/dsh-ui/Menu.module.css";
-if (typeof document !== "undefined" && !document.querySelector('style[data-dsh-ui-primitives="' + id4 + '"]')) {
-  const element = document.createElement("style");
-  element.setAttribute("data-dsh-ui-primitives", id4);
-  element.textContent = '.or0wJW_root{display:inline-flex;position:relative}.or0wJW_list,.or0wJW_submenu{box-sizing:border-box;--dsw-elevation-stroke-color:var(--dsw-alias-border-l1);box-shadow:var(--dsw-elevation-prominent);--dsh-scrollbar-thumb:var(--dsw-alias-scrollbar-bg-l2);--dsh-scrollbar-thumb-hover:var(--dsw-alias-scrollbar-hover-l2);border:0;flex-direction:column;gap:0;padding:4px;display:flex}.or0wJW_list{z-index:100;min-width:144px;max-width:360px;position:absolute;top:calc(100% + 4px);left:0}.or0wJW_portal{z-index:1100;position:fixed;top:auto;left:auto}.or0wJW_sideTop{top:auto;bottom:calc(100% + 4px)}.or0wJW_alignEnd{left:auto;right:0}.or0wJW_scrollable{max-height:calc(100vh - 12px - max(12px, var(--dsh-frame-overlay-top,12px)))}.or0wJW_viewport{flex-direction:column;min-height:0;display:flex}.or0wJW_scrollable .or0wJW_viewport{overflow-y:auto}.or0wJW_footer{border-top:.5px solid var(--dsw-alias-border-l2);flex-direction:column;flex:none;margin-top:3px;padding-top:3px;display:flex}.or0wJW_itemWrap{position:relative}.or0wJW_item{border-radius:var(--dsw-radius-md);cursor:pointer;width:100%;min-height:34px;color:var(--dsw-alias-label-primary);text-align:left;background:0 0;border:none;align-items:center;gap:6px;padding:6px 8px;font-size:13px;line-height:20px;display:flex}.or0wJW_item:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}.or0wJW_item:focus-visible:not(:disabled){background:var(--dsw-alias-interactive-bg-hover);outline:none}.or0wJW_denseList .or0wJW_item{min-height:30px;padding-block:4px}.or0wJW_denseList .or0wJW_label{padding-block:3px}.or0wJW_list.or0wJW_compactList,.or0wJW_submenu.or0wJW_compactList{min-width:156px;padding:4px}.or0wJW_compactList .or0wJW_item{border-radius:var(--dsw-radius-sm);gap:5px;min-height:24px;padding:2px 6px;font-size:11px;line-height:17px}.or0wJW_compactList .or0wJW_itemIcon{width:12px;height:12px}.or0wJW_compactList .or0wJW_separator{margin:2px}.or0wJW_compactList .or0wJW_label{padding:3px 6px;font-size:10px;line-height:15px}.or0wJW_item:disabled{opacity:.4;cursor:not-allowed}.or0wJW_itemIcon{width:14px;height:14px;color:var(--dsw-alias-menu-icon);flex:none;justify-content:center;align-items:center;display:inline-flex}.or0wJW_itemIcon svg,.or0wJW_check{width:14px;height:14px}.or0wJW_compactList .or0wJW_itemIcon svg,.or0wJW_compactList .or0wJW_check{width:12px;height:12px}.or0wJW_itemLabel{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.or0wJW_shortcut{flex:none;margin-inline-start:auto}.or0wJW_shortcut .or0wJW_shortcutKeys{color:var(--dsw-alias-label-caption);font-size:11px;line-height:16px}.or0wJW_check{color:var(--dsw-alias-label-primary);flex:none}.or0wJW_selected{background:0 0}.or0wJW_selectedFill{background:var(--dsw-alias-interactive-bg-hover)}.or0wJW_danger,.or0wJW_danger .or0wJW_itemIcon{color:var(--dsw-alias-state-error-primary)}.or0wJW_danger:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover-danger)}.or0wJW_danger:focus-visible:not(:disabled){background:var(--dsw-alias-interactive-bg-hover-danger);outline:none}.or0wJW_label{color:var(--dsw-alias-label-tertiary);padding:6px 8px;font-size:11px;line-height:15px}.or0wJW_separator{background:var(--dsw-alias-border-l2);height:.5px;margin:3px 2px}.or0wJW_separator+.or0wJW_separator,.or0wJW_separator+.or0wJW_itemWrap>.or0wJW_separator:first-child,.or0wJW_itemWrap:first-child>.or0wJW_separator:first-child{display:none}.or0wJW_submenu{z-index:101;min-width:163px;position:absolute;top:auto;bottom:-4px;left:calc(100% + 10px)}.or0wJW_submenu:before{content:"";width:10px;position:absolute;top:0;bottom:0;left:-10px}';
-  document.head.appendChild(element);
-}
-var Menu_module_default = { "list": "or0wJW_list", "submenu": "or0wJW_submenu", "viewport": "or0wJW_viewport", "footer": "or0wJW_footer", "shortcut": "or0wJW_shortcut", "selected": "or0wJW_selected", "scrollable": "or0wJW_scrollable", "itemLabel": "or0wJW_itemLabel", "shortcutKeys": "or0wJW_shortcutKeys", "item": "or0wJW_item", "compactList": "or0wJW_compactList", "itemIcon": "or0wJW_itemIcon", "alignEnd": "or0wJW_alignEnd", "check": "or0wJW_check", "portal": "or0wJW_portal", "sideTop": "or0wJW_sideTop", "label": "or0wJW_label", "separator": "or0wJW_separator", "root": "or0wJW_root", "denseList": "or0wJW_denseList", "selectedFill": "or0wJW_selectedFill", "itemWrap": "or0wJW_itemWrap", "danger": "or0wJW_danger" };
-
-// src/Menu.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-function MenuItemButton({
-  children,
-  shortcut,
-  icon,
-  disabled = false,
-  danger = false,
-  separatorBefore = false,
-  onSelect
-}) {
-  return /* @__PURE__ */ jsxs3("div", { className: Menu_module_default.itemWrap, children: [
-    separatorBefore && /* @__PURE__ */ jsx4("div", { className: Menu_module_default.separator, role: "separator" }),
-    /* @__PURE__ */ jsxs3(
-      "button",
-      {
-        type: "button",
-        role: "menuitem",
-        className: clsx4(Menu_module_default.item, danger && Menu_module_default.danger),
-        disabled,
-        "aria-keyshortcuts": shortcut?.aria,
-        onClick: onSelect,
-        children: [
-          icon !== void 0 && /* @__PURE__ */ jsx4("span", { className: Menu_module_default.itemIcon, children: icon }),
-          /* @__PURE__ */ jsx4("span", { className: Menu_module_default.itemLabel, children }),
-          shortcut !== void 0 && /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: Menu_module_default.shortcut, children: /* @__PURE__ */ jsx4(ShortcutKeys, { keys: shortcut.keys, className: Menu_module_default.shortcutKeys }) })
-        ]
-      }
-    )
-  ] });
-}
-function isSeparator(entry) {
-  return "type" in entry && entry.type === "separator";
-}
-function isLabel(entry) {
-  return "type" in entry && entry.type === "label";
-}
-var MEASURE_STYLE = { visibility: "hidden", left: 0, top: 0 };
-function Menu({
-  open,
-  anchor,
-  items = [],
-  children,
-  selectedId,
-  selectedIds,
-  onSelect,
-  onClose,
-  align = "start",
-  side = "bottom",
-  portal = false,
-  closeOnPointerLeave = false,
-  dense = false,
-  compact = false,
-  autoFocus = false,
-  selection = "check",
-  getAnchorRect,
-  footer,
-  className,
-  listClassName
-}) {
-  const rootRef = useRef3(null);
-  const listRef = useRef3(null);
-  const walkIndex = useRef3(null);
-  const triggerRef = useRef3(null);
-  const selectingWithTab = useRef3(false);
-  const refocusAnchor = (navigation = false) => {
-    const trigger = triggerRef.current;
-    const target = trigger !== null && document.contains(trigger) && !trigger.disabled ? trigger : rootRef.current?.querySelector("button:not(:disabled)");
-    if (target == null) return;
-    if (navigation) target.focus();
-    else focusWithoutRing(target);
-  };
-  const refocusAfterSelection = () => {
-    const navigation = selectingWithTab.current;
-    queueMicrotask(() => {
-      if (openRef.current) return;
-      const active = document.activeElement;
-      if (active === null || active === document.body || listRef.current?.contains(active) === true)
-        refocusAnchor(navigation);
-    });
-  };
-  const openRef = useRef3(open);
-  openRef.current = open;
-  const [openSubmenuId, setOpenSubmenuId] = useState(null);
-  const [fixedPos, setFixedPos] = useState(null);
-  const { arm: armClose, cancel: cancelClose } = usePointerGrace(onClose);
-  useLayoutEffect3(() => {
-    if (!open || !portal) {
-      setFixedPos(null);
-      return;
-    }
-    const place = () => {
-      let r;
-      if (getAnchorRect !== void 0) {
-        r = getAnchorRect();
-      } else {
-        r = rootRef.current?.getBoundingClientRect() ?? null;
-      }
-      if (r === null) return;
-      const MARGIN = 12;
-      const vw = window.innerWidth;
-      const vh = window.innerHeight;
-      const listEl = listRef.current;
-      const lw = listEl?.offsetWidth ?? 0;
-      const lh = listEl?.offsetHeight ?? 0;
-      let x;
-      let y;
-      if (side === "right") {
-        x = r.right + 4;
-        y = r.top;
-      } else if (align === "start") {
-        x = r.left;
-        y = side === "bottom" ? r.bottom + 4 : r.top - lh - 4;
-      } else {
-        x = r.right - lw;
-        y = side === "bottom" ? r.bottom + 4 : r.top - lh - 4;
-      }
-      if (lw > 0) x = Math.min(Math.max(x, MARGIN), vw - lw - MARGIN);
-      if (lh > 0) y = Math.min(Math.max(y, overlayTopMargin(MARGIN)), vh - lh - MARGIN);
-      setFixedPos((current) => current?.left === x && current.top === y ? current : { left: x, top: y });
-    };
-    place();
-    const track = () => {
-      place();
-      frame = requestAnimationFrame(track);
-    };
-    let frame = requestAnimationFrame(track);
-    window.addEventListener("scroll", place, true);
-    window.addEventListener("resize", place);
-    return () => {
-      cancelAnimationFrame(frame);
-      window.removeEventListener("scroll", place, true);
-      window.removeEventListener("resize", place);
-    };
-  }, [open, portal, align, side, getAnchorRect]);
-  useEffect(() => {
-    if (!open) {
-      triggerRef.current = null;
-      return;
-    }
-    const active = document.activeElement;
-    triggerRef.current = active instanceof HTMLElement && rootRef.current?.contains(active) === true ? active : null;
-  }, [open]);
-  useEffect(() => {
-    if (!open || !autoFocus) return;
-    const first = listRef.current?.querySelector("button:not(:disabled)");
-    walkIndex.current = first === void 0 || first === null ? null : 0;
-    if (first != null) focusWithoutRing(first);
-  }, [open, autoFocus]);
-  useEffect(() => {
-    if (!open) {
-      setOpenSubmenuId(null);
-      walkIndex.current = null;
-      return;
-    }
-    const composition = observeComposition(document);
-    const onPointerDown = (e) => {
-      if (!(e.target instanceof Node)) return;
-      if (rootRef.current?.contains(e.target) === true) return;
-      if (listRef.current?.contains(e.target) === true) return;
-      onClose();
-    };
-    const onKeyDown = (e) => {
-      if (composition.guards(e) || isBehindModal(rootRef.current) || e.defaultPrevented || e.ctrlKey || e.altKey || e.metaKey)
-        return;
-      const focused = document.activeElement;
-      const insideList = listRef.current?.contains(focused) === true;
-      const anchored = rootRef.current?.contains(focused) === true || insideList;
-      if (e.key === "Escape" && !e.shiftKey) {
-        e.preventDefault();
-        if (e.repeat) return;
-        onClose();
-        if (anchored || autoFocus) refocusAnchor();
-      }
-      if (e.key === "Tab") {
-        const list3 = listRef.current;
-        if (list3 === null || !anchored) return;
-        if (e.shiftKey) {
-          e.preventDefault();
-          onClose();
-          refocusAnchor(true);
-          return;
-        }
-        if (insideList) {
-          if (focused instanceof Element && focused.getAttribute("role") === "menuitem") {
-            e.preventDefault();
-            selectingWithTab.current = true;
-            try {
-              ;
-              focused.click();
-            } finally {
-              selectingWithTab.current = false;
-            }
-          }
-          return;
-        }
-        const row = list3.querySelector("button:not(:disabled)");
-        if (row === null) return;
-        e.preventDefault();
-        row.focus();
-        walkIndex.current = 0;
-        return;
-      }
-      if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(e.key)) return;
-      const list2 = listRef.current;
-      if (list2 === null || !anchored) return;
-      const buttons = Array.from(list2.querySelectorAll("button:not(:disabled)"));
-      if (buttons.length === 0) return;
-      const index = buttons.indexOf(focused);
-      const from = index >= 0 ? index : walkIndex.current;
-      const next = e.key === "Home" ? 0 : e.key === "End" ? buttons.length - 1 : from === null ? e.key === "ArrowDown" ? 0 : buttons.length - 1 : (from + (e.key === "ArrowDown" ? 1 : -1) + buttons.length) % buttons.length;
-      e.preventDefault();
-      walkIndex.current = next;
-      buttons[next]?.focus();
-    };
-    const onWindowBlur = () => {
-      if (document.activeElement instanceof HTMLIFrameElement) onClose();
-    };
-    document.addEventListener("pointerdown", onPointerDown);
-    const onEscape = (event) => {
-      if (event.key === "Escape") onKeyDown(event);
-    };
-    const onOtherKey = (event) => {
-      if (event.key !== "Escape") onKeyDown(event);
-    };
-    document.addEventListener("keydown", onOtherKey);
-    document.addEventListener("keydown", onEscape, true);
-    window.addEventListener("blur", onWindowBlur);
-    return () => {
-      composition.dispose();
-      document.removeEventListener("pointerdown", onPointerDown);
-      document.removeEventListener("keydown", onOtherKey);
-      document.removeEventListener("keydown", onEscape, true);
-      window.removeEventListener("blur", onWindowBlur);
-    };
-  }, [open, onClose, autoFocus]);
-  useEffect(() => {
-    if (!open) cancelClose();
-  }, [open, cancelClose]);
-  const scrollable = !items.some(
-    (entry) => !isSeparator(entry) && !isLabel(entry) && entry.submenu !== void 0 && entry.submenu.length > 0
-  );
-  const renderEntry = (entry) => {
-    if (isSeparator(entry)) {
-      return /* @__PURE__ */ jsx4("div", { className: Menu_module_default.separator, role: "separator" }, entry.id);
-    }
-    if (isLabel(entry)) {
-      return /* @__PURE__ */ jsx4("div", { className: Menu_module_default.label, role: "presentation", children: entry.text }, entry.id);
-    }
-    const hasSub = entry.submenu !== void 0 && entry.submenu.length > 0;
-    const subOpen = hasSub && openSubmenuId === entry.id;
-    const selected = entry.id === selectedId || selectedIds?.includes(entry.id) === true;
-    return /* @__PURE__ */ jsxs3(
-      "div",
-      {
-        className: Menu_module_default.itemWrap,
-        onMouseEnter: hasSub ? () => {
-          setOpenSubmenuId(entry.id);
-        } : void 0,
-        onMouseLeave: () => {
-          setOpenSubmenuId(null);
-        },
-        children: [
-          /* @__PURE__ */ jsxs3(
-            "button",
-            {
-              type: "button",
-              role: "menuitem",
-              className: clsx4(
-                Menu_module_default.item,
-                selected && (selection === "fill" ? Menu_module_default.selectedFill : Menu_module_default.selected),
-                entry.danger === true && Menu_module_default.danger
-              ),
-              disabled: entry.disabled,
-              "aria-keyshortcuts": entry.shortcut?.aria,
-              "aria-haspopup": hasSub ? "menu" : void 0,
-              "aria-expanded": hasSub ? subOpen : void 0,
-              onFocus: hasSub ? () => {
-                setOpenSubmenuId(entry.id);
-              } : void 0,
-              onClick: () => {
-                if (hasSub) {
-                  setOpenSubmenuId(entry.id);
-                  return;
-                }
-                onSelect?.(entry.id);
-              },
-              children: [
-                entry.icon !== void 0 && /* @__PURE__ */ jsx4("span", { className: Menu_module_default.itemIcon, children: entry.icon }),
-                /* @__PURE__ */ jsx4("span", { className: Menu_module_default.itemLabel, children: entry.label }),
-                entry.shortcut !== void 0 && /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: Menu_module_default.shortcut, children: /* @__PURE__ */ jsx4(ShortcutKeys, { keys: entry.shortcut.keys, className: Menu_module_default.shortcutKeys }) }),
-                selected && selection === "check" && /* @__PURE__ */ jsx4(IconCheckOutlineRegular, { className: Menu_module_default.check })
-              ]
-            }
-          ),
-          subOpen && entry.submenu !== void 0 && /* @__PURE__ */ jsx4(MenuSurface, { compact, className: clsx4(Menu_module_default.submenu, compact && Menu_module_default.compactList), role: "menu", children: entry.submenu.map((sub) => /* @__PURE__ */ jsxs3(
-            "button",
-            {
-              type: "button",
-              role: "menuitem",
-              className: Menu_module_default.item,
-              disabled: sub.disabled,
-              "aria-keyshortcuts": sub.shortcut?.aria,
-              onClick: () => {
-                onSelect?.(sub.id);
-                refocusAfterSelection();
-              },
-              children: [
-                sub.icon !== void 0 && /* @__PURE__ */ jsx4("span", { className: Menu_module_default.itemIcon, children: sub.icon }),
-                /* @__PURE__ */ jsx4("span", { className: Menu_module_default.itemLabel, children: sub.label }),
-                sub.shortcut !== void 0 && /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: Menu_module_default.shortcut, children: /* @__PURE__ */ jsx4(ShortcutKeys, { keys: sub.shortcut.keys, className: Menu_module_default.shortcutKeys }) })
-              ]
-            },
-            sub.id
-          )) })
-        ]
-      },
-      entry.id
-    );
-  };
-  const collapseSubmenuFrom = (e) => {
-    const row = e.target instanceof Element ? e.target.closest('button[role="menuitem"]') : null;
-    if (row === null || row.getAttribute("aria-haspopup") === "menu") return;
-    if (row.closest('[role="menu"]') !== e.currentTarget) return;
-    setOpenSubmenuId(null);
-  };
-  const list = open && /* @__PURE__ */ jsxs3(
-    MenuSurface,
-    {
-      compact,
-      ref: listRef,
-      className: clsx4(
-        Menu_module_default.list,
-        listClassName,
-        dense && Menu_module_default.denseList,
-        compact && Menu_module_default.compactList,
-        scrollable && Menu_module_default.scrollable,
-        portal && Menu_module_default.portal,
-        side === "top" && !portal && Menu_module_default.sideTop,
-        align === "end" && !portal && Menu_module_default.alignEnd
-      ),
-      style: portal ? fixedPos ?? MEASURE_STYLE : void 0,
-      role: "menu",
-      onClick: (e) => {
-        e.stopPropagation();
-        const row = e.target instanceof Element ? e.target.closest('button[role="menuitem"]') : null;
-        if (row !== null && row.getAttribute("aria-haspopup") !== "menu") refocusAfterSelection();
-      },
-      onMouseOver: collapseSubmenuFrom,
-      onFocus: collapseSubmenuFrom,
-      children: [
-        /* @__PURE__ */ jsxs3("div", { className: Menu_module_default.viewport, role: "presentation", children: [
-          items.map(renderEntry),
-          children
-        ] }),
-        footer !== void 0 && footer.length > 0 && /* @__PURE__ */ jsx4("div", { className: Menu_module_default.footer, role: "presentation", children: footer.map(renderEntry) })
-      ]
-    }
-  );
-  return /* @__PURE__ */ jsxs3(
-    "span",
-    {
-      ref: rootRef,
-      className: clsx4(Menu_module_default.root, className),
-      onPointerEnter: closeOnPointerLeave ? cancelClose : void 0,
-      onPointerLeave: closeOnPointerLeave ? () => {
-        if (open) armClose();
-      } : void 0,
-      children: [
-        anchor,
-        portal ? list !== false && createPortal2(list, document.body) : list
-      ]
-    }
-  );
-}
-
-export {
-  StateDot,
-  Pill,
-  observeComposition,
-  focusWithoutRing,
-  modalSelector,
-  closeTopModal,
-  isBehindModal,
-  useModalLayer,
-  MenuSurface,
-  MenuItemButton,
-  Menu
-};