@owp/core 2.2.5 → 2.3.0

package/dist/components/OwpScrollbars/OwpScrollbars.js

@@ -1,18 +1,17 @@
 var j = Object.defineProperty;
 var u = (t, o) => j(t, "name", { value: o, configurable: !0 });
 import { jsx as k } 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 { selectCustomScrollbarsEnabled as B } from "../../store/owpSettingsSlice.js";
-import { useAppSelector as M } from "../../hooks/useAppStore.js";
-import { styled as U } from "@mui/material/styles";
-import X from "../../_virtual/mobile-detect.js";
-import Y from "../../node_modules/.pnpm/perfect-scrollbar@1.5.6/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js";
+import { useGetCustomScrollbarsEnabled as B } from "../../hooks/useOwpSettings.js";
+import { styled as M } from "@mui/material/styles";
+import U from "../../_virtual/mobile-detect.js";
+import X from "../../node_modules/.pnpm/perfect-scrollbar@1.5.6/node_modules/perfect-scrollbar/dist/perfect-scrollbar.esm.js";
 /* empty css                                                                                                        */
-import { forwardRef as A, useRef as f, useState as D, useCallback as p, useEffect as a } from "react";
+import { forwardRef as Y, useRef as f, useState as D, useCallback as p, useEffect as a } from "react";
 import { useLocation as H } from "react-router-dom";
