@expressivecss/expressive 0.10.1 → 0.12.0

package/dist/js/chunks/{chunk-N3UHGN3N.mjs → chunk-QVVEWBOF.mjs}

@@ -1,9 +1,9 @@
 import {
   Utils
-} from "./chunk-MISGHDUU.mjs";
+} from "./chunk-6OMRGML6.mjs";
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/expandingCard.ts
 var _defaults = {
@@ -172,4 +172,4 @@ export {
   EXPANDING_CARD_SELECTOR,
   ExpandingCard
 };
-//# sourceMappingURL=chunk-N3UHGN3N.mjs.map
+//# sourceMappingURL=chunk-QVVEWBOF.mjs.map

package/dist/js/chunks/{chunk-ZZBZI2XN.mjs → chunk-RFZZCYVU.mjs}

@@ -1,12 +1,12 @@
 import {
   Autocomplete
-} from "./chunk-7MM4VJJO.mjs";
+} from "./chunk-HLDXZ7XB.mjs";
 import {
   Utils
-} from "./chunk-MISGHDUU.mjs";
+} from "./chunk-6OMRGML6.mjs";
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/chips.ts
 var _defaults = {
@@ -50,7 +50,7 @@ var _Chips = class _Chips extends Component {
     this._handleInputKeydown = (e) => {
       _Chips._keydown = true;
       if (e.key === Utils.keys.ENTER) {
-        if (this.hasAutocomplete && this.autocomplete && this.autocomplete.isOpen) {
+        if (this.hasAutocomplete && this.autocomplete?.isOpen && this.autocomplete.container.querySelector('[role="option"]')) {
           return;
         }
         e.preventDefault();
@@ -116,6 +116,9 @@ var _Chips = class _Chips extends Component {
     return this.chipsData;
   }
   destroy() {
+    if (this.autocomplete && Autocomplete.getInstance(this._input) === this.autocomplete) {
+      this.autocomplete.destroy();
+    }
     if (this.options.allowUserInput) {
       this._removeEventHandlers();
     }
@@ -181,7 +184,7 @@ var _Chips = class _Chips extends Component {
     }
   }
   _renderChip(chip) {
-    if (!chip.id) return;
+    if (!chip.id && chip.id !== 0) return;
     const label = chip.text || chip.id;
     const renderedChip = document.createElement("span");
     renderedChip.classList.add("chip");
@@ -215,14 +218,16 @@ var _Chips = class _Chips extends Component {
   }
   _setupAutocomplete() {
     this.options.autocompleteOptions.onAutocomplete = (items) => {
-      if (items.length > 0)
+      if (_Chips.getInstance(this.el) !== this) return;
+      if (items.length > 0) {
         this.addChip({
           id: items[0].id,
           text: items[0].text,
           image: items[0].image
         });
-      this._input.value = "";
-      this._input.focus();
+        this._input.value = "";
+        this._input.focus();
+      }
     };
     this.autocomplete = Autocomplete.init(this._input, this.options.autocompleteOptions);
   }
@@ -243,6 +248,7 @@ var _Chips = class _Chips extends Component {
     if (this._label && this._input) this._label.setAttribute("for", this._input.getAttribute("id"));
   }
   _setPlaceholder() {
+    if (!this._input) return;
     if (this.chipsData !== void 0 && !this.chipsData.length && this.options.placeholder) {
       this._input.placeholder = this.options.placeholder;
     } else if ((this.chipsData === void 0 || !!this.chipsData.length) && this.options.secondaryPlaceholder) {
@@ -250,7 +256,7 @@ var _Chips = class _Chips extends Component {
     }
   }
   _isValidAndNotExist(chip) {
-    const isValid = !!chip.id;
+    const isValid = !!chip.id || chip.id === 0;
     const doesNotExist = !this.chipsData.some((item) => item.id == chip.id);
     return isValid && doesNotExist;
   }
@@ -263,7 +269,8 @@ var _Chips = class _Chips extends Component {
     const renderedChip = this._renderChip(chip);
     this._chips.push(renderedChip);
     this.chipsData.push(chip);
-    this._input.before(renderedChip);
+    if (this._input) this._input.before(renderedChip);
+    else this.el.append(renderedChip);
     this._setPlaceholder();
     if (typeof this.options.onChipAdd === "function") {
       this.options.onChipAdd(this.el, renderedChip);
@@ -335,4 +342,4 @@ var Chips = _Chips;
 export {
   Chips
 };
-//# sourceMappingURL=chunk-ZZBZI2XN.mjs.map
+//# sourceMappingURL=chunk-RFZZCYVU.mjs.map

package/dist/js/chunks/chunk-RFZZCYVU.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/chips.ts"],
+  "sourcesContent": ["import { Utils } from '../core/utils';\nimport { Autocomplete, AutocompleteOptions } from './autocomplete';\nimport { Component, BaseOptions, InitElements, InitElement } from '../core/component';\n\nexport interface ChipData {\n  /**\n   * Unique identifier.\n   */\n  id: number | string;\n  /**\n   * Chip text. If not specified, \"id\" will be used.\n   */\n  text?: string;\n  /**\n   * Chip image (URL).\n   */\n  image?: string;\n}\n\nexport interface ChipsI18nOptions {\n  /** Prefix for the delete button's accessible name. */\n  remove: string;\n}\n\nexport interface ChipsOptions extends BaseOptions {\n  /**\n   * Set the chip data.\n   * @default []\n   */\n  data: ChipData[];\n  /**\n   * Set first placeholder when there are no tags.\n   * @default \"\"\n   */\n  placeholder: string;\n  /**\n   * Set second placeholder when adding additional tags.\n   * @default \"\"\n   */\n  secondaryPlaceholder: string;\n  /**\n   * Set autocomplete options.\n   * @default {}\n   */\n  autocompleteOptions: Partial<AutocompleteOptions>;\n  /**\n   * Toggles abililty to add custom value not in autocomplete list.\n   * @default false\n   */\n  autocompleteOnly: boolean;\n  /**\n   * Set chips limit.\n   * @default Infinity\n   */\n  limit: number;\n  /**\n   * Specifies class to be used in \"close\" button.\n   * @default 'material-symbols'\n   */\n  closeIconClass: string;\n  /**\n   *  Specifies option to render user input field\n   *  @default false;\n   */\n  allowUserInput: boolean;\n  /**\n   * Strings the component generates. `remove` prefixes the delete button's\n   * accessible name, giving \"Remove Apple\".\n   * @default { remove: 'Remove' }\n   */\n  i18n: Partial<ChipsI18nOptions>;\n  /**\n   * Callback for chip add.\n   * @default null\n   */\n  onChipAdd: (element: HTMLElement, chip: HTMLElement) => void;\n  /**\n   * Callback for chip select.\n   * @default null\n   */\n  onChipSelect: (element: HTMLElement, chip: HTMLElement) => void;\n  /**\n   * Callback for chip delete.\n   * @default null\n   */\n  onChipDelete: (element: HTMLElement, chip: HTMLElement) => void;\n}\n\nconst _defaults: ChipsOptions = {\n  data: [],\n  placeholder: '',\n  secondaryPlaceholder: '',\n  closeIconClass: 'material-symbols',\n  autocompleteOptions: {},\n  autocompleteOnly: false,\n  limit: Infinity,\n  allowUserInput: false,\n  i18n: { remove: 'Remove' },\n  onChipAdd: null,\n  onChipSelect: null,\n  onChipDelete: null\n};\n\nexport class Chips extends Component<ChipsOptions> {\n  /** Array of the current chips data. */\n  chipsData: ChipData[];\n  /** If the chips has autocomplete enabled. */\n  hasAutocomplete: boolean;\n  /** Autocomplete instance, if any. */\n  autocomplete: Autocomplete;\n  _input: HTMLInputElement;\n  _label: HTMLLabelElement;\n  _chips: HTMLElement[];\n  static _keydown: boolean;\n  private _selectedChip: HTMLElement;\n\n  /**\n   * Selection is drawn by a class now, not by `:focus`, so it does not clear\n   * itself when focus moves - every path that changes the selection has to go\n   * through here or the class and the field drift apart.\n   *\n   * Deliberately no `aria-selected`: the chip is not an option in a listbox,\n   * and putting the attribute on an element with no such role is the same\n   * defect the semantics standard exists to remove.\n   */\n  private _setSelected(chip: HTMLElement | null) {\n    this._selectedChip?.classList.remove('selected');\n    this._selectedChip = chip;\n    chip?.classList.add('selected');\n  }\n\n  constructor(el: HTMLElement, options: Partial<ChipsOptions>) {\n    super(el, options, Chips);\n    this.el['Expressive_Chips'] = this;\n\n    this.options = {\n      ...Chips.defaults,\n      ...options\n    };\n    // Spreading options over the defaults replaces the i18n object wholesale,\n    // so passing one string would drop the rest. Same fix as Datepicker.\n    if (options?.i18n) this.options.i18n = { ...Chips.defaults.i18n, ...options.i18n };\n\n    this.el.classList.add('chips');\n    this.chipsData = [];\n    this._chips = [];\n\n    // Render initial chips\n    if (this.options.data.length) {\n      this.chipsData = this.options.data;\n      this._renderChips();\n    }\n\n    // Render input element, setup event handlers\n    if (this.options.allowUserInput) {\n      this.el.classList.add('field');\n      this._setupInput();\n      this._setupEventHandlers();\n      // move input to end\n      this.el.append(this._input);\n    }\n    // After _setupInput: the label points at the input's id, which is only\n    // assigned there. Running this first threw on any .chips with a <label>.\n    this._setupLabel();\n  }\n\n  static get defaults() {\n    return _defaults;\n  }\n\n  /**\n   * Initializes instance of Chips.\n   * @param el HTML element.\n   * @param options Component options.\n   */\n  static init(el: HTMLElement, options?: Partial<ChipsOptions>): Chips;\n  /**\n   * Initializes instances of Chips.\n   * @param els HTML elements.\n   * @param options Component options.\n   */\n  static init(els: InitElements<InitElement>, options?: Partial<ChipsOptions>): Chips[];\n  /**\n   * Initializes instances of Chips.\n   * @param els HTML elements.\n   * @param options Component options.\n   */\n  static init(\n    els: HTMLElement | InitElements<InitElement>,\n    options: Partial<ChipsOptions> = {}\n  ): Chips | Chips[] {\n    return super.init(els, options, Chips);\n  }\n\n  static getInstance(el: HTMLElement): Chips {\n    return el['Expressive_Chips'];\n  }\n\n  getData() {\n    return this.chipsData;\n  }\n\n  destroy() {\n    if (this.autocomplete && Autocomplete.getInstance(this._input) === this.autocomplete) {\n      this.autocomplete.destroy();\n    }\n    if (this.options.allowUserInput) {\n      this._removeEventHandlers();\n    }\n    this._chips.forEach((c) => c.remove());\n    this._chips = [];\n    this.el['Expressive_Chips'] = undefined;\n  }\n\n  _setupEventHandlers() {\n    this.el.addEventListener('click', this._handleChipClick);\n    this.el.addEventListener('keydown', Chips._handleChipsKeydown);\n    this.el.addEventListener('keyup', Chips._handleChipsKeyup);\n    this.el.addEventListener('blur', Chips._handleChipsBlur, true);\n    this._input.addEventListener('focus', this._handleInputFocus);\n    this._input.addEventListener('blur', this._handleInputBlur);\n    this._input.addEventListener('keydown', this._handleInputKeydown);\n  }\n\n  _removeEventHandlers() {\n    this.el.removeEventListener('click', this._handleChipClick);\n    this.el.removeEventListener('keydown', Chips._handleChipsKeydown);\n    this.el.removeEventListener('keyup', Chips._handleChipsKeyup);\n    this.el.removeEventListener('blur', Chips._handleChipsBlur, true);\n    this._input.removeEventListener('focus', this._handleInputFocus);\n    this._input.removeEventListener('blur', this._handleInputBlur);\n    this._input.removeEventListener('keydown', this._handleInputKeydown);\n  }\n\n  _handleChipClick = (e: MouseEvent) => {\n    const _chip = (<HTMLElement>e.target).closest('.chip');\n    // closest, not classList: the close button now wraps an icon span, so a\n    // click on the glyph reports the span as the target.\n    const clickedClose = !!(<HTMLElement>e.target).closest('.close');\n    if (_chip) {\n      // Index into the chip list, not into the container's children: the\n      // container also holds the label and the input, so counting children\n      // gave an index that did not line up with chipsData.\n      const index = this._chips.indexOf(_chip as HTMLElement);\n      if (index < 0) return;\n      if (clickedClose) {\n        this._deleteChip(index, 'input');\n      } else {\n        this.selectChip(index);\n      }\n      // Default handle click to focus on input\n    } else {\n      this._input.focus();\n    }\n  };\n\n  static _handleChipsKeydown(e: KeyboardEvent) {\n    Chips._keydown = true;\n    const chips = (<HTMLElement>e.target).closest('.chips');\n    const chipsKeydown = e.target && chips;\n\n    // Don't handle keydown inputs on input and textarea\n    const tag = (<HTMLElement>e.target).tagName;\n    if (tag === 'INPUT' || tag === 'TEXTAREA' || !chipsKeydown) return;\n\n    const currChips: Chips = chips['Expressive_Chips'];\n    if (!currChips) return; // .chips markup without an instance behind it\n\n    if (e.key === Utils.keys.BACKSPACE || e.key === Utils.keys.DELETE) {\n      const index = currChips._chips.indexOf((e.target as HTMLElement).closest('.chip'));\n      if (index < 0) return;\n      e.preventDefault();\n      currChips._deleteChip(index, 'previous');\n    } else if (e.key === Utils.keys.ARROW_LEFT) {\n      if (currChips._selectedChip) {\n        const selectIndex = currChips._chips.indexOf(currChips._selectedChip) - 1;\n        if (selectIndex < 0) return;\n        currChips.selectChip(selectIndex);\n      }\n    } else if (e.key === Utils.keys.ARROW_RIGHT) {\n      if (currChips._selectedChip) {\n        const selectIndex = currChips._chips.indexOf(currChips._selectedChip) + 1;\n        if (selectIndex >= currChips.chipsData.length) {\n          // Walking off the end returns to the input, so nothing is selected\n          // any more - without this the last chip kept the class.\n          currChips._setSelected(null);\n          currChips._input.focus();\n        }\n        else currChips.selectChip(selectIndex);\n      }\n    }\n  }\n\n  static _handleChipsKeyup() {\n    Chips._keydown = false;\n  }\n\n  static _handleChipsBlur(e: Event) {\n    if (!Chips._keydown && document.hidden) {\n      const chips = (<HTMLElement>e.target).closest('.chips');\n      const currChips: Chips = chips?.['Expressive_Chips'];\n      if (currChips) currChips._setSelected(null);\n    }\n  }\n\n  _handleInputFocus = () => {\n    this.el.classList.add('focus');\n  };\n\n  _handleInputBlur = () => {\n    this.el.classList.remove('focus');\n  };\n\n  _handleInputKeydown = (e: KeyboardEvent) => {\n    Chips._keydown = true;\n    if (e.key === Utils.keys.ENTER) {\n      // Override enter if autocompleting.\n      if (this.hasAutocomplete && this.autocomplete?.isOpen &&\n        this.autocomplete.container.querySelector('[role=\"option\"]')) {\n        return;\n      }\n      e.preventDefault();\n      if (!this.hasAutocomplete || (this.hasAutocomplete && !this.options.autocompleteOnly)) {\n        this.addChip({ id: this._input.value });\n      }\n      this._input.value = '';\n    } else if (\n      (e.key === Utils.keys.BACKSPACE || e.key === Utils.keys.ARROW_LEFT) &&\n      this._input.value === '' &&\n      this.chipsData.length\n    ) {\n      e.preventDefault();\n      this.selectChip(this.chipsData.length - 1);\n    }\n  };\n\n  _renderChip(chip: ChipData): HTMLElement {\n    if (!chip.id && chip.id !== 0) return;\n    const label = chip.text || <string>chip.id;\n    // <span>, not <div>: a chip is inline, and the container itself is not a\n    // control. It used to be a <div tabindex=\"0\"> with no role - focusable,\n    // and announcing nothing.\n    const renderedChip = document.createElement('span');\n    renderedChip.classList.add('chip');\n    renderedChip.innerText = label;\n    // attach image if needed\n    if (chip.image) {\n      const img = document.createElement('img');\n      img.setAttribute('src', chip.image);\n      renderedChip.insertBefore(img, renderedChip.firstChild);\n    }\n    if (this.options.allowUserInput) {\n      // The delete affordance is the control, so it is the <button> and it\n      // carries the name. `type` is explicit because a bare button inside a\n      // form submits it.\n      const closeButton = document.createElement('button');\n      closeButton.type = 'button';\n      closeButton.classList.add('close');\n      closeButton.setAttribute('aria-label', `${this.options.i18n.remove} ${label}`);\n      // The ligature is text and is read out, so the glyph is hidden and the\n      // button's own label is what gets announced.\n      const closeIcon = document.createElement('span');\n      closeIcon.classList.add(this.options.closeIconClass);\n      closeIcon.setAttribute('aria-hidden', 'true');\n      closeIcon.innerText = 'close';\n      closeButton.appendChild(closeIcon);\n      renderedChip.appendChild(closeButton);\n    }\n    return renderedChip;\n  }\n\n  _renderChips() {\n    this._chips = []; //.remove();\n    for (let i = 0; i < this.chipsData.length; i++) {\n      const chipElem = this._renderChip(this.chipsData[i]);\n      this.el.appendChild(chipElem);\n      this._chips.push(chipElem);\n    }\n  }\n\n  _setupAutocomplete() {\n    this.options.autocompleteOptions.onAutocomplete = (items) => {\n      if (Chips.getInstance(this.el) !== this) return;\n      if (items.length > 0) {\n        this.addChip({\n          id: items[0].id,\n          text: items[0].text,\n          image: items[0].image\n        });\n        this._input.value = '';\n        this._input.focus();\n      }\n    };\n    this.autocomplete = Autocomplete.init(this._input, this.options.autocompleteOptions);\n  }\n\n  _setupInput() {\n    this._input = this.el.querySelector('input');\n    if (!this._input) {\n      this._input = document.createElement('input');\n      this.el.append(this._input);\n    }\n    this._input.classList.add('input');\n    this.hasAutocomplete = Object.keys(this.options.autocompleteOptions).length > 0;\n    // Setup autocomplete if needed\n    if (this.hasAutocomplete) this._setupAutocomplete();\n    this._setPlaceholder();\n    // Set input id\n    if (!this._input.getAttribute('id')) this._input.setAttribute('id', Utils.guid());\n  }\n\n  _setupLabel() {\n    this._label = this.el.querySelector('label');\n    // No input to point at when allowUserInput is off.\n    if (this._label && this._input) this._label.setAttribute('for', this._input.getAttribute('id'));\n  }\n\n  _setPlaceholder() {\n    if (!this._input) return;\n    if (this.chipsData !== undefined && !this.chipsData.length && this.options.placeholder) {\n      this._input.placeholder = this.options.placeholder;\n    } else if (\n      (this.chipsData === undefined || !!this.chipsData.length) &&\n      this.options.secondaryPlaceholder\n    ) {\n      this._input.placeholder = this.options.secondaryPlaceholder;\n    }\n  }\n\n  _isValidAndNotExist(chip: ChipData) {\n    const isValid = !!chip.id || chip.id === 0;\n    const doesNotExist = !this.chipsData.some((item) => item.id == chip.id);\n    return isValid && doesNotExist;\n  }\n\n  /**\n   * Add chip to input.\n   * @param chip Chip data object\n   */\n  addChip(chip: ChipData) {\n    if (!this._isValidAndNotExist(chip) || this.chipsData.length >= this.options.limit) return;\n    const renderedChip = this._renderChip(chip);\n    this._chips.push(renderedChip);\n    this.chipsData.push(chip);\n    if (this._input) this._input.before(renderedChip);\n    else this.el.append(renderedChip);\n    this._setPlaceholder();\n    // fire chipAdd callback\n    if (typeof this.options.onChipAdd === 'function') {\n      this.options.onChipAdd(this.el, renderedChip);\n    }\n  }\n\n  /**\n   * Delete nth chip.\n   * @param chipIndex  Index of chip\n   */\n  deleteChip(chipIndex: number) {\n    const root = this.el.getRootNode() as Document | ShadowRoot;\n    this._deleteChip(chipIndex, this._chips[chipIndex]?.contains(root.activeElement) ? 'input' : null);\n  }\n\n  private _deleteChip(chipIndex: number, focus: 'input' | 'previous' | null) {\n    const chip = this._chips[chipIndex];\n    if (!chip) return;\n    if (this._selectedChip === chip) this._setSelected(null);\n    chip.remove();\n    this._chips.splice(chipIndex, 1);\n    this.chipsData.splice(chipIndex, 1);\n    this._setPlaceholder();\n    const focusPath: { root: Document | ShadowRoot; element: Element | null }[] = [];\n    let root = this.el.getRootNode() as Document | ShadowRoot;\n    while (root) {\n      focusPath.push({ root, element: root.activeElement });\n      root = 'host' in root ? root.host.getRootNode() as Document | ShadowRoot : null;\n    }\n    // fire chipDelete callback\n    if (typeof this.options.onChipDelete === 'function') {\n      this.options.onChipDelete(this.el, chip);\n    }\n    if (!focus || focusPath.some(({ root, element }) => root.activeElement !== element) || this.el['Expressive_Chips'] !== this) return;\n    if (focus === 'previous' && this._chips.length) this.selectChip(Math.max(chipIndex - 1, 0));\n    else {\n      this._setSelected(null);\n      this._input?.focus();\n    }\n  }\n\n  /**\n   * Select nth chip.\n   * @param chipIndex Index of chip\n   */\n  selectChip(chipIndex: number) {\n    const chip = this._chips[chipIndex];\n    if (!chip) return;\n    this._setSelected(chip);\n    // The chip is not a control any more, so focus goes to the one thing in it\n    // that is - the delete button.\n    (chip.querySelector('.close') as HTMLElement | null)?.focus();\n    // fire chipSelect callback\n    if (typeof this.options.onChipSelect === 'function') {\n      this.options.onChipSelect(this.el, chip);\n    }\n  }\n\n  static Init() {\n    // Handle removal of static chips - markup written by hand, with no Chips\n    // instance behind it. Where there *is* an instance, _handleChipClick owns\n    // the close button: removing the node here as well left chipsData holding\n    // an entry whose element was gone.\n    Utils.onDocumentReady(() => {\n      const chips = document.querySelectorAll('.chips');\n      chips.forEach((el) => {\n        el.addEventListener('click', (e) => {\n          if (el['Expressive_Chips']) return;\n          // closest: the close button wraps an icon span, so a click on the\n          // glyph reports the span.\n          if ((<HTMLElement>e.target).closest('.close')) {\n            const chip = (<HTMLElement>e.target).closest('.chip');\n            if (chip) chip.remove();\n          }\n        });\n      });\n    });\n  }\n\n  static {\n    Chips._keydown = false;\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["root"]
+}

package/dist/js/chunks/{chunk-TYM6U5DY.mjs → chunk-UAEAQBRC.mjs}

@@ -1,6 +1,6 @@
 import {
   Utils
-} from "./chunk-MISGHDUU.mjs";
+} from "./chunk-6OMRGML6.mjs";
 
 // src/ts/behaviors/dialogs.ts
 var _Dialogs = class _Dialogs {
@@ -73,4 +73,4 @@ var Dialogs = _Dialogs;
 export {
   Dialogs
 };
-//# sourceMappingURL=chunk-TYM6U5DY.mjs.map
+//# sourceMappingURL=chunk-UAEAQBRC.mjs.map

package/dist/js/chunks/{chunk-7UXHSYIA.mjs → chunk-UBLRRJ7N.mjs}

@@ -1,9 +1,9 @@
 import {
   Utils
-} from "./chunk-MISGHDUU.mjs";
+} from "./chunk-6OMRGML6.mjs";
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/cards.ts
 var _defaults = {
@@ -180,4 +180,4 @@ export {
   isCardReveal,
   Cards
 };
-//# sourceMappingURL=chunk-7UXHSYIA.mjs.map
+//# sourceMappingURL=chunk-UBLRRJ7N.mjs.map

package/dist/js/chunks/{chunk-EP3CVKB5.mjs → chunk-UEZUJQ66.mjs}

@@ -1,6 +1,6 @@
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/appBar.ts
 var _defaults = {};
@@ -15,7 +15,10 @@ var AppBar = class _AppBar extends Component {
     this._onIntersect = (entries) => {
       const entry = entries[0];
       if (!entry) return;
-      this.el.classList.toggle("collapsed", !entry.isIntersecting);
+      this.el.classList.toggle(
+        "collapsed",
+        !entry.isIntersecting && entry.boundingClientRect.top < this.el.getBoundingClientRect().top
+      );
     };
     this._onSearchViewClose = () => {
       this._searchOpen = this._view.open;
@@ -62,8 +65,8 @@ var AppBar = class _AppBar extends Component {
     if (typeof IntersectionObserver === "undefined") return;
     this._sentinel = document.createElement("span");
     this._sentinel.setAttribute("aria-hidden", "true");
-    this._sentinel.style.cssText = "display:block;width:100%;height:1px;margin-top:-1px;pointer-events:none;visibility:hidden";
-    this.el.insertAdjacentElement("beforebegin", this._sentinel);
+    this._sentinel.style.cssText = "display:block;height:0;position:relative;top:-64px;pointer-events:none;visibility:hidden";
+    this.el.insertAdjacentElement("afterend", this._sentinel);
     this._observer = new IntersectionObserver(this._onIntersect);
     this._observer.observe(this._sentinel);
   }
@@ -85,4 +88,4 @@ var AppBar = class _AppBar extends Component {
 export {
   AppBar
 };
-//# sourceMappingURL=chunk-EP3CVKB5.mjs.map
+//# sourceMappingURL=chunk-UEZUJQ66.mjs.map

package/dist/js/chunks/chunk-UEZUJQ66.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/appBar.ts"],
+  "sourcesContent": ["import { Component, BaseOptions, InitElements, InitElement } from '../core/component';\n\nconst _defaults: BaseOptions = {};\n\n/**\n * Collapse medium/large flexible app bars on scroll, and open the related\n * search view when the search field in a search app bar is selected.\n *\n * Observation is IntersectionObserver on a sentinel after the header.\n * A scroll listener would re-enter layout on every tick; this does not.\n */\nexport class AppBar extends Component<BaseOptions> {\n  private _observer: IntersectionObserver | null = null;\n  private _sentinel: HTMLElement | null = null;\n  private _input: HTMLInputElement | null = null;\n  private _view: HTMLElement | null = null;\n  private _searchOpen = false;\n\n  constructor(el: HTMLElement, options: Partial<BaseOptions>) {\n    super(el, options, AppBar);\n    this.el['Expressive_AppBar'] = this;\n    this.options = { ...AppBar.defaults, ...options };\n    this._setupCollapse();\n    this._setupSearch();\n  }\n\n  static get defaults(): BaseOptions {\n    return _defaults;\n  }\n\n  static init(el: HTMLElement, options?: Partial<BaseOptions>): AppBar;\n  static init(els: InitElements<InitElement>, options?: Partial<BaseOptions>): AppBar[];\n  static init(\n    els: HTMLElement | InitElements<InitElement>,\n    options: Partial<BaseOptions> = {}\n  ): AppBar | AppBar[] {\n    return super.init(els, options, AppBar);\n  }\n\n  static getInstance(el: HTMLElement): AppBar {\n    return el['Expressive_AppBar'];\n  }\n\n  destroy() {\n    this._observer?.disconnect();\n    this._observer = null;\n    this._sentinel?.remove();\n    this._sentinel = null;\n    this._input?.removeEventListener('focus', this._onSearchFocus);\n    this._input?.removeEventListener('click', this._onSearchFocus);\n    this._view?.removeEventListener('close', this._onSearchViewClose);\n    this.el.classList.remove('collapsed');\n    this.el['Expressive_AppBar'] = undefined;\n  }\n\n  private _setupCollapse() {\n    if (!this.el.classList.contains('medium') && !this.el.classList.contains('large')) {\n      return;\n    }\n    if (typeof IntersectionObserver === 'undefined') return;\n\n    // Collapsing shrinks the header, and scroll anchoring then scrolls the page\n    // back by the height it lost. The sentinel follows the header, so it moves\n    // with the page and that correction cannot bring it back into view. It sits\n    // 64px, the small bar's height, above the header's bottom edge. An expanded\n    // bar therefore collapses once the page has scrolled by the height that\n    // collapsing removes, and a collapsed bar expands when the page is back at\n    // its top. Zero height and no margins keep it out of the layout.\n    this._sentinel = document.createElement('span');\n    this._sentinel.setAttribute('aria-hidden', 'true');\n    this._sentinel.style.cssText =\n      'display:block;height:0;position:relative;top:-64px;pointer-events:none;visibility:hidden';\n    this.el.insertAdjacentElement('afterend', this._sentinel);\n    this._observer = new IntersectionObserver(this._onIntersect);\n    this._observer.observe(this._sentinel);\n  }\n\n  private _onIntersect = (entries: IntersectionObserverEntry[]) => {\n    const entry = entries[0];\n    if (!entry) return;\n    // Collapse only when the sentinel has gone above the pinned header. A\n    // sentinel below the viewport would move back into view as the bar shrank,\n    // and the bar would switch sizes on every frame.\n    this.el.classList.toggle(\n      'collapsed',\n      !entry.isIntersecting && entry.boundingClientRect.top < this.el.getBoundingClientRect().top\n    );\n  };\n\n  private _setupSearch() {\n    this._input = this.el.querySelector('input[type=\"search\"]');\n    if (!this._input) return;\n\n    const id = this._input.getAttribute('aria-controls');\n    if (id) this._view = document.getElementById(id);\n    if (!this._view) this._view = this.el.querySelector('.search-view');\n    if (!this._view) return;\n\n    this._input.addEventListener('focus', this._onSearchFocus);\n    this._input.addEventListener('click', this._onSearchFocus);\n    if (this._view instanceof HTMLDialogElement) {\n      this._view.addEventListener('close', this._onSearchViewClose);\n    }\n  }\n\n  private _onSearchViewClose = () => {\n    this._searchOpen = (this._view as HTMLDialogElement).open;\n  };\n\n  private _onSearchFocus = () => {\n    if (!this._view || this._searchOpen) return;\n    if (this._view instanceof HTMLDialogElement) {\n      this._searchOpen = true;\n      if (!this._view.open) this._view.showModal();\n      return;\n    }\n    this._view.hidden = false;\n    this._input?.setAttribute('aria-expanded', 'true');\n  };\n}\n"],
+  "mappings": ";;;;;AAEA,IAAM,YAAyB,CAAC;AASzB,IAAM,SAAN,MAAM,gBAAe,UAAuB;AAAA,EAOjD,YAAY,IAAiB,SAA+B;AAC1D,UAAM,IAAI,SAAS,OAAM;AAP3B,SAAQ,YAAyC;AACjD,SAAQ,YAAgC;AACxC,SAAQ,SAAkC;AAC1C,SAAQ,QAA4B;AACpC,SAAQ,cAAc;AA6DtB,SAAQ,eAAe,CAAC,YAAyC;AAC/D,YAAM,QAAQ,QAAQ,CAAC;AACvB,UAAI,CAAC,MAAO;AAIZ,WAAK,GAAG,UAAU;AAAA,QAChB;AAAA,QACA,CAAC,MAAM,kBAAkB,MAAM,mBAAmB,MAAM,KAAK,GAAG,sBAAsB,EAAE;AAAA,MAC1F;AAAA,IACF;AAkBA,SAAQ,qBAAqB,MAAM;AACjC,WAAK,cAAe,KAAK,MAA4B;AAAA,IACvD;AAEA,SAAQ,iBAAiB,MAAM;AAC7B,UAAI,CAAC,KAAK,SAAS,KAAK,YAAa;AACrC,UAAI,KAAK,iBAAiB,mBAAmB;AAC3C,aAAK,cAAc;AACnB,YAAI,CAAC,KAAK,MAAM,KAAM,MAAK,MAAM,UAAU;AAC3C;AAAA,MACF;AACA,WAAK,MAAM,SAAS;AACpB,WAAK,QAAQ,aAAa,iBAAiB,MAAM;AAAA,IACnD;AAlGE,SAAK,GAAG,mBAAmB,IAAI;AAC/B,SAAK,UAAU,EAAE,GAAG,QAAO,UAAU,GAAG,QAAQ;AAChD,SAAK,eAAe;AACpB,SAAK,aAAa;AAAA,EACpB;AAAA,EAEA,WAAW,WAAwB;AACjC,WAAO;AAAA,EACT;AAAA,EAIA,OAAO,KACL,KACA,UAAgC,CAAC,GACd;AACnB,WAAO,MAAM,KAAK,KAAK,SAAS,OAAM;AAAA,EACxC;AAAA,EAEA,OAAO,YAAY,IAAyB;AAC1C,WAAO,GAAG,mBAAmB;AAAA,EAC/B;AAAA,EAEA,UAAU;AACR,SAAK,WAAW,WAAW;AAC3B,SAAK,YAAY;AACjB,SAAK,WAAW,OAAO;AACvB,SAAK,YAAY;AACjB,SAAK,QAAQ,oBAAoB,SAAS,KAAK,cAAc;AAC7D,SAAK,QAAQ,oBAAoB,SAAS,KAAK,cAAc;AAC7D,SAAK,OAAO,oBAAoB,SAAS,KAAK,kBAAkB;AAChE,SAAK,GAAG,UAAU,OAAO,WAAW;AACpC,SAAK,GAAG,mBAAmB,IAAI;AAAA,EACjC;AAAA,EAEQ,iBAAiB;AACvB,QAAI,CAAC,KAAK,GAAG,UAAU,SAAS,QAAQ,KAAK,CAAC,KAAK,GAAG,UAAU,SAAS,OAAO,GAAG;AACjF;AAAA,IACF;AACA,QAAI,OAAO,yBAAyB,YAAa;AASjD,SAAK,YAAY,SAAS,cAAc,MAAM;AAC9C,SAAK,UAAU,aAAa,eAAe,MAAM;AACjD,SAAK,UAAU,MAAM,UACnB;AACF,SAAK,GAAG,sBAAsB,YAAY,KAAK,SAAS;AACxD,SAAK,YAAY,IAAI,qBAAqB,KAAK,YAAY;AAC3D,SAAK,UAAU,QAAQ,KAAK,SAAS;AAAA,EACvC;AAAA,EAcQ,eAAe;AACrB,SAAK,SAAS,KAAK,GAAG,cAAc,sBAAsB;AAC1D,QAAI,CAAC,KAAK,OAAQ;AAElB,UAAM,KAAK,KAAK,OAAO,aAAa,eAAe;AACnD,QAAI,GAAI,MAAK,QAAQ,SAAS,eAAe,EAAE;AAC/C,QAAI,CAAC,KAAK,MAAO,MAAK,QAAQ,KAAK,GAAG,cAAc,cAAc;AAClE,QAAI,CAAC,KAAK,MAAO;AAEjB,SAAK,OAAO,iBAAiB,SAAS,KAAK,cAAc;AACzD,SAAK,OAAO,iBAAiB,SAAS,KAAK,cAAc;AACzD,QAAI,KAAK,iBAAiB,mBAAmB;AAC3C,WAAK,MAAM,iBAAiB,SAAS,KAAK,kBAAkB;AAAA,IAC9D;AAAA,EACF;AAgBF;",
+  "names": []
+}

package/dist/js/chunks/{chunk-JNPIWFJT.mjs → chunk-UNEMYWEW.mjs}

@@ -1,9 +1,9 @@
 import {
   Utils
-} from "./chunk-MISGHDUU.mjs";
+} from "./chunk-6OMRGML6.mjs";
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/lightbox.ts
 var _defaults = {
@@ -362,4 +362,4 @@ var Lightbox = _Lightbox;
 export {
   Lightbox
 };
-//# sourceMappingURL=chunk-JNPIWFJT.mjs.map
+//# sourceMappingURL=chunk-UNEMYWEW.mjs.map

package/dist/js/chunks/{chunk-JKNPQQWY.mjs → chunk-WJXDBPXQ.mjs}

@@ -1,12 +1,13 @@
 import {
   Utils
-} from "./chunk-MISGHDUU.mjs";
+} from "./chunk-6OMRGML6.mjs";
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/slider.ts
 var _defaults = {};
+var _authored = /* @__PURE__ */ new WeakMap();
 var Slider = class _Slider extends Component {
   constructor(el, options) {
     super(el, options, _Slider);
@@ -75,6 +76,18 @@ var Slider = class _Slider extends Component {
     this._removeEventHandlers();
     this._removeThumb();
     this.el["Expressive_Slider"] = void 0;
+    const host = this._host();
+    for (const el of [this.el, host]) {
+      for (const name in _authored.get(el)) el.style.setProperty(name, _authored.get(el)[name]);
+      _authored.delete(el);
+    }
+    host?.querySelectorAll('input[type="range"]').forEach((el) => el["Expressive_Slider"]?._sync());
+  }
+  _set(el, name, value) {
+    const authored = _authored.get(el) ?? {};
+    _authored.set(el, authored);
+    authored[name] ?? (authored[name] = el.style.getPropertyValue(name));
+    el.style.setProperty(name, value);
   }
   // Eleven listeners used to cover four stages, because each one was written
   // twice - once for mouse, once for touch. One of the touch spellings,
@@ -145,25 +158,28 @@ var Slider = class _Slider extends Component {
     const handle = parseFloat(style.getPropertyValue("--md-comp-slider-handle-width")) || 4;
     const length = vertical ? height : width;
     const position = handle / 2 + percent * (length - handle);
-    this.el.style.setProperty("--md-comp-slider-active-fraction", fraction);
-    this.el.style.setProperty("--md-comp-slider-active-position", `${position}px`);
+    this._set(this.el, "--md-comp-slider-active-fraction", fraction);
+    this._set(this.el, "--md-comp-slider-active-position", `${position}px`);
     const host = this._host();
     const peers = host?.querySelectorAll('input[type="range"]');
     if (host && peers && peers.length === 2) {
       const nums = Array.from(peers).map((el) => this._fraction(el));
-      host.style.setProperty("--md-comp-slider-start-fraction", `${Math.min(...nums) * 100}%`);
-      host.style.setProperty("--md-comp-slider-end-fraction", `${Math.max(...nums) * 100}%`);
-      host.style.setProperty("--md-comp-slider-start-position", `${handle / 2 + Math.min(...nums) * (length - handle)}px`);
-      host.style.setProperty("--md-comp-slider-end-position", `${handle / 2 + Math.max(...nums) * (length - handle)}px`);
+      this._set(host, "--md-comp-slider-start-fraction", `${Math.min(...nums) * 100}%`);
+      this._set(host, "--md-comp-slider-end-fraction", `${Math.max(...nums) * 100}%`);
+      this._set(host, "--md-comp-slider-start-position", `${handle / 2 + Math.min(...nums) * (length - handle)}px`);
+      this._set(host, "--md-comp-slider-end-position", `${handle / 2 + Math.max(...nums) * (length - handle)}px`);
     }
     if (host?.classList.contains("stops")) {
       const parsedMax = parseFloat(this.el.max);
       const max = Number.isNaN(parsedMax) ? 100 : parsedMax;
       const min = parseFloat(this.el.min) || 0;
       const step = parseFloat(this.el.step);
-      if (step > 0 && Number.isFinite(step)) {
-        const n = Math.round((max - min) / step) + 1;
-        host.style.setProperty("--md-comp-slider-stop-count", String(Math.max(2, n)));
+      const stops = step > 0 && Number.isFinite(step) && max > min;
+      this._set(host, "--md-comp-slider-stop-count", stops ? String(Math.floor((max - min) / step + 1e-9) + 1) : "");
+      this._set(host, "--md-comp-slider-stop-spacing", stops ? `${(length - handle) * step / (max - min)}px` : "");
+      if (peers?.length === 1) {
+        this._set(host, "--md-comp-slider-active-position", `${position}px`);
+        this._set(host, "--md-comp-slider-track-center", `${top + height / 2}px`);
       }
     }
     this.value.textContent = this.el.value;
@@ -188,4 +204,4 @@ var Slider = class _Slider extends Component {
 export {
   Slider
 };
-//# sourceMappingURL=chunk-JKNPQQWY.mjs.map
+//# sourceMappingURL=chunk-WJXDBPXQ.mjs.map

package/dist/js/chunks/chunk-WJXDBPXQ.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/slider.ts"],
+  "sourcesContent": ["import { Component, BaseOptions, InitElements, InitElement } from '../core/component';\nimport { Utils } from '../core/utils';\n\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface SliderOptions extends BaseOptions {}\n\nconst _defaults: SliderOptions = {};\n\n// Inline values _set() replaced, per element, so destroy() can put back what\n// an author wrote. Per element, not per instance: both handles of a range\n// write the same host properties.\nconst _authored = new WeakMap<HTMLElement, Record<string, string>>();\n\nexport class Slider extends Component<SliderOptions> {\n  declare el: HTMLInputElement;\n  private _pointerDown: boolean;\n  private _resizeObserver: ResizeObserver | null = null;\n  value: HTMLElement;\n  thumb: HTMLElement;\n\n  constructor(el: HTMLInputElement, options: Partial<SliderOptions>) {\n    super(el, options, Slider);\n    this.el['Expressive_Slider'] = this;\n\n    this.options = {\n      ...Slider.defaults,\n      ...options\n    };\n\n    this._pointerDown = false;\n    this._setupThumb();\n    this._sync();\n    this._setupEventHandlers();\n    if (typeof ResizeObserver !== 'undefined') {\n      this._resizeObserver = new ResizeObserver(() => this._sync());\n      this._resizeObserver.observe(this.el);\n    }\n  }\n\n  static get defaults(): SliderOptions {\n    return _defaults;\n  }\n\n  /**\n   * Initializes instance of Slider.\n   * @param el HTML element.\n   * @param options Component options.\n   */\n  static init(el: HTMLInputElement, options?: Partial<SliderOptions>): Slider;\n  /**\n   * Initializes instances of Slider.\n   * @param els HTML elements.\n   * @param options Component options.\n   */\n  static init(\n    els: InitElements<HTMLInputElement | InitElement>,\n    options?: Partial<SliderOptions>\n  ): Slider[];\n  /**\n   * Initializes instances of Slider.\n   * @param els HTML elements.\n   * @param options Component options.\n   */\n  static init(\n    els: HTMLInputElement | InitElements<HTMLInputElement | InitElement>,\n    options: Partial<SliderOptions> = {}\n  ): Slider | Slider[] {\n    return super.init(els, options, Slider);\n  }\n\n  static getInstance(el: HTMLInputElement): Slider {\n    return el['Expressive_Slider'];\n  }\n\n  destroy() {\n    this._resizeObserver?.disconnect();\n    this._removeEventHandlers();\n    this._removeThumb();\n    this.el['Expressive_Slider'] = undefined;\n    const host = this._host();\n    for (const el of [this.el, host]) {\n      for (const name in _authored.get(el)) el.style.setProperty(name, _authored.get(el)[name]);\n      _authored.delete(el);\n    }\n    // The other handle of a range writes the shared host properties again.\n    host?.querySelectorAll('input[type=\"range\"]').forEach((el) => el['Expressive_Slider']?._sync());\n  }\n\n  _set(el: HTMLElement, name: string, value: string) {\n    const authored = _authored.get(el) ?? {};\n    _authored.set(el, authored);\n    authored[name] ??= el.style.getPropertyValue(name);\n    el.style.setProperty(name, value);\n  }\n\n  // Eleven listeners used to cover four stages, because each one was written\n  // twice - once for mouse, once for touch. One of the touch spellings,\n  // `touchleave`, was never implemented by any browser at all.\n  _setupEventHandlers() {\n    this.el.addEventListener('change', this._handleRangeChange);\n    this.el.addEventListener('pointerdown', this._handleRangePointerDown);\n    this.el.addEventListener('input', this._handleRangeInputOrMove);\n    // Never calls preventDefault, so it does not need to block scrolling.\n    this.el.addEventListener('pointermove', this._handleRangeInputOrMove, { passive: true });\n    this.el.addEventListener('pointerup', this._handleRangePointerUp);\n    this.el.addEventListener('pointercancel', this._handleRangePointerUp);\n    this.el.addEventListener('blur', this._handleRangeRelease);\n    // `mouseout`, not `pointerout`: this used to be a `mouseout`/`touchleave`\n    // pair, and `touchleave` was never implemented by any browser, so the\n    // handler has only ever run for a mouse. `pointerout` also fires when a\n    // touch lifts, which would clear the thumb's active state at a moment\n    // nothing cleared it before.\n    this.el.addEventListener('mouseout', this._handleRangeRelease);\n  }\n\n  _removeEventHandlers() {\n    this.el.removeEventListener('change', this._handleRangeChange);\n    this.el.removeEventListener('pointerdown', this._handleRangePointerDown);\n    this.el.removeEventListener('input', this._handleRangeInputOrMove);\n    this.el.removeEventListener('pointermove', this._handleRangeInputOrMove);\n    this.el.removeEventListener('pointerup', this._handleRangePointerUp);\n    this.el.removeEventListener('pointercancel', this._handleRangePointerUp);\n    this.el.removeEventListener('blur', this._handleRangeRelease);\n    this.el.removeEventListener('mouseout', this._handleRangeRelease);\n  }\n\n  _handleRangeChange = () => {\n    this._clampDual();\n    this._sync();\n    this.thumb.classList.add('active');\n  };\n\n  _handleRangePointerDown = (e: PointerEvent) => {\n    if (!e.isPrimary) return;\n    if (e.pointerType === 'mouse' && e.button !== 0) return;\n    this._pointerDown = true;\n    this.el.classList.add('active');\n    this._clampDual();\n    this._sync();\n    // An `e.type !== 'input'` guard used to sit here. This handler is only ever\n    // bound to a press, so it was never anything but true.\n    this.thumb.classList.add('active');\n  };\n\n  _handleRangeInputOrMove = (e: Event) => {\n    if (e.type === 'input' || this._pointerDown) {\n      this._clampDual();\n      this._sync();\n      this.thumb.classList.add('active');\n    }\n  };\n\n  _handleRangePointerUp = (e: PointerEvent) => {\n    if (!e.isPrimary) return;\n    this._pointerDown = false;\n    this.el.classList.remove('active');\n  };\n\n  _handleRangeRelease = () => {\n    if (!this._pointerDown) {\n      this.thumb.classList.remove('active');\n    }\n  };\n\n  _setupThumb() {\n    this.thumb = document.createElement('span');\n    this.value = document.createElement('span');\n    this.thumb.classList.add('thumb');\n    this.value.classList.add('value');\n    this.thumb.append(this.value);\n    this.el.after(this.thumb);\n  }\n\n  _removeThumb() {\n    this.thumb.remove();\n  }\n\n  _isVertical(): boolean {\n    return !!this.el.closest('.vertical');\n  }\n\n  _host(): HTMLElement | null {\n    // `.slider` is the documented host now; without it here a dual-handle\n    // control could not find its wrapper, so the handles never clamped and the\n    // shared start/end fractions never tracked the interval.\n    return this.el.closest('.slider, .range, .range-field, label');\n  }\n\n  _clampDual() {\n    const host = this._host();\n    const peers = host?.querySelectorAll('input[type=\"range\"]');\n    if (!peers || peers.length !== 2) return;\n    const start = peers[0] as HTMLInputElement;\n    const end = peers[1] as HTMLInputElement;\n    if (this.el === start && +start.value > +end.value) start.value = end.value;\n    if (this.el === end && +end.value < +start.value) end.value = start.value;\n  }\n\n  _fraction(el: HTMLInputElement): number {\n    const parsedMax = parseFloat(el.max);\n    const max = Number.isNaN(parsedMax) ? 100 : parsedMax;\n    const min = parseFloat(el.min) || 0;\n    const val = parseFloat(el.value) || 0;\n    return max === min ? 0 : (val - min) / (max - min);\n  }\n\n  _sync() {\n    const percent = this._fraction(this.el);\n    const fraction = `${percent * 100}%`;\n\n    // Read before writing. This runs on every pointer move during a drag, and\n    // setting the custom property first made each of the four offset reads\n    // below flush a fresh layout.\n    const left = this.el.offsetLeft;\n    const top = this.el.offsetTop;\n    const width = this.el.offsetWidth;\n    const height = this.el.offsetHeight;\n    const style = getComputedStyle(this.el);\n    const rtl = style.direction === 'rtl';\n    const vertical = this._isVertical();\n    const handle = parseFloat(style.getPropertyValue('--md-comp-slider-handle-width')) || 4;\n    const length = vertical ? height : width;\n    const position = handle / 2 + percent * (length - handle);\n\n    this._set(this.el, '--md-comp-slider-active-fraction', fraction);\n    this._set(this.el, '--md-comp-slider-active-position', `${position}px`);\n\n    const host = this._host();\n    const peers = host?.querySelectorAll('input[type=\"range\"]');\n    if (host && peers && peers.length === 2) {\n      const nums = Array.from(peers).map((el) => this._fraction(el as HTMLInputElement));\n      this._set(host, '--md-comp-slider-start-fraction', `${Math.min(...nums) * 100}%`);\n      this._set(host, '--md-comp-slider-end-fraction', `${Math.max(...nums) * 100}%`);\n      this._set(host, '--md-comp-slider-start-position', `${handle / 2 + Math.min(...nums) * (length - handle)}px`);\n      this._set(host, '--md-comp-slider-end-position', `${handle / 2 + Math.max(...nums) * (length - handle)}px`);\n    }\n    if (host?.classList.contains('stops')) {\n      const parsedMax = parseFloat(this.el.max);\n      const max = Number.isNaN(parsedMax) ? 100 : parsedMax;\n      const min = parseFloat(this.el.min) || 0;\n      const step = parseFloat(this.el.step);\n      // Stops sit at min + k * step up to max, so a step that does not divide\n      // the range ends short of max. No step, `any`, zero or a negative step\n      // clears the spacing, and the host paints no dots.\n      const stops = step > 0 && Number.isFinite(step) && max > min;\n      this._set(host, '--md-comp-slider-stop-count', stops ? String(Math.floor((max - min) / step + 1e-9) + 1) : '');\n      this._set(host, '--md-comp-slider-stop-spacing', stops ? `${((length - handle) * step) / (max - min)}px` : '');\n      // The tick row is the host's ::after, which cannot read the input's\n      // properties. A dual host has no single position.\n      if (peers?.length === 1) {\n        this._set(host, '--md-comp-slider-active-position', `${position}px`);\n        this._set(host, '--md-comp-slider-track-center', `${top + height / 2}px`);\n      }\n    }\n\n    this.value.textContent = this.el.value;\n    if (vertical) {\n      this.thumb.style.left = `${left + width / 2}px`;\n      this.thumb.style.top = `${top + height - position}px`;\n    } else {\n      this.thumb.style.left = `${left + (rtl ? width - position : position)}px`;\n      this.thumb.style.top = `${top}px`;\n    }\n  }\n\n  /**\n   * Initializes every range input in the current document.\n   */\n  static Init() {\n    // Deferred like every other Init(): this ran at import time, so a bundle\n    // loaded in <head> found no inputs at all.\n    Utils.onDocumentReady(() => {\n      Slider.init(document.querySelectorAll('input[type=range]') as NodeListOf<HTMLInputElement>, {});\n    });\n  }\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/js/chunks/{chunk-XO5WX3TK.mjs → chunk-YDCS5S3J.mjs}

@@ -1,6 +1,6 @@
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/buttonGroup.ts
 var _defaults = {};
@@ -223,4 +223,4 @@ var ButtonGroup = class _ButtonGroup extends Component {
 export {
   ButtonGroup
 };
-//# sourceMappingURL=chunk-XO5WX3TK.mjs.map
+//# sourceMappingURL=chunk-YDCS5S3J.mjs.map

package/dist/js/chunks/{chunk-TK6PX2GC.mjs → chunk-YSBCHYXP.mjs}

@@ -1,9 +1,9 @@
 import {
   Utils
-} from "./chunk-MISGHDUU.mjs";
+} from "./chunk-6OMRGML6.mjs";
 import {
   Component
-} from "./chunk-QSQ24FYT.mjs";
+} from "./chunk-LTWPGFBR.mjs";
 
 // src/ts/components/menu.ts
 var MIN_SURFACE_WIDTH = 112;
@@ -30,6 +30,7 @@ var _Menu = class _Menu extends Component {
     super(el, options, _Menu);
     this._pendingTimers = /* @__PURE__ */ new Set();
     this._transition = 0;
+    this._menuClickTargets = /* @__PURE__ */ new WeakMap();
     this._handleClick = (e) => {
       e.preventDefault();
       if (this.isOpen) {
@@ -58,11 +59,15 @@ var _Menu = class _Menu extends Component {
       }
     };
     this._handleDocumentClick = (e) => {
-      const target = e.target;
+      const path = e.composedPath();
+      const menuTarget = this._menuClickTargets.get(e);
+      this._menuClickTargets.delete(e);
+      const target = menuTarget ?? (path[0] || e.target);
+      const inside = !!menuTarget || path.includes(this.menuEl) || this.menuEl?.contains(target);
       if (this._isSubmenuTriggerClick(target)) return;
-      if (this.options.closeOnClick && this.menuEl?.contains(target) && !this.isTouchMoving) {
+      if (this.options.closeOnClick && inside && !this.isTouchMoving) {
         this.close();
-      } else if (!this.menuEl?.contains(target)) {
+      } else if (!inside) {
         this._schedule(() => {
           if (this.isOpen) {
             this.close();
@@ -80,12 +85,13 @@ var _Menu = class _Menu extends Component {
     };
     this._handleDocumentTouchmove = (e) => {
       const target = e.target;
-      if (this.menuEl?.contains(target)) {
+      if (e.composedPath().includes(this.menuEl) || this.menuEl?.contains(target)) {
         this.isTouchMoving = true;
       }
     };
     this._handleMenuClick = (e) => {
       const target = e.target;
+      this._menuClickTargets.set(e, target);
       const li = target.closest("li");
       if (li?.matches('.disabled, [aria-disabled="true"]')) {
         e.preventDefault();
@@ -252,7 +258,7 @@ var _Menu = class _Menu extends Component {
       this._animateOut();
       this._removeTemporaryEventHandlers();
       this.el.ariaExpanded = "false";
-      if (this.options.autoFocus && (root.activeElement === focused || !root.activeElement || root.activeElement === document.body)) {
+      if (this.options.autoFocus && this.menuEl.contains(focused) && (root.activeElement === focused || this.el.ownerDocument.activeElement === this.el.ownerDocument.body)) {
         this.el.focus();
       }
     };
@@ -344,6 +350,7 @@ var _Menu = class _Menu extends Component {
   }
   _setupTemporaryEventHandlers() {
     document.body.addEventListener("click", this._handleDocumentClick);
+    this.menuEl?.addEventListener("touchmove", this._handleDocumentTouchmove, { passive: true });
     document.body.addEventListener("touchmove", this._handleDocumentTouchmove, {
       passive: true
     });
@@ -352,6 +359,7 @@ var _Menu = class _Menu extends Component {
   }
   _removeTemporaryEventHandlers() {
     document.body.removeEventListener("click", this._handleDocumentClick);
+    this.menuEl?.removeEventListener("touchmove", this._handleDocumentTouchmove);
     document.body.removeEventListener("touchmove", this._handleDocumentTouchmove);
     this.menuEl?.removeEventListener("keydown", this._handleMenuKeydown);
     window.removeEventListener("resize", this._handleWindowResize);
@@ -660,4 +668,4 @@ var Menu = _Menu;
 export {
   Menu
 };
-//# sourceMappingURL=chunk-TK6PX2GC.mjs.map
+//# sourceMappingURL=chunk-YSBCHYXP.mjs.map