dap-design-system 0.62.4 → 0.63.0

package/dist/components/option-list/listbox-state.d.ts

@@ -0,0 +1,230 @@
+/**
+ * Listbox state: the pure selection model behind dap-ds-option-list.
+ *
+ * `reduceListbox(state, action)` returns the next state plus an ordered list
+ * of effects (events to emit, focus/scroll requests, timers). It never touches
+ * the DOM, so every rule — navigation, typeahead, filtering, selection, the
+ * active option — is testable without rendering.
+ *
+ * Behaviour is a faithful transliteration of the option-list element's former
+ * imperative paths (one action per entry point), including its quirks; those
+ * are pinned by the characterization suites and change only deliberately.
+ *
+ * Vocabulary (GLOSSARY.md): the **active option** is the keyboard highlight
+ * (`currentOption`), the **selected value** is `value`, **available options**
+ * are the options left after the **filter**, **typeahead** jumps without
+ * filtering.
+ */
+/** What the listbox needs from an option. Option elements satisfy it. */
+export interface ListboxOption {
+    value?: any;
+    readonly optionText: string;
+    disabled?: boolean;
+    hasAttribute(name: string): boolean;
+}
+export type ListboxSearchMode = 'none' | 'typehead' | 'autocomplete' | 'manual';
+export interface ListboxState<O extends ListboxOption = ListboxOption> {
+    value?: string;
+    filterText: string;
+    searchMode: ListboxSearchMode;
+    search: boolean;
+    /** String flag, as on the element: only `'true'` enables value syncing. */
+    searchOnValueSet: string;
+    disableDelaySet: boolean;
+    focused: boolean;
+    /** Options given through the (internal) `options` property, if any. */
+    options?: O[];
+    /** Options found in the slot. */
+    optionEls: O[];
+    /** Options left after the filter, in display order. */
+    availableOptions: O[];
+    /** Index of the active option in `availableOptions` (undefined until first set). */
+    selectedIndex: number | undefined;
+    /** The active option (may be outside `availableOptions`). */
+    currentOption: O | null | undefined;
+    /** The option last marked as selected (drives the option `selected` flag). */
+    marked: O | null;
+    /** The option carrying the focused flag / tabindex 0, or null when cleared. */
+    flagged: O | null;
+    /** Typeahead query typed so far. */
+    query: string;
+    /**
+     * A value the list set itself from a user action, until the element has
+     * synced it. Its attribute/update echoes are skipped so one pick emits one
+     * dds-option-change. Null when there is nothing pending.
+     */
+    ownValue: {
+        value: unknown;
+    } | null;
+}
+/** How an emitted event's detail is built, mirroring the element's calls. */
+export type ListboxEmit<O> = {
+    type: 'emit';
+    name: 'dds-option-change' | 'dds-current-change';
+    /** `{ ...details(option) }`: undefined option yields `{}`. */
+    detail: {
+        kind: 'details';
+        option: O | null | undefined;
+        index: number | undefined;
+    };
+} | {
+    type: 'emit';
+    name: 'dds-current-change';
+    /** emit(name, null) */
+    detail: {
+        kind: 'null';
+    };
+} | {
+    type: 'emit';
+    name: 'dds-keydown';
+    detail: {
+        kind: 'key';
+        key: string;
+        code?: string;
+    } | {
+        kind: 'keyDetails';
+        key: string;
+        code?: string;
+        option: O;
+        index: number | undefined;
+    };
+} | {
+    type: 'emit';
+    name: 'dds-cancel';
+    detail: {
+        kind: 'none';
+    };
+} | {
+    type: 'emit';
+    name: 'dds-list-changed';
+    detail: {
+        kind: 'elements';
+        elements: O[];
+    };
+} | {
+    type: 'emit';
+    name: 'dds-option-deselect';
+    detail: {
+        kind: 'deselect';
+        option: O;
+    };
+};
+export type ListboxEffect<O> = ListboxEmit<O>
+/** Move real focus onto the rendered option for `option`. */
+ | {
+    type: 'focusOption';
+    option: O;
+}
+/** Scroll `option` (the active option at that moment) into view within the list. */
+ | {
+    type: 'scrollActive';
+    option: O;
+}
+/** Scroll the active option into view on the next animation frame. */
+ | {
+    type: 'scrollActiveNextFrame';
+}
+/** Focus the listbox host. */
+ | {
+    type: 'focusHost';
+} | {
+    type: 'preventDefault';
+} | {
+    type: 'stopPropagation';
+}
+/** (Re)start the typeahead reset timer; dispatch `typeaheadElapsed` after `ms`. */
+ | {
+    type: 'scheduleTypeaheadReset';
+    ms: number;
+}
+/** Dispatch `clickSettled` once the element finished its next update. */
+ | {
+    type: 'afterUpdate';
+    action: {
+        type: 'clickSettled';
+    };
+};
+export type ListboxAction<O> = 
+/** A keydown that reached the list (focus inside it). */
+{
+    type: 'keydown';
+    key: string;
+    code?: string;
+}
+/** The list is opened / receives focus, optionally with the key that opened it. */
+ | {
+    type: 'open';
+    key?: string;
+}
+/** The list is closed. */
+ | {
+    type: 'close';
+}
+/** A pointer click on a rendered option. */
+ | {
+    type: 'click';
+    option: O;
+    /** The clicked option currently shows as selected. */
+    selected: boolean;
+    /** Ctrl or Cmd was held. */
+    modifier: boolean;
+}
+/** Follow-up of `click` after the element's update settled. */
+ | {
+    type: 'clickSettled';
+}
+/** `filterText` changed (state already holds the new text). */
+ | {
+    type: 'filterChanged';
+}
+/** The `value` attribute changed (state already holds the new value). */
+ | {
+    type: 'valueAttributeChanged';
+    value: string | null;
+}
+/** The `value` property changed in an update in which the active option did not. */
+ | {
+    type: 'valueUpdated';
+    previous: unknown;
+}
+/** `options` / slotted options changed in an update. */
+ | {
+    type: 'optionsUpdated';
+}
+/** The slot content changed. */
+ | {
+    type: 'slotChanged';
+    options: O[];
+}
+/** The typeahead reset timer elapsed. */
+ | {
+    type: 'typeaheadElapsed';
+}
+/** Run typeahead for `char` directly (public buildQueryString). */
+ | {
+    type: 'typeahead';
+    char: string;
+};
+export interface ListboxResult<O extends ListboxOption> {
+    state: ListboxState<O>;
+    effects: ListboxEffect<O>[];
+    /** Fields that changed at any point during the reduction. */
+    changed: (keyof ListboxState<O>)[];
+    /**
+     * Which option flags must be re-applied from state: `selected` from
+     * `marked`, `focused` + tabindex from `flagged`.
+     */
+    flags: {
+        selected: boolean;
+        focus: boolean;
+    };
+}
+export declare const TYPEAHEAD_RESET_MS = 500;
+export declare function initialListboxState<O extends ListboxOption>(overrides?: Partial<ListboxState<O>>): ListboxState<O>;
+export declare const isAutoCompleteMode: (mode: ListboxSearchMode) => mode is "manual" | "autocomplete";
+/** Next enabled index from `current` stepping by `step`; `current` if none. */
+export declare function findNearestEnabled(options: ListboxOption[], current: number | undefined, step: number): number | undefined;
+export declare const findIndexByValue: (options: ListboxOption[], value?: unknown) => number;
+/** Enabled options whose text starts with `filterText` (case-insensitive). */
+export declare function filterOptions<O extends ListboxOption>(options: O[], filterText: string): O[];
+export declare function reduceListbox<O extends ListboxOption>(state: ListboxState<O>, action: ListboxAction<O>): ListboxResult<O>;

