From 1dff8ca16b00f416a0c90c2fac1edd74d9155471 Mon Sep 17 00:00:00 2001
From: Augustin Mauroy <augustin.mauroy@outlook.fr>
Date: Sun, 22 Dec 2024 11:56:29 +0100
Subject: [PATCH] feat(button): introduce __TEXT	__DATA	__OBJC	others	dec
 hex variant

---
 .../components/Common/Button/index.module.css     |  6 ++++++
 .../components/Common/Button/index.stories.tsx    | 15 ++++++++++++++-
 apps/site/components/Common/Button/index.tsx      |  9 ++++++++-
 3 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/apps/site/components/Common/Button/index.module.css b/apps/site/components/Common/Button/index.module.css
index 9bd34cb96ae97..4d8786bc63b14 100644
--- a/apps/site/components/Common/Button/index.module.css
+++ b/apps/site/components/Common/Button/index.module.css
@@ -17,6 +17,12 @@
     @apply cursor-not-allowed;
   }
 
+  &.small {
+    @apply px-3
+      py-2
+      text-sm;
+  }
+
   &.neutral {
     @apply rounded
       bg-neutral-900
diff --git a/apps/site/components/Common/Button/index.stories.tsx b/apps/site/components/Common/Button/index.stories.tsx
index d10805dc60e54..b518ac0fbd3f7 100644
--- a/apps/site/components/Common/Button/index.stories.tsx
+++ b/apps/site/components/Common/Button/index.stories.tsx
@@ -11,6 +11,7 @@ export const Neutral: Story = {
     kind: 'neutral',
     children: 'Download Node (LTS)',
     disabled: false,
+    size: 'default',
   },
 };
 
@@ -19,6 +20,7 @@ export const Primary: Story = {
     kind: 'primary',
     children: 'Download Node (LTS)',
     disabled: false,
+    size: 'default',
   },
 };
 
@@ -27,6 +29,7 @@ export const Secondary: Story = {
     kind: 'secondary',
     children: 'Download Node (LTS)',
     disabled: false,
+    size: 'default',
   },
 };
 
@@ -35,6 +38,7 @@ export const Special: Story = {
     kind: 'special',
     children: 'Download Node (LTS)',
     disabled: false,
+    size: 'default',
   },
 };
 
@@ -48,7 +52,16 @@ export const WithIcon: Story = {
       </>
     ),
     disabled: false,
+    size: 'default',
   },
 };
 
-export default { component: Button } as Meta;
+export default {
+  component: Button,
+  argTypes: {
+    size: {
+      options: ['default', 'small'],
+      control: { type: 'radio' },
+    },
+  },
+} as Meta;
diff --git a/apps/site/components/Common/Button/index.tsx b/apps/site/components/Common/Button/index.tsx
index 804cc296ecf46..bf19cfc5cffd3 100644
--- a/apps/site/components/Common/Button/index.tsx
+++ b/apps/site/components/Common/Button/index.tsx
@@ -14,11 +14,13 @@ import styles from './index.module.css';
 
 type ButtonProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
   kind?: 'neutral' | 'primary' | 'secondary' | 'special';
+  size?: 'default' | 'small';
   disabled?: boolean;
 };
 
 const Button: FC<ButtonProps> = ({
   kind = 'primary',
+  size = 'default',
   disabled = false,
   href = undefined,
   children,
@@ -56,7 +58,12 @@ const Button: FC<ButtonProps> = ({
       role="button"
       href={disabled ? undefined : href}
       aria-disabled={disabled}
-      className={classNames(styles.button, styles[kind], className)}
+      className={classNames(
+        styles.button,
+        styles[kind],
+        styles[size],
+        className
+      )}
       tabIndex={disabled ? -1 : 0} // Ensure focusable if not disabled
       onClick={onClickHandler}
       onKeyDown={onKeyDownHandler}