@owp/core 2.5.30 → 2.5.32

package/dist/components/OwpSelectorBase/OwpSelectorAutocomplete.js

@@ -1,66 +1,542 @@
-var Se = Object.defineProperty;
-var o = (s, a) => Se(s, "name", { value: a, configurable: !0 });
-import { jsxs as x, jsx as i, Fragment as D } from "../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
-import { createElement as be } from "@emotion/react";
-import { useOwpTranslation as ye } from "../../hooks/useOwpTranslation.js";
-import te from "../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/ArrowDropDown.js";
-import oe from "../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/Clear.js";
-import { Box as Oe, Chip as P, Checkbox as Me, TextField as ne, CircularProgress as le, Autocomplete as re, ClickAwayListener as De, Paper as Pe, Popper as Ne } from "@mui/material";
-import { alpha as g } from "@mui/material/styles";
-import { clsx as ie } from "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
-import { useMemo as se, useState as we, useRef as ae, useEffect as pe } from "react";
-import { SELECTOR_ALL_VALUE_LABEL_SX as ke, SELECTOR_ALL_OPTION_LABEL_SX as Re } from "./selectorBaseStyles.js";
-import { isSelectorAllOption as d } from "./utils/querySelectorUtils.js";
-const ue = 2, Ve = 152, ce = 72, me = 18.57, Ue = "11px !important", ze = "2px !important", He = "5px !important", de = /* @__PURE__ */ o((s, a) => {
-  const p = s.target;
-  return p instanceof HTMLInputElement ? p.value : a ?? "";
-}, "getCurrentAutocompleteInputValue"), fe = /* @__PURE__ */ o((s) => typeof s == "string" || typeof s == "number" ? `${s}` : "", "getAutocompleteOptionLabel"), Te = /* @__PURE__ */ o((s) => /* @__PURE__ */ i(
-  Oe,
+var it = Object.defineProperty;
+var t = (i, r) => it(i, "name", { value: r, configurable: !0 });
+import { jsx as a, jsxs as X, Fragment as We } from "../../node_modules/.pnpm/@emotion_react@11.14.0_@types_react@19.2.14_react@19.2.4/node_modules/@emotion/react/jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js";
+import { createElement as st } from "@emotion/react";
+import { useOwpTranslation as ct } from "../../hooks/useOwpTranslation.js";
+import Ge from "../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/ArrowDropDown.js";
+import Ze from "../../node_modules/.pnpm/@mui_icons-material@7.3.9_@mui_material@7.3.9_@emotion_react@11.14.0_@types_react@19.2._dc2be6bc014bebdac88a574e3e02c144/node_modules/@mui/icons-material/esm/Clear.js";
+import { Box as W, Chip as Ke, Checkbox as ut, TextField as $e, CircularProgress as qe, Autocomplete as Ye, ClickAwayListener as pt, Paper as lt, Popper as rt, IconButton as Je } from "@mui/material";
+import mt from "@mui/material/useAutocomplete";
+import { alpha as j } from "@mui/material/styles";
+import { clsx as K } from "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
+import { useMemo as se, useState as Pe, useRef as Y, useCallback as R, useEffect as Se } from "react";
+import { SELECTOR_ALL_VALUE_LABEL_SX as dt, SELECTOR_ALL_OPTION_LABEL_SX as ft } from "./selectorBaseStyles.js";
+import { isSelectorAllOption as q } from "./utils/querySelectorUtils.js";
+const Qe = 2, It = 152, Fe = 72, Xe = 18.57, Tt = "11px !important", ht = "2px !important", At = "5px !important", gt = 100, ie = 36, ke = 8, et = 8, tt = 8, Ot = 30, bt = 26, Et = /[\u0300-\u036f]/g, Mt = /* @__PURE__ */ t((i, r) => {
+  if (typeof i == "function") {
+    i(r);
+    return;
+  }
+  i && (i.current = r);
+}, "assignAutocompleteListboxRef"), St = /* @__PURE__ */ t((i, r, g, h) => {
+  const E = /* @__PURE__ */ new Set(), M = /* @__PURE__ */ t((f) => {
+    f >= 0 && f < i && E.add(f);
+  }, "addIndex");
+  M(0), M(i - 1), M(h);
+  for (let f = r; f < g; f += 1)
+    M(f);
+  return Array.from(E).sort((f, L) => f - L);
+}, "getVirtualizedOptionIndexes"), yt = /* @__PURE__ */ t((i) => [
+  {
+    listStyle: "none",
+    margin: 0,
+    maxHeight: "40vh",
+    overflow: "auto",
+    padding: 0,
+    position: "relative",
+    ...i ? { height: i } : {},
+    "& .MuiAutocomplete-option": {
+      alignItems: "center",
+      boxSizing: "border-box",
+      cursor: "pointer",
+      display: "flex",
+      justifyContent: "flex-start",
+      minHeight: 48,
+      outline: 0,
+      overflow: "hidden",
+      paddingBottom: 0.75,
+      paddingLeft: 2,
+      paddingRight: 2,
+      paddingTop: 0.75,
+      WebkitTapHighlightColor: "transparent",
+      "@media (min-width:600px)": {
+        minHeight: "auto"
+      },
+      "&.Mui-focused": {
+        backgroundColor: /* @__PURE__ */ t((r) => r.palette.action.hover, "backgroundColor"),
+        "@media (hover: none)": {
+          backgroundColor: "transparent"
+        }
+      },
+      "&.Mui-focusVisible": {
+        backgroundColor: /* @__PURE__ */ t((r) => r.palette.action.focus, "backgroundColor")
+      },
+      '&[aria-disabled="true"]': {
+        opacity: /* @__PURE__ */ t((r) => r.palette.action.disabledOpacity, "opacity"),
+        pointerEvents: "none"
+      },
+      '&[aria-selected="true"]': {
+        backgroundColor: /* @__PURE__ */ t((r) => j(r.palette.primary.main, r.palette.action.selectedOpacity), "backgroundColor"),
+        "&.Mui-focused": {
+          backgroundColor: /* @__PURE__ */ t((r) => j(
+            r.palette.primary.main,
+            r.palette.action.selectedOpacity + r.palette.action.hoverOpacity
+          ), "backgroundColor"),
+          "@media (hover: none)": {
+            backgroundColor: /* @__PURE__ */ t((r) => r.palette.action.selected, "backgroundColor")
+          }
+        },
+        "&.Mui-focusVisible": {
+          backgroundColor: /* @__PURE__ */ t((r) => j(
+            r.palette.primary.main,
+            r.palette.action.selectedOpacity + r.palette.action.focusOpacity
+          ), "backgroundColor")
+        }
+      }
+    }
+  }
+], "getVirtualizedAutocompleteListboxSx"), Lt = /* @__PURE__ */ t(({
+  getListboxProps: i,
+  getOptionProps: r,
+  options: g,
+  selectedOption: h
+}) => {
+  const E = i(), { ref: M, style: f, ...L } = E, x = Y(null), [_, U] = Pe(0), O = g.length, d = Math.max(0, Math.min(_, Math.max(O - 1, 0))), z = Math.min(
+    O,
+    d + et + tt * 2
+  ), N = se(() => {
+    if (!h)
+      return -1;
+    for (let p = 0; p < O; p += 1)
+      if (g[p].value === h.value)
+        return p;
+    return -1;
+  }, [O, g, h]), ce = se(
+    () => St(
+      O,
+      d,
+      z,
+      N
+    ),
+    [O, N, z, d]
+  ), I = Math.min(O, et) * ie + ke * 2, H = R(
+    (p) => {
+      x.current = p, Mt(M, p);
+    },
+    [M]
+  ), T = /* @__PURE__ */ t((p) => {
+    const l = Math.max(
+      0,
+      Math.floor(
+        (p.currentTarget.scrollTop - ke) / ie
+      ) - tt
+    );
+    U(
+      (s) => s === l ? s : l
+    );
+  }, "handleScroll");
+  return Se(() => {
+    U(0), x.current && (x.current.scrollTop = 0);
+  }, [O]), /* @__PURE__ */ a(
+    W,
+    {
+      component: "div",
+      ...L,
+      ref: H,
+      onScroll: T,
+      style: f,
+      sx: yt(I),
+      children: /* @__PURE__ */ a(
+        W,
+        {
+          component: "ul",
+          sx: {
+            height: O * ie + ke * 2,
+            listStyle: "none",
+            margin: 0,
+            padding: 0,
+            position: "relative"
+          },
+          children: ce.map((p) => {
+            const l = g[p], s = r({ option: l, index: p }), { key: C, ...D } = s, S = ke + p * ie;
+            return /* @__PURE__ */ a(
+              "li",
+              {
+                ...D,
+                className: K("MuiAutocomplete-option", D.className),
+                style: {
+                  ...D.style,
+                  height: ie,
+                  left: 0,
+                  minHeight: ie,
+                  position: "absolute",
+                  right: 0,
+                  top: S
+                },
+                children: je(l)
+              },
+              C
+            );
+          })
+        }
+      )
+    }
+  );
+}, "OwpVirtualizedAutocompleteOptionList"), ot = /* @__PURE__ */ t((i, r) => {
+  const g = i.target;
+  return g instanceof HTMLInputElement ? g.value : r ?? "";
+}, "getCurrentAutocompleteInputValue"), A = /* @__PURE__ */ t((i) => typeof i == "string" || typeof i == "number" ? `${i}` : "", "getAutocompleteOptionLabel"), nt = /* @__PURE__ */ t((i) => i.normalize("NFD").replace(Et, "").toLowerCase(), "normalizeAutocompleteSearchText"), je = /* @__PURE__ */ t((i) => /* @__PURE__ */ a(
+  W,
   {
     component: "span",
-    sx: d(s) ? Re : void 0,
-    children: s.label
+    sx: q(i) ? ft : void 0,
+    children: i.label
   }
-), "renderAutocompleteOptionLabel"), Fe = /* @__PURE__ */ o(({ hookResult: s, props: a }) => {
-  const { t: p } = ye(), {
-    autocompleteInputValue: f,
-    className: N,
-    disableClientFilter: C,
-    disabled: h,
-    error: w,
-    fullWidth: A,
-    helperText: k,
-    label: R,
-    loading: E,
-    loadingText: V,
-    multiple: U,
-    noOptionsText: Ie,
-    onAutocompleteInputChange: c,
-    placeholder: z,
-    required: H,
-    showAllOption: T = !0,
-    textFieldProps: n,
-    valueTextAlign: v
-  } = a, {
-    allOption: _,
-    clearSelection: B,
-    isAllSelected: m,
-    resolvedOptions: W,
-    restoreAllSelection: K,
-    selectAll: $,
-    selectedOption: he,
-    selectedOptions: S,
-    selectMultipleValues: q,
-    selectSingleValue: G
-  } = s, j = T ? [_, ...W] : W, b = se(
-    () => S.filter((e) => !d(e)),
-    [S]
-  ), X = se(
-    () => m ? [] : b.slice(ue),
-    [b, m]
-  ), u = X.length, [Z, y] = we(null), J = ae(null), Q = Ie ?? p(C ? "Message.검색 결과 없음" : "Message.조회된 결과가 없습니다."), Y = ae(
-    U && T && ((a.value ?? a.defaultValue) == null || (a.value ?? a.defaultValue) === "")
-  ), F = {
+), "renderAutocompleteOptionLabel"), Ct = /* @__PURE__ */ t(({
+  autocompleteInputValue: i,
+  autocompleteSx: r,
+  className: g,
+  disableClientFilter: h,
+  disabled: E,
+  error: M,
+  fullWidth: f,
+  helperText: L,
+  label: x,
+  loading: _,
+  loadingText: U,
+  noOptionsText: O,
+  onAutocompleteInputChange: d,
+  options: z,
+  placeholder: N,
+  required: ce,
+  resolvedTextFieldVariant: I,
+  selectSingleValue: H,
+  selectedOption: T,
+  showAllOption: p,
+  singleAutocompleteInputSx: l,
+  textFieldProps: s
+}) => {
+  var re, be, _e, ve, Ne, xe, Ve;
+  const C = i !== void 0, D = Y(!1), S = Y(!1), [ue, pe] = Pe(
+    () => T ? A(T.label) : ""
+  ), me = C ? i : ue, b = se(
+    () => new Map(
+      z.map((o) => [
+        o.value,
+        nt(A(o.label))
+      ])
+    ),
+    [z]
+  ), v = R(
+    (o) => {
+      C || pe(o);
+    },
+    [C]
+  ), J = R((o) => {
+    D.current = !0, v(""), d == null || d("", o);
+  }, [d, v]), Q = R(() => {
+    const o = T ? A(T.label) : "";
+    D.current = !1, v(o), d == null || d(o, "reset");
+  }, [d, T, v]), F = R(
+    (o, u) => {
+      var we;
+      if (h)
+        return o;
+      const y = nt(u.inputValue);
+      if (!y)
+        return o;
+      const ae = [];
+      for (const Ee of o)
+        (we = b.get(Ee.value)) != null && we.includes(y) && ae.push(Ee);
+      return ae;
+    },
+    [h, b]
+  ), {
+    anchorEl: de,
+    dirty: Re,
+    getClearProps: fe,
+    getInputLabelProps: ye,
+    getInputProps: V,
+    getListboxProps: Le,
+    getOptionProps: Ie,
+    getPopupIndicatorProps: Ce,
+    getRootProps: Te,
+    groupedOptions: B,
+    popupOpen: ee,
+    setAnchorEl: te
+  } = mt({
+    componentName: "OwpSelectorAutocomplete",
+    disabled: E,
+    filterOptions: F,
+    getOptionKey: /* @__PURE__ */ t((o) => o.value, "getOptionKey"),
+    getOptionLabel: /* @__PURE__ */ t((o) => A(o.label), "getOptionLabel"),
+    inputValue: me,
+    isOptionEqualToValue: /* @__PURE__ */ t((o, u) => o.value === u.value, "isOptionEqualToValue"),
+    onChange: /* @__PURE__ */ t((o, u, y) => {
+      if (y === "clear" || y === "removeOption") {
+        J(y);
+        return;
+      }
+      if (D.current = !1, !u || p && q(u)) {
+        v(
+          u ? A(u.label) : ""
+        ), H("");
+        return;
+      }
+      v(A(u.label)), H(u.value);
+    }, "onChange"),
+    onInputChange: /* @__PURE__ */ t((o, u, y) => {
+      y === "input" && (D.current = !0), v(u), d == null || d(u, y);
+    }, "onInputChange"),
+    options: z,
+    selectOnFocus: !0,
+    value: T
+  }), G = Te(), w = V(), De = ye(), he = fe(), oe = Ce(), k = Re && !E && me !== "", Z = (re = s == null ? void 0 : s.slotProps) == null ? void 0 : re.htmlInput, {
+    className: ne,
+    onBlur: Ae,
+    onKeyDown: le,
+    ...Ue
+  } = Z ?? {}, ze = (_e = (be = s == null ? void 0 : s.slotProps) == null ? void 0 : be.input) == null ? void 0 : _e.className, He = R(
+    (o) => {
+      te(o);
+    },
+    [te]
+  ), ge = /* @__PURE__ */ t((o) => {
+    o.preventDefault(), o.stopPropagation(), S.current = !1, J("clear");
+  }, "handleClearClick"), Oe = /* @__PURE__ */ t((o) => {
+    o.preventDefault(), o.stopPropagation(), S.current = !0;
+  }, "handleClearMouseDown"), Be = /* @__PURE__ */ t((o) => {
+    if (le == null || le(o), o.defaultPrevented || E)
+      return;
+    if (o.key === "Escape" || o.key === "Tab") {
+      Q();
+      return;
+    }
+    if (o.key !== "Backspace" && o.key !== "Delete" || !T)
+      return;
+    const u = o.currentTarget.value, y = A(T.label), ae = o.currentTarget.selectionStart !== o.currentTarget.selectionEnd;
+    (u === "" || u === y || ae) && (o.preventDefault(), o.defaultMuiPrevented = !0, J("input"));
+  }, "handleInputKeyDown"), P = /* @__PURE__ */ t((o) => {
+    var u;
+    if ((u = w.onBlur) == null || u.call(w, o), Ae == null || Ae(o), S.current) {
+      S.current = !1;
+      return;
+    }
+    Q();
+  }, "handleInputBlur");
+  return Se(() => {
+    C || D.current || pe(
+      T ? A(T.label) : ""
+    );
+  }, [C, T]), /* @__PURE__ */ X(
+    W,
+    {
+      ...G,
+      className: K(
+        "MuiAutocomplete-root min-w-128",
+        f && "MuiAutocomplete-fullWidth",
+        ee && "Mui-expanded",
+        k && "MuiAutocomplete-hasClearIcon",
+        "MuiAutocomplete-hasPopupIcon",
+        g
+      ),
+      sx: [
+        r,
+        f ? { width: "100%" } : void 0,
+        {
+          "& .MuiAutocomplete-inputRoot": {
+            paddingRight: `${Ot + (k ? bt : 0)}px !important`,
+            position: "relative"
+          },
+          "& .MuiAutocomplete-inputRoot .MuiAutocomplete-input": {
+            minWidth: 30,
+            width: 0
+          },
+          "& .MuiAutocomplete-input": {
+            flexGrow: 1,
+            textOverflow: "ellipsis"
+          },
+          "& .MuiAutocomplete-endAdornment": {
+            alignItems: "center",
+            display: "flex",
+            position: "absolute",
+            right: I === "standard" ? 0 : 9,
+            top: "50%",
+            transform: "translate(0, -50%)"
+          },
+          "& .MuiAutocomplete-clearIndicator": {
+            marginRight: -0.25,
+            padding: 0.5,
+            visibility: "visible"
+          },
+          "& .MuiAutocomplete-popupIndicator": {
+            marginRight: -0.25,
+            padding: 0.25
+          },
+          "& .MuiAutocomplete-popupIndicatorOpen": {
+            transform: "rotate(180deg)"
+          }
+        }
+      ],
+      children: [
+        /* @__PURE__ */ a(
+          $e,
+          {
+            ...s,
+            disabled: E,
+            error: M,
+            fullWidth: f,
+            helperText: L,
+            label: x,
+            placeholder: N,
+            required: ce,
+            slotProps: {
+              ...s == null ? void 0 : s.slotProps,
+              htmlInput: {
+                ...w,
+                ...Ue,
+                className: K(
+                  "MuiAutocomplete-input",
+                  w.className,
+                  ne
+                ),
+                onBlur: P,
+                onKeyDown: Be
+              },
+              input: {
+                ...(ve = s == null ? void 0 : s.slotProps) == null ? void 0 : ve.input,
+                ref: He,
+                className: K("MuiAutocomplete-inputRoot", ze),
+                sx: {
+                  ...l ?? {},
+                  ...((xe = (Ne = s == null ? void 0 : s.slotProps) == null ? void 0 : Ne.input) == null ? void 0 : xe.sx) ?? {}
+                },
+                endAdornment: /* @__PURE__ */ X(W, { className: "MuiAutocomplete-endAdornment", children: [
+                  _ ? /* @__PURE__ */ a(qe, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
+                  k ? /* @__PURE__ */ a(
+                    Je,
+                    {
+                      className: "MuiAutocomplete-clearIndicator m-0",
+                      onClick: ge,
+                      onMouseDown: Oe,
+                      size: "small",
+                      tabIndex: he.tabIndex,
+                      type: "button",
+                      children: /* @__PURE__ */ a(Ze, { sx: { fontSize: Xe } })
+                    }
+                  ) : null,
+                  /* @__PURE__ */ a(
+                    Je,
+                    {
+                      className: K(
+                        "MuiAutocomplete-popupIndicator m-0",
+                        ee && "MuiAutocomplete-popupIndicatorOpen"
+                      ),
+                      onClick: /* @__PURE__ */ t((o) => {
+                        var u;
+                        return (u = oe.onClick) == null ? void 0 : u.call(oe, o);
+                      }, "onClick"),
+                      size: "small",
+                      disabled: E,
+                      tabIndex: oe.tabIndex,
+                      type: "button",
+                      children: /* @__PURE__ */ a(Ge, {})
+                    }
+                  )
+                ] })
+              },
+              inputLabel: {
+                ...De,
+                ...(Ve = s == null ? void 0 : s.slotProps) == null ? void 0 : Ve.inputLabel
+              }
+            },
+            variant: I
+          }
+        ),
+        de ? /* @__PURE__ */ a(
+          rt,
+          {
+            anchorEl: de,
+            open: ee,
+            placement: "bottom-start",
+            style: { width: de.clientWidth },
+            sx: { zIndex: 99999 },
+            children: /* @__PURE__ */ X(
+              lt,
+              {
+                sx: {
+                  "& .MuiAutocomplete-noOptions": {
+                    fontSize: 14,
+                    px: 1,
+                    py: 1.5,
+                    whiteSpace: "nowrap"
+                  }
+                },
+                children: [
+                  _ && B.length === 0 ? /* @__PURE__ */ a(W, { sx: { fontSize: 14, px: 1, py: 1.5, whiteSpace: "nowrap" }, children: U }) : null,
+                  !_ && B.length === 0 ? /* @__PURE__ */ a(
+                    W,
+                    {
+                      className: "MuiAutocomplete-noOptions",
+                      onMouseDown: /* @__PURE__ */ t((o) => {
+                        o.preventDefault();
+                      }, "onMouseDown"),
+                      role: "presentation",
+                      children: O
+                    }
+                  ) : null,
+                  B.length > 0 ? /* @__PURE__ */ a(
+                    Lt,
+                    {
+                      getListboxProps: Le,
+                      getOptionProps: Ie,
+                      options: B,
+                      selectedOption: T
+                    }
+                  ) : null
+                ]
+              }
+            )
+          }
+        ) : null
+      ]
+    }
+  );
+}, "OwpVirtualizedSingleSelectorAutocomplete"), Bt = /* @__PURE__ */ t(({ hookResult: i, props: r }) => {
+  var Ee;
+  const { t: g } = ct(), {
+    autocompleteInputValue: h,
+    autocompleteVirtualizationThreshold: E,
+    className: M,
+    disableClientFilter: f,
+    disabled: L,
+    error: x,
+    fullWidth: _,
+    helperText: U,
+    label: O,
+    loading: d,
+    loadingText: z,
+    multiple: N,
+    noOptionsText: ce,
+    onAutocompleteInputChange: I,
+    placeholder: H,
+    required: T,
+    showAllOption: p = !0,
+    textFieldProps: l,
+    valueTextAlign: s
+  } = r, {
+    allOption: C,
+    clearSelection: D,
+    isAllSelected: S,
+    resolvedOptions: ue,
+    restoreAllSelection: pe,
+    selectAll: me,
+    selectedOption: b,
+    selectedOptions: v,
+    selectMultipleValues: J,
+    selectSingleValue: Q
+  } = i, F = se(
+    () => p ? [C, ...ue] : ue,
+    [C, ue, p]
+  ), de = E === !1 ? Number.POSITIVE_INFINITY : Math.max(1, E ?? gt), Re = F.length >= de, fe = se(
+    () => v.filter((e) => !q(e)),
+    [v]
+  ), ye = se(
+    () => S ? [] : fe.slice(Qe),
+    [fe, S]
+  ), V = ye.length, [Le, Ie] = Pe(null), Ce = Y(null), Te = ce ?? g(f ? "Message.검색 결과 없음" : "Message.조회된 결과가 없습니다."), B = z ?? g("Common.로딩 중..."), ee = Y(
+    N && p && ((r.value ?? r.defaultValue) == null || (r.value ?? r.defaultValue) === "")
+  ), te = {
     clearIndicator: {
       className: "m-0 p-0",
       size: "small",
@@ -81,13 +557,13 @@ const ue = 2, Ve = 152, ce = 72, me = 18.57, Ue = "11px !important", ze = "2px !
       size: "small",
       tabIndex: -1
     }
-  }, L = (n == null ? void 0 : n.variant) ?? "standard", M = L === "standard" ? Ue : L === "outlined" ? (n == null ? void 0 : n.size) === "small" ? He : ze : void 0, Ae = M || v ? {
+  }, G = (l == null ? void 0 : l.variant) ?? "standard", w = G === "standard" ? Tt : G === "outlined" ? (l == null ? void 0 : l.size) === "small" ? At : ht : void 0, De = w || s ? {
     "& .MuiAutocomplete-input": {
-      ...M ? { paddingLeft: M } : {},
-      ...v ? { textAlign: v } : {}
+      ...w ? { paddingLeft: w } : {},
+      ...s ? { textAlign: s } : {}
     }
-  } : void 0, ee = {
-    minWidth: Ve,
+  } : void 0, he = {
+    minWidth: It,
     "& .MuiAutocomplete-endAdornment": {
       "& .MuiAutocomplete-clearIndicator + .MuiAutocomplete-popupIndicator": {
         ml: 0
@@ -103,189 +579,267 @@ const ue = 2, Ve = 152, ce = 72, me = 18.57, Ue = "11px !important", ze = "2px !
       gap: 0,
       right: 0
     }
-  }, Ee = {
-    ...ee,
+  }, oe = {
+    ...he,
     "& .MuiAutocomplete-inputRoot .MuiAutocomplete-input": {
-      flexBasis: ce,
-      minWidth: ce
+      flexBasis: Fe,
+      minWidth: Fe
     }
-  };
-  pe(() => {
-    u || y(null);
-  }, [u]), pe(() => {
-    var l;
-    if (!Y.current)
+  }, k = h !== void 0, Z = Y(!1), ne = Y(!1), [Ae, le] = Pe(
+    () => b ? A(b.label) : ""
+  ), Ue = k ? h : Ae, ze = (Ee = l == null ? void 0 : l.slotProps) == null ? void 0 : Ee.htmlInput, {
+    className: He,
+    onBlur: ge,
+    onKeyDown: Oe,
+    ...Be
+  } = ze ?? {}, P = R(
+    (e) => {
+      k || le(e);
+    },
+    [k]
+  ), re = R(
+    (e, n = !0) => {
+      Z.current = !0, P(""), n && (I == null || I("", e));
+    },
+    [I, P]
+  ), be = R(() => {
+    const e = b ? A(b.label) : "";
+    Z.current = !1, P(e), I == null || I(e, "reset");
+  }, [I, b, P]);
+  Se(() => {
+    V || Ie(null);
+  }, [V]), Se(() => {
+    N || k || Z.current || le(
+      b ? A(b.label) : ""
+    );
+  }, [k, N, b]), Se(() => {
+    var c;
+    if (!ee.current)
       return;
-    const e = (l = J.current) == null ? void 0 : l.closest("form");
+    const e = (c = Ce.current) == null ? void 0 : c.closest("form");
     if (!e)
       return;
-    const t = /* @__PURE__ */ o(() => {
+    const n = /* @__PURE__ */ t(() => {
       window.setTimeout(() => {
-        K();
+        pe();
       }, 0);
     }, "handleFormReset");
-    return e.addEventListener("reset", t), () => {
-      e.removeEventListener("reset", t);
+    return e.addEventListener("reset", n), () => {
+      e.removeEventListener("reset", n);
     };
-  }, [K]);
-  const Le = /* @__PURE__ */ o(() => {
-    y(null);
-  }, "handleHiddenChipPopperClose"), xe = /* @__PURE__ */ o((e) => {
+  }, [pe]);
+  const _e = /* @__PURE__ */ t(() => {
+    Ie(null);
+  }, "handleHiddenChipPopperClose"), ve = /* @__PURE__ */ t((e) => {
     e.preventDefault();
-  }, "handleHiddenChipSummaryMouseDown"), ge = /* @__PURE__ */ o((e) => {
-    e.preventDefault(), e.stopPropagation(), y(
-      (t) => t === e.currentTarget ? null : e.currentTarget
+  }, "handleHiddenChipSummaryMouseDown"), Ne = /* @__PURE__ */ t((e) => {
+    e.preventDefault(), e.stopPropagation(), Ie(
+      (n) => n === e.currentTarget ? null : e.currentTarget
     );
-  }, "handleHiddenChipSummaryClick"), Ce = /* @__PURE__ */ o((e) => {
-    q(
-      b.filter((t) => t.value !== e).map((t) => t.value)
+  }, "handleHiddenChipSummaryClick"), xe = /* @__PURE__ */ t((e) => {
+    J(
+      fe.filter((n) => n.value !== e).map((n) => n.value)
     );
-  }, "handleHiddenChipDelete"), ve = /* @__PURE__ */ o((e) => {
-    var l;
-    const t = de(e, f);
-    (m || u > 0) && t === "" && (e.key === "Backspace" || e.key === "Delete") && (e.defaultMuiPrevented = !0, e.preventDefault(), e.stopPropagation()), (l = n == null ? void 0 : n.onKeyDown) == null || l.call(
-      n,
+  }, "handleHiddenChipDelete"), Ve = /* @__PURE__ */ t((e) => {
+    var c;
+    const n = ot(e, h);
+    (S || V > 0) && n === "" && (e.key === "Backspace" || e.key === "Delete") && (e.defaultMuiPrevented = !0, e.preventDefault(), e.stopPropagation()), (c = l == null ? void 0 : l.onKeyDown) == null || c.call(
+      l,
       e
     );
-  }, "handleMultipleRootKeyDown");
-  return U ? /* @__PURE__ */ x(D, { children: [
-    /* @__PURE__ */ i(
-      re,
+  }, "handleMultipleRootKeyDown"), o = /* @__PURE__ */ t((e) => {
+    e.preventDefault(), e.stopPropagation(), ne.current = !0;
+  }, "handleSingleAutocompleteClearMouseDown"), u = /* @__PURE__ */ t((e) => {
+    e.preventDefault(), e.stopPropagation(), ne.current = !1, re("clear");
+  }, "handleSingleAutocompleteClearClick"), y = /* @__PURE__ */ t((e) => {
+    if (Oe == null || Oe(e), e.defaultPrevented || L)
+      return;
+    if (e.key === "Escape" || e.key === "Tab") {
+      be();
+      return;
+    }
+    if (e.key !== "Backspace" && e.key !== "Delete" || !b)
+      return;
+    const n = e.currentTarget.value, c = A(b.label), m = e.currentTarget.selectionStart !== e.currentTarget.selectionEnd;
+    (n === "" || n === c || m) && (e.preventDefault(), e.defaultMuiPrevented = !0, re("input"));
+  }, "handleSingleAutocompleteInputKeyDown"), ae = /* @__PURE__ */ t((e, n) => {
+    if (ne.current) {
+      ne.current = !1;
+      return;
+    }
+    n == null || n(e), ge == null || ge(e), be();
+  }, "handleSingleAutocompleteInputBlur"), we = {
+    ...te,
+    clearIndicator: {
+      ...te.clearIndicator,
+      onClick: u,
+      onMouseDown: o
+    }
+  };
+  return !N && Re ? /* @__PURE__ */ a(
+    Ct,
+    {
+      autocompleteInputValue: h,
+      autocompleteSx: he,
+      className: M,
+      disableClientFilter: f,
+      disabled: L,
+      error: x,
+      fullWidth: _,
+      helperText: U,
+      label: O,
+      loading: d,
+      loadingText: B,
+      noOptionsText: Te,
+      onAutocompleteInputChange: I,
+      options: F,
+      placeholder: H,
+      required: T,
+      resolvedTextFieldVariant: G,
+      selectSingleValue: Q,
+      selectedOption: b,
+      showAllOption: p,
+      singleAutocompleteInputSx: De,
+      textFieldProps: l
+    }
+  ) : N ? /* @__PURE__ */ X(We, { children: [
+    /* @__PURE__ */ a(
+      Ye,
       {
-        ref: J,
-        className: ie("min-w-128", N),
+        ref: Ce,
+        className: K("min-w-128", M),
         disableCloseOnSelect: !0,
-        disabled: h,
-        filterOptions: C ? (e) => e : void 0,
-        fullWidth: A,
-        inputValue: f,
-        loading: E,
+        disabled: L,
+        filterOptions: f ? (e) => e : void 0,
+        fullWidth: _,
+        inputValue: h,
+        loading: d,
         multiple: !0,
-        options: j,
+        options: F,
         clearText: "",
         closeText: "",
-        clearIcon: /* @__PURE__ */ i(oe, { sx: { fontSize: me } }),
+        clearIcon: /* @__PURE__ */ a(Ze, { sx: { fontSize: Xe } }),
         openText: "",
-        popupIcon: /* @__PURE__ */ i(te, {}),
-        sx: Ee,
-        value: S,
-        getOptionLabel: /* @__PURE__ */ o((e) => fe(e.label), "getOptionLabel"),
-        getOptionKey: /* @__PURE__ */ o((e) => e.value, "getOptionKey"),
-        isOptionEqualToValue: /* @__PURE__ */ o((e, t) => e.value === t.value, "isOptionEqualToValue"),
-        loadingText: V ?? p("Common.로딩 중..."),
-        noOptionsText: Q,
-        onChange: /* @__PURE__ */ o((e, t, l, r) => {
-          const O = e.type === "keydown" ? de(
+        popupIcon: /* @__PURE__ */ a(Ge, {}),
+        sx: oe,
+        value: v,
+        getOptionLabel: /* @__PURE__ */ t((e) => A(e.label), "getOptionLabel"),
+        getOptionKey: /* @__PURE__ */ t((e) => e.value, "getOptionKey"),
+        isOptionEqualToValue: /* @__PURE__ */ t((e, n) => e.value === n.value, "isOptionEqualToValue"),
+        loadingText: B,
+        noOptionsText: Te,
+        onChange: /* @__PURE__ */ t((e, n, c, m) => {
+          const $ = e.type === "keydown" ? ot(
             e,
-            f
-          ) : f ?? "";
-          if (l === "removeOption" && e.type === "keydown" && O === "" && (m || u > 0)) {
+            h
+          ) : h ?? "";
+          if (c === "removeOption" && e.type === "keydown" && $ === "" && (S || V > 0)) {
             e.preventDefault(), e.stopPropagation();
             return;
           }
-          if (l === "clear") {
-            if (Y.current) {
-              $();
+          if (c === "clear") {
+            if (ee.current) {
+              me();
               return;
             }
-            B();
+            D();
             return;
           }
-          if (T && (r != null && r.option) && d(r.option)) {
-            if (m) {
-              B();
+          if (p && (m != null && m.option) && q(m.option)) {
+            if (S) {
+              D();
               return;
             }
-            $();
+            me();
             return;
           }
-          q(
-            t.filter((I) => !d(I)).map((I) => I.value)
+          J(
+            n.filter((Me) => !q(Me)).map((Me) => Me.value)
           );
         }, "onChange"),
-        onInputChange: /* @__PURE__ */ o((e, t, l) => {
-          c == null || c(t, l);
+        onInputChange: /* @__PURE__ */ t((e, n, c) => {
+          I == null || I(n, c);
         }, "onInputChange"),
-        onKeyDown: ve,
-        slotProps: F,
-        renderInput: /* @__PURE__ */ o((e) => {
-          var t;
-          return /* @__PURE__ */ i(
-            ne,
+        onKeyDown: Ve,
+        slotProps: te,
+        renderInput: /* @__PURE__ */ t((e) => {
+          var n;
+          return /* @__PURE__ */ a(
+            $e,
             {
               ...e,
-              ...n,
-              disabled: h,
-              error: w,
-              fullWidth: A,
-              helperText: k,
-              label: R,
-              placeholder: z ?? p("Common.검색"),
-              required: H,
+              ...l,
+              disabled: L,
+              error: x,
+              fullWidth: _,
+              helperText: U,
+              label: O,
+              placeholder: H ?? g("Common.검색"),
+              required: T,
               slotProps: {
-                ...n == null ? void 0 : n.slotProps,
+                ...l == null ? void 0 : l.slotProps,
                 input: {
                   ...e.InputProps,
-                  ...(t = n == null ? void 0 : n.slotProps) == null ? void 0 : t.input,
-                  endAdornment: /* @__PURE__ */ x(D, { children: [
-                    E ? /* @__PURE__ */ i(le, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
+                  ...(n = l == null ? void 0 : l.slotProps) == null ? void 0 : n.input,
+                  endAdornment: /* @__PURE__ */ X(We, { children: [
+                    d ? /* @__PURE__ */ a(qe, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
                     e.InputProps.endAdornment
                   ] })
                 }
               },
-              variant: L
+              variant: G
             }
           );
         }, "renderInput"),
-        renderOption: /* @__PURE__ */ o((e, t, l) => {
-          const { key: r, ...O } = e;
-          return /* @__PURE__ */ x("li", { ...O, children: [
-            /* @__PURE__ */ i(Me, { checked: l.selected, className: "!mr-8 !p-0", size: "small" }),
-            Te(t)
-          ] }, r);
+        renderOption: /* @__PURE__ */ t((e, n, c) => {
+          const { key: m, ...$ } = e;
+          return /* @__PURE__ */ X("li", { ...$, children: [
+            /* @__PURE__ */ a(ut, { checked: c.selected, className: "!mr-8 !p-0", size: "small" }),
+            je(n)
+          ] }, m);
         }, "renderOption"),
-        renderValue: /* @__PURE__ */ o((e, t) => T && m ? [
-          /* @__PURE__ */ i(
-            Oe,
+        renderValue: /* @__PURE__ */ t((e, n) => p && S ? [
+          /* @__PURE__ */ a(
+            W,
             {
               component: "span",
-              sx: ke,
-              children: _.label
+              sx: dt,
+              children: C.label
             },
-            _.value
+            C.value
           )
         ] : [
-          ...e.filter((r) => !d(r)).slice(0, ue).map((r, O) => {
-            const { key: I, ..._e } = t({ index: O });
-            return /* @__PURE__ */ be(
-              P,
+          ...e.filter((m) => !q(m)).slice(0, Qe).map((m, $) => {
+            const { key: Me, ...at } = n({ index: $ });
+            return /* @__PURE__ */ st(
+              Ke,
               {
-                ..._e,
-                key: I,
-                label: r.label,
+                ...at,
+                key: Me,
+                label: m.label,
                 size: "small",
                 sx: { borderRadius: 1, mr: 0.5 }
               }
             );
           }),
-          ...u > 0 ? [
-            /* @__PURE__ */ i(
-              P,
+          ...V > 0 ? [
+            /* @__PURE__ */ a(
+              Ke,
               {
                 clickable: !0,
-                label: `+${u}`,
-                onClick: ge,
-                onMouseDown: xe,
+                label: `+${V}`,
+                onClick: Ne,
+                onMouseDown: ve,
                 size: "small",
-                sx: /* @__PURE__ */ o((r) => ({
-                  backgroundColor: g(r.palette.primary.main, 0.14),
-                  border: `1px solid ${g(r.palette.primary.main, 0.22)}`,
+                sx: /* @__PURE__ */ t((m) => ({
+                  backgroundColor: j(m.palette.primary.main, 0.14),
+                  border: `1px solid ${j(m.palette.primary.main, 0.22)}`,
                   borderRadius: 1,
-                  color: r.palette.primary.dark,
+                  color: m.palette.primary.dark,
                   fontWeight: 600,
                   mr: 0.5,
                   "&:hover": {
-                    backgroundColor: g(r.palette.primary.main, 0.2)
+                    backgroundColor: j(m.palette.primary.main, 0.2)
                   }
                 }), "sx")
               },
@@ -295,30 +849,30 @@ const ue = 2, Ve = 152, ce = 72, me = 18.57, Ue = "11px !important", ze = "2px !
         ], "renderValue")
       }
     ),
-    /* @__PURE__ */ i(
-      Ne,
+    /* @__PURE__ */ a(
+      rt,
       {
-        anchorEl: Z,
-        open: !!Z && u > 0,
+        anchorEl: Le,
+        open: !!Le && V > 0,
         placement: "bottom-start",
-        sx: { zIndex: /* @__PURE__ */ o((e) => e.zIndex.modal, "zIndex") },
-        children: /* @__PURE__ */ i(De, { onClickAway: Le, children: /* @__PURE__ */ i(
-          Pe,
+        sx: { zIndex: /* @__PURE__ */ t((e) => e.zIndex.modal, "zIndex") },
+        children: /* @__PURE__ */ a(pt, { onClickAway: _e, children: /* @__PURE__ */ a(
+          lt,
           {
             className: "mt-4",
             sx: {
-              border: /* @__PURE__ */ o((e) => `1px solid ${g(e.palette.common.black, 0.12)}`, "border"),
+              border: /* @__PURE__ */ t((e) => `1px solid ${j(e.palette.common.black, 0.12)}`, "border"),
               display: "flex",
               flexWrap: "wrap",
               gap: 0.75,
               maxWidth: 280,
               p: 1
             },
-            children: X.map((e) => /* @__PURE__ */ i(
-              P,
+            children: ye.map((e) => /* @__PURE__ */ a(
+              Ke,
               {
                 label: e.label,
-                onDelete: /* @__PURE__ */ o(() => Ce(e.value), "onDelete"),
+                onDelete: /* @__PURE__ */ t(() => xe(e.value), "onDelete"),
                 size: "small",
                 sx: { borderRadius: 1 }
               },
@@ -328,82 +882,100 @@ const ue = 2, Ve = 152, ce = 72, me = 18.57, Ue = "11px !important", ze = "2px !
         ) })
       }
     )
-  ] }) : /* @__PURE__ */ i(
-    re,
+  ] }) : /* @__PURE__ */ a(
+    Ye,
     {
-      className: ie("min-w-128", N),
-      disabled: h,
-      filterOptions: C ? (e) => e : void 0,
-      fullWidth: A,
-      inputValue: f,
-      loading: E,
-      options: j,
+      className: K("min-w-128", M),
+      disabled: L,
+      filterOptions: f ? (e) => e : void 0,
+      fullWidth: _,
+      inputValue: Ue,
+      loading: d,
+      options: F,
       clearText: "",
       closeText: "",
-      clearIcon: /* @__PURE__ */ i(oe, { sx: { fontSize: me } }),
+      clearIcon: /* @__PURE__ */ a(Ze, { sx: { fontSize: Xe } }),
       openText: "",
-      popupIcon: /* @__PURE__ */ i(te, {}),
-      sx: ee,
-      value: he,
-      getOptionLabel: /* @__PURE__ */ o((e) => fe(e.label), "getOptionLabel"),
-      getOptionKey: /* @__PURE__ */ o((e) => e.value, "getOptionKey"),
-      isOptionEqualToValue: /* @__PURE__ */ o((e, t) => e.value === t.value, "isOptionEqualToValue"),
-      loadingText: V ?? p("Common.로딩 중..."),
-      noOptionsText: Q,
-      onChange: /* @__PURE__ */ o((e, t) => {
-        if (!t || T && d(t)) {
-          G("");
+      popupIcon: /* @__PURE__ */ a(Ge, {}),
+      sx: he,
+      value: b,
+      getOptionLabel: /* @__PURE__ */ t((e) => A(e.label), "getOptionLabel"),
+      getOptionKey: /* @__PURE__ */ t((e) => e.value, "getOptionKey"),
+      isOptionEqualToValue: /* @__PURE__ */ t((e, n) => e.value === n.value, "isOptionEqualToValue"),
+      loadingText: B,
+      noOptionsText: Te,
+      onChange: /* @__PURE__ */ t((e, n, c) => {
+        if (c === "clear" || c === "removeOption") {
+          re(c, !1);
           return;
         }
-        G(t.value);
+        if (Z.current = !1, !n || p && q(n)) {
+          P(
+            n ? A(n.label) : ""
+          ), Q("");
+          return;
+        }
+        P(A(n.label)), Q(n.value);
       }, "onChange"),
-      onInputChange: /* @__PURE__ */ o((e, t, l) => {
-        c == null || c(t, l);
+      onInputChange: /* @__PURE__ */ t((e, n, c) => {
+        (c === "input" || c === "clear") && (Z.current = !0), P(n), I == null || I(n, c);
       }, "onInputChange"),
-      slotProps: F,
-      renderInput: /* @__PURE__ */ o((e) => {
-        var t, l, r;
-        return /* @__PURE__ */ i(
-          ne,
+      slotProps: we,
+      renderInput: /* @__PURE__ */ t((e) => {
+        var n, c, m;
+        return /* @__PURE__ */ a(
+          $e,
           {
             ...e,
-            ...n,
-            disabled: h,
-            error: w,
-            fullWidth: A,
-            helperText: k,
-            label: R,
-            placeholder: z,
-            required: H,
+            ...l,
+            disabled: L,
+            error: x,
+            fullWidth: _,
+            helperText: U,
+            label: O,
+            placeholder: H,
+            required: T,
             slotProps: {
-              ...n == null ? void 0 : n.slotProps,
+              ...l == null ? void 0 : l.slotProps,
+              htmlInput: {
+                ...e.inputProps,
+                ...Be,
+                className: K(
+                  e.inputProps.className,
+                  He
+                ),
+                onBlur: /* @__PURE__ */ t(($) => {
+                  ae($, e.inputProps.onBlur);
+                }, "onBlur"),
+                onKeyDown: y
+              },
               input: {
                 ...e.InputProps,
-                ...(t = n == null ? void 0 : n.slotProps) == null ? void 0 : t.input,
+                ...(n = l == null ? void 0 : l.slotProps) == null ? void 0 : n.input,
                 sx: {
-                  ...Ae ?? {},
+                  ...De ?? {},
                   ...e.InputProps.sx ?? {},
-                  ...((r = (l = n == null ? void 0 : n.slotProps) == null ? void 0 : l.input) == null ? void 0 : r.sx) ?? {}
+                  ...((m = (c = l == null ? void 0 : l.slotProps) == null ? void 0 : c.input) == null ? void 0 : m.sx) ?? {}
                 },
-                endAdornment: /* @__PURE__ */ x(D, { children: [
-                  E ? /* @__PURE__ */ i(le, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
+                endAdornment: /* @__PURE__ */ X(We, { children: [
+                  d ? /* @__PURE__ */ a(qe, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
                   e.InputProps.endAdornment
                 ] })
               }
             },
-            variant: L
+            variant: G
           }
         );
       }, "renderInput"),
       selectOnFocus: !0,
-      renderOption: /* @__PURE__ */ o((e, t) => {
-        const { key: l, ...r } = e;
-        return /* @__PURE__ */ i("li", { ...r, children: Te(t) }, l);
+      renderOption: /* @__PURE__ */ t((e, n) => {
+        const { key: c, ...m } = e;
+        return /* @__PURE__ */ a("li", { ...m, children: je(n) }, c);
       }, "renderOption")
     }
   );
 }, "OwpSelectorAutocomplete");
 export {
-  Fe as OwpSelectorAutocomplete
+  Bt as OwpSelectorAutocomplete
 };
 //# sourceMappingURL=OwpSelectorAutocomplete.js.map