@sage/design-tokens 14.4.0 → 14.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (98) hide show
  1. package/css/frozenproduct/all.css +4 -3
  2. package/css/frozenproduct/large/global.css +4 -3
  3. package/css/frozenproduct/small/global.css +4 -3
  4. package/css/marketing/all.css +4 -3
  5. package/css/marketing/large/global.css +4 -3
  6. package/css/marketing/small/global.css +4 -3
  7. package/css/product/all.css +4 -3
  8. package/css/product/large/global.css +4 -3
  9. package/css/product/small/global.css +4 -3
  10. package/ios/frozenproduct/large/global.h +4 -3
  11. package/ios/frozenproduct/small/global.h +4 -3
  12. package/ios/marketing/large/global.h +4 -3
  13. package/ios/marketing/small/global.h +4 -3
  14. package/ios/product/large/global.h +4 -3
  15. package/ios/product/small/global.h +4 -3
  16. package/js/common/frozenproduct/large/global.d.ts +4 -3
  17. package/js/common/frozenproduct/large/global.js +104 -87
  18. package/js/common/frozenproduct/small/global.d.ts +4 -3
  19. package/js/common/frozenproduct/small/global.js +104 -87
  20. package/js/common/marketing/large/global.d.ts +4 -3
  21. package/js/common/marketing/large/global.js +104 -87
  22. package/js/common/marketing/small/global.d.ts +4 -3
  23. package/js/common/marketing/small/global.js +104 -87
  24. package/js/common/product/large/global.d.ts +4 -3
  25. package/js/common/product/large/global.js +104 -87
  26. package/js/common/product/small/global.d.ts +4 -3
  27. package/js/common/product/small/global.js +104 -87
  28. package/js/es6/frozenproduct/large/global.d.ts +4 -3
  29. package/js/es6/frozenproduct/large/global.js +4 -3
  30. package/js/es6/frozenproduct/small/global.d.ts +4 -3
  31. package/js/es6/frozenproduct/small/global.js +4 -3
  32. package/js/es6/marketing/large/global.d.ts +4 -3
  33. package/js/es6/marketing/large/global.js +4 -3
  34. package/js/es6/marketing/small/global.d.ts +4 -3
  35. package/js/es6/marketing/small/global.js +4 -3
  36. package/js/es6/product/large/global.d.ts +4 -3
  37. package/js/es6/product/large/global.js +4 -3
  38. package/js/es6/product/small/global.d.ts +4 -3
  39. package/js/es6/product/small/global.js +4 -3
  40. package/js/umd/frozenproduct/large/global.js +104 -88
  41. package/js/umd/frozenproduct/small/global.js +104 -88
  42. package/js/umd/marketing/large/global.js +104 -88
  43. package/js/umd/marketing/small/global.js +104 -88
  44. package/js/umd/product/large/global.js +104 -88
  45. package/js/umd/product/small/global.js +104 -88
  46. package/json/flat/frozenproduct/large/global.json +4 -3
  47. package/json/flat/frozenproduct/small/global.json +4 -3
  48. package/json/flat/marketing/large/global.json +4 -3
  49. package/json/flat/marketing/small/global.json +4 -3
  50. package/json/flat/product/large/global.json +4 -3
  51. package/json/flat/product/small/global.json +4 -3
  52. package/json/nested/frozenproduct/large/global.json +4 -3
  53. package/json/nested/frozenproduct/small/global.json +4 -3
  54. package/json/nested/marketing/large/global.json +4 -3
  55. package/json/nested/marketing/small/global.json +4 -3
  56. package/json/nested/product/large/global.json +4 -3
  57. package/json/nested/product/small/global.json +4 -3
  58. package/package.json +1 -1
  59. package/sage-design-tokens-14.5.0.tgz +0 -0
  60. package/scss/frozenproduct/large/global.scss +4 -3
  61. package/scss/frozenproduct/small/components/button.scss +13 -13
  62. package/scss/frozenproduct/small/components/container.scss +10 -10
  63. package/scss/frozenproduct/small/components/form.scss +7 -7
  64. package/scss/frozenproduct/small/components/link.scss +2 -2
  65. package/scss/frozenproduct/small/components/nav.scss +5 -5
  66. package/scss/frozenproduct/small/components/page.scss +1 -1
  67. package/scss/frozenproduct/small/components/popover.scss +2 -2
  68. package/scss/frozenproduct/small/components/progress.scss +6 -6
  69. package/scss/frozenproduct/small/components/status.scss +3 -3
  70. package/scss/frozenproduct/small/components/tab.scss +7 -7
  71. package/scss/frozenproduct/small/components/table.scss +10 -10
  72. package/scss/frozenproduct/small/global.scss +4 -3
  73. package/scss/marketing/large/components/button.scss +13 -13
  74. package/scss/marketing/large/components/container.scss +10 -10
  75. package/scss/marketing/large/components/form.scss +7 -7
  76. package/scss/marketing/large/components/link.scss +2 -2
  77. package/scss/marketing/large/components/nav.scss +5 -5
  78. package/scss/marketing/large/components/page.scss +1 -1
  79. package/scss/marketing/large/components/progress.scss +6 -6
  80. package/scss/marketing/large/components/status.scss +3 -3
  81. package/scss/marketing/large/components/tab.scss +7 -7
  82. package/scss/marketing/large/components/table.scss +10 -10
  83. package/scss/marketing/large/global.scss +4 -3
  84. package/scss/marketing/small/global.scss +4 -3
  85. package/scss/product/large/components/button.scss +13 -13
  86. package/scss/product/large/components/container.scss +10 -10
  87. package/scss/product/large/components/form.scss +7 -7
  88. package/scss/product/large/components/link.scss +2 -2
  89. package/scss/product/large/components/nav.scss +5 -5
  90. package/scss/product/large/components/page.scss +1 -1
  91. package/scss/product/large/components/popover.scss +2 -2
  92. package/scss/product/large/components/progress.scss +6 -6
  93. package/scss/product/large/components/status.scss +3 -3
  94. package/scss/product/large/components/tab.scss +7 -7
  95. package/scss/product/large/components/table.scss +10 -10
  96. package/scss/product/large/global.scss +4 -3
  97. package/scss/product/small/global.scss +4 -3
  98. package/sage-design-tokens-14.4.0.tgz +0 -0
