react-validate-component 1.1.0 → 1.1.1

package/src/vDate/index.tsx

@@ -13,6 +13,7 @@ export function VDate({
   props = {},
 }: VDATE_PARAMS) {
   switch (vType) {
+    default:
     case 'top':
       return (
         <>
@@ -47,7 +48,5 @@ export function VDate({
           ) : null}
         </>
       );
-    default:
-      return <></>;
   }
 }

package/src/vEmail/index.tsx

@@ -14,6 +14,7 @@ export function VEmail({
   props = {},
 }: VEMAIL_PARAMS) {
   switch (vType) {
+    default:
     case 'outer':
       return (
         <div
@@ -86,7 +87,5 @@ export function VEmail({
           ) : null}
         </div>
       );
-    default:
-      return <div></div>;
   }
 }

package/src/vRadio/index.tsx

@@ -38,6 +38,7 @@ export function VRadio({
   }
 
   switch (vType) {
+    default:
     case 'bottom':
       return (
         <>
@@ -103,7 +104,5 @@ export function VRadio({
           ) : null}
         </>
       );
-    default:
-      return <div></div>;
   }
 }

package/src/vRange/index.tsx

@@ -13,6 +13,7 @@ export function VRange({
   props = {},
 }: VRANGE_PARAMS) {
   switch (vType) {
+    default:
     case 'top':
       return (
         <>
@@ -47,7 +48,5 @@ export function VRange({
           ) : null}
         </>
       );
-    default:
-      return <></>;
   }
 }

package/src/vText/index.tsx

@@ -23,25 +23,27 @@ export function VText({
   );
 
   // 공통 input 태그 변수화
-  const inputHTML = (
-    <input
-      type="text"
-      ref={inputRef}
-      {...props}
-      onChange={e => {
-        if (vUseMaxLength && e.target.value.length > vMaxLength) {
-          e.preventDefault();
-          e.target.value = e.target.value.slice(0, vMaxLength);
-        } else {
-          props?.onChange(e);
-        }
-      }}
-      defaultValue={props?.defaultValue ?? ''}
-      className={`${props?.className ?? ''} ${vClassName} ${
-        vState ? styles.invalid : ''
-      }`}
-    ></input>
-  );
+  const inputHTML = () => {
+    return (
+      <input
+        type="text"
+        ref={inputRef}
+        {...props}
+        onChange={e => {
+          if (vUseMaxLength && e.target.value.length > vMaxLength) {
+            e.preventDefault();
+            e.target.value = e.target.value.slice(0, vMaxLength);
+          } else {
+            props?.onChange(e);
+          }
+        }}
+        defaultValue={props?.defaultValue ?? ''}
+        className={`${props?.className ?? ''} ${vClassName} ${
+          vState ? styles.invalid : ''
+        }`}
+      ></input>
+    );
+  };
 
   // 일부 옵션 값들은 input 기본 속성값을 이용하기 위해 merge 진행
   if (vUseMaxLength) {
@@ -56,6 +58,7 @@ export function VText({
   }, [inputRef.current?.value]);
 
   switch (vType) {
+    default:
     case 'outer':
       return (
         <div
@@ -63,12 +66,14 @@ export function VText({
             vUseMaxLength ? styles.vMaxLengthContainer : ''
           }`}
         >
-          {inputHTML}
-          {vUseMaxLength && (
-            <p className={`${styles.vMaxLength} ${vClassMaxLength}`}>
-              {inputLength} / {vMaxLength}
-            </p>
-          )}
+          <div style={{ position: 'relative' }}>
+            {inputHTML()}
+            {vUseMaxLength && (
+              <p className={`${styles.vMaxLength} ${vClassMaxLength}`}>
+                {inputLength} / {vMaxLength}
+              </p>
+            )}
+          </div>
           {vState && vShowMessage ? (
             <p
               className={`${vMessageClass} ${
@@ -87,7 +92,7 @@ export function VText({
             vUseMaxLength ? styles.vMaxLengthContainer : ''
           }`}
         >
-          {inputHTML}
+          {inputHTML()}
           {vUseMaxLength && (
             <p className={`${styles.vMaxLength} ${vClassMaxLength}`}>
               {inputLength} / {vMaxLength}
@@ -111,7 +116,7 @@ export function VText({
             styles[`tooltipMessage-${vLocateMessage}`]
           } ${vUseMaxLength ? styles.vMaxLengthContainer : ''}`}
         >
-          {inputHTML}
+          {inputHTML()}
           {vUseMaxLength && (
             <p className={`${styles.vMaxLength} ${vClassMaxLength}`}>
               {inputLength} / {vMaxLength}
@@ -128,7 +133,5 @@ export function VText({
           ) : null}
         </div>
       );
-    default:
-      return <div></div>;
   }
 }

package/src/vURL/index.tsx

@@ -14,6 +14,7 @@ export function VURL({
   props = {},
 }: VURL_PARAMS) {
   switch (vType) {
+    default:
     case 'outer':
       return (
         <div
@@ -86,7 +87,5 @@ export function VURL({
           ) : null}
         </div>
       );
-    default:
-      return <div></div>;
   }
 }