@hypoth-ui/wc 0.1.1

package/dist/chunk-55ID7LJL.js

@@ -0,0 +1,3602 @@
+import {
+  Warnings,
+  devWarn,
+  hasRequiredChild
+} from "./chunk-JMPTFALJ.js";
+import {
+  StandardEvents,
+  emitEvent
+} from "./chunk-YDQ434UH.js";
+import {
+  DSElement,
+  __decorateClass,
+  define
+} from "./chunk-H4GJJZ3N.js";
+
+// src/components/dialog/dialog-content.ts
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var DsDialogContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.size = "md";
+    this.dataState = "open";
+  }
+  render() {
+    return html`
+      <div class="ds-dialog-content" part="container" data-size=${this.size}>
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+__decorateClass([
+  property({ type: String, reflect: true })
+], DsDialogContent.prototype, "size", 2);
+__decorateClass([
+  property({ type: String, reflect: true, attribute: "data-state" })
+], DsDialogContent.prototype, "dataState", 2);
+define("ds-dialog-content", DsDialogContent);
+
+// src/components/dialog/dialog-title.ts
+import { html as html2, nothing } from "lit";
+import { state } from "lit/decorators.js";
+var DsDialogTitle = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.titleText = "";
+  }
+  connectedCallback() {
+    this.titleText = this.textContent?.trim() ?? "";
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `dialog-title-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    if (!this.titleText) {
+      return nothing;
+    }
+    return html2`
+      <h2 class="ds-dialog-title" part="title">${this.titleText}</h2>
+    `;
+  }
+};
+__decorateClass([
+  state()
+], DsDialogTitle.prototype, "titleText", 2);
+define("ds-dialog-title", DsDialogTitle);
+
+// src/components/dialog/dialog-description.ts
+import { html as html3, nothing as nothing2 } from "lit";
+import { state as state2 } from "lit/decorators.js";
+var DsDialogDescription = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.descriptionText = "";
+  }
+  connectedCallback() {
+    this.descriptionText = this.textContent?.trim() ?? "";
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `dialog-desc-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    if (!this.descriptionText) {
+      return nothing2;
+    }
+    return html3`
+      <p class="ds-dialog-description" part="description">${this.descriptionText}</p>
+    `;
+  }
+};
+__decorateClass([
+  state2()
+], DsDialogDescription.prototype, "descriptionText", 2);
+define("ds-dialog-description", DsDialogDescription);
+
+// src/components/dialog/dialog.ts
+import {
+  createDialogBehavior,
+  createPresence,
+  prefersReducedMotion
+} from "@hypoth-ui/primitives-dom";
+import { html as html4 } from "lit";
+import { property as property2, state as state3 } from "lit/decorators.js";
+var DsDialog = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.closeOnEscape = true;
+    this.closeOnBackdrop = true;
+    this.animated = true;
+    this.dialogRole = "dialog";
+    this.isClosing = false;
+    this.dialogBehavior = null;
+    this.presence = null;
+    this.attributeObserver = null;
+    this.backdropElement = null;
+    /** Tracks the reason for closing (for animation completion) */
+    this._closeReason = "programmatic";
+    this.handleTriggerClick = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        this.dialogBehavior?.setTriggerElement(trigger);
+        this.show();
+      }
+    };
+    this.handleBackdropClick = (event) => {
+      const content = this.querySelector("ds-dialog-content");
+      const target = event.target;
+      if (content?.contains(target)) {
+        return;
+      }
+      if (this.closeOnBackdrop) {
+        this.close("outside-click");
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleTriggerClick);
+    this.attributeObserver = new MutationObserver(() => {
+      const roleAttr = this.getAttribute("role");
+      if (roleAttr === "alertdialog" || roleAttr === "dialog") {
+        this.dialogRole = roleAttr;
+      }
+      if (roleAttr) {
+        this.removeAttribute("role");
+      }
+    });
+    this.attributeObserver.observe(this, {
+      attributes: true,
+      attributeFilter: ["role"]
+    });
+    const initialRole = this.getAttribute("role");
+    if (initialRole === "alertdialog" || initialRole === "dialog") {
+      this.dialogRole = initialRole;
+      this.removeAttribute("role");
+    }
+    this.initDialogBehavior();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleTriggerClick);
+    this.attributeObserver?.disconnect();
+    this.attributeObserver = null;
+    this.cleanup();
+  }
+  /**
+   * Initializes the dialog behavior primitive.
+   */
+  initDialogBehavior() {
+    this.dialogBehavior = createDialogBehavior({
+      defaultOpen: this.open,
+      role: this.dialogRole,
+      closeOnEscape: this.closeOnEscape,
+      closeOnOutsideClick: this.closeOnBackdrop,
+      onOpenChange: (open) => {
+        if (!open && this.open) {
+          this.handleBehaviorClose();
+        }
+      }
+    });
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior.setTriggerElement(trigger);
+    }
+  }
+  /**
+   * Handles close triggered by the behavior (escape/outside click).
+   */
+  handleBehaviorClose(reason = "escape") {
+    const openChangeEvent = emitEvent(this, StandardEvents.OPEN_CHANGE, {
+      detail: { open: false, reason },
+      cancelable: true
+    });
+    if (openChangeEvent.defaultPrevented) {
+      this.dialogBehavior?.open();
+      return;
+    }
+    const content = this.querySelector("ds-dialog-content");
+    if (this.animated && content && !prefersReducedMotion()) {
+      this.isClosing = true;
+      this._closeReason = reason;
+      this.presence = createPresence({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      this.isClosing = false;
+    }
+  }
+  /**
+   * Opens the dialog.
+   */
+  show() {
+    if (this.open) return;
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior?.setTriggerElement(trigger);
+    } else if (document.activeElement instanceof HTMLElement) {
+      this.dialogBehavior?.setTriggerElement(document.activeElement);
+    }
+    this.open = true;
+    this.dialogBehavior?.open();
+    emitEvent(this, StandardEvents.OPEN_CHANGE, {
+      detail: { open: true, reason: "trigger" }
+    });
+  }
+  /**
+   * Closes the dialog.
+   * @param reason - The reason for closing (default: "programmatic")
+   */
+  close(reason = "programmatic") {
+    if (!this.open) return;
+    const openChangeEvent = emitEvent(this, StandardEvents.OPEN_CHANGE, {
+      detail: { open: false, reason },
+      cancelable: true
+    });
+    if (openChangeEvent.defaultPrevented) {
+      return;
+    }
+    const content = this.querySelector("ds-dialog-content");
+    this.dialogBehavior?.close();
+    if (this.animated && content && !prefersReducedMotion()) {
+      this.isClosing = true;
+      this._closeReason = reason;
+      this.presence = createPresence({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      this.isClosing = false;
+    }
+  }
+  /**
+   * Completes the close after exit animation.
+   * Note: The open-change event was already emitted before animation started.
+   */
+  completeClose() {
+    this.presence?.destroy();
+    this.presence = null;
+    this.open = false;
+    this.isClosing = false;
+  }
+  cleanup() {
+    this.dialogBehavior?.destroy();
+    this.dialogBehavior = null;
+    this.presence?.destroy();
+    this.presence = null;
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      const content = this.querySelector("ds-dialog-content");
+      if (this.open) {
+        await this.updateComplete;
+        if (content) {
+          content.dataState = "open";
+        }
+        this.dialogBehavior?.setContentElement(content);
+        this.updateContentAccessibility();
+        this.backdropElement = this.querySelector(".ds-dialog__backdrop");
+        this.backdropElement?.addEventListener("click", this.handleBackdropClick);
+      } else {
+        this.backdropElement?.removeEventListener("click", this.handleBackdropClick);
+        this.backdropElement = null;
+        this.dialogBehavior?.setContentElement(null);
+      }
+    }
+    if (changedProperties.has("dialogRole") && this.open) {
+      this.updateContentAccessibility();
+    }
+    if (changedProperties.has("closeOnEscape") || changedProperties.has("closeOnBackdrop")) {
+      const wasOpen = this.dialogBehavior?.state.open;
+      this.dialogBehavior?.destroy();
+      this.initDialogBehavior();
+      if (wasOpen) {
+        this.dialogBehavior?.open();
+        const content = this.querySelector("ds-dialog-content");
+        this.dialogBehavior?.setContentElement(content);
+      }
+    }
+  }
+  /**
+   * Updates accessibility attributes on dialog content.
+   */
+  updateContentAccessibility() {
+    const content = this.querySelector("ds-dialog-content");
+    if (!content || !this.dialogBehavior) return;
+    const contentProps = this.dialogBehavior.getContentProps();
+    content.setAttribute("role", this.dialogRole);
+    content.setAttribute("aria-modal", contentProps["aria-modal"]);
+    if (!hasRequiredChild(this, "ds-dialog-title") && !this.getAttribute("aria-label")) {
+      devWarn(Warnings.dialogMissingTitle("ds-dialog"));
+    }
+    const title = this.querySelector("ds-dialog-title");
+    if (title) {
+      const titleProps = this.dialogBehavior.getTitleProps();
+      if (!title.id) {
+        title.id = titleProps.id;
+      }
+      content.setAttribute("aria-labelledby", title.id);
+    }
+    const description = this.querySelector("ds-dialog-description");
+    if (description) {
+      const descProps = this.dialogBehavior.getDescriptionProps();
+      if (!description.id) {
+        description.id = descProps.id;
+      }
+      content.setAttribute("aria-describedby", description.id);
+      this.dialogBehavior.setHasDescription(true);
+    } else {
+      if (title) {
+        devWarn(Warnings.dialogMissingDescription("ds-dialog"));
+      }
+      this.dialogBehavior.setHasDescription(false);
+    }
+  }
+  render() {
+    return html4`
+      <slot name="trigger"></slot>
+      <div
+        class="ds-dialog__backdrop"
+        ?hidden=${!this.open}
+        ?data-closing=${this.isClosing}
+      >
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+__decorateClass([
+  property2({ type: Boolean, reflect: true })
+], DsDialog.prototype, "open", 2);
+__decorateClass([
+  property2({ type: Boolean, attribute: "close-on-escape" })
+], DsDialog.prototype, "closeOnEscape", 2);
+__decorateClass([
+  property2({ type: Boolean, attribute: "close-on-backdrop" })
+], DsDialog.prototype, "closeOnBackdrop", 2);
+__decorateClass([
+  property2({ type: Boolean })
+], DsDialog.prototype, "animated", 2);
+__decorateClass([
+  state3()
+], DsDialog.prototype, "dialogRole", 2);
+__decorateClass([
+  state3()
+], DsDialog.prototype, "isClosing", 2);
+define("ds-dialog", DsDialog);
+
+// src/components/popover/popover-content.ts
+import { html as html5 } from "lit";
+import { property as property3 } from "lit/decorators.js";
+var DsPopoverContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.id = "";
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `popover-content-${crypto.randomUUID().slice(0, 8)}`;
+    }
+    this.setAttribute("hidden", "");
+  }
+  render() {
+    return html5`
+      <div class="ds-popover-content" part="container">
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+__decorateClass([
+  property3({ type: String, reflect: true })
+], DsPopoverContent.prototype, "id", 2);
+__decorateClass([
+  property3({ type: String, reflect: true, attribute: "data-state" })
+], DsPopoverContent.prototype, "dataState", 2);
+define("ds-popover-content", DsPopoverContent);
+
+// src/components/popover/popover.ts
+import {
+  createAnchorPosition,
+  createDismissableLayer,
+  createPresence as createPresence2,
+  prefersReducedMotion as prefersReducedMotion2
+} from "@hypoth-ui/primitives-dom";
+import { html as html6 } from "lit";
+import { property as property4 } from "lit/decorators.js";
+var DsPopover = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.placement = "bottom";
+    this.offset = 8;
+    this.flip = true;
+    this.closeOnEscape = true;
+    this.closeOnOutsideClick = true;
+    this.animated = true;
+    this.anchorPosition = null;
+    this.dismissLayer = null;
+    this.presence = null;
+    this.triggerElement = null;
+    this.resizeObserver = null;
+    this.scrollHandler = null;
+    this.handleTriggerClick = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        event.preventDefault();
+        this.triggerElement = trigger;
+        this.toggle();
+      }
+    };
+    this.handleDismiss = (reason) => {
+      if (reason === "escape" && this.closeOnEscape) {
+        this.close();
+      } else if (reason === "outside-click" && this.closeOnOutsideClick) {
+        this.close();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleTriggerClick);
+    this.updateComplete.then(() => {
+      this.setupTriggerAccessibility();
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleTriggerClick);
+    this.cleanup();
+  }
+  /**
+   * Opens the popover.
+   */
+  show() {
+    if (this.open) return;
+    this.open = true;
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the popover.
+   */
+  close() {
+    if (!this.open) return;
+    const content = this.querySelector("ds-popover-content");
+    if (this.animated && content && !prefersReducedMotion2()) {
+      this.dismissLayer?.deactivate();
+      this.dismissLayer = null;
+      this.presence = createPresence2({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.cleanup();
+      this.open = false;
+      emitEvent(this, StandardEvents.CLOSE);
+      this.triggerElement?.focus();
+    }
+  }
+  /**
+   * Completes the close after exit animation.
+   */
+  completeClose() {
+    this.cleanup();
+    this.open = false;
+    emitEvent(this, StandardEvents.CLOSE);
+    this.triggerElement?.focus();
+  }
+  /**
+   * Toggles the popover open/closed state.
+   */
+  toggle() {
+    if (this.open) {
+      this.close();
+    } else {
+      this.show();
+    }
+  }
+  setupTriggerAccessibility() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-popover-content");
+    if (trigger && content) {
+      this.triggerElement = trigger;
+      trigger.setAttribute("aria-haspopup", "true");
+      trigger.setAttribute("aria-expanded", String(this.open));
+      trigger.setAttribute("aria-controls", content.id);
+    }
+  }
+  updateTriggerAria() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      trigger.setAttribute("aria-expanded", String(this.open));
+    }
+  }
+  setupPositioning() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-popover-content");
+    if (!trigger || !content) return;
+    this.anchorPosition = createAnchorPosition({
+      anchor: trigger,
+      floating: content,
+      placement: this.placement,
+      offset: this.offset,
+      flip: this.flip,
+      onPositionChange: (pos) => {
+        content.setAttribute("data-placement", pos.placement);
+      }
+    });
+    this.resizeObserver = new ResizeObserver(() => {
+      this.anchorPosition?.update();
+    });
+    this.resizeObserver.observe(trigger);
+    this.resizeObserver.observe(content);
+    this.scrollHandler = () => {
+      this.anchorPosition?.update();
+    };
+    window.addEventListener("scroll", this.scrollHandler, { passive: true });
+    window.addEventListener("resize", this.scrollHandler, { passive: true });
+  }
+  setupDismissLayer() {
+    const content = this.querySelector("ds-popover-content");
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (!content) return;
+    this.dismissLayer = createDismissableLayer({
+      container: content,
+      excludeElements: trigger ? [trigger] : [],
+      onDismiss: this.handleDismiss,
+      closeOnEscape: this.closeOnEscape,
+      closeOnOutsideClick: this.closeOnOutsideClick
+    });
+    this.dismissLayer.activate();
+  }
+  cleanup() {
+    this.anchorPosition?.destroy();
+    this.anchorPosition = null;
+    this.dismissLayer?.deactivate();
+    this.dismissLayer = null;
+    this.presence?.destroy();
+    this.presence = null;
+    this.resizeObserver?.disconnect();
+    this.resizeObserver = null;
+    if (this.scrollHandler) {
+      window.removeEventListener("scroll", this.scrollHandler);
+      window.removeEventListener("resize", this.scrollHandler);
+      this.scrollHandler = null;
+    }
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      this.updateTriggerAria();
+      const content = this.querySelector("ds-popover-content");
+      if (this.open) {
+        content?.removeAttribute("hidden");
+        if (content) {
+          content.dataState = "open";
+        }
+        await this.updateComplete;
+        this.setupPositioning();
+        this.setupDismissLayer();
+      } else {
+        content?.setAttribute("hidden", "");
+      }
+    }
+    if (this.open && (changedProperties.has("placement") || changedProperties.has("offset"))) {
+      this.cleanup();
+      this.setupPositioning();
+      this.setupDismissLayer();
+    }
+  }
+  render() {
+    return html6`
+      <slot name="trigger"></slot>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property4({ type: Boolean, reflect: true })
+], DsPopover.prototype, "open", 2);
+__decorateClass([
+  property4({ type: String, reflect: true })
+], DsPopover.prototype, "placement", 2);
+__decorateClass([
+  property4({ type: Number })
+], DsPopover.prototype, "offset", 2);
+__decorateClass([
+  property4({ type: Boolean })
+], DsPopover.prototype, "flip", 2);
+__decorateClass([
+  property4({
+    attribute: "close-on-escape",
+    converter: {
+      fromAttribute: (value) => value !== "false",
+      toAttribute: (value) => value ? "" : "false"
+    }
+  })
+], DsPopover.prototype, "closeOnEscape", 2);
+__decorateClass([
+  property4({
+    attribute: "close-on-outside-click",
+    converter: {
+      fromAttribute: (value) => value !== "false",
+      toAttribute: (value) => value ? "" : "false"
+    }
+  })
+], DsPopover.prototype, "closeOnOutsideClick", 2);
+__decorateClass([
+  property4({ type: Boolean })
+], DsPopover.prototype, "animated", 2);
+define("ds-popover", DsPopover);
+
+// src/components/tooltip/tooltip-content.ts
+import { html as html7 } from "lit";
+import { property as property5 } from "lit/decorators.js";
+var DsTooltipContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.id = "";
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `tooltip-content-${crypto.randomUUID().slice(0, 8)}`;
+    }
+    this.setAttribute("role", "tooltip");
+    this.setAttribute("hidden", "");
+  }
+  render() {
+    return html7`
+      <div class="ds-tooltip-content" part="container">
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+__decorateClass([
+  property5({ type: String, reflect: true })
+], DsTooltipContent.prototype, "id", 2);
+__decorateClass([
+  property5({ type: String, reflect: true, attribute: "data-state" })
+], DsTooltipContent.prototype, "dataState", 2);
+define("ds-tooltip-content", DsTooltipContent);
+
+// src/components/tooltip/tooltip.ts
+import {
+  createAnchorPosition as createAnchorPosition2,
+  createPresence as createPresence3,
+  prefersReducedMotion as prefersReducedMotion3
+} from "@hypoth-ui/primitives-dom";
+import { html as html8 } from "lit";
+import { property as property6 } from "lit/decorators.js";
+var DsTooltip = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.placement = "top";
+    this.offset = 8;
+    this.showDelay = 400;
+    this.hideDelay = 100;
+    this.animated = true;
+    this.anchorPosition = null;
+    this.presence = null;
+    this.showTimeout = null;
+    this.hideTimeout = null;
+    this.escapeHandler = null;
+    this.handleTriggerMouseEnter = () => {
+      this.scheduleShow();
+    };
+    this.handleTriggerMouseLeave = () => {
+      this.scheduleHide();
+    };
+    this.handleTriggerFocusIn = () => {
+      this.scheduleShow();
+    };
+    this.handleTriggerFocusOut = () => {
+      this.scheduleHide();
+    };
+    this.handleContentMouseEnter = () => {
+      this.clearTimeouts();
+    };
+    this.handleContentMouseLeave = () => {
+      this.scheduleHide();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.updateComplete.then(() => {
+      this.setupTriggerListeners();
+      this.setupContentListeners();
+      this.setupTriggerAccessibility();
+      this.setupEscapeHandler();
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.cleanup();
+    this.removeEscapeHandler();
+  }
+  /**
+   * Shows the tooltip immediately.
+   */
+  show() {
+    this.clearTimeouts();
+    if (this.open) return;
+    this.open = true;
+  }
+  /**
+   * Hides the tooltip immediately.
+   */
+  hide() {
+    this.clearTimeouts();
+    if (!this.open) return;
+    this.cleanup();
+    this.open = false;
+  }
+  clearTimeouts() {
+    if (this.showTimeout) {
+      clearTimeout(this.showTimeout);
+      this.showTimeout = null;
+    }
+    if (this.hideTimeout) {
+      clearTimeout(this.hideTimeout);
+      this.hideTimeout = null;
+    }
+  }
+  scheduleShow() {
+    this.clearTimeouts();
+    if (this.open) return;
+    this.showTimeout = setTimeout(() => {
+      this.open = true;
+      this.showTimeout = null;
+    }, this.showDelay);
+  }
+  scheduleHide() {
+    this.clearTimeouts();
+    if (!this.open) return;
+    this.hideTimeout = setTimeout(() => {
+      const content = this.querySelector("ds-tooltip-content");
+      if (this.animated && content && !prefersReducedMotion3()) {
+        this.presence = createPresence3({
+          onExitComplete: () => {
+            this.cleanup();
+            this.open = false;
+          }
+        });
+        this.presence.hide(content);
+      } else {
+        this.cleanup();
+        this.open = false;
+      }
+      this.hideTimeout = null;
+    }, this.hideDelay);
+  }
+  setupTriggerListeners() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (!trigger) return;
+    trigger.addEventListener("mouseenter", this.handleTriggerMouseEnter);
+    trigger.addEventListener("mouseleave", this.handleTriggerMouseLeave);
+    trigger.addEventListener("focusin", this.handleTriggerFocusIn);
+    trigger.addEventListener("focusout", this.handleTriggerFocusOut);
+  }
+  setupContentListeners() {
+    const content = this.querySelector("ds-tooltip-content");
+    if (!content) return;
+    content.addEventListener("mouseenter", this.handleContentMouseEnter);
+    content.addEventListener("mouseleave", this.handleContentMouseLeave);
+  }
+  setupTriggerAccessibility() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-tooltip-content");
+    if (trigger && content) {
+      trigger.setAttribute("aria-describedby", content.id);
+    }
+  }
+  setupEscapeHandler() {
+    this.escapeHandler = (event) => {
+      if (event.key === "Escape" && this.open) {
+        event.preventDefault();
+        this.hide();
+      }
+    };
+    document.addEventListener("keydown", this.escapeHandler);
+  }
+  removeEscapeHandler() {
+    if (this.escapeHandler) {
+      document.removeEventListener("keydown", this.escapeHandler);
+      this.escapeHandler = null;
+    }
+  }
+  setupPositioning() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-tooltip-content");
+    if (!trigger || !content) return;
+    this.anchorPosition = createAnchorPosition2({
+      anchor: trigger,
+      floating: content,
+      placement: this.placement,
+      offset: this.offset,
+      flip: true,
+      onPositionChange: (pos) => {
+        content.setAttribute("data-placement", pos.placement);
+      }
+    });
+  }
+  cleanup() {
+    this.clearTimeouts();
+    this.anchorPosition?.destroy();
+    this.anchorPosition = null;
+    this.presence?.destroy();
+    this.presence = null;
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      const content = this.querySelector("ds-tooltip-content");
+      if (this.open) {
+        content?.removeAttribute("hidden");
+        if (content) {
+          content.dataState = "open";
+        }
+        await this.updateComplete;
+        this.setupPositioning();
+      } else {
+        content?.setAttribute("hidden", "");
+      }
+    }
+  }
+  render() {
+    return html8`
+      <slot name="trigger"></slot>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property6({ type: Boolean, reflect: true })
+], DsTooltip.prototype, "open", 2);
+__decorateClass([
+  property6({ type: String, reflect: true })
+], DsTooltip.prototype, "placement", 2);
+__decorateClass([
+  property6({ type: Number })
+], DsTooltip.prototype, "offset", 2);
+__decorateClass([
+  property6({ type: Number, attribute: "show-delay" })
+], DsTooltip.prototype, "showDelay", 2);
+__decorateClass([
+  property6({ type: Number, attribute: "hide-delay" })
+], DsTooltip.prototype, "hideDelay", 2);
+__decorateClass([
+  property6({ type: Boolean })
+], DsTooltip.prototype, "animated", 2);
+define("ds-tooltip", DsTooltip);
+
+// src/components/menu/menu-content.ts
+import { html as html9 } from "lit";
+import { property as property7 } from "lit/decorators.js";
+var DsMenuContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.id = "";
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `menu-content-${crypto.randomUUID().slice(0, 8)}`;
+    }
+    this.setAttribute("role", "menu");
+    this.setAttribute("hidden", "");
+  }
+  render() {
+    return html9`
+      <div class="ds-menu-content" part="container">
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+__decorateClass([
+  property7({ type: String, reflect: true })
+], DsMenuContent.prototype, "id", 2);
+__decorateClass([
+  property7({ type: String, reflect: true, attribute: "data-state" })
+], DsMenuContent.prototype, "dataState", 2);
+define("ds-menu-content", DsMenuContent);
+
+// src/components/menu/menu-item.ts
+import { html as html10 } from "lit";
+import { property as property8 } from "lit/decorators.js";
+var DsMenuItem = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.disabled = false;
+    this.value = "";
+    this.handleClick = () => {
+      this.select();
+    };
+    this.handleKeyDown = (event) => {
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        this.select();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "menuitem");
+    this.tabIndex = -1;
+    this.updateAriaDisabled();
+    this.addEventListener("click", this.handleClick);
+    this.addEventListener("keydown", this.handleKeyDown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleClick);
+    this.removeEventListener("keydown", this.handleKeyDown);
+  }
+  updateAriaDisabled() {
+    if (this.disabled) {
+      this.setAttribute("aria-disabled", "true");
+    } else {
+      this.removeAttribute("aria-disabled");
+    }
+  }
+  /**
+   * Triggers selection of this item.
+   * Emits ds:select event and notifies parent menu to close.
+   */
+  select() {
+    if (this.disabled) return;
+    const value = this.value || this.textContent?.trim() || "";
+    emitEvent(this, "select", { detail: { value } });
+  }
+  updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("disabled")) {
+      this.updateAriaDisabled();
+    }
+  }
+  render() {
+    return html10`
+      <div class="ds-menu-item" part="container">
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+__decorateClass([
+  property8({ type: Boolean, reflect: true })
+], DsMenuItem.prototype, "disabled", 2);
+__decorateClass([
+  property8({ type: String })
+], DsMenuItem.prototype, "value", 2);
+define("ds-menu-item", DsMenuItem);
+
+// src/components/menu/menu.ts
+import {
+  createAnchorPosition as createAnchorPosition3,
+  createDismissableLayer as createDismissableLayer2,
+  createPresence as createPresence4,
+  createRovingFocus,
+  createTypeAhead,
+  prefersReducedMotion as prefersReducedMotion4
+} from "@hypoth-ui/primitives-dom";
+import { html as html11 } from "lit";
+import { property as property9 } from "lit/decorators.js";
+var DsMenu = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.placement = "bottom-start";
+    this.offset = 8;
+    this.flip = true;
+    this.animated = true;
+    this.anchorPosition = null;
+    this.dismissLayer = null;
+    this.presence = null;
+    this.rovingFocus = null;
+    this.typeAhead = null;
+    this.triggerElement = null;
+    this.resizeObserver = null;
+    this.scrollHandler = null;
+    this.focusFirstOnOpen = null;
+    this.handleTriggerClick = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        event.preventDefault();
+        this.triggerElement = trigger;
+        this.focusFirstOnOpen = "first";
+        this.toggle();
+      }
+    };
+    this.handleTriggerKeyDown = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (!trigger || !this.contains(trigger)) return;
+      this.triggerElement = trigger;
+      switch (event.key) {
+        case "Enter":
+        case " ":
+          event.preventDefault();
+          this.focusFirstOnOpen = "first";
+          this.toggle();
+          break;
+        case "ArrowDown":
+          event.preventDefault();
+          this.focusFirstOnOpen = "first";
+          if (!this.open) this.show();
+          break;
+        case "ArrowUp":
+          event.preventDefault();
+          this.focusFirstOnOpen = "last";
+          if (!this.open) this.show();
+          break;
+      }
+    };
+    this.handleItemSelect = (_event) => {
+      this.close();
+    };
+    this.handleDismiss = () => {
+      this.close();
+    };
+    this.handleTypeAheadKeyDown = (event) => {
+      this.typeAhead?.handleKeyDown(event);
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleTriggerClick);
+    this.addEventListener("keydown", this.handleTriggerKeyDown);
+    this.addEventListener("ds:select", this.handleItemSelect);
+    this.updateComplete.then(() => {
+      this.setupTriggerAccessibility();
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleTriggerClick);
+    this.removeEventListener("keydown", this.handleTriggerKeyDown);
+    this.removeEventListener("ds:select", this.handleItemSelect);
+    this.cleanup();
+  }
+  /**
+   * Opens the menu.
+   */
+  show() {
+    if (this.open) return;
+    this.open = true;
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the menu.
+   */
+  close() {
+    if (!this.open) return;
+    const content = this.querySelector("ds-menu-content");
+    if (this.animated && content && !prefersReducedMotion4()) {
+      this.dismissLayer?.deactivate();
+      this.dismissLayer = null;
+      this.presence = createPresence4({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.cleanup();
+      this.open = false;
+      emitEvent(this, StandardEvents.CLOSE);
+      this.triggerElement?.focus();
+    }
+  }
+  /**
+   * Completes the close after exit animation.
+   */
+  completeClose() {
+    this.cleanup();
+    this.open = false;
+    emitEvent(this, StandardEvents.CLOSE);
+    this.triggerElement?.focus();
+  }
+  /**
+   * Toggles the menu open/closed state.
+   */
+  toggle() {
+    if (this.open) {
+      this.close();
+    } else {
+      this.show();
+    }
+  }
+  setupTriggerAccessibility() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-menu-content");
+    if (trigger && content) {
+      this.triggerElement = trigger;
+      trigger.setAttribute("aria-haspopup", "menu");
+      trigger.setAttribute("aria-expanded", String(this.open));
+      trigger.setAttribute("aria-controls", content.id);
+    }
+  }
+  updateTriggerAria() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      trigger.setAttribute("aria-expanded", String(this.open));
+    }
+  }
+  setupPositioning() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-menu-content");
+    if (!trigger || !content) return;
+    this.anchorPosition = createAnchorPosition3({
+      anchor: trigger,
+      floating: content,
+      placement: this.placement,
+      offset: this.offset,
+      flip: this.flip,
+      onPositionChange: (pos) => {
+        content.setAttribute("data-placement", pos.placement);
+      }
+    });
+    this.resizeObserver = new ResizeObserver(() => {
+      this.anchorPosition?.update();
+    });
+    this.resizeObserver.observe(trigger);
+    this.resizeObserver.observe(content);
+    this.scrollHandler = () => {
+      this.anchorPosition?.update();
+    };
+    window.addEventListener("scroll", this.scrollHandler, { passive: true });
+    window.addEventListener("resize", this.scrollHandler, { passive: true });
+  }
+  setupDismissLayer() {
+    const content = this.querySelector("ds-menu-content");
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (!content) return;
+    this.dismissLayer = createDismissableLayer2({
+      container: content,
+      excludeElements: trigger ? [trigger] : [],
+      onDismiss: this.handleDismiss,
+      closeOnEscape: true,
+      closeOnOutsideClick: true
+    });
+    this.dismissLayer.activate();
+  }
+  setupRovingFocus() {
+    const content = this.querySelector("ds-menu-content");
+    if (!content) return;
+    this.rovingFocus = createRovingFocus({
+      container: content,
+      selector: "ds-menu-item:not([disabled])",
+      direction: "vertical",
+      loop: true,
+      skipDisabled: true
+    });
+  }
+  setupTypeAhead() {
+    const content = this.querySelector("ds-menu-content");
+    if (!content) return;
+    this.typeAhead = createTypeAhead({
+      items: () => Array.from(content.querySelectorAll("ds-menu-item:not([disabled])")),
+      getText: (item) => item.textContent?.trim() || "",
+      onMatch: (_item, index) => {
+        this.rovingFocus?.setFocusedIndex(index);
+      }
+    });
+    content.addEventListener("keydown", this.handleTypeAheadKeyDown);
+  }
+  focusInitialItem() {
+    const content = this.querySelector("ds-menu-content");
+    if (!content) return;
+    const items = content.querySelectorAll("ds-menu-item:not([disabled])");
+    if (items.length === 0) return;
+    if (this.focusFirstOnOpen === "last") {
+      const lastIndex = items.length - 1;
+      this.rovingFocus?.setFocusedIndex(lastIndex);
+    } else {
+      this.rovingFocus?.setFocusedIndex(0);
+    }
+    this.focusFirstOnOpen = null;
+  }
+  cleanup() {
+    const content = this.querySelector("ds-menu-content");
+    if (content) {
+      content.removeEventListener("keydown", this.handleTypeAheadKeyDown);
+    }
+    this.anchorPosition?.destroy();
+    this.anchorPosition = null;
+    this.dismissLayer?.deactivate();
+    this.dismissLayer = null;
+    this.presence?.destroy();
+    this.presence = null;
+    this.rovingFocus?.destroy();
+    this.rovingFocus = null;
+    this.typeAhead?.reset();
+    this.typeAhead = null;
+    this.resizeObserver?.disconnect();
+    this.resizeObserver = null;
+    if (this.scrollHandler) {
+      window.removeEventListener("scroll", this.scrollHandler);
+      window.removeEventListener("resize", this.scrollHandler);
+      this.scrollHandler = null;
+    }
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      this.updateTriggerAria();
+      const content = this.querySelector("ds-menu-content");
+      if (this.open) {
+        content?.removeAttribute("hidden");
+        if (content) {
+          content.dataState = "open";
+        }
+        await this.updateComplete;
+        this.setupPositioning();
+        this.setupDismissLayer();
+        this.setupRovingFocus();
+        this.setupTypeAhead();
+        this.focusInitialItem();
+      } else {
+        content?.setAttribute("hidden", "");
+      }
+    }
+    if (this.open && (changedProperties.has("placement") || changedProperties.has("offset"))) {
+      this.cleanup();
+      this.setupPositioning();
+      this.setupDismissLayer();
+      this.setupRovingFocus();
+      this.setupTypeAhead();
+    }
+  }
+  render() {
+    return html11`
+      <slot name="trigger"></slot>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property9({ type: Boolean, reflect: true })
+], DsMenu.prototype, "open", 2);
+__decorateClass([
+  property9({ type: String, reflect: true })
+], DsMenu.prototype, "placement", 2);
+__decorateClass([
+  property9({ type: Number })
+], DsMenu.prototype, "offset", 2);
+__decorateClass([
+  property9({ type: Boolean })
+], DsMenu.prototype, "flip", 2);
+__decorateClass([
+  property9({ type: Boolean })
+], DsMenu.prototype, "animated", 2);
+define("ds-menu", DsMenu);
+
+// src/components/alert-dialog/alert-dialog-content.ts
+import { html as html12 } from "lit";
+import { property as property10 } from "lit/decorators.js";
+var DsAlertDialogContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.size = "md";
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  render() {
+    return html12`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property10({ reflect: true })
+], DsAlertDialogContent.prototype, "size", 2);
+__decorateClass([
+  property10({ attribute: "data-state", reflect: true })
+], DsAlertDialogContent.prototype, "dataState", 2);
+define("ds-alert-dialog-content", DsAlertDialogContent);
+
+// src/components/alert-dialog/alert-dialog-header.ts
+import { html as html13 } from "lit";
+var DsAlertDialogHeader = class extends DSElement {
+  render() {
+    return html13`<slot></slot>`;
+  }
+};
+define("ds-alert-dialog-header", DsAlertDialogHeader);
+
+// src/components/alert-dialog/alert-dialog-footer.ts
+import { html as html14 } from "lit";
+var DsAlertDialogFooter = class extends DSElement {
+  render() {
+    return html14`<slot></slot>`;
+  }
+};
+define("ds-alert-dialog-footer", DsAlertDialogFooter);
+
+// src/components/alert-dialog/alert-dialog-title.ts
+import { html as html15 } from "lit";
+var DsAlertDialogTitle = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `alert-dialog-title-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    return html15`<slot></slot>`;
+  }
+};
+define("ds-alert-dialog-title", DsAlertDialogTitle);
+
+// src/components/alert-dialog/alert-dialog-description.ts
+import { html as html16 } from "lit";
+var DsAlertDialogDescription = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `alert-dialog-desc-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    return html16`<slot></slot>`;
+  }
+};
+define("ds-alert-dialog-description", DsAlertDialogDescription);
+
+// src/components/alert-dialog/alert-dialog-action.ts
+import { html as html17 } from "lit";
+var DsAlertDialogAction = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.handleClick = () => {
+      emitEvent(this, "ds:alert-dialog-action", { bubbles: true });
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleClick);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleClick);
+  }
+  render() {
+    return html17`<slot></slot>`;
+  }
+};
+define("ds-alert-dialog-action", DsAlertDialogAction);
+
+// src/components/alert-dialog/alert-dialog-cancel.ts
+import { html as html18 } from "lit";
+var DsAlertDialogCancel = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.handleClick = () => {
+      emitEvent(this, "ds:alert-dialog-cancel", { bubbles: true });
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleClick);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleClick);
+  }
+  render() {
+    return html18`<slot></slot>`;
+  }
+};
+define("ds-alert-dialog-cancel", DsAlertDialogCancel);
+
+// src/components/alert-dialog/alert-dialog.ts
+import {
+  createDialogBehavior as createDialogBehavior2,
+  createPresence as createPresence5,
+  prefersReducedMotion as prefersReducedMotion5
+} from "@hypoth-ui/primitives-dom";
+import { html as html19 } from "lit";
+import { property as property11, state as state4 } from "lit/decorators.js";
+var DsAlertDialog = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.animated = true;
+    this.isClosing = false;
+    this.dialogBehavior = null;
+    this.presence = null;
+    this.handleTriggerClick = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        this.dialogBehavior?.setTriggerElement(trigger);
+        this.show();
+      }
+    };
+    this.handleAction = () => {
+      this.close();
+    };
+    this.handleCancel = () => {
+      this.close();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleTriggerClick);
+    this.addEventListener("ds:alert-dialog-action", this.handleAction);
+    this.addEventListener("ds:alert-dialog-cancel", this.handleCancel);
+    this.initDialogBehavior();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleTriggerClick);
+    this.removeEventListener("ds:alert-dialog-action", this.handleAction);
+    this.removeEventListener("ds:alert-dialog-cancel", this.handleCancel);
+    this.cleanup();
+  }
+  /**
+   * Initializes the dialog behavior primitive.
+   * AlertDialog uses role="alertdialog" and disables dismiss on escape/outside click.
+   */
+  initDialogBehavior() {
+    this.dialogBehavior = createDialogBehavior2({
+      defaultOpen: this.open,
+      role: "alertdialog",
+      closeOnEscape: false,
+      // AlertDialog does NOT close on escape
+      closeOnOutsideClick: false,
+      // AlertDialog does NOT close on outside click
+      onOpenChange: () => {
+      }
+    });
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior.setTriggerElement(trigger);
+    }
+  }
+  /**
+   * Opens the alert dialog.
+   */
+  show() {
+    if (this.open) return;
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior?.setTriggerElement(trigger);
+    } else if (document.activeElement instanceof HTMLElement) {
+      this.dialogBehavior?.setTriggerElement(document.activeElement);
+    }
+    this.open = true;
+    this.dialogBehavior?.open();
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the alert dialog.
+   */
+  close() {
+    if (!this.open) return;
+    const content = this.querySelector("ds-alert-dialog-content");
+    this.dialogBehavior?.close();
+    if (this.animated && content && !prefersReducedMotion5()) {
+      this.isClosing = true;
+      this.presence = createPresence5({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      this.isClosing = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  /**
+   * Completes the close after exit animation.
+   */
+  completeClose() {
+    this.presence?.destroy();
+    this.presence = null;
+    this.open = false;
+    this.isClosing = false;
+    emitEvent(this, StandardEvents.CLOSE);
+  }
+  cleanup() {
+    this.dialogBehavior?.destroy();
+    this.dialogBehavior = null;
+    this.presence?.destroy();
+    this.presence = null;
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      const content = this.querySelector("ds-alert-dialog-content");
+      if (this.open) {
+        await this.updateComplete;
+        if (content) {
+          content.dataState = "open";
+        }
+        this.dialogBehavior?.setContentElement(content);
+        this.updateContentAccessibility();
+      } else {
+        this.dialogBehavior?.setContentElement(null);
+      }
+    }
+  }
+  /**
+   * Updates accessibility attributes on alert dialog content.
+   */
+  updateContentAccessibility() {
+    const content = this.querySelector("ds-alert-dialog-content");
+    if (!content || !this.dialogBehavior) return;
+    const contentProps = this.dialogBehavior.getContentProps();
+    content.setAttribute("role", "alertdialog");
+    content.setAttribute("aria-modal", contentProps["aria-modal"]);
+    if (!hasRequiredChild(this, "ds-alert-dialog-title") && !this.getAttribute("aria-label")) {
+      devWarn(Warnings.dialogMissingTitle("ds-alert-dialog"));
+    }
+    const title = this.querySelector("ds-alert-dialog-title");
+    if (title) {
+      const titleProps = this.dialogBehavior.getTitleProps();
+      if (!title.id) {
+        title.id = titleProps.id;
+      }
+      content.setAttribute("aria-labelledby", title.id);
+    }
+    const description = this.querySelector("ds-alert-dialog-description");
+    if (description) {
+      const descProps = this.dialogBehavior.getDescriptionProps();
+      if (!description.id) {
+        description.id = descProps.id;
+      }
+      content.setAttribute("aria-describedby", description.id);
+      this.dialogBehavior.setHasDescription(true);
+    } else {
+      if (title) {
+        devWarn(Warnings.dialogMissingDescription("ds-alert-dialog"));
+      }
+      this.dialogBehavior.setHasDescription(false);
+    }
+  }
+  render() {
+    return html19`
+      <slot name="trigger"></slot>
+      <div
+        class="ds-alert-dialog__backdrop"
+        ?hidden=${!this.open}
+        ?data-closing=${this.isClosing}
+      >
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+__decorateClass([
+  property11({ type: Boolean, reflect: true })
+], DsAlertDialog.prototype, "open", 2);
+__decorateClass([
+  property11({ type: Boolean })
+], DsAlertDialog.prototype, "animated", 2);
+__decorateClass([
+  state4()
+], DsAlertDialog.prototype, "isClosing", 2);
+define("ds-alert-dialog", DsAlertDialog);
+
+// src/components/alert-dialog/alert-dialog-trigger.ts
+import { html as html20 } from "lit";
+var DsAlertDialogTrigger = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.handleClick = () => {
+      const alertDialog = this.closest("ds-alert-dialog");
+      alertDialog?.show();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("slot", "trigger");
+    this.addEventListener("click", this.handleClick);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleClick);
+  }
+  render() {
+    return html20`<slot></slot>`;
+  }
+};
+define("ds-alert-dialog-trigger", DsAlertDialogTrigger);
+
+// src/components/sheet/sheet-content.ts
+import { html as html21 } from "lit";
+import { property as property12 } from "lit/decorators.js";
+var DsSheetContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.side = "right";
+    this.size = "md";
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  render() {
+    return html21`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property12({ reflect: true })
+], DsSheetContent.prototype, "side", 2);
+__decorateClass([
+  property12({ reflect: true })
+], DsSheetContent.prototype, "size", 2);
+__decorateClass([
+  property12({ attribute: "data-state", reflect: true })
+], DsSheetContent.prototype, "dataState", 2);
+define("ds-sheet-content", DsSheetContent);
+
+// src/components/sheet/sheet-overlay.ts
+import { html as html22 } from "lit";
+var DsSheetOverlay = class extends DSElement {
+  render() {
+    return html22``;
+  }
+};
+define("ds-sheet-overlay", DsSheetOverlay);
+
+// src/components/sheet/sheet-header.ts
+import { html as html23 } from "lit";
+var DsSheetHeader = class extends DSElement {
+  render() {
+    return html23`<slot></slot>`;
+  }
+};
+define("ds-sheet-header", DsSheetHeader);
+
+// src/components/sheet/sheet-footer.ts
+import { html as html24 } from "lit";
+var DsSheetFooter = class extends DSElement {
+  render() {
+    return html24`<slot></slot>`;
+  }
+};
+define("ds-sheet-footer", DsSheetFooter);
+
+// src/components/sheet/sheet-title.ts
+import { html as html25 } from "lit";
+var DsSheetTitle = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `sheet-title-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    return html25`<slot></slot>`;
+  }
+};
+define("ds-sheet-title", DsSheetTitle);
+
+// src/components/sheet/sheet-description.ts
+import { html as html26 } from "lit";
+var DsSheetDescription = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `sheet-desc-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    return html26`<slot></slot>`;
+  }
+};
+define("ds-sheet-description", DsSheetDescription);
+
+// src/components/sheet/sheet-close.ts
+import { html as html27 } from "lit";
+var DsSheetClose = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.handleClick = () => {
+      emitEvent(this, "ds:sheet-close", { bubbles: true });
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleClick);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleClick);
+  }
+  render() {
+    return html27`<slot></slot>`;
+  }
+};
+define("ds-sheet-close", DsSheetClose);
+
+// src/components/sheet/sheet.ts
+import {
+  createDialogBehavior as createDialogBehavior3,
+  createPresence as createPresence6,
+  prefersReducedMotion as prefersReducedMotion6
+} from "@hypoth-ui/primitives-dom";
+import { html as html28 } from "lit";
+import { property as property13, state as state5 } from "lit/decorators.js";
+var DsSheet = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.closeOnEscape = true;
+    this.closeOnOverlay = true;
+    this.animated = true;
+    this.isClosing = false;
+    this.dialogBehavior = null;
+    this.presence = null;
+    this.handleTriggerClick = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        this.dialogBehavior?.setTriggerElement(trigger);
+        this.show();
+      }
+    };
+    this.handleCloseRequest = () => {
+      this.close();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleTriggerClick);
+    this.addEventListener("ds:sheet-close", this.handleCloseRequest);
+    this.initDialogBehavior();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleTriggerClick);
+    this.removeEventListener("ds:sheet-close", this.handleCloseRequest);
+    this.cleanup();
+  }
+  /**
+   * Initializes the dialog behavior primitive.
+   */
+  initDialogBehavior() {
+    this.dialogBehavior = createDialogBehavior3({
+      defaultOpen: this.open,
+      role: "dialog",
+      closeOnEscape: this.closeOnEscape,
+      closeOnOutsideClick: this.closeOnOverlay,
+      onOpenChange: (open) => {
+        if (!open && this.open) {
+          this.handleBehaviorClose();
+        }
+      }
+    });
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior.setTriggerElement(trigger);
+    }
+  }
+  /**
+   * Handles close triggered by the behavior (escape/outside click).
+   */
+  handleBehaviorClose() {
+    const content = this.querySelector("ds-sheet-content");
+    if (this.animated && content && !prefersReducedMotion6()) {
+      this.isClosing = true;
+      this.presence = createPresence6({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      this.isClosing = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  /**
+   * Opens the sheet.
+   */
+  show() {
+    if (this.open) return;
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior?.setTriggerElement(trigger);
+    } else if (document.activeElement instanceof HTMLElement) {
+      this.dialogBehavior?.setTriggerElement(document.activeElement);
+    }
+    this.open = true;
+    this.dialogBehavior?.open();
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the sheet.
+   */
+  close() {
+    if (!this.open) return;
+    const content = this.querySelector("ds-sheet-content");
+    this.dialogBehavior?.close();
+    if (this.animated && content && !prefersReducedMotion6()) {
+      this.isClosing = true;
+      this.presence = createPresence6({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      this.isClosing = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  /**
+   * Completes the close after exit animation.
+   */
+  completeClose() {
+    this.presence?.destroy();
+    this.presence = null;
+    this.open = false;
+    this.isClosing = false;
+    emitEvent(this, StandardEvents.CLOSE);
+  }
+  cleanup() {
+    this.dialogBehavior?.destroy();
+    this.dialogBehavior = null;
+    this.presence?.destroy();
+    this.presence = null;
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      const content = this.querySelector("ds-sheet-content");
+      if (this.open) {
+        await this.updateComplete;
+        if (content) {
+          content.dataState = "open";
+        }
+        this.dialogBehavior?.setContentElement(content);
+        this.updateContentAccessibility();
+      } else {
+        this.dialogBehavior?.setContentElement(null);
+      }
+    }
+    if (changedProperties.has("closeOnEscape") || changedProperties.has("closeOnOverlay")) {
+      const wasOpen = this.dialogBehavior?.state.open;
+      this.dialogBehavior?.destroy();
+      this.initDialogBehavior();
+      if (wasOpen) {
+        this.dialogBehavior?.open();
+        const content = this.querySelector("ds-sheet-content");
+        this.dialogBehavior?.setContentElement(content);
+      }
+    }
+  }
+  /**
+   * Updates accessibility attributes on sheet content.
+   */
+  updateContentAccessibility() {
+    const content = this.querySelector("ds-sheet-content");
+    if (!content || !this.dialogBehavior) return;
+    const contentProps = this.dialogBehavior.getContentProps();
+    content.setAttribute("role", "dialog");
+    content.setAttribute("aria-modal", contentProps["aria-modal"]);
+    if (!hasRequiredChild(this, "ds-sheet-title") && !this.getAttribute("aria-label")) {
+      devWarn(Warnings.dialogMissingTitle("ds-sheet"));
+    }
+    const title = this.querySelector("ds-sheet-title");
+    if (title) {
+      const titleProps = this.dialogBehavior.getTitleProps();
+      if (!title.id) {
+        title.id = titleProps.id;
+      }
+      content.setAttribute("aria-labelledby", title.id);
+    }
+    const description = this.querySelector("ds-sheet-description");
+    if (description) {
+      const descProps = this.dialogBehavior.getDescriptionProps();
+      if (!description.id) {
+        description.id = descProps.id;
+      }
+      content.setAttribute("aria-describedby", description.id);
+      this.dialogBehavior.setHasDescription(true);
+    } else {
+      if (title) {
+        devWarn(Warnings.dialogMissingDescription("ds-sheet"));
+      }
+      this.dialogBehavior.setHasDescription(false);
+    }
+  }
+  render() {
+    return html28`
+      <slot name="trigger"></slot>
+      <ds-sheet-overlay
+        ?hidden=${!this.open}
+        ?data-closing=${this.isClosing}
+        @click=${this.closeOnOverlay ? this.handleCloseRequest : void 0}
+      ></ds-sheet-overlay>
+      <slot ?hidden=${!this.open}></slot>
+    `;
+  }
+};
+__decorateClass([
+  property13({ type: Boolean, reflect: true })
+], DsSheet.prototype, "open", 2);
+__decorateClass([
+  property13({ type: Boolean, attribute: "close-on-escape" })
+], DsSheet.prototype, "closeOnEscape", 2);
+__decorateClass([
+  property13({ type: Boolean, attribute: "close-on-overlay" })
+], DsSheet.prototype, "closeOnOverlay", 2);
+__decorateClass([
+  property13({ type: Boolean })
+], DsSheet.prototype, "animated", 2);
+__decorateClass([
+  state5()
+], DsSheet.prototype, "isClosing", 2);
+define("ds-sheet", DsSheet);
+
+// src/components/drawer/drawer-content.ts
+import { html as html29 } from "lit";
+import { property as property14, state as state6 } from "lit/decorators.js";
+var DsDrawerContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.side = "bottom";
+    this.dataState = "closed";
+    this.swipeDismiss = true;
+    this.swipeOffset = 0;
+    this.isDragging = false;
+    this.startY = 0;
+    this.startX = 0;
+    this.handleTouchStart = (event) => {
+      if (!this.swipeDismiss) return;
+      const touch = event.touches[0];
+      if (!touch) return;
+      this.startY = touch.clientY;
+      this.startX = touch.clientX;
+      this.isDragging = true;
+    };
+    this.handleTouchMove = (event) => {
+      if (!this.swipeDismiss || !this.isDragging) return;
+      const touch = event.touches[0];
+      if (!touch) return;
+      const deltaY = touch.clientY - this.startY;
+      const deltaX = touch.clientX - this.startX;
+      let offset = 0;
+      switch (this.side) {
+        case "bottom":
+          offset = Math.max(0, deltaY);
+          break;
+        case "top":
+          offset = Math.max(0, -deltaY);
+          break;
+        case "left":
+          offset = Math.max(0, -deltaX);
+          break;
+        case "right":
+          offset = Math.max(0, deltaX);
+          break;
+      }
+      if (offset > 0) {
+        event.preventDefault();
+        this.swipeOffset = offset;
+        this.updateSwipeTransform();
+      }
+    };
+    this.handleTouchEnd = () => {
+      if (!this.swipeDismiss || !this.isDragging) return;
+      this.isDragging = false;
+      const threshold = Math.min(100, this.offsetHeight * 0.3);
+      if (this.swipeOffset > threshold) {
+        emitEvent(this, "ds:drawer-close", { bubbles: true });
+      } else {
+        this.swipeOffset = 0;
+        this.style.transform = "";
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("touchstart", this.handleTouchStart, { passive: true });
+    this.addEventListener("touchmove", this.handleTouchMove, { passive: false });
+    this.addEventListener("touchend", this.handleTouchEnd, { passive: true });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("touchstart", this.handleTouchStart);
+    this.removeEventListener("touchmove", this.handleTouchMove);
+    this.removeEventListener("touchend", this.handleTouchEnd);
+  }
+  updateSwipeTransform() {
+    switch (this.side) {
+      case "bottom":
+        this.style.transform = `translateY(${this.swipeOffset}px)`;
+        break;
+      case "top":
+        this.style.transform = `translateY(-${this.swipeOffset}px)`;
+        break;
+      case "left":
+        this.style.transform = `translateX(-${this.swipeOffset}px)`;
+        break;
+      case "right":
+        this.style.transform = `translateX(${this.swipeOffset}px)`;
+        break;
+    }
+  }
+  render() {
+    return html29`
+      <div class="ds-drawer__handle"></div>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property14({ reflect: true })
+], DsDrawerContent.prototype, "side", 2);
+__decorateClass([
+  property14({ attribute: "data-state", reflect: true })
+], DsDrawerContent.prototype, "dataState", 2);
+__decorateClass([
+  property14({ type: Boolean, attribute: "swipe-dismiss" })
+], DsDrawerContent.prototype, "swipeDismiss", 2);
+__decorateClass([
+  state6()
+], DsDrawerContent.prototype, "swipeOffset", 2);
+__decorateClass([
+  state6()
+], DsDrawerContent.prototype, "isDragging", 2);
+define("ds-drawer-content", DsDrawerContent);
+
+// src/components/drawer/drawer-header.ts
+import { html as html30 } from "lit";
+var DsDrawerHeader = class extends DSElement {
+  render() {
+    return html30`<slot></slot>`;
+  }
+};
+define("ds-drawer-header", DsDrawerHeader);
+
+// src/components/drawer/drawer-footer.ts
+import { html as html31 } from "lit";
+var DsDrawerFooter = class extends DSElement {
+  render() {
+    return html31`<slot></slot>`;
+  }
+};
+define("ds-drawer-footer", DsDrawerFooter);
+
+// src/components/drawer/drawer-title.ts
+import { html as html32 } from "lit";
+var DsDrawerTitle = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `drawer-title-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    return html32`<slot></slot>`;
+  }
+};
+define("ds-drawer-title", DsDrawerTitle);
+
+// src/components/drawer/drawer-description.ts
+import { html as html33 } from "lit";
+var DsDrawerDescription = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `drawer-desc-${crypto.randomUUID().slice(0, 8)}`;
+    }
+  }
+  render() {
+    return html33`<slot></slot>`;
+  }
+};
+define("ds-drawer-description", DsDrawerDescription);
+
+// src/components/drawer/drawer.ts
+import {
+  createDialogBehavior as createDialogBehavior4,
+  createPresence as createPresence7,
+  prefersReducedMotion as prefersReducedMotion7
+} from "@hypoth-ui/primitives-dom";
+import { html as html34 } from "lit";
+import { property as property15, state as state7 } from "lit/decorators.js";
+var DsDrawer = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.side = "bottom";
+    this.swipeDismiss = true;
+    this.closeOnEscape = true;
+    this.closeOnOverlay = true;
+    this.animated = true;
+    this.isClosing = false;
+    this.dialogBehavior = null;
+    this.presence = null;
+    this.handleTriggerClick = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        this.dialogBehavior?.setTriggerElement(trigger);
+        this.show();
+      }
+    };
+    this.handleCloseRequest = () => {
+      this.close();
+    };
+    this.handleOverlayClick = () => {
+      if (this.closeOnOverlay) {
+        this.close();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleTriggerClick);
+    this.addEventListener("ds:drawer-close", this.handleCloseRequest);
+    this.initDialogBehavior();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleTriggerClick);
+    this.removeEventListener("ds:drawer-close", this.handleCloseRequest);
+    this.cleanup();
+  }
+  /**
+   * Initializes the dialog behavior primitive.
+   */
+  initDialogBehavior() {
+    this.dialogBehavior = createDialogBehavior4({
+      defaultOpen: this.open,
+      role: "dialog",
+      closeOnEscape: this.closeOnEscape,
+      closeOnOutsideClick: this.closeOnOverlay,
+      onOpenChange: (open) => {
+        if (!open && this.open) {
+          this.handleBehaviorClose();
+        }
+      }
+    });
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior.setTriggerElement(trigger);
+    }
+  }
+  /**
+   * Handles close triggered by the behavior (escape/outside click).
+   */
+  handleBehaviorClose() {
+    const content = this.querySelector("ds-drawer-content");
+    if (this.animated && content && !prefersReducedMotion7()) {
+      this.isClosing = true;
+      this.presence = createPresence7({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      this.isClosing = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  /**
+   * Opens the drawer.
+   */
+  show() {
+    if (this.open) return;
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.dialogBehavior?.setTriggerElement(trigger);
+    } else if (document.activeElement instanceof HTMLElement) {
+      this.dialogBehavior?.setTriggerElement(document.activeElement);
+    }
+    this.open = true;
+    this.dialogBehavior?.open();
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the drawer.
+   */
+  close() {
+    if (!this.open) return;
+    const content = this.querySelector("ds-drawer-content");
+    this.dialogBehavior?.close();
+    if (this.animated && content && !prefersReducedMotion7()) {
+      this.isClosing = true;
+      this.presence = createPresence7({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      this.isClosing = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  /**
+   * Completes the close after exit animation.
+   */
+  completeClose() {
+    this.presence?.destroy();
+    this.presence = null;
+    this.open = false;
+    this.isClosing = false;
+    emitEvent(this, StandardEvents.CLOSE);
+  }
+  cleanup() {
+    this.dialogBehavior?.destroy();
+    this.dialogBehavior = null;
+    this.presence?.destroy();
+    this.presence = null;
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      const content = this.querySelector("ds-drawer-content");
+      if (this.open) {
+        await this.updateComplete;
+        if (content) {
+          content.dataState = "open";
+          content.side = this.side;
+        }
+        this.dialogBehavior?.setContentElement(content);
+        this.updateContentAccessibility();
+      } else {
+        this.dialogBehavior?.setContentElement(null);
+      }
+    }
+    if (changedProperties.has("closeOnEscape") || changedProperties.has("closeOnOverlay")) {
+      const wasOpen = this.dialogBehavior?.state.open;
+      this.dialogBehavior?.destroy();
+      this.initDialogBehavior();
+      if (wasOpen) {
+        this.dialogBehavior?.open();
+        const content = this.querySelector("ds-drawer-content");
+        this.dialogBehavior?.setContentElement(content);
+      }
+    }
+  }
+  /**
+   * Updates accessibility attributes on drawer content.
+   */
+  updateContentAccessibility() {
+    const content = this.querySelector("ds-drawer-content");
+    if (!content || !this.dialogBehavior) return;
+    const contentProps = this.dialogBehavior.getContentProps();
+    content.setAttribute("role", "dialog");
+    content.setAttribute("aria-modal", contentProps["aria-modal"]);
+    if (!hasRequiredChild(this, "ds-drawer-title") && !this.getAttribute("aria-label")) {
+      devWarn(Warnings.dialogMissingTitle("ds-drawer"));
+    }
+    const title = this.querySelector("ds-drawer-title");
+    if (title) {
+      const titleProps = this.dialogBehavior.getTitleProps();
+      if (!title.id) {
+        title.id = titleProps.id;
+      }
+      content.setAttribute("aria-labelledby", title.id);
+    }
+    const description = this.querySelector("ds-drawer-description");
+    if (description) {
+      const descProps = this.dialogBehavior.getDescriptionProps();
+      if (!description.id) {
+        description.id = descProps.id;
+      }
+      content.setAttribute("aria-describedby", description.id);
+      this.dialogBehavior.setHasDescription(true);
+    } else {
+      if (title) {
+        devWarn(Warnings.dialogMissingDescription("ds-drawer"));
+      }
+      this.dialogBehavior.setHasDescription(false);
+    }
+  }
+  render() {
+    return html34`
+      <slot name="trigger"></slot>
+      <div
+        class="ds-drawer__overlay"
+        ?hidden=${!this.open}
+        ?data-closing=${this.isClosing}
+        @click=${this.handleOverlayClick}
+      ></div>
+      <slot ?hidden=${!this.open}></slot>
+    `;
+  }
+};
+__decorateClass([
+  property15({ type: Boolean, reflect: true })
+], DsDrawer.prototype, "open", 2);
+__decorateClass([
+  property15({ reflect: true })
+], DsDrawer.prototype, "side", 2);
+__decorateClass([
+  property15({ type: Boolean, attribute: "swipe-dismiss" })
+], DsDrawer.prototype, "swipeDismiss", 2);
+__decorateClass([
+  property15({ type: Boolean, attribute: "close-on-escape" })
+], DsDrawer.prototype, "closeOnEscape", 2);
+__decorateClass([
+  property15({ type: Boolean, attribute: "close-on-overlay" })
+], DsDrawer.prototype, "closeOnOverlay", 2);
+__decorateClass([
+  property15({ type: Boolean })
+], DsDrawer.prototype, "animated", 2);
+__decorateClass([
+  state7()
+], DsDrawer.prototype, "isClosing", 2);
+define("ds-drawer", DsDrawer);
+
+// src/components/dropdown-menu/dropdown-menu-content.ts
+import { html as html35 } from "lit";
+import { property as property16 } from "lit/decorators.js";
+var DsDropdownMenuContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `dropdown-menu-content-${crypto.randomUUID().slice(0, 8)}`;
+    }
+    this.setAttribute("role", "menu");
+    this.setAttribute("hidden", "");
+  }
+  render() {
+    return html35`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property16({ attribute: "data-state", reflect: true })
+], DsDropdownMenuContent.prototype, "dataState", 2);
+define("ds-dropdown-menu-content", DsDropdownMenuContent);
+
+// src/components/dropdown-menu/dropdown-menu-item.ts
+import { html as html36 } from "lit";
+import { property as property17 } from "lit/decorators.js";
+var DsDropdownMenuItem = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.value = "";
+    this.variant = "default";
+    this.disabled = false;
+    this.handleSelect = () => {
+      if (this.disabled) return;
+      emitEvent(this, "ds:select", {
+        detail: { value: this.value },
+        bubbles: true
+      });
+    };
+    this.handleKeyDown = (event) => {
+      if (this.disabled) return;
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        this.handleSelect();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "menuitem");
+    this.setAttribute("tabindex", "-1");
+    this.addEventListener("click", this.handleSelect);
+    this.addEventListener("keydown", this.handleKeyDown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleSelect);
+    this.removeEventListener("keydown", this.handleKeyDown);
+  }
+  updated(changedProperties) {
+    if (changedProperties.has("disabled")) {
+      this.setAttribute("aria-disabled", String(this.disabled));
+    }
+  }
+  render() {
+    return html36`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property17()
+], DsDropdownMenuItem.prototype, "value", 2);
+__decorateClass([
+  property17({ reflect: true })
+], DsDropdownMenuItem.prototype, "variant", 2);
+__decorateClass([
+  property17({ type: Boolean, reflect: true })
+], DsDropdownMenuItem.prototype, "disabled", 2);
+define("ds-dropdown-menu-item", DsDropdownMenuItem);
+
+// src/components/dropdown-menu/dropdown-menu-separator.ts
+import { html as html37 } from "lit";
+var DsDropdownMenuSeparator = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "separator");
+  }
+  render() {
+    return html37``;
+  }
+};
+define("ds-dropdown-menu-separator", DsDropdownMenuSeparator);
+
+// src/components/dropdown-menu/dropdown-menu-label.ts
+import { html as html38 } from "lit";
+var DsDropdownMenuLabel = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("aria-hidden", "true");
+  }
+  render() {
+    return html38`<slot></slot>`;
+  }
+};
+define("ds-dropdown-menu-label", DsDropdownMenuLabel);
+
+// src/components/dropdown-menu/dropdown-menu-checkbox-item.ts
+import { html as html39 } from "lit";
+import { property as property18 } from "lit/decorators.js";
+var DsDropdownMenuCheckboxItem = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.checked = false;
+    this.disabled = false;
+    this.handleToggle = () => {
+      if (this.disabled) return;
+      this.checked = !this.checked;
+      this.updateAriaChecked();
+      emitEvent(this, "ds:select", {
+        detail: { checked: this.checked },
+        bubbles: true
+      });
+    };
+    this.handleKeyDown = (event) => {
+      if (this.disabled) return;
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        this.handleToggle();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "menuitemcheckbox");
+    this.setAttribute("tabindex", "-1");
+    this.updateAriaChecked();
+    this.addEventListener("click", this.handleToggle);
+    this.addEventListener("keydown", this.handleKeyDown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleToggle);
+    this.removeEventListener("keydown", this.handleKeyDown);
+  }
+  updateAriaChecked() {
+    this.setAttribute("aria-checked", String(this.checked));
+  }
+  updated(changedProperties) {
+    if (changedProperties.has("disabled")) {
+      this.setAttribute("aria-disabled", String(this.disabled));
+    }
+    if (changedProperties.has("checked")) {
+      this.updateAriaChecked();
+    }
+  }
+  render() {
+    return html39`
+      <span class="ds-dropdown-menu-checkbox-item__indicator" aria-hidden="true">
+        ${this.checked ? "\u2713" : ""}
+      </span>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property18({ type: Boolean, reflect: true })
+], DsDropdownMenuCheckboxItem.prototype, "checked", 2);
+__decorateClass([
+  property18({ type: Boolean, reflect: true })
+], DsDropdownMenuCheckboxItem.prototype, "disabled", 2);
+define("ds-dropdown-menu-checkbox-item", DsDropdownMenuCheckboxItem);
+
+// src/components/dropdown-menu/dropdown-menu-radio-group.ts
+import { html as html40 } from "lit";
+import { property as property19 } from "lit/decorators.js";
+var DsDropdownMenuRadioGroup = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.value = "";
+    this.handleRadioSelect = (event) => {
+      event.stopPropagation();
+      const newValue = event.detail.value;
+      if (newValue !== this.value) {
+        this.value = newValue;
+        this.updateRadioItems();
+        emitEvent(this, "ds:change", {
+          detail: { value: this.value },
+          bubbles: true
+        });
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "group");
+    this.addEventListener("ds:radio-select", this.handleRadioSelect);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("ds:radio-select", this.handleRadioSelect);
+  }
+  updateRadioItems() {
+    const items = this.querySelectorAll("ds-dropdown-menu-radio-item");
+    for (const item of items) {
+      const itemValue = item.getAttribute("value");
+      if (itemValue === this.value) {
+        item.setAttribute("checked", "");
+      } else {
+        item.removeAttribute("checked");
+      }
+    }
+  }
+  updated(changedProperties) {
+    if (changedProperties.has("value")) {
+      this.updateRadioItems();
+    }
+  }
+  render() {
+    return html40`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property19()
+], DsDropdownMenuRadioGroup.prototype, "value", 2);
+define("ds-dropdown-menu-radio-group", DsDropdownMenuRadioGroup);
+
+// src/components/dropdown-menu/dropdown-menu-radio-item.ts
+import { html as html41 } from "lit";
+import { property as property20 } from "lit/decorators.js";
+var DsDropdownMenuRadioItem = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.value = "";
+    this.checked = false;
+    this.disabled = false;
+    this.handleSelect = () => {
+      if (this.disabled || this.checked) return;
+      emitEvent(this, "ds:radio-select", {
+        detail: { value: this.value },
+        bubbles: true
+      });
+      emitEvent(this, "ds:select", {
+        detail: { value: this.value },
+        bubbles: true
+      });
+    };
+    this.handleKeyDown = (event) => {
+      if (this.disabled) return;
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        this.handleSelect();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "menuitemradio");
+    this.setAttribute("tabindex", "-1");
+    this.updateAriaChecked();
+    this.addEventListener("click", this.handleSelect);
+    this.addEventListener("keydown", this.handleKeyDown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleSelect);
+    this.removeEventListener("keydown", this.handleKeyDown);
+  }
+  updateAriaChecked() {
+    this.setAttribute("aria-checked", String(this.checked));
+  }
+  updated(changedProperties) {
+    if (changedProperties.has("disabled")) {
+      this.setAttribute("aria-disabled", String(this.disabled));
+    }
+    if (changedProperties.has("checked")) {
+      this.updateAriaChecked();
+    }
+  }
+  render() {
+    return html41`
+      <span class="ds-dropdown-menu-radio-item__indicator" aria-hidden="true">
+        ${this.checked ? "\u25CF" : "\u25CB"}
+      </span>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property20()
+], DsDropdownMenuRadioItem.prototype, "value", 2);
+__decorateClass([
+  property20({ type: Boolean, reflect: true })
+], DsDropdownMenuRadioItem.prototype, "checked", 2);
+__decorateClass([
+  property20({ type: Boolean, reflect: true })
+], DsDropdownMenuRadioItem.prototype, "disabled", 2);
+define("ds-dropdown-menu-radio-item", DsDropdownMenuRadioItem);
+
+// src/components/dropdown-menu/dropdown-menu.ts
+import {
+  createMenuBehavior,
+  createPresence as createPresence8,
+  prefersReducedMotion as prefersReducedMotion8
+} from "@hypoth-ui/primitives-dom";
+import { html as html42 } from "lit";
+import { property as property21 } from "lit/decorators.js";
+var DsDropdownMenu = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.placement = "bottom-start";
+    this.offset = 4;
+    this.flip = true;
+    this.animated = true;
+    this.modal = true;
+    this.menuBehavior = null;
+    this.presence = null;
+    this.focusFirstOnOpen = null;
+    this.handleTriggerClick = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        event.preventDefault();
+        this.menuBehavior?.setTriggerElement(trigger);
+        this.focusFirstOnOpen = "first";
+        this.toggle();
+      }
+    };
+    this.handleTriggerKeyDown = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (!trigger || !this.contains(trigger)) return;
+      this.menuBehavior?.setTriggerElement(trigger);
+      switch (event.key) {
+        case "Enter":
+        case " ":
+          event.preventDefault();
+          this.focusFirstOnOpen = "first";
+          this.toggle();
+          break;
+        case "ArrowDown":
+          event.preventDefault();
+          this.focusFirstOnOpen = "first";
+          if (!this.open) this.show();
+          break;
+        case "ArrowUp":
+          event.preventDefault();
+          this.focusFirstOnOpen = "last";
+          if (!this.open) this.show();
+          break;
+      }
+    };
+    this.handleItemSelect = () => {
+      this.close();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleTriggerClick);
+    this.addEventListener("keydown", this.handleTriggerKeyDown);
+    this.addEventListener("ds:select", this.handleItemSelect);
+    this.initMenuBehavior();
+    this.updateComplete.then(() => {
+      this.setupTriggerAccessibility();
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleTriggerClick);
+    this.removeEventListener("keydown", this.handleTriggerKeyDown);
+    this.removeEventListener("ds:select", this.handleItemSelect);
+    this.cleanup();
+  }
+  /**
+   * Initializes the menu behavior primitive.
+   */
+  initMenuBehavior() {
+    this.menuBehavior = createMenuBehavior({
+      defaultOpen: this.open,
+      placement: this.placement,
+      offset: this.offset,
+      flip: this.flip,
+      loop: true,
+      onOpenChange: (open) => {
+        if (!open && this.open) {
+          this.handleBehaviorClose();
+        }
+      },
+      onSelect: (value) => {
+        emitEvent(this, StandardEvents.SELECT, { detail: { value } });
+      }
+    });
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      this.menuBehavior.setTriggerElement(trigger);
+    }
+  }
+  /**
+   * Handles close triggered by the behavior (escape/outside click).
+   */
+  handleBehaviorClose() {
+    const content = this.querySelector("ds-dropdown-menu-content");
+    if (this.animated && content && !prefersReducedMotion8()) {
+      this.presence = createPresence8({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  /**
+   * Opens the menu.
+   */
+  show() {
+    if (this.open) return;
+    this.open = true;
+    this.menuBehavior?.open(this.focusFirstOnOpen ?? "first");
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the menu.
+   */
+  close() {
+    if (!this.open) return;
+    const content = this.querySelector("ds-dropdown-menu-content");
+    this.menuBehavior?.close();
+    if (this.animated && content && !prefersReducedMotion8()) {
+      this.presence = createPresence8({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  completeClose() {
+    this.presence?.destroy();
+    this.presence = null;
+    this.open = false;
+    emitEvent(this, StandardEvents.CLOSE);
+  }
+  toggle() {
+    if (this.open) {
+      this.close();
+    } else {
+      this.show();
+    }
+  }
+  setupTriggerAccessibility() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-dropdown-menu-content");
+    if (trigger && content && this.menuBehavior) {
+      this.menuBehavior.setTriggerElement(trigger);
+      const triggerProps = this.menuBehavior.getTriggerProps();
+      trigger.setAttribute("aria-haspopup", triggerProps["aria-haspopup"]);
+      trigger.setAttribute("aria-expanded", triggerProps["aria-expanded"]);
+      trigger.setAttribute("aria-controls", triggerProps["aria-controls"]);
+    }
+  }
+  updateTriggerAria() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger && this.menuBehavior) {
+      const triggerProps = this.menuBehavior.getTriggerProps();
+      trigger.setAttribute("aria-expanded", triggerProps["aria-expanded"]);
+    }
+  }
+  registerMenuItems() {
+    const content = this.querySelector("ds-dropdown-menu-content");
+    if (!content || !this.menuBehavior) return;
+    const items = content.querySelectorAll(
+      "ds-dropdown-menu-item:not([disabled]), ds-dropdown-menu-checkbox-item:not([disabled]), ds-dropdown-menu-radio-item:not([disabled])"
+    );
+    items.forEach((item) => {
+      this.menuBehavior?.registerItem(item);
+    });
+  }
+  cleanup() {
+    this.menuBehavior?.destroy();
+    this.menuBehavior = null;
+    this.presence?.destroy();
+    this.presence = null;
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      this.updateTriggerAria();
+      const content = this.querySelector(
+        "ds-dropdown-menu-content"
+      );
+      if (this.open) {
+        content?.removeAttribute("hidden");
+        if (content) {
+          content.dataState = "open";
+        }
+        await this.updateComplete;
+        this.registerMenuItems();
+        this.menuBehavior?.setContentElement(content);
+      } else {
+        content?.setAttribute("hidden", "");
+        this.menuBehavior?.setContentElement(null);
+      }
+    }
+    if (changedProperties.has("placement") || changedProperties.has("offset") || changedProperties.has("flip")) {
+      const wasOpen = this.menuBehavior?.state.open;
+      this.menuBehavior?.destroy();
+      this.initMenuBehavior();
+      if (wasOpen) {
+        this.menuBehavior?.open();
+        const content = this.querySelector("ds-dropdown-menu-content");
+        this.registerMenuItems();
+        this.menuBehavior?.setContentElement(content);
+      }
+    }
+  }
+  render() {
+    return html42`
+      <slot name="trigger"></slot>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property21({ type: Boolean, reflect: true })
+], DsDropdownMenu.prototype, "open", 2);
+__decorateClass([
+  property21({ type: String, reflect: true })
+], DsDropdownMenu.prototype, "placement", 2);
+__decorateClass([
+  property21({ type: Number })
+], DsDropdownMenu.prototype, "offset", 2);
+__decorateClass([
+  property21({ type: Boolean })
+], DsDropdownMenu.prototype, "flip", 2);
+__decorateClass([
+  property21({ type: Boolean })
+], DsDropdownMenu.prototype, "animated", 2);
+__decorateClass([
+  property21({ type: Boolean })
+], DsDropdownMenu.prototype, "modal", 2);
+define("ds-dropdown-menu", DsDropdownMenu);
+
+// src/components/context-menu/context-menu-content.ts
+import { html as html43 } from "lit";
+import { property as property22 } from "lit/decorators.js";
+var DsContextMenuContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `context-menu-content-${crypto.randomUUID().slice(0, 8)}`;
+    }
+    this.setAttribute("role", "menu");
+    this.setAttribute("hidden", "");
+  }
+  render() {
+    return html43`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property22({ attribute: "data-state", reflect: true })
+], DsContextMenuContent.prototype, "dataState", 2);
+define("ds-context-menu-content", DsContextMenuContent);
+
+// src/components/context-menu/context-menu-item.ts
+import { html as html44 } from "lit";
+import { property as property23 } from "lit/decorators.js";
+var DsContextMenuItem = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.value = "";
+    this.variant = "default";
+    this.disabled = false;
+    this.handleSelect = () => {
+      if (this.disabled) return;
+      emitEvent(this, "ds:select", {
+        detail: { value: this.value },
+        bubbles: true
+      });
+    };
+    this.handleKeyDown = (event) => {
+      if (this.disabled) return;
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        this.handleSelect();
+      }
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "menuitem");
+    this.setAttribute("tabindex", "-1");
+    this.addEventListener("click", this.handleSelect);
+    this.addEventListener("keydown", this.handleKeyDown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleSelect);
+    this.removeEventListener("keydown", this.handleKeyDown);
+  }
+  updated(changedProperties) {
+    if (changedProperties.has("disabled")) {
+      this.setAttribute("aria-disabled", String(this.disabled));
+    }
+  }
+  render() {
+    return html44`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property23()
+], DsContextMenuItem.prototype, "value", 2);
+__decorateClass([
+  property23({ reflect: true })
+], DsContextMenuItem.prototype, "variant", 2);
+__decorateClass([
+  property23({ type: Boolean, reflect: true })
+], DsContextMenuItem.prototype, "disabled", 2);
+define("ds-context-menu-item", DsContextMenuItem);
+
+// src/components/context-menu/context-menu-separator.ts
+import { html as html45 } from "lit";
+var DsContextMenuSeparator = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "separator");
+  }
+  render() {
+    return html45``;
+  }
+};
+define("ds-context-menu-separator", DsContextMenuSeparator);
+
+// src/components/context-menu/context-menu-label.ts
+import { html as html46 } from "lit";
+var DsContextMenuLabel = class extends DSElement {
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("aria-hidden", "true");
+  }
+  render() {
+    return html46`<slot></slot>`;
+  }
+};
+define("ds-context-menu-label", DsContextMenuLabel);
+
+// src/components/context-menu/context-menu.ts
+import {
+  createMenuBehavior as createMenuBehavior2,
+  createPresence as createPresence9,
+  prefersReducedMotion as prefersReducedMotion9
+} from "@hypoth-ui/primitives-dom";
+import { html as html47 } from "lit";
+import { property as property24, state as state8 } from "lit/decorators.js";
+var DsContextMenu = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.animated = true;
+    this.pointerX = 0;
+    this.pointerY = 0;
+    this.menuBehavior = null;
+    this.presence = null;
+    this.longPressTimer = null;
+    this.handleContextMenu = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        event.preventDefault();
+        this.show(event.clientX, event.clientY);
+      }
+    };
+    this.handleTouchStart = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        const touch = event.touches[0];
+        if (touch) {
+          this.longPressTimer = setTimeout(() => {
+            this.show(touch.clientX, touch.clientY);
+          }, 500);
+        }
+      }
+    };
+    this.handleTouchEnd = () => {
+      if (this.longPressTimer) {
+        clearTimeout(this.longPressTimer);
+        this.longPressTimer = null;
+      }
+    };
+    this.handleTouchMove = () => {
+      if (this.longPressTimer) {
+        clearTimeout(this.longPressTimer);
+        this.longPressTimer = null;
+      }
+    };
+    this.handleItemSelect = () => {
+      this.close();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("contextmenu", this.handleContextMenu);
+    this.addEventListener("touchstart", this.handleTouchStart, { passive: true });
+    this.addEventListener("touchend", this.handleTouchEnd, { passive: true });
+    this.addEventListener("touchmove", this.handleTouchMove, { passive: true });
+    this.addEventListener("ds:select", this.handleItemSelect);
+    this.initMenuBehavior();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("contextmenu", this.handleContextMenu);
+    this.removeEventListener("touchstart", this.handleTouchStart);
+    this.removeEventListener("touchend", this.handleTouchEnd);
+    this.removeEventListener("touchmove", this.handleTouchMove);
+    this.removeEventListener("ds:select", this.handleItemSelect);
+    this.cleanup();
+  }
+  /**
+   * Initializes the menu behavior primitive.
+   */
+  initMenuBehavior() {
+    this.menuBehavior = createMenuBehavior2({
+      defaultOpen: this.open,
+      loop: true,
+      onOpenChange: (open) => {
+        if (!open && this.open) {
+          this.handleBehaviorClose();
+        }
+      },
+      onSelect: (value) => {
+        emitEvent(this, StandardEvents.SELECT, { detail: { value } });
+      }
+    });
+  }
+  /**
+   * Handles close triggered by the behavior (escape/outside click).
+   */
+  handleBehaviorClose() {
+    const content = this.querySelector("ds-context-menu-content");
+    if (this.animated && content && !prefersReducedMotion9()) {
+      this.presence = createPresence9({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  /**
+   * Opens the menu at the specified position.
+   */
+  show(x, y) {
+    if (this.open) {
+      this.close();
+    }
+    this.pointerX = x;
+    this.pointerY = y;
+    this.open = true;
+    this.menuBehavior?.open("first");
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the menu.
+   */
+  close() {
+    if (!this.open) return;
+    const content = this.querySelector("ds-context-menu-content");
+    this.menuBehavior?.close();
+    if (this.animated && content && !prefersReducedMotion9()) {
+      this.presence = createPresence9({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.open = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  completeClose() {
+    this.presence?.destroy();
+    this.presence = null;
+    this.open = false;
+    emitEvent(this, StandardEvents.CLOSE);
+  }
+  positionContent() {
+    const content = this.querySelector("ds-context-menu-content");
+    if (!content) return;
+    let x = this.pointerX;
+    let y = this.pointerY;
+    const rect = content.getBoundingClientRect();
+    const viewportWidth = window.innerWidth;
+    const viewportHeight = window.innerHeight;
+    if (x + rect.width > viewportWidth) {
+      x = viewportWidth - rect.width - 8;
+    }
+    if (y + rect.height > viewportHeight) {
+      y = viewportHeight - rect.height - 8;
+    }
+    x = Math.max(8, x);
+    y = Math.max(8, y);
+    content.style.left = `${x}px`;
+    content.style.top = `${y}px`;
+  }
+  registerMenuItems() {
+    const content = this.querySelector("ds-context-menu-content");
+    if (!content || !this.menuBehavior) return;
+    const items = content.querySelectorAll("ds-context-menu-item:not([disabled])");
+    items.forEach((item) => {
+      this.menuBehavior?.registerItem(item);
+    });
+  }
+  cleanup() {
+    this.menuBehavior?.destroy();
+    this.menuBehavior = null;
+    this.presence?.destroy();
+    this.presence = null;
+    if (this.longPressTimer) {
+      clearTimeout(this.longPressTimer);
+      this.longPressTimer = null;
+    }
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      const content = this.querySelector("ds-context-menu-content");
+      if (this.open) {
+        content?.removeAttribute("hidden");
+        if (content) {
+          content.dataState = "open";
+        }
+        await this.updateComplete;
+        this.positionContent();
+        this.registerMenuItems();
+        this.menuBehavior?.setContentElement(content);
+      } else {
+        content?.setAttribute("hidden", "");
+        this.menuBehavior?.setContentElement(null);
+      }
+    }
+  }
+  render() {
+    return html47`
+      <slot name="trigger"></slot>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property24({ type: Boolean, reflect: true })
+], DsContextMenu.prototype, "open", 2);
+__decorateClass([
+  property24({ type: Boolean })
+], DsContextMenu.prototype, "animated", 2);
+__decorateClass([
+  state8()
+], DsContextMenu.prototype, "pointerX", 2);
+__decorateClass([
+  state8()
+], DsContextMenu.prototype, "pointerY", 2);
+define("ds-context-menu", DsContextMenu);
+
+// src/components/hover-card/hover-card-content.ts
+import { html as html48 } from "lit";
+import { property as property25 } from "lit/decorators.js";
+var DsHoverCardContent = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.id = "";
+    this.dataState = "closed";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.id) {
+      this.id = `hover-card-content-${crypto.randomUUID().slice(0, 8)}`;
+    }
+    this.setAttribute("hidden", "");
+  }
+  render() {
+    return html48`<slot></slot>`;
+  }
+};
+__decorateClass([
+  property25({ type: String, reflect: true })
+], DsHoverCardContent.prototype, "id", 2);
+__decorateClass([
+  property25({ type: String, reflect: true, attribute: "data-state" })
+], DsHoverCardContent.prototype, "dataState", 2);
+define("ds-hover-card-content", DsHoverCardContent);
+
+// src/components/hover-card/hover-card.ts
+import {
+  createAnchorPosition as createAnchorPosition4,
+  createDismissableLayer as createDismissableLayer3,
+  createPresence as createPresence10,
+  prefersReducedMotion as prefersReducedMotion10
+} from "@hypoth-ui/primitives-dom";
+import { html as html49 } from "lit";
+import { property as property26 } from "lit/decorators.js";
+var DsHoverCard = class extends DSElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.placement = "bottom";
+    this.offset = 8;
+    this.flip = true;
+    this.openDelay = 700;
+    this.closeDelay = 300;
+    this.animated = true;
+    this.anchorPosition = null;
+    this.dismissLayer = null;
+    this.presence = null;
+    this.resizeObserver = null;
+    this.scrollHandler = null;
+    this.openTimer = null;
+    this.closeTimer = null;
+    this.isHoveringTrigger = false;
+    this.isHoveringContent = false;
+    this.handleTriggerMouseEnter = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      const content = target.closest("ds-hover-card-content");
+      if (trigger && this.contains(trigger)) {
+        this.isHoveringTrigger = true;
+        this.scheduleOpen();
+      } else if (content && this.contains(content)) {
+        this.isHoveringContent = true;
+        this.cancelClose();
+      }
+    };
+    this.handleTriggerMouseLeave = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      const content = target.closest("ds-hover-card-content");
+      if (trigger && this.contains(trigger)) {
+        this.isHoveringTrigger = false;
+        this.scheduleClose();
+      } else if (content && this.contains(content)) {
+        this.isHoveringContent = false;
+        this.scheduleClose();
+      }
+    };
+    this.handleFocusIn = (event) => {
+      const target = event.target;
+      const trigger = target.closest('[slot="trigger"]');
+      if (trigger && this.contains(trigger)) {
+        this.clearTimers();
+        this.show();
+      }
+    };
+    this.handleFocusOut = (event) => {
+      const relatedTarget = event.relatedTarget;
+      if (relatedTarget && this.contains(relatedTarget)) {
+        return;
+      }
+      this.scheduleClose();
+    };
+    this.handleDismiss = () => {
+      this.close();
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("mouseenter", this.handleTriggerMouseEnter, true);
+    this.addEventListener("mouseleave", this.handleTriggerMouseLeave, true);
+    this.addEventListener("focusin", this.handleFocusIn);
+    this.addEventListener("focusout", this.handleFocusOut);
+    this.updateComplete.then(() => {
+      this.setupTriggerAccessibility();
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("mouseenter", this.handleTriggerMouseEnter, true);
+    this.removeEventListener("mouseleave", this.handleTriggerMouseLeave, true);
+    this.removeEventListener("focusin", this.handleFocusIn);
+    this.removeEventListener("focusout", this.handleFocusOut);
+    this.clearTimers();
+    this.cleanup();
+  }
+  /**
+   * Opens the hover card.
+   */
+  show() {
+    if (this.open) return;
+    this.clearTimers();
+    this.open = true;
+    emitEvent(this, StandardEvents.OPEN);
+  }
+  /**
+   * Closes the hover card.
+   */
+  close() {
+    if (!this.open) return;
+    this.clearTimers();
+    const content = this.querySelector("ds-hover-card-content");
+    if (this.animated && content && !prefersReducedMotion10()) {
+      this.dismissLayer?.deactivate();
+      this.dismissLayer = null;
+      this.presence = createPresence10({
+        onExitComplete: () => {
+          this.completeClose();
+        }
+      });
+      this.presence.hide(content);
+    } else {
+      this.cleanup();
+      this.open = false;
+      emitEvent(this, StandardEvents.CLOSE);
+    }
+  }
+  completeClose() {
+    this.cleanup();
+    this.open = false;
+    emitEvent(this, StandardEvents.CLOSE);
+  }
+  clearTimers() {
+    if (this.openTimer) {
+      clearTimeout(this.openTimer);
+      this.openTimer = null;
+    }
+    if (this.closeTimer) {
+      clearTimeout(this.closeTimer);
+      this.closeTimer = null;
+    }
+  }
+  scheduleOpen() {
+    this.cancelClose();
+    if (this.open) return;
+    this.openTimer = setTimeout(() => {
+      this.show();
+    }, this.openDelay);
+  }
+  scheduleClose() {
+    this.cancelOpen();
+    if (this.isHoveringTrigger || this.isHoveringContent) {
+      return;
+    }
+    if (!this.open) return;
+    this.closeTimer = setTimeout(() => {
+      this.close();
+    }, this.closeDelay);
+  }
+  cancelOpen() {
+    if (this.openTimer) {
+      clearTimeout(this.openTimer);
+      this.openTimer = null;
+    }
+  }
+  cancelClose() {
+    if (this.closeTimer) {
+      clearTimeout(this.closeTimer);
+      this.closeTimer = null;
+    }
+  }
+  setupTriggerAccessibility() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-hover-card-content");
+    if (trigger && content) {
+      trigger.setAttribute("aria-haspopup", "true");
+      trigger.setAttribute("aria-expanded", String(this.open));
+      if (content.id) {
+        trigger.setAttribute("aria-controls", content.id);
+      }
+    }
+  }
+  updateTriggerAria() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (trigger) {
+      trigger.setAttribute("aria-expanded", String(this.open));
+    }
+  }
+  setupPositioning() {
+    const trigger = this.querySelector('[slot="trigger"]');
+    const content = this.querySelector("ds-hover-card-content");
+    if (!trigger || !content) return;
+    this.anchorPosition = createAnchorPosition4({
+      anchor: trigger,
+      floating: content,
+      placement: this.placement,
+      offset: this.offset,
+      flip: this.flip,
+      onPositionChange: (pos) => {
+        content.setAttribute("data-placement", pos.placement);
+      }
+    });
+    this.resizeObserver = new ResizeObserver(() => {
+      this.anchorPosition?.update();
+    });
+    this.resizeObserver.observe(trigger);
+    this.resizeObserver.observe(content);
+    this.scrollHandler = () => {
+      this.anchorPosition?.update();
+    };
+    window.addEventListener("scroll", this.scrollHandler, { passive: true });
+    window.addEventListener("resize", this.scrollHandler, { passive: true });
+  }
+  setupDismissLayer() {
+    const content = this.querySelector("ds-hover-card-content");
+    const trigger = this.querySelector('[slot="trigger"]');
+    if (!content) return;
+    this.dismissLayer = createDismissableLayer3({
+      container: content,
+      excludeElements: trigger ? [trigger] : [],
+      onDismiss: this.handleDismiss,
+      closeOnEscape: true,
+      closeOnOutsideClick: false
+      // Non-modal, only close on escape
+    });
+    this.dismissLayer.activate();
+  }
+  cleanup() {
+    this.anchorPosition?.destroy();
+    this.anchorPosition = null;
+    this.dismissLayer?.deactivate();
+    this.dismissLayer = null;
+    this.presence?.destroy();
+    this.presence = null;
+    this.resizeObserver?.disconnect();
+    this.resizeObserver = null;
+    if (this.scrollHandler) {
+      window.removeEventListener("scroll", this.scrollHandler);
+      window.removeEventListener("resize", this.scrollHandler);
+      this.scrollHandler = null;
+    }
+  }
+  async updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("open")) {
+      this.updateTriggerAria();
+      const content = this.querySelector("ds-hover-card-content");
+      if (this.open) {
+        content?.removeAttribute("hidden");
+        if (content) {
+          content.dataState = "open";
+        }
+        await this.updateComplete;
+        this.setupPositioning();
+        this.setupDismissLayer();
+      } else {
+        content?.setAttribute("hidden", "");
+      }
+    }
+  }
+  render() {
+    return html49`
+      <slot name="trigger"></slot>
+      <slot></slot>
+    `;
+  }
+};
+__decorateClass([
+  property26({ type: Boolean, reflect: true })
+], DsHoverCard.prototype, "open", 2);
+__decorateClass([
+  property26({ type: String, reflect: true })
+], DsHoverCard.prototype, "placement", 2);
+__decorateClass([
+  property26({ type: Number })
+], DsHoverCard.prototype, "offset", 2);
+__decorateClass([
+  property26({ type: Boolean })
+], DsHoverCard.prototype, "flip", 2);
+__decorateClass([
+  property26({ type: Number, attribute: "open-delay" })
+], DsHoverCard.prototype, "openDelay", 2);
+__decorateClass([
+  property26({ type: Number, attribute: "close-delay" })
+], DsHoverCard.prototype, "closeDelay", 2);
+__decorateClass([
+  property26({ type: Boolean })
+], DsHoverCard.prototype, "animated", 2);
+define("ds-hover-card", DsHoverCard);
+
+export {
+  DsDialogContent,
+  DsDialogTitle,
+  DsDialogDescription,
+  DsDialog,
+  DsPopoverContent,
+  DsPopover,
+  DsTooltipContent,
+  DsTooltip,
+  DsMenuContent,
+  DsMenuItem,
+  DsMenu,
+  DsAlertDialogContent,
+  DsAlertDialogHeader,
+  DsAlertDialogFooter,
+  DsAlertDialogTitle,
+  DsAlertDialogDescription,
+  DsAlertDialogAction,
+  DsAlertDialogCancel,
+  DsAlertDialog,
+  DsAlertDialogTrigger,
+  DsSheetContent,
+  DsSheetOverlay,
+  DsSheetHeader,
+  DsSheetFooter,
+  DsSheetTitle,
+  DsSheetDescription,
+  DsSheetClose,
+  DsSheet,
+  DsDrawerContent,
+  DsDrawerHeader,
+  DsDrawerFooter,
+  DsDrawerTitle,
+  DsDrawerDescription,
+  DsDrawer,
+  DsDropdownMenuContent,
+  DsDropdownMenuItem,
+  DsDropdownMenuSeparator,
+  DsDropdownMenuLabel,
+  DsDropdownMenuCheckboxItem,
+  DsDropdownMenuRadioGroup,
+  DsDropdownMenuRadioItem,
+  DsDropdownMenu,
+  DsContextMenuContent,
+  DsContextMenuItem,
+  DsContextMenuSeparator,
+  DsContextMenuLabel,
+  DsContextMenu,
+  DsHoverCardContent,
+  DsHoverCard
+};
+//# sourceMappingURL=chunk-55ID7LJL.js.map