(#0) Input readOnly 추가

thebbodek · Nov 29, 2023 · a7aee96 · a7aee96
1 parent bef04e1
commit a7aee96
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/src/core/components/Input/InputBase/index.tsx b/src/core/components/Input/InputBase/index.tsx
@@ -18,6 +18,7 @@ const InputBase = forwardRef(
       labelColor = "gray-04",
       borderColor = "gray-03",
       required,
+      readOnly,
       ...props
     }: InputBaseProps<T>,
     ref: React.ComponentPropsWithRef<T>["ref"],
@@ -40,7 +41,7 @@ const InputBase = forwardRef(
       >
         {startComponent && startComponent}
         {inputComponent && inputComponent}
-        {endComponent && endComponent}
+        {!readOnly && endComponent && endComponent}
       </div>
     </Component>
   );

diff --git a/src/core/components/Input/InputBase/types/index.ts b/src/core/components/Input/InputBase/types/index.ts
@@ -12,4 +12,5 @@ export interface InputBaseProps<T extends React.ElementType> extends React.HTMLA
   labelColor?: ThemeColors;
   borderColor?: ThemeColors;
   required?: boolean;
+  readOnly?: boolean;
 }
diff --git a/src/core/components/Input/InputTextField/index.tsx b/src/core/components/Input/InputTextField/index.tsx
@@ -17,7 +17,7 @@ const InputTextField = forwardRef((
     ref: React.ComponentPropsWithRef<"input">["ref"],
   ) => {
   const id = useId();
-  const { rootClassName, className, required, value, onChange, autoComplete = "off", ...rest } = props;
+  const { rootClassName, className, required, value, onChange, autoComplete = "off", readOnly, ...rest } = props;
   const { inputValue, onChangeHandler, onResetInputValue } = useInput({ value, regCallback, onChange });
   const ResetIcon = <XCircle size = "100%" weight = "fill" fill = "#A9B2C7"/>;
 
@@ -27,6 +27,7 @@ const InputTextField = forwardRef((
       label = {label}
       rootClassName = {rootClassName}
       inputRootClassName = "h-[3.75rem]"
+      readOnly = {readOnly}
       inputComponent = {
         <input
           ref = {ref}
@@ -37,6 +38,7 @@ const InputTextField = forwardRef((
           value = {inputValue}
           onChange = {onChangeHandler}
           autoComplete = {autoComplete}
+          readOnly = {readOnly}
           {...rest}
         />
       }