@expressivecss/expressive 0.9.1 → 0.10.0

package/dist/js/chunks/chunk-ZIZVUWRL.mjs

@@ -0,0 +1,120 @@
+import {
+  Tabs
+} from "./chunk-YFXEJ7GR.mjs";
+import {
+  Timepicker
+} from "./chunk-D4UZ4HFN.mjs";
+import {
+  Tooltip
+} from "./chunk-JODJAGFS.mjs";
+import {
+  EXPANDING_CARD_SELECTOR,
+  ExpandingCard
+} from "./chunk-N3UHGN3N.mjs";
+import {
+  Lightbox
+} from "./chunk-JNPIWFJT.mjs";
+import {
+  NavigationRail
+} from "./chunk-XDB3G6RL.mjs";
+import {
+  ScrollSpy
+} from "./chunk-TZZ24ZQS.mjs";
+import {
+  ButtonGroup
+} from "./chunk-XO5WX3TK.mjs";
+import {
+  FloatingActionButton
+} from "./chunk-VAS6JQ6P.mjs";
+import {
+  CARDS_SELECTOR,
+  Cards,
+  isCardReveal
+} from "./chunk-7UXHSYIA.mjs";
+import {
+  Carousel
+} from "./chunk-AOGFNMXS.mjs";
+import {
+  Chips
+} from "./chunk-ZZBZI2XN.mjs";
+import {
+  Autocomplete
+} from "./chunk-7MM4VJJO.mjs";
+import {
+  Datepicker
+} from "./chunk-QYCYP443.mjs";
+import {
+  FormSelect
+} from "./chunk-G576EP5O.mjs";
+import {
+  Menu
+} from "./chunk-TK6PX2GC.mjs";
+import {
+  AppBar
+} from "./chunk-EP3CVKB5.mjs";
+
+// src/ts/components/registry.ts
+var AUTO_INIT_COMPONENTS = {
+  AppBar: {
+    component: AppBar,
+    selector: "header.medium, header.large, header:has(> :is(nav:not(.tabs, .navigation-bar, .navigation-rail), .bar) > :is(.search-bar, .searchbar))"
+  },
+  Autocomplete: {
+    component: Autocomplete,
+    selector: ".autocomplete"
+  },
+  ButtonGroup: {
+    component: ButtonGroup,
+    selector: ".button-group"
+  },
+  // Shared with Cards.Init() - see CARDS_SELECTOR. This entry used to read
+  // '.cards', which no card markup uses.
+  Cards: { component: Cards, selector: CARDS_SELECTOR, filter: isCardReveal },
+  ExpandingCard: {
+    component: ExpandingCard,
+    selector: EXPANDING_CARD_SELECTOR
+  },
+  Carousel: { component: Carousel, selector: ".carousel" },
+  Chips: { component: Chips, selector: ".chips" },
+  Datepicker: {
+    component: Datepicker,
+    selector: ".datepicker, .date-picker"
+  },
+  Menu: { component: Menu, selector: ".menu-trigger" },
+  Lightbox: { component: Lightbox, selector: ".lightboxed" },
+  ScrollSpy: { component: ScrollSpy, selector: ".scrollspy" },
+  FormSelect: { component: FormSelect, selector: "select" },
+  NavigationRail: {
+    component: NavigationRail,
+    selector: ".navigation-rail"
+  },
+  Tabs: { component: Tabs, selector: ".tabs" },
+  Timepicker: {
+    component: Timepicker,
+    selector: ".timepicker, .time-picker"
+  },
+  Tooltip: { component: Tooltip, selector: ".tooltipped" },
+  FloatingActionButton: {
+    component: FloatingActionButton,
+    selector: ".fab-menu"
+  }
+};
+function AutoInit(context = document.body, options) {
+  for (const name of Object.keys(AUTO_INIT_COMPONENTS)) {
+    const { component, selector, filter } = AUTO_INIT_COMPONENTS[name];
+    const els = context.querySelectorAll(`:is(${selector}):not(.no-autoinit)`);
+    if (filter) {
+      els.forEach((el) => {
+        if (filter(el)) component.init(el, options?.[name] ?? {});
+      });
+    } else {
+      component.init(els, options?.[name] ?? {});
+    }
+  }
+}
+
+export {
+  AUTO_INIT_COMPONENTS,
+  AutoInit
+};
+//# sourceMappingURL=chunk-ZIZVUWRL.mjs.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/registry.ts"],
+  "sourcesContent": ["import { InitElements, InitElement } from \"../core/component\";\nimport * as Components from \"./index\";\nimport { CARDS_SELECTOR, isCardReveal } from \"./cards\";\nimport { EXPANDING_CARD_SELECTOR } from \"./expandingCard\";\n\n/**\n * The components `AutoInit()` starts, in initialization order, with the\n * selector each one claims.\n *\n * This table is the single source of truth: the options type below and the\n * init calls in `AutoInit()` are both derived from it, so wiring up a new\n * auto-initialized component means adding one line here (plus its export in\n * ./index.ts) - not four hand-synchronized edits that fail silently when one\n * is forgotten.\n *\n * A component that should only ever be constructed explicitly (Snackbar,\n * CharacterCounter, Range, ...) simply stays out of this table.\n */\nexport const AUTO_INIT_COMPONENTS = {\n  AppBar: {\n    component: Components.AppBar,\n    selector:\n      \"header.medium, header.large, header:has(> :is(nav:not(.tabs, .navigation-bar, .navigation-rail), .bar) > :is(.search-bar, .searchbar))\",\n  },\n  Autocomplete: {\n    component: Components.Autocomplete,\n    selector: \".autocomplete\",\n  },\n  ButtonGroup: {\n    component: Components.ButtonGroup,\n    selector: \".button-group\",\n  },\n  // Shared with Cards.Init() - see CARDS_SELECTOR. This entry used to read\n  // '.cards', which no card markup uses.\n  Cards: { component: Components.Cards, selector: CARDS_SELECTOR, filter: isCardReveal },\n  ExpandingCard: {\n    component: Components.ExpandingCard,\n    selector: EXPANDING_CARD_SELECTOR,\n  },\n  Carousel: { component: Components.Carousel, selector: \".carousel\" },\n  Chips: { component: Components.Chips, selector: \".chips\" },\n  Datepicker: {\n    component: Components.Datepicker,\n    selector: \".datepicker, .date-picker\",\n  },\n  Menu: { component: Components.Menu, selector: \".menu-trigger\" },\n  Lightbox: { component: Components.Lightbox, selector: \".lightboxed\" },\n  ScrollSpy: { component: Components.ScrollSpy, selector: \".scrollspy\" },\n  FormSelect: { component: Components.FormSelect, selector: \"select\" },\n  NavigationRail: {\n    component: Components.NavigationRail,\n    selector: \".navigation-rail\",\n  },\n  Tabs: { component: Components.Tabs, selector: \".tabs\" },\n  Timepicker: {\n    component: Components.Timepicker,\n    selector: \".timepicker, .time-picker\",\n  },\n  Tooltip: { component: Components.Tooltip, selector: \".tooltipped\" },\n  FloatingActionButton: {\n    component: Components.FloatingActionButton,\n    selector: \".fab-menu\",\n  },\n};\n\ntype Registry = typeof AUTO_INIT_COMPONENTS;\n\n/**\n * Per-component options accepted by {@link AutoInit}, derived from the table\n * above - each key takes that component's own options type.\n */\nexport type AutoInitOptions = {\n  [K in keyof Registry]?: Partial<\n    InstanceType<Registry[K][\"component\"]>[\"options\"]\n  >;\n};\n\n/** The shape every entry in the table satisfies; see the cast in AutoInit. */\ntype AutoInitable = {\n  init(els: InitElement | InitElements<InitElement>, options: Partial<object>): unknown;\n};\n\ntype AutoInitEntry = {\n  component: AutoInitable;\n  selector: string;\n  filter?: (el: Element) => boolean;\n};\n\n/**\n * Automatically initialize components.\n * @param context Root element to initialize. Defaults to `document.body`.\n * @param options Options for each component.\n */\nexport function AutoInit(\n  context: HTMLElement = document.body,\n  options?: Partial<AutoInitOptions>,\n) {\n  for (const name of Object.keys(AUTO_INIT_COMPONENTS) as (keyof Registry)[]) {\n    const { component, selector, filter } = AUTO_INIT_COMPONENTS[\n      name\n    ] as unknown as AutoInitEntry;\n    // `:is()` so that `:not(.no-autoinit)` applies to the whole selector. A\n    // bare `${selector}:not(...)` binds the negation to the last alternative\n    // only, which would silently break the opt-out for any comma-separated\n    // entry (Cards is the first).\n    const els = context.querySelectorAll(`:is(${selector}):not(.no-autoinit)`);\n    // Each component's static `init` is overloaded; indexing the table widens\n    // it to a union TypeScript cannot call, so narrow it once, here.\n    if (filter) {\n      els.forEach((el) => {\n        if (filter(el)) component.init(el, options?.[name] ?? {});\n      });\n    } else {\n      component.init(els, options?.[name] ?? {});\n    }\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,IAAM,uBAAuB;AAAA,EAClC,QAAQ;AAAA,IACN,WAAsB;AAAA,IACtB,UACE;AAAA,EACJ;AAAA,EACA,cAAc;AAAA,IACZ,WAAsB;AAAA,IACtB,UAAU;AAAA,EACZ;AAAA,EACA,aAAa;AAAA,IACX,WAAsB;AAAA,IACtB,UAAU;AAAA,EACZ;AAAA;AAAA;AAAA,EAGA,OAAO,EAAE,WAAsB,OAAO,UAAU,gBAAgB,QAAQ,aAAa;AAAA,EACrF,eAAe;AAAA,IACb,WAAsB;AAAA,IACtB,UAAU;AAAA,EACZ;AAAA,EACA,UAAU,EAAE,WAAsB,UAAU,UAAU,YAAY;AAAA,EAClE,OAAO,EAAE,WAAsB,OAAO,UAAU,SAAS;AAAA,EACzD,YAAY;AAAA,IACV,WAAsB;AAAA,IACtB,UAAU;AAAA,EACZ;AAAA,EACA,MAAM,EAAE,WAAsB,MAAM,UAAU,gBAAgB;AAAA,EAC9D,UAAU,EAAE,WAAsB,UAAU,UAAU,cAAc;AAAA,EACpE,WAAW,EAAE,WAAsB,WAAW,UAAU,aAAa;AAAA,EACrE,YAAY,EAAE,WAAsB,YAAY,UAAU,SAAS;AAAA,EACnE,gBAAgB;AAAA,IACd,WAAsB;AAAA,IACtB,UAAU;AAAA,EACZ;AAAA,EACA,MAAM,EAAE,WAAsB,MAAM,UAAU,QAAQ;AAAA,EACtD,YAAY;AAAA,IACV,WAAsB;AAAA,IACtB,UAAU;AAAA,EACZ;AAAA,EACA,SAAS,EAAE,WAAsB,SAAS,UAAU,cAAc;AAAA,EAClE,sBAAsB;AAAA,IACpB,WAAsB;AAAA,IACtB,UAAU;AAAA,EACZ;AACF;AA8BO,SAAS,SACd,UAAuB,SAAS,MAChC,SACA;AACA,aAAW,QAAQ,OAAO,KAAK,oBAAoB,GAAyB;AAC1E,UAAM,EAAE,WAAW,UAAU,OAAO,IAAI,qBACtC,IACF;AAKA,UAAM,MAAM,QAAQ,iBAAiB,OAAO,QAAQ,qBAAqB;AAGzE,QAAI,QAAQ;AACV,UAAI,QAAQ,CAAC,OAAO;AAClB,YAAI,OAAO,EAAE,EAAG,WAAU,KAAK,IAAI,UAAU,IAAI,KAAK,CAAC,CAAC;AAAA,MAC1D,CAAC;AAAA,IACH,OAAO;AACL,gBAAU,KAAK,KAAK,UAAU,IAAI,KAAK,CAAC,CAAC;AAAA,IAC3C;AAAA,EACF;AACF;",
+  "names": []
+}

