feat: input common

pages/index.tsx

@@ -1,21 +1,31 @@
 
-import { ButtonCommon, Layout } from 'src/components/common'
-import { IconBuy } from 'src/components/icons'
-import { ButonType, ButtonSize } from 'src/utils/constanst.utils'
+import { useEffect, useRef } from 'react';
+import { Inputcommon, Layout } from 'src/components/common'
+import { InputType } from 'src/utils/constanst.utils'
 export default function Home() {
+
+  const inputElementRef = useRef<HTMLInputElement>(null);
+
+  useEffect(() => {
+    setTimeout(() =>{
+      inputElementRef.current?.focus()
+    }, 1000)
+  }, [])
+  
+  const onEnter = (value: string | number) => {
+
+  }
+
   return (
     <>
       <div>This is home page</div>
-      <ButtonCommon loading={true}>Button default</ButtonCommon>
-      <ButtonCommon type={ButonType.light} >{ButonType.light} -  Button light</ButtonCommon>
-      <ButtonCommon type={ButonType.light} disabled>{ButonType.light} -  Button light</ButtonCommon>
-      <ButtonCommon type={ButonType.light} loading = {true}>{ButonType.light} -  Button light</ButtonCommon>
-      <ButtonCommon size={ButtonSize.large} icon={<IconBuy/>}>{ButtonSize.large} - Button default large</ButtonCommon>
-      <ButtonCommon icon={<IconBuy/>} disabled isIconSuffix={true}>Button with icon disabled</ButtonCommon>
-      <ButtonCommon icon={<IconBuy/>} type={ButonType.light}>Button with icon</ButtonCommon>
       <p>Go to <code>pages/index.tsx</code> to get your hand dirty!</p>
       <p>Go to <code>src/components</code> to make your awesome component!</p>
       <p>Go to <code>src/styles</code> to find global styles!</p>
+
+      <Inputcommon placeholder="Enter here" onEnter={onEnter} ref={inputElementRef}/>
+      <Inputcommon placeholder="Enter here" onEnter={onEnter} type={InputType.number}/>
+      <Inputcommon placeholder="Enter here" value="23434" />
     </>
   )
 }