@editora/ui-core 0.1.9 → 0.1.10

package/dist/context-menu.esm.js

@@ -0,0 +1,1204 @@
+import { E as A } from "./ElementBase-909688f3.mjs";
+import { c as S } from "./portal-1cf392ca.mjs";
+import { c as w } from "./dismissable-layer-9c7e6b58.mjs";
+import { c as P } from "./menu-item-styles-27fdbac4.mjs";
+import "./listbox-308789a0.mjs";
+import "./collection-a1aac0c6.mjs";
+import "./collection.esm.js";
+const p = '.menuitem, [role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [data-menu-item]', b = [
+  ":scope > .menuitem",
+  ':scope > [role="menuitem"]',
+  ':scope > [role="menuitemcheckbox"]',
+  ':scope > [role="menuitemradio"]',
+  ":scope > [data-menu-item]"
+].join(", "), L = ":scope > .submenu", u = 8, O = 6, C = 420, I = 110, k = [
+  "--ui-color-primary",
+  "--ui-color-primary-hover",
+  "--ui-color-foreground-on-primary",
+  "--ui-color-background",
+  "--ui-color-surface",
+  "--ui-color-surface-alt",
+  "--ui-color-text",
+  "--ui-color-muted",
+  "--ui-color-border",
+  "--ui-color-focus-ring",
+  "--ui-color-success",
+  "--ui-color-danger",
+  "--ui-color-warning",
+  "--ui-primary",
+  "--ui-primary-hover",
+  "--ui-foreground",
+  "--ui-background",
+  "--ui-surface",
+  "--ui-surface-alt",
+  "--ui-text",
+  "--ui-muted",
+  "--ui-border",
+  "--ui-focus-ring",
+  "--ui-radius",
+  "--color-background",
+  "--color-surface",
+  "--color-panel",
+  "--color-panel-solid",
+  "--color-panel-translucent",
+  "--color-overlay",
+  "--accent-contrast",
+  "--accent-surface",
+  "--accent-indicator",
+  "--accent-track"
+], R = [
+  { prefix: "--accent-", from: 1, to: 12 },
+  { prefix: "--accent-a", from: 1, to: 12 },
+  { prefix: "--gray-", from: 1, to: 12 },
+  { prefix: "--gray-a", from: 1, to: 12 },
+  { prefix: "--black-a", from: 1, to: 12 },
+  { prefix: "--white-a", from: 1, to: 12 },
+  { prefix: "--shadow-", from: 1, to: 6 },
+  { prefix: "--radius-", from: 1, to: 6 }
+], T = [
+  "--base-context-menu-bg",
+  "--base-context-menu-radius",
+  "--base-context-menu-shadow",
+  "--base-context-menu-min-width",
+  "--base-context-menu-padding",
+  "--base-context-menu-item-radius",
+  "--base-context-menu-item-gap",
+  "--base-context-menu-item-height",
+  "--base-context-menu-item-padding-y",
+  "--base-context-menu-item-padding-x",
+  "--base-context-menu-item-font-size",
+  "--base-context-menu-item-line-height",
+  "--base-context-menu-submenu-radius",
+  "--base-context-menu-submenu-padding"
+], v = `
+  :host {
+    position: fixed;
+    inset: 0;
+    display: block;
+    pointer-events: none;
+    z-index: var(--ui-context-menu-z, 1600);
+    color-scheme: light dark;
+
+    --ui-context-menu-bg: var(--base-context-menu-bg, var(--color-panel-solid, var(--ui-color-surface, var(--ui-surface, #ffffff))));
+    --ui-context-menu-color: var(--ui-color-text, var(--ui-text, #0f172a));
+    --ui-context-menu-border-color: color-mix(in srgb, var(--ui-color-border, var(--ui-border, #cbd5e1)) 86%, transparent);
+    --ui-context-menu-border: 1px solid var(--ui-context-menu-border-color);
+    --ui-context-menu-radius: var(--base-context-menu-radius, var(--ui-radius, 4px));
+    --ui-context-menu-shadow: var(--base-context-menu-shadow, var(--shadow-5));
+    --ui-context-menu-min-width: var(--base-context-menu-min-width, 240px);
+    --ui-context-menu-padding: var(--base-context-menu-padding, 6px);
+    --ui-context-menu-transition: 150ms cubic-bezier(0.2, 0.9, 0.24, 1);
+    --ui-context-menu-ring: var(--ui-color-focus-ring, var(--ui-focus-ring, #2563eb));
+    --ui-context-menu-submenu-gap: 4px;
+    --ui-context-menu-item-radius: var(--base-context-menu-item-radius, calc(var(--ui-context-menu-radius) - 1px));
+    --ui-context-menu-item-gap: var(--base-context-menu-item-gap, 12px);
+    --ui-context-menu-item-min-height: var(--base-context-menu-item-height, 36px);
+    --ui-context-menu-item-pad-y: var(--base-context-menu-item-padding-y, 8px);
+    --ui-context-menu-item-pad-x: var(--base-context-menu-item-padding-x, 10px);
+    --ui-context-menu-item-font-size: var(--base-context-menu-item-font-size, 14px);
+    --ui-context-menu-item-font-weight: 400;
+    --ui-context-menu-item-line-height: var(--base-context-menu-item-line-height, 20px);
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, var(--gray-a4, rgba(15, 23, 42, 0.08)) 82%, transparent);
+    --ui-context-menu-item-active-color: inherit;
+    --ui-context-menu-separator-margin: 6px 10px;
+    --ui-context-menu-submenu-radius: var(--base-context-menu-submenu-radius, var(--ui-context-menu-radius));
+    --ui-context-menu-submenu-padding: var(--base-context-menu-submenu-padding, 6px);
+    --ui-context-menu-status-bg: color-mix(in srgb, var(--ui-context-menu-bg) 92%, transparent);
+    --ui-context-menu-status-border: color-mix(in srgb, var(--ui-context-menu-border-color) 76%, transparent);
+    --ui-context-menu-status-text: color-mix(in srgb, var(--ui-context-menu-color) 64%, transparent);
+  }
+
+  :host([size="sm"]),
+  :host([size="1"]) {
+    --ui-context-menu-padding: 4px;
+    --ui-context-menu-item-gap: 8px;
+    --ui-context-menu-item-min-height: 32px;
+    --ui-context-menu-item-pad-y: 6px;
+    --ui-context-menu-item-pad-x: 8px;
+    --ui-context-menu-item-font-size: 13px;
+    --ui-context-menu-item-line-height: 18px;
+    --ui-context-menu-separator-margin: 4px 8px;
+  }
+
+  :host([size="lg"]),
+  :host([size="3"]) {
+    --ui-context-menu-padding: 8px;
+    --ui-context-menu-item-gap: 12px;
+    --ui-context-menu-item-min-height: 40px;
+    --ui-context-menu-item-pad-y: 9px;
+    --ui-context-menu-item-pad-x: 12px;
+    --ui-context-menu-item-font-size: 15px;
+    --ui-context-menu-item-line-height: 22px;
+    --ui-context-menu-separator-margin: 8px 12px;
+  }
+
+  :host([radius="none"]) {
+    --ui-context-menu-radius: 0px;
+    --ui-context-menu-item-radius: 0px;
+    --ui-context-menu-submenu-radius: 0px;
+  }
+
+  :host([radius="sm"]) {
+    --ui-context-menu-radius: 8px;
+    --ui-context-menu-item-radius: 7px;
+    --ui-context-menu-submenu-radius: 8px;
+  }
+
+  :host([radius="md"]) {
+    --ui-context-menu-radius: 12px;
+    --ui-context-menu-item-radius: 10px;
+    --ui-context-menu-submenu-radius: 12px;
+  }
+
+  :host([radius="lg"]) {
+    --ui-context-menu-radius: 16px;
+    --ui-context-menu-item-radius: 14px;
+    --ui-context-menu-submenu-radius: 16px;
+  }
+
+  :host([radius="full"]) {
+    --ui-context-menu-radius: 999px;
+    --ui-context-menu-item-radius: 999px;
+    --ui-context-menu-submenu-radius: 20px;
+  }
+
+  :host([shape="square"]) {
+    --ui-context-menu-radius: 6px;
+    --ui-context-menu-item-radius: 4px;
+    --ui-context-menu-submenu-radius: 6px;
+  }
+
+  :host([shape="soft"]) {
+    --ui-context-menu-radius: 16px;
+    --ui-context-menu-item-radius: 12px;
+    --ui-context-menu-submenu-radius: 14px;
+  }
+
+  :host([density="compact"]) {
+    --ui-context-menu-padding: 4px;
+    --ui-context-menu-item-gap: 8px;
+    --ui-context-menu-item-min-height: 32px;
+    --ui-context-menu-item-pad-y: 6px;
+    --ui-context-menu-item-pad-x: 8px;
+    --ui-context-menu-item-font-size: 12px;
+    --ui-context-menu-separator-margin: 4px 8px;
+  }
+
+  :host([density="comfortable"]) {
+    --ui-context-menu-padding: 8px;
+    --ui-context-menu-item-gap: 12px;
+    --ui-context-menu-item-min-height: 40px;
+    --ui-context-menu-item-pad-y: 9px;
+    --ui-context-menu-item-pad-x: 12px;
+    --ui-context-menu-item-font-size: 14px;
+    --ui-context-menu-separator-margin: 8px 12px;
+  }
+
+  :host([elevation="none"]) {
+    --ui-context-menu-shadow: none;
+  }
+
+  :host([elevation="low"]) {
+    --ui-context-menu-shadow:
+      0 16px 34px rgba(15, 23, 42, 0.14),
+      0 4px 10px rgba(15, 23, 42, 0.08);
+  }
+
+  :host([elevation="high"]) {
+    --ui-context-menu-shadow:
+      0 36px 72px rgba(15, 23, 42, 0.24),
+      0 10px 24px rgba(15, 23, 42, 0.12);
+  }
+
+  :host([variant="surface"]) {
+    --ui-context-menu-shadow: var(--base-context-menu-shadow, var(--shadow-4));
+  }
+
+  :host([variant="soft"]) {
+    --ui-context-menu-bg: color-mix(in srgb, var(--base-context-menu-bg, var(--color-panel-solid, #ffffff)) 94%, var(--accent-surface, transparent));
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, var(--ui-context-menu-ring) 13%, transparent);
+  }
+
+  :host([variant="solid"]) {
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, var(--ui-context-menu-ring) 88%, #0f172a 12%);
+    --ui-context-menu-item-active-color: var(--ui-color-foreground-on-primary, var(--ui-foreground, #ffffff));
+  }
+
+  :host([variant="outline"]) {
+    --ui-context-menu-shadow: none;
+    --ui-context-menu-bg: var(--base-context-menu-bg, var(--color-panel-solid, #ffffff));
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, var(--ui-context-menu-ring) 8%, transparent);
+  }
+
+  :host([variant="flat"]) {
+    --ui-context-menu-shadow: none;
+  }
+
+  :host([variant="contrast"]) {
+    --ui-context-menu-bg: #0f172a;
+    --ui-context-menu-color: #f8fafc;
+    --ui-context-menu-border-color: #334155;
+    --ui-context-menu-ring: #93c5fd;
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, #ffffff 12%, transparent);
+  }
+
+  :host([tone="danger"]) {
+    --ui-context-menu-ring: #ef4444;
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, #ef4444 12%, transparent);
+    --ui-context-menu-item-active-color: inherit;
+  }
+
+  :host([tone="success"]) {
+    --ui-context-menu-ring: #16a34a;
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, #16a34a 12%, transparent);
+    --ui-context-menu-item-active-color: inherit;
+  }
+
+  :host([tone="warning"]) {
+    --ui-context-menu-ring: #d97706;
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, #d97706 12%, transparent);
+    --ui-context-menu-item-active-color: inherit;
+  }
+
+  :host([tone="info"]) {
+    --ui-context-menu-ring: var(--ui-color-primary, var(--ui-primary, #2563eb));
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, var(--ui-color-primary, var(--ui-primary, #2563eb)) 12%, transparent);
+    --ui-context-menu-item-active-color: inherit;
+  }
+
+  :host([tone="neutral"]) {
+    --ui-context-menu-ring: color-mix(in srgb, var(--ui-color-muted, #64748b) 60%, var(--ui-color-text, #0f172a));
+    --ui-context-menu-item-hover-bg: color-mix(in srgb, var(--ui-color-muted, #64748b) 12%, transparent);
+    --ui-context-menu-item-active-color: inherit;
+  }
+
+  .surface {
+    position: fixed;
+    left: 0;
+    top: 0;
+    min-width: var(--ui-context-menu-min-width);
+    max-width: min(360px, calc(100vw - 16px));
+    padding: var(--ui-context-menu-padding);
+    border: var(--ui-context-menu-border);
+    border-radius: var(--ui-context-menu-radius);
+    background: var(--ui-context-menu-bg);
+    color: var(--ui-context-menu-color);
+    box-shadow: var(--ui-context-menu-shadow);
+    overflow: visible;
+    isolation: isolate;
+    opacity: 0;
+    transform: translateY(4px) scale(0.985);
+    transform-origin: top left;
+    transition:
+      opacity var(--ui-context-menu-transition),
+      transform var(--ui-context-menu-transition),
+      border-color var(--ui-context-menu-transition),
+      box-shadow var(--ui-context-menu-transition);
+    pointer-events: none;
+    outline: none;
+  }
+
+  :host([open]) .surface {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+    pointer-events: auto;
+  }
+
+  :host([disabled]) .surface,
+  :host([state="loading"]) .surface,
+  :host([headless]) .surface {
+    pointer-events: none;
+  }
+
+  :host([headless]) .surface {
+    display: none;
+  }
+
+  .state-row {
+    display: none;
+    margin: 0 2px 6px;
+    min-height: 24px;
+    padding: 0 8px;
+    border-radius: 8px;
+    border: 1px solid var(--ui-context-menu-status-border);
+    background: var(--ui-context-menu-status-bg);
+    color: var(--ui-context-menu-status-text);
+    font: 600 11px/24px Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+    user-select: none;
+  }
+
+  :host([state="loading"]) .state-row,
+  :host([state="error"]) .state-row,
+  :host([state="success"]) .state-row {
+    display: block;
+  }
+
+  :host([state="loading"]) {
+    --ui-context-menu-status-bg: color-mix(in srgb, #f59e0b 16%, transparent);
+    --ui-context-menu-status-border: color-mix(in srgb, #f59e0b 46%, var(--ui-context-menu-border-color));
+    --ui-context-menu-status-text: #a16207;
+  }
+
+  :host([state="error"]) {
+    --ui-context-menu-status-bg: color-mix(in srgb, #ef4444 14%, transparent);
+    --ui-context-menu-status-border: color-mix(in srgb, #ef4444 46%, var(--ui-context-menu-border-color));
+    --ui-context-menu-status-text: #b91c1c;
+  }
+
+  :host([state="success"]) {
+    --ui-context-menu-status-bg: color-mix(in srgb, #16a34a 14%, transparent);
+    --ui-context-menu-status-border: color-mix(in srgb, #16a34a 46%, var(--ui-context-menu-border-color));
+    --ui-context-menu-status-text: #15803d;
+  }
+`, E = `
+  ui-context-menu [slot="menu"],
+  ui-context-menu [slot="content"] {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+  }
+  ${P({
+  scopes: ['ui-context-menu [slot="menu"]', 'ui-context-menu [slot="content"]'],
+  prefix: "--ui-context-menu",
+  itemSelectors: [".menuitem", '[role="menuitem"]', '[role="menuitemcheckbox"]', '[role="menuitemradio"]', "[data-menu-item]"],
+  activeStateSelectors: ['.menuitem[data-submenu-open="true"]', '[role="menuitem"][data-submenu-open="true"]']
+})}
+
+  ui-context-menu [slot="menu"] .submenu,
+  ui-context-menu [slot="content"] .submenu {
+    position: absolute;
+    top: -6px;
+    left: calc(100% + var(--ui-context-menu-submenu-gap, 4px));
+    min-width: max(220px, 100%);
+    padding: var(--ui-context-menu-submenu-padding, 6px);
+    border: 1px solid var(--ui-context-menu-border-color, rgba(15, 23, 42, 0.14));
+    border-radius: var(--ui-context-menu-submenu-radius, 10px);
+    background: var(--ui-context-menu-bg, #ffffff);
+    color: var(--ui-context-menu-color, #0f172a);
+    box-shadow: var(--ui-context-menu-shadow, 0 24px 56px rgba(15, 23, 42, 0.18));
+    opacity: 0;
+    visibility: hidden;
+    transform: translateY(4px) scale(0.985);
+    transform-origin: top left;
+    pointer-events: none;
+    transition: opacity 150ms cubic-bezier(0.2, 0.9, 0.24, 1), transform 150ms cubic-bezier(0.2, 0.9, 0.24, 1);
+    z-index: 1;
+  }
+
+  ui-context-menu [slot="menu"] .menuitem[data-submenu-open="true"] > .submenu,
+  ui-context-menu [slot="menu"] [role="menuitem"][data-submenu-open="true"] > .submenu,
+  ui-context-menu [slot="content"] .menuitem[data-submenu-open="true"] > .submenu,
+  ui-context-menu [slot="content"] [role="menuitem"][data-submenu-open="true"] > .submenu {
+    opacity: 1;
+    visibility: visible;
+    transform: translateY(0) scale(1);
+    pointer-events: auto;
+  }
+
+  ui-context-menu [slot="menu"] .menuitem[data-submenu-side="left"] > .submenu,
+  ui-context-menu [slot="menu"] [role="menuitem"][data-submenu-side="left"] > .submenu,
+  ui-context-menu [slot="content"] .menuitem[data-submenu-side="left"] > .submenu,
+  ui-context-menu [slot="content"] [role="menuitem"][data-submenu-side="left"] > .submenu {
+    left: auto;
+    right: calc(100% + var(--ui-context-menu-submenu-gap, 4px));
+    transform-origin: top right;
+  }
+
+  ui-context-menu [slot="menu"] .menuitem[data-submenu-align="up"] > .submenu,
+  ui-context-menu [slot="menu"] [role="menuitem"][data-submenu-align="up"] > .submenu,
+  ui-context-menu [slot="content"] .menuitem[data-submenu-align="up"] > .submenu,
+  ui-context-menu [slot="content"] [role="menuitem"][data-submenu-align="up"] > .submenu {
+    top: auto;
+    bottom: -6px;
+  }
+`;
+function z() {
+  if (typeof document > "u")
+    return;
+  const s = "ui-context-menu-light-dom-style";
+  if (document.getElementById(s))
+    return;
+  const t = document.createElement("style");
+  t.id = s, t.textContent = E, document.head.appendChild(t);
+}
+function B(s, t) {
+  return s.replace(/(^|})\s*([^@}{][^{}]*)\{/g, (e, i, n) => {
+    const o = n.split(",").map((r) => r.trim()).filter(Boolean).map((r) => r.startsWith(t) ? r : `${t} ${r}`).join(", ");
+    return `${i}
+${o} {`;
+  });
+}
+function F(s) {
+  const t = s.replace(/:host\(\[([a-z-]+)(?:="([^"]+)")?\]\)/g, (e, i, n) => n != null ? `.ui-context-menu-portal[data-${i}="${n}"]` : `.ui-context-menu-portal[data-${i}="true"]`).replace(/:host/g, ".ui-context-menu-portal");
+  return B(t, ".ui-context-menu-portal");
+}
+function H(s) {
+  return s.replace(/(^|,)\s*ui-context-menu\b/gm, (t, e) => `${e} .ui-context-menu-portal`);
+}
+const D = `${F(v)}
+${H(E)}`;
+function y(s, t, e) {
+  return Math.min(e, Math.max(t, s));
+}
+function M(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function q(s, t) {
+  return typeof s == "number" ? { x: s, y: typeof t == "number" ? t : 0 } : s;
+}
+function $(s) {
+  return s === "top" || s === "left" || s === "right" ? s : "bottom";
+}
+function _(s) {
+  if (!s)
+    return "";
+  const t = s.trim().toLowerCase();
+  return t === "1" ? "sm" : t === "2" ? "md" : t === "3" ? "lg" : t === "sm" || t === "md" || t === "lg" ? t : t === "compact" ? "sm" : t === "comfortable" ? "lg" : "";
+}
+function g(s) {
+  if (!s)
+    return "";
+  const t = s.trim().toLowerCase();
+  return t ? t === "none" ? "0px" : t === "sm" ? "8px" : t === "md" ? "12px" : t === "lg" ? "16px" : t === "full" ? "999px" : t === "square" ? "6px" : t === "soft" ? "16px" : /^\d+(\.\d+)?$/.test(t) ? `${t}px` : s : "";
+}
+function V(s) {
+  if (!s.isConnected || s.hidden)
+    return !1;
+  const t = window.getComputedStyle(s);
+  return !(t.display === "none" || t.visibility === "hidden");
+}
+function N(s) {
+  if (!s.isConnected)
+    return !1;
+  const t = window.getComputedStyle(s);
+  if (t.display === "none" || t.visibility === "hidden")
+    return !1;
+  const e = s.getBoundingClientRect();
+  if (e.width > 0 || e.height > 0)
+    return !0;
+  const i = Number.parseFloat(t.width || "0"), n = Number.parseFloat(t.height || "0");
+  return i > 0 || n > 0;
+}
+function x(s) {
+  const t = s.getAttribute("aria-disabled");
+  return s.hasAttribute("disabled") || t === "true" || s.disabled === !0;
+}
+function G(s) {
+  for (const t of s)
+    if (t instanceof HTMLElement && t.matches(p))
+      return t;
+  return null;
+}
+function W(s) {
+  return {
+    top: s.y,
+    left: s.x,
+    right: s.x,
+    bottom: s.y,
+    width: 0,
+    height: 0
+  };
+}
+function U(s, t, e, i, n) {
+  const o = window.innerWidth || document.documentElement.clientWidth || 0, r = window.innerHeight || document.documentElement.clientHeight || 0, a = Math.max(u, o - t - u), c = Math.max(u, r - e - u);
+  let l = i, h = i === "left" ? s.left - t - n : i === "right" ? s.right + n : s.left, m = i === "top" ? s.top - e - n : i === "bottom" ? s.bottom + n : s.top;
+  return i === "top" || i === "bottom" ? l === "bottom" && m + e > r - u && s.top - e - n >= u ? (l = "top", m = s.top - e - n) : l === "top" && m < u && s.bottom + n + e <= r - u && (l = "bottom", m = s.bottom + n) : (i === "left" || i === "right") && (l === "right" && h + t > o - u && s.left - t - n >= u ? (l = "left", h = s.left - t - n) : l === "left" && h < u && s.right + n + t <= o - u && (l = "right", h = s.right + n)), h = y(h, u, a), m = y(m, u, c), {
+    x: Math.round(h),
+    y: Math.round(m),
+    placement: l,
+    maxWidth: Math.max(160, o - u * 2),
+    maxHeight: Math.max(120, r - u * 2)
+  };
+}
+class Y extends A {
+  constructor() {
+    super(), this._isOpen = !1, this._anchorEl = null, this._point = { x: 0, y: 0 }, this._restoreFocusEl = null, this._portalEl = null, this._portalSurfaceEl = null, this._portalContentHostEl = null, this._dismissableLayer = null, this._contentAnchor = null, this._contentSourceEl = null, this._contentOriginalParent = null, this._positionRaf = null, this._submenuRaf = null, this._anchorTrackRaf = null, this._typeaheadBuffer = "", this._typeaheadTimer = null, this._submenuIntentTimer = null, this._submenuIntentItem = null, this._hoveredItem = null, this._lastAnchorRect = null, this._resizeListenerBound = !1, this._scrollListenerBound = !1, this._nextOpenSource = "attribute", this._onRootClick = this._onRootClick.bind(this), this._onRootKeyDown = this._onRootKeyDown.bind(this), this._onRootPointerOver = this._onRootPointerOver.bind(this), this._onRootPointerLeave = this._onRootPointerLeave.bind(this), this._onRootFocusIn = this._onRootFocusIn.bind(this), this._onContextMenu = this._onContextMenu.bind(this), this._onViewportChange = this._onViewportChange.bind(this), this._trackAnchorLayout = this._trackAnchorLayout.bind(this);
+  }
+  static get observedAttributes() {
+    return [
+      "open",
+      "headless",
+      "variant",
+      "size",
+      "radius",
+      "density",
+      "shape",
+      "elevation",
+      "tone",
+      "close-on-select",
+      "close-on-escape",
+      "typeahead",
+      "state",
+      "state-text",
+      "disabled",
+      "placement"
+    ];
+  }
+  connectedCallback() {
+    super.connectedCallback(), z(), this.addEventListener("contextmenu", this._onContextMenu), this._syncVisualState(), this._syncOpenState();
+  }
+  disconnectedCallback() {
+    this.removeEventListener("contextmenu", this._onContextMenu), this._unbindGlobalListeners(), this._cancelScheduledWork(), this._teardownPortal(), super.disconnectedCallback();
+  }
+  attributeChangedCallback(t, e, i) {
+    if (e !== i) {
+      if (t === "open") {
+        this._syncOpenState();
+        return;
+      }
+      if (t === "headless") {
+        this.headless && this._isOpen && this.close(), this._syncSurfaceState(), this._syncPortalVisualState();
+        return;
+      }
+      if (t === "disabled") {
+        this.isDisabled && this._isOpen && this._setOpen(!1, "attribute"), this._syncSurfaceState(), this._syncPortalVisualState();
+        return;
+      }
+      if (t === "state" || t === "state-text") {
+        this._syncPortalVisualState(), this.isConnected && this.requestRender();
+        return;
+      }
+      (t === "variant" || t === "size" || t === "radius" || t === "density" || t === "shape" || t === "elevation" || t === "tone") && this._syncVisualState(), this._isOpen && (t === "placement" || t === "variant" || t === "size" || t === "radius" || t === "density" || t === "shape" || t === "elevation" || t === "tone") && (this._syncPortalVisualState(), this._schedulePosition(), this._scheduleSubmenuLayout());
+    }
+  }
+  get open() {
+    return this.hasAttribute("open");
+  }
+  set open(t) {
+    this._setOpen(t, "api");
+  }
+  get headless() {
+    return this.hasAttribute("headless");
+  }
+  set headless(t) {
+    t ? this.setAttribute("headless", "") : this.removeAttribute("headless");
+  }
+  get closeOnSelect() {
+    const t = this.getAttribute("close-on-select");
+    return t == null ? !0 : t !== "false" && t !== "0";
+  }
+  set closeOnSelect(t) {
+    this.setAttribute("close-on-select", t ? "true" : "false");
+  }
+  get closeOnEscape() {
+    const t = this.getAttribute("close-on-escape");
+    return t == null ? !0 : t !== "false" && t !== "0";
+  }
+  set closeOnEscape(t) {
+    this.setAttribute("close-on-escape", t ? "true" : "false");
+  }
+  get typeahead() {
+    const t = this.getAttribute("typeahead");
+    return t == null ? !0 : t !== "false" && t !== "0";
+  }
+  set typeahead(t) {
+    this.setAttribute("typeahead", t ? "true" : "false");
+  }
+  get state() {
+    const t = (this.getAttribute("state") || "idle").toLowerCase();
+    return t === "loading" || t === "error" || t === "success" ? t : "idle";
+  }
+  set state(t) {
+    t === "idle" ? this.removeAttribute("state") : this.setAttribute("state", t);
+  }
+  get isDisabled() {
+    const t = this.getAttribute("disabled");
+    return t == null ? !1 : t !== "false" && t !== "0";
+  }
+  set disabled(t) {
+    t ? this.setAttribute("disabled", "") : this.removeAttribute("disabled");
+  }
+  openAt(t, e) {
+    if (!(this.headless || this.isDisabled)) {
+      if (this._anchorEl = null, this._point = q(t, e), this._isOpen) {
+        this._syncGlobalListeners(!0), this._syncDismissableLayer(), this._schedulePosition(), this._scheduleSubmenuLayout();
+        return;
+      }
+      this._setOpen(!0, "api");
+    }
+  }
+  openForAnchor(t) {
+    if (this.headless || this.isDisabled)
+      return;
+    this._anchorEl = t;
+    const e = t.getBoundingClientRect();
+    if (this._point = { x: e.left, y: e.bottom }, this._isOpen) {
+      this._syncGlobalListeners(!0), this._syncDismissableLayer(), this._schedulePosition(), this._scheduleSubmenuLayout();
+      return;
+    }
+    this._setOpen(!0, "anchor");
+  }
+  openForAnchorId(t) {
+    const e = typeof document < "u" ? document.getElementById(t) : null;
+    e && this.openForAnchor(e);
+  }
+  showForAnchorId(t) {
+    this.openForAnchorId(t);
+  }
+  openFor(t) {
+    if (typeof t == "string") {
+      this.openForAnchorId(t);
+      return;
+    }
+    this.openForAnchor(t);
+  }
+  close() {
+    this._setOpen(!1, "api");
+  }
+  getPortalContentHost() {
+    return this._portalContentHostEl;
+  }
+  refreshLayout() {
+    this._isOpen && (this._normalizeMenuSemantics(), this._schedulePosition(), this._scheduleSubmenuLayout());
+  }
+  _surface() {
+    return this._portalSurfaceEl || this.root.querySelector(".surface");
+  }
+  _listbox() {
+    return this._portalContentHostEl || this.root.querySelector("ui-listbox.content-host");
+  }
+  _menuHost() {
+    return this._contentSourceEl || this._portalContentHostEl || this.querySelector('[slot="menu"]') || this.querySelector('[slot="content"]');
+  }
+  _stateText() {
+    const t = this.getAttribute("state-text");
+    return t || (this.state === "loading" ? "Loading actions" : this.state === "error" ? "Action unavailable" : this.state === "success" ? "Action ready" : "");
+  }
+  _emitOpenState(t, e, i) {
+    const n = { open: t, previousOpen: e, source: i };
+    this.dispatchEvent(new CustomEvent(t ? "open" : "close", { detail: n, bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent(t ? "ui-open" : "ui-close", { detail: n, bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent("change", { detail: { ...n }, bubbles: !0, composed: !0 }));
+  }
+  _setOpen(t, e) {
+    t !== this.open && (t && (this.headless || this.isDisabled) || (this._nextOpenSource = e, t ? this.setAttribute("open", "") : this.removeAttribute("open")));
+  }
+  _syncOpenState() {
+    var i;
+    const t = this.hasAttribute("open"), e = this._nextOpenSource;
+    if (this._nextOpenSource = "attribute", t === this._isOpen) {
+      this._syncGlobalListeners(t), t ? ((!this._portalEl || !this._portalEl.isConnected) && this._mountPortal(), this._syncPortalVisualState(), this._syncSurfaceState(), this._syncDismissableLayer(), this._schedulePosition(), this._scheduleSubmenuLayout()) : this._syncSurfaceState();
+      return;
+    }
+    if (this._isOpen = t, this._syncGlobalListeners(t), t) {
+      this._restoreFocusEl = document.activeElement instanceof HTMLElement ? document.activeElement : null, this._mountPortal(), this._normalizeMenuSemantics(), this._syncSurfaceState(), this._emitOpenState(!0, !1, e), this._schedulePosition(), this._scheduleSubmenuLayout(), requestAnimationFrame(() => {
+        this._focusFirstItem();
+      });
+      return;
+    }
+    if (this._clearSubmenuState(), this._cancelScheduledWork(), this._teardownPortal(), this._syncSurfaceState(), this._anchorEl = null, this._emitOpenState(!1, !0, e), (i = this._restoreFocusEl) != null && i.isConnected)
+      try {
+        this._restoreFocusEl.focus();
+      } catch {
+      }
+    this._restoreFocusEl = null;
+  }
+  _syncSurfaceState() {
+    const t = this._surface();
+    if (!t)
+      return;
+    const e = this._isOpen && !this.headless, i = e && !this.isDisabled && this.state !== "loading";
+    t.setAttribute("aria-hidden", this._isOpen ? "false" : "true"), t.setAttribute("aria-busy", this.state === "loading" ? "true" : "false"), this._isOpen ? t.removeAttribute("hidden") : t.setAttribute("hidden", ""), t.style.display = this.headless ? "none" : "block", t.style.visibility = e ? "visible" : "hidden", t.style.opacity = e ? "1" : "0", t.style.transform = e ? "translateY(0) scale(1)" : "translateY(4px) scale(0.985)", t.style.pointerEvents = i ? "auto" : "none";
+  }
+  _syncVisualState() {
+    const t = _(this.getAttribute("size") || this.getAttribute("density"));
+    t && t !== "md" ? this.setAttribute("data-ui-context-menu-size", t) : this.removeAttribute("data-ui-context-menu-size"), t === "sm" ? (this.style.setProperty("--ui-context-menu-padding", "4px"), this.style.setProperty("--ui-context-menu-item-gap", "8px"), this.style.setProperty("--ui-context-menu-item-min-height", "32px"), this.style.setProperty("--ui-context-menu-item-pad-y", "6px"), this.style.setProperty("--ui-context-menu-item-pad-x", "8px"), this.style.setProperty("--ui-context-menu-item-font-size", "13px"), this.style.setProperty("--ui-context-menu-item-line-height", "18px"), this.style.setProperty("--ui-context-menu-separator-margin", "4px 8px")) : t === "lg" ? (this.style.setProperty("--ui-context-menu-padding", "8px"), this.style.setProperty("--ui-context-menu-item-gap", "12px"), this.style.setProperty("--ui-context-menu-item-min-height", "40px"), this.style.setProperty("--ui-context-menu-item-pad-y", "9px"), this.style.setProperty("--ui-context-menu-item-pad-x", "12px"), this.style.setProperty("--ui-context-menu-item-font-size", "15px"), this.style.setProperty("--ui-context-menu-item-line-height", "22px"), this.style.setProperty("--ui-context-menu-separator-margin", "8px 12px")) : (this.style.removeProperty("--ui-context-menu-padding"), this.style.removeProperty("--ui-context-menu-item-gap"), this.style.removeProperty("--ui-context-menu-item-min-height"), this.style.removeProperty("--ui-context-menu-item-pad-y"), this.style.removeProperty("--ui-context-menu-item-pad-x"), this.style.removeProperty("--ui-context-menu-item-font-size"), this.style.removeProperty("--ui-context-menu-item-line-height"), this.style.removeProperty("--ui-context-menu-separator-margin"));
+    const e = g(this.getAttribute("radius") || this.getAttribute("shape"));
+    e ? (this.style.setProperty("--ui-context-menu-radius", e), this.style.setProperty("--ui-context-menu-item-radius", e), this.style.setProperty("--ui-context-menu-submenu-radius", e)) : (this.style.removeProperty("--ui-context-menu-radius"), this.style.removeProperty("--ui-context-menu-item-radius"), this.style.removeProperty("--ui-context-menu-submenu-radius"));
+  }
+  _syncGlobalListeners(t) {
+    const e = t, i = t && !!this._anchorEl;
+    e && !this._resizeListenerBound ? (window.addEventListener("resize", this._onViewportChange), this._resizeListenerBound = !0) : !e && this._resizeListenerBound && (window.removeEventListener("resize", this._onViewportChange), this._resizeListenerBound = !1), i && !this._scrollListenerBound ? (window.addEventListener("scroll", this._onViewportChange, !0), this._scrollListenerBound = !0) : !i && this._scrollListenerBound && (window.removeEventListener("scroll", this._onViewportChange, !0), this._scrollListenerBound = !1), t && this._anchorEl ? this._startAnchorTracking() : this._stopAnchorTracking();
+  }
+  _unbindGlobalListeners() {
+    this._syncGlobalListeners(!1);
+  }
+  _bindPortalInteractionListeners() {
+    this._portalEl && (this._portalEl.addEventListener("click", this._onRootClick), this._portalEl.addEventListener("keydown", this._onRootKeyDown), this._portalEl.addEventListener("pointerover", this._onRootPointerOver), this._portalEl.addEventListener("pointerleave", this._onRootPointerLeave), this._portalEl.addEventListener("focusin", this._onRootFocusIn));
+  }
+  _unbindPortalInteractionListeners() {
+    this._portalEl && (this._portalEl.removeEventListener("click", this._onRootClick), this._portalEl.removeEventListener("keydown", this._onRootKeyDown), this._portalEl.removeEventListener("pointerover", this._onRootPointerOver), this._portalEl.removeEventListener("pointerleave", this._onRootPointerLeave), this._portalEl.removeEventListener("focusin", this._onRootFocusIn));
+  }
+  _setPortalFlag(t, e) {
+    this._portalEl && (e ? this._portalEl.setAttribute(`data-${t}`, "true") : this._portalEl.removeAttribute(`data-${t}`));
+  }
+  _syncPortalThemeVariables() {
+    if (!this._portalEl)
+      return;
+    const t = getComputedStyle(this), e = (i) => {
+      const n = t.getPropertyValue(i).trim();
+      n ? this._portalEl.style.setProperty(i, n) : this._portalEl.style.removeProperty(i);
+    };
+    k.forEach(e), T.forEach(e), R.forEach(({ prefix: i, from: n, to: o }) => {
+      for (let r = n; r <= o; r += 1)
+        e(`${i}${r}`);
+    });
+  }
+  _syncPortalVisualState() {
+    if (!this._portalEl)
+      return;
+    const t = _(this.getAttribute("size") || this.getAttribute("density")), e = g(this.getAttribute("radius") || this.getAttribute("shape"));
+    this._syncPortalThemeVariables(), this._setPortalFlag("open", this._isOpen), this._setPortalFlag("headless", this.headless), this._setPortalFlag("disabled", this.isDisabled);
+    const i = this.getAttribute("variant"), n = _(this.getAttribute("size") || this.getAttribute("density")), o = this.getAttribute("density"), r = this.getAttribute("radius"), a = this.getAttribute("shape"), c = this.getAttribute("elevation"), l = this.getAttribute("tone"), h = this.getAttribute("placement");
+    i ? this._portalEl.setAttribute("data-variant", i) : this._portalEl.removeAttribute("data-variant"), n && n !== "md" ? this._portalEl.setAttribute("data-size", n) : this._portalEl.removeAttribute("data-size"), o ? this._portalEl.setAttribute("data-density", o) : this._portalEl.removeAttribute("data-density"), r ? this._portalEl.setAttribute("data-radius", r) : this._portalEl.removeAttribute("data-radius"), a ? this._portalEl.setAttribute("data-shape", a) : this._portalEl.removeAttribute("data-shape"), c ? this._portalEl.setAttribute("data-elevation", c) : this._portalEl.removeAttribute("data-elevation"), l ? this._portalEl.setAttribute("data-tone", l) : this._portalEl.removeAttribute("data-tone"), h ? this._portalEl.setAttribute("data-placement-request", h) : this._portalEl.removeAttribute("data-placement-request"), t === "sm" ? (this._portalEl.style.setProperty("--ui-context-menu-padding", "4px"), this._portalEl.style.setProperty("--ui-context-menu-item-gap", "8px"), this._portalEl.style.setProperty("--ui-context-menu-item-min-height", "32px"), this._portalEl.style.setProperty("--ui-context-menu-item-pad-y", "6px"), this._portalEl.style.setProperty("--ui-context-menu-item-pad-x", "8px"), this._portalEl.style.setProperty("--ui-context-menu-item-font-size", "13px"), this._portalEl.style.setProperty("--ui-context-menu-item-line-height", "18px"), this._portalEl.style.setProperty("--ui-context-menu-separator-margin", "4px 8px")) : t === "lg" ? (this._portalEl.style.setProperty("--ui-context-menu-padding", "8px"), this._portalEl.style.setProperty("--ui-context-menu-item-gap", "12px"), this._portalEl.style.setProperty("--ui-context-menu-item-min-height", "40px"), this._portalEl.style.setProperty("--ui-context-menu-item-pad-y", "9px"), this._portalEl.style.setProperty("--ui-context-menu-item-pad-x", "12px"), this._portalEl.style.setProperty("--ui-context-menu-item-font-size", "15px"), this._portalEl.style.setProperty("--ui-context-menu-item-line-height", "22px"), this._portalEl.style.setProperty("--ui-context-menu-separator-margin", "8px 12px")) : (this._portalEl.style.removeProperty("--ui-context-menu-padding"), this._portalEl.style.removeProperty("--ui-context-menu-item-gap"), this._portalEl.style.removeProperty("--ui-context-menu-item-min-height"), this._portalEl.style.removeProperty("--ui-context-menu-item-pad-y"), this._portalEl.style.removeProperty("--ui-context-menu-item-pad-x"), this._portalEl.style.removeProperty("--ui-context-menu-item-font-size"), this._portalEl.style.removeProperty("--ui-context-menu-item-line-height"), this._portalEl.style.removeProperty("--ui-context-menu-separator-margin")), e ? (this._portalEl.style.setProperty("--ui-context-menu-radius", e), this._portalEl.style.setProperty("--ui-context-menu-item-radius", e), this._portalEl.style.setProperty("--ui-context-menu-submenu-radius", e)) : (this._portalEl.style.removeProperty("--ui-context-menu-radius"), this._portalEl.style.removeProperty("--ui-context-menu-item-radius"), this._portalEl.style.removeProperty("--ui-context-menu-submenu-radius")), this.state !== "idle" ? this._portalEl.setAttribute("data-state", this.state) : this._portalEl.removeAttribute("data-state");
+    const m = this._portalEl.querySelector(".state-row");
+    m && (m.textContent = this._stateText());
+  }
+  _moveContentIntoPortal() {
+    if (this._contentSourceEl)
+      return;
+    const t = this.querySelector('[slot="menu"]') || this.querySelector('[slot="content"]'), e = this._portalContentHostEl;
+    !t || !e || (this._contentOriginalParent = t.parentNode, this._contentAnchor = document.createComment("ui-context-menu-anchor"), this._contentOriginalParent && this._contentOriginalParent.insertBefore(this._contentAnchor, t), this._contentSourceEl = t, e.appendChild(t));
+  }
+  _restoreContentFromPortal() {
+    const t = this._contentSourceEl;
+    if (!t)
+      return;
+    const e = this._contentAnchor, i = this._contentOriginalParent;
+    e != null && e.parentNode ? (e.parentNode.insertBefore(t, e), e.parentNode.removeChild(e)) : i && i.appendChild(t), this._contentSourceEl = null, this._contentAnchor = null, this._contentOriginalParent = null;
+  }
+  _mountPortal() {
+    var i, n;
+    if ((i = this._portalEl) != null && i.isConnected)
+      return;
+    const t = S();
+    if (!t)
+      return;
+    const e = document.createElement("div");
+    e.className = "ui-context-menu-portal", e.style.position = "absolute", e.style.pointerEvents = "auto", e.innerHTML = `
+      <style>${D}</style>
+      <div class="surface" part="menu" role="menu" aria-hidden="true" aria-busy="false" tabindex="-1">
+        <div class="state-row" part="state"></div>
+        <ui-listbox class="content-host" slot="menu" role="menu" item-selector="${p.replace(/"/g, "&quot;")}" direct-item-selector="${b.replace(/"/g, "&quot;")}" item-role="menuitem" active-attribute="data-active"></ui-listbox>
+      </div>
+    `, t.appendChild(e), this._portalEl = e, this._portalSurfaceEl = e.querySelector(".surface"), this._portalContentHostEl = e.querySelector("ui-listbox.content-host"), this._moveContentIntoPortal(), (n = this._portalContentHostEl) == null || n.refresh(), this._syncPortalVisualState(), this._syncSurfaceState(), this._bindPortalInteractionListeners(), this._syncDismissableLayer();
+  }
+  _teardownPortal() {
+    var t, e;
+    if ((t = this._dismissableLayer) == null || t.destroy(), this._dismissableLayer = null, this._unbindPortalInteractionListeners(), this._restoreContentFromPortal(), this._portalContentHostEl = null, this._portalSurfaceEl = null, (e = this._portalEl) != null && e.parentElement)
+      try {
+        this._portalEl.parentElement.removeChild(this._portalEl);
+      } catch {
+      }
+    this._portalEl = null;
+  }
+  _syncDismissableLayer() {
+    var e, i;
+    const t = this._portalSurfaceEl;
+    if (!t || !this._isOpen) {
+      (e = this._dismissableLayer) == null || e.destroy(), this._dismissableLayer = null;
+      return;
+    }
+    (i = this._dismissableLayer) == null || i.destroy(), this._dismissableLayer = w({
+      node: t,
+      trigger: this._anchorEl || this,
+      closeOnEscape: this.closeOnEscape,
+      closeOnPointerOutside: !0,
+      closeOnFocusOutside: !0,
+      onDismiss: (n) => {
+        const o = n === "escape-key" ? "escape" : "outside";
+        this._setOpen(!1, o);
+      }
+    });
+  }
+  _cancelScheduledWork() {
+    this._positionRaf != null && (cancelAnimationFrame(this._positionRaf), this._positionRaf = null), this._submenuRaf != null && (cancelAnimationFrame(this._submenuRaf), this._submenuRaf = null), this._stopAnchorTracking(), this._cancelSubmenuIntent(), this._resetTypeahead();
+  }
+  _captureAnchorRect() {
+    if (!this._anchorEl)
+      return null;
+    const t = this._anchorEl.getBoundingClientRect();
+    return {
+      top: t.top,
+      left: t.left,
+      right: t.right,
+      bottom: t.bottom,
+      width: t.width,
+      height: t.height
+    };
+  }
+  _startAnchorTracking() {
+    !this._isOpen || !this._anchorEl || this._anchorTrackRaf != null || (this._lastAnchorRect = this._captureAnchorRect(), this._anchorTrackRaf = requestAnimationFrame(this._trackAnchorLayout));
+  }
+  _stopAnchorTracking() {
+    this._anchorTrackRaf != null && (cancelAnimationFrame(this._anchorTrackRaf), this._anchorTrackRaf = null), this._lastAnchorRect = null;
+  }
+  _trackAnchorLayout() {
+    if (this._anchorTrackRaf = null, !this._isOpen || !this._anchorEl)
+      return;
+    const t = this._captureAnchorRect(), e = this._lastAnchorRect;
+    if (this._lastAnchorRect = t, !t) {
+      this.close();
+      return;
+    }
+    !!e && (t.top !== e.top || t.left !== e.left || t.right !== e.right || t.bottom !== e.bottom || t.width !== e.width || t.height !== e.height) && (this._positionMenu(), this._layoutSubmenus()), this._anchorTrackRaf = requestAnimationFrame(this._trackAnchorLayout);
+  }
+  _resetTypeahead() {
+    this._typeaheadBuffer = "", this._typeaheadTimer != null && (window.clearTimeout(this._typeaheadTimer), this._typeaheadTimer = null);
+  }
+  _normalizeMenuSemantics() {
+    var e;
+    const t = this._menuHost();
+    t && ((e = this._listbox()) == null || e.syncItemSemantics({ container: t }));
+  }
+  _queryMenuItems(t) {
+    var i;
+    const e = t || this._menuHost();
+    return e ? (((i = this._listbox()) == null ? void 0 : i.queryItems({ container: e })) || []).filter((n) => V(n)) : [];
+  }
+  _submenuFor(t) {
+    return t.querySelector(L);
+  }
+  _clearHighlights() {
+    this._hoveredItem = null;
+  }
+  _focusItem(t) {
+    var i;
+    if (!t)
+      return;
+    this._clearHighlights();
+    const e = t.closest(".submenu") || this._menuHost();
+    (i = this._listbox()) == null || i.setActiveItem(t, {
+      container: e,
+      focus: !0,
+      owner: this._surface(),
+      scroll: !0
+    }), this._setOpenBranch(t, !1);
+  }
+  _focusFirstItem() {
+    var i;
+    const t = (i = this._listbox()) == null ? void 0 : i.focusBoundary("first", {
+      container: this._menuHost(),
+      focus: !0,
+      owner: this._surface(),
+      scroll: !0
+    });
+    if (t) {
+      this._setOpenBranch(t, !1);
+      return;
+    }
+    const e = this._surface();
+    if (e)
+      try {
+        e.focus({ preventScroll: !0 });
+      } catch {
+        e.focus();
+      }
+  }
+  _focusLastItem() {
+    var e;
+    const t = (e = this._listbox()) == null ? void 0 : e.focusBoundary("last", {
+      container: this._menuHost(),
+      focus: !0,
+      owner: this._surface(),
+      scroll: !0
+    });
+    t && this._setOpenBranch(t, !1);
+  }
+  _findCurrentItem(t) {
+    var i;
+    if (t && typeof t.composedPath == "function") {
+      const n = G(t.composedPath());
+      if (n)
+        return n;
+    }
+    const e = document.activeElement;
+    if (e instanceof HTMLElement) {
+      const n = e.closest(p);
+      if (n instanceof HTMLElement)
+        return n;
+    }
+    return (i = this._hoveredItem) != null && i.isConnected ? this._hoveredItem : null;
+  }
+  _moveFocus(t, e) {
+    var o, r, a;
+    const i = t.closest(".submenu") || this._menuHost();
+    if (!i)
+      return;
+    if (e === "first") {
+      const c = (o = this._listbox()) == null ? void 0 : o.focusBoundary("first", {
+        container: i,
+        focus: !0,
+        owner: this._surface(),
+        scroll: !0
+      });
+      c && this._setOpenBranch(c, !1);
+      return;
+    }
+    if (e === "last") {
+      const c = (r = this._listbox()) == null ? void 0 : r.focusBoundary("last", {
+        container: i,
+        focus: !0,
+        owner: this._surface(),
+        scroll: !0
+      });
+      c && this._setOpenBranch(c, !1);
+      return;
+    }
+    const n = (a = this._listbox()) == null ? void 0 : a.move(e === "next" ? 1 : -1, {
+      container: i,
+      current: t,
+      focus: !0,
+      owner: this._surface(),
+      scroll: !0
+    });
+    n && this._setOpenBranch(n, !1);
+  }
+  _setOpenBranch(t, e) {
+    const i = this._menuHost();
+    if (!i || (i.querySelectorAll('[data-submenu-open="true"]').forEach((r) => r.removeAttribute("data-submenu-open")), !t))
+      return;
+    const n = [];
+    let o = t;
+    for (; o; ) {
+      const r = o.closest(".submenu");
+      if (!r)
+        break;
+      const a = r.parentElement;
+      if (!(a instanceof HTMLElement) || !a.matches(p))
+        break;
+      n.unshift(a), o = a;
+    }
+    n.forEach((r) => r.setAttribute("data-submenu-open", "true")), e && this._submenuFor(t) && t.setAttribute("data-submenu-open", "true");
+  }
+  _openSubmenu(t, e) {
+    var o;
+    this._cancelSubmenuIntent();
+    const i = this._submenuFor(t);
+    if (!i || x(t))
+      return !1;
+    if (this._setOpenBranch(t, !0), this._scheduleSubmenuLayout(), !e)
+      return !0;
+    const n = (o = this._listbox()) == null ? void 0 : o.focusBoundary("first", {
+      container: i,
+      focus: !0,
+      owner: this._surface(),
+      scroll: !0
+    });
+    return n && this._setOpenBranch(n, !1), !0;
+  }
+  _closeParentSubmenu(t) {
+    const e = t.closest(".submenu");
+    if (!e)
+      return !1;
+    const i = e.parentElement;
+    return !(i instanceof HTMLElement) || !i.matches(p) ? !1 : (this._focusItem(i), this._setOpenBranch(i, !1), i.removeAttribute("data-submenu-open"), !0);
+  }
+  _clearSubmenuState() {
+    var e;
+    this._cancelSubmenuIntent(), this._hoveredItem = null;
+    const t = this._menuHost();
+    t && (t.querySelectorAll('[data-submenu-open="true"]').forEach((i) => i.removeAttribute("data-submenu-open")), (e = this._listbox()) == null || e.clearActive({ container: t }));
+  }
+  _handleTypeahead(t, e) {
+    var o;
+    if (!this.typeahead || t.ctrlKey || t.altKey || t.metaKey || t.key.length !== 1 || !/\S/.test(t.key))
+      return !1;
+    const i = (e == null ? void 0 : e.closest(".submenu")) || this._menuHost();
+    if (!i)
+      return !1;
+    this._typeaheadBuffer = `${this._typeaheadBuffer}${t.key}`.slice(-24), this._typeaheadTimer != null && window.clearTimeout(this._typeaheadTimer), this._typeaheadTimer = window.setTimeout(() => this._resetTypeahead(), C);
+    const n = (o = this._listbox()) == null ? void 0 : o.typeahead(this._typeaheadBuffer, {
+      container: i,
+      current: e,
+      focus: !0,
+      owner: this._surface(),
+      scroll: !0
+    });
+    return n ? (t.preventDefault(), this._setOpenBranch(n, !1), !0) : !1;
+  }
+  _applySelectionBehavior(t) {
+    const e = t.getAttribute("role");
+    if (e === "menuitemcheckbox") {
+      const o = t.getAttribute("aria-checked") !== "true";
+      t.setAttribute("aria-checked", o ? "true" : "false"), t.setAttribute("data-state", o ? "checked" : "unchecked");
+      return;
+    }
+    if (e !== "menuitemradio")
+      return;
+    const i = t.closest(".submenu") || this._menuHost();
+    if (!i)
+      return;
+    const n = t.getAttribute("data-group") || t.getAttribute("name") || "";
+    i.querySelectorAll('[role="menuitemradio"]').forEach((o) => {
+      const r = o.getAttribute("data-group") || o.getAttribute("name") || "";
+      n && r !== n || (o.setAttribute("aria-checked", "false"), o.setAttribute("data-state", "unchecked"));
+    }), t.setAttribute("aria-checked", "true"), t.setAttribute("data-state", "checked");
+  }
+  _emitSelect(t) {
+    var o;
+    const e = this._menuHost(), n = (e ? Array.from(e.querySelectorAll(p)) : []).indexOf(t);
+    this.dispatchEvent(new CustomEvent("select", {
+      bubbles: !0,
+      composed: !0,
+      detail: {
+        index: n,
+        value: t.getAttribute("data-value") || t.getAttribute("value") || void 0,
+        label: t.getAttribute("aria-label") || ((o = t.textContent) == null ? void 0 : o.trim()) || void 0,
+        checked: t.getAttribute("aria-checked") === "true",
+        item: t
+      }
+    }));
+  }
+  _schedulePosition() {
+    this._isOpen && (this._positionRaf != null && cancelAnimationFrame(this._positionRaf), this._positionRaf = requestAnimationFrame(() => {
+      this._positionRaf = null, this._positionMenu();
+    }));
+  }
+  _positionMenu() {
+    const t = this._surface();
+    if (!t)
+      return;
+    if (this._anchorEl && !N(this._anchorEl)) {
+      this.close();
+      return;
+    }
+    const e = this._anchorEl ? this._anchorEl.getBoundingClientRect() : W(this._point), i = t.getBoundingClientRect(), n = i.width || t.offsetWidth || 240, o = i.height || t.offsetHeight || 0, r = $(this.getAttribute("placement")), a = U(e, n, o, r, this._anchorEl ? O : 0);
+    t.style.left = `${a.x}px`, t.style.top = `${a.y}px`, t.style.maxWidth = `${a.maxWidth}px`, t.style.maxHeight = `${a.maxHeight}px`, t.setAttribute("data-placement", a.placement);
+  }
+  _scheduleSubmenuLayout() {
+    this._isOpen && (this._submenuRaf != null && cancelAnimationFrame(this._submenuRaf), this._submenuRaf = requestAnimationFrame(() => {
+      this._submenuRaf = null, this._layoutSubmenus();
+    }));
+  }
+  _layoutSubmenus() {
+    const t = this._menuHost();
+    if (!t)
+      return;
+    const e = window.innerWidth || document.documentElement.clientWidth || 0, i = window.innerHeight || document.documentElement.clientHeight || 0;
+    Array.from(t.querySelectorAll('.menuitem > .submenu, [role="menuitem"] > .submenu')).forEach((o) => {
+      const r = o.parentElement;
+      if (!(r instanceof HTMLElement))
+        return;
+      r.removeAttribute("data-submenu-side"), r.removeAttribute("data-submenu-align");
+      const a = o.style.display, c = o.style.visibility, l = o.style.pointerEvents, h = o.style.opacity, m = o.style.transform;
+      o.style.display = "grid", o.style.visibility = "hidden", o.style.pointerEvents = "none", o.style.opacity = "0", o.style.transform = "none";
+      const d = r.getBoundingClientRect(), f = o.getBoundingClientRect();
+      d.right + u + f.width > e && d.left - u - f.width >= u && r.setAttribute("data-submenu-side", "left"), d.top + f.height > i - u && d.bottom - f.height >= u && r.setAttribute("data-submenu-align", "up"), o.style.display = a, o.style.visibility = c, o.style.pointerEvents = l, o.style.opacity = h, o.style.transform = m;
+    });
+  }
+  _onRootClick(t) {
+    if (!this._isOpen || this.isDisabled || this.state === "loading")
+      return;
+    const e = this._findCurrentItem(t);
+    if (!(!e || x(e))) {
+      if (this._submenuFor(e)) {
+        this._openSubmenu(e, !0);
+        return;
+      }
+      this._applySelectionBehavior(e), this._emitSelect(e), this.closeOnSelect ? this._setOpen(!1, "select") : this._focusItem(e);
+    }
+  }
+  _onRootPointerOver(t) {
+    if (!this._isOpen)
+      return;
+    const e = this._findCurrentItem(t);
+    if (!(!e || x(e))) {
+      if (this._hoveredItem = e, this._submenuFor(e)) {
+        this._scheduleSubmenuIntent(e);
+        return;
+      }
+      this._cancelSubmenuIntent(), this._setOpenBranch(e, !1);
+    }
+  }
+  _onRootPointerLeave() {
+    this._cancelSubmenuIntent(), this._clearHighlights();
+  }
+  _onRootFocusIn(t) {
+    var n;
+    if (!this._isOpen)
+      return;
+    this._cancelSubmenuIntent();
+    const e = this._findCurrentItem(t);
+    if (!e || x(e))
+      return;
+    const i = e.closest(".submenu") || this._menuHost();
+    (n = this._listbox()) == null || n.setActiveItem(e, {
+      container: i,
+      focus: !1,
+      owner: this._surface(),
+      scroll: !1
+    }), this._setOpenBranch(e, !1);
+  }
+  _cancelSubmenuIntent() {
+    this._submenuIntentTimer != null && (window.clearTimeout(this._submenuIntentTimer), this._submenuIntentTimer = null), this._submenuIntentItem = null;
+  }
+  _scheduleSubmenuIntent(t) {
+    this._submenuIntentItem === t && this._submenuIntentTimer != null || (this._cancelSubmenuIntent(), this._submenuIntentItem = t, this._submenuIntentTimer = window.setTimeout(() => {
+      this._submenuIntentTimer = null;
+      const e = this._submenuIntentItem;
+      this._submenuIntentItem = null, !(!e || !e.isConnected || !this._isOpen) && (this._setOpenBranch(e, !0), this._scheduleSubmenuLayout());
+    }, I));
+  }
+  _onRootKeyDown(t) {
+    if (!this._isOpen)
+      return;
+    const e = this._findCurrentItem(t);
+    if (!this._handleTypeahead(t, e)) {
+      if (t.key === "Escape") {
+        if (!this.closeOnEscape)
+          return;
+        t.preventDefault(), this._setOpen(!1, "escape");
+        return;
+      }
+      if (!(this.isDisabled || this.state === "loading")) {
+        if (!e) {
+          t.key === "ArrowDown" ? (t.preventDefault(), this._focusFirstItem()) : t.key === "ArrowUp" && (t.preventDefault(), this._focusLastItem());
+          return;
+        }
+        if (t.key === "ArrowDown") {
+          t.preventDefault(), this._moveFocus(e, "next");
+          return;
+        }
+        if (t.key === "ArrowUp") {
+          t.preventDefault(), this._moveFocus(e, "prev");
+          return;
+        }
+        if (t.key === "Home") {
+          t.preventDefault(), this._moveFocus(e, "first");
+          return;
+        }
+        if (t.key === "End") {
+          t.preventDefault(), this._moveFocus(e, "last");
+          return;
+        }
+        if (t.key === "ArrowRight") {
+          t.preventDefault(), this._openSubmenu(e, !0);
+          return;
+        }
+        if (t.key === "ArrowLeft") {
+          this._closeParentSubmenu(e) && t.preventDefault();
+          return;
+        }
+        (t.key === "Enter" || t.key === " ") && (t.preventDefault(), e.click());
+      }
+    }
+  }
+  _onContextMenu(t) {
+    this.headless || this.isDisabled || t.defaultPrevented || t.target instanceof HTMLElement && t.target.closest('[slot="menu"], [slot="content"]') || (t.preventDefault(), this._anchorEl = null, this._point = { x: t.clientX, y: t.clientY }, this._setOpen(!0, "contextmenu"));
+  }
+  _onViewportChange() {
+    this._isOpen && (this._schedulePosition(), this._scheduleSubmenuLayout());
+  }
+  render() {
+    const t = M(this._stateText());
+    this.setContent(`
+      <style>${v}</style>
+      <div class="surface" part="menu" role="menu" aria-hidden="true" aria-busy="false" tabindex="-1">
+        <div class="state-row" part="state" data-state="${this.state}">${t}</div>
+        <ui-listbox class="content-host" part="content" slot="menu" role="menu" item-selector="${p.replace(/"/g, "&quot;")}" direct-item-selector="${b.replace(/"/g, "&quot;")}" item-role="menuitem" active-attribute="data-active">
+          <slot name="menu"></slot>
+          <slot name="content"></slot>
+        </ui-listbox>
+      </div>
+      <slot></slot>
+    `), this._syncSurfaceState(), this._isOpen && (this._normalizeMenuSemantics(), this._syncPortalVisualState(), this._schedulePosition(), this._scheduleSubmenuLayout());
+  }
+  shouldRenderOnAttributeChange() {
+    return !1;
+  }
+}
+typeof customElements < "u" && !customElements.get("ui-context-menu") && customElements.define("ui-context-menu", Y);
+export {
+  Y as UIContextMenu
+};