@pfct/purple 1.3.4-npm-test.1

package/dist/components/Input/BaseInput/index.spec.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_2 = require("@testing-library/react");
+const _1 = require(".");
+describe('<BaseInput />', () => {
+    it('렌더링 체크', () => {
+        (0, react_2.render)(react_1.default.createElement(react_1.default.Fragment, null,
+            "\uD655\uC778",
+            react_1.default.createElement(_1.BaseInput, null)));
+        expect(react_2.screen.getByText('확인')).toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+export declare const InputTag: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    decoration?: boolean | undefined;
+    hasLabel: boolean;
+}, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
+export declare const DecorationItemWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    disabled?: boolean | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/components/Input/BaseInput/index.styled.js

@@ -0,0 +1,78 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DecorationItemWrapper = exports.InputTag = void 0;
+const react_1 = require("@emotion/react");
+const styled_1 = __importDefault(require("@emotion/styled"));
+const TextStyles_1 = require("../../../core/TextStyles");
+const Colors_1 = require("../../../core/Colors");
+const constant_1 = require("../common/InputFrame/constant");
+const index_styled_1 = require("../common/InputFrame/index.styled");
+exports.InputTag = styled_1.default.input `
+	${TextStyles_1.typography.title1};
+
+	box-sizing: border-box;
+	width: 100%;
+	height: ${constant_1.INPUT_HEIGHT}px;
+
+	padding-left: ${constant_1.INNER_POSITION_LEFT}px;
+
+	${({ hasLabel }) => hasLabel
+    ? (0, react_1.css) `
+					padding-top: ${constant_1.INNER_POSITION_TOP.hasLabel}px;
+					padding-bottom: ${constant_1.INNER_POSITION_BOTTOM.hasLabel}px;
+			  `
+    : (0, react_1.css) `
+					padding-bottom: ${constant_1.INNER_POSITION_BOTTOM.noLabel}px;
+			  `};
+
+	color: ${Colors_1.basicColors.gray900};
+	transition: all 0.2s;
+	border: none;
+	background-color: transparent;
+	-webkit-appearance: none;
+
+	&::-webkit-date-and-time-value {
+		text-align: initial;
+	}
+
+	&::-webkit-outer-spin-button,
+	&::-webkit-inner-spin-button {
+		-webkit-appearance: none;
+		margin: 0;
+	}
+
+	${({ decoration }) => decoration
+    ? (0, react_1.css) `
+					border-top-left-radius: 10px;
+					border-bottom-left-radius: 10px;
+			  `
+    : (0, react_1.css) `
+					border-radius: 10px;
+			  `}
+
+	&:disabled {
+		color: ${index_styled_1.InputDisabledTextColor};
+		-webkit-text-fill-color: ${Colors_1.basicColors.gray200};
+		opacity: 1;
+	}
+
+	&:focus {
+		outline: none;
+	}
+
+	&::placeholder {
+		${({ hasLabel }) => (0, index_styled_1.NotActivePlaceholderOrLabelStyle)({ hasLabel })}
+	}
+`;
+exports.DecorationItemWrapper = styled_1.default.div `
+	height: 100%;
+	display: flex;
+	align-items: center;
+	padding-right: 15px;
+	border-top-right-radius: 10px;
+	border-bottom-right-radius: 10px;
+	background-color: ${({ disabled }) => (disabled ? Colors_1.basicColors.gray25 : Colors_1.basicColors.white)};
+`;

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

@@ -0,0 +1,13 @@
+import React from 'react';
+import { BasicInputProps } from '../BaseInput';
+export type NumberInputProps = Pick<BasicInputProps, 'errorValidation' | 'decoration' | 'focus'> & {
+    originValue: string;
+    placeholder?: string;
+    prefix?: string;
+    postfix?: string;
+    max?: number;
+    onValueChange?: (value: string) => void;
+    disabled?: boolean;
+};
+declare const NumberInput: React.FC<NumberInputProps>;
+export default NumberInput;

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

@@ -0,0 +1,54 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const BaseInput_1 = require("../BaseInput");
+const rifm_1 = require("rifm");
+const utils_1 = require("../../../utils");
+const NumberInput = (props) => {
+    const { originValue, onValueChange, postfix = '', prefix = '', max = Number.MAX_SAFE_INTEGER } = props, restProps = __rest(props, ["originValue", "onValueChange", "postfix", "prefix", "max"]);
+    const formattingValue = (0, react_1.useCallback)((value) => {
+        return (0, utils_1.extractNumber)(value).length > 0 ? `${prefix}${(0, utils_1.formatKoreaCurrency)(value)} ${postfix}` : '';
+    }, [postfix, prefix]);
+    return (react_1.default.createElement(rifm_1.Rifm, { accept: /[\d]/g, format: formattingValue, value: originValue, onChange: (val) => onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange((0, utils_1.extractNumber)(val)) }, ({ value, onChange }) => (react_1.default.createElement(BaseInput_1.BaseInput, Object.assign({ type: "tel", format: postfix, value: value, onChange: (e) => {
+            const numeric = (0, utils_1.extractNumber)(e.target.value);
+            if (Number(numeric) > max) {
+                e.target.value = originValue;
+            }
+            onChange(e);
+        } }, restProps)))));
+};
+exports.default = NumberInput;

package/dist/components/Input/NumberInput/index.spec.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_2 = require("@testing-library/react");
+const _1 = __importDefault(require("."));
+const props = {
+    originValue: '',
+};
+describe('<NumberInput />', () => {
+    it('렌더링 체크', () => {
+        (0, react_2.render)(react_1.default.createElement(react_1.default.Fragment, null,
+            "\uD655\uC778",
+            react_1.default.createElement(_1.default, Object.assign({}, props))));
+        expect(react_2.screen.getByText('확인')).toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1,15 @@
+import React from 'react';
+import { BasicInputProps } from '../BaseInput';
+interface PostfixInputProps extends BasicInputProps {
+    realValue: string;
+    postfix?: string;
+    updateRealValue: (val: string) => void;
+    formatRealValue?: (val: string) => string;
+    formatDisplayValue?: (val: string) => string;
+}
+/**
+ *  fyi.  decoration 다시 살림 (https://pfcoworkspace.slack.com/archives/C0145TGCZ41/p1701937714740749)
+ */
+declare const PostfixInput: React.ForwardRefExoticComponent<PostfixInputProps & React.RefAttributes<HTMLInputElement>>;
+export type { PostfixInputProps };
+export { PostfixInput };

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

@@ -0,0 +1,129 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PostfixInput = void 0;
+const react_1 = __importStar(require("react"));
+const Styled = __importStar(require("../BaseInput/index.styled"));
+const ExpendStyled = __importStar(require("./index.styled"));
+const Typography_1 = require("../../../core/Typography");
+const Colors_1 = require("../../../core/Colors");
+const InputFrame_1 = require("../common/InputFrame");
+/**
+ *  fyi.  decoration 다시 살림 (https://pfcoworkspace.slack.com/archives/C0145TGCZ41/p1701937714740749)
+ */
+const PostfixInput = react_1.default.forwardRef((props, forwardedRef) => {
+    const { realValue, postfix, onBlur, onFocus, onClick, disabled, label, placeholder, errorValidation, logRocketMasking, focus = false, max, decoration, updateRealValue, formatRealValue, formatDisplayValue, type, pattern } = props, otherProps = __rest(props, ["realValue", "postfix", "onBlur", "onFocus", "onClick", "disabled", "label", "placeholder", "errorValidation", "logRocketMasking", "focus", "max", "decoration", "updateRealValue", "formatRealValue", "formatDisplayValue", "type", "pattern"]);
+    const [displayValue, setDisplayValue] = (0, react_1.useState)('');
+    const [errorText, setErrorText] = (0, react_1.useState)('');
+    const [focused, setFocused] = (0, react_1.useState)(focus);
+    const inputRef = (0, react_1.useRef)(null);
+    const active = focused || Boolean(displayValue);
+    const showPlaceholderOnlyNotActive = !label && !active && Boolean(placeholder);
+    const handleValidateMessage = (0, react_1.useCallback)((val) => {
+        if (val.length === 0 || val === '0') {
+            // 빈값일때 에러 안나게
+            setErrorText('');
+            return;
+        }
+        if (errorValidation) {
+            for (let i = 0; i < errorValidation.length; i++) {
+                if (!errorValidation[i].condition(val) && val.length !== 0) {
+                    setErrorText(errorValidation[i].errorText);
+                    break;
+                }
+                else {
+                    setErrorText('');
+                }
+            }
+        }
+    }, [errorValidation]);
+    const handleInputFocusState = (0, react_1.useCallback)((e) => {
+        const { type } = e;
+        if (type === 'focus') {
+            setFocused(true);
+        }
+        else {
+            setFocused(false);
+        }
+    }, []);
+    const handleClickInput = (0, react_1.useCallback)((e) => {
+        var _a;
+        onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    }, [onClick, inputRef]);
+    const handleChangeInput = (0, react_1.useCallback)((val) => {
+        const updateValue = (formatRealValue === null || formatRealValue === void 0 ? void 0 : formatRealValue(val)) || val;
+        const maxNumber = Number(max);
+        const numeric = Number(updateValue);
+        if (maxNumber && !isNaN(numeric)) {
+            if (numeric > maxNumber) {
+                return;
+            }
+        }
+        updateRealValue(updateValue);
+    }, [max, updateRealValue, formatRealValue]);
+    (0, react_1.useEffect)(() => {
+        let newDisplayValue = realValue;
+        if (formatDisplayValue) {
+            newDisplayValue = (formatDisplayValue === null || formatDisplayValue === void 0 ? void 0 : formatDisplayValue(newDisplayValue)) || ''; // 0만원 안되도록
+        }
+        setDisplayValue(newDisplayValue);
+        handleValidateMessage(realValue);
+    }, [formatDisplayValue, handleValidateMessage, realValue]);
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (focus) {
+            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    }, [inputRef, focus]);
+    return (react_1.default.createElement(InputFrame_1.InputFrame, { label: label, active: active, focused: focused, disabled: Boolean(disabled), errorText: errorText, handleClickInput: handleClickInput },
+        react_1.default.createElement(ExpendStyled.InputAndUnitWrapper, null,
+            react_1.default.createElement(ExpendStyled.InputSizer, { focused: focused, displayValue: displayValue },
+                react_1.default.createElement(ExpendStyled.InputTag, Object.assign({}, otherProps, { className: ExpendStyled.className.inputTag, hasLabel: Boolean(label), placeholder: showPlaceholderOnlyNotActive ? placeholder : '', "data-private": logRocketMasking, ref: forwardedRef || inputRef, name: label, disabled: disabled, value: formatDisplayValue ? displayValue : realValue, onChange: (e) => {
+                        const val = e.currentTarget.value;
+                        handleChangeInput(val);
+                    }, onFocus: (e) => {
+                        onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
+                        handleInputFocusState(e);
+                    }, onBlur: (e) => {
+                        onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+                        handleInputFocusState(e);
+                    }, decoration: false, pattern: type === 'number' ? '\\d*' : pattern, type: type, onClick: handleClickInput, size: showPlaceholderOnlyNotActive ? undefined : 1 }))),
+            react_1.default.createElement(ExpendStyled.UnitWrapper, null, active && (react_1.default.createElement(ExpendStyled.Unit, { hasLabel: Boolean(label), hasValue: Boolean(displayValue) },
+                react_1.default.createElement(Typography_1.BaseTypography, { md: "Title1", color: disabled ? Colors_1.basicColors.gray200 : undefined }, postfix))))),
+        decoration && react_1.default.createElement(Styled.DecorationItemWrapper, { disabled: disabled }, decoration)));
+});
+exports.PostfixInput = PostfixInput;

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_2 = require("@testing-library/react");
+const _1 = require(".");
+const props = {
+    realValue: '',
+    updateRealValue: (val) => {
+        console.log('updateRealValue', val);
+    },
+};
+describe('<PostfixInput />', () => {
+    it('렌더링 체크', () => {
+        (0, react_2.render)(react_1.default.createElement(react_1.default.Fragment, null,
+            "\uD655\uC778",
+            react_1.default.createElement(_1.PostfixInput, Object.assign({}, props))));
+        expect(react_2.screen.getByText('확인')).toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1,41 @@
+/// <reference types="react" />
+export declare const className: {
+    inputTag: string;
+};
+interface UnitProps {
+    hasValue: boolean;
+    hasLabel: boolean;
+}
+interface InputSizerProps {
+    displayValue: string;
+    focused: boolean;
+}
+export declare const InputTag: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    decoration?: boolean | undefined;
+    hasLabel: boolean;
+} & import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const InputAndUnitWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const UnitWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Unit: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & UnitProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/** ref. https://css-tricks.com/auto-growing-inputs-textareas/#aa-other-ideas */
+export declare const InputSizer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & InputSizerProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export {};

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

@@ -0,0 +1,97 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InputSizer = exports.Unit = exports.UnitWrapper = exports.InputAndUnitWrapper = exports.InputTag = exports.className = void 0;
+const BaseStyled = __importStar(require("../BaseInput/index.styled"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const TextStyles_1 = require("../../../core/TextStyles");
+const constant_1 = require("../common/InputFrame/constant");
+const react_1 = require("@emotion/react");
+exports.className = {
+    inputTag: 'postfix-input-tag',
+};
+exports.InputTag = (0, styled_1.default)(BaseStyled.InputTag) `
+	background-color: transparent;
+	padding-right: 0;
+	border-radius: 0;
+	height: ${constant_1.INPUT_HEIGHT}px; /** input, unit 아랫선 맞추기 */
+`;
+exports.InputAndUnitWrapper = styled_1.default.div `
+	display: flex;
+	width: 100%;
+`;
+exports.UnitWrapper = styled_1.default.div `
+	display: block;
+	position: relative;
+	flex: 1;
+`;
+exports.Unit = styled_1.default.div `
+	position: absolute;
+
+	${({ hasLabel }) => hasLabel
+    ? (0, react_1.css) `
+					top: ${constant_1.INNER_POSITION_TOP.hasLabel}px;
+			  `
+    : (0, react_1.css) `
+					top: ${constant_1.INNER_POSITION_TOP.noLabel}px;
+			  `}
+`;
+/** ref. https://css-tricks.com/auto-growing-inputs-textareas/#aa-other-ideas */
+exports.InputSizer = styled_1.default.div `
+	display: inline-grid;
+	flex: none;
+
+	${({ focused }) => focused &&
+    (0, react_1.css) `
+			width: fit-content;
+			padding-right: 4px;
+		`}
+
+	&::after {
+		content: '${({ displayValue }) => displayValue + ' '}';
+
+		visibility: hidden;
+		white-space: pre-wrap;
+		/** BaseStyled.InputTag 속성과 공유중, 유의 필요 */
+		padding-left: ${constant_1.INNER_POSITION_LEFT + 5}px;
+		${TextStyles_1.typography.title1}
+	}
+
+	&::after,
+	.${exports.className.inputTag} {
+		grid-area: 1 / 2;
+		resize: none;
+		background: none;
+		appearance: none;
+		border: none;
+
+		-webkit-appearance: none;
+		-ms-appearance: none;
+		-moz-appearance: none;
+	}
+`;

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

@@ -0,0 +1,2 @@
+export declare const formatRealValueWithManWon: (val: string) => string;
+export declare const formatDisplayValueWithManWon: (val: string) => string;

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

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatDisplayValueWithManWon = exports.formatRealValueWithManWon = void 0;
+const utils_1 = require("../../../utils");
+const 만 = 10000;
+const formatRealValueWithManWon = (val) => {
+    const numeric = Number((0, utils_1.extractNumber)(val));
+    if (!isNaN(numeric)) {
+        return (Number((0, utils_1.extractNumber)(val)) * 만).toString();
+    }
+    return '';
+};
+exports.formatRealValueWithManWon = formatRealValueWithManWon;
+const formatDisplayValueWithManWon = (val) => {
+    const extracted = Number((0, utils_1.extractNumber)(val)) / 만;
+    const newValue = extracted ? extracted.toString() : '';
+    return newValue ? (0, utils_1.formatKoreaCurrency)(newValue) : newValue;
+};
+exports.formatDisplayValueWithManWon = formatDisplayValueWithManWon;

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

@@ -0,0 +1,11 @@
+import React, { Dispatch, SetStateAction } from 'react';
+import { BasicInputProps } from '../BaseInput';
+type ResidentNumberInputProps<ValueType = string> = BasicInputProps & {
+    setValue: Dispatch<SetStateAction<ValueType>> | ((value: ValueType) => void);
+    rrnInputType?: 7 | 13;
+    rrn6?: string;
+    defaultRRN7Only?: string;
+};
+declare const ResidentNumberInput: React.FC<ResidentNumberInputProps>;
+export type { ResidentNumberInputProps };
+export { ResidentNumberInput };