@duskmoon-dev/el-popover 0.4.0

package/dist/cjs/index.js

@@ -0,0 +1,467 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __moduleCache = /* @__PURE__ */ new WeakMap;
+var __toCommonJS = (from) => {
+  var entry = __moduleCache.get(from), desc;
+  if (entry)
+    return entry;
+  entry = __defProp({}, "__esModule", { value: true });
+  if (from && typeof from === "object" || typeof from === "function")
+    __getOwnPropNames(from).map((key) => !__hasOwnProp.call(entry, key) && __defProp(entry, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    }));
+  __moduleCache.set(from, entry);
+  return entry;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, {
+      get: all[name],
+      enumerable: true,
+      configurable: true,
+      set: (newValue) => all[name] = () => newValue
+    });
+};
+
+// src/index.ts
+var exports_src = {};
+__export(exports_src, {
+  register: () => register,
+  ElDmPopover: () => ElDmPopover
+});
+module.exports = __toCommonJS(exports_src);
+
+// src/el-dm-popover.ts
+var import_el_core = require("@duskmoon-dev/el-core");
+var styles = import_el_core.css`
+  :host {
+    display: inline-block;
+    position: relative;
+  }
+
+  :host([hidden]) {
+    display: none !important;
+  }
+
+  .popover-trigger {
+    display: inline-flex;
+  }
+
+  .popover-panel {
+    position: fixed;
+    z-index: 1000;
+    min-width: 8rem;
+    max-width: 20rem;
+    padding: 0.75rem 1rem;
+    background-color: var(--color-surface, #ffffff);
+    border: 1px solid var(--color-outline, #e0e0e0);
+    border-radius: 0.5rem;
+    box-shadow:
+      0 4px 6px -1px rgb(0 0 0 / 0.1),
+      0 2px 4px -2px rgb(0 0 0 / 0.1);
+    opacity: 0;
+    visibility: hidden;
+    transform: scale(0.95);
+    transition:
+      opacity 150ms ease,
+      visibility 150ms ease,
+      transform 150ms ease;
+    pointer-events: none;
+    font-family: inherit;
+  }
+
+  .popover-panel.visible {
+    opacity: 1;
+    visibility: visible;
+    transform: scale(1);
+    pointer-events: auto;
+  }
+
+  .popover-arrow {
+    position: absolute;
+    width: 0.75rem;
+    height: 0.75rem;
+    background-color: var(--color-surface, #ffffff);
+    border: 1px solid var(--color-outline, #e0e0e0);
+    transform: rotate(45deg);
+  }
+
+  /* Arrow positioning based on popover placement */
+  .popover-panel[data-placement^='top'] .popover-arrow {
+    bottom: -0.4375rem;
+    border-top: none;
+    border-left: none;
+  }
+
+  .popover-panel[data-placement^='bottom'] .popover-arrow {
+    top: -0.4375rem;
+    border-bottom: none;
+    border-right: none;
+  }
+
+  .popover-panel[data-placement^='left'] .popover-arrow {
+    right: -0.4375rem;
+    border-top: none;
+    border-left: none;
+  }
+
+  .popover-panel[data-placement^='right'] .popover-arrow {
+    left: -0.4375rem;
+    border-bottom: none;
+    border-right: none;
+  }
+
+  /* Center aligned arrows */
+  .popover-panel[data-placement='top'] .popover-arrow,
+  .popover-panel[data-placement='bottom'] .popover-arrow {
+    left: 50%;
+    transform: translateX(-50%) rotate(45deg);
+  }
+
+  .popover-panel[data-placement='left'] .popover-arrow,
+  .popover-panel[data-placement='right'] .popover-arrow {
+    top: 50%;
+    transform: translateY(-50%) rotate(45deg);
+  }
+
+  /* Start aligned arrows */
+  .popover-panel[data-placement='top-start'] .popover-arrow,
+  .popover-panel[data-placement='bottom-start'] .popover-arrow {
+    left: 1rem;
+  }
+
+  .popover-panel[data-placement='left-start'] .popover-arrow,
+  .popover-panel[data-placement='right-start'] .popover-arrow {
+    top: 1rem;
+  }
+
+  /* End aligned arrows */
+  .popover-panel[data-placement='top-end'] .popover-arrow,
+  .popover-panel[data-placement='bottom-end'] .popover-arrow {
+    right: 1rem;
+    left: auto;
+  }
+
+  .popover-panel[data-placement='left-end'] .popover-arrow,
+  .popover-panel[data-placement='right-end'] .popover-arrow {
+    bottom: 1rem;
+    top: auto;
+  }
+
+  .popover-content {
+    color: var(--color-on-surface, #1f1f1f);
+    font-size: 0.875rem;
+    line-height: 1.5;
+  }
+`;
+
+class ElDmPopover extends import_el_core.BaseElement {
+  static properties = {
+    open: { type: Boolean, reflect: true, default: false },
+    trigger: { type: String, reflect: true, default: "click" },
+    placement: { type: String, reflect: true, default: "bottom" },
+    offset: { type: Number, reflect: true, default: 8 },
+    arrow: { type: Boolean, reflect: true, default: true }
+  };
+  _boundHandleClickOutside;
+  _boundHandleKeyDown;
+  _boundHandleScroll;
+  _boundUpdatePosition;
+  _hoverTimeout = null;
+  _currentPlacement = "bottom";
+  constructor() {
+    super();
+    this.attachStyles(styles);
+    this._boundHandleClickOutside = this._handleClickOutside.bind(this);
+    this._boundHandleKeyDown = this._handleKeyDown.bind(this);
+    this._boundHandleScroll = this._handleScroll.bind(this);
+    this._boundUpdatePosition = this._updatePosition.bind(this);
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this._setupTriggerListeners();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback?.();
+    this._removeTriggerListeners();
+    this._removeGlobalListeners();
+  }
+  show() {
+    if (this.open)
+      return;
+    this.open = true;
+    this._currentPlacement = this.placement;
+    this._addGlobalListeners();
+    this._updatePosition();
+    this._setVisible(true);
+    this.emit("open");
+  }
+  hide() {
+    if (!this.open)
+      return;
+    this.open = false;
+    this._removeGlobalListeners();
+    this._setVisible(false);
+    this.emit("close");
+  }
+  toggle() {
+    if (this.open) {
+      this.hide();
+    } else {
+      this.show();
+    }
+  }
+  _setVisible(visible) {
+    const panel = this.shadowRoot?.querySelector(".popover-panel");
+    if (panel) {
+      panel.classList.toggle("visible", visible);
+    }
+  }
+  _setupTriggerListeners() {
+    const triggerSlot = this.shadowRoot?.querySelector('slot[name="trigger"]');
+    if (!triggerSlot)
+      return;
+    triggerSlot.addEventListener("slotchange", () => {
+      this._attachTriggerEvents();
+    });
+    this._attachTriggerEvents();
+  }
+  _attachTriggerEvents() {
+    const triggerEl = this._getTriggerElement();
+    if (!triggerEl)
+      return;
+    this._detachTriggerEvents(triggerEl);
+    if (this.trigger === "click") {
+      triggerEl.addEventListener("click", this._handleTriggerClick);
+    } else if (this.trigger === "hover") {
+      triggerEl.addEventListener("mouseenter", this._handleTriggerMouseEnter);
+      triggerEl.addEventListener("mouseleave", this._handleTriggerMouseLeave);
+      this.addEventListener("mouseenter", this._handlePopoverMouseEnter);
+      this.addEventListener("mouseleave", this._handlePopoverMouseLeave);
+    } else if (this.trigger === "focus") {
+      triggerEl.addEventListener("focusin", this._handleTriggerFocus);
+      triggerEl.addEventListener("focusout", this._handleTriggerBlur);
+    }
+  }
+  _detachTriggerEvents(triggerEl) {
+    triggerEl.removeEventListener("click", this._handleTriggerClick);
+    triggerEl.removeEventListener("mouseenter", this._handleTriggerMouseEnter);
+    triggerEl.removeEventListener("mouseleave", this._handleTriggerMouseLeave);
+    triggerEl.removeEventListener("focusin", this._handleTriggerFocus);
+    triggerEl.removeEventListener("focusout", this._handleTriggerBlur);
+    this.removeEventListener("mouseenter", this._handlePopoverMouseEnter);
+    this.removeEventListener("mouseleave", this._handlePopoverMouseLeave);
+  }
+  _removeTriggerListeners() {
+    const triggerEl = this._getTriggerElement();
+    if (triggerEl) {
+      this._detachTriggerEvents(triggerEl);
+    }
+  }
+  _getTriggerElement() {
+    const triggerSlot = this.shadowRoot?.querySelector('slot[name="trigger"]');
+    if (!triggerSlot)
+      return null;
+    const assigned = triggerSlot.assignedElements();
+    return assigned[0] || null;
+  }
+  _handleTriggerClick = () => {
+    this.toggle();
+  };
+  _handleTriggerMouseEnter = () => {
+    if (this._hoverTimeout) {
+      clearTimeout(this._hoverTimeout);
+      this._hoverTimeout = null;
+    }
+    this.show();
+  };
+  _handleTriggerMouseLeave = () => {
+    this._hoverTimeout = window.setTimeout(() => {
+      this.hide();
+    }, 100);
+  };
+  _handlePopoverMouseEnter = () => {
+    if (this._hoverTimeout) {
+      clearTimeout(this._hoverTimeout);
+      this._hoverTimeout = null;
+    }
+  };
+  _handlePopoverMouseLeave = () => {
+    this._hoverTimeout = window.setTimeout(() => {
+      this.hide();
+    }, 100);
+  };
+  _handleTriggerFocus = () => {
+    this.show();
+  };
+  _handleTriggerBlur = () => {
+    setTimeout(() => {
+      if (!this.contains(document.activeElement)) {
+        this.hide();
+      }
+    }, 0);
+  };
+  _addGlobalListeners() {
+    document.addEventListener("click", this._boundHandleClickOutside, true);
+    document.addEventListener("keydown", this._boundHandleKeyDown);
+    window.addEventListener("scroll", this._boundHandleScroll, true);
+    window.addEventListener("resize", this._boundUpdatePosition);
+  }
+  _removeGlobalListeners() {
+    document.removeEventListener("click", this._boundHandleClickOutside, true);
+    document.removeEventListener("keydown", this._boundHandleKeyDown);
+    window.removeEventListener("scroll", this._boundHandleScroll, true);
+    window.removeEventListener("resize", this._boundUpdatePosition);
+  }
+  _handleClickOutside(e) {
+    if (this.trigger !== "click")
+      return;
+    const path = e.composedPath();
+    if (!path.includes(this)) {
+      this.hide();
+    }
+  }
+  _handleKeyDown(e) {
+    if (e.key === "Escape") {
+      this.hide();
+      const triggerEl = this._getTriggerElement();
+      triggerEl?.focus?.();
+    }
+  }
+  _handleScroll() {
+    if (this.open) {
+      this._updatePosition();
+    }
+  }
+  _updatePosition() {
+    const triggerEl = this._getTriggerElement();
+    const panel = this.shadowRoot?.querySelector(".popover-panel");
+    if (!triggerEl || !panel)
+      return;
+    const triggerRect = triggerEl.getBoundingClientRect();
+    const panelRect = panel.getBoundingClientRect();
+    const viewportWidth = window.innerWidth;
+    const viewportHeight = window.innerHeight;
+    const effectivePlacement = this._getEffectivePlacement(triggerRect, panelRect, viewportWidth, viewportHeight);
+    this._currentPlacement = effectivePlacement;
+    const position = this._calculatePosition(triggerRect, panelRect, effectivePlacement);
+    panel.style.left = `${position.x}px`;
+    panel.style.top = `${position.y}px`;
+    panel.setAttribute("data-placement", effectivePlacement);
+  }
+  _getEffectivePlacement(triggerRect, panelRect, viewportWidth, viewportHeight) {
+    const [mainAxis, alignment] = this.placement.split("-");
+    const spaceTop = triggerRect.top;
+    const spaceBottom = viewportHeight - triggerRect.bottom;
+    const spaceLeft = triggerRect.left;
+    const spaceRight = viewportWidth - triggerRect.right;
+    let effectiveMainAxis = mainAxis;
+    if (mainAxis === "top" && spaceTop < panelRect.height + this.offset) {
+      if (spaceBottom >= panelRect.height + this.offset) {
+        effectiveMainAxis = "bottom";
+      }
+    } else if (mainAxis === "bottom" && spaceBottom < panelRect.height + this.offset) {
+      if (spaceTop >= panelRect.height + this.offset) {
+        effectiveMainAxis = "top";
+      }
+    } else if (mainAxis === "left" && spaceLeft < panelRect.width + this.offset) {
+      if (spaceRight >= panelRect.width + this.offset) {
+        effectiveMainAxis = "right";
+      }
+    } else if (mainAxis === "right" && spaceRight < panelRect.width + this.offset) {
+      if (spaceLeft >= panelRect.width + this.offset) {
+        effectiveMainAxis = "left";
+      }
+    }
+    return alignment ? `${effectiveMainAxis}-${alignment}` : effectiveMainAxis;
+  }
+  _calculatePosition(triggerRect, panelRect, placement) {
+    const [mainAxis, alignment] = placement.split("-");
+    let x = 0;
+    let y = 0;
+    switch (mainAxis) {
+      case "top":
+        y = triggerRect.top - panelRect.height - this.offset;
+        break;
+      case "bottom":
+        y = triggerRect.bottom + this.offset;
+        break;
+      case "left":
+        x = triggerRect.left - panelRect.width - this.offset;
+        break;
+      case "right":
+        x = triggerRect.right + this.offset;
+        break;
+    }
+    if (mainAxis === "top" || mainAxis === "bottom") {
+      switch (alignment) {
+        case "start":
+          x = triggerRect.left;
+          break;
+        case "end":
+          x = triggerRect.right - panelRect.width;
+          break;
+        default:
+          x = triggerRect.left + (triggerRect.width - panelRect.width) / 2;
+      }
+    } else {
+      switch (alignment) {
+        case "start":
+          y = triggerRect.top;
+          break;
+        case "end":
+          y = triggerRect.bottom - panelRect.height;
+          break;
+        default:
+          y = triggerRect.top + (triggerRect.height - panelRect.height) / 2;
+      }
+    }
+    const viewportWidth = window.innerWidth;
+    const viewportHeight = window.innerHeight;
+    const padding = 8;
+    x = Math.max(padding, Math.min(x, viewportWidth - panelRect.width - padding));
+    y = Math.max(padding, Math.min(y, viewportHeight - panelRect.height - padding));
+    return { x, y };
+  }
+  update() {
+    super.update();
+    if (this.open) {
+      requestAnimationFrame(() => {
+        this._updatePosition();
+        this._setVisible(true);
+      });
+    }
+  }
+  render() {
+    return `
+      <div class="popover-trigger">
+        <slot name="trigger"></slot>
+      </div>
+      <div
+        class="popover-panel"
+        part="popover"
+        role="dialog"
+        aria-modal="false"
+        data-placement="${this.placement}"
+      >
+        ${this.arrow ? '<div class="popover-arrow" part="arrow"></div>' : ""}
+        <div class="popover-content" part="content">
+          <slot></slot>
+        </div>
+      </div>
+    `;
+  }
+}
+
+// src/index.ts
+function register() {
+  if (!customElements.get("el-dm-popover")) {
+    customElements.define("el-dm-popover", ElDmPopover);
+  }
+}
+
+//# debugId=9AD0C450FA37F1BF64756E2164756E21
+//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -0,0 +1,11 @@
+{
+  "version": 3,
+  "sources": ["../../src/el-dm-popover.ts", "../../src/index.ts"],
+  "sourcesContent": [
+    "/**\n * DuskMoon Popover Element\n *\n * A contextual overlay/popup component that appears relative to a trigger element.\n * Supports multiple trigger modes, placements, and auto-flip when near viewport edges.\n *\n * @element el-dm-popover\n *\n * @attr {boolean} open - Whether the popover is visible\n * @attr {string} trigger - Trigger mode: click, hover, focus, manual\n * @attr {string} placement - Popover position relative to trigger\n * @attr {number} offset - Distance from trigger element in pixels\n * @attr {boolean} arrow - Whether to show arrow pointing to trigger\n *\n * @slot trigger - The element that triggers the popover\n * @slot - Default slot for popover content\n *\n * @fires open - Fired when popover opens\n * @fires close - Fired when popover closes\n *\n * @csspart popover - The popover container\n * @csspart content - The popover content area\n * @csspart arrow - The popover arrow\n */\n\nimport { BaseElement, css } from '@duskmoon-dev/el-core';\n\nexport type PopoverPlacement =\n  | 'top'\n  | 'top-start'\n  | 'top-end'\n  | 'bottom'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'left'\n  | 'left-start'\n  | 'left-end'\n  | 'right'\n  | 'right-start'\n  | 'right-end';\n\nexport type PopoverTrigger = 'click' | 'hover' | 'focus' | 'manual';\n\nconst styles = css`\n  :host {\n    display: inline-block;\n    position: relative;\n  }\n\n  :host([hidden]) {\n    display: none !important;\n  }\n\n  .popover-trigger {\n    display: inline-flex;\n  }\n\n  .popover-panel {\n    position: fixed;\n    z-index: 1000;\n    min-width: 8rem;\n    max-width: 20rem;\n    padding: 0.75rem 1rem;\n    background-color: var(--color-surface, #ffffff);\n    border: 1px solid var(--color-outline, #e0e0e0);\n    border-radius: 0.5rem;\n    box-shadow:\n      0 4px 6px -1px rgb(0 0 0 / 0.1),\n      0 2px 4px -2px rgb(0 0 0 / 0.1);\n    opacity: 0;\n    visibility: hidden;\n    transform: scale(0.95);\n    transition:\n      opacity 150ms ease,\n      visibility 150ms ease,\n      transform 150ms ease;\n    pointer-events: none;\n    font-family: inherit;\n  }\n\n  .popover-panel.visible {\n    opacity: 1;\n    visibility: visible;\n    transform: scale(1);\n    pointer-events: auto;\n  }\n\n  .popover-arrow {\n    position: absolute;\n    width: 0.75rem;\n    height: 0.75rem;\n    background-color: var(--color-surface, #ffffff);\n    border: 1px solid var(--color-outline, #e0e0e0);\n    transform: rotate(45deg);\n  }\n\n  /* Arrow positioning based on popover placement */\n  .popover-panel[data-placement^='top'] .popover-arrow {\n    bottom: -0.4375rem;\n    border-top: none;\n    border-left: none;\n  }\n\n  .popover-panel[data-placement^='bottom'] .popover-arrow {\n    top: -0.4375rem;\n    border-bottom: none;\n    border-right: none;\n  }\n\n  .popover-panel[data-placement^='left'] .popover-arrow {\n    right: -0.4375rem;\n    border-top: none;\n    border-left: none;\n  }\n\n  .popover-panel[data-placement^='right'] .popover-arrow {\n    left: -0.4375rem;\n    border-bottom: none;\n    border-right: none;\n  }\n\n  /* Center aligned arrows */\n  .popover-panel[data-placement='top'] .popover-arrow,\n  .popover-panel[data-placement='bottom'] .popover-arrow {\n    left: 50%;\n    transform: translateX(-50%) rotate(45deg);\n  }\n\n  .popover-panel[data-placement='left'] .popover-arrow,\n  .popover-panel[data-placement='right'] .popover-arrow {\n    top: 50%;\n    transform: translateY(-50%) rotate(45deg);\n  }\n\n  /* Start aligned arrows */\n  .popover-panel[data-placement='top-start'] .popover-arrow,\n  .popover-panel[data-placement='bottom-start'] .popover-arrow {\n    left: 1rem;\n  }\n\n  .popover-panel[data-placement='left-start'] .popover-arrow,\n  .popover-panel[data-placement='right-start'] .popover-arrow {\n    top: 1rem;\n  }\n\n  /* End aligned arrows */\n  .popover-panel[data-placement='top-end'] .popover-arrow,\n  .popover-panel[data-placement='bottom-end'] .popover-arrow {\n    right: 1rem;\n    left: auto;\n  }\n\n  .popover-panel[data-placement='left-end'] .popover-arrow,\n  .popover-panel[data-placement='right-end'] .popover-arrow {\n    bottom: 1rem;\n    top: auto;\n  }\n\n  .popover-content {\n    color: var(--color-on-surface, #1f1f1f);\n    font-size: 0.875rem;\n    line-height: 1.5;\n  }\n`;\n\nexport class ElDmPopover extends BaseElement {\n  static properties = {\n    open: { type: Boolean, reflect: true, default: false },\n    trigger: { type: String, reflect: true, default: 'click' },\n    placement: { type: String, reflect: true, default: 'bottom' },\n    offset: { type: Number, reflect: true, default: 8 },\n    arrow: { type: Boolean, reflect: true, default: true },\n  };\n\n  declare open: boolean;\n  declare trigger: PopoverTrigger;\n  declare placement: PopoverPlacement;\n  declare offset: number;\n  declare arrow: boolean;\n\n  private _boundHandleClickOutside: (e: MouseEvent) => void;\n  private _boundHandleKeyDown: (e: KeyboardEvent) => void;\n  private _boundHandleScroll: () => void;\n  private _boundUpdatePosition: () => void;\n  private _hoverTimeout: number | null = null;\n  private _currentPlacement: PopoverPlacement = 'bottom';\n\n  constructor() {\n    super();\n    this.attachStyles(styles);\n    this._boundHandleClickOutside = this._handleClickOutside.bind(this);\n    this._boundHandleKeyDown = this._handleKeyDown.bind(this);\n    this._boundHandleScroll = this._handleScroll.bind(this);\n    this._boundUpdatePosition = this._updatePosition.bind(this);\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this._setupTriggerListeners();\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback?.();\n    this._removeTriggerListeners();\n    this._removeGlobalListeners();\n  }\n\n  /**\n   * Show the popover\n   */\n  show(): void {\n    if (this.open) return;\n    this.open = true;\n    this._currentPlacement = this.placement;\n    this._addGlobalListeners();\n    this._updatePosition();\n    this._setVisible(true);\n    this.emit('open');\n  }\n\n  /**\n   * Hide the popover\n   */\n  hide(): void {\n    if (!this.open) return;\n    this.open = false;\n    this._removeGlobalListeners();\n    this._setVisible(false);\n    this.emit('close');\n  }\n\n  /**\n   * Toggle the popover visibility\n   */\n  toggle(): void {\n    if (this.open) {\n      this.hide();\n    } else {\n      this.show();\n    }\n  }\n\n  private _setVisible(visible: boolean): void {\n    const panel = this.shadowRoot?.querySelector('.popover-panel');\n    if (panel) {\n      panel.classList.toggle('visible', visible);\n    }\n  }\n\n  private _setupTriggerListeners(): void {\n    const triggerSlot = this.shadowRoot?.querySelector(\n      'slot[name=\"trigger\"]',\n    ) as HTMLSlotElement | null;\n\n    if (!triggerSlot) return;\n\n    triggerSlot.addEventListener('slotchange', () => {\n      this._attachTriggerEvents();\n    });\n\n    // Initial attachment\n    this._attachTriggerEvents();\n  }\n\n  private _attachTriggerEvents(): void {\n    const triggerEl = this._getTriggerElement();\n    if (!triggerEl) return;\n\n    // Remove any existing listeners first\n    this._detachTriggerEvents(triggerEl);\n\n    if (this.trigger === 'click') {\n      triggerEl.addEventListener('click', this._handleTriggerClick);\n    } else if (this.trigger === 'hover') {\n      triggerEl.addEventListener('mouseenter', this._handleTriggerMouseEnter);\n      triggerEl.addEventListener('mouseleave', this._handleTriggerMouseLeave);\n      // Also track hover on the popover panel\n      this.addEventListener('mouseenter', this._handlePopoverMouseEnter);\n      this.addEventListener('mouseleave', this._handlePopoverMouseLeave);\n    } else if (this.trigger === 'focus') {\n      triggerEl.addEventListener('focusin', this._handleTriggerFocus);\n      triggerEl.addEventListener('focusout', this._handleTriggerBlur);\n    }\n  }\n\n  private _detachTriggerEvents(triggerEl: Element): void {\n    triggerEl.removeEventListener('click', this._handleTriggerClick);\n    triggerEl.removeEventListener('mouseenter', this._handleTriggerMouseEnter);\n    triggerEl.removeEventListener('mouseleave', this._handleTriggerMouseLeave);\n    triggerEl.removeEventListener('focusin', this._handleTriggerFocus);\n    triggerEl.removeEventListener('focusout', this._handleTriggerBlur);\n    this.removeEventListener('mouseenter', this._handlePopoverMouseEnter);\n    this.removeEventListener('mouseleave', this._handlePopoverMouseLeave);\n  }\n\n  private _removeTriggerListeners(): void {\n    const triggerEl = this._getTriggerElement();\n    if (triggerEl) {\n      this._detachTriggerEvents(triggerEl);\n    }\n  }\n\n  private _getTriggerElement(): Element | null {\n    const triggerSlot = this.shadowRoot?.querySelector(\n      'slot[name=\"trigger\"]',\n    ) as HTMLSlotElement | null;\n    if (!triggerSlot) return null;\n    const assigned = triggerSlot.assignedElements();\n    return assigned[0] || null;\n  }\n\n  private _handleTriggerClick = (): void => {\n    this.toggle();\n  };\n\n  private _handleTriggerMouseEnter = (): void => {\n    if (this._hoverTimeout) {\n      clearTimeout(this._hoverTimeout);\n      this._hoverTimeout = null;\n    }\n    this.show();\n  };\n\n  private _handleTriggerMouseLeave = (): void => {\n    this._hoverTimeout = window.setTimeout(() => {\n      this.hide();\n    }, 100);\n  };\n\n  private _handlePopoverMouseEnter = (): void => {\n    if (this._hoverTimeout) {\n      clearTimeout(this._hoverTimeout);\n      this._hoverTimeout = null;\n    }\n  };\n\n  private _handlePopoverMouseLeave = (): void => {\n    this._hoverTimeout = window.setTimeout(() => {\n      this.hide();\n    }, 100);\n  };\n\n  private _handleTriggerFocus = (): void => {\n    this.show();\n  };\n\n  private _handleTriggerBlur = (): void => {\n    // Delay to allow focus to move to popover content\n    setTimeout(() => {\n      if (!this.contains(document.activeElement)) {\n        this.hide();\n      }\n    }, 0);\n  };\n\n  private _addGlobalListeners(): void {\n    document.addEventListener('click', this._boundHandleClickOutside, true);\n    document.addEventListener('keydown', this._boundHandleKeyDown);\n    window.addEventListener('scroll', this._boundHandleScroll, true);\n    window.addEventListener('resize', this._boundUpdatePosition);\n  }\n\n  private _removeGlobalListeners(): void {\n    document.removeEventListener('click', this._boundHandleClickOutside, true);\n    document.removeEventListener('keydown', this._boundHandleKeyDown);\n    window.removeEventListener('scroll', this._boundHandleScroll, true);\n    window.removeEventListener('resize', this._boundUpdatePosition);\n  }\n\n  private _handleClickOutside(e: MouseEvent): void {\n    if (this.trigger !== 'click') return;\n\n    const path = e.composedPath();\n    if (!path.includes(this)) {\n      this.hide();\n    }\n  }\n\n  private _handleKeyDown(e: KeyboardEvent): void {\n    if (e.key === 'Escape') {\n      this.hide();\n      // Return focus to trigger element\n      const triggerEl = this._getTriggerElement() as HTMLElement | null;\n      triggerEl?.focus?.();\n    }\n  }\n\n  private _handleScroll(): void {\n    if (this.open) {\n      this._updatePosition();\n    }\n  }\n\n  private _updatePosition(): void {\n    const triggerEl = this._getTriggerElement();\n    const panel = this.shadowRoot?.querySelector('.popover-panel') as HTMLElement | null;\n\n    if (!triggerEl || !panel) return;\n\n    const triggerRect = triggerEl.getBoundingClientRect();\n    const panelRect = panel.getBoundingClientRect();\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n\n    // Determine the best placement with auto-flip\n    const effectivePlacement = this._getEffectivePlacement(\n      triggerRect,\n      panelRect,\n      viewportWidth,\n      viewportHeight,\n    );\n\n    this._currentPlacement = effectivePlacement;\n\n    // Calculate position based on placement\n    const position = this._calculatePosition(triggerRect, panelRect, effectivePlacement);\n\n    // Apply position\n    panel.style.left = `${position.x}px`;\n    panel.style.top = `${position.y}px`;\n    panel.setAttribute('data-placement', effectivePlacement);\n  }\n\n  private _getEffectivePlacement(\n    triggerRect: DOMRect,\n    panelRect: DOMRect,\n    viewportWidth: number,\n    viewportHeight: number,\n  ): PopoverPlacement {\n    const [mainAxis, alignment] = this.placement.split('-') as [\n      'top' | 'bottom' | 'left' | 'right',\n      'start' | 'end' | undefined,\n    ];\n\n    // Check if there's enough space in the preferred direction\n    const spaceTop = triggerRect.top;\n    const spaceBottom = viewportHeight - triggerRect.bottom;\n    const spaceLeft = triggerRect.left;\n    const spaceRight = viewportWidth - triggerRect.right;\n\n    let effectiveMainAxis = mainAxis;\n\n    // Flip main axis if needed\n    if (mainAxis === 'top' && spaceTop < panelRect.height + this.offset) {\n      if (spaceBottom >= panelRect.height + this.offset) {\n        effectiveMainAxis = 'bottom';\n      }\n    } else if (mainAxis === 'bottom' && spaceBottom < panelRect.height + this.offset) {\n      if (spaceTop >= panelRect.height + this.offset) {\n        effectiveMainAxis = 'top';\n      }\n    } else if (mainAxis === 'left' && spaceLeft < panelRect.width + this.offset) {\n      if (spaceRight >= panelRect.width + this.offset) {\n        effectiveMainAxis = 'right';\n      }\n    } else if (mainAxis === 'right' && spaceRight < panelRect.width + this.offset) {\n      if (spaceLeft >= panelRect.width + this.offset) {\n        effectiveMainAxis = 'left';\n      }\n    }\n\n    return alignment\n      ? (`${effectiveMainAxis}-${alignment}` as PopoverPlacement)\n      : effectiveMainAxis;\n  }\n\n  private _calculatePosition(\n    triggerRect: DOMRect,\n    panelRect: DOMRect,\n    placement: PopoverPlacement,\n  ): { x: number; y: number } {\n    const [mainAxis, alignment] = placement.split('-') as [\n      'top' | 'bottom' | 'left' | 'right',\n      'start' | 'end' | undefined,\n    ];\n\n    let x = 0;\n    let y = 0;\n\n    // Calculate main axis position\n    switch (mainAxis) {\n      case 'top':\n        y = triggerRect.top - panelRect.height - this.offset;\n        break;\n      case 'bottom':\n        y = triggerRect.bottom + this.offset;\n        break;\n      case 'left':\n        x = triggerRect.left - panelRect.width - this.offset;\n        break;\n      case 'right':\n        x = triggerRect.right + this.offset;\n        break;\n    }\n\n    // Calculate cross axis position based on alignment\n    if (mainAxis === 'top' || mainAxis === 'bottom') {\n      switch (alignment) {\n        case 'start':\n          x = triggerRect.left;\n          break;\n        case 'end':\n          x = triggerRect.right - panelRect.width;\n          break;\n        default:\n          x = triggerRect.left + (triggerRect.width - panelRect.width) / 2;\n      }\n    } else {\n      switch (alignment) {\n        case 'start':\n          y = triggerRect.top;\n          break;\n        case 'end':\n          y = triggerRect.bottom - panelRect.height;\n          break;\n        default:\n          y = triggerRect.top + (triggerRect.height - panelRect.height) / 2;\n      }\n    }\n\n    // Constrain to viewport\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n    const padding = 8;\n\n    x = Math.max(padding, Math.min(x, viewportWidth - panelRect.width - padding));\n    y = Math.max(padding, Math.min(y, viewportHeight - panelRect.height - padding));\n\n    return { x, y };\n  }\n\n  update(): void {\n    super.update();\n    if (this.open) {\n      // Defer position update to allow DOM to render\n      requestAnimationFrame(() => {\n        this._updatePosition();\n        this._setVisible(true);\n      });\n    }\n  }\n\n  render(): string {\n    return `\n      <div class=\"popover-trigger\">\n        <slot name=\"trigger\"></slot>\n      </div>\n      <div\n        class=\"popover-panel\"\n        part=\"popover\"\n        role=\"dialog\"\n        aria-modal=\"false\"\n        data-placement=\"${this.placement}\"\n      >\n        ${this.arrow ? '<div class=\"popover-arrow\" part=\"arrow\"></div>' : ''}\n        <div class=\"popover-content\" part=\"content\">\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n",
+    "/**\n * @duskmoon-dev/el-popover\n *\n * DuskMoon Popover custom element\n */\n\nimport { ElDmPopover } from './el-dm-popover.js';\n\nexport { ElDmPopover };\nexport type { PopoverPlacement, PopoverTrigger } from './el-dm-popover.js';\n\n/**\n * Register the el-dm-popover custom element\n *\n * @example\n * ```ts\n * import { register } from '@duskmoon-dev/el-popover';\n * register();\n * ```\n */\nexport function register(): void {\n  if (!customElements.get('el-dm-popover')) {\n    customElements.define('el-dm-popover', ElDmPopover);\n  }\n}\n"
+  ],
+  "mappings": "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",
+  "debugId": "9AD0C450FA37F1BF64756E2164756E21",
+  "names": []
+}