@fluentui/tokens 1.0.0-alpha.1 → 1.0.0-alpha.3

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 (226) hide show
  1. package/CHANGELOG.json +88 -1
  2. package/CHANGELOG.md +20 -2
  3. package/dist/index.d.ts +442 -0
  4. package/lib/alias/darkColor.js +156 -0
  5. package/lib/alias/darkColor.js.map +1 -0
  6. package/lib/alias/darkColorPalette.js +45 -0
  7. package/lib/alias/darkColorPalette.js.map +1 -0
  8. package/lib/alias/highContrastColor.js +156 -0
  9. package/lib/alias/highContrastColor.js.map +1 -0
  10. package/lib/alias/highContrastColorPalette.js +35 -0
  11. package/lib/alias/highContrastColorPalette.js.map +1 -0
  12. package/lib/alias/lightColor.js +156 -0
  13. package/lib/alias/lightColor.js.map +1 -0
  14. package/lib/alias/lightColorPalette.js +36 -0
  15. package/lib/alias/lightColorPalette.js.map +1 -0
  16. package/lib/alias/teamsDarkColor.js +156 -0
  17. package/lib/alias/teamsDarkColor.js.map +1 -0
  18. package/lib/global/borderRadius.js +9 -0
  19. package/lib/global/borderRadius.js.map +1 -0
  20. package/lib/global/brandColors.js +55 -0
  21. package/lib/global/brandColors.js.map +1 -0
  22. package/lib/global/colorPalette.js +41 -0
  23. package/lib/global/colorPalette.js.map +1 -0
  24. package/lib/global/colors.js +810 -0
  25. package/lib/global/colors.js.map +1 -0
  26. package/lib/global/curves.js +12 -0
  27. package/lib/global/curves.js.map +1 -0
  28. package/lib/global/durations.js +10 -0
  29. package/lib/global/durations.js.map +1 -0
  30. package/lib/global/fonts.js +40 -0
  31. package/lib/global/fonts.js.map +1 -0
  32. package/lib/global/index.js +10 -0
  33. package/lib/global/index.js.map +1 -0
  34. package/lib/global/spacings.js +41 -0
  35. package/lib/global/spacings.js.map +1 -0
  36. package/lib/global/strokeWidths.js +7 -0
  37. package/lib/global/strokeWidths.js.map +1 -0
  38. package/lib/global/typographyStyles.js +109 -0
  39. package/lib/global/typographyStyles.js.map +1 -0
  40. package/lib/index.js +5 -1
  41. package/lib/index.js.map +1 -1
  42. package/lib/sharedColorNames.js +7 -0
  43. package/lib/sharedColorNames.js.map +1 -0
  44. package/lib/themeToTokensObject.js +17 -0
  45. package/lib/themeToTokensObject.js.map +1 -0
  46. package/lib/themes/index.js +3 -0
  47. package/lib/themes/index.js.map +1 -0
  48. package/lib/themes/teams/darkTheme.js +4 -0
  49. package/lib/themes/teams/darkTheme.js.map +1 -0
  50. package/lib/themes/teams/highContrastTheme.js +3 -0
  51. package/lib/themes/teams/highContrastTheme.js.map +1 -0
  52. package/lib/themes/teams/index.js +4 -0
  53. package/lib/themes/teams/index.js.map +1 -0
  54. package/lib/themes/teams/lightTheme.js +4 -0
  55. package/lib/themes/teams/lightTheme.js.map +1 -0
  56. package/lib/themes/web/darkTheme.js +4 -0
  57. package/lib/themes/web/darkTheme.js.map +1 -0
  58. package/lib/themes/web/index.js +3 -0
  59. package/lib/themes/web/index.js.map +1 -0
  60. package/lib/themes/web/lightTheme.js +4 -0
  61. package/lib/themes/web/lightTheme.js.map +1 -0
  62. package/lib/tokens.js +438 -0
  63. package/lib/tokens.js.map +1 -0
  64. package/lib/types.js +2 -0
  65. package/lib/types.js.map +1 -0
  66. package/lib/utils/createDarkTheme.js +27 -0
  67. package/lib/utils/createDarkTheme.js.map +1 -0
  68. package/lib/utils/createHighContrastTheme.js +27 -0
  69. package/lib/utils/createHighContrastTheme.js.map +1 -0
  70. package/lib/utils/createLightTheme.js +27 -0
  71. package/lib/utils/createLightTheme.js.map +1 -0
  72. package/lib/utils/createTeamsDarkTheme.js +27 -0
  73. package/lib/utils/createTeamsDarkTheme.js.map +1 -0
  74. package/lib/utils/index.js +5 -0
  75. package/lib/utils/index.js.map +1 -0
  76. package/lib/utils/shadows.js +11 -0
  77. package/lib/utils/shadows.js.map +1 -0
  78. package/lib-amd/alias/darkColor.js +161 -0
  79. package/lib-amd/alias/darkColor.js.map +1 -0
  80. package/lib-amd/alias/darkColorPalette.js +47 -0
  81. package/lib-amd/alias/darkColorPalette.js.map +1 -0
  82. package/lib-amd/alias/highContrastColor.js +161 -0
  83. package/lib-amd/alias/highContrastColor.js.map +1 -0
  84. package/lib-amd/alias/highContrastColorPalette.js +37 -0
  85. package/lib-amd/alias/highContrastColorPalette.js.map +1 -0
  86. package/lib-amd/alias/lightColor.js +161 -0
  87. package/lib-amd/alias/lightColor.js.map +1 -0
  88. package/lib-amd/alias/lightColorPalette.js +38 -0
  89. package/lib-amd/alias/lightColorPalette.js.map +1 -0
  90. package/lib-amd/alias/teamsDarkColor.js +161 -0
  91. package/lib-amd/alias/teamsDarkColor.js.map +1 -0
  92. package/lib-amd/global/borderRadius.js +14 -0
  93. package/lib-amd/global/borderRadius.js.map +1 -0
  94. package/lib-amd/global/brandColors.js +60 -0
  95. package/lib-amd/global/brandColors.js.map +1 -0
  96. package/lib-amd/global/colorPalette.js +45 -0
  97. package/lib-amd/global/colorPalette.js.map +1 -0
  98. package/lib-amd/global/colors.js +815 -0
  99. package/lib-amd/global/colors.js.map +1 -0
  100. package/lib-amd/global/curves.js +17 -0
  101. package/lib-amd/global/curves.js.map +1 -0
  102. package/lib-amd/global/durations.js +15 -0
  103. package/lib-amd/global/durations.js.map +1 -0
  104. package/lib-amd/global/fonts.js +45 -0
  105. package/lib-amd/global/fonts.js.map +1 -0
  106. package/lib-amd/global/index.js +14 -0
  107. package/lib-amd/global/index.js.map +1 -0
  108. package/lib-amd/global/spacings.js +46 -0
  109. package/lib-amd/global/spacings.js.map +1 -0
  110. package/lib-amd/global/strokeWidths.js +12 -0
  111. package/lib-amd/global/strokeWidths.js.map +1 -0
  112. package/lib-amd/global/typographyStyles.js +113 -0
  113. package/lib-amd/global/typographyStyles.js.map +1 -0
  114. package/lib-amd/index.js +14 -1
  115. package/lib-amd/index.js.map +1 -1
  116. package/lib-amd/sharedColorNames.js +64 -0
  117. package/lib-amd/sharedColorNames.js.map +1 -0
  118. package/lib-amd/themeToTokensObject.js +24 -0
  119. package/lib-amd/themeToTokensObject.js.map +1 -0
  120. package/lib-amd/themes/index.js +7 -0
  121. package/lib-amd/themes/index.js.map +1 -0
  122. package/lib-amd/themes/teams/darkTheme.js +7 -0
  123. package/lib-amd/themes/teams/darkTheme.js.map +1 -0
  124. package/lib-amd/themes/teams/highContrastTheme.js +7 -0
  125. package/lib-amd/themes/teams/highContrastTheme.js.map +1 -0
  126. package/lib-amd/themes/teams/index.js +8 -0
  127. package/lib-amd/themes/teams/index.js.map +1 -0
  128. package/lib-amd/themes/teams/lightTheme.js +7 -0
  129. package/lib-amd/themes/teams/lightTheme.js.map +1 -0
  130. package/lib-amd/themes/web/darkTheme.js +7 -0
  131. package/lib-amd/themes/web/darkTheme.js.map +1 -0
  132. package/lib-amd/themes/web/index.js +7 -0
  133. package/lib-amd/themes/web/index.js.map +1 -0
  134. package/lib-amd/themes/web/lightTheme.js +7 -0
  135. package/lib-amd/themes/web/lightTheme.js.map +1 -0
  136. package/lib-amd/tokens.js +443 -0
  137. package/lib-amd/tokens.js.map +1 -0
  138. package/lib-amd/types.js +5 -0
  139. package/lib-amd/types.js.map +1 -0
  140. package/lib-amd/utils/createDarkTheme.js +11 -0
  141. package/lib-amd/utils/createDarkTheme.js.map +1 -0
  142. package/lib-amd/utils/createHighContrastTheme.js +11 -0
  143. package/lib-amd/utils/createHighContrastTheme.js.map +1 -0
  144. package/lib-amd/utils/createLightTheme.js +11 -0
  145. package/lib-amd/utils/createLightTheme.js.map +1 -0
  146. package/lib-amd/utils/createTeamsDarkTheme.js +11 -0
  147. package/lib-amd/utils/createTeamsDarkTheme.js.map +1 -0
  148. package/lib-amd/utils/index.js +9 -0
  149. package/lib-amd/utils/index.js.map +1 -0
  150. package/lib-amd/utils/shadows.js +19 -0
  151. package/lib-amd/utils/shadows.js.map +1 -0
  152. package/lib-commonjs/alias/darkColor.js +164 -0
  153. package/lib-commonjs/alias/darkColor.js.map +1 -0
  154. package/lib-commonjs/alias/darkColorPalette.js +51 -0
  155. package/lib-commonjs/alias/darkColorPalette.js.map +1 -0
  156. package/lib-commonjs/alias/highContrastColor.js +164 -0
  157. package/lib-commonjs/alias/highContrastColor.js.map +1 -0
  158. package/lib-commonjs/alias/highContrastColorPalette.js +41 -0
  159. package/lib-commonjs/alias/highContrastColorPalette.js.map +1 -0
  160. package/lib-commonjs/alias/lightColor.js +164 -0
  161. package/lib-commonjs/alias/lightColor.js.map +1 -0
  162. package/lib-commonjs/alias/lightColorPalette.js +42 -0
  163. package/lib-commonjs/alias/lightColorPalette.js.map +1 -0
  164. package/lib-commonjs/alias/teamsDarkColor.js +164 -0
  165. package/lib-commonjs/alias/teamsDarkColor.js.map +1 -0
  166. package/lib-commonjs/global/borderRadius.js +15 -0
  167. package/lib-commonjs/global/borderRadius.js.map +1 -0
  168. package/lib-commonjs/global/brandColors.js +61 -0
  169. package/lib-commonjs/global/brandColors.js.map +1 -0
  170. package/lib-commonjs/global/colorPalette.js +47 -0
  171. package/lib-commonjs/global/colorPalette.js.map +1 -0
  172. package/lib-commonjs/global/colors.js +817 -0
  173. package/lib-commonjs/global/colors.js.map +1 -0
  174. package/lib-commonjs/global/curves.js +18 -0
  175. package/lib-commonjs/global/curves.js.map +1 -0
  176. package/lib-commonjs/global/durations.js +16 -0
  177. package/lib-commonjs/global/durations.js.map +1 -0
  178. package/lib-commonjs/global/fonts.js +46 -0
  179. package/lib-commonjs/global/fonts.js.map +1 -0
  180. package/lib-commonjs/global/index.js +16 -0
  181. package/lib-commonjs/global/index.js.map +1 -0
  182. package/lib-commonjs/global/spacings.js +47 -0
  183. package/lib-commonjs/global/spacings.js.map +1 -0
  184. package/lib-commonjs/global/strokeWidths.js +13 -0
  185. package/lib-commonjs/global/strokeWidths.js.map +1 -0
  186. package/lib-commonjs/global/typographyStyles.js +115 -0
  187. package/lib-commonjs/global/typographyStyles.js.map +1 -0
  188. package/lib-commonjs/index.js +78 -0
  189. package/lib-commonjs/index.js.map +1 -1
  190. package/lib-commonjs/sharedColorNames.js +13 -0
  191. package/lib-commonjs/sharedColorNames.js.map +1 -0
  192. package/lib-commonjs/themeToTokensObject.js +24 -0
  193. package/lib-commonjs/themeToTokensObject.js.map +1 -0
  194. package/lib-commonjs/themes/index.js +9 -0
  195. package/lib-commonjs/themes/index.js.map +1 -0
  196. package/lib-commonjs/themes/teams/darkTheme.js +10 -0
  197. package/lib-commonjs/themes/teams/darkTheme.js.map +1 -0
  198. package/lib-commonjs/themes/teams/highContrastTheme.js +9 -0
  199. package/lib-commonjs/themes/teams/highContrastTheme.js.map +1 -0
  200. package/lib-commonjs/themes/teams/index.js +10 -0
  201. package/lib-commonjs/themes/teams/index.js.map +1 -0
  202. package/lib-commonjs/themes/teams/lightTheme.js +10 -0
  203. package/lib-commonjs/themes/teams/lightTheme.js.map +1 -0
  204. package/lib-commonjs/themes/web/darkTheme.js +10 -0
  205. package/lib-commonjs/themes/web/darkTheme.js.map +1 -0
  206. package/lib-commonjs/themes/web/index.js +9 -0
  207. package/lib-commonjs/themes/web/index.js.map +1 -0
  208. package/lib-commonjs/themes/web/lightTheme.js +10 -0
  209. package/lib-commonjs/themes/web/lightTheme.js.map +1 -0
  210. package/lib-commonjs/tokens.js +444 -0
  211. package/lib-commonjs/tokens.js.map +1 -0
  212. package/lib-commonjs/types.js +6 -0
  213. package/lib-commonjs/types.js.map +1 -0
  214. package/lib-commonjs/utils/createDarkTheme.js +34 -0
  215. package/lib-commonjs/utils/createDarkTheme.js.map +1 -0
  216. package/lib-commonjs/utils/createHighContrastTheme.js +34 -0
  217. package/lib-commonjs/utils/createHighContrastTheme.js.map +1 -0
  218. package/lib-commonjs/utils/createLightTheme.js +34 -0
  219. package/lib-commonjs/utils/createLightTheme.js.map +1 -0
  220. package/lib-commonjs/utils/createTeamsDarkTheme.js +34 -0
  221. package/lib-commonjs/utils/createTeamsDarkTheme.js.map +1 -0
  222. package/lib-commonjs/utils/index.js +11 -0
  223. package/lib-commonjs/utils/index.js.map +1 -0
  224. package/lib-commonjs/utils/shadows.js +18 -0
  225. package/lib-commonjs/utils/shadows.js.map +1 -0
  226. package/package.json +4 -2
