diff --git a/.changeset/pretty-eggs-teach.md b/.changeset/pretty-eggs-teach.md new file mode 100644 index 0000000..5cfa5de --- /dev/null +++ b/.changeset/pretty-eggs-teach.md @@ -0,0 +1,5 @@ +--- +'@sopt-makers/ui': patch +--- + +TextArea Value prop이 undefined일 경우 발생하는 타입 에러 수정 diff --git a/apps/docs/src/App.tsx b/apps/docs/src/App.tsx index 5fe7640..50dd158 100644 --- a/apps/docs/src/App.tsx +++ b/apps/docs/src/App.tsx @@ -70,7 +70,7 @@ function App() { rightAddon={{ onClick: () => handleTextareaSubmit() }} validationFn={textareaValidation} errorMessage='Error Message' - value={textarea} + // value={textarea} onChange={handleTextareaChange} maxLength={300} /> diff --git a/packages/ui/Input/TextArea.tsx b/packages/ui/Input/TextArea.tsx index 24e788c..80fd32f 100644 --- a/packages/ui/Input/TextArea.tsx +++ b/packages/ui/Input/TextArea.tsx @@ -35,7 +35,7 @@ const TextArea = forwardRef((props, forwarde isError, validationFn, errorMessage, - value = '', + value, disableEnterSubmit = false, maxLength, fixedHeight, @@ -45,8 +45,8 @@ const TextArea = forwardRef((props, forwarde const { onChange, ...restInputProps } = inputProps; const { disabled, readOnly, required } = restInputProps; - const isValid = validationFn ? validationFn(value) : true; - const isEmpty = value.length === 0; + const isValid = validationFn ? validationFn(value ?? '') : true; + const isEmpty = value && value.length === 0; const submitButtonRef = useRef(null); @@ -171,8 +171,8 @@ const TextArea = forwardRef((props, forwarde )} {maxLength ? ( -

maxLength ? S.maxCount : ''}`}> - {value.length}/{maxLength} +

maxLength ? S.maxCount : ''}`}> + {value?.length}/{maxLength}

) : null}