-const N = U("div")(() => ({
+const N = M("div")(() => ({
   overscrollBehavior: "contain",
   minHeight: "100%"
-})), P = new X(window.navigator.userAgent), y = P.mobile(), g = Object.freeze({
+})), P = new U(window.navigator.userAgent), y = P.mobile(), g = Object.freeze({
   "ps-scroll-y": "onScrollY",
   "ps-scroll-x": "onScrollX",
   "ps-scroll-up": "onScrollUp",
@@ -23,18 +22,18 @@ const N = U("div")(() => ({
   "ps-y-reach-end": "onYReachEnd",
   "ps-x-reach-start": "onXReachStart",
   "ps-x-reach-end": "onXReachEnd"
-}), Z = A((t, o) => {
+}), V = Y((t, o) => {
   const {
     className: T = "",
-    children: m,
+    children: h,
     id: x = "",
-    scrollToTopOnChildChange: h = !0,
+    scrollToTopOnChildChange: m = !0,
     scrollToTopOnRouteChange: d = !1,
     enable: S = !0,
     option: b = {
       wheelPropagation: !0
     }
-  } = t, r = f(null), n = f(null), i = f(/* @__PURE__ */ new Map()), [C, v] = D({}), c = M(B), O = H(), { pathname: L } = O, E = p(() => {
+  } = t, r = f(null), n = f(null), i = f(/* @__PURE__ */ new Map()), [C, v] = D({}), c = B(), O = H(), { pathname: L } = O, E = p(() => {
     Object.keys(g).forEach((e) => {
       const s = t[g[e]];
       if (s) {
@@ -47,15 +46,15 @@ const N = U("div")(() => ({
       r.current && r.current.removeEventListener(s, e, !1);
     }), i.current.clear();
   }, []);
-  a(() => (c && r.current && !y && (n.current = new Y(r.current, b), E()), () => {
+  a(() => (c && r.current && !y && (n.current = new X(r.current, b), E()), () => {
     n.current && (n.current.destroy(), n.current = null, w());
   }), [c, E, b, w]);
   const l = p(() => {
     r.current && (r.current.scrollTop = 0);
   }, []);
   return a(() => {
-    h && l();
-  }, [l, m, h]), a(() => {
+    m && l();
+  }, [l, h, m]), a(() => {
     d && l();
   }, [L, l, d]), a(() => {
     v(c && S && !y ? {
@@ -71,11 +70,11 @@ const N = U("div")(() => ({
       ref: /* @__PURE__ */ u((e) => {
         r.current = e, typeof o == "function" ? o(e) : o && (o.current = e);
       }, "ref"),
-      children: m
+      children: h
     }
   );
 });
 export {
-  Z as OwpScrollbars
+  V as OwpScrollbars
 };
 //# sourceMappingURL=OwpScrollbars.js.map

package/dist/components/OwpScrollbars/OwpScrollbars.js.map

@@ -1 +1 @@
-{"version":3,"file":"OwpScrollbars.js","sources":["../../../src/components/OwpScrollbars/OwpScrollbars.tsx"],"sourcesContent":["import { selectCustomScrollbarsEnabled } from '@/store/owpSettingsSlice';\nimport { useAppSelector } from '@/hooks/useAppStore';\nimport { styled } from '@mui/material/styles';\nimport MobileDetect from 'mobile-detect';\nimport PerfectScrollbar from 'perfect-scrollbar';\nimport 'perfect-scrollbar/css/perfect-scrollbar.css';\nimport { forwardRef, ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { useLocation } from 'react-router-dom';\n\nconst Root = styled('div')(() => ({\n  overscrollBehavior: 'contain',\n  minHeight: '100%',\n}));\n\nconst md = new MobileDetect(window.navigator.userAgent);\nconst isMobile = md.mobile();\n\nconst handlerNameByEvent = Object.freeze({\n  'ps-scroll-y': 'onScrollY',\n  'ps-scroll-x': 'onScrollX',\n  'ps-scroll-up': 'onScrollUp',\n  'ps-scroll-down': 'onScrollDown',\n  'ps-scroll-left': 'onScrollLeft',\n  'ps-scroll-right': 'onScrollRight',\n  'ps-y-reach-start': 'onYReachStart',\n  'ps-y-reach-end': 'onYReachEnd',\n  'ps-x-reach-start': 'onXReachStart',\n  'ps-x-reach-end': 'onXReachEnd',\n});\n\ntype OwpScrollbarsProps = {\n  id?: string;\n  className?: string;\n  children: ReactNode;\n  enable?: boolean;\n  scrollToTopOnChildChange?: boolean;\n  scrollToTopOnRouteChange?: boolean;\n  option?: {\n    wheelPropagation?: boolean;\n    suppressScrollX?: boolean;\n  };\n};\n\n/**\n * OwpScrollbars 컴포넌트\n * @param props 컴포넌트 props\n * @param ref forwardRef 참조\n */\nconst OwpScrollbars = forwardRef<HTMLDivElement, OwpScrollbarsProps>((props, ref) => {\n  const {\n    className = '',\n    children,\n    id = '',\n    scrollToTopOnChildChange = true,\n    scrollToTopOnRouteChange = false,\n    enable = true,\n    option = {\n      wheelPropagation: true,\n    },\n  } = props;\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const psRef = useRef<PerfectScrollbar | null>(null);\n  const handlerByEvent = useRef<Map<string, EventListener>>(new Map());\n  const [style, setStyle] = useState({});\n  const customScrollbars = useAppSelector(selectCustomScrollbarsEnabled);\n  const location = useLocation();\n  const { pathname } = location;\n\n  const hookUpEvents = useCallback(() => {\n    Object.keys(handlerNameByEvent).forEach((key) => {\n      const callback = props[handlerNameByEvent[key] as keyof OwpScrollbarsProps] as (\n        T: HTMLDivElement,\n      ) => void;\n\n      if (callback) {\n        const handler: EventListener = () => callback(containerRef.current);\n        handlerByEvent.current.set(key, handler);\n\n        if (containerRef.current) {\n          containerRef.current.addEventListener(key, handler, false);\n        }\n      }\n    });\n  }, [props]);\n\n  const unHookUpEvents = useCallback(() => {\n    handlerByEvent.current.forEach((value, key) => {\n      if (containerRef.current) {\n        containerRef.current.removeEventListener(key, value, false);\n      }\n    });\n    handlerByEvent.current.clear();\n  }, []);\n\n  useEffect(() => {\n    if (customScrollbars && containerRef.current && !isMobile) {\n      psRef.current = new PerfectScrollbar(containerRef.current, option);\n      hookUpEvents();\n    }\n\n    return () => {\n      if (psRef.current) {\n        psRef.current.destroy();\n        psRef.current = null;\n        unHookUpEvents();\n      }\n    };\n  }, [customScrollbars, hookUpEvents, option, unHookUpEvents]);\n\n  const scrollToTop = useCallback(() => {\n    if (containerRef.current) {\n      containerRef.current.scrollTop = 0;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (scrollToTopOnChildChange) {\n      scrollToTop();\n    }\n  }, [scrollToTop, children, scrollToTopOnChildChange]);\n\n  useEffect(() => {\n    if (scrollToTopOnRouteChange) {\n      scrollToTop();\n    }\n  }, [pathname, scrollToTop, scrollToTopOnRouteChange]);\n\n  useEffect(() => {\n    if (customScrollbars && enable && !isMobile) {\n      setStyle({\n        position: 'relative',\n        overflow: 'hidden!important',\n      });\n    } else {\n      setStyle({});\n    }\n  }, [customScrollbars, enable]);\n\n  return (\n    <Root\n      id={id}\n      className={className}\n      style={style}\n      ref={(el) => {\n        containerRef.current = el;\n\n        if (typeof ref === 'function') {\n          ref(el);\n        } else if (ref) {\n          ref.current = el;\n        }\n      }}\n    >\n      {children}\n    </Root>\n  );\n});\n\nexport { OwpScrollbars };\n"],"names":["Root","styled","md","MobileDetect","isMobile","handlerNameByEvent","OwpScrollbars","forwardRef","props","ref","className","children","id","scrollToTopOnChildChange","scrollToTopOnRouteChange","enable","option","containerRef","useRef","psRef","handlerByEvent","style","setStyle","useState","customScrollbars","useAppSelector","selectCustomScrollbarsEnabled","location","useLocation","pathname","hookUpEvents","useCallback","key","callback","handler","__name","unHookUpEvents","value","useEffect","PerfectScrollbar","scrollToTop","jsx","el"],"mappings":"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"}
+{"version":3,"file":"OwpScrollbars.js","sources":["../../../src/components/OwpScrollbars/OwpScrollbars.tsx"],"sourcesContent":["import { useGetCustomScrollbarsEnabled } from '@/hooks/useOwpSettings';\nimport { styled } from '@mui/material/styles';\nimport MobileDetect from 'mobile-detect';\nimport PerfectScrollbar from 'perfect-scrollbar';\nimport 'perfect-scrollbar/css/perfect-scrollbar.css';\nimport { forwardRef, ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { useLocation } from 'react-router-dom';\n\nconst Root = styled('div')(() => ({\n  overscrollBehavior: 'contain',\n  minHeight: '100%',\n}));\n\nconst md = new MobileDetect(window.navigator.userAgent);\nconst isMobile = md.mobile();\n\nconst handlerNameByEvent = Object.freeze({\n  'ps-scroll-y': 'onScrollY',\n  'ps-scroll-x': 'onScrollX',\n  'ps-scroll-up': 'onScrollUp',\n  'ps-scroll-down': 'onScrollDown',\n  'ps-scroll-left': 'onScrollLeft',\n  'ps-scroll-right': 'onScrollRight',\n  'ps-y-reach-start': 'onYReachStart',\n  'ps-y-reach-end': 'onYReachEnd',\n  'ps-x-reach-start': 'onXReachStart',\n  'ps-x-reach-end': 'onXReachEnd',\n});\n\ntype OwpScrollbarsProps = {\n  id?: string;\n  className?: string;\n  children: ReactNode;\n  enable?: boolean;\n  scrollToTopOnChildChange?: boolean;\n  scrollToTopOnRouteChange?: boolean;\n  option?: {\n    wheelPropagation?: boolean;\n    suppressScrollX?: boolean;\n  };\n};\n\n/**\n * OwpScrollbars 컴포넌트\n * @param props 컴포넌트 props\n * @param ref forwardRef 참조\n */\nconst OwpScrollbars = forwardRef<HTMLDivElement, OwpScrollbarsProps>((props, ref) => {\n  const {\n    className = '',\n    children,\n    id = '',\n    scrollToTopOnChildChange = true,\n    scrollToTopOnRouteChange = false,\n    enable = true,\n    option = {\n      wheelPropagation: true,\n    },\n  } = props;\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const psRef = useRef<PerfectScrollbar | null>(null);\n  const handlerByEvent = useRef<Map<string, EventListener>>(new Map());\n  const [style, setStyle] = useState({});\n  const customScrollbars = useGetCustomScrollbarsEnabled();\n  const location = useLocation();\n  const { pathname } = location;\n\n  const hookUpEvents = useCallback(() => {\n    Object.keys(handlerNameByEvent).forEach((key) => {\n      const callback = props[handlerNameByEvent[key] as keyof OwpScrollbarsProps] as (\n        T: HTMLDivElement,\n      ) => void;\n\n      if (callback) {\n        const handler: EventListener = () => callback(containerRef.current);\n        handlerByEvent.current.set(key, handler);\n\n        if (containerRef.current) {\n          containerRef.current.addEventListener(key, handler, false);\n        }\n      }\n    });\n  }, [props]);\n\n  const unHookUpEvents = useCallback(() => {\n    handlerByEvent.current.forEach((value, key) => {\n      if (containerRef.current) {\n        containerRef.current.removeEventListener(key, value, false);\n      }\n    });\n    handlerByEvent.current.clear();\n  }, []);\n\n  useEffect(() => {\n    if (customScrollbars && containerRef.current && !isMobile) {\n      psRef.current = new PerfectScrollbar(containerRef.current, option);\n      hookUpEvents();\n    }\n\n    return () => {\n      if (psRef.current) {\n        psRef.current.destroy();\n        psRef.current = null;\n        unHookUpEvents();\n      }\n    };\n  }, [customScrollbars, hookUpEvents, option, unHookUpEvents]);\n\n  const scrollToTop = useCallback(() => {\n    if (containerRef.current) {\n      containerRef.current.scrollTop = 0;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (scrollToTopOnChildChange) {\n      scrollToTop();\n    }\n  }, [scrollToTop, children, scrollToTopOnChildChange]);\n\n  useEffect(() => {\n    if (scrollToTopOnRouteChange) {\n      scrollToTop();\n    }\n  }, [pathname, scrollToTop, scrollToTopOnRouteChange]);\n\n  useEffect(() => {\n    if (customScrollbars && enable && !isMobile) {\n      setStyle({\n        position: 'relative',\n        overflow: 'hidden!important',\n      });\n    } else {\n      setStyle({});\n    }\n  }, [customScrollbars, enable]);\n\n  return (\n    <Root\n      id={id}\n      className={className}\n      style={style}\n      ref={(el) => {\n        containerRef.current = el;\n\n        if (typeof ref === 'function') {\n          ref(el);\n        } else if (ref) {\n          ref.current = el;\n        }\n      }}\n    >\n      {children}\n    </Root>\n  );\n});\n\nexport { OwpScrollbars };\n"],"names":["Root","styled","md","MobileDetect","isMobile","handlerNameByEvent","OwpScrollbars","forwardRef","props","ref","className","children","id","scrollToTopOnChildChange","scrollToTopOnRouteChange","enable","option","containerRef","useRef","psRef","handlerByEvent","style","setStyle","useState","customScrollbars","useGetCustomScrollbarsEnabled","location","useLocation","pathname","hookUpEvents","useCallback","key","callback","handler","__name","unHookUpEvents","value","useEffect","PerfectScrollbar","scrollToTop","jsx","el"],"mappings":"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"}

package/dist/components/OwpSelectorBase/OwpSelectorAutocomplete.js

@@ -1,56 +1,56 @@
-var ge = Object.defineProperty;
-var n = (a, s) => ge(a, "name", { value: s, configurable: !0 });
-import { jsxs as C, jsx as r, Fragment as M } 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 xe } from "@emotion/react";
-import { useOwpTranslation as be } from "../../hooks/useOwpTranslation.js";
+var xe = Object.defineProperty;
+var n = (a, s) => xe(a, "name", { value: s, configurable: !0 });
+import { jsxs as x, jsx as i, Fragment as M } 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 Y 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 F 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 ve, Chip as E, Checkbox as Ae, TextField as ee, CircularProgress as te, Autocomplete as oe, ClickAwayListener as ye, Paper as Se, Popper as Me } from "@mui/material";
-import { alpha as g } from "@mui/material/styles";
+import { Box as Ae, Chip as E, Checkbox as ve, TextField as ee, CircularProgress as te, Autocomplete as oe, ClickAwayListener as Se, Paper as Me, Popper as Ee } from "@mui/material";
+import { alpha as b } from "@mui/material/styles";
 import { clsx as ne } from "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
-import { useMemo as le, useState as Ee, useRef as re, useEffect as ie } from "react";
-import { isSelectorAllOption as h } from "./utils/querySelectorUtils.js";
-const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
+import { useMemo as le, useState as we, useRef as re, useEffect as ie } from "react";
+import { isSelectorAllOption as O } from "./utils/querySelectorUtils.js";
+const ae = 2, ke = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
   const u = a.target;
   return u instanceof HTMLInputElement ? u.value : s ?? "";
-}, "getCurrentAutocompleteInputValue"), ce = /* @__PURE__ */ n((a) => typeof a == "string" || typeof a == "number" ? `${a}` : "", "getAutocompleteOptionLabel"), Be = /* @__PURE__ */ n(({ hookResult: a, props: s }) => {
-  const { t: u } = be(), {
+}, "getCurrentAutocompleteInputValue"), ce = /* @__PURE__ */ n((a) => typeof a == "string" || typeof a == "number" ? `${a}` : "", "getAutocompleteOptionLabel"), Ue = /* @__PURE__ */ n(({ hookResult: a, props: s }) => {
+  const { t: u } = ye(), {
     autocompleteInputValue: d,
     className: w,
     disableAllValueItem: f,
     disableClientFilter: k,
-    disabled: I,
+    disabled: T,
     error: L,
-    fullWidth: O,
+    fullWidth: C,
     helperText: D,
-    label: V,
-    loading: T,
-    loadingText: N,
-    multiple: z,
+    label: P,
+    loading: g,
+    loadingText: V,
+    multiple: N,
     noOptionsText: me,
     onAutocompleteInputChange: c,
-    placeholder: R,
-    required: P,
+    placeholder: z,
+    required: R,
     textFieldProps: o
   } = s, {
-    allOption: x,
+    allOption: y,
     clearSelection: _,
     isAllSelected: m,
     resolvedOptions: H,
     restoreAllSelection: W,
     selectAll: B,
     selectedOption: de,
-    selectedOptions: b,
+    selectedOptions: A,
     selectMultipleValues: U,
     selectSingleValue: $
-  } = a, q = f ? H : [x, ...H], v = le(
-    () => b.filter((e) => !h(e)),
-    [b]
+  } = a, q = f ? H : [y, ...H], v = le(
+    () => A.filter((e) => !O(e)),
+    [A]
   ), K = le(
     () => m ? [] : v.slice(ae),
     [v, m]
-  ), p = K.length, [j, A] = Ee(null), Z = re(null), G = me ?? u("Message.검색 결과 없음"), J = re(
-    z && !f && ((s.value ?? s.defaultValue) == null || (s.value ?? s.defaultValue) === "")
+  ), p = K.length, [j, S] = we(null), Z = re(null), G = me ?? u("Message.검색 결과 없음"), J = re(
+    N && !f && ((s.value ?? s.defaultValue) == null || (s.value ?? s.defaultValue) === "")
   ), Q = {
     clearIndicator: {
       className: "m-0 p-0",
@@ -71,7 +71,7 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
       size: "small"
     }
   }, X = {
-    minWidth: we,
+    minWidth: ke,
     "& .MuiAutocomplete-endAdornment": {
       "& .MuiAutocomplete-clearIndicator + .MuiAutocomplete-popupIndicator": {
         ml: 0
@@ -95,7 +95,7 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
     }
   };
   ie(() => {
-    p || A(null);
+    p || S(null);
   }, [p]), ie(() => {
     var l;
     if (!J.current)
@@ -113,11 +113,11 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
     };
   }, [W]);
   const he = /* @__PURE__ */ n(() => {
-    A(null);
+    S(null);
   }, "handleHiddenChipPopperClose"), Ie = /* @__PURE__ */ n((e) => {
     e.preventDefault();
   }, "handleHiddenChipSummaryMouseDown"), Oe = /* @__PURE__ */ n((e) => {
-    e.preventDefault(), e.stopPropagation(), A(
+    e.preventDefault(), e.stopPropagation(), S(
       (t) => t === e.currentTarget ? null : e.currentTarget
     );
   }, "handleHiddenChipSummaryClick"), Te = /* @__PURE__ */ n((e) => {
@@ -129,37 +129,37 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
     const t = pe(e, d);
     (m || p > 0) && t === "" && (e.key === "Backspace" || e.key === "Delete") && (e.defaultMuiPrevented = !0, e.preventDefault(), e.stopPropagation()), (l = o == null ? void 0 : o.onKeyDown) == null || l.call(o, e);
   }, "handleMultipleRootKeyDown");
-  return z ? /* @__PURE__ */ C(M, { children: [
-    /* @__PURE__ */ r(
+  return N ? /* @__PURE__ */ x(M, { children: [
+    /* @__PURE__ */ i(
       oe,
       {
         ref: Z,
         className: ne("min-w-128", w),
         disableCloseOnSelect: !0,
-        disabled: I,
+        disabled: T,
         filterOptions: k ? (e) => e : void 0,
-        fullWidth: O,
+        fullWidth: C,
         inputValue: d,
-        loading: T,
+        loading: g,
         multiple: !0,
         options: q,
         clearText: "",
         closeText: "",
-        clearIcon: /* @__PURE__ */ r(F, { sx: { fontSize: ue } }),
+        clearIcon: /* @__PURE__ */ i(F, { sx: { fontSize: ue } }),
         openText: "",
-        popupIcon: /* @__PURE__ */ r(Y, {}),
+        popupIcon: /* @__PURE__ */ i(Y, {}),
         sx: fe,
-        value: b,
+        value: A,
         getOptionLabel: /* @__PURE__ */ n((e) => ce(e.label), "getOptionLabel"),
         isOptionEqualToValue: /* @__PURE__ */ n((e, t) => e.value === t.value, "isOptionEqualToValue"),
-        loadingText: N ?? u("Common.로딩 중..."),
+        loadingText: V ?? u("Common.로딩 중..."),
         noOptionsText: G,
-        onChange: /* @__PURE__ */ n((e, t, l, i) => {
-          const y = e.type === "keydown" ? pe(
+        onChange: /* @__PURE__ */ n((e, t, l, r) => {
+          const h = e.type === "keydown" ? pe(
             e,
             d
           ) : d ?? "";
-          if (l === "removeOption" && e.type === "keydown" && y === "" && (m || p > 0)) {
+          if (l === "removeOption" && e.type === "keydown" && h === "" && (m || p > 0)) {
             e.preventDefault(), e.stopPropagation();
             return;
           }
@@ -171,7 +171,7 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
             _();
             return;
           }
-          if (!f && (i != null && i.option) && h(i.option)) {
+          if (!f && (r != null && r.option) && O(r.option)) {
             if (m) {
               _();
               return;
@@ -180,7 +180,7 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
             return;
           }
           U(
-            t.filter((S) => !h(S)).map((S) => S.value)
+            t.filter((I) => !O(I)).map((I) => I.value)
           );
         }, "onChange"),
         onInputChange: /* @__PURE__ */ n((e, t, l) => {
@@ -190,25 +190,25 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
         slotProps: Q,
         renderInput: /* @__PURE__ */ n((e) => {
           var t;
-          return /* @__PURE__ */ r(
+          return /* @__PURE__ */ i(
             ee,
             {
               ...e,
               ...o,
-              disabled: I,
+              disabled: T,
               error: L,
-              fullWidth: O,
+              fullWidth: C,
               helperText: D,
-              label: V,
-              placeholder: R ?? u("Common.검색"),
-              required: P,
+              label: P,
+              placeholder: z ?? u("Common.검색"),
+              required: R,
               slotProps: {
                 ...o == null ? void 0 : o.slotProps,
                 input: {
                   ...e.InputProps,
                   ...(t = o == null ? void 0 : o.slotProps) == null ? void 0 : t.input,
-                  endAdornment: /* @__PURE__ */ C(M, { children: [
-                    T ? /* @__PURE__ */ r(te, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
+                  endAdornment: /* @__PURE__ */ x(M, { children: [
+                    g ? /* @__PURE__ */ i(te, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
                     e.InputProps.endAdornment
                   ] })
                 }
@@ -217,33 +217,39 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
             }
           );
         }, "renderInput"),
-        renderOption: /* @__PURE__ */ n((e, t, l) => /* @__PURE__ */ C("li", { ...e, children: [
-          /* @__PURE__ */ r(Ae, { checked: l.selected, className: "!mr-8 !p-0", size: "small" }),
-          t.label
-        ] }), "renderOption"),
+        renderOption: /* @__PURE__ */ n((e, t, l) => {
+          const { key: r, ...h } = e;
+          return /* @__PURE__ */ x("li", { ...h, children: [
+            /* @__PURE__ */ i(ve, { checked: l.selected, className: "!mr-8 !p-0", size: "small" }),
+            t.label
+          ] }, r);
+        }, "renderOption"),
         renderValue: /* @__PURE__ */ n((e, t) => !f && m ? [
-          /* @__PURE__ */ r(
-            ve,
+          /* @__PURE__ */ i(
+            Ae,
             {
               component: "span",
               sx: { color: "text.primary", fontWeight: 500, mr: 0.5 },
-              children: x.label
+              children: y.label
             },
-            x.value
+            y.value
           )
         ] : [
-          ...e.filter((i) => !h(i)).slice(0, ae).map((i, y) => /* @__PURE__ */ xe(
-            E,
-            {
-              ...t({ index: y }),
-              key: i.value,
-              label: i.label,
-              size: "small",
-              sx: { borderRadius: 1, mr: 0.5 }
-            }
-          )),
+          ...e.filter((r) => !O(r)).slice(0, ae).map((r, h) => {
+            const { key: I, ...ge } = t({ index: h });
+            return /* @__PURE__ */ be(
+              E,
+              {
+                ...ge,
+                key: I,
+                label: r.label,
+                size: "small",
+                sx: { borderRadius: 1, mr: 0.5 }
+              }
+            );
+          }),
           ...p > 0 ? [
-            /* @__PURE__ */ r(
+            /* @__PURE__ */ i(
               E,
               {
                 clickable: !0,
@@ -251,15 +257,15 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
                 onClick: Oe,
                 onMouseDown: Ie,
                 size: "small",
-                sx: /* @__PURE__ */ n((i) => ({
-                  backgroundColor: g(i.palette.primary.main, 0.14),
-                  border: `1px solid ${g(i.palette.primary.main, 0.22)}`,
+                sx: /* @__PURE__ */ n((r) => ({
+                  backgroundColor: b(r.palette.primary.main, 0.14),
+                  border: `1px solid ${b(r.palette.primary.main, 0.22)}`,
                   borderRadius: 1,
-                  color: i.palette.primary.dark,
+                  color: r.palette.primary.dark,
                   fontWeight: 600,
                   mr: 0.5,
                   "&:hover": {
-                    backgroundColor: g(i.palette.primary.main, 0.2)
+                    backgroundColor: b(r.palette.primary.main, 0.2)
                   }
                 }), "sx")
               },
@@ -269,26 +275,26 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
         ], "renderValue")
       }
     ),
-    /* @__PURE__ */ r(
-      Me,
+    /* @__PURE__ */ i(
+      Ee,
       {
         anchorEl: j,
         open: !!j && p > 0,
         placement: "bottom-start",
         sx: { zIndex: /* @__PURE__ */ n((e) => e.zIndex.modal, "zIndex") },
-        children: /* @__PURE__ */ r(ye, { onClickAway: he, children: /* @__PURE__ */ r(
-          Se,
+        children: /* @__PURE__ */ i(Se, { onClickAway: he, children: /* @__PURE__ */ i(
+          Me,
           {
             className: "mt-4",
             sx: {
-              border: /* @__PURE__ */ n((e) => `1px solid ${g(e.palette.common.black, 0.12)}`, "border"),
+              border: /* @__PURE__ */ n((e) => `1px solid ${b(e.palette.common.black, 0.12)}`, "border"),
               display: "flex",
               flexWrap: "wrap",
               gap: 0.75,
               maxWidth: 280,
               p: 1
             },
-            children: K.map((e) => /* @__PURE__ */ r(
+            children: K.map((e) => /* @__PURE__ */ i(
               E,
               {
                 label: e.label,
@@ -302,29 +308,29 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
         ) })
       }
     )
-  ] }) : /* @__PURE__ */ r(
+  ] }) : /* @__PURE__ */ i(
     oe,
     {
       className: ne("min-w-128", w),
-      disabled: I,
+      disabled: T,
       filterOptions: k ? (e) => e : void 0,
-      fullWidth: O,
+      fullWidth: C,
       inputValue: d,
-      loading: T,
+      loading: g,
       options: q,
       clearText: "",
       closeText: "",
-      clearIcon: /* @__PURE__ */ r(F, { sx: { fontSize: ue } }),
+      clearIcon: /* @__PURE__ */ i(F, { sx: { fontSize: ue } }),
       openText: "",
-      popupIcon: /* @__PURE__ */ r(Y, {}),
+      popupIcon: /* @__PURE__ */ i(Y, {}),
       sx: X,
       value: de,
       getOptionLabel: /* @__PURE__ */ n((e) => ce(e.label), "getOptionLabel"),
       isOptionEqualToValue: /* @__PURE__ */ n((e, t) => e.value === t.value, "isOptionEqualToValue"),
-      loadingText: N ?? u("Common.로딩 중..."),
+      loadingText: V ?? u("Common.로딩 중..."),
       noOptionsText: G,
       onChange: /* @__PURE__ */ n((e, t) => {
-        if (!t || !f && h(t)) {
+        if (!t || !f && O(t)) {
           $("");
           return;
         }
@@ -335,19 +341,19 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
       }, "onInputChange"),
       slotProps: Q,
       renderInput: /* @__PURE__ */ n((e) => {
-        var t, l, i;
-        return /* @__PURE__ */ r(
+        var t, l, r;
+        return /* @__PURE__ */ i(
           ee,
           {
             ...e,
             ...o,
-            disabled: I,
+            disabled: T,
             error: L,
-            fullWidth: O,
+            fullWidth: C,
             helperText: D,
-            label: V,
-            placeholder: R,
-            required: P,
+            label: P,
+            placeholder: z,
+            required: R,
             slotProps: {
               ...o == null ? void 0 : o.slotProps,
               input: {
@@ -358,10 +364,10 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
                     paddingLeft: "11px !important"
                   },
                   ...e.InputProps.sx ?? {},
-                  ...((i = (l = o == null ? void 0 : o.slotProps) == null ? void 0 : l.input) == null ? void 0 : i.sx) ?? {}
+                  ...((r = (l = o == null ? void 0 : o.slotProps) == null ? void 0 : l.input) == null ? void 0 : r.sx) ?? {}
                 },
-                endAdornment: /* @__PURE__ */ C(M, { children: [
-                  T ? /* @__PURE__ */ r(te, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
+                endAdornment: /* @__PURE__ */ x(M, { children: [
+                  g ? /* @__PURE__ */ i(te, { color: "inherit", size: 16, sx: { mr: 0.5 } }) : null,
                   e.InputProps.endAdornment
                 ] })
               }
@@ -371,11 +377,14 @@ const ae = 2, we = 152, se = 72, ue = 18.57, pe = /* @__PURE__ */ n((a, s) => {
         );
       }, "renderInput"),
       selectOnFocus: !0,
-      renderOption: /* @__PURE__ */ n((e, t) => /* @__PURE__ */ r("li", { ...e, children: t.label }), "renderOption")
+      renderOption: /* @__PURE__ */ n((e, t) => {
+        const { key: l, ...r } = e;
+        return /* @__PURE__ */ i("li", { ...r, children: t.label }, l);
+      }, "renderOption")
     }
   );
 }, "OwpSelectorAutocomplete");
 export {
-  Be as OwpSelectorAutocomplete
+  Ue as OwpSelectorAutocomplete
 };
 //# sourceMappingURL=OwpSelectorAutocomplete.js.map