review feedback - rename token

ni · Apr 30, 2024 · 0922039 · 0922039
1 parent 240f2f4
commit 0922039
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 5 deletions.
diff --git a/change/@ni-nimble-components-0aeacb05-bfbf-47eb-8e8d-d47e996f3004.json b/change/@ni-nimble-components-0aeacb05-bfbf-47eb-8e8d-d47e996f3004.json
@@ -1,6 +1,6 @@
 {
   "type": "minor",
-  "comment": "Added chip background color token",
+  "comment": "Added tag fill color token",
   "packageName": "@ni/nimble-components",
   "email": "1458528+fredvisser@users.noreply.github.com",
   "dependentChangeType": "patch"

diff --git a/packages/nimble-components/src/theme-provider/design-token-comments.ts b/packages/nimble-components/src/theme-provider/design-token-comments.ts
@@ -45,7 +45,7 @@ export const comments: { readonly [key in TokenName]: string } = {
     modalBackdropColor: 'Color of background overlay behind modal dialog boxes',
     popupBorderColor: 'Border color for menus and dialog boxes',
     cardBorderColor: 'Border color for cards',
-    chipBackgroundColor: 'Background color for chips',
+    tagFillColor: 'Background fill color for tags, chips, or pills',
     controlHeight:
         'Standard layout height for all controls. Add "labelHeight" for labels on top.',
     controlSlimHeight:

diff --git a/packages/nimble-components/src/theme-provider/design-token-names.ts b/packages/nimble-components/src/theme-provider/design-token-names.ts
@@ -36,7 +36,7 @@ export const tokenNames: { readonly [key in TokenName]: string } = {
     modalBackdropColor: 'modal-backdrop-color',
     popupBorderColor: 'popup-border-color',
     cardBorderColor: 'card-border-color',
-    chipBackgroundColor: 'chip-background-color',
+    tagFillColor: 'tag-fill-color',
     controlHeight: 'control-height',
     controlSlimHeight: 'control-slim-height',
     smallPadding: 'small-padding',

diff --git a/packages/nimble-components/src/theme-provider/design-tokens.ts b/packages/nimble-components/src/theme-provider/design-tokens.ts
@@ -212,8 +212,8 @@ export const tableRowBorderColor = DesignToken.create<string>(
     styleNameFromTokenName(tokenNames.tableRowBorderColor)
 ).withDefault((element: HTMLElement) => getColorForTheme(element, Black15, Black80, ForestGreen));
 
-export const chipBackgroundColor = DesignToken.create<string>(
-    styleNameFromTokenName(tokenNames.chipBackgroundColor)
+export const tagFillColor = DesignToken.create<string>(
+    styleNameFromTokenName(tokenNames.tagFillColor)
 ).withDefault((element: HTMLElement) => hexToRgbaCssColor(getColorForTheme(element, Black91, Black15, White), 0.1));
 
 export const buttonFillPrimaryColor = DesignToken.create<string>(