@@ -147,9 +147,10 @@
147
147
  --global-font-size-adaptive-step9: 33px;
148
148
  --global-font-size-adaptive-step10: 36px;
149
149
  --global-font-families-sage-icons: sage-icons;
150
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
151
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
152
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
150
+ --global-font-families-heading: Sage UI;
151
+ --global-font-families-subheading: Sage UI;
152
+ --global-font-families-body: Sage UI;
153
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
153
154
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
154
155
 
155
156
  /* Light mode tokens */
@@ -183,8 +183,9 @@
183
183
  --global-font-size-adaptive-step9: 46px;
184
184
  --global-font-size-adaptive-step10: 52px;
185
185
  --global-font-families-sage-icons: sage-icons;
186
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
187
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
188
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
186
+ --global-font-families-heading: Sage UI;
187
+ --global-font-families-subheading: Sage UI;
188
+ --global-font-families-body: Sage UI;
189
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
189
190
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
190
191
  }
@@ -183,8 +183,9 @@
183
183
  --global-font-size-adaptive-step9: 33px;
184
184
  --global-font-size-adaptive-step10: 36px;
185
185
  --global-font-families-sage-icons: sage-icons;
186
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
187
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
188
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
186
+ --global-font-families-heading: Sage UI;
187
+ --global-font-families-subheading: Sage UI;
188
+ --global-font-families-body: Sage UI;
189
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
189
190
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
190
191
  }
@@ -147,9 +147,10 @@
147
147
  --global-font-size-adaptive-step9: 33px;
148
148
  --global-font-size-adaptive-step10: 36px;
149
149
  --global-font-families-sage-icons: sage-icons;
