@pfct/purple 1.5.0 → 1.6.0

package/dist/components/Input/NumberInput/index.es.js

@@ -1,187 +1,123 @@
-import { j as R } from "../../../chunks/jsx-runtime.Drh4NO5G.js";
-import { useReducer as O, useRef as V, useLayoutEffect as L, useEffect as P, useCallback as A } from "react";
-import { BaseInput as j } from "../BaseInput/index.es.js";
-import "@emotion/react";
-import { formatKoreaCurrency as I, extractNumber as y } from "../../../utils/format.util.es.js";
+import { j as b } from "../../../chunks/jsx-runtime.C63F304d.js";
+import { useReducer as O, useRef as R, useLayoutEffect as L, useEffect as P, useCallback as A } from "react";
+import { extractNumber as y, formatKoreaCurrency as j } from "../../../utils/format.util.es.js";
 import "../../../core/Colors/index.es.js";
-import "../../../utils/GenerateColorStyle/mini-button.es.js";
 import "../../../utils/GenerateColorStyle/datepicker.es.js";
-import "../../../chunks/index.styled.VNEk1u7W.js";
-import "../../../core/TextStyles/index.es.js";
-import "../../ui/typography.es.js";
-import "../../Accordion/index.es.js";
-import "../../Badge/IconBadge/index.styled.es.js";
-import "../../Badge/TextBadge/index.styled.es.js";
-import "../../Loading/Skeleton/index.es.js";
-import "../../Loading/Spinner/index.styled.es.js";
-import "../../Card/index.styled.es.js";
-import "../../Comment/index.es.js";
-import "../../../icons/src/icons/Alarm_fill.es.js";
-import "../../../icons/src/icons/Cancel.es.js";
-import "../../../icons/src/icons/Cart_fill.es.js";
-import "../../../icons/src/icons/Cancel_circle.es.js";
-import "../../../icons/src/icons/Calendar.es.js";
-import "../../../icons/src/icons/Check.es.js";
-import "../../../icons/src/icons/Chevron_down.es.js";
-import "../../../icons/src/icons/Chevron_right.es.js";
-import "../../../icons/src/icons/Chevron_left.es.js";
-import "../../../icons/src/icons/Chevron_up.es.js";
-import "../../../icons/src/icons/Double_Chevron_left.es.js";
-import "../../../icons/src/icons/Double_Chevron_right.es.js";
-import "../../../icons/src/icons/Eye_fill.es.js";
-import "../../../icons/src/icons/Eye_slash_fill.es.js";
-import "../../../icons/src/icons/Filter.es.js";
-import "../../../icons/src/icons/Information.es.js";
-import "../../../icons/src/icons/Menu.es.js";
-import "../../../icons/src/icons/More.es.js";
-import "../../../icons/src/icons/Person_fill.es.js";
-import "../../../icons/src/icons/Plus.es.js";
-import "../../../icons/src/icons/Question_circle.es.js";
-import "../../../icons/src/icons/Re.es.js";
-import "../../../icons/src/icons/Search.es.js";
-import "../../../icons/src/icons/Setting_fill.es.js";
-import "../../../icons/src/icons/Share.es.js";
-import "../../../icons/src/icons/Store.es.js";
-import "../../Control/CheckMark/index.styled.es.js";
-import "../../Control/Switch/index.styled.es.js";
-import "../../DatePicker/BaseDatePicker/index.styled.es.js";
-import "../../DatePicker/BaseDatePicker/YearMonthController/index.styed.es.js";
-import "../../../library/IconWithImage/index.styled.es.js";
-import "../../../library/List/BottomSheetItemList/index.styled.es.js";
-import "lottie-web";
-import "../../../library/Lottie/index.styled.es.js";
-import "../../../library/Spacing/index.styled.es.js";
-import "../../DatePicker/BaseDatePicker/Month/index.styled.es.js";
-import "../../DatePicker/BaseDatePicker/Week/index.styled.es.js";
-import "../../../types/date.es.js";
-import "../../DatePicker/BaseDatePicker/hooks/index.util.es.js";
-import "../../DatePicker/SingleDatePickerModal/index.styled.es.js";
-import "../../DatePicker/SingleDatePickerModal/useSingleDatePickerModal.es.js";
-import "../../DatePicker/RangeDatePickerModal/index.styled.es.js";
-import "../../DatePicker/RangeDatePickerModal/useRangeDatePickerModal.es.js";
-import "../../Divider/index.styled.es.js";
-import "../../../chunks/index.styled.DmJ27_dc.js";
-import "../PostfixInput/index.es.js";
-import "../ResidentNumberInput/index.styled.es.js";
-import "../../Navigation/index.styled.es.js";
-import "../../Navigation/BaseNavigation/index.styled.es.js";
-import "../../Navigation/constant.es.js";
-import "../../Segment/BaseSegment/index.styled.es.js";
-import "../../Segment/ExtendSegment/index.styled.es.js";
-import "../../ToastMessage/Toast/index.styled.es.js";
-import "../../ui/bottomSheet.es.js";
-const _ = (e) => {
-  const [, s] = O((t) => t + 1, 0), i = V(null), {
-    replace: a,
-    append: c
-  } = e, p = a ? a(e.format(e.value)) : e.format(e.value), l = V(!1), v = (t) => {
+import "../../../utils/GenerateColorStyle/mini-button.es.js";
+import "@emotion/react";
+import { BaseInput as I } from "../BaseInput/index.es.js";
+const _ = (t) => {
+  const [, l] = O((e) => e + 1, 0), s = R(null), {
+    replace: u,
+    append: f
+  } = t, i = u ? u(t.format(t.value)) : t.format(t.value), m = R(!1), v = (e) => {
     if (process.env.NODE_ENV !== "production") {
-      if (t.target.type === "number") {
+      if (e.target.type === "number") {
         console.error("Rifm does not support input type=number, use type=tel instead.");
         return;
       }
-      if (t.target.type === "date") {
+      if (e.target.type === "date") {
         console.error("Rifm does not support input type=date.");
         return;
       }
     }
-    const r = t.target.value;
-    if (i.current = [
-      r,
+    const n = e.target.value;
+    if (s.current = [
+      n,
       // eventValue
-      t.target,
+      e.target,
       // input
-      r.length > p.length,
+      n.length > i.length,
       // isSizeIncreaseOperation
-      l.current,
+      m.current,
       // isDeleleteButtonDown
-      p === e.format(r)
+      i === t.format(n)
       // isNoOperation
     ], process.env.NODE_ENV !== "production") {
-      const n = e.format(r);
-      r !== n && r.toLowerCase() === n.toLowerCase() && console.warn("Case enforcement does not work with format. Please use replace={value => value.toLowerCase()} instead");
+      const o = t.format(n);
+      n !== o && n.toLowerCase() === o.toLowerCase() && console.warn("Case enforcement does not work with format. Please use replace={value => value.toLowerCase()} instead");
     }
-    s();
+    l();
   };
   return (process.env.NODE_ENV === "production" || typeof window < "u") && L(() => {
-    if (i.current == null) return;
+    if (s.current == null) return;
     let [
-      t,
-      r,
+      e,
       n,
+      o,
       h,
       // No operation means that value itself hasn't been changed, BTW cursor, selection etc can be changed
       E
-    ] = i.current;
-    i.current = null;
-    const N = h && E, S = t.slice(r.selectionStart).search(e.accept || /\d/g), k = S !== -1 ? S : 0, f = (o) => (o.match(e.accept || /\d/g) || []).join(""), w = f(t.substr(0, r.selectionStart)), C = (o) => {
-      let u = 0, d = 0;
+    ] = s.current;
+    s.current = null;
+    const C = h && E, N = e.slice(n.selectionStart).search(t.accept || /\d/g), k = N !== -1 ? N : 0, d = (r) => (r.match(t.accept || /\d/g) || []).join(""), w = d(e.substr(0, n.selectionStart)), S = (r) => {
+      let c = 0, p = 0;
       for (let g = 0; g !== w.length; ++g) {
-        let b = o.indexOf(w[g], u) + 1, x = f(o).indexOf(w[g], d) + 1;
-        x - d > 1 && (b = u, x = d), d = Math.max(x, d), u = Math.max(u, b);
+        let V = r.indexOf(w[g], c) + 1, x = d(r).indexOf(w[g], p) + 1;
+        x - p > 1 && (V = c, x = p), p = Math.max(x, p), c = Math.max(c, V);
       }
-      return u;
+      return c;
     };
-    if (e.mask === !0 && n && !E) {
-      let o = C(t);
-      const u = f(t.substr(o))[0];
-      o = t.indexOf(u, o), t = `${t.substr(0, o)}${t.substr(o + 1)}`;
+    if (t.mask === !0 && o && !E) {
+      let r = S(e);
+      const c = d(e.substr(r))[0];
+      r = e.indexOf(c, r), e = `${e.substr(0, r)}${e.substr(r + 1)}`;
     }
-    let m = e.format(t);
-    c != null && // cursor at the end
-    r.selectionStart === t.length && !E && (n ? m = c(m) : f(m.slice(-1)) === "" && (m = m.slice(0, -1)));
-    const D = a ? a(m) : m;
-    return p === D ? s() : e.onChange(D), () => {
-      let o = C(m);
-      if (e.mask != null && (n || h && !N))
-        for (; m[o] && f(m[o]) === ""; )
-          o += 1;
-      r.selectionStart = r.selectionEnd = o + (N ? 1 + k : 0);
+    let a = t.format(e);
+    f != null && // cursor at the end
+    n.selectionStart === e.length && !E && (o ? a = f(a) : d(a.slice(-1)) === "" && (a = a.slice(0, -1)));
+    const D = u ? u(a) : a;
+    return i === D ? l() : t.onChange(D), () => {
+      let r = S(a);
+      if (t.mask != null && (o || h && !C))
+        for (; a[r] && d(a[r]) === ""; )
+          r += 1;
+      n.selectionStart = n.selectionEnd = r + (C ? 1 + k : 0);
     };
   }), P(() => {
-    const t = (n) => {
-      n.code === "Delete" && (l.current = !0);
-    }, r = (n) => {
-      n.code === "Delete" && (l.current = !1);
+    const e = (o) => {
+      o.code === "Delete" && (m.current = !0);
+    }, n = (o) => {
+      o.code === "Delete" && (m.current = !1);
     };
-    return document.addEventListener("keydown", t), document.addEventListener("keyup", r), () => {
-      document.removeEventListener("keydown", t), document.removeEventListener("keyup", r);
+    return document.addEventListener("keydown", e), document.addEventListener("keyup", n), () => {
+      document.removeEventListener("keydown", e), document.removeEventListener("keyup", n);
     };
   }, []), {
-    value: i.current != null ? i.current[0] : p,
+    value: s.current != null ? s.current[0] : i,
     onChange: v
   };
-}, $ = (e) => {
-  const s = _(e);
-  return e.children(s);
-}, oe = (e) => {
-  const { originValue: s, onValueChange: i, postfix: a = "", prefix: c = "", max: p = Number.MAX_SAFE_INTEGER, ...l } = e, v = A(
-    (t) => y(t).length > 0 ? `${c}${I(t)} ${a}` : "",
-    [a, c]
+}, $ = (t) => {
+  const l = _(t);
+  return t.children(l);
+}, X = (t) => {
+  const { originValue: l, onValueChange: s, postfix: u = "", prefix: f = "", max: i = Number.MAX_SAFE_INTEGER, ...m } = t, v = A(
+    (e) => y(e).length > 0 ? `${f}${j(e)} ${u}` : "",
+    [u, f]
   );
-  return /* @__PURE__ */ R.jsx(
+  return /* @__PURE__ */ b.jsx(
     $,
     {
       accept: /[\d]/g,
       format: v,
-      value: s,
-      onChange: (t) => i == null ? void 0 : i(y(t)),
-      children: ({ value: t, onChange: r }) => /* @__PURE__ */ R.jsx(
-        j,
+      onChange: (e) => s?.(y(e)),
+      value: l,
+      children: ({ value: e, onChange: n }) => /* @__PURE__ */ b.jsx(
+        I,
         {
-          type: "tel",
-          format: a,
-          value: t,
-          onChange: (n) => {
-            const h = y(n.target.value);
-            Number(h) > p && (n.target.value = s), r(n);
+          format: u,
+          onChange: (o) => {
+            const h = y(o.target.value);
+            Number(h) > i && (o.target.value = l), n(o);
           },
-          ...l
+          type: "tel",
+          value: e,
+          ...m
         }
       )
     }
   );
 };
 export {
-  oe as default
+  X as default
 };

package/dist/components/Input/PostfixInput/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../../chunks/jsx-runtime.713F0z8w.js"),n=require("react"),z=require("../../../chunks/index.styled.B2P8JvNq.js"),a=require("./index.styled.cjs.js"),A=require("../../../core/Typography/BaseTypography/index.cjs.js"),L=require("../../../core/Colors/index.cjs.js"),O=require("../common/InputFrame/index.cjs.js"),G=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},H=G(n),J=H.default.forwardRef((o,P)=>{const{realValue:i,postfix:v,onBlur:m,onFocus:h,onClick:p,disabled:d,label:u,placeholder:g,errorValidation:l,logRocketMasking:F,focus:_=!1,max:I,decoration:R,updateRealValue:E,formatRealValue:x,formatDisplayValue:r,type:T,pattern:w,...D}=o,[f,M]=n.useState(""),[U,j]=n.useState(""),[b,C]=n.useState(_),c=n.useRef(null),y=b||!!f,B=!u&&!y&&!!g,k=n.useCallback(e=>{if(e.length===0||e==="0"){j("");return}if(l)for(let t=0;t<l.length;t++)if(!l[t].condition(e)&&e.length!==0){j(l[t].errorText);break}else j("")},[l]),N=n.useCallback(e=>{const{type:t}=e;C(t==="focus")},[]),q=n.useCallback(e=>{var t;p==null||p(e),(t=c.current)==null||t.focus()},[p,c]),W=n.useCallback(e=>{const t=(x==null?void 0:x(e))||e,S=Number(I),V=Number(t);S&&!isNaN(V)&&V>S||E(t)},[I,E,x]);return n.useEffect(()=>{let e=i;r&&(e=(r==null?void 0:r(e))||""),M(e),k(i)},[r,k,i]),n.useEffect(()=>{var e;_&&((e=c.current)==null||e.focus())},[c,_]),s.jsxRuntimeExports.jsxs(O.InputFrame,{label:u,active:y,focused:b,disabled:!!d,errorText:U,handleClickInput:q,children:[s.jsxRuntimeExports.jsxs(a.InputAndUnitWrapper,{children:[s.jsxRuntimeExports.jsx(a.InputSizer,{focused:b,displayValue:f,children:s.jsxRuntimeExports.jsx(a.InputTag,{...D,className:a.className.inputTag,hasLabel:!!u,placeholder:B?g:"","data-private":F,ref:P||c,name:u,disabled:d,value:r?f:i,onChange:e=>{const t=e.currentTarget.value;W(t)},onFocus:e=>{h==null||h(e),N(e)},onBlur:e=>{m==null||m(e),N(e)},decoration:!1,pattern:T==="number"?"\\d*":w,type:T,onClick:q,size:B?void 0:1})}),s.jsxRuntimeExports.jsx(a.UnitWrapper,{children:y&&s.jsxRuntimeExports.jsx(a.Unit,{hasLabel:!!u,hasValue:!!f,children:s.jsxRuntimeExports.jsx(A.BaseTypography,{md:"Title1",color:d?L.basicColors.gray200:void 0,children:v})})})]}),R&&s.jsxRuntimeExports.jsx(z.DecorationItemWrapper,{disabled:d,children:R})]})});exports.PostfixInput=J;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../../chunks/jsx-runtime.B0Vkbtvx.js"),n=require("react"),z=require("../../../core/Colors/index.cjs.js"),A=require("../../../core/Typography/BaseTypography/index.cjs.js"),L=require("../../../chunks/index.styled.yIsvimnv.js"),O=require("../common/InputFrame/index.cjs.js"),a=require("./index.styled.cjs.js"),G=s=>s&&typeof s=="object"&&"default"in s?s:{default:s},H=G(n),J=H.default.forwardRef((s,q)=>{const{realValue:l,postfix:S,onBlur:F,onFocus:P,onClick:y,disabled:c,label:r,placeholder:_,errorValidation:u,logRocketMasking:v,focus:d=!1,max:b,decoration:j,updateRealValue:g,formatRealValue:R,formatDisplayValue:i,type:I,pattern:D,...w}=s,[p,M]=n.useState(""),[U,x]=n.useState(""),[f,C]=n.useState(d),m=n.useRef(null),h=f||!!p,B=!(r||h)&&!!_,E=n.useCallback(e=>{if(e.length===0||e==="0"){x("");return}if(u)for(let t=0;t<u.length;t++){if(!u[t]?.condition(e)&&e.length!==0){x(u[t]?.errorText??"");break}x("")}},[u]),T=n.useCallback(e=>{const{type:t}=e;C(t==="focus")},[]),V=n.useCallback(e=>{y?.(e),m.current?.focus()},[y]),W=n.useCallback(e=>{const t=R?.(e)||e,k=Number(b),N=Number(t);k&&!Number.isNaN(N)&&N>k||g(t)},[b,g,R]);return n.useEffect(()=>{let e=l;i&&(e=i?.(e)||""),M(e),E(l)},[i,E,l]),n.useEffect(()=>{d&&m.current?.focus()},[d]),o.jsxRuntimeExports.jsxs(O.InputFrame,{active:h,disabled:!!c,errorText:U,focused:f,handleClickInput:V,label:r,children:[o.jsxRuntimeExports.jsxs(a.InputAndUnitWrapper,{children:[o.jsxRuntimeExports.jsx(a.InputSizer,{displayValue:p,focused:f,children:o.jsxRuntimeExports.jsx(a.InputTag,{...w,className:a.className.inputTag,"data-private":v,decoration:!1,disabled:c,hasLabel:!!r,name:r,onBlur:e=>{F?.(e),T(e)},onChange:e=>{const t=e.currentTarget.value;W(t)},onClick:V,onFocus:e=>{P?.(e),T(e)},pattern:I==="number"?"\\d*":D,placeholder:B?_:"",ref:q||m,size:B?void 0:1,type:I,value:i?p:l})}),o.jsxRuntimeExports.jsx(a.UnitWrapper,{children:h&&o.jsxRuntimeExports.jsx(a.Unit,{hasLabel:!!r,hasValue:!!p,children:o.jsxRuntimeExports.jsx(A.BaseTypography,{color:c?z.basicColors.gray200:void 0,md:"Title1",children:S})})})]}),j&&o.jsxRuntimeExports.jsx(L.DecorationItemWrapper,{disabled:c,children:j})]})});exports.PostfixInput=J;

package/dist/components/Input/PostfixInput/index.d.ts

@@ -13,3 +13,4 @@ interface PostfixInputProps extends BasicInputProps {
 declare const PostfixInput: React.ForwardRefExoticComponent<PostfixInputProps & React.RefAttributes<HTMLInputElement>>;
 export type { PostfixInputProps };
 export { PostfixInput };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Input/PostfixInput/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/PostfixInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAGlF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAKpD,UAAU,iBAAkB,SAAQ,eAAe;IAClD,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,eAAe,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;IAC1C,kBAAkB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;CAC7C;AAED;;GAEG;AACH,QAAA,MAAM,YAAY,4FAuJhB,CAAC;AAEH,YAAY,EAAE,iBAAiB,EAAE,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/Input/PostfixInput/index.es.js

@@ -1,111 +1,110 @@
-import { j as o } from "../../../chunks/jsx-runtime.Drh4NO5G.js";
-import _, { useState as j, useRef as O, useCallback as d, useEffect as E } from "react";
-import { D as q } from "../../../chunks/index.styled.Comn86rI.js";
-import { InputAndUnitWrapper as G, InputSizer as H, InputTag as J, className as K, UnitWrapper as Q, Unit as X } from "./index.styled.es.js";
-import { BaseTypography as Y } from "../../../core/Typography/BaseTypography/index.es.js";
-import { basicColors as Z } from "../../../core/Colors/index.es.js";
-import { InputFrame as $ } from "../common/InputFrame/index.es.js";
-const le = _.forwardRef((F, P) => {
+import { j as t } from "../../../chunks/jsx-runtime.C63F304d.js";
+import _, { useState as h, useRef as O, useCallback as c, useEffect as F } from "react";
+import { basicColors as q } from "../../../core/Colors/index.es.js";
+import { BaseTypography as G } from "../../../core/Typography/BaseTypography/index.es.js";
+import { D as H } from "../../../chunks/index.styled.BNOtFd_Z.js";
+import { InputFrame as J } from "../common/InputFrame/index.es.js";
+import { InputAndUnitWrapper as K, InputSizer as Q, InputTag as X, className as Y, UnitWrapper as Z, Unit as $ } from "./index.styled.es.js";
+const le = _.forwardRef((v, w) => {
   const {
-    realValue: l,
-    postfix: S,
-    onBlur: f,
-    onFocus: m,
-    onClick: i,
-    disabled: c,
+    realValue: n,
+    postfix: E,
+    onBlur: P,
+    onFocus: S,
+    onClick: x,
+    disabled: s,
     label: a,
-    placeholder: y,
-    errorValidation: n,
+    placeholder: b,
+    errorValidation: r,
     logRocketMasking: U,
-    focus: h = !1,
-    max: I,
-    decoration: N,
-    updateRealValue: T,
-    formatRealValue: u,
-    formatDisplayValue: r,
+    focus: u = !1,
+    max: g,
+    decoration: y,
+    updateRealValue: V,
+    formatRealValue: j,
+    formatDisplayValue: l,
     type: B,
     pattern: W,
     ...z
-  } = F, [p, A] = j(""), [L, x] = j(""), [g, V] = j(h), s = O(null), b = g || !!p, R = !a && !b && !!y, k = d(
+  } = v, [i, A] = h(""), [L, p] = h(""), [d, I] = h(u), f = O(null), m = d || !!i, N = !(a || m) && !!b, R = c(
     (e) => {
       if (e.length === 0 || e === "0") {
-        x("");
+        p("");
         return;
       }
-      if (n)
-        for (let t = 0; t < n.length; t++)
-          if (!n[t].condition(e) && e.length !== 0) {
-            x(n[t].errorText);
+      if (r)
+        for (let o = 0; o < r.length; o++) {
+          if (!r[o]?.condition(e) && e.length !== 0) {
+            p(r[o]?.errorText ?? "");
             break;
-          } else
-            x("");
+          }
+          p("");
+        }
     },
-    [n]
-  ), C = d((e) => {
-    const { type: t } = e;
-    V(t === "focus");
-  }, []), v = d(
+    [r]
+  ), T = c((e) => {
+    const { type: o } = e;
+    I(o === "focus");
+  }, []), k = c(
     (e) => {
-      var t;
-      i == null || i(e), (t = s.current) == null || t.focus();
+      x?.(e), f.current?.focus();
     },
-    [i, s]
-  ), M = d(
+    [x]
+  ), M = c(
     (e) => {
-      const t = (u == null ? void 0 : u(e)) || e, w = Number(I), D = Number(t);
-      w && !isNaN(D) && D > w || T(t);
+      const o = j?.(e) || e, C = Number(g), D = Number(o);
+      C && !Number.isNaN(D) && D > C || V(o);
     },
-    [I, T, u]
+    [g, V, j]
   );
-  return E(() => {
-    let e = l;
-    r && (e = (r == null ? void 0 : r(e)) || ""), A(e), k(l);
-  }, [r, k, l]), E(() => {
-    var e;
-    h && ((e = s.current) == null || e.focus());
-  }, [s, h]), /* @__PURE__ */ o.jsxs(
-    $,
+  return F(() => {
+    let e = n;
+    l && (e = l?.(e) || ""), A(e), R(n);
+  }, [l, R, n]), F(() => {
+    u && f.current?.focus();
+  }, [u]), /* @__PURE__ */ t.jsxs(
+    J,
     {
-      label: a,
-      active: b,
-      focused: g,
-      disabled: !!c,
+      active: m,
+      disabled: !!s,
       errorText: L,
-      handleClickInput: v,
+      focused: d,
+      handleClickInput: k,
+      label: a,
       children: [
-        /* @__PURE__ */ o.jsxs(G, { children: [
-          /* @__PURE__ */ o.jsx(H, { focused: g, displayValue: p, children: /* @__PURE__ */ o.jsx(
-            J,
+        /* @__PURE__ */ t.jsxs(K, { children: [
+          /* @__PURE__ */ t.jsx(Q, { displayValue: i, focused: d, children: /* @__PURE__ */ t.jsx(
+            X,
             {
               ...z,
-              className: K.inputTag,
-              hasLabel: !!a,
-              placeholder: R ? y : "",
+              className: Y.inputTag,
               "data-private": U,
-              ref: P || s,
+              decoration: !1,
+              disabled: s,
+              hasLabel: !!a,
               name: a,
-              disabled: c,
-              value: r ? p : l,
+              onBlur: (e) => {
+                P?.(e), T(e);
+              },
               onChange: (e) => {
-                const t = e.currentTarget.value;
-                M(t);
+                const o = e.currentTarget.value;
+                M(o);
               },
+              onClick: k,
               onFocus: (e) => {
-                m == null || m(e), C(e);
+                S?.(e), T(e);
               },
-              onBlur: (e) => {
-                f == null || f(e), C(e);
-              },
-              decoration: !1,
               pattern: B === "number" ? "\\d*" : W,
+              placeholder: N ? b : "",
+              ref: w || f,
+              size: N ? void 0 : 1,
               type: B,
-              onClick: v,
-              size: R ? void 0 : 1
+              value: l ? i : n
             }
           ) }),
-          /* @__PURE__ */ o.jsx(Q, { children: b && /* @__PURE__ */ o.jsx(X, { hasLabel: !!a, hasValue: !!p, children: /* @__PURE__ */ o.jsx(Y, { md: "Title1", color: c ? Z.gray200 : void 0, children: S }) }) })
+          /* @__PURE__ */ t.jsx(Z, { children: m && /* @__PURE__ */ t.jsx($, { hasLabel: !!a, hasValue: !!i, children: /* @__PURE__ */ t.jsx(G, { color: s ? q.gray200 : void 0, md: "Title1", children: E }) }) })
         ] }),
-        N && /* @__PURE__ */ o.jsx(q, { disabled: c, children: N })
+        y && /* @__PURE__ */ t.jsx(H, { disabled: s, children: y })
       ]
     }
   );

package/dist/components/Input/PostfixInput/index.styled.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../../../chunks/index.styled.B2P8JvNq.js"),o=require("@emotion/styled"),r=require("../../../core/TextStyles/index.cjs.js"),n=require("../common/InputFrame/constant.cjs.js"),a=require("@emotion/react"),s=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=s(o),i={inputTag:"postfix-input-tag"},d=e.default(p.InputTag)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("@emotion/react"),p=require("@emotion/styled"),o=require("../../../core/TextStyles/index.cjs.js"),r=require("../../../chunks/index.styled.yIsvimnv.js"),n=require("../common/InputFrame/constant.cjs.js"),s=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=s(p),i={inputTag:"postfix-input-tag"},d=e.default(r.InputTag)`
 	background-color: transparent;
 	padding-right: 0;
 	border-radius: 0;
@@ -28,13 +28,13 @@
 		`}
 
 	&::after {
-		content: '${({displayValue:t})=>t+" "}';
+		content: '${({displayValue:t})=>`${t} `}';
 
 		visibility: hidden;
 		white-space: pre-wrap;
 		/** BaseStyled.InputTag 속성과 공유중, 유의 필요 */
 		padding-left: ${n.INNER_POSITION_LEFT+5}px;
-		${r.typographyMap.title1}
+		${o.typographyMap.title1}
 	}
 
 	&::after,

package/dist/components/Input/PostfixInput/index.styled.d.ts

@@ -36,3 +36,4 @@ export declare const InputSizer: import('@emotion/styled').StyledComponent<{
     as?: React.ElementType;
 } & InputSizerProps, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};
+//# sourceMappingURL=index.styled.d.ts.map

package/dist/components/Input/PostfixInput/index.styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.styled.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/PostfixInput/index.styled.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS;;CAErB,CAAC;AAEF,UAAU,SAAS;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,eAAe;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;CACjB;AAED,eAAO,MAAM,QAAQ;;;;;;;;UAKpB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;yGAG/B,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAIvB,CAAC;AAEF,eAAO,MAAM,IAAI;;;qHAWhB,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,UAAU;;;2HAiCtB,CAAC"}

package/dist/components/Input/PostfixInput/index.styled.es.js

@@ -1,11 +1,11 @@
-import { I as p } from "../../../chunks/index.styled.Comn86rI.js";
+import { css as e } from "@emotion/react";
 import t from "@emotion/styled";
-import { typographyMap as a } from "../../../core/TextStyles/index.es.js";
+import { typographyMap as p } from "../../../core/TextStyles/index.es.js";
+import { I as a } from "../../../chunks/index.styled.BNOtFd_Z.js";
 import { INPUT_HEIGHT as o, INNER_POSITION_TOP as i, INNER_POSITION_LEFT as r } from "../common/InputFrame/constant.es.js";
-import { css as e } from "@emotion/react";
 const d = {
   inputTag: "postfix-input-tag"
-}, I = t(p)`
+}, I = t(a)`
 	background-color: transparent;
 	padding-right: 0;
 	border-radius: 0;
@@ -25,7 +25,7 @@ const d = {
 				` : e`
 					top: ${i.noLabel}px;
 				`}
-`, b = t.div`
+`, $ = t.div`
 	display: inline-grid;
 	flex: none;
 
@@ -35,13 +35,13 @@ const d = {
 		`}
 
 	&::after {
-		content: '${({ displayValue: n }) => n + " "}';
+		content: '${({ displayValue: n }) => `${n} `}';
 
 		visibility: hidden;
 		white-space: pre-wrap;
 		/** BaseStyled.InputTag 속성과 공유중, 유의 필요 */
 		padding-left: ${r + 5}px;
-		${a.title1}
+		${p.title1}
 	}
 
 	&::after,
@@ -59,7 +59,7 @@ const d = {
 `;
 export {
   f as InputAndUnitWrapper,
-  b as InputSizer,
+  $ as InputSizer,
   I as InputTag,
   T as Unit,
   m as UnitWrapper,

package/dist/components/Input/PostfixInput/index.util.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@emotion/react");const u=require("../../../utils/format.util.cjs.js");require("../../../core/Colors/index.cjs.js");require("../../../utils/GenerateColorStyle/mini-button.cjs.js");require("../../../utils/GenerateColorStyle/datepicker.cjs.js");require("../../../chunks/jsx-runtime.713F0z8w.js");require("../../../chunks/index.styled.B6sT-Ewu.js");require("../../../core/TextStyles/index.cjs.js");require("../../ui/typography.cjs.js");require("../../Accordion/index.cjs.js");require("../../Badge/IconBadge/index.styled.cjs.js");require("../../Badge/TextBadge/index.styled.cjs.js");require("react");require("../../Loading/Skeleton/index.cjs.js");require("../../Loading/Spinner/index.styled.cjs.js");require("../../Card/index.styled.cjs.js");require("../../Comment/index.cjs.js");require("../../../icons/src/icons/Alarm_fill.cjs.js");require("../../../icons/src/icons/Cancel.cjs.js");require("../../../icons/src/icons/Cart_fill.cjs.js");require("../../../icons/src/icons/Cancel_circle.cjs.js");require("../../../icons/src/icons/Calendar.cjs.js");require("../../../icons/src/icons/Check.cjs.js");require("../../../icons/src/icons/Chevron_down.cjs.js");require("../../../icons/src/icons/Chevron_right.cjs.js");require("../../../icons/src/icons/Chevron_left.cjs.js");require("../../../icons/src/icons/Chevron_up.cjs.js");require("../../../icons/src/icons/Double_Chevron_left.cjs.js");require("../../../icons/src/icons/Double_Chevron_right.cjs.js");require("../../../icons/src/icons/Eye_fill.cjs.js");require("../../../icons/src/icons/Eye_slash_fill.cjs.js");require("../../../icons/src/icons/Filter.cjs.js");require("../../../icons/src/icons/Information.cjs.js");require("../../../icons/src/icons/Menu.cjs.js");require("../../../icons/src/icons/More.cjs.js");require("../../../icons/src/icons/Person_fill.cjs.js");require("../../../icons/src/icons/Plus.cjs.js");require("../../../icons/src/icons/Question_circle.cjs.js");require("../../../icons/src/icons/Re.cjs.js");require("../../../icons/src/icons/Search.cjs.js");require("../../../icons/src/icons/Setting_fill.cjs.js");require("../../../icons/src/icons/Share.cjs.js");require("../../../icons/src/icons/Store.cjs.js");require("../../Control/CheckMark/index.styled.cjs.js");require("../../Control/Switch/index.styled.cjs.js");require("../../DatePicker/BaseDatePicker/index.styled.cjs.js");require("../../DatePicker/BaseDatePicker/YearMonthController/index.styed.cjs.js");require("../../../library/IconWithImage/index.styled.cjs.js");require("../../../library/List/BottomSheetItemList/index.styled.cjs.js");require("lottie-web");require("../../../library/Lottie/index.styled.cjs.js");require("../../../library/Spacing/index.styled.cjs.js");require("../../DatePicker/BaseDatePicker/Month/index.styled.cjs.js");require("../../DatePicker/BaseDatePicker/Week/index.styled.cjs.js");require("../../../types/date.cjs.js");require("../../DatePicker/BaseDatePicker/hooks/index.util.cjs.js");require("../../DatePicker/SingleDatePickerModal/index.styled.cjs.js");require("../../DatePicker/SingleDatePickerModal/useSingleDatePickerModal.cjs.js");require("../../DatePicker/RangeDatePickerModal/index.styled.cjs.js");require("../../DatePicker/RangeDatePickerModal/useRangeDatePickerModal.cjs.js");require("../../Divider/index.styled.cjs.js");require("../../../chunks/index.styled.CMpDdHBq.js");require("../BaseInput/index.cjs.js");require("./index.cjs.js");require("../ResidentNumberInput/index.styled.cjs.js");require("../../Navigation/index.styled.cjs.js");require("../../Navigation/BaseNavigation/index.styled.cjs.js");require("../../Navigation/constant.cjs.js");require("../../Segment/BaseSegment/index.styled.cjs.js");require("../../Segment/ExtendSegment/index.styled.cjs.js");require("../../ToastMessage/Toast/index.styled.cjs.js");require("../../ui/bottomSheet.cjs.js");const q=1e4,t=e=>{const r=Number(u.extractNumber(e));return isNaN(r)?"":(Number(u.extractNumber(e))*q).toString()},a=e=>{const r=Number(u.extractNumber(e))/q,i=r?r.toString():"";return i&&u.formatKoreaCurrency(i)};exports.formatDisplayValueWithManWon=a;exports.formatRealValueWithManWon=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../utils/format.util.cjs.js");require("../../../core/Colors/index.cjs.js");require("../../../utils/GenerateColorStyle/datepicker.cjs.js");require("../../../utils/GenerateColorStyle/mini-button.cjs.js");require("@emotion/react");const a=1e4,n=e=>{const r=Number(t.extractNumber(e));return Number.isNaN(r)?"":(Number(t.extractNumber(e))*a).toString()},o=e=>{const r=Number(t.extractNumber(e))/a,u=r?r.toString():"";return u&&t.formatKoreaCurrency(u)};exports.formatDisplayValueWithManWon=o;exports.formatRealValueWithManWon=n;

package/dist/components/Input/PostfixInput/index.util.d.ts

@@ -1,2 +1,3 @@
 export declare const formatRealValueWithManWon: (val: string) => string;
 export declare const formatDisplayValueWithManWon: (val: string) => string;
+//# sourceMappingURL=index.util.d.ts.map

package/dist/components/Input/PostfixInput/index.util.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.util.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/PostfixInput/index.util.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,yBAAyB,GAAI,KAAK,MAAM,WAMpD,CAAC;AAEF,eAAO,MAAM,4BAA4B,GAAI,KAAK,MAAM,WAKvD,CAAC"}