From 1b2ff383385bc164033f288803ff3abf34e1afaa Mon Sep 17 00:00:00 2001
From: Wendy Yuchen Sun <wendyyuchensun@gmail.com>
Date: Sun, 8 Mar 2026 12:24:34 +0800
Subject: [PATCH 1/2] fix: forward ref in buttons

---
 src/components/core/button/primary-button.js   | 7 +++++--
 src/components/core/button/secondary-button.js | 7 +++++--
 src/components/core/button/tertiary-button.js  | 7 +++++--
 3 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/components/core/button/primary-button.js b/src/components/core/button/primary-button.js
index 2997448..315e50e 100644
--- a/src/components/core/button/primary-button.js
+++ b/src/components/core/button/primary-button.js
@@ -7,9 +7,10 @@ const sizeClasses = {
   l: 'px-4 py-3 text-base leading-[1.5]',
 };
 
-const PrimaryButton = ({ size = 'sm', className, children, ...props }) => {
+const PrimaryButton = React.forwardRef(({ size = 'sm', className, children, ...props }, ref) => {
   return (
     <button
+      ref={ref}
       type="button"
       className={cn(
         'flex items-center justify-center bg-primary text-white rounded-lg',
@@ -24,7 +25,9 @@ const PrimaryButton = ({ size = 'sm', className, children, ...props }) => {
       {children}
     </button>
   );
-};
+});
+
+PrimaryButton.displayName = 'PrimaryButton';
 
 PrimaryButton.propTypes = {
   size: PropTypes.oneOf(['sm', 'l']),
diff --git a/src/components/core/button/secondary-button.js b/src/components/core/button/secondary-button.js
index cca7d73..c91163d 100644
--- a/src/components/core/button/secondary-button.js
+++ b/src/components/core/button/secondary-button.js
@@ -7,9 +7,10 @@ const sizeClasses = {
   l: 'px-4 py-3 text-base leading-[1.5]',
 };
 
-const SecondaryButton = ({ size = 'sm', className, children, ...props }) => {
+const SecondaryButton = React.forwardRef(({ size = 'sm', className, children, ...props }, ref) => {
   return (
     <button
+      ref={ref}
       type="button"
       className={cn(
         'flex items-center justify-center text-text-primary border border-border-main rounded-lg',
@@ -24,7 +25,9 @@ const SecondaryButton = ({ size = 'sm', className, children, ...props }) => {
       {children}
     </button>
   );
-};
+});
+
+SecondaryButton.displayName = 'SecondaryButton';
 
 SecondaryButton.propTypes = {
   size: PropTypes.oneOf(['sm', 'l']),
diff --git a/src/components/core/button/tertiary-button.js b/src/components/core/button/tertiary-button.js
index c306afc..4484389 100644
--- a/src/components/core/button/tertiary-button.js
+++ b/src/components/core/button/tertiary-button.js
@@ -7,9 +7,10 @@ const sizeClasses = {
   l: 'px-4 py-3 text-base leading-[1.5]',
 };
 
-const TertiaryButton = ({ size = 'sm', className, children, ...props }) => {
+const TertiaryButton = React.forwardRef(({ size = 'sm', className, children, ...props }, ref) => {
   return (
     <button
+      ref={ref}
       type="button"
       className={cn(
         'flex items-center justify-center text-primary rounded-lg',
@@ -24,7 +25,9 @@ const TertiaryButton = ({ size = 'sm', className, children, ...props }) => {
       {children}
     </button>
   );
-};
+});
+
+TertiaryButton.displayName = 'TertiaryButton';
 
 TertiaryButton.propTypes = {
   size: PropTypes.oneOf(['sm', 'l']),

From c63d6fec93a8bd6d0013e7d91c40e1eae64cea2a Mon Sep 17 00:00:00 2001
From: Wendy Yuchen Sun <wendyyuchensun@gmail.com>
Date: Sun, 8 Mar 2026 12:38:42 +0800
Subject: [PATCH 2/2] fix: btn bg color

---
 src/components/core/button/secondary-button.js | 2 +-
 src/components/core/button/tertiary-button.js  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/core/button/secondary-button.js b/src/components/core/button/secondary-button.js
index c91163d..71b788a 100644
--- a/src/components/core/button/secondary-button.js
+++ b/src/components/core/button/secondary-button.js
@@ -13,7 +13,7 @@ const SecondaryButton = React.forwardRef(({ size = 'sm', className, children, ..
       ref={ref}
       type="button"
       className={cn(
-        'flex items-center justify-center text-text-primary border border-border-main rounded-lg',
+        'flex items-center justify-center bg-white text-text-primary border border-border-main rounded-lg',
         'hover:bg-gray-50',
         'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary',
         'disabled:bg-bg-disabled disabled:text-text-disabled disabled:border disabled:border-text-secondary disabled:cursor-not-allowed',
diff --git a/src/components/core/button/tertiary-button.js b/src/components/core/button/tertiary-button.js
index 4484389..fdeb177 100644
--- a/src/components/core/button/tertiary-button.js
+++ b/src/components/core/button/tertiary-button.js
@@ -13,7 +13,7 @@ const TertiaryButton = React.forwardRef(({ size = 'sm', className, children, ...
       ref={ref}
       type="button"
       className={cn(
-        'flex items-center justify-center text-primary rounded-lg',
+        'flex items-center justify-center bg-white text-primary rounded-lg',
         'hover:text-blue-800',
         'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary',
         'disabled:bg-bg-disabled disabled:text-text-disabled disabled:border disabled:border-text-secondary disabled:cursor-not-allowed',