From ecb2071e1580c9a25c701ee227c869d45da7f455 Mon Sep 17 00:00:00 2001
From: "Ziggy Z." <ziggy.z@gt.tech.gov.sg>
Date: Tue, 6 Oct 2026 16:39:19 +0700
Subject: [PATCH 1/4] [CCUBE-2289][ZZ] feat: update style of secondary text in
 small variant dropdowns

---
 src/shared/dropdown-list/dropdown-label.styles.tsx | 7 +++++++
 src/shared/dropdown-list/dropdown-label.tsx        | 1 +
 2 files changed, 8 insertions(+)

diff --git a/src/shared/dropdown-list/dropdown-label.styles.tsx b/src/shared/dropdown-list/dropdown-label.styles.tsx
index 617626564e..f3f0a8f751 100644
--- a/src/shared/dropdown-list/dropdown-label.styles.tsx
+++ b/src/shared/dropdown-list/dropdown-label.styles.tsx
@@ -18,6 +18,7 @@ interface LabelTextStyleProps {
     $disabled?: boolean;
     $truncateType?: TruncateType;
     $bold?: boolean;
+    $variant?: DropdownVariantType;
 }
 
 interface MatchedTextStyleProps {
@@ -77,6 +78,12 @@ export const SecondaryText = styled.div<LabelTextStyleProps>`
                 `;
         }
     }}
+
+    ${(props) =>
+        props.$variant === "small" &&
+        css`
+            ${Font["body-md-regular"]}
+        `}
 `;
 
 export const MatchedText = styled.span<MatchedTextStyleProps>`
diff --git a/src/shared/dropdown-list/dropdown-label.tsx b/src/shared/dropdown-list/dropdown-label.tsx
index c51530fbdd..35b883b969 100644
--- a/src/shared/dropdown-list/dropdown-label.tsx
+++ b/src/shared/dropdown-list/dropdown-label.tsx
@@ -150,6 +150,7 @@ export const DropdownLabel = ({
                     $maxLines={maxLines}
                     $truncateType={truncationType}
                     $labelDisplayType={displayType}
+                    $variant={variant}
                 >
                     {truncationType === "middle" && shouldTruncateLabel
                         ? renderTruncatedText(sublabel)

From a0952de274c74188b2c501222f3d897b8fea9039 Mon Sep 17 00:00:00 2001
From: "Ziggy Z." <ziggy.z@gt.tech.gov.sg>
Date: Tue, 13 Oct 2026 16:25:16 +0700
Subject: [PATCH 2/4] [CCUBE-2289][ZZ] story: remove variant small prop for
 form select

---
 stories/form/form-select/form-select.stories.tsx | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/stories/form/form-select/form-select.stories.tsx b/stories/form/form-select/form-select.stories.tsx
index 60a075a7e0..b65d8db5be 100644
--- a/stories/form/form-select/form-select.stories.tsx
+++ b/stories/form/form-select/form-select.stories.tsx
@@ -272,7 +272,6 @@ export const LabelTruncation: StoryObj<Component> = {
                         title: item,
                         secondaryLabel: item,
                     })}
-                    variant="small"
                 />
                 <Form.Select
                     label="This has truncation in the middle"
@@ -282,7 +281,6 @@ export const LabelTruncation: StoryObj<Component> = {
                         title: item,
                         secondaryLabel: item,
                     })}
-                    variant="small"
                 />
                 <Form.Select
                     label="This has no truncation"
@@ -292,7 +290,6 @@ export const LabelTruncation: StoryObj<Component> = {
                         title: item,
                         secondaryLabel: item,
                     })}
-                    variant="small"
                 />
             </>
         );
@@ -376,7 +373,6 @@ export const SmallVariant: StoryObj<StandaloneComponent> = {
     render: (_args) => {
         return (
             <Form.Select
-                variant="small"
                 label="This is the small variant"
                 options={OPTIONS_DATA}
                 valueExtractor={(item) => item.value}

From 349a2c8686d29283354280e032aa988f6168eda2 Mon Sep 17 00:00:00 2001
From: "Ziggy Z." <ziggy.z@gt.tech.gov.sg>
Date: Wed, 14 Oct 2026 14:22:06 +0700
Subject: [PATCH 3/4] [CCUBE-2289][ZZ] story: add back small variant for form
 select

---
 stories/form/form-select/form-select.stories.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/stories/form/form-select/form-select.stories.tsx b/stories/form/form-select/form-select.stories.tsx
index b65d8db5be..6d9b9d1f5b 100644
--- a/stories/form/form-select/form-select.stories.tsx
+++ b/stories/form/form-select/form-select.stories.tsx
@@ -373,6 +373,7 @@ export const SmallVariant: StoryObj<StandaloneComponent> = {
     render: (_args) => {
         return (
             <Form.Select
+                variant="small"
                 label="This is the small variant"
                 options={OPTIONS_DATA}
                 valueExtractor={(item) => item.value}

From 0884f36fe949eaada4ce588536a5be08dae96f68 Mon Sep 17 00:00:00 2001
From: "Ziggy Z." <ziggy.z@gt.tech.gov.sg>
Date: Wed, 14 Oct 2026 15:22:06 +0700
Subject: [PATCH 4/4] [CCUBE-2289][ZZ] style: update bolding for inline

---
 src/shared/dropdown-list/dropdown-label.styles.tsx | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/shared/dropdown-list/dropdown-label.styles.tsx b/src/shared/dropdown-list/dropdown-label.styles.tsx
index f3f0a8f751..d0181f0776 100644
--- a/src/shared/dropdown-list/dropdown-label.styles.tsx
+++ b/src/shared/dropdown-list/dropdown-label.styles.tsx
@@ -74,16 +74,12 @@ export const SecondaryText = styled.div<LabelTextStyleProps>`
             case "inline":
             default:
                 return css`
-                    ${Font["body-baseline-regular"]}
+                    ${props.$variant === "small"
+                        ? Font["body-md-regular"]
+                        : Font["body-baseline-regular"]}
                 `;
         }
     }}
-
-    ${(props) =>
-        props.$variant === "small" &&
-        css`
-            ${Font["body-md-regular"]}
-        `}
 `;
 
 export const MatchedText = styled.span<MatchedTextStyleProps>`