From 61d18ee985e94f2828e85dba589d6f63f0088163 Mon Sep 17 00:00:00 2001
From: Frankie Yan <frankie@doist.com>
Date: Wed, 19 Aug 2026 23:55:49 -0700
Subject: [PATCH] feat: add actionable tone to Text

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/text/text.module.css  | 4 ++++
 src/text/text.stories.tsx | 4 ++--
 src/text/text.test.tsx    | 4 +++-
 src/utils/common-types.ts | 2 +-
 4 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/text/text.module.css b/src/text/text.module.css
index 953fffb9a..5a7291bb3 100644
--- a/src/text/text.module.css
+++ b/src/text/text.module.css
@@ -18,6 +18,10 @@
     color: var(--product-library-info-positive-primary-idle-tint);
 }
 
+.tone-actionable {
+    color: var(--product-library-actionable-tertiary-idle-tint);
+}
+
 .lineClampMultipleLines {
     display: -webkit-box;
     -webkit-box-orient: vertical;
diff --git a/src/text/text.stories.tsx b/src/text/text.stories.tsx
index 242c5a03b..c37a6cc69 100644
--- a/src/text/text.stories.tsx
+++ b/src/text/text.stories.tsx
@@ -108,7 +108,7 @@ ResponsiveTextStory.argTypes = {
     decoration: selectWithNone(['strikethrough', 'underline']),
     case: selectWithNone(['uppercase']),
     lineClamp: selectWithNone([1, 2, 3, 4, 5]),
-    tone: select(['normal', 'secondary', 'danger']),
+    tone: select(['normal', 'secondary', 'danger', 'positive', 'actionable']),
     align: { control: false },
     children: {
         control: { type: 'text' },
@@ -134,7 +134,7 @@ TextPlaygroundStory.argTypes = {
     decoration: selectWithNone(['strikethrough', 'underline']),
     case: selectWithNone(['uppercase']),
     lineClamp: selectWithNone([1, 2, 3, 4, 5]),
-    tone: select(['normal', 'secondary', 'danger']),
+    tone: select(['normal', 'secondary', 'danger', 'positive', 'actionable']),
     align: selectWithNone(['start', 'center', 'end', 'justify']),
     children: {
         control: { type: 'text' },
diff --git a/src/text/text.test.tsx b/src/text/text.test.tsx
index 1b8c2adb9..d3501ce29 100644
--- a/src/text/text.test.tsx
+++ b/src/text/text.test.tsx
@@ -121,8 +121,10 @@ describe('Text', () => {
             expect(textElement).not.toHaveClass('tone-normal')
             expect(textElement).not.toHaveClass('tone-secondary')
             expect(textElement).not.toHaveClass('tone-danger')
+            expect(textElement).not.toHaveClass('tone-positive')
+            expect(textElement).not.toHaveClass('tone-actionable')
 
-            for (const tone of ['secondary', 'danger'] as const) {
+            for (const tone of ['secondary', 'danger', 'positive', 'actionable'] as const) {
                 rerender(
                     <Text data-testid="text-element" tone={tone}>
                         Text
diff --git a/src/utils/common-types.ts b/src/utils/common-types.ts
index 11ee21b1d..b7509541c 100644
--- a/src/utils/common-types.ts
+++ b/src/utils/common-types.ts
@@ -14,7 +14,7 @@ export type SpaceWithNegatives =
     | '-xlarge'
     | '-xxlarge'
 
-export type Tone = 'normal' | 'secondary' | 'danger' | 'positive'
+export type Tone = 'normal' | 'secondary' | 'danger' | 'positive' | 'actionable'
 export type AlertTone = 'info' | 'positive' | 'caution' | 'critical'
 
 export type DividerWeight = 'primary' | 'secondary' | 'tertiary' | 'none'