dap-design-system 0.62.4 → 0.63.1

package/dist/components/modal/modal-base-element.js

@@ -1,21 +1,15 @@
 import { clsx as u } from "../../node_modules/clsx/dist/clsx.js";
-import "../../node_modules/@lit/reactive-element/reactive-element.js";
-import { nothing as p, html as c } from "../../node_modules/lit-html/lit-html.js";
-import "../../node_modules/lit-element/lit-element.js";
-import { property as n } from "../../node_modules/@lit/reactive-element/decorators/property.js";
-import { query as y } from "../../node_modules/@lit/reactive-element/decorators/query.js";
+import { unsafeCSS as y, nothing as p, html as c } from "lit";
+import { query as b, property as n } from "lit/decorators.js";
 import { DdsElement as E } from "../../internal/dds-hu-element.js";
 import { SizedMixin as B } from "../../internal/mixin/sizedMixin.js";
-import "../../localization/localization.js";
 import v from "./modal.scss.js";
-import { unsafeCSS as k } from "../../node_modules/@lit/reactive-element/css-tag.js";
-import { translate as f } from "../../node_modules/lit-i18n/src/lit-i18n.js";
-var C = Object.defineProperty, s = (b, t, e, i) => {
-  for (var a = void 0, l = b.length - 1, r; l >= 0; l--)
-    (r = b[l]) && (a = r(t, e, a) || a);
-  return a && C(t, e, a), a;
+var k = Object.defineProperty, s = (m, t, e, i) => {
+  for (var l = void 0, a = m.length - 1, r; a >= 0; a--)
+    (r = m[a]) && (l = r(t, e, l) || l);
+  return l && k(t, e, l), l;
 };
-const g = B(E), $ = 50, m = class m extends g {
+const C = B(E), g = 50, f = class f extends C {
   constructor() {
     super(...arguments), this.open = !1, this.fullScreen = !1, this.closeOnEsc = "true", this.closeOnOverlayClick = "true", this.closeButton = "true", this.okButtonVariant = "primary", this.cancelButtonVariant = "outline", this.okButtonDisabled = !1, this.cancelButtonDisabled = !1, this.cancelButtonDanger = !1, this.okButtonDanger = !1, this.hideOkButton = !1, this.hideCancelButton = !1, this.okButtonSize = "", this.okButtonSizeMap = "", this.cancelButtonSize = "", this.cancelButtonSizeMap = "", this.closeButtonSize = "md", this.closeButtonSizeMap = "", this.okButtonTestId = "modal-ok-button", this.cancelButtonTestId = "modal-cancel-button", this.closeButtonTestId = "modal-close-button", this.footer = "true", this.header = "true", this.wideFooter = !1, this.bottomFooter = !1, this.useNativeFocus = !1, this.fixedHeader = !1, this.fixedFooter = !1, this.noModal = !1, this.previouslyFocusedElement = null, this.focusableElements = [], this.canceled = !1, this.closeEventCanceled = !1, this.holdsScrollLock = !1, this.relockOnConnect = !1, this.scrollLock = (t) => {
       this.holdsScrollLock = t, t ? (document.body.style.overflow = "hidden", document.body.dataset.modalOpen = "true") : (document.body.style.overflow = "", delete document.body.dataset.modalOpen);
@@ -65,15 +59,15 @@ const g = B(E), $ = 50, m = class m extends g {
   afterTransition(t) {
     const e = this.dialog;
     let i = !1;
-    const a = () => {
-      i || (i = !0, e.removeEventListener("transitionend", l), window.clearTimeout(r), t());
-    }, l = (d) => {
-      d.target === e && a();
+    const l = () => {
+      i || (i = !0, e.removeEventListener("transitionend", a), window.clearTimeout(r), t());
+    }, a = (d) => {
+      d.target === e && l();
     };
-    e.addEventListener("transitionend", l);
+    e.addEventListener("transitionend", a);
     const r = window.setTimeout(
-      a,
-      this.transitionDurationMs() + $
+      l,
+      this.transitionDurationMs() + g
     );
   }
   /**
@@ -113,8 +107,8 @@ const g = B(E), $ = 50, m = class m extends g {
   transitionDurationMs() {
     const { transitionDuration: t, transitionDelay: e } = window.getComputedStyle(
       this.dialog
-    ), i = (a) => a.split(",").reduce(
-      (l, r) => Math.max(l, (Number.parseFloat(r) || 0) * 1e3),
+    ), i = (l) => l.split(",").reduce(
+      (a, r) => Math.max(a, (Number.parseFloat(r) || 0) * 1e3),
       0
     );
     return i(t) + i(e);
@@ -259,13 +253,13 @@ const g = B(E), $ = 50, m = class m extends g {
       "dap-ds-calendar",
       "dap-ds-date-picker",
       "slot"
-    ].join(","), i = (a) => {
-      const l = [];
-      return a.querySelectorAll(e).forEach((d) => {
+    ].join(","), i = (l) => {
+      const a = [];
+      return l.querySelectorAll(e).forEach((d) => {
         d instanceof HTMLSlotElement ? d.assignedElements().forEach((h) => {
-          h instanceof HTMLElement && (h.matches(e) && l.push(h), l.push(...i(h)));
-        }) : d instanceof HTMLElement && l.push(d);
-      }), l;
+          h instanceof HTMLElement && (h.matches(e) && a.push(h), a.push(...i(h)));
+        }) : d instanceof HTMLElement && a.push(d);
+      }), a;
     };
     return i(this.modalBox);
   }
@@ -295,11 +289,11 @@ const g = B(E), $ = 50, m = class m extends g {
         '[tabindex]:not([tabindex="-1"])',
         '[role="button"]',
         '[role="link"]'
-      ], a = t.shadowRoot.querySelector(
+      ], l = t.shadowRoot.querySelector(
         i.join(",")
       );
-      if (a instanceof HTMLElement)
-        return a;
+      if (l instanceof HTMLElement)
+        return l;
     }
     return t;
   }
@@ -314,13 +308,13 @@ const g = B(E), $ = 50, m = class m extends g {
     this.focusableElements.length === 0 && (this.focusableElements = this.getFocusableElements());
     const e = this.getElementFromElement(
       this.focusableElements[0]
-    ), i = this.focusableElements[this.focusableElements.length - 1], a = this.getElementFromElement(
+    ), i = this.focusableElements[this.focusableElements.length - 1], l = this.getElementFromElement(
       i
-    ), l = this.getActiveElement();
-    l && (t.shiftKey ? (l === e || this.isElementContainedIn(l, e) || this.isElementContainedIn(l, this.focusableElements[0])) && (t.preventDefault(), a && a.focus()) : (l === a || this.isElementContainedIn(l, a) || this.isElementContainedIn(l, i)) && (t.preventDefault(), e && e.focus()));
+    ), a = this.getActiveElement();
+    a && (t.shiftKey ? (a === e || this.isElementContainedIn(a, e) || this.isElementContainedIn(a, this.focusableElements[0])) && (t.preventDefault(), l && l.focus()) : (a === l || this.isElementContainedIn(a, l) || this.isElementContainedIn(a, i)) && (t.preventDefault(), e && e.focus()));
   }
   renderModal() {
-    var t, e, i, a;
+    var t, e, i, l;
     return c`<dialog
       part="base"
       class=${u("modal", {
@@ -364,7 +358,7 @@ const g = B(E), $ = 50, m = class m extends g {
                 data-testid=${this.closeButtonTestId}
                 size=${this.closeButtonSize || this.effectiveSize}
                 sizeMap=${this.closeButtonSizeMap || this.sizeMap}
-                aria-label=${this.closeButtonLabel ? this.closeButtonLabel : f("close")}
+                aria-label=${this.closeButtonLabel ? this.closeButtonLabel : this.localize.t("close")}
                 @click=${this.handleCloseButton}>
                 <dap-ds-icon name="close-line"></dap-ds-icon>
               </dap-ds-icon-button>` : p}
@@ -393,7 +387,7 @@ const g = B(E), $ = 50, m = class m extends g {
                       ?danger=${this.okButtonDanger}
                       ?disabled=${this.okButtonDisabled}
                       ?hidden=${this.hideOkButton}
-                      >${(i = this.okButtonLabel) != null ? i : f("ok")}</dap-ds-button
+                      >${(i = this.okButtonLabel) != null ? i : this.localize.t("ok")}</dap-ds-button
                     >`}
                 ${this.hideCancelButton ? p : c`<dap-ds-button
                       data-testid=${this.cancelButtonTestId}
@@ -404,7 +398,7 @@ const g = B(E), $ = 50, m = class m extends g {
                       ?disabled=${this.cancelButtonDisabled}
                       ?hidden=${this.hideCancelButton}
                       @click=${this.handleCancelButton}
-                      >${(a = this.cancelButtonLabel) != null ? a : f("cancel")}</dap-ds-button
+                      >${(l = this.cancelButtonLabel) != null ? l : this.localize.t("cancel")}</dap-ds-button
                     >`}
               </slot>
             </footer>` : p}
@@ -412,13 +406,13 @@ const g = B(E), $ = 50, m = class m extends g {
     </dialog>`;
   }
 };
-m.styles = k(v);
-let o = m;
+f.styles = y(v);
+let o = f;
 s([
-  y(".modal")
+  b(".modal")
 ], o.prototype, "dialog");
 s([
-  y(".modal__box")
+  b(".modal__box")
 ], o.prototype, "modalBox");
 s([
   n({ type: Boolean, reflect: !0 })

package/dist/components/modal/modal-base-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-base-element.js","sources":["../../../src/components/modal/modal-base-element.ts"],"sourcesContent":["import clsx from 'clsx'\nimport { html, nothing, PropertyValueMap, unsafeCSS } from 'lit'\nimport { property, query } from 'lit/decorators.js'\n\nimport type { ButtonVariant } from '@/common/types'\nimport { CloseSource } from '@/dap-design-system'\nimport { DdsElement } from '@/internal/dds-hu-element'\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\nimport { translate } from '@/localization/localization'\n\nimport type { ButtonSize } from '../icon-button/icon-button.component'\nimport styles from './modal.scss?inline'\n\nconst ModalBaseWithSized = SizedMixin(DdsElement)\n\n/** Grace period past the declared transition duration before the fallback fires. */\nconst TRANSITION_SLACK_MS = 50\n\nexport default class ModalBaseElement extends ModalBaseWithSized {\n  @query('.modal') dialog!: HTMLDialogElement\n  @query('.modal__box') modalBox!: HTMLElement\n  @property({ type: Boolean, reflect: true }) open?: boolean = false\n  @property({ type: Boolean, reflect: true }) fullScreen?: boolean = false\n  @property({ type: String, reflect: true }) closeOnEsc = 'true'\n  @property({\n    type: String,\n    reflect: true,\n  })\n  closeOnOverlayClick = 'true'\n  @property({ type: String, reflect: true }) closeButton = 'true'\n  @property() title: string\n  @property() description: string\n  @property() okButtonLabel: string\n  @property() cancelButtonLabel: string\n  @property() closeButtonLabel: string\n  @property() okButtonVariant: ButtonVariant = 'primary'\n  @property() cancelButtonVariant: ButtonVariant = 'outline'\n  @property({ type: Boolean }) okButtonDisabled = false\n  @property({ type: Boolean }) cancelButtonDisabled = false\n  @property({ type: Boolean }) cancelButtonDanger = false\n  @property({ type: Boolean }) okButtonDanger = false\n  @property({ type: Boolean }) hideOkButton = false\n  @property({ type: Boolean }) hideCancelButton = false\n  /** Override size for the default OK button; when empty uses the modal's effective size. */\n  @property() okButtonSize = ''\n  /** Override sizeMap for the default OK button; when empty uses the modal's sizeMap. */\n  @property() okButtonSizeMap = ''\n  /** Override size for the default Cancel button; when empty uses the modal's effective size. */\n  @property() cancelButtonSize = ''\n  /** Override sizeMap for the default Cancel button; when empty uses the modal's sizeMap. */\n  @property() cancelButtonSizeMap = ''\n  /** Override size for the close icon button; when empty uses the modal's effective size. */\n  @property() closeButtonSize = 'md'\n  /** Override sizeMap for the close icon button; when empty uses the modal's sizeMap. */\n  @property() closeButtonSizeMap = ''\n  /** `data-testid` for the default OK button. */\n  @property() okButtonTestId = 'modal-ok-button'\n  /** `data-testid` for the default Cancel button. */\n  @property() cancelButtonTestId = 'modal-cancel-button'\n  /** `data-testid` for the default close icon button. */\n  @property() closeButtonTestId = 'modal-close-button'\n  @property({ type: String }) footer = 'true'\n  @property({ type: String }) header = 'true'\n  @property({ type: Boolean }) wideFooter = false\n  @property({ type: Boolean }) bottomFooter = false\n  @property({ type: Boolean }) useNativeFocus = false\n  @property({ type: Boolean }) fixedHeader = false\n  @property({ type: Boolean }) fixedFooter = false\n  @property({ type: Boolean }) noModal = false\n  private previouslyFocusedElement: Element | null = null\n  private focusableElements: HTMLElement[] = []\n\n  private canceled = false\n  private closeEventCanceled = false\n  /** Whether this instance currently holds the body scroll lock. */\n  private holdsScrollLock = false\n  /** Set when the lock was released by a disconnect, so a reconnect can take it back. */\n  private relockOnConnect = false\n\n  static readonly styles = unsafeCSS(styles)\n\n  connectedCallback(): void {\n    super.connectedCallback()\n    // Set aria-hidden to true by default\n    if (!this.hasAttribute('aria-hidden')) {\n      this.setAttribute('aria-hidden', 'true')\n      this.setAttribute('tabindex', '-1')\n    }\n    // Moved or re-attached while still open: take back the lock released on disconnect.\n    if (this.relockOnConnect) {\n      this.relockOnConnect = false\n      if (this.open) {\n        this.scrollLock(true)\n      }\n    }\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback()\n    // A consumer that renders nothing when closed removes the element while it is\n    // still open, so no close routine ever runs. Without this the page stays\n    // unscrollable. Only release a lock this instance took.\n    if (this.holdsScrollLock) {\n      this.scrollLock(false)\n      this.relockOnConnect = true\n    }\n  }\n\n  attributeChangedCallback(\n    name: string,\n    _old: string | null,\n    value: string | null,\n  ): void {\n    if (name === 'title') {\n      this.header = value ? 'true' : 'false'\n    }\n    super.attributeChangedCallback(name, _old, value)\n  }\n\n  protected updated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.updated(_changedProperties)\n    if (!_changedProperties.has('open')) {\n      return\n    }\n\n    if (this.open) {\n      // Also covers the first render: a consumer that mounts the element and opens it\n      // in the same tick sets `open` before anything has rendered, and that open must\n      // go through the same routine as a later one.\n      this.handleOpen()\n    } else if (_changedProperties.get('open') !== undefined) {\n      // An element first rendered closed has nothing to close.\n      this.handleCloseAction()\n    }\n  }\n\n  private handleOpen(): void {\n    const beforeOpenEvent = this.emit('dds-before-open', undefined, {\n      cancelable: true,\n    })\n\n    if (beforeOpenEvent.defaultPrevented) {\n      return\n    }\n\n    // Reset canceled flag when opening\n    this.canceled = false\n    this.closeEventCanceled = false\n    this.scrollLock(true)\n    this.previouslyFocusedElement = this.getActiveElement()\n    if (this.noModal) {\n      this.dialog.show()\n    } else {\n      this.dialog.showModal()\n    }\n    this.afterTransition(() => {\n      // The dialog may have been closed again before the open transition settled.\n      if (!this.open) {\n        return\n      }\n\n      this.dropTransform()\n\n      const openedEvent = this.emit('dds-opened', undefined, {\n        cancelable: true,\n      })\n\n      if (openedEvent.defaultPrevented) {\n        return\n      }\n\n      this.focusableElements = this.getFocusableElements()\n      if (this.focusableElements.length > 0) {\n        this.focusableElements[0].focus()\n      }\n    })\n    this.setAttribute('aria-hidden', 'false')\n    this.setAttribute('tabindex', '0')\n  }\n\n  private handleCloseAction(): void {\n    const beforeCloseEvent = this.emit('dds-before-close', undefined, {\n      cancelable: true,\n    })\n\n    if (beforeCloseEvent.defaultPrevented) {\n      return\n    }\n\n    // Restore the entrance transform before closing so the close animation runs\n    // from the on-screen position instead of starting from `none`.\n    this.restoreTransform()\n    this.dialog.close()\n    // Reset canceled flag when closing\n    this.canceled = false\n    this.scrollLock(false)\n    this.afterTransition(() => {\n      // The dialog may have been reopened before the close transition settled.\n      if (this.open) {\n        return\n      }\n\n      const closedEvent = this.emit('dds-closed', undefined, {\n        cancelable: true,\n      })\n\n      if (closedEvent.defaultPrevented) {\n        return\n      }\n\n      if (this.previouslyFocusedElement instanceof HTMLElement) {\n        this.previouslyFocusedElement.focus()\n      }\n    })\n    this.setAttribute('aria-hidden', 'true')\n    this.setAttribute('tabindex', '-1')\n  }\n\n  /**\n   * Run `callback` once the dialog's transition settles -- or on a timer if no\n   * transition runs at all.\n   *\n   * Focus management and the `dds-opened` / `dds-closed` events used to hang directly\n   * off a `transitionend` listener registered `{ once: true }`. That event never fires\n   * when the transition is skipped (`prefers-reduced-motion: reduce`, a consumer\n   * zeroing `--dds-modal-transition-speed`, a backgrounded tab) or when it is\n   * interrupted, so focus would never enter the dialog and would never be restored on\n   * close. Accessibility behaviour must not depend on an animation completing.\n   */\n  private afterTransition(callback: () => void): void {\n    const el = this.dialog\n    let settled = false\n\n    const finish = () => {\n      if (settled) {\n        return\n      }\n      settled = true\n      el.removeEventListener('transitionend', onTransitionEnd)\n      window.clearTimeout(timeout)\n      callback()\n    }\n\n    // Ignore transitions bubbling up from descendants.\n    const onTransitionEnd = (event: TransitionEvent) => {\n      if (event.target === el) {\n        finish()\n      }\n    }\n\n    el.addEventListener('transitionend', onTransitionEnd)\n    const timeout = window.setTimeout(\n      finish,\n      this.transitionDurationMs() + TRANSITION_SLACK_MS,\n    )\n  }\n\n  /**\n   * Apply a transform change to the dialog without animating it.\n   *\n   * The dialog animates its entrance with `transform` (`transition: transform ...`),\n   * so any later transform change would try to animate too. Suppressing the\n   * transition for one reflow makes the change instant -- and importantly avoids\n   * the unreliable \"transition to `none`\" interpolation, which Chrome can leave\n   * pinned at the start value.\n   */\n  private setTransformInstantly(value: string): void {\n    const el = this.dialog\n    if (!el) {\n      return\n    }\n    const previousTransition = el.style.transition\n    el.style.transition = 'none'\n    el.style.transform = value\n    // Force a style flush so the change lands before the transition is restored.\n    void el.offsetHeight\n    el.style.transition = previousTransition\n  }\n\n  /**\n   * Drop the dialog's transform once it is settled open.\n   *\n   * A settled-open dialog keeps an identity transform (`translate(0, 0)`) for the\n   * entrance animation. Any transform -- even the identity -- makes the dialog a\n   * containing block for `position: fixed` descendants, which clips\n   * `floatingStrategy=\"fixed\"` dropdowns (select / combobox / tooltip) to the\n   * modal instead of letting them escape and overflow it. Removing it (visually a\n   * no-op) frees those popups. Restored in `restoreTransform` before closing.\n   */\n  private dropTransform(): void {\n    this.setTransformInstantly('none')\n  }\n\n  /** Undo `dropTransform` so the close animation starts from the on-screen position. */\n  private restoreTransform(): void {\n    // Empty string falls back to the CSS value (`.modal[open]` => `translate(0, 0)`).\n    this.setTransformInstantly('')\n  }\n\n  /** Longest transition duration + delay declared on the dialog, in milliseconds. */\n  private transitionDurationMs(): number {\n    const { transitionDuration, transitionDelay } = window.getComputedStyle(\n      this.dialog,\n    )\n    const longest = (value: string) =>\n      value\n        .split(',')\n        .reduce(\n          (max, part) => Math.max(max, (Number.parseFloat(part) || 0) * 1000),\n          0,\n        )\n\n    return longest(transitionDuration) + longest(transitionDelay)\n  }\n\n  scrollLock = (open: boolean) => {\n    this.holdsScrollLock = open\n    if (open) {\n      document.body.style.overflow = 'hidden'\n      document.body.dataset.modalOpen = 'true'\n    } else {\n      document.body.style.overflow = ''\n      delete document.body.dataset.modalOpen\n    }\n  }\n\n  protected firstUpdated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.firstUpdated(_changedProperties)\n    // An initial open is handled by `updated`, which runs right after this.\n    if (!this.open) {\n      this.setAttribute('aria-hidden', 'true')\n    }\n  }\n\n  public show(): void {\n    this.open = true\n  }\n\n  public hide(): void {\n    this.open = false\n  }\n\n  private handleClose(source: CloseSource) {\n    const handleCloseEvent = this.emit(\n      'dds-close',\n      {\n        source,\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCloseEvent.defaultPrevented) {\n      this.closeEventCanceled = true\n      return\n    }\n\n    this.closeEventCanceled = false\n    this.hide()\n  }\n\n  private handleCancel(event: Event): void {\n    // This method is called when the dialog's cancel event fires (Escape key)\n    // We only want to handle it when closeOnEsc is false\n    if (this.closeOnEsc !== 'true') {\n      event.preventDefault()\n      this.canceled = true\n      return\n    }\n\n    // If the close event was canceled, prevent the native cancel behavior\n    if (this.closeEventCanceled) {\n      event.preventDefault()\n      this.closeEventCanceled = false // Reset after handling\n      return\n    }\n\n    // If closeOnEsc is true and event wasn't canceled, prevent default\n    // to let the keydown handler deal with it\n    event.preventDefault()\n  }\n\n  private handleEscClose(event: Event): void {\n    // This method is called when the dialog's close event fires\n    // The close event is not cancelable, so if the custom event was canceled,\n    // we need to reopen the dialog\n\n    // If the close event was canceled, reopen the dialog\n    if (this.closeEventCanceled) {\n      // Reopen the dialog since the close was canceled\n      this.dialog.showModal()\n      this.closeEventCanceled = false // Reset after handling\n      return\n    }\n\n    // We only want to handle it when it's not from an escape key press\n    // or when closeOnEsc is false\n    if (this.canceled || this.closeOnEsc !== 'true') {\n      event.preventDefault()\n      return\n    }\n\n    // If it's from escape key and closeOnEsc is true, let the keydown handler deal with it\n    event.preventDefault()\n  }\n\n  private handleOkButton(): void {\n    const handleCloseEvent = this.emit(\n      'dds-ok',\n      {\n        source: 'ok-button',\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCloseEvent.defaultPrevented) {\n      return\n    }\n\n    this.handleClose('ok-button')\n  }\n\n  private handleCancelButton(): void {\n    const handleCloseEvent = this.emit(\n      'dds-cancel',\n      {\n        source: 'cancel-button',\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCloseEvent.defaultPrevented) {\n      return\n    }\n\n    this.handleClose('cancel-button')\n  }\n\n  private handleCloseButton(): void {\n    const handleCancelEvent = this.emit(\n      'dds-cancel',\n      {\n        source: 'close-button',\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCancelEvent.defaultPrevented) {\n      return\n    }\n\n    this.handleClose('close-button')\n  }\n\n  private handleClick(event: MouseEvent): void {\n    if (\n      this.closeOnOverlayClick === 'true' &&\n      !event.composedPath().includes(this.modalBox)\n    ) {\n      this.handleClose('overlay')\n    }\n  }\n\n  private handleKeyDown(event: KeyboardEvent): void {\n    if (event.key === 'Tab' && !this.useNativeFocus) {\n      this.handleFocusTrap(event)\n      return\n    }\n\n    if (event.key === 'Escape') {\n      if (this.closeOnEsc === 'true') {\n        // Reset the flag before handling close\n        this.closeEventCanceled = false\n\n        // Emit dds-cancel event first\n        const handleCancelEvent = this.emit(\n          'dds-cancel',\n          {\n            source: 'esc',\n          },\n          {\n            cancelable: true,\n          },\n        )\n\n        if (handleCancelEvent.defaultPrevented) {\n          event.preventDefault()\n          event.stopImmediatePropagation()\n          return\n        }\n\n        // Only handle escape if closeOnEsc is true\n        this.handleClose('esc')\n        // If the event was canceled, prevent the default ESC behavior\n        if (this.closeEventCanceled) {\n          event.preventDefault()\n          event.stopImmediatePropagation()\n        }\n      } else {\n        // Prevent default behavior when closeOnEsc is false\n        event.preventDefault()\n        event.stopImmediatePropagation()\n      }\n    }\n  }\n\n  private getFocusableElements(): HTMLElement[] {\n    const focusableSelectors = [\n      'button',\n      '[href]',\n      'input',\n      'select',\n      'textarea',\n      '[tabindex]:not([tabindex=\"-1\"])',\n      '[role=\"button\"]',\n      '[role=\"link\"]',\n      '[role=\"menuitem\"]',\n      '[role=\"tab\"]',\n      '[role=\"option\"]',\n      '[role=\"radio\"]',\n      '[role=\"checkbox\"]',\n      '[role=\"switch\"]',\n      '[role=\"combobox\"]',\n      '[role=\"listbox\"]',\n      '[role=\"textbox\"]',\n      '[contenteditable=\"true\"]',\n      'dap-ds-input',\n      'dap-ds-textarea',\n      'dap-ds-select',\n      'dap-ds-button',\n      'dap-ds-icon-button',\n      'dap-ds-search-input',\n      'dap-ds-combobox',\n      'dap-ds-checkbox',\n      'dap-ds-radio',\n      'dap-ds-switch',\n      'dap-ds-slider',\n      'dap-ds-file-input',\n      'dap-ds-calendar',\n      'dap-ds-date-picker',\n      'slot',\n    ]\n\n    const selector = focusableSelectors.join(',')\n\n    const getAllFocusableElements = (\n      root: Element | ShadowRoot,\n    ): HTMLElement[] => {\n      const elements: HTMLElement[] = []\n\n      // Get all elements matching the selectors in the current root\n      const matches = root.querySelectorAll(selector)\n      matches.forEach(element => {\n        if (element instanceof HTMLSlotElement) {\n          // Slotted content lives in the consumer's tree, so a query against this root\n          // cannot see past the slot -- only `assignedElements()` reaches it. Consumers\n          // slot a wrapper (a layout element, a stack) far more often than bare controls,\n          // so take each assigned element only if it is focusable itself, then descend to\n          // pick up the controls nested inside it. Without the descent a wrapper becomes a\n          // single opaque tab stop and everything below the first control is unreachable.\n          element.assignedElements().forEach(assignedElement => {\n            if (!(assignedElement instanceof HTMLElement)) {\n              return\n            }\n            if (assignedElement.matches(selector)) {\n              elements.push(assignedElement)\n            }\n            elements.push(...getAllFocusableElements(assignedElement))\n          })\n        } else if (element instanceof HTMLElement) {\n          elements.push(element)\n        }\n      })\n\n      return elements\n    }\n\n    return getAllFocusableElements(this.modalBox)\n  }\n\n  private getActiveElement(): Element | null {\n    let activeElement: Element | null = document.activeElement\n    if (!activeElement) return null\n\n    // Traverse shadow DOM boundaries to find the actual focused element\n    while (activeElement && activeElement.shadowRoot) {\n      const shadowActive: Element | null =\n        activeElement.shadowRoot.activeElement\n      if (shadowActive) {\n        activeElement = shadowActive\n      } else {\n        break\n      }\n    }\n\n    return activeElement\n  }\n\n  private getElementFromElement(element: Element): HTMLElement {\n    // If it's a shadow DOM component, try to get the actual focusable element\n    if (element.shadowRoot) {\n      // Check if the component has a focusElement getter (like dap-ds-button)\n      const component = element as any\n      if (\n        component.focusElement &&\n        component.focusElement instanceof HTMLElement\n      ) {\n        return component.focusElement\n      }\n\n      // Otherwise, try to find the focusable element inside the shadow root\n      const focusableSelectors = [\n        'button',\n        '[href]',\n        'input',\n        'select',\n        'textarea',\n        '[tabindex]:not([tabindex=\"-1\"])',\n        '[role=\"button\"]',\n        '[role=\"link\"]',\n      ]\n      const focusable = element.shadowRoot.querySelector(\n        focusableSelectors.join(','),\n      )\n      if (focusable instanceof HTMLElement) {\n        return focusable\n      }\n    }\n    return element as HTMLElement\n  }\n\n  private isElementContainedIn(element: Element, container: Element): boolean {\n    // Check if element is the same as container\n    if (element === container) {\n      return true\n    }\n\n    // Check if element is inside container's shadow root\n    if (container.shadowRoot && container.shadowRoot.contains(element)) {\n      return true\n    }\n\n    // Check if container is a shadow DOM component and element is its focusElement\n    const component = container as any\n    if (component.focusElement && component.focusElement === element) {\n      return true\n    }\n\n    // Check if element is contained in the regular DOM tree\n    return container.contains(element)\n  }\n\n  private handleFocusTrap(event: KeyboardEvent): void {\n    if (event.key !== 'Tab' || this.useNativeFocus) return\n\n    if (this.focusableElements.length === 0) {\n      this.focusableElements = this.getFocusableElements()\n    }\n\n    const firstFocusableElement = this.getElementFromElement(\n      this.focusableElements[0],\n    )\n    const lastFocusableElementRaw =\n      this.focusableElements[this.focusableElements.length - 1]\n    const lastFocusableElement = this.getElementFromElement(\n      lastFocusableElementRaw,\n    )\n\n    const activeElement = this.getActiveElement()\n\n    if (!activeElement) return\n\n    if (event.shiftKey) {\n      // Check if active element is the first focusable element or contained within it\n      if (\n        activeElement === firstFocusableElement ||\n        this.isElementContainedIn(activeElement, firstFocusableElement) ||\n        this.isElementContainedIn(activeElement, this.focusableElements[0])\n      ) {\n        event.preventDefault()\n        if (lastFocusableElement) {\n          lastFocusableElement.focus()\n        }\n      }\n    } else {\n      // Check if active element is the last focusable element or contained within it\n      if (\n        activeElement === lastFocusableElement ||\n        this.isElementContainedIn(activeElement, lastFocusableElement) ||\n        this.isElementContainedIn(activeElement, lastFocusableElementRaw)\n      ) {\n        event.preventDefault()\n        if (firstFocusableElement) {\n          firstFocusableElement.focus()\n        }\n      }\n    }\n  }\n\n  renderModal() {\n    return html`<dialog\n      part=\"base\"\n      class=${clsx('modal', {\n        'modal--open': this.open,\n        'modal--full': this.fullScreen,\n        'modal--no-modal': this.noModal,\n        [`modal--${this.size}`]: this.size,\n      })}\n      aria-label=${`${this.title ?? ''} ${this.description ?? ''}`}\n      role=\"dialog\"\n      aria-modal=${this.noModal ? 'false' : 'true'}\n      @close=${this.handleEscClose}\n      @cancel=${this.handleCancel}\n      @click=${this.handleClick}\n      @keydown=${this.handleKeyDown}>\n      <div part=\"panel\" class=\"modal__box\">\n        <div\n          class=${clsx('modal__header-container', {\n            [`modal__header-container--${this.size}`]: this.size,\n            [`modal__header-container--${this.size}-fixed`]: this.fixedHeader,\n          })}\n          part=\"header-container\">\n          ${this.header === 'true'\n            ? html`<header class=\"modal__header\" part=\"header\" id=\"header\">\n                <slot name=\"title\">\n                  <dap-ds-typography variant=\"h3\" part=\"title\"\n                    >${this.title}</dap-ds-typography\n                  >\n                </slot>\n                <slot name=\"description\">\n                  <span\n                    class=\"modal__description\"\n                    part=\"description\"\n                    id=\"description\">\n                    ${this.description}\n                  </span>\n                </slot>\n              </header>`\n            : html`<span></span>`}\n          ${this.closeButton === 'true'\n            ? html`<dap-ds-icon-button\n                part=\"closebutton\"\n                class=\"modal__close\"\n                data-testid=${this.closeButtonTestId}\n                size=${(this.closeButtonSize ||\n                  this.effectiveSize) as ButtonSize}\n                sizeMap=${this.closeButtonSizeMap || this.sizeMap}\n                aria-label=${this.closeButtonLabel\n                  ? this.closeButtonLabel\n                  : translate('close')}\n                @click=${this.handleCloseButton}>\n                <dap-ds-icon name=\"close-line\"></dap-ds-icon>\n              </dap-ds-icon-button>`\n            : nothing}\n        </div>\n        <div\n          class=${clsx('modal__content', {\n            'modal__content--bottom': this.bottomFooter,\n          })}\n          part=\"content\">\n          <slot></slot>\n        </div>\n        ${this.footer === 'true'\n          ? html`<footer\n              class=${clsx('modal__footer', {\n                'modal__footer--wide': this.wideFooter,\n                [`modal__footer--${this.size}`]: this.size,\n                [`modal__footer--${this.size}-fixed`]: this.fixedFooter,\n              })}\n              part=\"footer\">\n              <slot name=\"footer\">\n                ${this.hideOkButton\n                  ? nothing\n                  : html`<dap-ds-button\n                      data-testid=${this.okButtonTestId}\n                      size=${(this.okButtonSize ||\n                        this.effectiveSize) as ButtonSize}\n                      sizeMap=${this.okButtonSizeMap || this.sizeMap}\n                      @click=${this.handleOkButton}\n                      variant=${this.okButtonVariant}\n                      ?danger=${this.okButtonDanger}\n                      ?disabled=${this.okButtonDisabled}\n                      ?hidden=${this.hideOkButton}\n                      >${this.okButtonLabel ?? translate('ok')}</dap-ds-button\n                    >`}\n                ${this.hideCancelButton\n                  ? nothing\n                  : html`<dap-ds-button\n                      data-testid=${this.cancelButtonTestId}\n                      size=${(this.cancelButtonSize ||\n                        this.effectiveSize) as ButtonSize}\n                      sizeMap=${this.cancelButtonSizeMap || this.sizeMap}\n                      variant=${this.cancelButtonVariant}\n                      ?danger=${this.cancelButtonDanger}\n                      ?disabled=${this.cancelButtonDisabled}\n                      ?hidden=${this.hideCancelButton}\n                      @click=${this.handleCancelButton}\n                      >${this.cancelButtonLabel ??\n                      translate('cancel')}</dap-ds-button\n                    >`}\n              </slot>\n            </footer>`\n          : nothing}\n      </div>\n    </dialog>`\n  }\n}\n"],"names":["ModalBaseWithSized","SizedMixin","DdsElement","TRANSITION_SLACK_MS","_ModalBaseElement","open","name","_old","value","_changedProperties","callback","el","settled","finish","onTransitionEnd","timeout","event","previousTransition","transitionDuration","transitionDelay","longest","max","part","source","selector","getAllFocusableElements","root","elements","element","assignedElement","activeElement","shadowActive","component","focusableSelectors","focusable","container","firstFocusableElement","lastFocusableElementRaw","lastFocusableElement","html","clsx","_a","_b","translate","nothing","_c","_d","unsafeCSS","styles","ModalBaseElement","__decorateClass","query","property"],"mappings":"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"}
+{"version":3,"file":"modal-base-element.js","sources":["../../../src/components/modal/modal-base-element.ts"],"sourcesContent":["import clsx from 'clsx'\nimport { html, nothing, PropertyValueMap, unsafeCSS } from 'lit'\nimport { property, query } from 'lit/decorators.js'\n\nimport type { ButtonVariant } from '@/common/types'\nimport { CloseSource } from '@/dap-design-system'\nimport { DdsElement } from '@/internal/dds-hu-element'\nimport { SizedMixin } from '@/internal/mixin/sizedMixin'\n\nimport type { ButtonSize } from '../icon-button/icon-button.component'\nimport styles from './modal.scss?inline'\n\nconst ModalBaseWithSized = SizedMixin(DdsElement)\n\n/** Grace period past the declared transition duration before the fallback fires. */\nconst TRANSITION_SLACK_MS = 50\n\nexport default class ModalBaseElement extends ModalBaseWithSized {\n  @query('.modal') dialog!: HTMLDialogElement\n  @query('.modal__box') modalBox!: HTMLElement\n  @property({ type: Boolean, reflect: true }) open?: boolean = false\n  @property({ type: Boolean, reflect: true }) fullScreen?: boolean = false\n  @property({ type: String, reflect: true }) closeOnEsc = 'true'\n  @property({\n    type: String,\n    reflect: true,\n  })\n  closeOnOverlayClick = 'true'\n  @property({ type: String, reflect: true }) closeButton = 'true'\n  @property() title: string\n  @property() description: string\n  @property() okButtonLabel: string\n  @property() cancelButtonLabel: string\n  @property() closeButtonLabel: string\n  @property() okButtonVariant: ButtonVariant = 'primary'\n  @property() cancelButtonVariant: ButtonVariant = 'outline'\n  @property({ type: Boolean }) okButtonDisabled = false\n  @property({ type: Boolean }) cancelButtonDisabled = false\n  @property({ type: Boolean }) cancelButtonDanger = false\n  @property({ type: Boolean }) okButtonDanger = false\n  @property({ type: Boolean }) hideOkButton = false\n  @property({ type: Boolean }) hideCancelButton = false\n  /** Override size for the default OK button; when empty uses the modal's effective size. */\n  @property() okButtonSize = ''\n  /** Override sizeMap for the default OK button; when empty uses the modal's sizeMap. */\n  @property() okButtonSizeMap = ''\n  /** Override size for the default Cancel button; when empty uses the modal's effective size. */\n  @property() cancelButtonSize = ''\n  /** Override sizeMap for the default Cancel button; when empty uses the modal's sizeMap. */\n  @property() cancelButtonSizeMap = ''\n  /** Override size for the close icon button; when empty uses the modal's effective size. */\n  @property() closeButtonSize = 'md'\n  /** Override sizeMap for the close icon button; when empty uses the modal's sizeMap. */\n  @property() closeButtonSizeMap = ''\n  /** `data-testid` for the default OK button. */\n  @property() okButtonTestId = 'modal-ok-button'\n  /** `data-testid` for the default Cancel button. */\n  @property() cancelButtonTestId = 'modal-cancel-button'\n  /** `data-testid` for the default close icon button. */\n  @property() closeButtonTestId = 'modal-close-button'\n  @property({ type: String }) footer = 'true'\n  @property({ type: String }) header = 'true'\n  @property({ type: Boolean }) wideFooter = false\n  @property({ type: Boolean }) bottomFooter = false\n  @property({ type: Boolean }) useNativeFocus = false\n  @property({ type: Boolean }) fixedHeader = false\n  @property({ type: Boolean }) fixedFooter = false\n  @property({ type: Boolean }) noModal = false\n  private previouslyFocusedElement: Element | null = null\n  private focusableElements: HTMLElement[] = []\n\n  private canceled = false\n  private closeEventCanceled = false\n  /** Whether this instance currently holds the body scroll lock. */\n  private holdsScrollLock = false\n  /** Set when the lock was released by a disconnect, so a reconnect can take it back. */\n  private relockOnConnect = false\n\n  static readonly styles = unsafeCSS(styles)\n\n  connectedCallback(): void {\n    super.connectedCallback()\n    // Set aria-hidden to true by default\n    if (!this.hasAttribute('aria-hidden')) {\n      this.setAttribute('aria-hidden', 'true')\n      this.setAttribute('tabindex', '-1')\n    }\n    // Moved or re-attached while still open: take back the lock released on disconnect.\n    if (this.relockOnConnect) {\n      this.relockOnConnect = false\n      if (this.open) {\n        this.scrollLock(true)\n      }\n    }\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback()\n    // A consumer that renders nothing when closed removes the element while it is\n    // still open, so no close routine ever runs. Without this the page stays\n    // unscrollable. Only release a lock this instance took.\n    if (this.holdsScrollLock) {\n      this.scrollLock(false)\n      this.relockOnConnect = true\n    }\n  }\n\n  attributeChangedCallback(\n    name: string,\n    _old: string | null,\n    value: string | null,\n  ): void {\n    if (name === 'title') {\n      this.header = value ? 'true' : 'false'\n    }\n    super.attributeChangedCallback(name, _old, value)\n  }\n\n  protected updated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.updated(_changedProperties)\n    if (!_changedProperties.has('open')) {\n      return\n    }\n\n    if (this.open) {\n      // Also covers the first render: a consumer that mounts the element and opens it\n      // in the same tick sets `open` before anything has rendered, and that open must\n      // go through the same routine as a later one.\n      this.handleOpen()\n    } else if (_changedProperties.get('open') !== undefined) {\n      // An element first rendered closed has nothing to close.\n      this.handleCloseAction()\n    }\n  }\n\n  private handleOpen(): void {\n    const beforeOpenEvent = this.emit('dds-before-open', undefined, {\n      cancelable: true,\n    })\n\n    if (beforeOpenEvent.defaultPrevented) {\n      return\n    }\n\n    // Reset canceled flag when opening\n    this.canceled = false\n    this.closeEventCanceled = false\n    this.scrollLock(true)\n    this.previouslyFocusedElement = this.getActiveElement()\n    if (this.noModal) {\n      this.dialog.show()\n    } else {\n      this.dialog.showModal()\n    }\n    this.afterTransition(() => {\n      // The dialog may have been closed again before the open transition settled.\n      if (!this.open) {\n        return\n      }\n\n      this.dropTransform()\n\n      const openedEvent = this.emit('dds-opened', undefined, {\n        cancelable: true,\n      })\n\n      if (openedEvent.defaultPrevented) {\n        return\n      }\n\n      this.focusableElements = this.getFocusableElements()\n      if (this.focusableElements.length > 0) {\n        this.focusableElements[0].focus()\n      }\n    })\n    this.setAttribute('aria-hidden', 'false')\n    this.setAttribute('tabindex', '0')\n  }\n\n  private handleCloseAction(): void {\n    const beforeCloseEvent = this.emit('dds-before-close', undefined, {\n      cancelable: true,\n    })\n\n    if (beforeCloseEvent.defaultPrevented) {\n      return\n    }\n\n    // Restore the entrance transform before closing so the close animation runs\n    // from the on-screen position instead of starting from `none`.\n    this.restoreTransform()\n    this.dialog.close()\n    // Reset canceled flag when closing\n    this.canceled = false\n    this.scrollLock(false)\n    this.afterTransition(() => {\n      // The dialog may have been reopened before the close transition settled.\n      if (this.open) {\n        return\n      }\n\n      const closedEvent = this.emit('dds-closed', undefined, {\n        cancelable: true,\n      })\n\n      if (closedEvent.defaultPrevented) {\n        return\n      }\n\n      if (this.previouslyFocusedElement instanceof HTMLElement) {\n        this.previouslyFocusedElement.focus()\n      }\n    })\n    this.setAttribute('aria-hidden', 'true')\n    this.setAttribute('tabindex', '-1')\n  }\n\n  /**\n   * Run `callback` once the dialog's transition settles -- or on a timer if no\n   * transition runs at all.\n   *\n   * Focus management and the `dds-opened` / `dds-closed` events used to hang directly\n   * off a `transitionend` listener registered `{ once: true }`. That event never fires\n   * when the transition is skipped (`prefers-reduced-motion: reduce`, a consumer\n   * zeroing `--dds-modal-transition-speed`, a backgrounded tab) or when it is\n   * interrupted, so focus would never enter the dialog and would never be restored on\n   * close. Accessibility behaviour must not depend on an animation completing.\n   */\n  private afterTransition(callback: () => void): void {\n    const el = this.dialog\n    let settled = false\n\n    const finish = () => {\n      if (settled) {\n        return\n      }\n      settled = true\n      el.removeEventListener('transitionend', onTransitionEnd)\n      window.clearTimeout(timeout)\n      callback()\n    }\n\n    // Ignore transitions bubbling up from descendants.\n    const onTransitionEnd = (event: TransitionEvent) => {\n      if (event.target === el) {\n        finish()\n      }\n    }\n\n    el.addEventListener('transitionend', onTransitionEnd)\n    const timeout = window.setTimeout(\n      finish,\n      this.transitionDurationMs() + TRANSITION_SLACK_MS,\n    )\n  }\n\n  /**\n   * Apply a transform change to the dialog without animating it.\n   *\n   * The dialog animates its entrance with `transform` (`transition: transform ...`),\n   * so any later transform change would try to animate too. Suppressing the\n   * transition for one reflow makes the change instant -- and importantly avoids\n   * the unreliable \"transition to `none`\" interpolation, which Chrome can leave\n   * pinned at the start value.\n   */\n  private setTransformInstantly(value: string): void {\n    const el = this.dialog\n    if (!el) {\n      return\n    }\n    const previousTransition = el.style.transition\n    el.style.transition = 'none'\n    el.style.transform = value\n    // Force a style flush so the change lands before the transition is restored.\n    void el.offsetHeight\n    el.style.transition = previousTransition\n  }\n\n  /**\n   * Drop the dialog's transform once it is settled open.\n   *\n   * A settled-open dialog keeps an identity transform (`translate(0, 0)`) for the\n   * entrance animation. Any transform -- even the identity -- makes the dialog a\n   * containing block for `position: fixed` descendants, which clips\n   * `floatingStrategy=\"fixed\"` dropdowns (select / combobox / tooltip) to the\n   * modal instead of letting them escape and overflow it. Removing it (visually a\n   * no-op) frees those popups. Restored in `restoreTransform` before closing.\n   */\n  private dropTransform(): void {\n    this.setTransformInstantly('none')\n  }\n\n  /** Undo `dropTransform` so the close animation starts from the on-screen position. */\n  private restoreTransform(): void {\n    // Empty string falls back to the CSS value (`.modal[open]` => `translate(0, 0)`).\n    this.setTransformInstantly('')\n  }\n\n  /** Longest transition duration + delay declared on the dialog, in milliseconds. */\n  private transitionDurationMs(): number {\n    const { transitionDuration, transitionDelay } = window.getComputedStyle(\n      this.dialog,\n    )\n    const longest = (value: string) =>\n      value\n        .split(',')\n        .reduce(\n          (max, part) => Math.max(max, (Number.parseFloat(part) || 0) * 1000),\n          0,\n        )\n\n    return longest(transitionDuration) + longest(transitionDelay)\n  }\n\n  scrollLock = (open: boolean) => {\n    this.holdsScrollLock = open\n    if (open) {\n      document.body.style.overflow = 'hidden'\n      document.body.dataset.modalOpen = 'true'\n    } else {\n      document.body.style.overflow = ''\n      delete document.body.dataset.modalOpen\n    }\n  }\n\n  protected firstUpdated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>,\n  ): void {\n    super.firstUpdated(_changedProperties)\n    // An initial open is handled by `updated`, which runs right after this.\n    if (!this.open) {\n      this.setAttribute('aria-hidden', 'true')\n    }\n  }\n\n  public show(): void {\n    this.open = true\n  }\n\n  public hide(): void {\n    this.open = false\n  }\n\n  private handleClose(source: CloseSource) {\n    const handleCloseEvent = this.emit(\n      'dds-close',\n      {\n        source,\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCloseEvent.defaultPrevented) {\n      this.closeEventCanceled = true\n      return\n    }\n\n    this.closeEventCanceled = false\n    this.hide()\n  }\n\n  private handleCancel(event: Event): void {\n    // This method is called when the dialog's cancel event fires (Escape key)\n    // We only want to handle it when closeOnEsc is false\n    if (this.closeOnEsc !== 'true') {\n      event.preventDefault()\n      this.canceled = true\n      return\n    }\n\n    // If the close event was canceled, prevent the native cancel behavior\n    if (this.closeEventCanceled) {\n      event.preventDefault()\n      this.closeEventCanceled = false // Reset after handling\n      return\n    }\n\n    // If closeOnEsc is true and event wasn't canceled, prevent default\n    // to let the keydown handler deal with it\n    event.preventDefault()\n  }\n\n  private handleEscClose(event: Event): void {\n    // This method is called when the dialog's close event fires\n    // The close event is not cancelable, so if the custom event was canceled,\n    // we need to reopen the dialog\n\n    // If the close event was canceled, reopen the dialog\n    if (this.closeEventCanceled) {\n      // Reopen the dialog since the close was canceled\n      this.dialog.showModal()\n      this.closeEventCanceled = false // Reset after handling\n      return\n    }\n\n    // We only want to handle it when it's not from an escape key press\n    // or when closeOnEsc is false\n    if (this.canceled || this.closeOnEsc !== 'true') {\n      event.preventDefault()\n      return\n    }\n\n    // If it's from escape key and closeOnEsc is true, let the keydown handler deal with it\n    event.preventDefault()\n  }\n\n  private handleOkButton(): void {\n    const handleCloseEvent = this.emit(\n      'dds-ok',\n      {\n        source: 'ok-button',\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCloseEvent.defaultPrevented) {\n      return\n    }\n\n    this.handleClose('ok-button')\n  }\n\n  private handleCancelButton(): void {\n    const handleCloseEvent = this.emit(\n      'dds-cancel',\n      {\n        source: 'cancel-button',\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCloseEvent.defaultPrevented) {\n      return\n    }\n\n    this.handleClose('cancel-button')\n  }\n\n  private handleCloseButton(): void {\n    const handleCancelEvent = this.emit(\n      'dds-cancel',\n      {\n        source: 'close-button',\n      },\n      {\n        cancelable: true,\n      },\n    )\n\n    if (handleCancelEvent.defaultPrevented) {\n      return\n    }\n\n    this.handleClose('close-button')\n  }\n\n  private handleClick(event: MouseEvent): void {\n    if (\n      this.closeOnOverlayClick === 'true' &&\n      !event.composedPath().includes(this.modalBox)\n    ) {\n      this.handleClose('overlay')\n    }\n  }\n\n  private handleKeyDown(event: KeyboardEvent): void {\n    if (event.key === 'Tab' && !this.useNativeFocus) {\n      this.handleFocusTrap(event)\n      return\n    }\n\n    if (event.key === 'Escape') {\n      if (this.closeOnEsc === 'true') {\n        // Reset the flag before handling close\n        this.closeEventCanceled = false\n\n        // Emit dds-cancel event first\n        const handleCancelEvent = this.emit(\n          'dds-cancel',\n          {\n            source: 'esc',\n          },\n          {\n            cancelable: true,\n          },\n        )\n\n        if (handleCancelEvent.defaultPrevented) {\n          event.preventDefault()\n          event.stopImmediatePropagation()\n          return\n        }\n\n        // Only handle escape if closeOnEsc is true\n        this.handleClose('esc')\n        // If the event was canceled, prevent the default ESC behavior\n        if (this.closeEventCanceled) {\n          event.preventDefault()\n          event.stopImmediatePropagation()\n        }\n      } else {\n        // Prevent default behavior when closeOnEsc is false\n        event.preventDefault()\n        event.stopImmediatePropagation()\n      }\n    }\n  }\n\n  private getFocusableElements(): HTMLElement[] {\n    const focusableSelectors = [\n      'button',\n      '[href]',\n      'input',\n      'select',\n      'textarea',\n      '[tabindex]:not([tabindex=\"-1\"])',\n      '[role=\"button\"]',\n      '[role=\"link\"]',\n      '[role=\"menuitem\"]',\n      '[role=\"tab\"]',\n      '[role=\"option\"]',\n      '[role=\"radio\"]',\n      '[role=\"checkbox\"]',\n      '[role=\"switch\"]',\n      '[role=\"combobox\"]',\n      '[role=\"listbox\"]',\n      '[role=\"textbox\"]',\n      '[contenteditable=\"true\"]',\n      'dap-ds-input',\n      'dap-ds-textarea',\n      'dap-ds-select',\n      'dap-ds-button',\n      'dap-ds-icon-button',\n      'dap-ds-search-input',\n      'dap-ds-combobox',\n      'dap-ds-checkbox',\n      'dap-ds-radio',\n      'dap-ds-switch',\n      'dap-ds-slider',\n      'dap-ds-file-input',\n      'dap-ds-calendar',\n      'dap-ds-date-picker',\n      'slot',\n    ]\n\n    const selector = focusableSelectors.join(',')\n\n    const getAllFocusableElements = (\n      root: Element | ShadowRoot,\n    ): HTMLElement[] => {\n      const elements: HTMLElement[] = []\n\n      // Get all elements matching the selectors in the current root\n      const matches = root.querySelectorAll(selector)\n      matches.forEach(element => {\n        if (element instanceof HTMLSlotElement) {\n          // Slotted content lives in the consumer's tree, so a query against this root\n          // cannot see past the slot -- only `assignedElements()` reaches it. Consumers\n          // slot a wrapper (a layout element, a stack) far more often than bare controls,\n          // so take each assigned element only if it is focusable itself, then descend to\n          // pick up the controls nested inside it. Without the descent a wrapper becomes a\n          // single opaque tab stop and everything below the first control is unreachable.\n          element.assignedElements().forEach(assignedElement => {\n            if (!(assignedElement instanceof HTMLElement)) {\n              return\n            }\n            if (assignedElement.matches(selector)) {\n              elements.push(assignedElement)\n            }\n            elements.push(...getAllFocusableElements(assignedElement))\n          })\n        } else if (element instanceof HTMLElement) {\n          elements.push(element)\n        }\n      })\n\n      return elements\n    }\n\n    return getAllFocusableElements(this.modalBox)\n  }\n\n  private getActiveElement(): Element | null {\n    let activeElement: Element | null = document.activeElement\n    if (!activeElement) return null\n\n    // Traverse shadow DOM boundaries to find the actual focused element\n    while (activeElement && activeElement.shadowRoot) {\n      const shadowActive: Element | null =\n        activeElement.shadowRoot.activeElement\n      if (shadowActive) {\n        activeElement = shadowActive\n      } else {\n        break\n      }\n    }\n\n    return activeElement\n  }\n\n  private getElementFromElement(element: Element): HTMLElement {\n    // If it's a shadow DOM component, try to get the actual focusable element\n    if (element.shadowRoot) {\n      // Check if the component has a focusElement getter (like dap-ds-button)\n      const component = element as any\n      if (\n        component.focusElement &&\n        component.focusElement instanceof HTMLElement\n      ) {\n        return component.focusElement\n      }\n\n      // Otherwise, try to find the focusable element inside the shadow root\n      const focusableSelectors = [\n        'button',\n        '[href]',\n        'input',\n        'select',\n        'textarea',\n        '[tabindex]:not([tabindex=\"-1\"])',\n        '[role=\"button\"]',\n        '[role=\"link\"]',\n      ]\n      const focusable = element.shadowRoot.querySelector(\n        focusableSelectors.join(','),\n      )\n      if (focusable instanceof HTMLElement) {\n        return focusable\n      }\n    }\n    return element as HTMLElement\n  }\n\n  private isElementContainedIn(element: Element, container: Element): boolean {\n    // Check if element is the same as container\n    if (element === container) {\n      return true\n    }\n\n    // Check if element is inside container's shadow root\n    if (container.shadowRoot && container.shadowRoot.contains(element)) {\n      return true\n    }\n\n    // Check if container is a shadow DOM component and element is its focusElement\n    const component = container as any\n    if (component.focusElement && component.focusElement === element) {\n      return true\n    }\n\n    // Check if element is contained in the regular DOM tree\n    return container.contains(element)\n  }\n\n  private handleFocusTrap(event: KeyboardEvent): void {\n    if (event.key !== 'Tab' || this.useNativeFocus) return\n\n    if (this.focusableElements.length === 0) {\n      this.focusableElements = this.getFocusableElements()\n    }\n\n    const firstFocusableElement = this.getElementFromElement(\n      this.focusableElements[0],\n    )\n    const lastFocusableElementRaw =\n      this.focusableElements[this.focusableElements.length - 1]\n    const lastFocusableElement = this.getElementFromElement(\n      lastFocusableElementRaw,\n    )\n\n    const activeElement = this.getActiveElement()\n\n    if (!activeElement) return\n\n    if (event.shiftKey) {\n      // Check if active element is the first focusable element or contained within it\n      if (\n        activeElement === firstFocusableElement ||\n        this.isElementContainedIn(activeElement, firstFocusableElement) ||\n        this.isElementContainedIn(activeElement, this.focusableElements[0])\n      ) {\n        event.preventDefault()\n        if (lastFocusableElement) {\n          lastFocusableElement.focus()\n        }\n      }\n    } else {\n      // Check if active element is the last focusable element or contained within it\n      if (\n        activeElement === lastFocusableElement ||\n        this.isElementContainedIn(activeElement, lastFocusableElement) ||\n        this.isElementContainedIn(activeElement, lastFocusableElementRaw)\n      ) {\n        event.preventDefault()\n        if (firstFocusableElement) {\n          firstFocusableElement.focus()\n        }\n      }\n    }\n  }\n\n  renderModal() {\n    return html`<dialog\n      part=\"base\"\n      class=${clsx('modal', {\n        'modal--open': this.open,\n        'modal--full': this.fullScreen,\n        'modal--no-modal': this.noModal,\n        [`modal--${this.size}`]: this.size,\n      })}\n      aria-label=${`${this.title ?? ''} ${this.description ?? ''}`}\n      role=\"dialog\"\n      aria-modal=${this.noModal ? 'false' : 'true'}\n      @close=${this.handleEscClose}\n      @cancel=${this.handleCancel}\n      @click=${this.handleClick}\n      @keydown=${this.handleKeyDown}>\n      <div part=\"panel\" class=\"modal__box\">\n        <div\n          class=${clsx('modal__header-container', {\n            [`modal__header-container--${this.size}`]: this.size,\n            [`modal__header-container--${this.size}-fixed`]: this.fixedHeader,\n          })}\n          part=\"header-container\">\n          ${this.header === 'true'\n            ? html`<header class=\"modal__header\" part=\"header\" id=\"header\">\n                <slot name=\"title\">\n                  <dap-ds-typography variant=\"h3\" part=\"title\"\n                    >${this.title}</dap-ds-typography\n                  >\n                </slot>\n                <slot name=\"description\">\n                  <span\n                    class=\"modal__description\"\n                    part=\"description\"\n                    id=\"description\">\n                    ${this.description}\n                  </span>\n                </slot>\n              </header>`\n            : html`<span></span>`}\n          ${this.closeButton === 'true'\n            ? html`<dap-ds-icon-button\n                part=\"closebutton\"\n                class=\"modal__close\"\n                data-testid=${this.closeButtonTestId}\n                size=${(this.closeButtonSize ||\n                  this.effectiveSize) as ButtonSize}\n                sizeMap=${this.closeButtonSizeMap || this.sizeMap}\n                aria-label=${this.closeButtonLabel\n                  ? this.closeButtonLabel\n                  : this.localize.t('close')}\n                @click=${this.handleCloseButton}>\n                <dap-ds-icon name=\"close-line\"></dap-ds-icon>\n              </dap-ds-icon-button>`\n            : nothing}\n        </div>\n        <div\n          class=${clsx('modal__content', {\n            'modal__content--bottom': this.bottomFooter,\n          })}\n          part=\"content\">\n          <slot></slot>\n        </div>\n        ${this.footer === 'true'\n          ? html`<footer\n              class=${clsx('modal__footer', {\n                'modal__footer--wide': this.wideFooter,\n                [`modal__footer--${this.size}`]: this.size,\n                [`modal__footer--${this.size}-fixed`]: this.fixedFooter,\n              })}\n              part=\"footer\">\n              <slot name=\"footer\">\n                ${this.hideOkButton\n                  ? nothing\n                  : html`<dap-ds-button\n                      data-testid=${this.okButtonTestId}\n                      size=${(this.okButtonSize ||\n                        this.effectiveSize) as ButtonSize}\n                      sizeMap=${this.okButtonSizeMap || this.sizeMap}\n                      @click=${this.handleOkButton}\n                      variant=${this.okButtonVariant}\n                      ?danger=${this.okButtonDanger}\n                      ?disabled=${this.okButtonDisabled}\n                      ?hidden=${this.hideOkButton}\n                      >${this.okButtonLabel ??\n                      this.localize.t('ok')}</dap-ds-button\n                    >`}\n                ${this.hideCancelButton\n                  ? nothing\n                  : html`<dap-ds-button\n                      data-testid=${this.cancelButtonTestId}\n                      size=${(this.cancelButtonSize ||\n                        this.effectiveSize) as ButtonSize}\n                      sizeMap=${this.cancelButtonSizeMap || this.sizeMap}\n                      variant=${this.cancelButtonVariant}\n                      ?danger=${this.cancelButtonDanger}\n                      ?disabled=${this.cancelButtonDisabled}\n                      ?hidden=${this.hideCancelButton}\n                      @click=${this.handleCancelButton}\n                      >${this.cancelButtonLabel ??\n                      this.localize.t('cancel')}</dap-ds-button\n                    >`}\n              </slot>\n            </footer>`\n          : nothing}\n      </div>\n    </dialog>`\n  }\n}\n"],"names":["ModalBaseWithSized","SizedMixin","DdsElement","TRANSITION_SLACK_MS","_ModalBaseElement","open","name","_old","value","_changedProperties","callback","el","settled","finish","onTransitionEnd","timeout","event","previousTransition","transitionDuration","transitionDelay","longest","max","part","source","selector","getAllFocusableElements","root","elements","element","assignedElement","activeElement","shadowActive","component","focusableSelectors","focusable","container","firstFocusableElement","lastFocusableElementRaw","lastFocusableElement","html","clsx","_a","_b","nothing","_c","_d","unsafeCSS","styles","ModalBaseElement","__decorateClass","query","property"],"mappings":"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"}

package/dist/components/navigation-menu/navigation-menu-item.component.d.ts

@@ -151,7 +151,15 @@ export default class DapDSNavigationMenuItem extends DapDSNavigationMenuItem_bas
     private active;
     private openedByHover;
     private _isRovingActive;
-    /** Computed property to detect if this item contains nested navigation menu items. */
+    private _hasNestedItems;
+    /** Computed property to detect if this item contains nested navigation menu items.
+     *
+     * Backed by state (populated in `_updateNestedItems`) rather than a live
+     * `querySelectorAll` so it is SSR-safe: the `@lit-labs/ssr` element shim has no
+     * `querySelectorAll`, and reading it from `render()` would both throw on the
+     * server and structurally diverge from the client hydration render (the expand
+     * indicator span). Starts `false` (matching `hasContent`) so server and client
+     * hydration renders agree; the real value is resolved in `firstUpdated`. */
     get hasNestedItems(): boolean;
     private get _trigger();
     /**

package/dist/components/navigation-menu/navigation-menu-item.component.js

@@ -19,33 +19,27 @@ var v = (f, t, i) => new Promise((e, s) => {
 });
 import { autoUpdate as A, computePosition as k, offset as E, flip as S, shift as T, size as P } from "../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
 import { clsx as I } from "../../node_modules/clsx/dist/clsx.js";
-import "../../node_modules/@lit/reactive-element/reactive-element.js";
-import { nothing as D } from "../../node_modules/lit-html/lit-html.js";
-import "../../node_modules/lit-element/lit-element.js";
-import { property as l } from "../../node_modules/@lit/reactive-element/decorators/property.js";
-import { state as u } from "../../node_modules/@lit/reactive-element/decorators/state.js";
-import { query as N } from "../../node_modules/@lit/reactive-element/decorators/query.js";
-import { queryAssignedElements as L } from "../../node_modules/@lit/reactive-element/decorators/query-assigned-elements.js";
-import { ifDefined as g } from "../../node_modules/lit-html/directives/if-defined.js";
-import { html as m } from "../../node_modules/lit-html/static.js";
+import { unsafeCSS as N, nothing as D } from "lit";
+import { query as L, queryAssignedElements as H, property as l, state as u } from "lit/decorators.js";
+import { ifDefined as g } from "lit/directives/if-defined.js";
+import { html as m } from "lit/static-html.js";
 import { watch as _ } from "../../common/decorators.js";
-import { DdsElement as H } from "../../internal/dds-hu-element.js";
-import { SizedMixin as $ } from "../../internal/mixin/sizedMixin.js";
-import R from "../button/button.component.js";
-import B from "../icon/icon.component.js";
-import O from "../popup/popup.scss.js";
-import q from "../stack/stack.component.js";
-import F from "./navigation-menu-item.scss.js";
-import { SubmenuController as U } from "./submenu-controller.js";
-import { unsafeCSS as W } from "../../node_modules/@lit/reactive-element/css-tag.js";
+import { DdsElement as $ } from "../../internal/dds-hu-element.js";
+import { SizedMixin as R } from "../../internal/mixin/sizedMixin.js";
+import B from "../button/button.component.js";
+import O from "../icon/icon.component.js";
+import q from "../popup/popup.scss.js";
+import F from "../stack/stack.component.js";
+import U from "./navigation-menu-item.scss.js";
+import { SubmenuController as W } from "./submenu-controller.js";
 var M = Object.defineProperty, K = Object.getOwnPropertyDescriptor, a = (f, t, i, e) => {
   for (var s = e > 1 ? void 0 : e ? K(t, i) : t, n = f.length - 1, o; n >= 0; n--)
     (o = f[n]) && (s = (e ? o(t, i, s) : o(s)) || s);
   return e && s && M(t, i, s), s;
 };
-const y = class y extends $(H) {
+const y = class y extends R($) {
   constructor() {
-    super(), this.triggerElement = null, this.disabled = !1, this.opened = !1, this.placement = "bottom-start", this.floatingStrategy = "fixed", this.offset = 0, this.sync = !1, this.maxHeight = 250, this.maxWidth = "auto", this.hasArrow = !1, this.overflow = !0, this.fullWidth = !1, this.exactHref = !1, this.level = 0, this.orientation = "horizontal", this.tabMode = "group", this.triggerButtonTestId = "navigation-menu-item-trigger-button", this.hasContent = !1, this.hasLink = !1, this.hasTitleSlot = !1, this._titleText = "", this.active = !1, this.openedByHover = !1, this._isRovingActive = !1, this._handleLinkSlotChange = (t) => {
+    super(), this.triggerElement = null, this.disabled = !1, this.opened = !1, this.placement = "bottom-start", this.floatingStrategy = "fixed", this.offset = 0, this.sync = !1, this.maxHeight = 250, this.maxWidth = "auto", this.hasArrow = !1, this.overflow = !0, this.fullWidth = !1, this.exactHref = !1, this.level = 0, this.orientation = "horizontal", this.tabMode = "group", this.triggerButtonTestId = "navigation-menu-item-trigger-button", this.hasContent = !1, this.hasLink = !1, this.hasTitleSlot = !1, this._titleText = "", this.active = !1, this.openedByHover = !1, this._isRovingActive = !1, this._hasNestedItems = !1, this._handleLinkSlotChange = (t) => {
       const i = t.target;
       if (i) {
         const e = i.assignedElements();
@@ -239,11 +233,18 @@ const y = class y extends $(H) {
     }, this.handleDocumentMouseDown = (t) => {
       const i = t.target, s = t.composedPath().includes(this), n = this._isWithinNestedItems(i);
       !s && !n && this.hideDropDown();
-    }, this.submenuController = new U(this);
-  }
-  /** Computed property to detect if this item contains nested navigation menu items. */
+    }, this.submenuController = new W(this);
+  }
+  /** Computed property to detect if this item contains nested navigation menu items.
+   *
+   * Backed by state (populated in `_updateNestedItems`) rather than a live
+   * `querySelectorAll` so it is SSR-safe: the `@lit-labs/ssr` element shim has no
+   * `querySelectorAll`, and reading it from `render()` would both throw on the
+   * server and structurally diverge from the client hydration render (the expand
+   * indicator span). Starts `false` (matching `hasContent`) so server and client
+   * hydration renders agree; the real value is resolved in `firstUpdated`. */
   get hasNestedItems() {
-    return this.querySelectorAll("dap-ds-navigation-menu-item").length > 0;
+    return this._hasNestedItems;
   }
   get _trigger() {
     var i;
@@ -312,10 +313,11 @@ const y = class y extends $(H) {
   }
   /** Update nested navigation menu items with current properties. */
   _updateNestedItems() {
+    if (typeof this.querySelectorAll != "function") return;
     const t = this.querySelectorAll(
       "dap-ds-navigation-menu-item"
     );
-    Array.from(t).filter((e) => {
+    this._hasNestedItems = t.length > 0, Array.from(t).filter((e) => {
       var n;
       return ((n = e.parentElement) == null ? void 0 : n.closest(
         "dap-ds-navigation-menu-item"
@@ -663,16 +665,16 @@ const y = class y extends $(H) {
   }
 };
 y.tagName = "dap-ds-navigation-menu-item", y.dependencies = {
-  "dap-ds-icon": B,
-  "dap-ds-button": R,
-  "dap-ds-stack": q
-}, y.styles = W(`${F}${O}`);
+  "dap-ds-icon": O,
+  "dap-ds-button": B,
+  "dap-ds-stack": F
+}, y.styles = N(`${U}${q}`);
 let r = y;
 a([
-  N(".popup")
+  L(".popup")
 ], r.prototype, "popup", 2);
 a([
-  L({ slot: "trigger" })
+  H({ slot: "trigger" })
 ], r.prototype, "_assignedTrigger", 2);
 a([
   l({ reflect: !0, type: Boolean })
@@ -767,6 +769,9 @@ a([
 a([
   u()
 ], r.prototype, "_isRovingActive", 2);
+a([
+  u()
+], r.prototype, "_hasNestedItems", 2);
 a([
   _("opened")
 ], r.prototype, "handleOpenedChange", 1);