package/dist/js/chunks/chunk-ZZBZI2XN.mjs

@@ -0,0 +1,338 @@
+import {
+  Autocomplete
+} from "./chunk-7MM4VJJO.mjs";
+import {
+  Utils
+} from "./chunk-MISGHDUU.mjs";
+import {
+  Component
+} from "./chunk-QSQ24FYT.mjs";
+
+// src/ts/components/chips.ts
+var _defaults = {
+  data: [],
+  placeholder: "",
+  secondaryPlaceholder: "",
+  closeIconClass: "material-symbols",
+  autocompleteOptions: {},
+  autocompleteOnly: false,
+  limit: Infinity,
+  allowUserInput: false,
+  i18n: { remove: "Remove" },
+  onChipAdd: null,
+  onChipSelect: null,
+  onChipDelete: null
+};
+var _Chips = class _Chips extends Component {
+  constructor(el, options) {
+    super(el, options, _Chips);
+    this._handleChipClick = (e) => {
+      const _chip = e.target.closest(".chip");
+      const clickedClose = !!e.target.closest(".close");
+      if (_chip) {
+        const index = this._chips.indexOf(_chip);
+        if (index < 0) return;
+        if (clickedClose) {
+          this._deleteChip(index, "input");
+        } else {
+          this.selectChip(index);
+        }
+      } else {
+        this._input.focus();
+      }
+    };
+    this._handleInputFocus = () => {
+      this.el.classList.add("focus");
+    };
+    this._handleInputBlur = () => {
+      this.el.classList.remove("focus");
+    };
+    this._handleInputKeydown = (e) => {
+      _Chips._keydown = true;
+      if (e.key === Utils.keys.ENTER) {
+        if (this.hasAutocomplete && this.autocomplete && this.autocomplete.isOpen) {
+          return;
+        }
+        e.preventDefault();
+        if (!this.hasAutocomplete || this.hasAutocomplete && !this.options.autocompleteOnly) {
+          this.addChip({ id: this._input.value });
+        }
+        this._input.value = "";
+      } else if ((e.key === Utils.keys.BACKSPACE || e.key === Utils.keys.ARROW_LEFT) && this._input.value === "" && this.chipsData.length) {
+        e.preventDefault();
+        this.selectChip(this.chipsData.length - 1);
+      }
+    };
+    this.el["Expressive_Chips"] = this;
+    this.options = {
+      ..._Chips.defaults,
+      ...options
+    };
+    if (options?.i18n) this.options.i18n = { ..._Chips.defaults.i18n, ...options.i18n };
+    this.el.classList.add("chips");
+    this.chipsData = [];
+    this._chips = [];
+    if (this.options.data.length) {
+      this.chipsData = this.options.data;
+      this._renderChips();
+    }
+    if (this.options.allowUserInput) {
+      this.el.classList.add("field");
+      this._setupInput();
+      this._setupEventHandlers();
+      this.el.append(this._input);
+    }
+    this._setupLabel();
+  }
+  /**
+   * Selection is drawn by a class now, not by `:focus`, so it does not clear
+   * itself when focus moves - every path that changes the selection has to go
+   * through here or the class and the field drift apart.
+   *
+   * Deliberately no `aria-selected`: the chip is not an option in a listbox,
+   * and putting the attribute on an element with no such role is the same
+   * defect the semantics standard exists to remove.
+   */
+  _setSelected(chip) {
+    this._selectedChip?.classList.remove("selected");
+    this._selectedChip = chip;
+    chip?.classList.add("selected");
+  }
+  static get defaults() {
+    return _defaults;
+  }
+  /**
+   * Initializes instances of Chips.
+   * @param els HTML elements.
+   * @param options Component options.
+   */
+  static init(els, options = {}) {
+    return super.init(els, options, _Chips);
+  }
+  static getInstance(el) {
+    return el["Expressive_Chips"];
+  }
+  getData() {
+    return this.chipsData;
+  }
+  destroy() {
+    if (this.options.allowUserInput) {
+      this._removeEventHandlers();
+    }
+    this._chips.forEach((c) => c.remove());
+    this._chips = [];
+    this.el["Expressive_Chips"] = void 0;
+  }
+  _setupEventHandlers() {
+    this.el.addEventListener("click", this._handleChipClick);
+    this.el.addEventListener("keydown", _Chips._handleChipsKeydown);
+    this.el.addEventListener("keyup", _Chips._handleChipsKeyup);
+    this.el.addEventListener("blur", _Chips._handleChipsBlur, true);
+    this._input.addEventListener("focus", this._handleInputFocus);
+    this._input.addEventListener("blur", this._handleInputBlur);
+    this._input.addEventListener("keydown", this._handleInputKeydown);
+  }
+  _removeEventHandlers() {
+    this.el.removeEventListener("click", this._handleChipClick);
+    this.el.removeEventListener("keydown", _Chips._handleChipsKeydown);
+    this.el.removeEventListener("keyup", _Chips._handleChipsKeyup);
+    this.el.removeEventListener("blur", _Chips._handleChipsBlur, true);
+    this._input.removeEventListener("focus", this._handleInputFocus);
+    this._input.removeEventListener("blur", this._handleInputBlur);
+    this._input.removeEventListener("keydown", this._handleInputKeydown);
+  }
+  static _handleChipsKeydown(e) {
+    _Chips._keydown = true;
+    const chips = e.target.closest(".chips");
+    const chipsKeydown = e.target && chips;
+    const tag = e.target.tagName;
+    if (tag === "INPUT" || tag === "TEXTAREA" || !chipsKeydown) return;
+    const currChips = chips["Expressive_Chips"];
+    if (!currChips) return;
+    if (e.key === Utils.keys.BACKSPACE || e.key === Utils.keys.DELETE) {
+      const index = currChips._chips.indexOf(e.target.closest(".chip"));
+      if (index < 0) return;
+      e.preventDefault();
+      currChips._deleteChip(index, "previous");
+    } else if (e.key === Utils.keys.ARROW_LEFT) {
+      if (currChips._selectedChip) {
+        const selectIndex = currChips._chips.indexOf(currChips._selectedChip) - 1;
+        if (selectIndex < 0) return;
+        currChips.selectChip(selectIndex);
+      }
+    } else if (e.key === Utils.keys.ARROW_RIGHT) {
+      if (currChips._selectedChip) {
+        const selectIndex = currChips._chips.indexOf(currChips._selectedChip) + 1;
+        if (selectIndex >= currChips.chipsData.length) {
+          currChips._setSelected(null);
+          currChips._input.focus();
+        } else currChips.selectChip(selectIndex);
+      }
+    }
+  }
+  static _handleChipsKeyup() {
+    _Chips._keydown = false;
+  }
+  static _handleChipsBlur(e) {
+    if (!_Chips._keydown && document.hidden) {
+      const chips = e.target.closest(".chips");
+      const currChips = chips?.["Expressive_Chips"];
+      if (currChips) currChips._setSelected(null);
+    }
+  }
+  _renderChip(chip) {
+    if (!chip.id) return;
+    const label = chip.text || chip.id;
+    const renderedChip = document.createElement("span");
+    renderedChip.classList.add("chip");
+    renderedChip.innerText = label;
+    if (chip.image) {
+      const img = document.createElement("img");
+      img.setAttribute("src", chip.image);
+      renderedChip.insertBefore(img, renderedChip.firstChild);
+    }
+    if (this.options.allowUserInput) {
+      const closeButton = document.createElement("button");
+      closeButton.type = "button";
+      closeButton.classList.add("close");
+      closeButton.setAttribute("aria-label", `${this.options.i18n.remove} ${label}`);
+      const closeIcon = document.createElement("span");
+      closeIcon.classList.add(this.options.closeIconClass);
+      closeIcon.setAttribute("aria-hidden", "true");
+      closeIcon.innerText = "close";
+      closeButton.appendChild(closeIcon);
+      renderedChip.appendChild(closeButton);
+    }
+    return renderedChip;
+  }
+  _renderChips() {
+    this._chips = [];
+    for (let i = 0; i < this.chipsData.length; i++) {
+      const chipElem = this._renderChip(this.chipsData[i]);
+      this.el.appendChild(chipElem);
+      this._chips.push(chipElem);
+    }
+  }
+  _setupAutocomplete() {
+    this.options.autocompleteOptions.onAutocomplete = (items) => {
+      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.autocomplete = Autocomplete.init(this._input, this.options.autocompleteOptions);
+  }
+  _setupInput() {
+    this._input = this.el.querySelector("input");
+    if (!this._input) {
+      this._input = document.createElement("input");
+      this.el.append(this._input);
+    }
+    this._input.classList.add("input");
+    this.hasAutocomplete = Object.keys(this.options.autocompleteOptions).length > 0;
+    if (this.hasAutocomplete) this._setupAutocomplete();
+    this._setPlaceholder();
+    if (!this._input.getAttribute("id")) this._input.setAttribute("id", Utils.guid());
+  }
+  _setupLabel() {
+    this._label = this.el.querySelector("label");
+    if (this._label && this._input) this._label.setAttribute("for", this._input.getAttribute("id"));
+  }
+  _setPlaceholder() {
+    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) {
+      this._input.placeholder = this.options.secondaryPlaceholder;
+    }
+  }
+  _isValidAndNotExist(chip) {
+    const isValid = !!chip.id;
+    const doesNotExist = !this.chipsData.some((item) => item.id == chip.id);
+    return isValid && doesNotExist;
+  }
+  /**
+   * Add chip to input.
+   * @param chip Chip data object
+   */
+  addChip(chip) {
+    if (!this._isValidAndNotExist(chip) || this.chipsData.length >= this.options.limit) return;
+    const renderedChip = this._renderChip(chip);
+    this._chips.push(renderedChip);
+    this.chipsData.push(chip);
+    this._input.before(renderedChip);
+    this._setPlaceholder();
+    if (typeof this.options.onChipAdd === "function") {
+      this.options.onChipAdd(this.el, renderedChip);
+    }
+  }
+  /**
+   * Delete nth chip.
+   * @param chipIndex  Index of chip
+   */
+  deleteChip(chipIndex) {
+    const root = this.el.getRootNode();
+    this._deleteChip(chipIndex, this._chips[chipIndex]?.contains(root.activeElement) ? "input" : null);
+  }
+  _deleteChip(chipIndex, focus) {
+    const chip = this._chips[chipIndex];
+    if (!chip) return;
+    if (this._selectedChip === chip) this._setSelected(null);
+    chip.remove();
+    this._chips.splice(chipIndex, 1);
+    this.chipsData.splice(chipIndex, 1);
+    this._setPlaceholder();
+    const focusPath = [];
+    let root = this.el.getRootNode();
+    while (root) {
+      focusPath.push({ root, element: root.activeElement });
+      root = "host" in root ? root.host.getRootNode() : null;
+    }
+    if (typeof this.options.onChipDelete === "function") {
+      this.options.onChipDelete(this.el, chip);
+    }
+    if (!focus || focusPath.some(({ root: root2, element }) => root2.activeElement !== element) || this.el["Expressive_Chips"] !== this) return;
+    if (focus === "previous" && this._chips.length) this.selectChip(Math.max(chipIndex - 1, 0));
+    else {
+      this._setSelected(null);
+      this._input?.focus();
+    }
+  }
+  /**
+   * Select nth chip.
+   * @param chipIndex Index of chip
+   */
+  selectChip(chipIndex) {
+    const chip = this._chips[chipIndex];
+    if (!chip) return;
+    this._setSelected(chip);
+    chip.querySelector(".close")?.focus();
+    if (typeof this.options.onChipSelect === "function") {
+      this.options.onChipSelect(this.el, chip);
+    }
+  }
+  static Init() {
+    Utils.onDocumentReady(() => {
+      const chips = document.querySelectorAll(".chips");
+      chips.forEach((el) => {
+        el.addEventListener("click", (e) => {
+          if (el["Expressive_Chips"]) return;
+          if (e.target.closest(".close")) {
+            const chip = e.target.closest(".chip");
+            if (chip) chip.remove();
+          }
+        });
+      });
+    });
+  }
+};
+_Chips._keydown = false;
+var Chips = _Chips;
+
+export {
+  Chips
+};
+//# sourceMappingURL=chunk-ZZBZI2XN.mjs.map

package/dist/js/chunks/chunk-ZZBZI2XN.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.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 && this.autocomplete.isOpen) {\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) 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 (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    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.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;\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    this._input.before(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"]
+}