package/CHANGELOG.json CHANGED
@@ -2,7 +2,94 @@
2
2
  "name": "@fluentui/tokens",
3
3
  "entries": [
4
4
  {
5
- "date": "Tue, 20 Dec 2022 07:51:41 GMT",
5
+ "date": "Wed, 15 Mar 2023 10:17:04 GMT",
6
+ "tag": "@fluentui/tokens_v1.0.0-alpha.3",
7
+ "version": "1.0.0-alpha.3",
8
+ "comments": {
9
+ "prerelease": [
10
+ {
11
+ "author": "miroslav.stastny@microsoft.com",
12
+ "package": "@fluentui/tokens",
13
+ "commit": "76e6598eae0c9247fb7f8834c1e24d8e864bf5df",
14
+ "comment": "feat(tokens): Add colorNeutralBackgroundAlpha and colorNeutralStrokeAlpha tokens"
15
+ }
16
+ ]
17
+ }
18
+ },
19
+ {
20
+ "date": "Wed, 08 Mar 2023 17:42:50 GMT",
21
+ "tag": "@fluentui/tokens_v1.0.0-alpha.2",
22
+ "version": "1.0.0-alpha.2",
23
+ "comments": {
24
+ "none": [
25
+ {
26
+ "author": "martinhochel@microsoft.com",
27
+ "package": "@fluentui/tokens",
28
+ "commit": "677a67b551966986db34a6fac608cb89ee150471",
29
+ "comment": "style: apply prettier 2.3-2.8 formatting on whole codebase"
30
+ }
31
+ ]
32
+ }
33
+ },
34
+ {
35
+ "date": "Mon, 16 Jan 2023 08:38:52 GMT",
36
+ "tag": "@fluentui/tokens_v1.0.0-alpha.2",
37
+ "version": "1.0.0-alpha.2",
38
+ "comments": {
39
+ "none": [
40
+ {
41
+ "author": "martinhochel@microsoft.com",
42
+ "package": "@fluentui/tokens",
43
+ "commit": "64bb45980d68de1219c6b36a7db5363f0a9cff9f",
44
+ "comment": "chore: migrate to packaged scripts"
45
+ }
46
+ ]
47
+ }
48
+ },
49
+ {
50
+ "date": "Wed, 04 Jan 2023 01:40:44 GMT",
51
+ "tag": "@fluentui/tokens_v1.0.0-alpha.2",
52
+ "version": "1.0.0-alpha.2",
53
+ "comments": {
54
+ "none": [
55
+ {
56
+ "author": "martinhochel@microsoft.com",
57
+ "package": "@fluentui/tokens",
58
+ "commit": "194b0cf0cc27c1c1233aa945f09b3ad29778d8ca",
59
+ "comment": "chore(scripts): use for @fluentui/scripts version within all package.json"
60
+ },
61
+ {
62
+ "author": "martinhochel@microsoft.com",
63
+ "package": "@fluentui/tokens",
64
+ "commit": "4ec2b998b294d6d9c3196d3d82893bdd97d0c105",
65
+ "comment": "chore(scripts): move index.ts to to follow sub-folder domain packaging"
66
+ },
67
+ {
68
+ "author": "martinhochel@microsoft.com",
69
+ "package": "@fluentui/tokens",
70
+ "commit": "f02e92f95e93a6417e64246f2057a1006b64ca90",
71
+ "comment": "chore(scripts): introduce ts-node sub-package"
72
+ }
73
+ ]
74
+ }
75
+ },
76
+ {
77
+ "date": "Wed, 21 Dec 2022 10:20:33 GMT",
78
+ "tag": "@fluentui/tokens_v1.0.0-alpha.2",
79
+ "version": "1.0.0-alpha.2",
80
+ "comments": {
81
+ "prerelease": [
82
+ {
83
+ "author": "miroslav.stastny@microsoft.com",
84
+ "package": "@fluentui/tokens",
85
+ "commit": "97c1c1ab218afb20e37bfc35936fd88177d439b4",
86
+ "comment": "Hoist theme tokens from react-theme to tokens package"
87
+ }
88
+ ]
89
+ }
90
+ },
91
+ {
92
+ "date": "Tue, 20 Dec 2022 07:53:34 GMT",
6
93
  "tag": "@fluentui/tokens_v1.0.0-alpha.1",
7
94
  "version": "1.0.0-alpha.1",
8
95
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,30 @@
1
1
  # Change Log - @fluentui/tokens
2
2
 
3
- This log was last generated on Tue, 20 Dec 2022 07:51:41 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 15 Mar 2023 10:17:04 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [1.0.0-alpha.3](https://github.com/microsoft/fluentui/tree/@fluentui/tokens_v1.0.0-alpha.3)
8
+
9
+ Wed, 15 Mar 2023 10:17:04 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/tokens_v1.0.0-alpha.2..@fluentui/tokens_v1.0.0-alpha.3)
11
+
12
+ ### Changes
13
+
14
+ - feat(tokens): Add colorNeutralBackgroundAlpha and colorNeutralStrokeAlpha tokens ([PR #27034](https://github.com/microsoft/fluentui/pull/27034) by miroslav.stastny@microsoft.com)
15
+
16
+ ## [1.0.0-alpha.2](https://github.com/microsoft/fluentui/tree/@fluentui/tokens_v1.0.0-alpha.2)
17
+
18
+ Wed, 21 Dec 2022 10:20:33 GMT
19
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/tokens_v1.0.0-alpha.1..@fluentui/tokens_v1.0.0-alpha.2)
20
+
21
+ ### Changes
22
+
23
+ - Hoist theme tokens from react-theme to tokens package ([PR #25966](https://github.com/microsoft/fluentui/pull/25966) by miroslav.stastny@microsoft.com)
24
+
7
25
  ## [1.0.0-alpha.1](https://github.com/microsoft/fluentui/tree/@fluentui/tokens_v1.0.0-alpha.1)
8
26
 
9
- Tue, 20 Dec 2022 07:51:41 GMT
27
+ Tue, 20 Dec 2022 07:53:34 GMT
10
28
 
11
29
  ### Changes
12
30
 
package/dist/index.d.ts CHANGED
@@ -1 +1,443 @@
1
+ export declare type BorderRadiusTokens = {
2
+ borderRadiusNone: string;
3
+ borderRadiusSmall: string;
4
+ borderRadiusMedium: string;
5
+ borderRadiusLarge: string;
6
+ borderRadiusXLarge: string;
7
+ borderRadiusCircular: string;
8
+ };
9
+
10
+ export declare type Brands = 10 | 20 | 30 | 40 | 50 | 60 | 70 | 80 | 90 | 100 | 110 | 120 | 130 | 140 | 150 | 160;
11
+
12
+ export declare type BrandVariants = Record<Brands, string>;
13
+
14
+ export declare type ColorPaletteAnchor = 'colorPaletteAnchorBackground2' | 'colorPaletteAnchorForeground2' | 'colorPaletteAnchorBorderActive';
15
+
16
+ export declare type ColorPaletteBeige = 'colorPaletteBeigeBackground2' | 'colorPaletteBeigeForeground2' | 'colorPaletteBeigeBorderActive';
17
+
18
+ export declare type ColorPaletteBerry = 'colorPaletteBerryBackground1' | 'colorPaletteBerryBackground2' | 'colorPaletteBerryBackground3' | 'colorPaletteBerryForeground1' | 'colorPaletteBerryForeground2' | 'colorPaletteBerryForeground3' | 'colorPaletteBerryBorderActive' | 'colorPaletteBerryBorder1' | 'colorPaletteBerryBorder2';
19
+
20
+ export declare type ColorPaletteBlue = 'colorPaletteBlueBackground2' | 'colorPaletteBlueForeground2' | 'colorPaletteBlueBorderActive';
21
+
22
+ export declare type ColorPaletteBrass = 'colorPaletteBrassBackground2' | 'colorPaletteBrassForeground2' | 'colorPaletteBrassBorderActive';
23
+
24
+ export declare type ColorPaletteBrown = 'colorPaletteBrownBackground2' | 'colorPaletteBrownForeground2' | 'colorPaletteBrownBorderActive';
25
+
26
+ export declare type ColorPaletteCornflower = 'colorPaletteCornflowerBackground2' | 'colorPaletteCornflowerForeground2' | 'colorPaletteCornflowerBorderActive';
27
+
28
+ export declare type ColorPaletteCranberry = 'colorPaletteCranberryBackground2' | 'colorPaletteCranberryForeground2' | 'colorPaletteCranberryBorderActive';
29
+
30
+ export declare type ColorPaletteDarkGreen = 'colorPaletteDarkGreenBackground2' | 'colorPaletteDarkGreenForeground2' | 'colorPaletteDarkGreenBorderActive';
31
+
32
+ export declare type ColorPaletteDarkOrange = 'colorPaletteDarkOrangeBackground1' | 'colorPaletteDarkOrangeBackground2' | 'colorPaletteDarkOrangeBackground3' | 'colorPaletteDarkOrangeForeground1' | 'colorPaletteDarkOrangeForeground2' | 'colorPaletteDarkOrangeForeground3' | 'colorPaletteDarkOrangeBorderActive' | 'colorPaletteDarkOrangeBorder1' | 'colorPaletteDarkOrangeBorder2';
33
+
34
+ export declare type ColorPaletteDarkRed = 'colorPaletteDarkRedBackground2' | 'colorPaletteDarkRedForeground2' | 'colorPaletteDarkRedBorderActive';
35
+
36
+ export declare type ColorPaletteForest = 'colorPaletteForestBackground2' | 'colorPaletteForestForeground2' | 'colorPaletteForestBorderActive';
37
+
38
+ export declare type ColorPaletteGold = 'colorPaletteGoldBackground2' | 'colorPaletteGoldForeground2' | 'colorPaletteGoldBorderActive';
39
+
40
+ export declare type ColorPaletteGrape = 'colorPaletteGrapeBackground2' | 'colorPaletteGrapeForeground2' | 'colorPaletteGrapeBorderActive';
41
+
42
+ export declare type ColorPaletteGreen = 'colorPaletteGreenBackground1' | 'colorPaletteGreenBackground2' | 'colorPaletteGreenBackground3' | 'colorPaletteGreenForeground1' | 'colorPaletteGreenForeground2' | 'colorPaletteGreenForeground3' | 'colorPaletteGreenForegroundInverted' | 'colorPaletteGreenBorderActive' | 'colorPaletteGreenBorder1' | 'colorPaletteGreenBorder2';
43
+
44
+ export declare type ColorPaletteLavender = 'colorPaletteLavenderBackground2' | 'colorPaletteLavenderForeground2' | 'colorPaletteLavenderBorderActive';
45
+
46
+ export declare type ColorPaletteLightGreen = 'colorPaletteLightGreenBackground1' | 'colorPaletteLightGreenBackground2' | 'colorPaletteLightGreenBackground3' | 'colorPaletteLightGreenForeground1' | 'colorPaletteLightGreenForeground2' | 'colorPaletteLightGreenForeground3' | 'colorPaletteLightGreenBorderActive' | 'colorPaletteLightGreenBorder1' | 'colorPaletteLightGreenBorder2';
47
+
48
+ export declare type ColorPaletteLightTeal = 'colorPaletteLightTealBackground2' | 'colorPaletteLightTealForeground2' | 'colorPaletteLightTealBorderActive';
49
+
50
+ export declare type ColorPaletteLilac = 'colorPaletteLilacBackground2' | 'colorPaletteLilacForeground2' | 'colorPaletteLilacBorderActive';
51
+
52
+ export declare type ColorPaletteMagenta = 'colorPaletteMagentaBackground2' | 'colorPaletteMagentaForeground2' | 'colorPaletteMagentaBorderActive';
53
+
54
+ export declare type ColorPaletteMarigold = 'colorPaletteMarigoldBackground1' | 'colorPaletteMarigoldBackground2' | 'colorPaletteMarigoldBackground3' | 'colorPaletteMarigoldForeground1' | 'colorPaletteMarigoldForeground2' | 'colorPaletteMarigoldForeground3' | 'colorPaletteMarigoldBorderActive' | 'colorPaletteMarigoldBorder1' | 'colorPaletteMarigoldBorder2';
55
+
56
+ export declare type ColorPaletteMink = 'colorPaletteMinkBackground2' | 'colorPaletteMinkForeground2' | 'colorPaletteMinkBorderActive';
57
+
58
+ export declare type ColorPaletteNavy = 'colorPaletteNavyBackground2' | 'colorPaletteNavyForeground2' | 'colorPaletteNavyBorderActive';
59
+
60
+ export declare type ColorPalettePeach = 'colorPalettePeachBackground2' | 'colorPalettePeachForeground2' | 'colorPalettePeachBorderActive';
61
+
62
+ export declare type ColorPalettePink = 'colorPalettePinkBackground2' | 'colorPalettePinkForeground2' | 'colorPalettePinkBorderActive';
63
+
64
+ export declare type ColorPalettePlatinum = 'colorPalettePlatinumBackground2' | 'colorPalettePlatinumForeground2' | 'colorPalettePlatinumBorderActive';
65
+
66
+ export declare type ColorPalettePlum = 'colorPalettePlumBackground2' | 'colorPalettePlumForeground2' | 'colorPalettePlumBorderActive';
67
+
68
+ export declare type ColorPalettePumpkin = 'colorPalettePumpkinBackground2' | 'colorPalettePumpkinForeground2' | 'colorPalettePumpkinBorderActive';
69
+
70
+ export declare type ColorPalettePurple = 'colorPalettePurpleBackground2' | 'colorPalettePurpleForeground2' | 'colorPalettePurpleBorderActive';
71
+
72
+ export declare type ColorPaletteRed = 'colorPaletteRedBackground1' | 'colorPaletteRedBackground2' | 'colorPaletteRedBackground3' | 'colorPaletteRedForeground1' | 'colorPaletteRedForeground2' | 'colorPaletteRedForeground3' | 'colorPaletteRedForegroundInverted' | 'colorPaletteRedBorderActive' | 'colorPaletteRedBorder1' | 'colorPaletteRedBorder2';
73
+
74
+ export declare type ColorPaletteRoyalBlue = 'colorPaletteRoyalBlueBackground2' | 'colorPaletteRoyalBlueForeground2' | 'colorPaletteRoyalBlueBorderActive';
75
+
76
+ export declare type ColorPaletteSeafoam = 'colorPaletteSeafoamBackground2' | 'colorPaletteSeafoamForeground2' | 'colorPaletteSeafoamBorderActive';
77
+
78
+ export declare type ColorPaletteSteel = 'colorPaletteSteelBackground2' | 'colorPaletteSteelForeground2' | 'colorPaletteSteelBorderActive';
79
+
80
+ export declare type ColorPaletteTeal = 'colorPaletteTealBackground2' | 'colorPaletteTealForeground2' | 'colorPaletteTealBorderActive';
81
+
82
+ export declare type ColorPaletteTokens = StatusColorPaletteTokens & PersonaColorPaletteTokens;
83
+
84
+ export declare type ColorPaletteYellow = 'colorPaletteYellowBackground1' | 'colorPaletteYellowBackground2' | 'colorPaletteYellowBackground3' | 'colorPaletteYellowForeground1' | 'colorPaletteYellowForeground2' | 'colorPaletteYellowForeground3' | 'colorPaletteYellowForegroundInverted' | 'colorPaletteYellowBorderActive' | 'colorPaletteYellowBorder1' | 'colorPaletteYellowBorder2';
85
+
86
+ /**
87
+ * Design tokens for alias colors
88
+ */
89
+ export declare type ColorTokens = {
90
+ colorNeutralForeground1: string;
91
+ colorNeutralForeground1Hover: string;
92
+ colorNeutralForeground1Pressed: string;
93
+ colorNeutralForeground1Selected: string;
94
+ colorNeutralForeground2: string;
95
+ colorNeutralForeground2Hover: string;
96
+ colorNeutralForeground2Pressed: string;
97
+ colorNeutralForeground2Selected: string;
98
+ colorNeutralForeground2BrandHover: string;
99
+ colorNeutralForeground2BrandPressed: string;
100
+ colorNeutralForeground2BrandSelected: string;
101
+ colorNeutralForeground3: string;
102
+ colorNeutralForeground3Hover: string;
103
+ colorNeutralForeground3Pressed: string;
104
+ colorNeutralForeground3Selected: string;
105
+ colorNeutralForeground3BrandHover: string;
106
+ colorNeutralForeground3BrandPressed: string;
107
+ colorNeutralForeground3BrandSelected: string;
108
+ colorNeutralForeground4: string;
109
+ colorNeutralForegroundDisabled: string;
110
+ colorNeutralForegroundInvertedDisabled: string;
111
+ colorBrandForegroundLink: string;
112
+ colorBrandForegroundLinkHover: string;
113
+ colorBrandForegroundLinkPressed: string;
114
+ colorBrandForegroundLinkSelected: string;
115
+ colorNeutralForeground2Link: string;
116
+ colorNeutralForeground2LinkHover: string;
117
+ colorNeutralForeground2LinkPressed: string;
118
+ colorNeutralForeground2LinkSelected: string;
119
+ colorCompoundBrandForeground1: string;
120
+ colorCompoundBrandForeground1Hover: string;
121
+ colorCompoundBrandForeground1Pressed: string;
122
+ colorBrandForeground1: string;
123
+ colorBrandForeground2: string;
124
+ colorNeutralForeground1Static: string;
125
+ colorNeutralForegroundInverted: string;
126
+ colorNeutralForegroundInvertedHover: string;
127
+ colorNeutralForegroundInvertedPressed: string;
128
+ colorNeutralForegroundInvertedSelected: string;
129
+ colorNeutralForegroundInverted2: string;
130
+ colorNeutralForegroundOnBrand: string;
131
+ colorNeutralForegroundStaticInverted: string;
132
+ colorNeutralForegroundInvertedLink: string;
133
+ colorNeutralForegroundInvertedLinkHover: string;
134
+ colorNeutralForegroundInvertedLinkPressed: string;
135
+ colorNeutralForegroundInvertedLinkSelected: string;
136
+ colorBrandForegroundInverted: string;
137
+ colorBrandForegroundInvertedHover: string;
138
+ colorBrandForegroundInvertedPressed: string;
139
+ colorBrandForegroundOnLight: string;
140
+ colorBrandForegroundOnLightHover: string;
141
+ colorBrandForegroundOnLightPressed: string;
142
+ colorBrandForegroundOnLightSelected: string;
143
+ colorNeutralBackground1: string;
144
+ colorNeutralBackground1Hover: string;
145
+ colorNeutralBackground1Pressed: string;
146
+ colorNeutralBackground1Selected: string;
147
+ colorNeutralBackground2: string;
148
+ colorNeutralBackground2Hover: string;
149
+ colorNeutralBackground2Pressed: string;
150
+ colorNeutralBackground2Selected: string;
151
+ colorNeutralBackground3: string;
152
+ colorNeutralBackground3Hover: string;
153
+ colorNeutralBackground3Pressed: string;
154
+ colorNeutralBackground3Selected: string;
155
+ colorNeutralBackground4: string;
156
+ colorNeutralBackground4Hover: string;
157
+ colorNeutralBackground4Pressed: string;
158
+ colorNeutralBackground4Selected: string;
159
+ colorNeutralBackground5: string;
160
+ colorNeutralBackground5Hover: string;
161
+ colorNeutralBackground5Pressed: string;
162
+ colorNeutralBackground5Selected: string;
163
+ colorNeutralBackground6: string;
164
+ colorNeutralBackgroundInverted: string;
165
+ colorNeutralBackgroundStatic: string;
166
+ colorNeutralBackgroundAlpha: string;
167
+ colorNeutralBackgroundAlpha2: string;
168
+ colorSubtleBackground: string;
169
+ colorSubtleBackgroundHover: string;
170
+ colorSubtleBackgroundPressed: string;
171
+ colorSubtleBackgroundSelected: string;
172
+ colorSubtleBackgroundLightAlphaHover: string;
173
+ colorSubtleBackgroundLightAlphaPressed: string;
174
+ colorSubtleBackgroundLightAlphaSelected: string;
175
+ colorSubtleBackgroundInverted: string;
176
+ colorSubtleBackgroundInvertedHover: string;
177
+ colorSubtleBackgroundInvertedPressed: string;
178
+ colorSubtleBackgroundInvertedSelected: string;
179
+ colorTransparentBackground: string;
180
+ colorTransparentBackgroundHover: string;
181
+ colorTransparentBackgroundPressed: string;
182
+ colorTransparentBackgroundSelected: string;
183
+ colorNeutralBackgroundDisabled: string;
184
+ colorNeutralBackgroundInvertedDisabled: string;
185
+ colorNeutralStencil1: string;
186
+ colorNeutralStencil2: string;
187
+ colorNeutralStencil1Alpha: string;
188
+ colorNeutralStencil2Alpha: string;
189
+ colorBackgroundOverlay: string;
190
+ colorScrollbarOverlay: string;
191
+ colorBrandBackground: string;
192
+ colorBrandBackgroundHover: string;
193
+ colorBrandBackgroundPressed: string;
194
+ colorBrandBackgroundSelected: string;
195
+ colorCompoundBrandBackground: string;
196
+ colorCompoundBrandBackgroundHover: string;
197
+ colorCompoundBrandBackgroundPressed: string;
198
+ colorBrandBackgroundStatic: string;
199
+ colorBrandBackground2: string;
200
+ colorBrandBackgroundInverted: string;
201
+ colorBrandBackgroundInvertedHover: string;
202
+ colorBrandBackgroundInvertedPressed: string;
203
+ colorBrandBackgroundInvertedSelected: string;
204
+ colorNeutralStrokeAccessible: string;
205
+ colorNeutralStrokeAccessibleHover: string;
206
+ colorNeutralStrokeAccessiblePressed: string;
207
+ colorNeutralStrokeAccessibleSelected: string;
208
+ colorNeutralStroke1: string;
209
+ colorNeutralStroke1Hover: string;
210
+ colorNeutralStroke1Pressed: string;
211
+ colorNeutralStroke1Selected: string;
212
+ colorNeutralStroke2: string;
213
+ colorNeutralStroke3: string;
214
+ colorNeutralStrokeOnBrand: string;
215
+ colorNeutralStrokeOnBrand2: string;
216
+ colorNeutralStrokeOnBrand2Hover: string;
217
+ colorNeutralStrokeOnBrand2Pressed: string;
218
+ colorNeutralStrokeOnBrand2Selected: string;
219
+ colorBrandStroke1: string;
220
+ colorBrandStroke2: string;
221
+ colorCompoundBrandStroke: string;
222
+ colorCompoundBrandStrokeHover: string;
223
+ colorCompoundBrandStrokePressed: string;
224
+ colorNeutralStrokeDisabled: string;
225
+ colorNeutralStrokeInvertedDisabled: string;
226
+ colorTransparentStroke: string;
227
+ colorTransparentStrokeInteractive: string;
228
+ colorTransparentStrokeDisabled: string;
229
+ colorNeutralStrokeAlpha: string;
230
+ colorStrokeFocus1: string;
231
+ colorStrokeFocus2: string;
232
+ colorNeutralShadowAmbient: string;
233
+ colorNeutralShadowKey: string;
234
+ colorNeutralShadowAmbientLighter: string;
235
+ colorNeutralShadowKeyLighter: string;
236
+ colorNeutralShadowAmbientDarker: string;
237
+ colorNeutralShadowKeyDarker: string;
238
+ colorBrandShadowAmbient: string;
239
+ colorBrandShadowKey: string;
240
+ };
241
+
242
+ export declare const createDarkTheme: (brand: BrandVariants) => Theme;
243
+
244
+ export declare const createHighContrastTheme: () => Theme;
245
+
246
+ export declare const createLightTheme: (brand: BrandVariants) => Theme;
247
+
248
+ export declare const createTeamsDarkTheme: (brand: BrandVariants) => Theme;
249
+
250
+ export declare type CurveTokens = {
251
+ curveAccelerateMax: string;
252
+ curveAccelerateMid: string;
253
+ curveAccelerateMin: string;
254
+ curveDecelerateMax: string;
255
+ curveDecelerateMid: string;
256
+ curveDecelerateMin: string;
257
+ curveEasyEaseMax: string;
258
+ curveEasyEase: string;
259
+ curveLinear: string;
260
+ };
261
+
262
+ export declare type DurationTokens = {
263
+ durationUltraFast: string;
264
+ durationFaster: string;
265
+ durationFast: string;
266
+ durationNormal: string;
267
+ durationSlow: string;
268
+ durationSlower: string;
269
+ durationUltraSlow: string;
270
+ };
271
+
272
+ export declare type FontFamilyTokens = {
273
+ fontFamilyBase: string;
274
+ fontFamilyMonospace: string;
275
+ fontFamilyNumeric: string;
276
+ };
277
+
278
+ export declare type FontSizeTokens = {
279
+ fontSizeBase100: string;
280
+ fontSizeBase200: string;
281
+ fontSizeBase300: string;
282
+ fontSizeBase400: string;
283
+ fontSizeBase500: string;
284
+ fontSizeBase600: string;
285
+ fontSizeHero700: string;
286
+ fontSizeHero800: string;
287
+ fontSizeHero900: string;
288
+ fontSizeHero1000: string;
289
+ };
290
+
291
+ export declare type FontWeightTokens = {
292
+ fontWeightRegular: number;
293
+ fontWeightMedium: number;
294
+ fontWeightSemibold: number;
295
+ fontWeightBold: number;
296
+ };
297
+
298
+ export declare type HorizontalSpacingTokens = {
299
+ spacingHorizontalNone: string;
300
+ spacingHorizontalXXS: string;
301
+ spacingHorizontalXS: string;
302
+ spacingHorizontalSNudge: string;
303
+ spacingHorizontalS: string;
304
+ spacingHorizontalMNudge: string;
305
+ spacingHorizontalM: string;
306
+ spacingHorizontalL: string;
307
+ spacingHorizontalXL: string;
308
+ spacingHorizontalXXL: string;
309
+ spacingHorizontalXXXL: string;
310
+ };
311
+
312
+ export declare type LineHeightTokens = {
313
+ lineHeightBase100: string;
314
+ lineHeightBase200: string;
315
+ lineHeightBase300: string;
316
+ lineHeightBase400: string;
317
+ lineHeightBase500: string;
318
+ lineHeightBase600: string;
319
+ lineHeightHero700: string;
320
+ lineHeightHero800: string;
321
+ lineHeightHero900: string;
322
+ lineHeightHero1000: string;
323
+ };
324
+
325
+ export declare type PartialTheme = Partial<Theme>;
326
+
327
+ declare type PersonaColorPaletteTokens = Record<ColorPaletteDarkRed | ColorPaletteCranberry | ColorPalettePumpkin | ColorPalettePeach | ColorPaletteGold | ColorPaletteBrass | ColorPaletteBrown | ColorPaletteForest | ColorPaletteSeafoam | ColorPaletteDarkGreen | ColorPaletteLightTeal | ColorPaletteTeal | ColorPaletteSteel | ColorPaletteBlue | ColorPaletteRoyalBlue | ColorPaletteCornflower | ColorPaletteNavy | ColorPaletteLavender | ColorPalettePurple | ColorPaletteGrape | ColorPaletteLilac | ColorPalettePink | ColorPaletteMagenta | ColorPalettePlum | ColorPaletteBeige | ColorPaletteMink | ColorPalettePlatinum | ColorPaletteAnchor, string>;
328
+
329
+ export declare type ShadowBrandTokens = {
330
+ shadow2Brand: string;
331
+ shadow4Brand: string;
332
+ shadow8Brand: string;
333
+ shadow16Brand: string;
334
+ shadow28Brand: string;
335
+ shadow64Brand: string;
336
+ };
337
+
338
+ /**
339
+ * Design tokens for shadow levels
340
+ */
341
+ export declare type ShadowTokens = {
342
+ shadow2: string;
343
+ shadow4: string;
344
+ shadow8: string;
345
+ shadow16: string;
346
+ shadow28: string;
347
+ shadow64: string;
348
+ };
349
+
350
+ export declare type SpacingTokens = {
351
+ none: string;
352
+ xxs: string;
353
+ xs: string;
354
+ sNudge: string;
355
+ s: string;
356
+ mNudge: string;
357
+ m: string;
358
+ l: string;
359
+ xl: string;
360
+ xxl: string;
361
+ xxxl: string;
362
+ };
363
+
364
+ declare type StatusColorPaletteTokens = Record<ColorPaletteRed | ColorPaletteGreen | ColorPaletteDarkOrange | ColorPaletteYellow | ColorPaletteBerry | ColorPaletteMarigold | ColorPaletteLightGreen, string>;
365
+
366
+ export declare type StrokeWidthTokens = {
367
+ strokeWidthThin: string;
368
+ strokeWidthThick: string;
369
+ strokeWidthThicker: string;
370
+ strokeWidthThickest: string;
371
+ };
372
+
373
+ export declare const teamsDarkTheme: Theme;
374
+
375
+ export declare const teamsHighContrastTheme: Theme;
376
+
377
+ export declare const teamsLightTheme: Theme;
378
+
379
+ export declare type Theme = FontSizeTokens & LineHeightTokens & BorderRadiusTokens & StrokeWidthTokens & HorizontalSpacingTokens & VerticalSpacingTokens & DurationTokens & CurveTokens & ShadowTokens & ShadowBrandTokens & FontFamilyTokens & FontWeightTokens & ColorPaletteTokens & ColorTokens;
380
+
381
+ /**
382
+ * Programmatically generates a tokens to css variables mapping object from the keys in a theme.
383
+ * This helps with ease of use as a user of a custom theme does not have to manually construct this object, but it could
384
+ * affect tree-shaking since bundlers do not know the shape of the output.
385
+ *
386
+ * @param theme - Theme from which to get the keys to generate the tokens to css variables mapping object
387
+ * @returns Tokens to css variables mapping object corresponding to the passed theme
388
+ */
389
+ export declare function themeToTokensObject<TTheme extends Theme>(theme: TTheme): Record<keyof TTheme, string>;
390
+
391
+ export declare const tokens: Record<keyof Theme, string>;
392
+
393
+ export declare type TypographyStyle = {
394
+ fontFamily: string;
395
+ fontSize: string;
396
+ fontWeight: string;
397
+ lineHeight: string;
398
+ };
399
+
400
+ export declare type TypographyStyles = {
401
+ body1: TypographyStyle;
402
+ body1Strong: TypographyStyle;
403
+ body1Stronger: TypographyStyle;
404
+ body2: TypographyStyle;
405
+ caption1: TypographyStyle;
406
+ caption1Strong: TypographyStyle;
407
+ caption1Stronger: TypographyStyle;
408
+ caption2: TypographyStyle;
409
+ caption2Strong: TypographyStyle;
410
+ subtitle1: TypographyStyle;
411
+ subtitle2: TypographyStyle;
412
+ subtitle2Stronger: TypographyStyle;
413
+ title1: TypographyStyle;
414
+ title2: TypographyStyle;
415
+ title3: TypographyStyle;
416
+ largeTitle: TypographyStyle;
417
+ display: TypographyStyle;
418
+ };
419
+
420
+ /**
421
+ * Global typography styles (fontSize, fontWeight, and lineHeight)
422
+ */
423
+ export declare const typographyStyles: TypographyStyles;
424
+
425
+ export declare type VerticalSpacingTokens = {
426
+ spacingVerticalNone: string;
427
+ spacingVerticalXXS: string;
428
+ spacingVerticalXS: string;
429
+ spacingVerticalSNudge: string;
430
+ spacingVerticalS: string;
431
+ spacingVerticalMNudge: string;
432
+ spacingVerticalM: string;
433
+ spacingVerticalL: string;
434
+ spacingVerticalXL: string;
435
+ spacingVerticalXXL: string;
436
+ spacingVerticalXXXL: string;
437
+ };
438
+
439
+ export declare const webDarkTheme: Theme;
440
+
441
+ export declare const webLightTheme: Theme;
442
+
1
443
  export { }