150
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
151
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
152
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
150
+ --global-font-families-heading: Sage UI;
151
+ --global-font-families-subheading: Sage UI;
152
+ --global-font-families-body: Sage UI;
153
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
153
154
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
154
155
 
155
156
  /* Light mode tokens */
@@ -183,8 +183,9 @@
183
183
  --global-font-size-adaptive-step9: 46px;
184
184
  --global-font-size-adaptive-step10: 52px;
185
185
  --global-font-families-sage-icons: sage-icons;
186
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
187
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
188
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
186
+ --global-font-families-heading: Sage UI;
187
+ --global-font-families-subheading: Sage UI;
188
+ --global-font-families-body: Sage UI;
189
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
189
190
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
190
191
  }
@@ -183,8 +183,9 @@
183
183
  --global-font-size-adaptive-step9: 33px;
184
184
  --global-font-size-adaptive-step10: 36px;
185
185
  --global-font-families-sage-icons: sage-icons;
186
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
187
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
188
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
186
+ --global-font-families-heading: Sage UI;
187
+ --global-font-families-subheading: Sage UI;
188
+ --global-font-families-body: Sage UI;
189
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
189
190
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
190
191
  }
@@ -147,9 +147,10 @@
147
147
  --global-font-size-adaptive-step9: 33px;
148
148
  --global-font-size-adaptive-step10: 36px;
149
149
  --global-font-families-sage-icons: sage-icons;
150
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
151
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
152
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
150
+ --global-font-families-heading: Sage UI;
151
+ --global-font-families-subheading: Sage UI;
152
+ --global-font-families-body: Sage UI;
153
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
153
154
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
154
155
 
155
156
  /* Light mode tokens */
@@ -183,8 +183,9 @@
183
183
  --global-font-size-adaptive-step9: 46px;
184
184
  --global-font-size-adaptive-step10: 52px;
185
185
  --global-font-families-sage-icons: sage-icons;
186
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
187
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
188
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
186
+ --global-font-families-heading: Sage UI;
187
+ --global-font-families-subheading: Sage UI;
188
+ --global-font-families-body: Sage UI;
189
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
189
190
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
190
191
  }
@@ -183,8 +183,9 @@
183
183
  --global-font-size-adaptive-step9: 33px;
184
184
  --global-font-size-adaptive-step10: 36px;
185
185
  --global-font-families-sage-icons: sage-icons;
186
- --global-font-families-sage-headline: Sage Headline; /* Used in only in marketing contexts for some headings. */
187
- --global-font-families-sage-ui: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
188
- --global-font-families-sage-text: Sage Text; /* Used for Headings in product and in marketing contexts. Marketing also use it for their body copy. */
186
+ --global-font-families-heading: Sage UI;
187
+ --global-font-families-subheading: Sage UI;
188
+ --global-font-families-body: Sage UI;
189
+ --global-font-families-component: Sage UI; /* Used in componentry such as tables, buttons, inputs etc. */
189
190
  --global-font-families-other: Open Sans; /* Fallback for when Sage fonts cannot load. */
190
191
  }
@@ -189,7 +189,8 @@
189
189
  #define globalFontSizeAdaptiveStep9 46px
190
190
  #define globalFontSizeAdaptiveStep10 52px
191
191
  #define globalFontFamiliesSageIcons sage-icons
192
- #define globalFontFamiliesSageHeadline Sage Headline
193
- #define globalFontFamiliesSageUi Sage UI
194
- #define globalFontFamiliesSageText Sage Text
192
+ #define globalFontFamiliesHeading Sage UI
193
+ #define globalFontFamiliesSubheading Sage UI
194
+ #define globalFontFamiliesBody Sage UI
195
+ #define globalFontFamiliesComponent Sage UI
195
196
  #define globalFontFamiliesOther Open Sans
@@ -189,7 +189,8 @@
189
189
  #define globalFontSizeAdaptiveStep9 33px
190
190
  #define globalFontSizeAdaptiveStep10 36px