package/dist/components/option-list/listbox-state.js

@@ -0,0 +1,312 @@
+var g = Object.defineProperty;
+var v = Object.getOwnPropertySymbols;
+var y = Object.prototype.hasOwnProperty, C = Object.prototype.propertyIsEnumerable;
+var O = (a, t, e) => t in a ? g(a, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[t] = e, b = (a, t) => {
+  for (var e in t || (t = {}))
+    y.call(t, e) && O(a, e, t[e]);
+  if (v)
+    for (var e of v(t))
+      C.call(t, e) && O(a, e, t[e]);
+  return a;
+};
+const w = 500, k = (a) => a === "autocomplete" || a === "manual";
+function u(a, t, e) {
+  let s = t, n;
+  do
+    if (s += e, n = a[s], n === void 0)
+      break;
+  while (n != null && n.disabled);
+  return n ? s : t;
+}
+const o = (a, t) => a.findIndex((e) => e.value === t);
+function x(a, t) {
+  const e = t.toLowerCase();
+  return a.filter(
+    (s) => !s.disabled && s.optionText.toLowerCase().startsWith(e)
+  );
+}
+const r = (a) => a.options || a.optionEls;
+class m {
+  constructor(t) {
+    this.s = t, this.effects = [], this.changed = /* @__PURE__ */ new Set(), this.flags = { selected: !1, focus: !1 };
+  }
+  set(t, e) {
+    this.s[t] !== e && (this.changed.add(t), this.s[t] = e);
+  }
+  get isAutoComplete() {
+    return k(this.s.searchMode);
+  }
+  emitDetails(t, e) {
+    this.effects.push({
+      type: "emit",
+      name: t,
+      detail: { kind: "details", option: e, index: this.s.selectedIndex }
+    });
+  }
+  /** Active option, without selecting it (e.g. focus). */
+  setCurrentOption(t, e = !0) {
+    this.clearFocusFlags(), t ? (this.set("currentOption", t), this.set("flagged", t), this.emitDetails("dds-current-change", t), e ? this.effects.push({ type: "focusOption", option: t }) : this.effects.push({ type: "scrollActive", option: t })) : (this.set("currentOption", null), this.effects.push({
+      type: "emit",
+      name: "dds-current-change",
+      detail: { kind: "null" }
+    }));
+  }
+  setSelectedOption(t) {
+    this.flags.selected = !0, this.set("marked", null), t && (this.set("currentOption", t), this.set("marked", t));
+  }
+  clearFocusFlags() {
+    this.flags.focus = !0, this.set("flagged", null);
+  }
+  selectionChanged(t, e) {
+    const s = e || this.s.value;
+    t && t.value !== s && this.set("value", t.value);
+  }
+  changeOption(t, e) {
+    t && !t.disabled && (this.set(
+      "selectedIndex",
+      o(this.s.availableOptions, t.value)
+    ), this.setSelectedOption(t), this.setCurrentOption(t, this.s.focused), this.selectionChanged(t, e));
+  }
+  // --- keyboard ---
+  navigate(t) {
+    var n;
+    const e = this.s, s = e.availableOptions;
+    if (t === "ArrowDown")
+      this.set("selectedIndex", u(s, e.selectedIndex, 1));
+    else if (t === "ArrowUp") {
+      const c = u(
+        s,
+        e.selectedIndex,
+        e.selectedIndex === -1 ? 1 : -1
+      );
+      this.set("selectedIndex", c === s.length ? -1 : c);
+    } else if (t === "Home")
+      this.set(
+        "selectedIndex",
+        (n = s[0]) != null && n.disabled ? u(s, -1, 1) : 0
+      );
+    else if (t === "End") {
+      const c = u(s, s.length, -1);
+      this.set("selectedIndex", c === s.length ? -1 : c);
+    }
+  }
+  actionKey(t) {
+    if (t === "Enter") {
+      const e = this.s.availableOptions[this.s.selectedIndex];
+      this.setSelectedOption(e), this.selectionChanged(e), this.emitDetails("dds-option-change", this.s.currentOption);
+    }
+  }
+  typeaheadKey(t) {
+    this.s.searchMode === "typehead" && ((t == null ? void 0 : t.length) === 1 || t === "Backspace") && this.typeahead(t);
+  }
+  keyCodes(t, e) {
+    if (this.s.focused && (this.navigate(t), this.actionKey(t), this.typeaheadKey(t), this.s.selectedIndex >= 0)) {
+      const s = this.s.availableOptions[this.s.selectedIndex];
+      this.setCurrentOption(s), this.effects.push({
+        type: "emit",
+        name: "dds-keydown",
+        detail: {
+          kind: "keyDetails",
+          code: e,
+          key: t,
+          option: s,
+          index: this.s.selectedIndex
+        }
+      });
+    }
+  }
+  // --- typeahead ---
+  typeahead(t) {
+    if (t !== "Backspace" && (t == null ? void 0 : t.length) !== 1)
+      return;
+    this.effects.push({
+      type: "scheduleTypeaheadReset",
+      ms: 500
+    }), this.set(
+      "query",
+      t === "Backspace" ? this.s.query.slice(0, -1) : this.s.query + t
+    );
+    const e = this.s.query.toLowerCase();
+    if (e) {
+      for (const s of this.s.availableOptions)
+        if (!s.disabled && s.optionText.toLowerCase().startsWith(e)) {
+          this.set(
+            "selectedIndex",
+            o(this.s.availableOptions, s.value)
+          ), this.setCurrentOption(s);
+          break;
+        }
+    }
+  }
+  // --- opening ---
+  initialFocus() {
+    const t = this.s;
+    if (!t.value && t.selectedIndex < 0)
+      this.set("selectedIndex", 0);
+    else {
+      const e = t.value ? o(t.availableOptions, t.value) : t.selectedIndex;
+      if (e !== -1 && !this.isAutoComplete) {
+        this.set("selectedIndex", e);
+        const s = t.availableOptions[t.selectedIndex];
+        this.setCurrentOption(s), this.setSelectedOption(s), t.value && this.selectionChanged(s);
+      }
+    }
+    t.selectedIndex || (this.setCurrentOption(t.availableOptions[0]), this.setSelectedOption(t.availableOptions[0]));
+  }
+  keyFocus(t) {
+    const e = this.s;
+    if (this.isAutoComplete || e.searchMode === "none") {
+      this.keyCodes(t);
+      const s = e.availableOptions[e.selectedIndex];
+      this.setCurrentOption(s, !1), this.setSelectedOption(s);
+    }
+    e.searchMode === "typehead" && this.typeahead(t);
+  }
+}
+function A(a, t) {
+  var h, f;
+  const e = new m(b({}, a)), s = e.s, n = s.value;
+  switch ((I.includes(t.type) || t.type === "clickSettled") && (s.ownValue = null), t.type) {
+    case "keydown": {
+      if (e.set("focused", !0), t.key === "Tab" || t.key === "Escape") {
+        t.key === "Escape" && (e.effects.push({ type: "preventDefault" }), e.effects.push({
+          type: "emit",
+          name: "dds-cancel",
+          detail: { kind: "none" }
+        })), e.effects.push({
+          type: "emit",
+          name: "dds-keydown",
+          detail: { kind: "key", key: t.key, code: t.code }
+        });
+        break;
+      }
+      e.effects.push({ type: "preventDefault" }), e.keyCodes(t.key, t.code);
+      break;
+    }
+    case "open": {
+      e.set("focused", !0), e.effects.push({ type: "focusHost" }), t.key ? e.keyFocus(t.key) : e.initialFocus(), e.effects.push({ type: "scrollActiveNextFrame" });
+      break;
+    }
+    case "close": {
+      e.set("focused", !1), e.clearFocusFlags();
+      break;
+    }
+    case "typeahead": {
+      e.typeahead(t.char);
+      break;
+    }
+    case "click": {
+      e.set("focused", !0);
+      const i = t.option;
+      if (i && !i.disabled) {
+        if (t.modifier && t.selected) {
+          const l = s.availableOptions.find(
+            (d) => d.hasAttribute("empty")
+          );
+          l ? (e.setSelectedOption(l), e.setCurrentOption(l), e.set("value", l.value), e.set(
+            "selectedIndex",
+            o(s.availableOptions, l.value)
+          ), e.emitDetails("dds-option-change", l)) : (e.setSelectedOption(void 0), e.setCurrentOption(null), e.set("value", void 0), e.set("selectedIndex", -1), e.effects.push({
+            type: "emit",
+            name: "dds-option-deselect",
+            detail: { kind: "deselect", option: i }
+          }));
+          break;
+        }
+        e.set(
+          "selectedIndex",
+          o(s.availableOptions, i.value)
+        ), e.setCurrentOption(i), e.setSelectedOption(i), e.selectionChanged(i), e.effects.push({
+          type: "afterUpdate",
+          action: { type: "clickSettled" }
+        });
+      } else
+        e.effects.push({ type: "preventDefault" }), e.effects.push({ type: "stopPropagation" });
+      break;
+    }
+    case "clickSettled": {
+      e.set("selectedIndex", o(s.availableOptions, s.value)), s.disableDelaySet || e.emitDetails("dds-option-change", s.currentOption);
+      break;
+    }
+    case "filterChanged": {
+      if (s.filterText && s.searchMode !== "none" && s.searchMode !== "manual")
+        e.set("availableOptions", x(r(s), s.filterText)), e.set("selectedIndex", 0), e.setCurrentOption(s.availableOptions[0], !1), e.effects.push(p(s));
+      else if (s.filterText && s.searchMode === "manual")
+        s.selectedIndex === -1 && s.availableOptions.length > 0 && (e.set("selectedIndex", 0), e.setCurrentOption(s.availableOptions[0], !1));
+      else if (s.filterText && s.searchMode === "none")
+        e.set("availableOptions", x(r(s), s.filterText)), e.set("selectedIndex", -1), e.setCurrentOption(null, !1), e.setSelectedOption(), e.effects.push(p(s));
+      else {
+        e.set("availableOptions", r(s));
+        const i = s.value !== void 0 && s.value !== null && s.value !== "" ? o(s.availableOptions, s.value) : -1, l = i >= 0 ? s.availableOptions[i] : void 0;
+        l && !l.disabled ? (e.set("selectedIndex", i), e.setCurrentOption(l, !1)) : (e.set("selectedIndex", -1), e.setCurrentOption(null, !1)), e.effects.push(p(s));
+      }
+      break;
+    }
+    case "valueAttributeChanged": {
+      if (s.searchOnValueSet !== "true" || s.ownValue && ((h = s.ownValue.value) != null ? h : null) === ((f = t.value) != null ? f : null))
+        break;
+      if (t.value) {
+        const i = s.availableOptions.find((l) => l.value === t.value);
+        e.setSelectedOption(i), e.selectionChanged(i), e.emitDetails("dds-option-change", s.currentOption);
+      } else
+        e.setSelectedOption(), e.selectionChanged();
+      break;
+    }
+    case "valueUpdated": {
+      if ((s.value === void 0 || s.value === null || s.value === "") && !s.filterText && s.currentOption && (e.set("selectedIndex", -1), e.setCurrentOption(null, !1)), s.searchOnValueSet !== "true") break;
+      const i = s.ownValue;
+      if (s.ownValue = null, i && i.value === s.value) break;
+      const l = s.availableOptions.find((d) => d.value === s.value);
+      l && (e.changeOption(l, t.previous), e.set("selectedIndex", o(s.availableOptions, s.value)), e.emitDetails("dds-option-change", s.currentOption));
+      break;
+    }
+    case "optionsUpdated": {
+      e.set("availableOptions", r(s)), e.effects.push(p(s));
+      break;
+    }
+    case "slotChanged": {
+      const i = t.options;
+      if (e.set("availableOptions", i), e.set("optionEls", i), i.length > 0 && s.searchOnValueSet === "true") {
+        const l = i.find((d) => d.value === s.value);
+        e.setSelectedOption(l), e.selectionChanged(l), s.currentOption && (e.set("selectedIndex", o(i, s.value)), e.emitDetails("dds-option-change", s.currentOption));
+      } else if (i.length > 0 && !s.search && !e.isAutoComplete) {
+        const l = i.find((d) => !d.disabled);
+        e.set("selectedIndex", 0), e.setCurrentOption(l, !1), e.emitDetails("dds-current-change", l);
+      } else if (i.length > 0 && (s.search || e.isAutoComplete)) {
+        const l = i.find((d) => !d.disabled);
+        (!s.currentOption || s.currentOption.value !== (l == null ? void 0 : l.value)) && (e.set("selectedIndex", 0), e.setCurrentOption(l, !1));
+      }
+      break;
+    }
+    case "typeaheadElapsed": {
+      e.set("query", "");
+      break;
+    }
+  }
+  return t.type === "keydown" && s.value !== n && (s.ownValue = { value: s.value }), {
+    state: s,
+    effects: e.effects,
+    changed: [...e.changed],
+    flags: e.flags
+  };
+}
+const I = [
+  "keydown",
+  "click",
+  "typeahead",
+  "open",
+  "close"
+], p = (a) => ({
+  type: "emit",
+  name: "dds-list-changed",
+  detail: { kind: "elements", elements: a.availableOptions }
+});
+export {
+  w as TYPEAHEAD_RESET_MS,
+  x as filterOptions,
+  o as findIndexByValue,
+  u as findNearestEnabled,
+  k as isAutoCompleteMode,
+  A as reduceListbox
+};
+//# sourceMappingURL=listbox-state.js.map

package/dist/components/option-list/listbox-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"listbox-state.js","sources":["../../../src/components/option-list/listbox-state.ts"],"sourcesContent":["/**\n * Listbox state: the pure selection model behind dap-ds-option-list.\n *\n * `reduceListbox(state, action)` returns the next state plus an ordered list\n * of effects (events to emit, focus/scroll requests, timers). It never touches\n * the DOM, so every rule — navigation, typeahead, filtering, selection, the\n * active option — is testable without rendering.\n *\n * Behaviour is a faithful transliteration of the option-list element's former\n * imperative paths (one action per entry point), including its quirks; those\n * are pinned by the characterization suites and change only deliberately.\n *\n * Vocabulary (GLOSSARY.md): the **active option** is the keyboard highlight\n * (`currentOption`), the **selected value** is `value`, **available options**\n * are the options left after the **filter**, **typeahead** jumps without\n * filtering.\n */\n\n/** What the listbox needs from an option. Option elements satisfy it. */\nexport interface ListboxOption {\n  value?: any\n  readonly optionText: string\n  disabled?: boolean\n  hasAttribute(name: string): boolean\n}\n\nexport type ListboxSearchMode = 'none' | 'typehead' | 'autocomplete' | 'manual'\n\nexport interface ListboxState<O extends ListboxOption = ListboxOption> {\n  // --- inputs mirrored from the element's properties ---\n  value?: string\n  filterText: string\n  searchMode: ListboxSearchMode\n  search: boolean\n  /** String flag, as on the element: only `'true'` enables value syncing. */\n  searchOnValueSet: string\n  disableDelaySet: boolean\n  focused: boolean\n  /** Options given through the (internal) `options` property, if any. */\n  options?: O[]\n\n  // --- internal state ---\n  /** Options found in the slot. */\n  optionEls: O[]\n  /** Options left after the filter, in display order. */\n  availableOptions: O[]\n  /** Index of the active option in `availableOptions` (undefined until first set). */\n  selectedIndex: number | undefined\n  /** The active option (may be outside `availableOptions`). */\n  currentOption: O | null | undefined\n  /** The option last marked as selected (drives the option `selected` flag). */\n  marked: O | null\n  /** The option carrying the focused flag / tabindex 0, or null when cleared. */\n  flagged: O | null\n  /** Typeahead query typed so far. */\n  query: string\n  /**\n   * A value the list set itself from a user action, until the element has\n   * synced it. Its attribute/update echoes are skipped so one pick emits one\n   * dds-option-change. Null when there is nothing pending.\n   */\n  ownValue: { value: unknown } | null\n}\n\n/** How an emitted event's detail is built, mirroring the element's calls. */\nexport type ListboxEmit<O> =\n  | {\n      type: 'emit'\n      name: 'dds-option-change' | 'dds-current-change'\n      /** `{ ...details(option) }`: undefined option yields `{}`. */\n      detail: {\n        kind: 'details'\n        option: O | null | undefined\n        index: number | undefined\n      }\n    }\n  | {\n      type: 'emit'\n      name: 'dds-current-change'\n      /** emit(name, null) */\n      detail: { kind: 'null' }\n    }\n  | {\n      type: 'emit'\n      name: 'dds-keydown'\n      detail:\n        | { kind: 'key'; key: string; code?: string }\n        | {\n            kind: 'keyDetails'\n            key: string\n            code?: string\n            option: O\n            index: number | undefined\n          }\n    }\n  | { type: 'emit'; name: 'dds-cancel'; detail: { kind: 'none' } }\n  | {\n      type: 'emit'\n      name: 'dds-list-changed'\n      detail: { kind: 'elements'; elements: O[] }\n    }\n  | {\n      type: 'emit'\n      name: 'dds-option-deselect'\n      detail: { kind: 'deselect'; option: O }\n    }\n\nexport type ListboxEffect<O> =\n  | ListboxEmit<O>\n  /** Move real focus onto the rendered option for `option`. */\n  | { type: 'focusOption'; option: O }\n  /** Scroll `option` (the active option at that moment) into view within the list. */\n  | { type: 'scrollActive'; option: O }\n  /** Scroll the active option into view on the next animation frame. */\n  | { type: 'scrollActiveNextFrame' }\n  /** Focus the listbox host. */\n  | { type: 'focusHost' }\n  | { type: 'preventDefault' }\n  | { type: 'stopPropagation' }\n  /** (Re)start the typeahead reset timer; dispatch `typeaheadElapsed` after `ms`. */\n  | { type: 'scheduleTypeaheadReset'; ms: number }\n  /** Dispatch `clickSettled` once the element finished its next update. */\n  | { type: 'afterUpdate'; action: { type: 'clickSettled' } }\n\nexport type ListboxAction<O> =\n  /** A keydown that reached the list (focus inside it). */\n  | { type: 'keydown'; key: string; code?: string }\n  /** The list is opened / receives focus, optionally with the key that opened it. */\n  | { type: 'open'; key?: string }\n  /** The list is closed. */\n  | { type: 'close' }\n  /** A pointer click on a rendered option. */\n  | {\n      type: 'click'\n      option: O\n      /** The clicked option currently shows as selected. */\n      selected: boolean\n      /** Ctrl or Cmd was held. */\n      modifier: boolean\n    }\n  /** Follow-up of `click` after the element's update settled. */\n  | { type: 'clickSettled' }\n  /** `filterText` changed (state already holds the new text). */\n  | { type: 'filterChanged' }\n  /** The `value` attribute changed (state already holds the new value). */\n  | { type: 'valueAttributeChanged'; value: string | null }\n  /** The `value` property changed in an update in which the active option did not. */\n  | { type: 'valueUpdated'; previous: unknown }\n  /** `options` / slotted options changed in an update. */\n  | { type: 'optionsUpdated' }\n  /** The slot content changed. */\n  | { type: 'slotChanged'; options: O[] }\n  /** The typeahead reset timer elapsed. */\n  | { type: 'typeaheadElapsed' }\n  /** Run typeahead for `char` directly (public buildQueryString). */\n  | { type: 'typeahead'; char: string }\n\nexport interface ListboxResult<O extends ListboxOption> {\n  state: ListboxState<O>\n  effects: ListboxEffect<O>[]\n  /** Fields that changed at any point during the reduction. */\n  changed: (keyof ListboxState<O>)[]\n  /**\n   * Which option flags must be re-applied from state: `selected` from\n   * `marked`, `focused` + tabindex from `flagged`.\n   */\n  flags: { selected: boolean; focus: boolean }\n}\n\nexport const TYPEAHEAD_RESET_MS = 500\n\nexport function initialListboxState<O extends ListboxOption>(\n  overrides: Partial<ListboxState<O>> = {},\n): ListboxState<O> {\n  return {\n    value: undefined,\n    filterText: '',\n    searchMode: 'none',\n    search: false,\n    searchOnValueSet: 'true',\n    disableDelaySet: false,\n    focused: false,\n    options: undefined,\n    optionEls: [],\n    availableOptions: [],\n    selectedIndex: undefined,\n    currentOption: undefined,\n    marked: null,\n    flagged: null,\n    query: '',\n    ownValue: null,\n    ...overrides,\n  }\n}\n\n// ---------------------------------------------------------------------------\n// Pure helpers (also used by the element's public methods)\n// ---------------------------------------------------------------------------\n\nexport const isAutoCompleteMode = (mode: ListboxSearchMode) =>\n  mode === 'autocomplete' || mode === 'manual'\n\n/** Next enabled index from `current` stepping by `step`; `current` if none. */\nexport function findNearestEnabled(\n  options: ListboxOption[],\n  current: number | undefined,\n  step: number,\n): number | undefined {\n  let nextIndex = current as number\n  let nextOption: ListboxOption | undefined\n\n  do {\n    nextIndex += step\n    nextOption = options[nextIndex]\n    if (nextOption === undefined) {\n      break\n    }\n  } while (nextOption?.disabled)\n\n  return nextOption ? nextIndex : current\n}\n\nexport const findIndexByValue = (options: ListboxOption[], value?: unknown) =>\n  options.findIndex(option => option.value === value)\n\n/** Enabled options whose text starts with `filterText` (case-insensitive). */\nexport function filterOptions<O extends ListboxOption>(\n  options: O[],\n  filterText: string,\n): O[] {\n  const valueLowerCase = filterText.toLowerCase()\n  return options.filter(\n    item =>\n      !item.disabled &&\n      item.optionText.toLowerCase().startsWith(valueLowerCase),\n  )\n}\n\n/** The option set the list works on: `options` property wins over the slot. */\nconst sourceOptions = <O extends ListboxOption>(s: ListboxState<O>) =>\n  s.options || s.optionEls\n\n// ---------------------------------------------------------------------------\n// Reducer\n// ---------------------------------------------------------------------------\n\n/**\n * Mutable working copy for one reduction. Each helper below mirrors one of\n * the element's former methods, in the same order of operations, so the\n * sequence of effects (event order and payloads) is preserved exactly.\n */\nclass Draft<O extends ListboxOption> {\n  readonly effects: ListboxEffect<O>[] = []\n  /** Fields assigned a different value at some point (Lit's change rule). */\n  readonly changed = new Set<keyof ListboxState<O>>()\n  readonly flags = { selected: false, focus: false }\n\n  constructor(public s: ListboxState<O>) {}\n\n  set<K extends keyof ListboxState<O>>(key: K, value: ListboxState<O>[K]) {\n    if (this.s[key] !== value) {\n      this.changed.add(key)\n      this.s[key] = value\n    }\n  }\n\n  get isAutoComplete() {\n    return isAutoCompleteMode(this.s.searchMode)\n  }\n\n  emitDetails(\n    name: 'dds-option-change' | 'dds-current-change',\n    option: O | null | undefined,\n  ) {\n    this.effects.push({\n      type: 'emit',\n      name,\n      detail: { kind: 'details', option, index: this.s.selectedIndex },\n    })\n  }\n\n  /** Active option, without selecting it (e.g. focus). */\n  setCurrentOption(option?: O | null, setFocus = true) {\n    this.clearFocusFlags()\n\n    if (option) {\n      this.set('currentOption', option)\n      this.set('flagged', option)\n      this.emitDetails('dds-current-change', option)\n\n      if (setFocus) {\n        this.effects.push({ type: 'focusOption', option })\n      } else {\n        this.effects.push({ type: 'scrollActive', option })\n      }\n    } else {\n      this.set('currentOption', null)\n      this.effects.push({\n        type: 'emit',\n        name: 'dds-current-change',\n        detail: { kind: 'null' },\n      })\n    }\n  }\n\n  setSelectedOption(option?: O) {\n    this.flags.selected = true\n    this.set('marked', null)\n\n    if (option) {\n      this.set('currentOption', option)\n      this.set('marked', option)\n    }\n  }\n\n  clearFocusFlags() {\n    this.flags.focus = true\n    this.set('flagged', null)\n  }\n\n  selectionChanged(option?: O, value?: unknown) {\n    const oldValue = value || this.s.value\n\n    if (option && option.value !== oldValue) {\n      this.set('value', option.value)\n    }\n  }\n\n  changeOption(option: O | undefined, value?: unknown) {\n    if (option && !option.disabled) {\n      this.set(\n        'selectedIndex',\n        findIndexByValue(this.s.availableOptions, option.value),\n      )\n      this.setSelectedOption(option)\n      // A value synced from outside must not pull focus into a closed list;\n      // while the list has focus, the option follows as before.\n      this.setCurrentOption(option, this.s.focused)\n      this.selectionChanged(option, value)\n    }\n  }\n\n  // --- keyboard ---\n\n  navigate(key: string) {\n    const s = this.s\n    const options = s.availableOptions\n    if (key === 'ArrowDown') {\n      this.set('selectedIndex', findNearestEnabled(options, s.selectedIndex, 1))\n    } else if (key === 'ArrowUp') {\n      const nearest = findNearestEnabled(\n        options,\n        s.selectedIndex,\n        s.selectedIndex === -1 ? 1 : -1,\n      )\n      this.set('selectedIndex', nearest === options.length ? -1 : nearest)\n    } else if (key === 'Home') {\n      this.set(\n        'selectedIndex',\n        options[0]?.disabled ? findNearestEnabled(options, -1, 1) : 0,\n      )\n    } else if (key === 'End') {\n      const nearest = findNearestEnabled(options, options.length, -1)\n      this.set('selectedIndex', nearest === options.length ? -1 : nearest)\n    }\n  }\n\n  actionKey(key: string) {\n    if (key === 'Enter') {\n      const option = this.s.availableOptions[this.s.selectedIndex as number]\n      this.setSelectedOption(option)\n      this.selectionChanged(option)\n      this.emitDetails('dds-option-change', this.s.currentOption)\n    }\n  }\n\n  typeaheadKey(key: string) {\n    if (\n      this.s.searchMode === 'typehead' &&\n      (key?.length === 1 || key === 'Backspace')\n    ) {\n      this.typeahead(key)\n    }\n  }\n\n  keyCodes(key: string, code?: string) {\n    if (!this.s.focused) {\n      return\n    }\n\n    this.navigate(key)\n    this.actionKey(key)\n    this.typeaheadKey(key)\n\n    if ((this.s.selectedIndex as number) >= 0) {\n      const option = this.s.availableOptions[this.s.selectedIndex as number]\n      this.setCurrentOption(option)\n      this.effects.push({\n        type: 'emit',\n        name: 'dds-keydown',\n        detail: {\n          kind: 'keyDetails',\n          code,\n          key,\n          option,\n          index: this.s.selectedIndex,\n        },\n      })\n    }\n  }\n\n  // --- typeahead ---\n\n  typeahead(char: string) {\n    // Only printable characters extend the query; Backspace shortens it.\n    // Any other key (Shift, Tab, F2…) leaves the query alone.\n    if (char !== 'Backspace' && char?.length !== 1) {\n      return\n    }\n\n    this.effects.push({\n      type: 'scheduleTypeaheadReset',\n      ms: TYPEAHEAD_RESET_MS,\n    })\n    this.set(\n      'query',\n      char === 'Backspace' ? this.s.query.slice(0, -1) : this.s.query + char,\n    )\n    const query = this.s.query.toLowerCase()\n    if (!query) {\n      return\n    }\n\n    for (const option of this.s.availableOptions) {\n      if (\n        !option.disabled &&\n        option.optionText.toLowerCase().startsWith(query)\n      ) {\n        this.set(\n          'selectedIndex',\n          findIndexByValue(this.s.availableOptions, option.value),\n        )\n        this.setCurrentOption(option)\n        break\n      }\n    }\n  }\n\n  // --- opening ---\n\n  initialFocus() {\n    const s = this.s\n    if (!s.value && (s.selectedIndex as number) < 0) {\n      this.set('selectedIndex', 0)\n    } else {\n      const index = s.value\n        ? findIndexByValue(s.availableOptions, s.value)\n        : s.selectedIndex\n\n      if (index !== -1 && !this.isAutoComplete) {\n        this.set('selectedIndex', index)\n        const option = s.availableOptions[s.selectedIndex as number]\n        this.setCurrentOption(option)\n        this.setSelectedOption(option)\n        if (s.value) {\n          this.selectionChanged(option)\n        }\n      }\n    }\n\n    if (!s.selectedIndex) {\n      this.setCurrentOption(s.availableOptions[0])\n      this.setSelectedOption(s.availableOptions[0])\n    }\n  }\n\n  keyFocus(key: string) {\n    const s = this.s\n    if (this.isAutoComplete || s.searchMode === 'none') {\n      this.keyCodes(key)\n      const option = s.availableOptions[s.selectedIndex as number]\n      this.setCurrentOption(option, false)\n      this.setSelectedOption(option)\n    }\n\n    if (s.searchMode === 'typehead') {\n      this.typeahead(key)\n    }\n  }\n}\n\nexport function reduceListbox<O extends ListboxOption>(\n  state: ListboxState<O>,\n  action: ListboxAction<O>,\n): ListboxResult<O> {\n  const d = new Draft<O>({ ...state })\n  const s = d.s\n  const valueBefore = s.value\n  const userAction = USER_ACTIONS.includes(action.type)\n  if (userAction || action.type === 'clickSettled') {\n    s.ownValue = null\n  }\n\n  switch (action.type) {\n    case 'keydown': {\n      // Keydown only reaches the list while focus is inside it. Focus can\n      // arrive via Tab (not `open`), so mark the list focused.\n      d.set('focused', true)\n\n      // Tab and Escape must always work so keyboard users can leave the list\n      // (WCAG 2.1.2). Tab keeps its native behaviour; the host closes.\n      if (action.key === 'Tab' || action.key === 'Escape') {\n        if (action.key === 'Escape') {\n          d.effects.push({ type: 'preventDefault' })\n          d.effects.push({\n            type: 'emit',\n            name: 'dds-cancel',\n            detail: { kind: 'none' },\n          })\n        }\n        d.effects.push({\n          type: 'emit',\n          name: 'dds-keydown',\n          detail: { kind: 'key', key: action.key, code: action.code },\n        })\n        break\n      }\n\n      d.effects.push({ type: 'preventDefault' })\n      d.keyCodes(action.key, action.code)\n      break\n    }\n\n    case 'open': {\n      d.set('focused', true)\n      d.effects.push({ type: 'focusHost' })\n\n      if (!action.key) {\n        d.initialFocus()\n      } else {\n        d.keyFocus(action.key)\n      }\n\n      // The popup constrains its scroll container one frame after opening;\n      // scrolling before that is a no-op.\n      d.effects.push({ type: 'scrollActiveNextFrame' })\n      break\n    }\n\n    case 'close': {\n      d.set('focused', false)\n      d.clearFocusFlags()\n      break\n    }\n\n    case 'typeahead': {\n      d.typeahead(action.char)\n      break\n    }\n\n    case 'click': {\n      d.set('focused', true)\n      const option = action.option\n\n      if (option && !option.disabled) {\n        if (action.modifier && action.selected) {\n          const emptyItem = s.availableOptions.find(opt =>\n            opt.hasAttribute('empty'),\n          )\n\n          if (emptyItem) {\n            d.setSelectedOption(emptyItem)\n            d.setCurrentOption(emptyItem)\n            d.set('value', emptyItem.value)\n            d.set(\n              'selectedIndex',\n              findIndexByValue(s.availableOptions, emptyItem.value),\n            )\n            d.emitDetails('dds-option-change', emptyItem)\n          } else {\n            d.setSelectedOption(undefined)\n            d.setCurrentOption(null)\n            d.set('value', undefined)\n            d.set('selectedIndex', -1)\n            d.effects.push({\n              type: 'emit',\n              name: 'dds-option-deselect',\n              detail: { kind: 'deselect', option },\n            })\n          }\n          break\n        }\n\n        // Index first, so every event this click fires reports the clicked\n        // option's position (not the previously active one).\n        d.set(\n          'selectedIndex',\n          findIndexByValue(s.availableOptions, option.value),\n        )\n        d.setCurrentOption(option)\n        d.setSelectedOption(option)\n        d.selectionChanged(option)\n        d.effects.push({\n          type: 'afterUpdate',\n          action: { type: 'clickSettled' },\n        })\n      } else {\n        d.effects.push({ type: 'preventDefault' })\n        d.effects.push({ type: 'stopPropagation' })\n      }\n      break\n    }\n\n    case 'clickSettled': {\n      d.set('selectedIndex', findIndexByValue(s.availableOptions, s.value))\n\n      if (!s.disableDelaySet) {\n        d.emitDetails('dds-option-change', s.currentOption)\n      }\n      break\n    }\n\n    case 'filterChanged': {\n      if (\n        s.filterText &&\n        s.searchMode !== 'none' &&\n        s.searchMode !== 'manual'\n      ) {\n        d.set('availableOptions', filterOptions(sourceOptions(s), s.filterText))\n        d.set('selectedIndex', 0)\n        d.setCurrentOption(s.availableOptions[0], false)\n        d.effects.push(listChanged(s))\n      } else if (s.filterText && s.searchMode === 'manual') {\n        if (s.selectedIndex === -1 && s.availableOptions.length > 0) {\n          d.set('selectedIndex', 0)\n          d.setCurrentOption(s.availableOptions[0], false)\n        }\n      } else if (s.filterText && s.searchMode === 'none') {\n        d.set('availableOptions', filterOptions(sourceOptions(s), s.filterText))\n        d.set('selectedIndex', -1)\n        d.setCurrentOption(null, false)\n        d.setSelectedOption()\n        d.effects.push(listChanged(s))\n      } else {\n        d.set('availableOptions', sourceOptions(s))\n        // Unfiltered list: the selected option (if any) is the active one, so\n        // a reopened combobox highlights its selection.\n        const index =\n          s.value !== undefined && s.value !== null && s.value !== ''\n            ? findIndexByValue(s.availableOptions, s.value)\n            : -1\n        const selected = index >= 0 ? s.availableOptions[index] : undefined\n        if (selected && !selected.disabled) {\n          d.set('selectedIndex', index)\n          d.setCurrentOption(selected, false)\n        } else {\n          d.set('selectedIndex', -1)\n          d.setCurrentOption(null, false)\n        }\n        d.effects.push(listChanged(s))\n      }\n      break\n    }\n\n    case 'valueAttributeChanged': {\n      if (s.searchOnValueSet !== 'true') break\n      // Echo of a value this list just picked itself: already announced.\n      if (s.ownValue && (s.ownValue.value ?? null) === (action.value ?? null)) {\n        break\n      }\n\n      if (action.value) {\n        const option = s.availableOptions.find(el => el.value === action.value)\n        d.setSelectedOption(option)\n        d.selectionChanged(option)\n        d.emitDetails('dds-option-change', s.currentOption)\n      } else {\n        d.setSelectedOption()\n        d.selectionChanged()\n      }\n      break\n    }\n\n    case 'valueUpdated': {\n      // Value cleared while the list is unfiltered: nothing stays active, so a\n      // reopened list does not announce (or pick on Enter) the old option.\n      if (\n        (s.value === undefined || s.value === null || s.value === '') &&\n        !s.filterText &&\n        s.currentOption\n      ) {\n        d.set('selectedIndex', -1)\n        d.setCurrentOption(null, false)\n      }\n      if (s.searchOnValueSet !== 'true') break\n      const own = s.ownValue\n      s.ownValue = null\n      if (own && own.value === s.value) break\n\n      const option = s.availableOptions.find(o => o.value === s.value)\n      if (option) {\n        d.changeOption(option, action.previous)\n        d.set('selectedIndex', findIndexByValue(s.availableOptions, s.value))\n        d.emitDetails('dds-option-change', s.currentOption)\n      }\n      break\n    }\n\n    case 'optionsUpdated': {\n      d.set('availableOptions', sourceOptions(s))\n      d.effects.push(listChanged(s))\n      break\n    }\n\n    case 'slotChanged': {\n      const allOptions = action.options\n      d.set('availableOptions', allOptions)\n      d.set('optionEls', allOptions)\n\n      if (allOptions.length > 0 && s.searchOnValueSet === 'true') {\n        const option = allOptions.find(el => el.value === s.value)\n        d.setSelectedOption(option)\n        d.selectionChanged(option)\n\n        if (s.currentOption) {\n          d.set('selectedIndex', findIndexByValue(allOptions, s.value))\n          d.emitDetails('dds-option-change', s.currentOption)\n        }\n      } else if (allOptions.length > 0 && !s.search && !d.isAutoComplete) {\n        const firstOption = allOptions.find(option => !option.disabled)\n        d.set('selectedIndex', 0)\n        d.setCurrentOption(firstOption, false)\n        d.emitDetails('dds-current-change', firstOption)\n      } else if (allOptions.length > 0 && (s.search || d.isAutoComplete)) {\n        const firstOption = allOptions.find(option => !option.disabled)\n\n        if (!s.currentOption || s.currentOption.value !== firstOption?.value) {\n          d.set('selectedIndex', 0)\n          d.setCurrentOption(firstOption, false)\n        }\n      }\n      break\n    }\n\n    case 'typeaheadElapsed': {\n      d.set('query', '')\n      break\n    }\n  }\n\n  // Only keyboard selection (Enter) announces dds-option-change itself; a\n  // click relies on the echo (or clickSettled) to announce it, so it is not marked.\n  if (action.type === 'keydown' && s.value !== valueBefore) {\n    s.ownValue = { value: s.value }\n  }\n\n  return {\n    state: s,\n    effects: d.effects,\n    changed: [...d.changed],\n    flags: d.flags,\n  }\n}\n\n/** Actions that come from the user, as opposed to syncing the element. */\nconst USER_ACTIONS: ListboxAction<ListboxOption>['type'][] = [\n  'keydown',\n  'click',\n  'typeahead',\n  'open',\n  'close',\n]\n\nconst listChanged = <O extends ListboxOption>(\n  s: ListboxState<O>,\n): ListboxEffect<O> => ({\n  type: 'emit',\n  name: 'dds-list-changed',\n  detail: { kind: 'elements', elements: s.availableOptions },\n})\n"],"names":["TYPEAHEAD_RESET_MS","isAutoCompleteMode","mode","findNearestEnabled","options","current","step","nextIndex","nextOption","findIndexByValue","value","option","filterOptions","filterText","valueLowerCase","item","sourceOptions","s","Draft","key","name","setFocus","oldValue","_a","nearest","code","char","query","index","reduceListbox","state","action","_b","d","__spreadValues","valueBefore","USER_ACTIONS","emptyItem","opt","listChanged","selected","el","own","o","allOptions","firstOption"],"mappings":"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"}

