@expressivecss/expressive 0.14.1 → 0.16.0

package/dist/js/chunks/{chunk-A7ALMYUR.mjs → chunk-4QUCNFSD.mjs}

@@ -1,14 +1,13 @@
-import {
-  Utils
-} from "./chunk-MNPROCZF.mjs";
 import {
   Component
-} from "./chunk-LTWPGFBR.mjs";
+} from "./chunk-CMGXGYUC.mjs";
+import {
+  restoreAttribute
+} from "./chunk-ZVLOUDIJ.mjs";
 
 // src/ts/components/carousel.ts
 var _defaults = {
   duration: 200,
-  fullWidth: false,
   indicators: false,
   noWrap: false,
   interval: 0,
@@ -22,9 +21,10 @@ var _defaults = {
     slide: "Slide"
   }
 };
-var _Carousel = class _Carousel extends Component {
+var naturallyFocusable = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
+var Carousel = class extends Component {
   constructor(el, options) {
-    super(el, options, _Carousel);
+    super(el, options);
     this.center = 0;
     this._ownIndicators = false;
     this._trackEl = null;
@@ -35,7 +35,6 @@ var _Carousel = class _Carousel extends Component {
     this._vertical = false;
     this._resizeObserver = null;
     this._resizeTimeout = null;
-    this._usesWindowResize = false;
     this._dragPointerId = null;
     this._dragStartX = 0;
     this._dragStartY = 0;
@@ -174,11 +173,10 @@ var _Carousel = class _Carousel extends Component {
       this._cycleTo(index);
     };
     this._handleKeydown = (e) => {
-      const target = e.target;
-      if (target.isContentEditable || target.closest("input, textarea, select")) return;
+      if (this._keyBelongsElsewhere(e)) return;
       const rtl = getComputedStyle(this._scroller).direction === "rtl";
-      const forward = this._vertical ? e.key === "ArrowDown" : e.key === (rtl ? Utils.keys.ARROW_LEFT : Utils.keys.ARROW_RIGHT);
-      const backward = this._vertical ? e.key === "ArrowUp" : e.key === (rtl ? Utils.keys.ARROW_RIGHT : Utils.keys.ARROW_LEFT);
+      const forward = this._vertical ? e.key === "ArrowDown" : e.key === (rtl ? "ArrowLeft" : "ArrowRight");
+      const backward = this._vertical ? e.key === "ArrowUp" : e.key === (rtl ? "ArrowRight" : "ArrowLeft");
       if (e.key === "Home") {
         e.preventDefault();
         this.set(0);
@@ -227,18 +225,6 @@ var _Carousel = class _Carousel extends Component {
         this._finishScroll();
       }
     };
-    this.el["Expressive_Carousel"] = this;
-    this.options = {
-      ..._Carousel.defaults,
-      ...options
-    };
-    if (options?.i18n) {
-      this.options.i18n = { ..._Carousel.defaults.i18n, ...options.i18n };
-    }
-    if (this.options.fullWidth || this.el.classList.contains("flat")) {
-      this.el.classList.add("flat");
-      this.options.fullWidth = true;
-    }
     this._vertical = this.el.classList.contains("full-screen");
     this.pressed = false;
     this.dragged = false;
@@ -287,15 +273,9 @@ var _Carousel = class _Carousel extends Component {
   static get defaults() {
     return _defaults;
   }
-  static init(els, options = {}) {
-    return super.init(els, options, _Carousel);
-  }
-  static getInstance(el) {
-    return el["Expressive_Carousel"];
-  }
   destroy() {
     if (this._started) this._teardown();
-    this.el["Expressive_Carousel"] = void 0;
+    super.destroy();
   }
   _collectItems() {
     const explicit = Array.from(this.el.children).filter(
@@ -304,7 +284,7 @@ var _Carousel = class _Carousel extends Component {
     if (explicit.length) return explicit;
     return Array.from(this.el.children).filter((el) => {
       if (!(el instanceof HTMLElement)) return false;
-      if (el.classList.contains("indicators") || el.classList.contains("carousel-fixed-item")) {
+      if (el.classList.contains("indicators")) {
         return false;
       }
       return el.tagName !== "NAV";
@@ -323,7 +303,6 @@ var _Carousel = class _Carousel extends Component {
       this.el.setAttribute("aria-roledescription", "carousel");
       this._generatedContainerDescription = true;
     }
-    const naturallyFocusable = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
     this.images.forEach((item, index) => {
       if (!item.hasAttribute("aria-roledescription")) {
         item.setAttribute("aria-roledescription", "slide");
@@ -356,83 +335,42 @@ var _Carousel = class _Carousel extends Component {
       const button = document.createElement("button");
       button.type = "button";
       button.classList.add("indicator-item");
-      if (i === 0) {
-        button.classList.add("active");
-        button.setAttribute("aria-current", "true");
-      }
       button.setAttribute("aria-label", `${this.options.i18n.slide} ${i + 1}`);
       this._indicators.appendChild(button);
     });
     if (this._ownIndicators) this.el.appendChild(this._indicators);
-    this.el.querySelector(".carousel-fixed-item")?.classList.add("with-indicators");
   }
   _setupEventHandlers() {
-    this.el.addEventListener("keydown", this._handleKeydown);
-    this._motion.addEventListener("change", this._handleMotionChange);
+    const { signal } = this._events;
+    this.el.addEventListener("keydown", this._handleKeydown, { signal });
+    this._motion.addEventListener("change", this._handleMotionChange, { signal });
     if (this._autoAdvances) {
-      this.el.addEventListener("mouseenter", this._handleAutoAdvanceState);
-      this.el.addEventListener("mouseleave", this._handleAutoAdvanceState);
-      this.el.addEventListener("focusin", this._handleAutoAdvanceState);
-      this.el.addEventListener("focusout", this._handleAutoAdvanceState);
-      document.addEventListener("visibilitychange", this._handleAutoAdvanceState);
+      this.el.addEventListener("mouseenter", this._handleAutoAdvanceState, { signal });
+      this.el.addEventListener("mouseleave", this._handleAutoAdvanceState, { signal });
+      this.el.addEventListener("focusin", this._handleAutoAdvanceState, { signal });
+      this.el.addEventListener("focusout", this._handleAutoAdvanceState, { signal });
+      document.addEventListener("visibilitychange", this._handleAutoAdvanceState, { signal });
     }
     if (this.showIndicators && this._indicators) {
-      this._indicators.addEventListener("click", this._handleIndicatorClick);
-    }
-    if (typeof ResizeObserver !== "undefined") {
-      this._resizeObserver = new ResizeObserver(() => this._handleThrottledResize());
-      this._resizeObserver.observe(this.el);
+      this._indicators.addEventListener("click", this._handleIndicatorClick, { signal });
     }
-    this._usesWindowResize = !this._resizeObserver || this.el.classList.contains("full-screen");
-    if (this._usesWindowResize) {
-      _Carousel._live.add(this);
-      if (!_Carousel._resizeListening) {
-        window.addEventListener("resize", _Carousel._onResize, {
-          passive: true
-        });
-        _Carousel._resizeListening = true;
-      }
-    }
-    this._scroller.addEventListener("scroll", this._handleTrackScroll, {
-      passive: true
-    });
-    this._scroller.addEventListener("pointerdown", this._handleTrackPointerDown);
-    this._scroller.addEventListener("wheel", this._handleNativeScroll, { passive: true });
-    this._scroller.addEventListener("click", this._handleTrackClick, true);
-    this._scroller.addEventListener("dragstart", this._handleTrackDragStart);
-    this._scroller.addEventListener("transitionend", this._handleItemResize);
-  }
-  _removeEventHandlers() {
-    this.el.removeEventListener("keydown", this._handleKeydown);
-    this._motion.removeEventListener("change", this._handleMotionChange);
-    this.el.removeEventListener("mouseenter", this._handleAutoAdvanceState);
-    this.el.removeEventListener("mouseleave", this._handleAutoAdvanceState);
-    this.el.removeEventListener("focusin", this._handleAutoAdvanceState);
-    this.el.removeEventListener("focusout", this._handleAutoAdvanceState);
-    document.removeEventListener("visibilitychange", this._handleAutoAdvanceState);
-    if (this._indicators) {
-      this._indicators.removeEventListener("click", this._handleIndicatorClick);
-    }
-    this._scroller.removeEventListener("scroll", this._handleTrackScroll);
-    this._scroller.removeEventListener("pointerdown", this._handleTrackPointerDown);
-    this._scroller.removeEventListener("wheel", this._handleNativeScroll);
-    this._setDragListeners(false);
-    this._scroller.removeEventListener("click", this._handleTrackClick, true);
-    this._scroller.removeEventListener("dragstart", this._handleTrackDragStart);
-    this._scroller.removeEventListener("transitionend", this._handleItemResize);
-    this._resizeObserver?.disconnect();
-    this._resizeObserver = null;
-    if (this._usesWindowResize) {
-      _Carousel._live.delete(this);
-      if (_Carousel._live.size === 0 && _Carousel._resizeListening) {
-        window.removeEventListener("resize", _Carousel._onResize);
-        _Carousel._resizeListening = false;
-      }
+    this._resizeObserver = new ResizeObserver(() => this._handleThrottledResize());
+    this._resizeObserver.observe(this.el);
+    if (this.el.classList.contains("full-screen")) {
+      window.addEventListener("resize", this._handleThrottledResize, { passive: true, signal });
     }
+    this._scroller.addEventListener("scroll", this._handleTrackScroll, { passive: true, signal });
+    this._scroller.addEventListener("pointerdown", this._handleTrackPointerDown, { signal });
+    this._scroller.addEventListener("wheel", this._handleNativeScroll, { passive: true, signal });
+    this._scroller.addEventListener("click", this._handleTrackClick, { capture: true, signal });
+    this._scroller.addEventListener("dragstart", this._handleTrackDragStart, { signal });
+    this._scroller.addEventListener("transitionend", this._handleItemResize, { signal });
   }
   _teardown() {
     this._started = false;
-    this._removeEventHandlers();
+    this._events.abort();
+    this._resizeObserver?.disconnect();
+    this._resizeObserver = null;
     this._finishScroll();
     this._autoAdvances = false;
     this._syncAutoAdvance();
@@ -448,10 +386,10 @@ var _Carousel = class _Carousel extends Component {
       if (this._generatedItemDescriptions.has(el)) el.removeAttribute("aria-roledescription");
       if (this._generatedItemSizes.has(el)) el.removeAttribute("data-carousel-size");
       const original = this._itemA11yOriginal.get(el);
-      if (original?.ariaHidden === null) el.removeAttribute("aria-hidden");
-      else if (original) el.setAttribute("aria-hidden", original.ariaHidden);
-      if (original?.tabIndex === null) el.removeAttribute("tabindex");
-      else if (original) el.setAttribute("tabindex", original.tabIndex);
+      if (original) {
+        restoreAttribute(el, "aria-hidden", original.ariaHidden);
+        restoreAttribute(el, "tabindex", original.tabIndex);
+      }
     });
     if (this._generatedContainerRole) this.el.removeAttribute("role");
     if (this._generatedContainerLabel) this.el.removeAttribute("aria-label");
@@ -486,9 +424,21 @@ var _Carousel = class _Carousel extends Component {
   /** The document only hears from a carousel while a mouse press is down on its track. */
   _setDragListeners(on) {
     const method = on ? "addEventListener" : "removeEventListener";
-    document[method]("pointermove", this._handleTrackPointerMove);
-    document[method]("pointerup", this._handleTrackPointerUp);
-    document[method]("pointercancel", this._handleTrackPointerUp);
+    const options = { signal: this._events.signal };
+    document[method]("pointermove", this._handleTrackPointerMove, options);
+    document[method]("pointerup", this._handleTrackPointerUp, options);
+    document[method]("pointercancel", this._handleTrackPointerUp, options);
+  }
+  /**
+   * Keys the carousel leaves alone. Modified keys are shortcuts (Alt+Left is
+   * Back), and a nested widget that reads arrows itself - a field, a slider,
+   * tabs, a menu, media controls - keeps them.
+   */
+  _keyBelongsElsewhere(e) {
+    const target = e.target;
+    return [e.defaultPrevented, e.altKey, e.ctrlKey, e.metaKey, e.shiftKey, target.isContentEditable].some(Boolean) || this.el.contains(target.closest(
+      'input, textarea, select, video[controls], audio[controls], [role="slider"], [role="tablist"], [role="menu"]'
+    ));
   }
   _paintIndicators(center) {
     if (!this.showIndicators || !this._indicators) return;
@@ -500,6 +450,7 @@ var _Carousel = class _Carousel extends Component {
       else el.removeAttribute("aria-current");
     });
   }
+  /** Whether `index` is still the active item once its change is reported. */
   _syncActive(index, dragged) {
     const prev = this.center;
     this.center = index;
@@ -507,20 +458,20 @@ var _Carousel = class _Carousel extends Component {
     this._paintIndicators(index);
     this._syncLayoutRoles(index);
     const curr = this.images[index];
-    if (prev !== index && typeof this.options.onCycleTo === "function") {
-      this.options.onCycleTo.call(this, curr, dragged);
-    }
+    const detail = { item: curr, dragged };
+    if (prev !== index && !this._notify("change", this.options.onCycleTo, { args: [curr, dragged], detail, current: () => this.center === index })) return false;
     if (typeof this.oneTimeCallback === "function") {
       this.oneTimeCallback.call(this, curr, dragged);
       this.oneTimeCallback = null;
     }
+    return true;
   }
   _syncLayoutRoles(index) {
     const sizes = this.images.map(() => "large");
     const setSize = (i, size) => {
       if (this.images[i]) sizes[i] = size;
     };
-    if (this.el.classList.contains("flat") || this.el.classList.contains("uncontained") || this.el.classList.contains("full-screen") && this._vertical) {
+    if (this.el.classList.contains("uncontained") || this.el.classList.contains("full-screen") && this._vertical) {
     } else if (this.el.classList.contains("hero") || this.el.classList.contains("full-screen-horizontal")) {
       setSize(index + 1, "small");
       if (this.el.classList.contains("center-aligned")) setSize(index - 1, "small");
@@ -557,11 +508,7 @@ var _Carousel = class _Carousel extends Component {
   _focusItem(index) {
     const item = this.images[index];
     if (!item) return;
-    const focusable = item.matches(
-      'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])'
-    ) ? item : item.querySelector(
-      'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])'
-    );
+    const focusable = item.matches(naturallyFocusable) ? item : item.querySelector(naturallyFocusable);
     (focusable ?? item).focus({ preventScroll: true });
   }
   _updateParallax() {
@@ -605,18 +552,20 @@ var _Carousel = class _Carousel extends Component {
     const padding = parseFloat(this._vertical ? style.paddingBlockStart : style.paddingInlineStart) || 0;
     let best = this.center;
     let bestDist = Infinity;
+    let centerDist = Infinity;
     this.images.forEach((el, i) => {
       const start = this._vertical ? el.offsetTop : el.offsetLeft;
       const size = this._vertical ? el.offsetHeight : el.offsetWidth;
       const target = centered ? start - (viewport - size) / 2 : start + (rtl ? size - viewport + padding : -padding);
       const bounded = Math.max(rtl ? -extent : 0, Math.min(rtl ? 0 : extent, target));
       const dist = Math.abs(bounded - position);
-      if (dist < bestDist || dist === bestDist && i === this.center) {
+      if (i === this.center) centerDist = dist;
+      if (dist < bestDist) {
         bestDist = dist;
         best = i;
       }
     });
-    return best;
+    return centerDist - bestDist <= 1 ? this.center : best;
   }
   _scrollToIndex(n, smooth = true) {
     const el = this.images[n];
@@ -641,8 +590,7 @@ var _Carousel = class _Carousel extends Component {
   _cycleTo(n, callback = null) {
     this._alignAfterResize = true;
     if (typeof callback === "function") this.oneTimeCallback = callback;
-    this._syncActive(n, false);
-    this._scrollToIndex(n);
+    if (this._syncActive(n, false)) this._scrollToIndex(n);
   }
   /**
    * Stop auto-advance until start() is called. Without an `interval` there is
@@ -658,13 +606,13 @@ var _Carousel = class _Carousel extends Component {
     this._syncAutoAdvance();
   }
   next(n = 1) {
-    if (n === void 0 || isNaN(n)) n = 1;
+    if (isNaN(n)) n = 1;
     const index = this.center + n;
     if (index >= this.count || index < 0) return;
     this._cycleTo(index);
   }
   prev(n = 1) {
-    if (n === void 0 || isNaN(n)) n = 1;
+    if (isNaN(n)) n = 1;
     const index = this.center - n;
     if (index >= this.count || index < 0) return;
     this._cycleTo(index);
@@ -675,14 +623,9 @@ var _Carousel = class _Carousel extends Component {
     this._cycleTo(n, callback);
   }
 };
-_Carousel._live = /* @__PURE__ */ new Set();
-_Carousel._resizeListening = false;
-_Carousel._onResize = Utils.throttle(() => {
-  _Carousel._live.forEach((c) => c._handleResize());
-}, 200);
-var Carousel = _Carousel;
+Carousel.key = "Expressive_Carousel";
 
 export {
   Carousel
 };
-//# sourceMappingURL=chunk-A7ALMYUR.mjs.map
+//# sourceMappingURL=chunk-4QUCNFSD.mjs.map

package/dist/js/chunks/chunk-4QUCNFSD.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/carousel.ts"],
+  "sourcesContent": ["import { restoreAttribute } from '../core/utils';\nimport { Component, BaseOptions } from '../core/component';\n\nexport interface CarouselI18nOptions {\n  carousel: string;\n  item: string;\n  of: string;\n  indicators: string;\n  slide: string;\n}\n\nexport interface CarouselOptions extends BaseOptions {\n  /**\n   * Milliseconds allowed for a programmatic scroll to land. The track itself\n   * scrolls at the browser's own smooth-scroll speed; this only bounds how\n   * long the component waits for `scrollend` before assuming it arrived, and\n   * is added to `interval` to time each auto-advance rest.\n   * @default 200\n   */\n  duration: number;\n  /**\n   * Show paging dots. Only drawn when there is more than one item.\n   * @default false\n   */\n  indicators: boolean;\n  /**\n   * Stop auto-advance at the last item instead of looping back to the first.\n   * A scroll track never wraps under arrow keys or `set()` either way.\n   * @default false\n   */\n  noWrap: boolean;\n  /**\n   * Milliseconds to rest between automatic advances, on top of `duration` -\n   * the gap follows each transition rather than containing it, so a full cycle\n   * takes `duration + interval`. 0 leaves auto-advance off.\n   * Whenever it is set the track pauses on hover and on keyboard focus, and\n   * `prefers-reduced-motion: reduce` suppresses it entirely - auto-advancing\n   * content is WCAG 2.2.2 territory, so neither is an option an author can\n   * turn off. `noWrap` stops it after one pass instead of looping.\n   * @default 0\n   */\n  interval: number;\n  /**\n   * Fixed track height in pixels. `null` sizes the carousel from its content.\n   * A fixed height gives the indicators their own row below the track instead\n   * of laying them over the media.\n   * @default null\n   */\n  height: number | null;\n  /**\n   * Called when a new item becomes the center.\n   * @default null\n   */\n  onCycleTo: (current: Element, dragged: boolean) => void;\n  /**\n   * Accessible names generated for an unlabeled carousel, its items and its\n   * indicators.\n   */\n  i18n: Partial<CarouselI18nOptions>;\n}\n\nconst _defaults: CarouselOptions = {\n  duration: 200,\n  indicators: false,\n  noWrap: false,\n  interval: 0,\n  height: null,\n  onCycleTo: null,\n  i18n: {\n    carousel: 'Carousel',\n    item: 'Item',\n    of: 'of',\n    indicators: 'Slides',\n    slide: 'Slide'\n  }\n};\n\nconst naturallyFocusable =\n  'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), ' +\n  'textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"])';\n\nexport class Carousel extends Component<CarouselOptions> {\n  hasMultipleSlides: boolean;\n  showIndicators: boolean;\n  pressed: boolean;\n  dragged: boolean;\n  images: HTMLElement[];\n  _indicators: HTMLUListElement | HTMLElement;\n  count: number;\n  center: number = 0;\n  scrollingTimeout: ReturnType<typeof setTimeout>;\n  oneTimeCallback: (current: Element, dragged: boolean) => void | null;\n\n  private _ownIndicators: boolean = false;\n  private _trackEl: HTMLElement | null = null;\n  private _ignoreScroll: boolean = false;\n  private _alignAfterResize = false;\n  private _scrollEndTimeout: ReturnType<typeof setTimeout>;\n  private _trackRaf: number = null;\n  private _started: boolean = false;\n  private _vertical: boolean = false;\n  private _resizeObserver: ResizeObserver | null = null;\n  private _resizeTimeout: ReturnType<typeof setTimeout> = null;\n  private _dragPointerId: number | null = null;\n  private _dragStartX: number = 0;\n  private _dragStartY: number = 0;\n  private _dragStartScroll: number = 0;\n  private _suppressClick: boolean = false;\n  private _suppressClickTimeout: ReturnType<typeof setTimeout> = null;\n  private _generatedContainerRole: boolean = false;\n  private _generatedContainerLabel: boolean = false;\n  private _generatedContainerDescription: boolean = false;\n  private _generatedWideLayout: boolean = false;\n  private _generatedFixedHeight: boolean = false;\n  private _authoredInlineHeight: string | null = null;\n  private _autoAdvanceTimer: ReturnType<typeof setTimeout> = null;\n  private _autoAdvances: boolean = false;\n  private _autoPaused: boolean = false;\n  private _hovered: boolean = false;\n  private _focused: boolean = false;\n  private _motion = window.matchMedia('(prefers-reduced-motion: reduce)');\n  private _generatedItemTabIndexes = new Set<HTMLElement>();\n  private _generatedItemLabels = new Set<HTMLElement>();\n  private _generatedItemDescriptions = new Set<HTMLElement>();\n  private _generatedItemSizes = new Set<HTMLElement>();\n  private _authoredItemSizes = new Set<HTMLElement>();\n  private _itemA11yOriginal = new Map<\n    HTMLElement,\n    { ariaHidden: string | null; tabIndex: string | null }\n  >();\n\n  private get _scroller(): HTMLElement {\n    return this._trackEl ?? this.el;\n  }\n\n  constructor(el: HTMLElement, options: Partial<CarouselOptions>) {\n    super(el, options);\n\n    this._vertical = this.el.classList.contains('full-screen');\n\n    this.pressed = false;\n    this.dragged = false;\n    this.images = this._collectItems();\n    if (!this.images.length) {\n      console.error('Carousel: no .carousel-item elements to show');\n      return;\n    }\n    this.images.forEach((item) => {\n      this._itemA11yOriginal.set(item, {\n        ariaHidden: item.getAttribute('aria-hidden'),\n        tabIndex: item.getAttribute('tabindex')\n      });\n      if (item.hasAttribute('data-carousel-size')) this._authoredItemSizes.add(item);\n    });\n\n    this.hasMultipleSlides = this.images.length > 1;\n    this.showIndicators = this.options.indicators && this.hasMultipleSlides;\n    this.count = this.images.length;\n\n    this._autoAdvances = this.options.interval > 0 && this.hasMultipleSlides;\n\n    this.images.forEach((item) => item.classList.add('carousel-item'));\n    if (this.options.height !== null) {\n      this._generatedFixedHeight = !this.el.classList.contains('fixed-height');\n      this._authoredInlineHeight = this.el.style.getPropertyValue('--carousel-height') || null;\n      this.el.classList.add('fixed-height');\n      this.el.style.setProperty('--carousel-height', `${this.options.height}px`);\n    }\n    this._wrapTrack();\n    this._syncAdaptiveMode();\n\n    if (this.showIndicators) this._setupIndicators();\n\n    this._setupAccessibility();\n\n    this._setupEventHandlers();\n    this._started = true;\n\n    const start = Math.max(\n      0,\n      this.images.findIndex((el) => el.classList.contains('active'))\n    );\n    this.center = start;\n    this._syncActive(start, false);\n    this._updateParallax();\n    this._scrollToIndex(start, false);\n\n    this._syncAutoAdvance();\n  }\n\n  static get defaults(): CarouselOptions {\n    return _defaults;\n  }\n\n  static key = 'Expressive_Carousel';\n\n  destroy() {\n    if (this._started) this._teardown();\n    super.destroy();\n  }\n\n  private _collectItems(): HTMLElement[] {\n    const explicit = Array.from(this.el.children).filter(\n      (el): el is HTMLElement => el instanceof HTMLElement && el.classList.contains('carousel-item')\n    );\n    if (explicit.length) return explicit;\n    return Array.from(this.el.children).filter((el): el is HTMLElement => {\n      if (!(el instanceof HTMLElement)) return false;\n      if (el.classList.contains('indicators')) {\n        return false;\n      }\n      return el.tagName !== 'NAV';\n    });\n  }\n\n  private _setupAccessibility() {\n    if (!this.el.hasAttribute('role')) {\n      this.el.setAttribute('role', 'region');\n      this._generatedContainerRole = true;\n    }\n    if (!this.el.hasAttribute('aria-label') && !this.el.hasAttribute('aria-labelledby')) {\n      this.el.setAttribute('aria-label', this.options.i18n.carousel);\n      this._generatedContainerLabel = true;\n    }\n    if (!this.el.hasAttribute('aria-roledescription')) {\n      this.el.setAttribute('aria-roledescription', 'carousel');\n      this._generatedContainerDescription = true;\n    }\n\n    this.images.forEach((item, index) => {\n      if (!item.hasAttribute('aria-roledescription')) {\n        item.setAttribute('aria-roledescription', 'slide');\n        this._generatedItemDescriptions.add(item);\n      }\n\n      if (!item.hasAttribute('aria-label') && !item.hasAttribute('aria-labelledby')) {\n        const mediaName = item.querySelector('img[alt]')?.getAttribute('alt')?.trim();\n        const textName = item.textContent?.replace(/\\s+/g, ' ').trim();\n        const name = mediaName || textName;\n        const position = `${this.options.i18n.item} ${index + 1} ${this.options.i18n.of} ${this.count}`;\n        item.setAttribute('aria-label', name ? `${name}, ${position}` : position);\n        this._generatedItemLabels.add(item);\n      }\n\n      if (!item.matches(naturallyFocusable) && !item.querySelector(naturallyFocusable)) {\n        item.tabIndex = 0;\n        this._generatedItemTabIndexes.add(item);\n      }\n    });\n  }\n\n  private _setupIndicators() {\n    const existing = Array.from(this.el.children).find(\n      (el): el is HTMLElement => el instanceof HTMLElement && el.classList.contains('indicators')\n    );\n    this._indicators = existing ?? document.createElement('nav');\n    this._ownIndicators = !existing;\n    this._indicators.classList.add('indicators');\n    this._indicators.setAttribute('aria-label', this.options.i18n.indicators);\n    this._indicators.replaceChildren();\n\n    this.images.forEach((_, i) => {\n      const button = document.createElement('button');\n      button.type = 'button';\n      button.classList.add('indicator-item');\n      button.setAttribute('aria-label', `${this.options.i18n.slide} ${i + 1}`);\n      this._indicators.appendChild(button);\n    });\n\n    if (this._ownIndicators) this.el.appendChild(this._indicators);\n  }\n\n  _setupEventHandlers() {\n    const { signal } = this._events;\n    this.el.addEventListener('keydown', this._handleKeydown, { signal });\n    this._motion.addEventListener('change', this._handleMotionChange, { signal });\n    if (this._autoAdvances) {\n      this.el.addEventListener('mouseenter', this._handleAutoAdvanceState, { signal });\n      this.el.addEventListener('mouseleave', this._handleAutoAdvanceState, { signal });\n      this.el.addEventListener('focusin', this._handleAutoAdvanceState, { signal });\n      this.el.addEventListener('focusout', this._handleAutoAdvanceState, { signal });\n      // Browsers clamp a background tab's timers rather than stopping them, so\n      // without this the track keeps cycling out of sight.\n      document.addEventListener('visibilitychange', this._handleAutoAdvanceState, { signal });\n    }\n    if (this.showIndicators && this._indicators) {\n      this._indicators.addEventListener('click', this._handleIndicatorClick, { signal });\n    }\n    this._resizeObserver = new ResizeObserver(() => this._handleThrottledResize());\n    this._resizeObserver.observe(this.el);\n\n    // Full-screen needs a window signal when orientation changes without\n    // changing the container width. ResizeObserver handles every other track,\n    // including pane resizes.\n    if (this.el.classList.contains('full-screen')) {\n      window.addEventListener('resize', this._handleThrottledResize, { passive: true, signal });\n    }\n\n    this._scroller.addEventListener('scroll', this._handleTrackScroll, { passive: true, signal });\n    this._scroller.addEventListener('pointerdown', this._handleTrackPointerDown, { signal });\n    this._scroller.addEventListener('wheel', this._handleNativeScroll, { passive: true, signal });\n    this._scroller.addEventListener('click', this._handleTrackClick, { capture: true, signal });\n    this._scroller.addEventListener('dragstart', this._handleTrackDragStart, { signal });\n    this._scroller.addEventListener('transitionend', this._handleItemResize, { signal });\n  }\n\n  private _teardown() {\n    this._started = false;\n    this._events.abort();\n    this._resizeObserver?.disconnect();\n    this._resizeObserver = null;\n    this._finishScroll();\n    this._autoAdvances = false;\n    this._syncAutoAdvance();\n    if (this._trackRaf !== null) cancelAnimationFrame(this._trackRaf);\n    window.clearTimeout(this.scrollingTimeout);\n    window.clearTimeout(this._suppressClickTimeout);\n    clearTimeout(this._resizeTimeout);\n    if (this._ownIndicators) this._indicators?.remove();\n    this._unwrapTrack();\n    this.images.forEach((el) => {\n      el.style.removeProperty('--md-comp-carousel-item-parallax');\n      if (this._generatedItemLabels.has(el)) el.removeAttribute('aria-label');\n      if (this._generatedItemDescriptions.has(el)) el.removeAttribute('aria-roledescription');\n      if (this._generatedItemSizes.has(el)) el.removeAttribute('data-carousel-size');\n      const original = this._itemA11yOriginal.get(el);\n      if (original) {\n        restoreAttribute(el, 'aria-hidden', original.ariaHidden);\n        restoreAttribute(el, 'tabindex', original.tabIndex);\n      }\n    });\n    if (this._generatedContainerRole) this.el.removeAttribute('role');\n    if (this._generatedContainerLabel) this.el.removeAttribute('aria-label');\n    if (this._generatedContainerDescription) this.el.removeAttribute('aria-roledescription');\n    if (this._generatedFixedHeight) this.el.classList.remove('fixed-height');\n    if (this.options.height !== null) {\n      if (this._authoredInlineHeight === null) this.el.style.removeProperty('--carousel-height');\n      else this.el.style.setProperty('--carousel-height', this._authoredInlineHeight);\n    }\n    if (this._generatedWideLayout) {\n      this.el.classList.remove(\n        'multi-wide',\n        'multi-large',\n        'multi-extra-large',\n        'full-screen-horizontal'\n      );\n    }\n  }\n\n  _handleThrottledResize = () => {\n    if (!this._started || this._resizeTimeout !== null) return;\n    this._handleResize();\n    this._resizeTimeout = setTimeout(() => {\n      this._resizeTimeout = null;\n      this._handleResize();\n    }, 200);\n  };\n\n  _handleAutoAdvanceState = (e: Event) => {\n    if (e.type === 'mouseenter') this._hovered = true;\n    else if (e.type === 'mouseleave') this._hovered = false;\n    else if (e.type === 'focusin') this._focused = true;\n    else if (e.type === 'focusout') this._focused = this.el.contains((e as FocusEvent).relatedTarget as Node);\n    this._syncAutoAdvance();\n  };\n\n  private _handleMotionChange = () => {\n    this._syncAutoAdvance();\n    if (this._motion.matches) this._scrollToIndex(this.center, false);\n    this._updateParallax();\n  };\n\n  /** Start or stop the timer to match the current pause state. */\n  private _syncAutoAdvance() {\n    const run =\n      this._autoAdvances &&\n      !this._autoPaused &&\n      !this._hovered &&\n      !this._focused &&\n      !this._motion.matches &&\n      !document.hidden;\n    if (run && this._autoAdvanceTimer === null) {\n      // Each rest is armed after the move before it, never on a fixed phase.\n      // A repeating timer assumes the work it triggers is instant; a smooth\n      // scroll is not, so a fixed period either lands mid-scroll or, once a\n      // tick is dropped, leaves whatever is left of the period as the next\n      // rest.\n      this._autoAdvanceTimer = setTimeout(\n        this._tick,\n        this.options.duration + this.options.interval\n      );\n    } else if (!run && this._autoAdvanceTimer !== null) {\n      clearTimeout(this._autoAdvanceTimer);\n      this._autoAdvanceTimer = null;\n    }\n  }\n\n  private _tick = () => {\n    this._autoAdvanceTimer = null;\n    this._advance();\n    this._syncAutoAdvance();\n  };\n\n  private _advance = () => {\n    const next = this.center + 1;\n    if (next < this.count) {\n      this.set(next);\n      return;\n    }\n    // Arrow keys and `set()` never wrap, because a scroll container has ends.\n    // Auto-advance is the one caller that can: looping back to the first item\n    // is just a scroll. An author who asked for no wrapping gets one pass and\n    // then silence.\n    if (this.options.noWrap) {\n      this._autoAdvances = false;\n      this._syncAutoAdvance();\n      return;\n    }\n    this.set(0);\n  };\n\n  private _handleNativeScroll = () => {\n    this._alignAfterResize = false;\n    this._finishScroll();\n  };\n\n  /** The document only hears from a carousel while a mouse press is down on its track. */\n  private _setDragListeners(on: boolean) {\n    const method = on ? 'addEventListener' : 'removeEventListener';\n    // The signal also removes them when the carousel is destroyed mid-drag.\n    const options = { signal: this._events.signal };\n    document[method]('pointermove', this._handleTrackPointerMove, options);\n    document[method]('pointerup', this._handleTrackPointerUp, options);\n    document[method]('pointercancel', this._handleTrackPointerUp, options);\n  }\n\n  _handleTrackPointerDown = (e: PointerEvent) => {\n    this._handleNativeScroll();\n    if (e.pointerType !== 'mouse' || e.button !== 0) return;\n    this.pressed = true;\n    this.dragged = false;\n    this._suppressClick = false;\n    this._dragPointerId = e.pointerId;\n    this._dragStartX = e.clientX;\n    this._dragStartY = e.clientY;\n    this._dragStartScroll = this._vertical ? this._scroller.scrollTop : this._scroller.scrollLeft;\n    this._setDragListeners(true);\n  };\n\n  _handleTrackPointerMove = (e: PointerEvent) => {\n    if (!this.pressed || e.pointerId !== this._dragPointerId) return;\n    const deltaX = e.clientX - this._dragStartX;\n    const deltaY = e.clientY - this._dragStartY;\n    const primaryDelta = this._vertical ? deltaY : deltaX;\n    const crossDelta = this._vertical ? deltaX : deltaY;\n\n    if (!this.dragged) {\n      if (Math.abs(primaryDelta) < 6 || Math.abs(primaryDelta) <= Math.abs(crossDelta)) return;\n      this.dragged = true;\n      this.el.classList.add('dragging');\n      try {\n        this._scroller.setPointerCapture(e.pointerId);\n      } catch {\n        // Pointer capture is optional in older browsers and test DOMs.\n      }\n    }\n\n    if (this._vertical) this._scroller.scrollTop = this._dragStartScroll - deltaY;\n    else this._scroller.scrollLeft = this._dragStartScroll - deltaX;\n    e.preventDefault();\n  };\n\n  _handleTrackPointerUp = (e: PointerEvent) => {\n    if (!this.pressed || e.pointerId !== this._dragPointerId) return;\n    this.pressed = false;\n    this._dragPointerId = null;\n    this._setDragListeners(false);\n    this.el.classList.remove('dragging');\n    try {\n      this._scroller.releasePointerCapture(e.pointerId);\n    } catch {\n      // Pointer capture may already have been released.\n    }\n\n    if (!this.dragged) return;\n    this._suppressClick = true;\n    window.clearTimeout(this._suppressClickTimeout);\n    this._suppressClickTimeout = setTimeout(() => {\n      this._suppressClick = false;\n    }, 0);\n    this._syncActive(this._nearestIndex(), true);\n  };\n\n  _handleTrackClick = (e: MouseEvent) => {\n    if (!this._suppressClick) return;\n    this._suppressClick = false;\n    e.preventDefault();\n    e.stopImmediatePropagation();\n  };\n\n  _handleTrackDragStart = (e: DragEvent) => {\n    if ((e.target as HTMLElement).closest('a, img, picture, video')) e.preventDefault();\n  };\n\n  private _handleItemResize = (e: TransitionEvent) => {\n    if (this._alignAfterResize && !this.pressed && e.propertyName === 'flex-basis' && this.images.includes(e.target as HTMLElement)) {\n      this._scrollToIndex(this.center, false);\n    }\n  };\n\n  _handleIndicatorClick = (e: Event) => {\n    e.stopPropagation();\n    const indicator = (e.target as HTMLElement).closest('.indicator-item');\n    if (!indicator || !this._indicators.contains(indicator)) return;\n    const index = [...this._indicators.children].indexOf(indicator);\n    if (index < 0) return;\n    this._cycleTo(index);\n  };\n\n  /**\n   * Keys the carousel leaves alone. Modified keys are shortcuts (Alt+Left is\n   * Back), and a nested widget that reads arrows itself - a field, a slider,\n   * tabs, a menu, media controls - keeps them.\n   */\n  private _keyBelongsElsewhere(e: KeyboardEvent) {\n    const target = e.target as HTMLElement;\n    return [e.defaultPrevented, e.altKey, e.ctrlKey, e.metaKey, e.shiftKey, target.isContentEditable].some(Boolean) ||\n      this.el.contains(target.closest(\n        'input, textarea, select, video[controls], audio[controls], [role=\"slider\"], [role=\"tablist\"], [role=\"menu\"]'\n      ));\n  }\n\n  _handleKeydown = (e: KeyboardEvent) => {\n    if (this._keyBelongsElsewhere(e)) return;\n    const rtl = getComputedStyle(this._scroller).direction === 'rtl';\n    const forward = this._vertical ? e.key === 'ArrowDown' : e.key === (rtl ? 'ArrowLeft' : 'ArrowRight');\n    const backward = this._vertical ? e.key === 'ArrowUp' : e.key === (rtl ? 'ArrowRight' : 'ArrowLeft');\n    if (e.key === 'Home') {\n      e.preventDefault();\n      this.set(0);\n      this._focusItem(0);\n    } else if (e.key === 'End') {\n      e.preventDefault();\n      this.set(this.count - 1);\n      this._focusItem(this.count - 1);\n    } else if (forward) {\n      e.preventDefault();\n      this.next();\n      this._focusItem(this.center);\n    } else if (backward) {\n      e.preventDefault();\n      this.prev();\n      this._focusItem(this.center);\n    }\n  };\n\n  _handleTrackScroll = () => {\n    if (!this.el.classList.contains('scrolling')) this.el.classList.add('scrolling');\n    window.clearTimeout(this.scrollingTimeout);\n    this.scrollingTimeout = setTimeout(() => this.el.classList.remove('scrolling'), 120);\n    if (this._trackRaf !== null) return;\n    this._trackRaf = requestAnimationFrame(() => {\n      this._trackRaf = null;\n      // Read the nearest index before the parallax writes invalidate style.\n      const index = this._ignoreScroll ? this.center : this._nearestIndex();\n      this._updateParallax();\n      if (index !== this.center) this._syncActive(index, this.dragged);\n    });\n  };\n\n  _handleResize = () => {\n    if (!this._started || !this.images.length) return;\n    this._syncAdaptiveMode();\n    this._syncLayoutRoles(this.center);\n    if (!this.pressed) this._scrollToIndex(this.center, false);\n    this._updateParallax();\n  };\n\n  private _paintIndicators(center: number) {\n    if (!this.showIndicators || !this._indicators) return;\n    const pos = ((center % this.count) + this.count) % this.count;\n    this._indicators.querySelectorAll('.indicator-item').forEach((el, i) => {\n      const on = i === pos;\n      el.classList.toggle('active', on);\n      if (on) el.setAttribute('aria-current', 'true');\n      else el.removeAttribute('aria-current');\n    });\n  }\n\n  /** Whether `index` is still the active item once its change is reported. */\n  private _syncActive(index: number, dragged: boolean): boolean {\n    const prev = this.center;\n    this.center = index;\n    this.images.forEach((el, i) => el.classList.toggle('active', i === index));\n    this._paintIndicators(index);\n    this._syncLayoutRoles(index);\n    const curr = this.images[index];\n    const detail = { item: curr, dragged };\n    if (prev !== index && !this._notify('change', this.options.onCycleTo, { args: [curr, dragged], detail, current: () => this.center === index })) return false;\n    if (typeof this.oneTimeCallback === 'function') {\n      this.oneTimeCallback.call(this, curr, dragged);\n      this.oneTimeCallback = null;\n    }\n    return true;\n  }\n\n  private _syncLayoutRoles(index: number) {\n    // Every size is worked out before any is written. Writing `large` to all\n    // items and then reading clientWidth forced a layout in that interim\n    // state on every center change.\n    type Size = 'large' | 'medium' | 'small';\n    const sizes: Size[] = this.images.map(() => 'large');\n    const setSize = (i: number, size: Size) => {\n      if (this.images[i]) sizes[i] = size;\n    };\n\n    if (\n      this.el.classList.contains('uncontained') ||\n      (this.el.classList.contains('full-screen') && this._vertical)\n    ) {\n      // Every item stays large.\n    } else if (\n      this.el.classList.contains('hero') ||\n      this.el.classList.contains('full-screen-horizontal')\n    ) {\n      setSize(index + 1, 'small');\n      if (this.el.classList.contains('center-aligned')) setSize(index - 1, 'small');\n    } else {\n      const width = this.el.clientWidth;\n      const desiredLargeCount = width >= 1600 ? 4 : width >= 1200 ? 3 : width >= 600 ? 2 : 1;\n      const largeCount = Math.min(desiredLargeCount, Math.max(1, this.count - 2));\n      this.el.classList.remove('multi-wide', 'multi-large', 'multi-extra-large');\n      if (largeCount === 2) this.el.classList.add('multi-wide');\n      else if (largeCount === 3) this.el.classList.add('multi-large');\n      else if (largeCount >= 4) this.el.classList.add('multi-extra-large');\n      this._generatedWideLayout = this._generatedWideLayout || largeCount > 1;\n      setSize(index + largeCount, 'medium');\n      setSize(index + largeCount + 1, 'small');\n    }\n\n    this.images.forEach((item, i) => {\n      if (this._authoredItemSizes.has(item)) return;\n      item.setAttribute('data-carousel-size', sizes[i]);\n      this._generatedItemSizes.add(item);\n    });\n  }\n\n  private _syncAdaptiveMode() {\n    if (!this.el.classList.contains('full-screen')) return;\n    const landscape = window.matchMedia('(orientation: landscape)').matches;\n    const horizontal = this.el.clientWidth >= 840 || landscape;\n    const wasVertical = this._vertical;\n    this._vertical = !horizontal;\n    this.el.classList.toggle('full-screen-horizontal', horizontal);\n    this._generatedWideLayout = this._generatedWideLayout || horizontal;\n\n    if (this._started && wasVertical !== this._vertical) {\n      this._scroller.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n    }\n  }\n\n  private _focusItem(index: number) {\n    const item = this.images[index];\n    if (!item) return;\n    const focusable = item.matches(naturallyFocusable)\n      ? item\n      : item.querySelector<HTMLElement>(naturallyFocusable);\n    (focusable ?? item).focus({ preventScroll: true });\n  }\n\n  private _updateParallax() {\n    if (this._motion.matches) {\n      this.images.forEach((item) =>\n        item.style.setProperty('--md-comp-carousel-item-parallax', '0px')\n      );\n      return;\n    }\n\n    const scrollerRect = this._scroller.getBoundingClientRect();\n    const viewportCenter = this._vertical\n      ? scrollerRect.top + scrollerRect.height / 2\n      : scrollerRect.left + scrollerRect.width / 2;\n    const viewportSize = Math.max(1, this._vertical ? scrollerRect.height : scrollerRect.width);\n\n    // All reads, then all writes: a write between two reads forces a style\n    // recalculation per item on every scroll frame.\n    const rects = this.images.map((item) => item.getBoundingClientRect());\n    this.images.forEach((item, i) => {\n      const rect = rects[i];\n      const itemCenter = this._vertical ? rect.top + rect.height / 2 : rect.left + rect.width / 2;\n      const progress = Math.max(-1, Math.min(1, (itemCenter - viewportCenter) / viewportSize));\n      item.style.setProperty('--md-comp-carousel-item-parallax', `${progress * -24}px`);\n    });\n  }\n\n  private _wrapTrack() {\n    const track = document.createElement('div');\n    track.className = 'carousel-track';\n    this.images[0].before(track);\n    this.images.forEach((el) => track.appendChild(el));\n    this._trackEl = track;\n  }\n\n  private _unwrapTrack() {\n    if (!this._trackEl) return;\n    this.images.forEach((el) => this.el.insertBefore(el, this._trackEl));\n    this._trackEl.remove();\n    this._trackEl = null;\n  }\n\n  private _nearestIndex(): number {\n    const centered = this.el.classList.contains('center-aligned');\n    const style = getComputedStyle(this._scroller);\n    const rtl = !this._vertical && style.direction === 'rtl';\n    const position = this._vertical ? this._scroller.scrollTop : this._scroller.scrollLeft;\n    const viewport = this._vertical ? this._scroller.clientHeight : this._scroller.clientWidth;\n    const extent = (this._vertical ? this._scroller.scrollHeight : this._scroller.scrollWidth) - viewport;\n    const padding = parseFloat(this._vertical ? style.paddingBlockStart : style.paddingInlineStart) || 0;\n    let best = this.center;\n    let bestDist = Infinity;\n    let centerDist = Infinity;\n    this.images.forEach((el, i) => {\n      const start = this._vertical ? el.offsetTop : el.offsetLeft;\n      const size = this._vertical ? el.offsetHeight : el.offsetWidth;\n      const target = centered ? start - (viewport - size) / 2 : start + (rtl ? size - viewport + padding : -padding);\n      const bounded = Math.max(rtl ? -extent : 0, Math.min(rtl ? 0 : extent, target));\n      const dist = Math.abs(bounded - position);\n      if (i === this.center) centerDist = dist;\n      if (dist < bestDist) {\n        bestDist = dist;\n        best = i;\n      }\n    });\n    // Items past the scroll end all clamp to it, and a subpixel wobble there\n    // (WebKit reports -179 for -178 in a right-to-left track) must not hand\n    // the selection to a later item that only shares the clamped position.\n    return centerDist - bestDist <= 1 ? this.center : best;\n  }\n\n  private _scrollToIndex(n: number, smooth = true) {\n    const el = this.images[n];\n    if (!el) return;\n    this._finishScroll();\n    const centered = this.el.classList.contains('center-aligned');\n    const style = getComputedStyle(this._scroller);\n    const inlinePadding = Number.parseFloat(style.paddingInlineStart) || 0;\n    const blockPadding = Number.parseFloat(style.paddingBlockStart) || 0;\n    const left = centered\n      ? el.offsetLeft - (this._scroller.clientWidth - el.offsetWidth) / 2\n      : style.direction === 'rtl'\n        ? el.offsetLeft + el.offsetWidth - this._scroller.clientWidth + inlinePadding\n        : el.offsetLeft - inlinePadding;\n    const top = el.offsetTop - blockPadding;\n    this._ignoreScroll = true;\n    // Item sizes are still transitioning, so the track can be too narrow to\n    // reach the target and clamps short of it. Firefox takes whatever item\n    // sits at that clamped position as the snap target and re-snaps to it\n    // after each later layout change, undoing the alignment below. Snapping\n    // returns in _finishScroll, once the track has settled on the item.\n    this._scroller.style.scrollSnapType = 'none';\n    this._scroller.scrollTo({\n      left: this._vertical ? 0 : left,\n      top: this._vertical ? top : 0,\n      behavior: smooth && !this._motion.matches ? 'smooth' : 'instant'\n    });\n    this._scroller.addEventListener('scrollend', this._handleScrollEnd);\n    this._scrollEndTimeout = setTimeout(this._finishScroll, this.options.duration + 350);\n  }\n\n  private _finishScroll = () => {\n    this._ignoreScroll = false;\n    this._scroller.style.scrollSnapType = '';\n    clearTimeout(this._scrollEndTimeout);\n    this._scroller.removeEventListener('scrollend', this._handleScrollEnd);\n  };\n\n  private _handleScrollEnd = () => {\n    // An earlier scroll can finish after a new navigation has started.\n    if (this._nearestIndex() === this.center && !this.images.some(item => item.getAnimations().some(animation => animation.playState === 'running'))) {\n      this._finishScroll();\n    }\n  };\n\n  _cycleTo(n: number, callback: CarouselOptions['onCycleTo'] = null) {\n    this._alignAfterResize = true;\n    if (typeof callback === 'function') this.oneTimeCallback = callback;\n    // A listener that moved to another item, or destroyed the carousel, has\n    // already scrolled where it wanted.\n    if (this._syncActive(n, false)) this._scrollToIndex(n);\n  }\n\n  /**\n   * Stop auto-advance until start() is called. Without an `interval` there is\n   * nothing to stop and this does nothing.\n   */\n  pause() {\n    this._autoPaused = true;\n    this._syncAutoAdvance();\n  }\n\n  /** Resume auto-advance after pause(). */\n  start() {\n    this._autoPaused = false;\n    this._syncAutoAdvance();\n  }\n\n  next(n: number = 1) {\n    if (isNaN(n)) n = 1;\n    const index = this.center + n;\n    if (index >= this.count || index < 0) return;\n    this._cycleTo(index);\n  }\n\n  prev(n: number = 1) {\n    if (isNaN(n)) n = 1;\n    const index = this.center - n;\n    if (index >= this.count || index < 0) return;\n    this._cycleTo(index);\n  }\n\n  set(n: number, callback?: CarouselOptions['onCycleTo']) {\n    if (n === undefined || isNaN(n)) n = 0;\n    if (n >= this.count || n < 0) return;\n    this._cycleTo(n, callback);\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["el"]
+}

package/dist/js/chunks/{chunk-4TKTLGEM.mjs → chunk-4TRZ2AER.mjs}

@@ -1,9 +1,9 @@
-import {
-  Utils
-} from "./chunk-MNPROCZF.mjs";
 import {
   Component
-} from "./chunk-LTWPGFBR.mjs";
+} from "./chunk-CMGXGYUC.mjs";
+import {
+  Utils
+} from "./chunk-ZVLOUDIJ.mjs";
 
 // src/ts/components/commandPalette.ts
 var _defaults = {
@@ -12,9 +12,12 @@ var _defaults = {
 };
 var APPLE = typeof navigator !== "undefined" && /Mac|iPhone|iPad|iPod/.test(navigator.platform);
 var fold = (text) => text.normalize("NFD").replace(/\p{Diacritic}/gu, "").toLowerCase();
-var CommandPalette = class _CommandPalette extends Component {
+var CommandPalette = class extends Component {
+  // HTMLElement, not HTMLDialogElement: init() takes the element type from
+  // here, and has always accepted any HTMLElement.
   constructor(el, options) {
-    super(el, options, _CommandPalette);
+    const shortcut = el.dataset.shortcut;
+    super(el, { ...shortcut !== void 0 ? { shortcut: shortcut || null } : {}, ...options });
     this._active = null;
     this._generatedIds = [];
     /** Wires and refilters commands the page adds or removes later. */
@@ -30,14 +33,26 @@ var CommandPalette = class _CommandPalette extends Component {
     };
     this._handleInput = () => this._filter();
     this._handleKeydown = (e) => {
-      if (e.key === Utils.keys.ARROW_DOWN || e.key === Utils.keys.ARROW_UP) {
+      if (e.key === "ArrowDown" || e.key === "ArrowUp") {
         e.preventDefault();
-        this._move(e.key === Utils.keys.ARROW_DOWN ? 1 : -1);
-      } else if (e.key === Utils.keys.ENTER && !e.isComposing && e.keyCode !== 229 && this._active) {
+        this._move(e.key === "ArrowDown" ? 1 : -1);
+      } else if (e.key === "Enter" && !Utils.isComposing(e) && this._active) {
         e.preventDefault();
         this._run(this._active);
       }
     };
+    /**
+     * The first Escape clears a typed query and the next closes the palette.
+     * Chromium and Firefox clear a search input on their own; WebKit closed at
+     * once, and so did every engine for a text input. Escape that cancels an
+     * IME composition is left to the IME.
+     */
+    this._handleEscape = (e) => {
+      if (e.key !== "Escape" || !this.input.value || Utils.isComposing(e)) return;
+      e.preventDefault();
+      this.input.value = "";
+      this.input.dispatchEvent(new Event("input", { bubbles: true }));
+    };
     this._handleListClick = (e) => {
       const item = e.target.closest('[role="option"]');
       if (!item || !this.list.contains(item) || item.getAttribute("aria-disabled") === "true") return;
@@ -74,13 +89,6 @@ var CommandPalette = class _CommandPalette extends Component {
       if (this.el.open) this.close();
       else this.open();
     };
-    this.el["Expressive_CommandPalette"] = this;
-    const shortcut = el.dataset.shortcut;
-    this.options = {
-      ..._CommandPalette.defaults,
-      ...shortcut !== void 0 ? { shortcut: shortcut || null } : {},
-      ...options
-    };
     this.input = el.querySelector(":scope > input");
     this.list = el.querySelector(":scope > :is(ul, ol)");
     if (!this.input || !this.list) {
@@ -96,40 +104,25 @@ var CommandPalette = class _CommandPalette extends Component {
       attributes: true,
       attributeFilter: ["hidden", "disabled"]
     });
-    this.input.addEventListener("input", this._handleInput);
-    this.input.addEventListener("keydown", this._handleKeydown);
-    this.list.addEventListener("click", this._handleListClick);
-    this.list.addEventListener("pointermove", this._handlePointerMove);
-    this.el.addEventListener("close", this._handleClose);
-    document.addEventListener("keydown", this._handleShortcut);
+    const { signal } = this._events;
+    this.input.addEventListener("input", this._handleInput, { signal });
+    this.input.addEventListener("keydown", this._handleKeydown, { signal });
+    this.input.addEventListener("keydown", this._handleEscape, { signal });
+    this.list.addEventListener("click", this._handleListClick, { signal });
+    this.list.addEventListener("pointermove", this._handlePointerMove, { signal });
+    this.el.addEventListener("close", this._handleClose, { signal });
+    document.addEventListener("keydown", this._handleShortcut, { signal });
   }
   static get defaults() {
     return _defaults;
   }
-  /**
-   * Initializes instances of CommandPalette.
-   * @param els HTML elements.
-   * @param options Component options.
-   */
-  static init(els, options = {}) {
-    return super.init(els, options, _CommandPalette);
-  }
-  static getInstance(el) {
-    return el["Expressive_CommandPalette"];
-  }
   /** If the palette is open. */
   get isOpen() {
     return this.el.open;
   }
   destroy() {
     this._observer?.disconnect();
-    document.removeEventListener("keydown", this._handleShortcut);
-    this.el.removeEventListener("close", this._handleClose);
     if (this.input && this.list) {
-      this.input.removeEventListener("input", this._handleInput);
-      this.input.removeEventListener("keydown", this._handleKeydown);
-      this.list.removeEventListener("click", this._handleListClick);
-      this.list.removeEventListener("pointermove", this._handlePointerMove);
       for (const name of ["role", "aria-controls", "aria-expanded", "aria-autocomplete", "aria-activedescendant"]) {
         this.input.removeAttribute(name);
       }
@@ -147,7 +140,7 @@ var CommandPalette = class _CommandPalette extends Component {
       const empty = this._empty();
       if (empty) empty.hidden = false;
     }
-    this.el["Expressive_CommandPalette"] = void 0;
+    super.destroy();
   }
   _items() {
     return Array.from(this.list.children).filter(
@@ -255,8 +248,9 @@ var CommandPalette = class _CommandPalette extends Component {
     (this._action(item) ?? item).click();
   }
 };
+CommandPalette.key = "Expressive_CommandPalette";
 
 export {
   CommandPalette
 };
-//# sourceMappingURL=chunk-4TKTLGEM.mjs.map
+//# sourceMappingURL=chunk-4TRZ2AER.mjs.map