✨ feat: btn icon buy

:%s

pages/index.tsx

@@ -1,5 +1,5 @@
 
-import { ButtonCommon, Inputcommon, InputSearch, Layout } from 'src/components/common';
+import { ButtonCommon, ButtonIconBuy, Inputcommon, InputSearch, Layout } from 'src/components/common';
 import { IconBuy } from 'src/components/icons';
 export default function Home() {
   return (
@@ -17,9 +17,7 @@ export default function Home() {
       </div>
 
       <ButtonCommon type='ghost' icon={<IconBuy />}>Button</ButtonCommon>
-      <ButtonCommon type='light'><IconBuy /></ButtonCommon>
-      <ButtonCommon type='light' icon={<IconBuy />}/>
-      <ButtonCommon type='ghost' icon={<IconBuy />} size='large'/>
+      <ButtonIconBuy/>
     </>
   )
 }

src/components/common/ButtonIconBuy/ButtonIconBuy.tsx

@@ -0,0 +1,26 @@
+import React, { memo } from 'react'
+import { IconBuy } from 'src/components/icons'
+import ButtonCommon from '../ButtonCommon/ButtonCommon'
+
+interface Props {
+    type?: 'primary' | 'light' | 'ghost',
+    size?: 'default' | 'large',
+    loading?: boolean,
+    disabled?: boolean,
+    onClick?: () => void,
+}
+
+const ButtonIconBuy = memo(({ type = 'light', size = 'default', loading = false, disabled, onClick }: Props) => {
+    return (
+        <ButtonCommon
+            type={type}
+            size={size}
+            loading={loading}
+            disabled={disabled}
+            onClick={onClick}
+            icon={<IconBuy />}
+        />
+    )
+})
+
+export default ButtonIconBuy

src/components/common/index.ts

@@ -6,3 +6,4 @@ export { default as ItemWishList} from './ItemWishList/ItemWishList'
 export { default as Logo} from './Logo/Logo'
 export { default as Inputcommon} from './InputCommon/InputCommon'
 export { default as InputSearch} from './InputSearch/InputSearch'
+export { default as ButtonIconBuy} from './ButtonIconBuy/ButtonIconBuy'