@k2b/ui 0.1.0-rc.0

package/dist/browser/inputs/AutocompleteSelect.js

@@ -0,0 +1,632 @@
+import { template as _$template } from "solid-js/web";
+import { delegateEvents as _$delegateEvents } from "solid-js/web";
+import { setStyleProperty as _$setStyleProperty } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { setProperty as _$setProperty } from "solid-js/web";
+import { getNextMarker as _$getNextMarker } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { getNextElement as _$getNextElement } from "solid-js/web";
+import { runHydrationEvents as _$runHydrationEvents } from "solid-js/web";
+import { setAttribute as _$setAttribute } from "solid-js/web";
+import { spread as _$spread } from "solid-js/web";
+import { mergeProps as _$mergeProps } from "solid-js/web";
+import { memo as _$memo } from "solid-js/web";
+import { use as _$use } from "solid-js/web";
+var _tmpl$ = /*#__PURE__*/_$template(`<button type=button class="k2b-choice-control__clear k2b-input-clear-action"tabindex=-1><i class="ti ti-x"aria-hidden=true>`),
+  _tmpl$2 = /*#__PURE__*/_$template(`<i class="ti ti-loader-2 k2b-spin"aria-hidden=true>`),
+  _tmpl$3 = /*#__PURE__*/_$template(`<div class=k2b-choice-toolbar>`),
+  _tmpl$4 = /*#__PURE__*/_$template(`<div class=k2b-choice-status><i class="ti ti-loader-2 k2b-spin"aria-hidden=true></i><span>`),
+  _tmpl$5 = /*#__PURE__*/_$template(`<div class=k2b-combobox><div class=k2b-combobox__input><i class="ti ti-search"aria-hidden=true></i><input type=text autocomplete=off role=combobox aria-autocomplete=both><!$><!/><!$><!/></div><!$><!/><span class=k2b-sr-only role=status aria-live=polite aria-atomic=true></span><div popover=manual class=k2b-choice-popover role=group><!$><!/><div class=k2b-choice-options role=listbox><!$><!/><!$><!/><!$><!/>`),
+  _tmpl$6 = /*#__PURE__*/_$template(`<i class="ti ti-check"aria-hidden=true>`),
+  _tmpl$7 = /*#__PURE__*/_$template(`<i class="ti ti-chevron-down"aria-hidden=true>`),
+  _tmpl$8 = /*#__PURE__*/_$template(`<input type=hidden>`),
+  _tmpl$9 = /*#__PURE__*/_$template(`<div class=k2b-choice-status data-tone=danger><span></span><button type=button>Retry`),
+  _tmpl$0 = /*#__PURE__*/_$template(`<div class=k2b-choice-status>`),
+  _tmpl$1 = /*#__PURE__*/_$template(`<button type=button class=k2b-choice-option role=option><!$><!/><span><strong></strong><!$><!/>`),
+  _tmpl$10 = /*#__PURE__*/_$template(`<i aria-hidden=true>`),
+  _tmpl$11 = /*#__PURE__*/_$template(`<span class=k2b-choice-dot aria-hidden=true>`),
+  _tmpl$12 = /*#__PURE__*/_$template(`<small>`);
+import { createEffect, createMemo, createSignal, For, Show } from "solid-js";
+import { createFieldMeta, Field, fieldControlAria } from "../internal/field";
+import { useUiMessages } from "../intl/messages";
+import { ChoiceGroups } from "./ChoiceGroups";
+import { createChoiceLoader, createChoicePopover, nextEnabledChoiceIndex } from "./choice";
+import { commitFieldValue, resolveMaybeAccessor } from "./field-contract";
+const errorMessage = (error, fallback) => error instanceof Error ? error.message : fallback;
+export function AutocompleteSelect(props) {
+  const messages = useUiMessages();
+  const meta = createFieldMeta(props.id);
+  const listboxId = `${meta.controlId}-listbox`;
+  const [cache, setCache] = createSignal({});
+  const value = () => resolveMaybeAccessor(props.value) ?? null;
+  const selected = createMemo(() => {
+    const current = value();
+    if (current === null) return undefined;
+    return cache()[current] ?? (props.selectedOption?.value === current ? props.selectedOption : undefined) ?? {
+      value: current,
+      label: current
+    };
+  });
+  const formatValue = option => option ? props.formatValue?.(option) ?? option.label : "";
+  const [display, setDisplay] = createSignal(formatValue(selected()));
+  const [query, setQuery] = createSignal("");
+  const [focused, setFocused] = createSignal(false);
+  const [editing, setEditing] = createSignal(false);
+  const [resolvedQuery, setResolvedQuery] = createSignal();
+  const [match, setMatch] = createSignal();
+  const [focusedIndex, setFocusedIndex] = createSignal(-1);
+  const [selectedGroup, setSelectedGroup] = createSignal(props.defaultGroup ?? null);
+  const [explicitOption, setExplicitOption] = createSignal(false);
+  const [internalError, setInternalError] = createSignal();
+  const externalError = () => resolveMaybeAccessor(props.error);
+  const error = () => externalError() ?? internalError();
+  const hasClearAction = () => Boolean(props.clearable && value() !== null && !props.disabled);
+  let inputRef;
+  let popoverRef;
+  let optionRefs = [];
+  let pointerFocus = false;
+  let pendingCommitQuery;
+  let snapshot = {
+    value: value(),
+    option: selected(),
+    display: formatValue(selected())
+  };
+  const popover = createChoicePopover(() => Boolean(props.disabled));
+  const activeGroup = createMemo(() => {
+    const current = selectedGroup();
+    return current && props.groups?.some(group => group.value === current) ? current : null;
+  });
+  const groupChoices = createMemo(() => [{
+    value: null,
+    label: props.allGroupLabel ?? messages().all
+  }, ...(props.groups ?? [])]);
+  const remember = (options, authoritative) => {
+    const next = {
+      ...cache()
+    };
+    for (const option of options) next[option.value] = option;
+    if (authoritative) next[authoritative.value] = authoritative;
+    setCache(next);
+  };
+  const completeInput = (typed, authoritative) => {
+    if (!inputRef || !focused() || !editing() || !authoritative || typed.length === 0) return;
+    const lower = typed.toLocaleLowerCase();
+    const completion = [authoritative.value, authoritative.label].find(candidate => candidate.toLocaleLowerCase().startsWith(lower));
+    if (!completion || completion.length <= typed.length) return;
+    setDisplay(completion);
+    queueMicrotask(() => {
+      if (!inputRef || document.activeElement !== inputRef || query() !== typed) return;
+      inputRef.setSelectionRange(typed.length, completion.length);
+    });
+  };
+  const mergedOptions = result => result.match && !result.options.some(option => option.value === result.match.value) ? [result.match, ...result.options] : result.options;
+  const commit = option => {
+    if (option.disabled) return;
+    pendingCommitQuery = undefined;
+    loader.cancel();
+    popover.hide();
+    remember([], option);
+    setDisplay(formatValue(option));
+    setQuery("");
+    setResolvedQuery(undefined);
+    setMatch(undefined);
+    setFocusedIndex(-1);
+    setExplicitOption(false);
+    setInternalError(undefined);
+    snapshot = {
+      value: option.value,
+      option,
+      display: formatValue(option)
+    };
+    commitFieldValue(props, option.value);
+    setEditing(false);
+  };
+  const invalidate = (message = props.noMatchText ?? messages().noMatchingOption) => {
+    pendingCommitQuery = undefined;
+    setInternalError(message);
+    popover.hide();
+  };
+  const loader = createChoiceLoader(() => async (typed, signal) => {
+    let result;
+    try {
+      result = await props.search(typed, signal, activeGroup());
+    } catch (reason) {
+      if (!signal.aborted) {
+        setResolvedQuery(typed);
+        if (pendingCommitQuery === typed) invalidate(errorMessage(reason, messages().optionsCouldNotLoad));
+      }
+      throw reason;
+    }
+    if (signal.aborted) return [];
+    const options = mergedOptions(result);
+    const authoritative = result.match?.disabled ? undefined : result.match;
+    remember(options, authoritative);
+    setResolvedQuery(typed);
+    setMatch(authoritative);
+    setExplicitOption(false);
+    setFocusedIndex(authoritative ? options.findIndex(option => option.value === authoritative.value) : -1);
+    completeInput(typed, authoritative);
+    if (pendingCommitQuery === typed) {
+      if (authoritative) commit(authoritative);else invalidate();
+    }
+    return options;
+  }, () => props.debounceMs ?? 150);
+  const options = () => resolvedQuery() === query() ? loader.options() : [];
+  const loadError = () => resolvedQuery() === query() ? loader.error() : undefined;
+  const focusedOption = () => options()[focusedIndex()];
+  const focusOption = (index, explicit = true) => {
+    setFocusedIndex(index);
+    setExplicitOption(explicit);
+    optionRefs[index]?.scrollIntoView({
+      block: "nearest"
+    });
+  };
+  const move = direction => focusOption(nextEnabledChoiceIndex(options(), focusedIndex(), direction));
+  const startSearch = (typed, immediate = false) => {
+    setInternalError(undefined);
+    setResolvedQuery(undefined);
+    setMatch(undefined);
+    setFocusedIndex(-1);
+    setExplicitOption(false);
+    popover.show();
+    loader.load(typed, immediate);
+  };
+  const chooseGroup = group => {
+    if (group === activeGroup()) return;
+    setSelectedGroup(group);
+    startSearch(editing() ? query() : "", true);
+  };
+  const selectedForCommit = () => {
+    if (resolvedQuery() !== query()) return undefined;
+    if (explicitOption()) return focusedOption();
+    return match();
+  };
+  const requestCommit = () => {
+    if (!editing()) return;
+    const option = selectedForCommit();
+    if (option) {
+      commit(option);
+      return;
+    }
+    if (query() === "" && props.clearable && !props.required) {
+      pendingCommitQuery = undefined;
+      loader.cancel();
+      popover.hide();
+      snapshot = {
+        value: null,
+        option: undefined,
+        display: ""
+      };
+      setDisplay("");
+      setQuery("");
+      setEditing(false);
+      setResolvedQuery(undefined);
+      setMatch(undefined);
+      setFocusedIndex(-1);
+      setExplicitOption(false);
+      setInternalError(undefined);
+      commitFieldValue(props, null);
+      return;
+    }
+    if (pendingCommitQuery === query()) return;
+    pendingCommitQuery = query();
+    if (resolvedQuery() === query() && !loader.loading()) invalidate();else loader.load(query(), true);
+  };
+  const restore = () => {
+    const target = snapshot;
+    pendingCommitQuery = undefined;
+    loader.cancel();
+    popover.hide();
+    remember(target.option ? [target.option] : []);
+    setDisplay(target.display);
+    setQuery("");
+    setResolvedQuery(undefined);
+    setMatch(undefined);
+    setFocusedIndex(-1);
+    setExplicitOption(false);
+    setInternalError(undefined);
+    if (value() !== target.value) props.onValueChange?.(target.value);
+    setEditing(false);
+    queueMicrotask(() => inputRef?.select());
+  };
+  createEffect(() => {
+    if (editing()) return;
+    const option = selected();
+    setDisplay(formatValue(option));
+    snapshot = {
+      value: value(),
+      option,
+      display: formatValue(option)
+    };
+  });
+  createEffect(() => {
+    if (!inputRef) return;
+    const message = internalError();
+    inputRef.setCustomValidity(message ?? (editing() ? messages().selectMatchingOption : ""));
+  });
+  const onKeyDown = event => {
+    if (event.isComposing) return;
+    if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+      event.preventDefault();
+      if (!popover.open()) {
+        const typed = editing() ? query() : "";
+        startSearch(typed, true);
+      } else {
+        move(event.key === "ArrowDown" ? 1 : -1);
+      }
+    } else if (event.key === "Enter" && popover.open()) {
+      const option = selectedForCommit();
+      if (!option) return;
+      event.preventDefault();
+      commit(option);
+      inputRef?.select();
+    } else if (event.key === "Escape" && (editing() || popover.open())) {
+      event.preventDefault();
+      if (editing()) restore();else popover.hide();
+    } else if (event.key === "Tab") {
+      requestCommit();
+      popover.hide();
+    }
+  };
+  return _$createComponent(Field, {
+    get ["class"]() {
+      return props.class;
+    },
+    get label() {
+      return props.label;
+    },
+    get description() {
+      return props.description;
+    },
+    get error() {
+      return error();
+    },
+    meta: meta,
+    get required() {
+      return props.required;
+    },
+    get disabled() {
+      return props.disabled;
+    },
+    get children() {
+      var _el$ = _$getNextElement(_tmpl$5),
+        _el$2 = _el$.firstChild,
+        _el$3 = _el$2.firstChild,
+        _el$4 = _el$3.nextSibling,
+        _el$7 = _el$4.nextSibling,
+        [_el$8, _co$] = _$getNextMarker(_el$7.nextSibling),
+        _el$9 = _el$8.nextSibling,
+        [_el$0, _co$2] = _$getNextMarker(_el$9.nextSibling),
+        _el$24 = _el$2.nextSibling,
+        [_el$25, _co$7] = _$getNextMarker(_el$24.nextSibling),
+        _el$1 = _el$25.nextSibling,
+        _el$10 = _el$1.nextSibling,
+        _el$22 = _el$10.firstChild,
+        [_el$23, _co$6] = _$getNextMarker(_el$22.nextSibling),
+        _el$12 = _el$23.nextSibling,
+        _el$16 = _el$12.firstChild,
+        [_el$17, _co$3] = _$getNextMarker(_el$16.nextSibling),
+        _el$18 = _el$17.nextSibling,
+        [_el$19, _co$4] = _$getNextMarker(_el$18.nextSibling),
+        _el$20 = _el$19.nextSibling,
+        [_el$21, _co$5] = _$getNextMarker(_el$20.nextSibling);
+      var _ref$ = popover.setTrigger;
+      typeof _ref$ === "function" ? _$use(_ref$, _el$2) : popover.setTrigger = _el$2;
+      _$use(element => {
+        inputRef = element;
+      }, _el$4);
+      _$setAttribute(_el$4, "spellcheck", false);
+      _$setAttribute(_el$4, "aria-controls", listboxId);
+      _$spread(_el$4, _$mergeProps({
+        get id() {
+          return meta.controlId;
+        },
+        get value() {
+          return display();
+        },
+        get placeholder() {
+          return props.placeholder ?? messages().typeToSearch;
+        },
+        get disabled() {
+          return props.disabled;
+        },
+        get required() {
+          return props.required;
+        },
+        get autofocus() {
+          return props.autofocus;
+        },
+        get ["aria-expanded"]() {
+          return popover.open();
+        },
+        get ["aria-activedescendant"]() {
+          return _$memo(() => !!focusedOption())() ? `${listboxId}-${focusedIndex()}` : undefined;
+        }
+      }, () => fieldControlAria(meta, {
+        ...props,
+        error: error()
+      }), {
+        "onPointerDown": () => {
+          pointerFocus = true;
+          queueMicrotask(() => pointerFocus = false);
+        },
+        "onFocus": () => {
+          setFocused(true);
+          if (!editing()) {
+            const option = selected();
+            snapshot = {
+              value: value(),
+              option,
+              display: formatValue(option)
+            };
+            setDisplay(snapshot.display);
+          }
+          if (!pointerFocus) queueMicrotask(() => inputRef?.select());
+        },
+        "onClick": () => {
+          if (!editing()) startSearch("", true);
+        },
+        "onInput": event => {
+          const typed = event.currentTarget.value;
+          const beginsEdit = !editing();
+          setEditing(true);
+          if (beginsEdit && value() !== null) props.onValueChange?.(null);
+          setDisplay(typed);
+          setQuery(typed);
+          pendingCommitQuery = undefined;
+          startSearch(typed);
+        },
+        "onKeyDown": onKeyDown,
+        "onBlur": event => {
+          setFocused(false);
+          if (event.relatedTarget instanceof Node && popoverRef?.contains(event.relatedTarget)) return;
+          requestCommit();
+          popover.hide();
+        }
+      }), false, false);
+      _$insert(_el$2, _$createComponent(Show, {
+        get when() {
+          return hasClearAction();
+        },
+        get children() {
+          var _el$5 = _$getNextElement(_tmpl$);
+          _el$5.$$click = () => {
+            snapshot = {
+              value: null,
+              option: undefined,
+              display: ""
+            };
+            setDisplay("");
+            setQuery("");
+            setEditing(false);
+            setResolvedQuery(undefined);
+            setMatch(undefined);
+            setFocusedIndex(-1);
+            setExplicitOption(false);
+            setInternalError(undefined);
+            commitFieldValue(props, null);
+            inputRef?.focus();
+          };
+          _el$5.$$pointerdown = event => event.preventDefault();
+          _$effect(() => _$setAttribute(_el$5, "aria-label", messages().clearSelection));
+          _$runHydrationEvents();
+          return _el$5;
+        }
+      }), _el$8, _co$);
+      _$insert(_el$2, _$createComponent(Show, {
+        get when() {
+          return loader.loading();
+        },
+        get fallback() {
+          return _$createComponent(Show, {
+            get when() {
+              return _$memo(() => !!editing())() && match();
+            },
+            get fallback() {
+              return _$getNextElement(_tmpl$7);
+            },
+            get children() {
+              return _$getNextElement(_tmpl$6);
+            }
+          });
+        },
+        get children() {
+          return _$getNextElement(_tmpl$2);
+        }
+      }), _el$0, _co$2);
+      _$insert(_el$, _$createComponent(Show, {
+        get when() {
+          return props.name;
+        },
+        children: name => (() => {
+          var _el$28 = _$getNextElement(_tmpl$8);
+          _$effect(() => _$setAttribute(_el$28, "name", name()));
+          _$effect(() => _$setProperty(_el$28, "value", value() ?? ""));
+          return _el$28;
+        })()
+      }), _el$25, _co$7);
+      _$insert(_el$1, (() => {
+        var _c$ = _$memo(() => !!loader.loading());
+        return () => _c$() ? props.checkingText ?? messages().checkingOptions : _$memo(() => !!match())() ? `Match: ${formatValue(match())}` : internalError() ?? "";
+      })());
+      _el$10.$$keydown = event => {
+        if (event.key !== "Escape") return;
+        event.preventDefault();
+        if (editing()) restore();else {
+          popover.hide();
+          inputRef?.focus();
+        }
+      };
+      _el$10.$$focusout = event => {
+        if (event.relatedTarget instanceof Node && (popoverRef?.contains(event.relatedTarget) || inputRef === event.relatedTarget)) return;
+        requestCommit();
+        popover.hide();
+      };
+      _$use(element => {
+        popoverRef = element;
+        popover.setPopover(element);
+      }, _el$10);
+      _$insert(_el$10, _$createComponent(Show, {
+        get when() {
+          return (props.groups?.length ?? 0) > 0;
+        },
+        get children() {
+          var _el$11 = _$getNextElement(_tmpl$3);
+          _$insert(_el$11, _$createComponent(ChoiceGroups, {
+            get choices() {
+              return groupChoices();
+            },
+            get value() {
+              return activeGroup();
+            },
+            onValueChange: chooseGroup,
+            get ariaLabel() {
+              return props.groupsAriaLabel ?? messages().filterOptions;
+            },
+            controls: listboxId
+          }));
+          return _el$11;
+        }
+      }), _el$23, _co$6);
+      _$setAttribute(_el$12, "id", listboxId);
+      _$insert(_el$12, _$createComponent(Show, {
+        get when() {
+          return loadError();
+        },
+        children: message => (() => {
+          var _el$29 = _$getNextElement(_tmpl$9),
+            _el$30 = _el$29.firstChild,
+            _el$31 = _el$30.nextSibling;
+          _$insert(_el$30, message);
+          _el$31.$$click = () => {
+            setInternalError(undefined);
+            loader.retry();
+          };
+          _el$31.$$pointerdown = event => event.preventDefault();
+          _$runHydrationEvents();
+          return _el$29;
+        })()
+      }), _el$17, _co$3);
+      _$insert(_el$12, _$createComponent(Show, {
+        get when() {
+          return _$memo(() => !!loader.loading())() && options().length === 0;
+        },
+        get children() {
+          var _el$13 = _$getNextElement(_tmpl$4),
+            _el$14 = _el$13.firstChild,
+            _el$15 = _el$14.nextSibling;
+          _$insert(_el$15, () => props.checkingText ?? messages().checkingOptionsLoading);
+          return _el$13;
+        }
+      }), _el$19, _co$4);
+      _$insert(_el$12, _$createComponent(For, {
+        get each() {
+          return _$memo(() => !!loadError())() ? [] : options();
+        },
+        get fallback() {
+          return _$createComponent(Show, {
+            get when() {
+              return _$memo(() => !!!loader.loading())() && !loadError();
+            },
+            get children() {
+              var _el$32 = _$getNextElement(_tmpl$0);
+              _$insert(_el$32, () => props.noOptionsText ?? messages().noOptionsFound);
+              return _el$32;
+            }
+          });
+        },
+        children: (option, index) => (() => {
+          var _el$33 = _$getNextElement(_tmpl$1),
+            _el$38 = _el$33.firstChild,
+            [_el$39, _co$9] = _$getNextMarker(_el$38.nextSibling),
+            _el$34 = _el$39.nextSibling,
+            _el$35 = _el$34.firstChild,
+            _el$36 = _el$35.nextSibling,
+            [_el$37, _co$8] = _$getNextMarker(_el$36.nextSibling);
+          _el$33.$$click = () => {
+            commit(option);
+            inputRef?.focus();
+            inputRef?.select();
+          };
+          _el$33.$$pointerdown = event => event.preventDefault();
+          _el$33.$$pointermove = () => focusOption(index());
+          _$use(element => optionRefs[index()] = element, _el$33);
+          _$insert(_el$33, _$createComponent(Show, {
+            get when() {
+              return option.color;
+            },
+            get fallback() {
+              return _$createComponent(Show, {
+                get when() {
+                  return option.icon;
+                },
+                children: icon => (() => {
+                  var _el$40 = _$getNextElement(_tmpl$10);
+                  _$effect(() => _$className(_el$40, icon()));
+                  return _el$40;
+                })()
+              });
+            },
+            children: color => (() => {
+              var _el$41 = _$getNextElement(_tmpl$11);
+              _$effect(_$p => _$setStyleProperty(_el$41, "background-color", color()));
+              return _el$41;
+            })()
+          }), _el$39, _co$9);
+          _$insert(_el$35, () => option.label);
+          _$insert(_el$34, _$createComponent(Show, {
+            get when() {
+              return option.description;
+            },
+            children: description => (() => {
+              var _el$42 = _$getNextElement(_tmpl$12);
+              _$insert(_el$42, description);
+              return _el$42;
+            })()
+          }), _el$37, _co$8);
+          _$effect(_p$ => {
+            var _v$4 = `${listboxId}-${index()}`,
+              _v$5 = option.label,
+              _v$6 = index() === focusedIndex(),
+              _v$7 = index() === focusedIndex() ? "true" : undefined,
+              _v$8 = option.disabled;
+            _v$4 !== _p$.e && _$setAttribute(_el$33, "id", _p$.e = _v$4);
+            _v$5 !== _p$.t && _$setAttribute(_el$33, "aria-label", _p$.t = _v$5);
+            _v$6 !== _p$.a && _$setAttribute(_el$33, "aria-selected", _p$.a = _v$6);
+            _v$7 !== _p$.o && _$setAttribute(_el$33, "data-focused", _p$.o = _v$7);
+            _v$8 !== _p$.i && _$setProperty(_el$33, "disabled", _p$.i = _v$8);
+            return _p$;
+          }, {
+            e: undefined,
+            t: undefined,
+            a: undefined,
+            o: undefined,
+            i: undefined
+          });
+          _$runHydrationEvents();
+          return _el$33;
+        })()
+      }), _el$21, _co$5);
+      _$effect(_p$ => {
+        var _v$ = error() ? "true" : undefined,
+          _v$2 = hasClearAction() ? "true" : undefined,
+          _v$3 = typeof props.label === "string" ? props.label : messages().options;
+        _v$ !== _p$.e && _$setAttribute(_el$, "data-invalid", _p$.e = _v$);
+        _v$2 !== _p$.t && _$setAttribute(_el$2, "data-clearable", _p$.t = _v$2);
+        _v$3 !== _p$.a && _$setAttribute(_el$10, "aria-label", _p$.a = _v$3);
+        return _p$;
+      }, {
+        e: undefined,
+        t: undefined,
+        a: undefined
+      });
+      _$runHydrationEvents();
+      return _el$;
+    }
+  });
+}
+export default AutocompleteSelect;
+_$delegateEvents(["pointerdown", "click", "focusout", "keydown", "pointermove"]);
+//# sourceMappingURL=AutocompleteSelect.js.map