191
191
  #define globalFontFamiliesSageIcons sage-icons
192
- #define globalFontFamiliesSageHeadline Sage Headline
193
- #define globalFontFamiliesSageUi Sage UI
194
- #define globalFontFamiliesSageText Sage Text
192
+ #define globalFontFamiliesHeading Sage UI
193
+ #define globalFontFamiliesSubheading Sage UI
194
+ #define globalFontFamiliesBody Sage UI
195
+ #define globalFontFamiliesComponent Sage UI
195
196
  #define globalFontFamiliesOther Open Sans
@@ -189,7 +189,8 @@
189
189
  #define globalFontSizeAdaptiveStep9 46px
190
190
  #define globalFontSizeAdaptiveStep10 52px
191
191
  #define globalFontFamiliesSageIcons sage-icons
192
- #define globalFontFamiliesSageHeadline Sage Headline
193
- #define globalFontFamiliesSageUi Sage UI
194
- #define globalFontFamiliesSageText Sage Text
192
+ #define globalFontFamiliesHeading Sage UI
193
+ #define globalFontFamiliesSubheading Sage UI
194
+ #define globalFontFamiliesBody Sage UI
195
+ #define globalFontFamiliesComponent Sage UI
195
196
  #define globalFontFamiliesOther Open Sans
@@ -189,7 +189,8 @@
189
189
  #define globalFontSizeAdaptiveStep9 33px
190
190
  #define globalFontSizeAdaptiveStep10 36px
191
191
  #define globalFontFamiliesSageIcons sage-icons
192
- #define globalFontFamiliesSageHeadline Sage Headline
193
- #define globalFontFamiliesSageUi Sage UI
194
- #define globalFontFamiliesSageText Sage Text
192
+ #define globalFontFamiliesHeading Sage UI
193
+ #define globalFontFamiliesSubheading Sage UI
194
+ #define globalFontFamiliesBody Sage UI
195
+ #define globalFontFamiliesComponent Sage UI
195
196
  #define globalFontFamiliesOther Open Sans
@@ -189,7 +189,8 @@
189
189
  #define globalFontSizeAdaptiveStep9 46px
190
190
  #define globalFontSizeAdaptiveStep10 52px
191
191
  #define globalFontFamiliesSageIcons sage-icons
192
- #define globalFontFamiliesSageHeadline Sage Headline
193
- #define globalFontFamiliesSageUi Sage UI
194
- #define globalFontFamiliesSageText Sage Text
192
+ #define globalFontFamiliesHeading Sage UI
193
+ #define globalFontFamiliesSubheading Sage UI
194
+ #define globalFontFamiliesBody Sage UI
195
+ #define globalFontFamiliesComponent Sage UI
195
196
  #define globalFontFamiliesOther Open Sans
@@ -189,7 +189,8 @@
189
189
  #define globalFontSizeAdaptiveStep9 33px
190
190
  #define globalFontSizeAdaptiveStep10 36px
191
191
  #define globalFontFamiliesSageIcons sage-icons
192
- #define globalFontFamiliesSageHeadline Sage Headline
193
- #define globalFontFamiliesSageUi Sage UI
194
- #define globalFontFamiliesSageText Sage Text
192
+ #define globalFontFamiliesHeading Sage UI
193
+ #define globalFontFamiliesSubheading Sage UI
194
+ #define globalFontFamiliesBody Sage UI
195
+ #define globalFontFamiliesComponent Sage UI
195
196
  #define globalFontFamiliesOther Open Sans
@@ -303,9 +303,10 @@ declare const tokens: {
303
303
  };
304
304
  fontFamilies: {
305
305
  "sage-icons": DesignToken;
306
- "sage-headline": DesignToken;
307
- "sage-ui": DesignToken;
308
- "sage-text": DesignToken;
306
+ heading: DesignToken;
307
+ subheading: DesignToken;
308
+ body: DesignToken;
309
+ component: DesignToken;
309
310
  other: DesignToken;
310
311
  };
311
312
  };