package/dist/components/option-list/option-data.d.ts

@@ -0,0 +1,35 @@
+import { TemplateResult } from 'lit';
+/** One option given as data (`items`) instead of a `<dap-ds-option-item>` child. */
+export interface DapDSOptionData {
+    /** The option value; becomes the select / combobox value. */
+    value: string;
+    /** Plain text of the option: shown by default, and used for filtering, typeahead and the selected text. */
+    label: string;
+    /** Whether the option is disabled. */
+    disabled?: boolean;
+    /** Any extra fields are passed through to `renderOption`. */
+    [extra: string]: unknown;
+}
+/** State passed to `renderOption` next to the item. */
+export interface DapDSOptionRenderState {
+    index: number;
+    selected: boolean;
+    active: boolean;
+    disabled: boolean;
+}
+/** Renders the content of one data option. A string is shown as text, never parsed as HTML. */
+export type DapDSOptionRenderer = (item: DapDSOptionData, state: DapDSOptionRenderState) => TemplateResult | Node | string;
+/**
+ * Normalizes an `items` value: an array is used as is, a JSON string is
+ * parsed (attributes, and frameworks such as React 19 that assign a string
+ * to the property), anything else means "no items".
+ */
+export declare function toOptionItems(value: unknown): DapDSOptionData[] | undefined;
+/** Reads `items` from a JSON attribute; anything that is not an array is ignored. */
+export declare const optionItemsConverter: {
+    fromAttribute: (value: string | null) => DapDSOptionData[] | undefined;
+};
+export declare function optionElementFor<E extends HTMLElement>(item: DapDSOptionData): E;
+export declare function optionElementsFor<E extends HTMLElement>(items: DapDSOptionData[]): E[];
+/** The data item behind an option element, if it came from `items`. */
+export declare function optionDataOf(el: Element | null | undefined): DapDSOptionData | undefined;