import { useRef as D, useState as L, useEffect as R, createElement as h } from "react";
import { jsx as a, jsxs as Oe } from "react/jsx-runtime";
/* empty css                        */
import { useAppDispatch as Ce } from "./index-use-app-dispatch.js";
import { classNames as Te } from "./index-classNames.js";
import { InputBase as ge } from "./index-InputBase.js";
import { Icon as M } from "./index-Icon.js";
import { IconNames as $ } from "./index-IconNames.js";
import Ae from "./index-_virtual2.js";
import Ie from "./index-_virtual3.js";
import { ComponentContainer as Ke } from "./index-ComponentContainer.js";
import { Text as we } from "./index-Text.js";
import Ne from "./index-Autocomplete2.js";
import je from "./index-Chip.js";
const _e = (y) => {
  var P, F, q;
  const {
    className: v,
    id: x,
    value: b,
    infoText: B,
    label: U,
    labelType: _,
    placeholder: V,
    inputRef: W,
    formconfig: t,
    optionKey: s,
    options: O,
    noOptionsText: z = null,
    splitCommaTag: G = !1,
    multiple: c = !1,
    hideCaret: H = !1,
    hideClearButton: J = !1,
    restrictToOptions: C = !0,
    highlightOptions: Q = !0,
    popoverPosition: X,
    popoverMessage: Y,
    onKeyUp: T,
    onKeyDown: g,
    onChange: A,
    autoComplete: Z = !0,
    testId: I,
    replacements: ee,
    disabled: te,
    isLoading: oe,
    autoSelect: ne = !0,
    adornment: K,
    ...re
  } = y, se = Ce(), p = D(null), [le, u] = L(void 0);
  let i = W;
  i || (i = D(null));
  let w = null;
  t && (w = t._autocompleteRef ?? null, i = t._inputRef);
  let {
    required: N
  } = y;
  (((P = t == null ? void 0 : t.validation) == null ? void 0 : P.required) === !0 || ((F = t == null ? void 0 : t.validation) == null ? void 0 : F.required) === !1) && (N = (q = t == null ? void 0 : t.validation) == null ? void 0 : q.required), R(() => {
    var o, n;
    const e = (o = t == null ? void 0 : t._autocompleteRef) == null ? void 0 : o.current;
    e && (e.value = t == null ? void 0 : t.stateValue, u(Number((n = t == null ? void 0 : t.stateValue) == null ? void 0 : n.key)));
  }, [t]);
  const [d, j] = L(b ?? c ? [] : null);
  R(() => {
    t && setTimeout(() => {
      var e;
      j(t == null ? void 0 : t.stateValue), u(Number((e = t == null ? void 0 : t.stateValue) == null ? void 0 : e.key));
    }, 0);
  }, [t == null ? void 0 : t.stateValue]);
  const E = (e) => !K || e === void 0 ? null : K[e], ae = (e, o) => c ? a("div", {
    className: "vanguard-input-tags",
    children: e.map((n, l) => h(je, {
      label: a(we, {
        children: s && n ? n[s] : n
      }),
      ...o({
        index: l
      }),
      key: l,
      style: {
        height: "100%"
      }
    }))
  }) : null, m = (e, o, n, l) => {
    C && i && i.current && typeof o == "string" && (i.current.value = o), o && typeof o == "object" && !Array.isArray(o) && "key" in o ? u(Number(o.key)) : u(void 0), j(o), t && t && t.setStateValue && se(t.setStateValue(o)), A && (n || (n = "blur"), A(e, o, n, l));
  }, ie = (e) => {
    var o;
    if (e.key === "Enter" && !p.current) {
      const n = ((o = i == null ? void 0 : i.current) == null ? void 0 : o.value.split(",").filter((r) => !!r)) ?? [], l = (n == null ? void 0 : n.map(s ? (r) => ({
        [s]: r
      }) : (r) => r)) ?? [];
      Array.isArray(d) ? m(e, [...d, ...l], "selectOption") : m(e, [...l], "selectOption"), (n == null ? void 0 : n.length) > 0 && (e.stopPropagation(), e.preventDefault(), e.nativeEvent.stopImmediatePropagation());
    }
  }, k = () => {
    const e = document.getElementsByClassName("MuiAutocomplete-option");
    if (p.current) {
      p.current = !1;
      for (const o of e)
        o.className.indexOf("Mui-focused") > -1 && (p.current = !0);
    }
  }, pe = (e) => {
  }, ue = (e) => {
    k(), T && T(e);
  }, ce = (e) => {
    k(), G && ie(e), g && g(e);
  }, de = (e, o, {
    inputValue: n
  }) => {
    if (Q) {
      const r = f(o), ye = Ae(r, n), ve = Ie(r, ye);
      return h("li", {
        ...e,
        key: r
      }, Oe("div", {
        className: "option-style",
        children: [E(o.key), a("span", {
          children: ve.map((S, be) => a("span", {
            style: {
              fontWeight: S.highlight ? 700 : 400
            },
            children: S.text
          }, be))
        })]
      }));
    }
    const l = f(o);
    return h("li", {
      ...e,
      key: l
    }, a("div", {
      children: l
    }));
  }, f = (e) => {
    const o = Object.keys(e ?? {});
    return e === [] || o.length === 0 ? "" : typeof e == "object" ? (!s || !e.hasOwnProperty(s) && e.hasOwnProperty("objectType"), e && s ? e[s] ?? "" : "") : e;
  }, me = (e, o) => {
    if (!o)
      return !1;
    let n = e;
    if (typeof e == "object") {
      const r = e;
      r && s && (r.hasOwnProperty(s), n = r[s]);
    }
    let l = o;
    if (typeof o == "object") {
      const r = o;
      r && s && (r.hasOwnProperty(s), l = r[s]);
    }
    return n === l;
  }, fe = () => {
    const e = ["vanguard-autocomplete"];
    return v && e.push(v), J && e.push("vanguard-autocomplete-no-clear-btn"), (H || b !== null) && e.push("vanguard-autocomplete-no-caret"), Te(...e);
  }, he = () => a("div", {
    children: "No options available!!"
  });
  return a(Ke, {
    className: fe(),
    children: a(Ne, {
      ...re,
      "data-testid": I,
      id: x,
      ref: w,
      value: d,
      freeSolo: !C,
      autoComplete: Z,
      autoSelect: ne,
      multiple: c,
      options: O,
      noOptionsText: z,
      renderTags: ae,
      renderOption: de,
      ListboxComponent: O.length === 0 ? he : void 0,
      isOptionEqualToValue: me,
      getOptionLabel: f,
      onChange: m,
      clearIcon: a(M, {
        color: "--n400",
        children: $.close
      }),
      popupIcon: a(M, {
        color: "--n400",
        children: $.caretDown
      }),
      disabled: te,
      renderInput: (e) => a(ge, {
        formconfig: t,
        inputRef: i,
        isLoading: oe,
        testId: `${I}-input`,
        textFieldProps: e,
        required: N,
        infoText: B,
        label: U,
        labelType: _,
        placeholder: V,
        popoverMessage: Y,
        popoverPosition: X,
        onKeyDown: ce,
        onKeyUp: ue,
        onChange: pe,
        formFieldType: "Autocomplete",
        replacements: ee,
        adornment: E(le)
      })
    })
  });
};
export {
  _e as Autocomplete
};
