@editora/ui-core 0.1.9 → 0.1.12

package/dist/plugin-panel.cjs.js

@@ -0,0 +1,131 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("./ElementBase-1b301e7f.js"),l=`
+  :host {
+    position: fixed;
+    display: block;
+    z-index: var(--ui-plugin-panel-z, 1300);
+    pointer-events: none;
+    color-scheme: light dark;
+    --ui-plugin-panel-width: min(340px, 92vw);
+    --ui-plugin-panel-height: min(280px, 44vh);
+    --ui-plugin-panel-bg: var(--base-panel-bg, var(--color-panel, color-mix(in srgb, var(--ui-color-surface, #ffffff) 94%, transparent)));
+    --ui-plugin-panel-border: var(--base-panel-border, 1px solid color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent));
+    --ui-plugin-panel-radius: var(--base-panel-radius, var(--ui-radius, 4px));
+    --ui-plugin-panel-shadow: var(--base-panel-shadow, var(--shadow-4, none));
+    --ui-plugin-panel-color: var(--ui-color-text, #0f172a);
+  }
+
+  .panel {
+    pointer-events: auto;
+    position: fixed;
+    box-sizing: border-box;
+    background: var(--ui-plugin-panel-bg);
+    border: var(--ui-plugin-panel-border);
+    border-radius: var(--ui-plugin-panel-radius);
+    box-shadow: var(--ui-plugin-panel-shadow);
+    color: var(--ui-plugin-panel-color);
+    backdrop-filter: var(--base-panel-backdrop, var(--backdrop-filter-panel, saturate(1.1) blur(10px)));
+    font: 500 var(--ui-default-font-size, var(--font-size-2, var(--ui-font-size-md, 14px)))/var(--ui-default-line-height, var(--line-height-2, 20px)) var(--ui-font-family, system-ui, sans-serif);
+    letter-spacing: var(--ui-default-letter-spacing, var(--letter-spacing-2, 0em));
+    opacity: 0;
+    transform: translate3d(0, 6px, 0) scale(0.985);
+    transition: opacity 180ms ease, transform 180ms ease;
+    display: grid;
+  }
+
+  .panel[data-size="sm"] {
+    --ui-plugin-panel-width: min(280px, 90vw);
+    --ui-plugin-panel-height: min(220px, 38vh);
+  }
+
+  .panel[data-size="lg"] {
+    --ui-plugin-panel-width: min(420px, 94vw);
+    --ui-plugin-panel-height: min(420px, 54vh);
+  }
+
+  :host([open]) .panel {
+    opacity: 1;
+    transform: translate3d(0, 0, 0) scale(1);
+  }
+
+  :host([position="right"]) .panel,
+  :host(:not([position])) .panel {
+    top: 16px;
+    right: 16px;
+    width: var(--ui-plugin-panel-width);
+    max-height: calc(100vh - 32px);
+  }
+
+  :host([position="left"]) .panel {
+    top: 16px;
+    left: 16px;
+    width: var(--ui-plugin-panel-width);
+    max-height: calc(100vh - 32px);
+  }
+
+  :host([position="bottom"]) .panel {
+    left: 50%;
+    bottom: 16px;
+    transform: translate3d(-50%, 8px, 0) scale(0.985);
+    width: min(760px, calc(100vw - 32px));
+    max-height: var(--ui-plugin-panel-height);
+  }
+
+  :host([open][position="bottom"]) .panel {
+    transform: translate3d(-50%, 0, 0) scale(1);
+  }
+
+  :host(:not([open])) .panel {
+    pointer-events: none;
+    opacity: 0;
+  }
+
+  :host([headless]) .panel {
+    display: none !important;
+  }
+
+  @media (prefers-contrast: more) {
+    .panel {
+      border-width: 2px;
+      box-shadow: none;
+      backdrop-filter: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-plugin-panel-bg: Canvas;
+      --ui-plugin-panel-border: 1px solid CanvasText;
+      --ui-plugin-panel-shadow: none;
+      --ui-plugin-panel-color: CanvasText;
+    }
+
+    .panel {
+      forced-color-adjust: none;
+      background: Canvas;
+      color: CanvasText;
+      border-color: CanvasText;
+      box-shadow: none;
+      backdrop-filter: none;
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .panel {
+      transition: none !important;
+    }
+  }
+`;class o extends s.ElementBase{constructor(){super(...arguments),this._onDocumentKeyDown=e=>{e.key!=="Escape"||!this.hasAttribute("open")||!this.hasAttribute("dismissible")||(e.preventDefault(),this.closePanel())}}static get observedAttributes(){return["open","position","headless","title","description","dismissible","size"]}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this._onDocumentKeyDown)}disconnectedCallback(){document.removeEventListener("keydown",this._onDocumentKeyDown),super.disconnectedCallback()}openPanel(){this.setAttribute("open","")}closePanel(){this.removeAttribute("open")}togglePanel(){this.hasAttribute("open")?this.closePanel():this.openPanel()}attributeChangedCallback(e,t,n){if(t!==n&&(this.isConnected&&this.requestRender(),e==="open"&&t!==n)){const i=n!=null;this.dispatchEvent(new CustomEvent(i?"open":"close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:i},bubbles:!0,composed:!0}))}}render(){const e=this.getAttribute("title"),t=this.getAttribute("description"),n=this.hasAttribute("dismissible"),i=this.getAttribute("size")||"md";this.setContent(`
+      <style>${l}</style>
+      <aside class="panel" part="panel" role="complementary" aria-label="${e||"Plugin panel"}" data-size="${i}">
+        ${e||t||n?`
+          <header class="header" part="header" style="display:flex;align-items:flex-start;gap:10px;padding:12px 14px 0;">
+            <div style="min-width:0;display:grid;gap:4px;flex:1 1 auto;">
+              ${e?`<strong part="title" style="font-size:14px;line-height:1.3;">${e}</strong>`:""}
+              ${t?`<p part="description" style="margin:0;font-size:12px;line-height:1.4;color:var(--ui-color-muted, #64748b);">${t}</p>`:""}
+            </div>
+            ${n?'<button type="button" class="dismiss" part="dismiss-button" aria-label="Close panel" style="border:none;background:transparent;color:inherit;cursor:pointer;font:inherit;padding:4px 6px;">Close</button>':""}
+          </header>
+        `:""}
+        <slot></slot>
+      </aside>
+    `);const a=this.root.querySelector(".dismiss");a==null||a.addEventListener("click",()=>this.closePanel(),{once:!0})}}typeof customElements<"u"&&!customElements.get("ui-plugin-panel")&&customElements.define("ui-plugin-panel",o);exports.UIPluginPanel=o;

package/dist/plugin-panel.esm.js

@@ -0,0 +1,173 @@
+import { E as o } from "./ElementBase-909688f3.mjs";
+const s = `
+  :host {
+    position: fixed;
+    display: block;
+    z-index: var(--ui-plugin-panel-z, 1300);
+    pointer-events: none;
+    color-scheme: light dark;
+    --ui-plugin-panel-width: min(340px, 92vw);
+    --ui-plugin-panel-height: min(280px, 44vh);
+    --ui-plugin-panel-bg: var(--base-panel-bg, var(--color-panel, color-mix(in srgb, var(--ui-color-surface, #ffffff) 94%, transparent)));
+    --ui-plugin-panel-border: var(--base-panel-border, 1px solid color-mix(in srgb, var(--ui-color-border, #cbd5e1) 72%, transparent));
+    --ui-plugin-panel-radius: var(--base-panel-radius, var(--ui-radius, 4px));
+    --ui-plugin-panel-shadow: var(--base-panel-shadow, var(--shadow-4, none));
+    --ui-plugin-panel-color: var(--ui-color-text, #0f172a);
+  }
+
+  .panel {
+    pointer-events: auto;
+    position: fixed;
+    box-sizing: border-box;
+    background: var(--ui-plugin-panel-bg);
+    border: var(--ui-plugin-panel-border);
+    border-radius: var(--ui-plugin-panel-radius);
+    box-shadow: var(--ui-plugin-panel-shadow);
+    color: var(--ui-plugin-panel-color);
+    backdrop-filter: var(--base-panel-backdrop, var(--backdrop-filter-panel, saturate(1.1) blur(10px)));
+    font: 500 var(--ui-default-font-size, var(--font-size-2, var(--ui-font-size-md, 14px)))/var(--ui-default-line-height, var(--line-height-2, 20px)) var(--ui-font-family, system-ui, sans-serif);
+    letter-spacing: var(--ui-default-letter-spacing, var(--letter-spacing-2, 0em));
+    opacity: 0;
+    transform: translate3d(0, 6px, 0) scale(0.985);
+    transition: opacity 180ms ease, transform 180ms ease;
+    display: grid;
+  }
+
+  .panel[data-size="sm"] {
+    --ui-plugin-panel-width: min(280px, 90vw);
+    --ui-plugin-panel-height: min(220px, 38vh);
+  }
+
+  .panel[data-size="lg"] {
+    --ui-plugin-panel-width: min(420px, 94vw);
+    --ui-plugin-panel-height: min(420px, 54vh);
+  }
+
+  :host([open]) .panel {
+    opacity: 1;
+    transform: translate3d(0, 0, 0) scale(1);
+  }
+
+  :host([position="right"]) .panel,
+  :host(:not([position])) .panel {
+    top: 16px;
+    right: 16px;
+    width: var(--ui-plugin-panel-width);
+    max-height: calc(100vh - 32px);
+  }
+
+  :host([position="left"]) .panel {
+    top: 16px;
+    left: 16px;
+    width: var(--ui-plugin-panel-width);
+    max-height: calc(100vh - 32px);
+  }
+
+  :host([position="bottom"]) .panel {
+    left: 50%;
+    bottom: 16px;
+    transform: translate3d(-50%, 8px, 0) scale(0.985);
+    width: min(760px, calc(100vw - 32px));
+    max-height: var(--ui-plugin-panel-height);
+  }
+
+  :host([open][position="bottom"]) .panel {
+    transform: translate3d(-50%, 0, 0) scale(1);
+  }
+
+  :host(:not([open])) .panel {
+    pointer-events: none;
+    opacity: 0;
+  }
+
+  :host([headless]) .panel {
+    display: none !important;
+  }
+
+  @media (prefers-contrast: more) {
+    .panel {
+      border-width: 2px;
+      box-shadow: none;
+      backdrop-filter: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    :host {
+      --ui-plugin-panel-bg: Canvas;
+      --ui-plugin-panel-border: 1px solid CanvasText;
+      --ui-plugin-panel-shadow: none;
+      --ui-plugin-panel-color: CanvasText;
+    }
+
+    .panel {
+      forced-color-adjust: none;
+      background: Canvas;
+      color: CanvasText;
+      border-color: CanvasText;
+      box-shadow: none;
+      backdrop-filter: none;
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .panel {
+      transition: none !important;
+    }
+  }
+`;
+class r extends o {
+  constructor() {
+    super(...arguments), this._onDocumentKeyDown = (e) => {
+      e.key !== "Escape" || !this.hasAttribute("open") || !this.hasAttribute("dismissible") || (e.preventDefault(), this.closePanel());
+    };
+  }
+  static get observedAttributes() {
+    return ["open", "position", "headless", "title", "description", "dismissible", "size"];
+  }
+  connectedCallback() {
+    super.connectedCallback(), document.addEventListener("keydown", this._onDocumentKeyDown);
+  }
+  disconnectedCallback() {
+    document.removeEventListener("keydown", this._onDocumentKeyDown), super.disconnectedCallback();
+  }
+  openPanel() {
+    this.setAttribute("open", "");
+  }
+  closePanel() {
+    this.removeAttribute("open");
+  }
+  togglePanel() {
+    this.hasAttribute("open") ? this.closePanel() : this.openPanel();
+  }
+  attributeChangedCallback(e, t, n) {
+    if (t !== n && (this.isConnected && this.requestRender(), e === "open" && t !== n)) {
+      const i = n != null;
+      this.dispatchEvent(new CustomEvent(i ? "open" : "close", { bubbles: !0, composed: !0 })), this.dispatchEvent(new CustomEvent("open-change", { detail: { open: i }, bubbles: !0, composed: !0 }));
+    }
+  }
+  render() {
+    const e = this.getAttribute("title"), t = this.getAttribute("description"), n = this.hasAttribute("dismissible"), i = this.getAttribute("size") || "md";
+    this.setContent(`
+      <style>${s}</style>
+      <aside class="panel" part="panel" role="complementary" aria-label="${e || "Plugin panel"}" data-size="${i}">
+        ${e || t || n ? `
+          <header class="header" part="header" style="display:flex;align-items:flex-start;gap:10px;padding:12px 14px 0;">
+            <div style="min-width:0;display:grid;gap:4px;flex:1 1 auto;">
+              ${e ? `<strong part="title" style="font-size:14px;line-height:1.3;">${e}</strong>` : ""}
+              ${t ? `<p part="description" style="margin:0;font-size:12px;line-height:1.4;color:var(--ui-color-muted, #64748b);">${t}</p>` : ""}
+            </div>
+            ${n ? '<button type="button" class="dismiss" part="dismiss-button" aria-label="Close panel" style="border:none;background:transparent;color:inherit;cursor:pointer;font:inherit;padding:4px 6px;">Close</button>' : ""}
+          </header>
+        ` : ""}
+        <slot></slot>
+      </aside>
+    `);
+    const a = this.root.querySelector(".dismiss");
+    a == null || a.addEventListener("click", () => this.closePanel(), { once: !0 });
+  }
+}
+typeof customElements < "u" && !customElements.get("ui-plugin-panel") && customElements.define("ui-plugin-panel", r);
+export {
+  r as UIPluginPanel
+};

package/dist/popover.cjs.js

@@ -0,0 +1,286 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("./ElementBase-1b301e7f.js"),f=require("./portal-d8d7fbca.js"),b=require("./dismissable-layer-193e3bed.js"),g=require("./positioner-accc6e5f.js"),m=`
+  .popover-shell {
+    --ui-popover-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
+    --ui-popover-bg:
+      linear-gradient(
+        180deg,
+        color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, transparent) 0%,
+        color-mix(in srgb, var(--ui-color-surface-elevated, #f8fafc) 24%, var(--ui-color-surface, #ffffff)) 100%
+      );
+    --ui-popover-text: var(--ui-color-text, #0f172a);
+    --ui-popover-muted: var(--ui-color-muted, #64748b);
+    --ui-popover-border-color: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 70%, transparent);
+    --ui-popover-border: 1px solid var(--ui-popover-border-color);
+    --ui-popover-shadow:
+      0 14px 34px rgba(15, 23, 42, 0.12),
+      0 28px 64px rgba(15, 23, 42, 0.08);
+    --ui-popover-radius: 14px;
+    --ui-popover-padding: 14px;
+    --ui-popover-backdrop: none;
+    --ui-popover-font-size: var(--ui-default-font-size, var(--font-size-2, var(--ui-font-size-md, 14px)));
+    --ui-popover-line-height: var(--ui-default-line-height, var(--line-height-2, 20px));
+    --ui-popover-letter-spacing: var(--ui-default-letter-spacing, var(--letter-spacing-2, 0em));
+  }
+
+  .popover-shell[data-size="sm"],
+  .popover-shell[data-size="1"] {
+    --ui-popover-radius: 12px;
+    --ui-popover-padding: 10px;
+    --ui-popover-font-size: 13px;
+    --ui-popover-line-height: 18px;
+  }
+
+  .popover-shell[data-size="md"],
+  .popover-shell[data-size="2"] {
+    --ui-popover-radius: 14px;
+    --ui-popover-padding: 14px;
+  }
+
+  .popover-shell[data-size="lg"],
+  .popover-shell[data-size="3"] {
+    --ui-popover-radius: 18px;
+    --ui-popover-padding: 18px;
+    --ui-popover-font-size: 15px;
+    --ui-popover-line-height: 22px;
+  }
+
+  .popover-shell[data-tone="neutral"] {
+    --ui-popover-accent: var(--ui-color-muted, #64748b);
+  }
+
+  .popover-shell[data-tone="brand"],
+  .popover-shell[data-tone="info"] {
+    --ui-popover-accent: var(--ui-color-primary, var(--ui-primary, #2563eb));
+  }
+
+  .popover-shell[data-tone="success"] {
+    --ui-popover-accent: var(--ui-color-success, #16a34a);
+  }
+
+  .popover-shell[data-tone="warning"] {
+    --ui-popover-accent: var(--ui-color-warning, #d97706);
+  }
+
+  .popover-shell[data-tone="danger"] {
+    --ui-popover-accent: var(--ui-color-danger, #dc2626);
+  }
+
+  .popover-shell[data-variant="soft"] {
+    --ui-popover-bg: color-mix(in srgb, var(--ui-popover-accent) 8%, var(--ui-color-surface, #ffffff));
+    --ui-popover-border-color: color-mix(in srgb, var(--ui-popover-accent) 24%, var(--ui-color-border, #cbd5e1));
+    --ui-popover-shadow:
+      0 10px 24px color-mix(in srgb, var(--ui-popover-accent) 12%, rgba(15, 23, 42, 0.08)),
+      0 24px 48px rgba(15, 23, 42, 0.06);
+  }
+
+  .popover-shell[data-variant="solid"] {
+    --ui-popover-bg: linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--ui-popover-accent) 16%, var(--ui-color-surface, #ffffff)) 0%,
+      color-mix(in srgb, var(--ui-popover-accent) 12%, var(--ui-color-surface-elevated, #f8fafc)) 100%
+    );
+    --ui-popover-border-color: color-mix(in srgb, var(--ui-popover-accent) 30%, var(--ui-color-border, #cbd5e1));
+    --ui-popover-shadow:
+      0 14px 32px color-mix(in srgb, var(--ui-popover-accent) 14%, rgba(15, 23, 42, 0.08)),
+      0 28px 60px rgba(15, 23, 42, 0.08);
+  }
+
+  .popover-shell[data-variant="glass"] {
+    --ui-popover-bg:
+      linear-gradient(
+        180deg,
+        color-mix(in srgb, var(--ui-color-surface, #ffffff) 88%, #ffffff 12%),
+        color-mix(in srgb, var(--ui-color-surface, #ffffff) 72%, transparent)
+      );
+    --ui-popover-border-color: color-mix(in srgb, var(--ui-popover-accent) 12%, rgba(255, 255, 255, 0.38));
+    --ui-popover-backdrop: var(--base-panel-backdrop, var(--backdrop-filter-panel, blur(18px) saturate(1.08)));
+    --ui-popover-shadow:
+      0 18px 38px rgba(15, 23, 42, 0.14),
+      0 34px 72px rgba(15, 23, 42, 0.1);
+  }
+
+  .popover-shell[data-variant="contrast"] {
+    --ui-popover-bg:
+      linear-gradient(
+        180deg,
+        color-mix(in srgb, var(--ui-popover-accent) 22%, #0f172a 78%) 0%,
+        color-mix(in srgb, var(--ui-popover-accent) 12%, #020617 88%) 100%
+      );
+    --ui-popover-text: #e2e8f0;
+    --ui-popover-muted: color-mix(in srgb, #e2e8f0 72%, transparent);
+    --ui-popover-border-color: color-mix(in srgb, var(--ui-popover-accent) 26%, rgba(248, 250, 252, 0.28));
+    --ui-popover-shadow:
+      0 20px 42px rgba(2, 6, 23, 0.42),
+      0 36px 80px rgba(2, 6, 23, 0.34);
+  }
+
+  .popover-shell[data-variant="minimal"] {
+    --ui-popover-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 94%, transparent);
+    --ui-popover-border-color: color-mix(in srgb, var(--ui-popover-accent) 10%, transparent);
+    --ui-popover-shadow: none;
+  }
+
+  .popover-shell[data-elevation="none"] {
+    --ui-popover-shadow: none;
+  }
+
+  .popover-shell[data-elevation="low"] {
+    --ui-popover-shadow:
+      0 8px 18px rgba(15, 23, 42, 0.08),
+      0 18px 40px rgba(15, 23, 42, 0.06);
+  }
+
+  .popover-shell[data-elevation="high"] {
+    --ui-popover-shadow:
+      0 18px 38px rgba(15, 23, 42, 0.16),
+      0 32px 72px rgba(15, 23, 42, 0.12);
+  }
+
+  .panel {
+    color-scheme: light dark;
+    --ui-popover-focus: var(--ui-color-focus-ring, #2563eb);
+    background: var(--ui-popover-bg);
+    color: var(--ui-popover-text);
+    border: var(--ui-popover-border);
+    border-radius: var(--ui-popover-radius);
+    padding: var(--ui-popover-padding);
+    box-shadow: var(--ui-popover-shadow);
+    backdrop-filter: var(--ui-popover-backdrop);
+    font: 500 var(--ui-popover-font-size)/var(--ui-popover-line-height) var(--ui-font-family, system-ui, sans-serif);
+    letter-spacing: var(--ui-popover-letter-spacing);
+    opacity: 0;
+    transform: translateY(6px) scale(0.99);
+    transition: opacity var(--ui-motion-base, 200ms) var(--ui-motion-easing, ease), transform var(--ui-motion-base, 200ms) var(--ui-motion-easing, ease);
+    position: relative;
+    min-inline-size: min(180px, calc(100vw - 24px));
+    max-inline-size: min(360px, calc(100vw - 24px));
+  }
+  .panel.show { opacity: 1; transform: translateY(0) scale(1); }
+
+  .content {
+    display: grid;
+    gap: 10px;
+    min-inline-size: 0;
+  }
+
+  .content > :first-child {
+    margin-top: 0;
+  }
+
+  .content > :last-child {
+    margin-bottom: 0;
+  }
+
+  /* arrow (positioned from portal.ts when present) */
+  .arrow {
+    position: absolute;
+    width: 14px;
+    height: 8px;
+    background: transparent;
+    transform-origin: center;
+    left: 50%;
+    top: -8px;
+    margin-left: -7px;
+    transition:
+      left var(--ui-motion-base, 200ms) var(--ui-motion-easing, ease),
+      top var(--ui-motion-base, 200ms) var(--ui-motion-easing, ease),
+      opacity 120ms ease,
+      transform var(--ui-motion-base, 200ms) var(--ui-motion-easing, ease);
+    will-change: left, top;
+  }
+
+  .arrow::before,
+  .arrow::after {
+    content: "";
+    position: absolute;
+    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
+  }
+
+  .arrow::before {
+    inset: 0;
+    background: var(--ui-popover-border-color);
+  }
+
+  .arrow::after {
+    top: 1px;
+    left: 1px;
+    right: 1px;
+    bottom: 0;
+    background: var(--ui-popover-bg);
+  }
+
+  [data-placement^="bottom"] .arrow {
+    top: -8px;
+    bottom: auto;
+    left: 50%;
+    right: auto;
+    margin-left: -7px;
+    margin-top: 0;
+    transform: rotate(0deg);
+  }
+
+  [data-placement^="top"] .arrow {
+    top: auto;
+    bottom: -8px;
+    left: 50%;
+    right: auto;
+    margin-left: -7px;
+    margin-top: 0;
+    transform: rotate(180deg);
+  }
+
+  [data-placement^="left"] .arrow {
+    top: 50%;
+    bottom: auto;
+    left: auto;
+    right: -11px;
+    margin-left: 0;
+    margin-top: -4px;
+    transform: rotate(90deg);
+  }
+
+  [data-placement^="right"] .arrow {
+    top: 50%;
+    bottom: auto;
+    left: -11px;
+    right: auto;
+    margin-left: 0;
+    margin-top: -4px;
+    transform: rotate(-90deg);
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .panel { transition: none !important; transform: none !important; }
+  }
+
+  @media (prefers-contrast: more) {
+    .panel {
+      border-width: 2px;
+      box-shadow: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    .popover-shell {
+      --ui-popover-bg: Canvas;
+      --ui-popover-text: CanvasText;
+      --ui-popover-border-color: CanvasText;
+      --ui-popover-border: 1px solid CanvasText;
+      --ui-popover-focus: Highlight;
+      --ui-popover-shadow: none;
+    }
+
+    .panel {
+      backdrop-filter: none;
+    }
+
+    .panel,
+    .arrow {
+      forced-color-adjust: none;
+      background: Canvas;
+      color: CanvasText;
+      border-color: CanvasText;
+      box-shadow: none;
+    }
+  }
+`;class d extends h.ElementBase{constructor(){super(),this._portalEl=null,this._panelEl=null,this._positioner=null,this._layer=null,this._isOpen=!1,this._restoreFocusEl=null,this._contentObserver=null,this._hostObserver=null,this._syncPortalScheduled=!1,this._onHostClick=this._handleHostClick.bind(this)}static get observedAttributes(){return["open","placement","offset","flip","shift","close-on-escape","close-on-outside","variant","tone","size","radius","elevation"]}attributeChangedCallback(e,t,r){var o;if(t!==r){if(e==="open"){this._syncOpenState();return}this._isOpen&&((o=this._portalEl)!=null&&o.isConnected)&&(e==="placement"||e==="offset"||e==="flip"||e==="shift"||e==="variant"||e==="tone"||e==="size"||e==="radius"||e==="elevation"?this._mountPortal():(e==="close-on-escape"||e==="close-on-outside")&&this._syncDismissableLayer())}}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onHostClick),this._observeHost(),this._syncOpenState()}disconnectedCallback(){var e;this.removeEventListener("click",this._onHostClick),(e=this._hostObserver)==null||e.disconnect(),this._hostObserver=null,this._teardownPortal(),super.disconnectedCallback()}_handleHostClick(e){const t=this._getTrigger();if(!t)return;const r=typeof e.composedPath=="function"?e.composedPath():[],o=e.target instanceof Node?e.target:null;(r.includes(t)||!!o&&(t===o||t.contains(o)))&&this.toggle()}open(){this.setAttribute("open","")}close(){this.removeAttribute("open")}toggle(){this.hasAttribute("open")?this.close():this.open()}updatePosition(){var e;(e=this._positioner)==null||e.update()}_getTrigger(){return this.querySelector('[slot="trigger"]')}_buildPortalContent(){const e=document.createElement("div");e.className="popover-shell",e.style.pointerEvents="auto";const t=this.getAttribute("variant");t&&(e.dataset.variant=t);const r=this.getAttribute("tone");r&&(e.dataset.tone=r);const o=this.getAttribute("size");o&&(e.dataset.size=o);const i=this.getAttribute("elevation");i&&(e.dataset.elevation=i);const s=this.getAttribute("radius");if(s&&s.trim()){const p=s.trim(),v=/^-?\d+(\.\d+)?$/.test(p)?`${p}px`:p;e.style.setProperty("--ui-popover-radius",v)}const l=document.createElement("style");l.textContent=m,e.appendChild(l);const a=document.createElement("div");a.className="panel show",this._panelEl=a;const c=document.createElement("div");c.className="arrow",a.appendChild(c);const u=this.querySelector('[slot="content"]'),n=document.createElement("div");return n.className="content",u&&n.appendChild(u.cloneNode(!0)),a.appendChild(n),e.appendChild(a),e}_getContentSource(){return this.querySelector('[slot="content"]')}_placement(){const e=this.getAttribute("placement");return e||"bottom"}_offset(){const e=Number(this.getAttribute("offset"));return Number.isFinite(e)?e:8}_closeOnEscape(){return this.getAttribute("close-on-escape")!=="false"}_closeOnOutside(){return this.getAttribute("close-on-outside")!=="false"}_syncDismissableLayer(){var t;const e=this._getTrigger();!e||!this._panelEl||((t=this._layer)==null||t.destroy(),this._layer=b.createDismissableLayer({node:this._panelEl,trigger:e,closeOnEscape:this._closeOnEscape(),closeOnPointerOutside:this._closeOnOutside(),onDismiss:()=>this.close()}))}_teardownPortal(){var e,t,r,o;if((e=this._contentObserver)==null||e.disconnect(),this._contentObserver=null,(t=this._layer)==null||t.destroy(),this._layer=null,(r=this._positioner)==null||r.destroy(),this._positioner=null,this._panelEl=null,(o=this._portalEl)!=null&&o.parentElement)try{this._portalEl.parentElement.removeChild(this._portalEl)}catch{}this._portalEl=null}_schedulePortalSync(){this._syncPortalScheduled||!this._isOpen||(this._syncPortalScheduled=!0,queueMicrotask(()=>{this._syncPortalScheduled=!1,this._isOpen&&this._mountPortal()}))}_observeContent(){var t;(t=this._contentObserver)==null||t.disconnect(),this._contentObserver=null;const e=this._getContentSource();!e||typeof MutationObserver>"u"||(this._contentObserver=new MutationObserver(()=>this._schedulePortalSync()),this._contentObserver.observe(e,{attributes:!0,childList:!0,characterData:!0,subtree:!0}))}_observeHost(){var e;(e=this._hostObserver)==null||e.disconnect(),this._hostObserver=null,!(typeof MutationObserver>"u")&&(this._hostObserver=new MutationObserver(()=>this._schedulePortalSync()),this._hostObserver.observe(this,{childList:!0,subtree:!1}))}_mountPortal(){const e=this._getTrigger();if(!e)return;this._teardownPortal(),this._portalEl=this._buildPortalContent();const t=f.createPortalContainer();t&&(t.appendChild(this._portalEl),this._observeContent(),this._positioner=g.createPositioner({anchor:e,floating:this._portalEl,placement:this._placement(),offset:this._offset(),shift:this.getAttribute("shift")!=="false",flip:this.getAttribute("flip")!=="false",arrow:this._portalEl.querySelector(".arrow")}),this._syncDismissableLayer())}_syncOpenState(){var i;const e=this.hasAttribute("open");if(e===this._isOpen){e&&(!this._portalEl||!this._portalEl.isConnected?this._mountPortal():(i=this._positioner)==null||i.update());return}if(this._isOpen=e,e){this._restoreFocusEl=document.activeElement instanceof HTMLElement?document.activeElement:null,this._mountPortal(),this.dispatchEvent(new CustomEvent("open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:!0},bubbles:!0,composed:!0}));return}this._teardownPortal(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("open-change",{detail:{open:!1},bubbles:!0,composed:!0}));const t=this._getTrigger(),r=this._restoreFocusEl;this._restoreFocusEl=null;const o=(t&&t.isConnected?t:r)||null;if(o&&o.isConnected)try{o.focus()}catch{}}render(){this.setContent('<slot name="trigger"></slot>')}shouldRenderOnAttributeChange(e,t,r){return!1}}typeof customElements<"u"&&!customElements.get("ui-popover")&&customElements.define("ui-popover",d);exports.UIPopover=d;