@fluentui-react-native/default-theme 0.10.1 → 0.11.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 (49) hide show
  1. package/CHANGELOG.json +112 -1
  2. package/CHANGELOG.md +37 -2
  3. package/lib/createAliasTokens.d.ts +5 -3
  4. package/lib/createAliasTokens.d.ts.map +1 -1
  5. package/lib/createAliasTokens.js +9 -4
  6. package/lib/createAliasTokens.js.map +1 -1
  7. package/lib/defaultColors.js +4 -4
  8. package/lib/defaultColors.js.map +1 -1
  9. package/lib/defaultTheme.d.ts.map +1 -1
  10. package/lib/defaultTheme.js +4 -0
  11. package/lib/defaultTheme.js.map +1 -1
  12. package/lib/getTokens.d.ts +302 -0
  13. package/lib/getTokens.d.ts.map +1 -0
  14. package/lib/getTokens.js +38 -0
  15. package/lib/getTokens.js.map +1 -0
  16. package/lib/index.d.ts +1 -1
  17. package/lib/index.d.ts.map +1 -1
  18. package/lib/index.js +1 -1
  19. package/lib/index.js.map +1 -1
  20. package/lib-commonjs/createAliasTokens.d.ts +5 -3
  21. package/lib-commonjs/createAliasTokens.d.ts.map +1 -1
  22. package/lib-commonjs/createAliasTokens.js +10 -5
  23. package/lib-commonjs/createAliasTokens.js.map +1 -1
  24. package/lib-commonjs/defaultColors.js +3 -3
  25. package/lib-commonjs/defaultColors.js.map +1 -1
  26. package/lib-commonjs/defaultTheme.d.ts.map +1 -1
  27. package/lib-commonjs/defaultTheme.js +4 -0
  28. package/lib-commonjs/defaultTheme.js.map +1 -1
  29. package/lib-commonjs/getTokens.d.ts +302 -0
  30. package/lib-commonjs/getTokens.d.ts.map +1 -0
  31. package/lib-commonjs/{getAliasTokens.js → getTokens.js} +21 -2
  32. package/lib-commonjs/getTokens.js.map +1 -0
  33. package/lib-commonjs/index.d.ts +1 -1
  34. package/lib-commonjs/index.d.ts.map +1 -1
  35. package/lib-commonjs/index.js +1 -1
  36. package/lib-commonjs/index.js.map +1 -1
  37. package/package.json +7 -7
  38. package/src/createAliasTokens.ts +12 -5
  39. package/src/defaultColors.ts +4 -4
  40. package/src/defaultTheme.ts +4 -0
  41. package/src/{getAliasTokens.ts → getTokens.ts} +17 -0
  42. package/src/index.ts +1 -1
  43. package/lib/getAliasTokens.d.ts +0 -3
  44. package/lib/getAliasTokens.d.ts.map +0 -1
  45. package/lib/getAliasTokens.js +0 -20
  46. package/lib/getAliasTokens.js.map +0 -1
  47. package/lib-commonjs/getAliasTokens.d.ts +0 -3
  48. package/lib-commonjs/getAliasTokens.d.ts.map +0 -1
  49. package/lib-commonjs/getAliasTokens.js.map +0 -1
@@ -0,0 +1,302 @@
1
+ import { AppearanceOptions } from '@fluentui-react-native/theme-types';
2
+ export declare function getAliasTokens(mode: AppearanceOptions): any;
3
+ export declare function getShadowTokens(mode: AppearanceOptions): {
4
+ brandBackground: {
5
+ fillColorRest: string;
6
+ fillColorHover: string;
7
+ fillColorPressed: string;
8
+ fillColorSelected: string;
9
+ };
10
+ brandBackground2: {
11
+ fillColorRest: string;
12
+ };
13
+ brandBackgroundStatic: {
14
+ fillColorRest: string;
15
+ };
16
+ brandForeground1: {
17
+ fillColorRest: string;
18
+ };
19
+ brandForeground2: {
20
+ fillColorRest: string;
21
+ };
22
+ brandForegroundLink: {
23
+ fillColorRest: string;
24
+ fillColorHover: string;
25
+ fillColorPressed: string;
26
+ fillColorSelected: string;
27
+ };
28
+ brandStroke1: {
29
+ strokeColorRest: string;
30
+ strokeWidth: number;
31
+ };
32
+ brandStroke2: {
33
+ strokeColorRest: string;
34
+ strokeWidth: number;
35
+ };
36
+ compoundBrandBackground1: {
37
+ fillColorRest: string;
38
+ fillColorHover: string;
39
+ fillColorPressed: string;
40
+ };
41
+ compoundBrandForeground1: {
42
+ fillColorRest: string;
43
+ fillColorHover: string;
44
+ fillColorPressed: string;
45
+ };
46
+ compoundBrandStroke1: {
47
+ strokeColorRest: string;
48
+ strokeColorHover: string;
49
+ strokeColorPressed: string;
50
+ strokeWidth: number;
51
+ };
52
+ neutralBackground1: {
53
+ fillColorRest: string;
54
+ fillColorHover: string;
55
+ fillColorPressed: string;
56
+ fillColorSelected: string;
57
+ };
58
+ neutralBackground2: {
59
+ fillColorRest: string;
60
+ fillColorHover: string;
61
+ fillColorPressed: string;
62
+ fillColorSelected: string;
63
+ };
64
+ neutralBackground3: {
65
+ fillColorRest: string;
66
+ fillColorHover: string;
67
+ fillColorPressed: string;
68
+ fillColorSelected: string;
69
+ };
70
+ neutralBackground4: {
71
+ fillColorRest: string;
72
+ fillColorHover: string;
73
+ fillColorPressed: string;
74
+ fillColorSelected: string;
75
+ };
76
+ neutralBackground5: {
77
+ fillColorRest: string;
78
+ fillColorHover: string;
79
+ fillColorPressed: string;
80
+ fillColorSelected: string;
81
+ };
82
+ neutralBackground6: {
83
+ fillColorRest: string;
84
+ };
85
+ neutralBackgroundDisabled: {
86
+ fillColorRest: string;
87
+ };
88
+ neutralBackgroundInverted: {
89
+ fillColorRest: string;
90
+ };
91
+ neutralForeground1: {
92
+ fillColorRest: string;
93
+ fillColorHover: string;
94
+ fillColorPressed: string;
95
+ fillColorSelected: string;
96
+ };
97
+ neutralForeground2: {
98
+ fillColorRest: string;
99
+ fillColorHover: string;
100
+ fillColorPressed: string;
101
+ fillColorBrandHover: string;
102
+ fillColorBrandPressed: string;
103
+ fillColorBrandSelected: string;
104
+ fillColorSelected: string;
105
+ };
106
+ neutralForeground3: {
107
+ fillColorRest: string;
108
+ fillColorHover: string;
109
+ fillColorPressed: string;
110
+ fillColorBrandHover: string;
111
+ fillColorBrandPressed: string;
112
+ fillColorBrandSelected: string;
113
+ fillColorSelected: string;
114
+ };
115
+ neutralForeground4: {
116
+ fillColorRest: string;
117
+ };
118
+ neutralForegroundDisabled: {
119
+ fillColorRest: string;
120
+ };
121
+ neutralForegroundInverted: {
122
+ fillColorRest: string;
123
+ };
124
+ neutralForegroundInvertedLink: {
125
+ fillColorRest: string;
126
+ fillColorHover: string;
127
+ fillColorPressed: string;
128
+ fillColorSelected: string;
129
+ };
130
+ neutralForegroundOnBrand: {
131
+ fillColorRest: string;
132
+ fillColorHover: string;
133
+ fillColorPressed: string;
134
+ fillColorSelected: string;
135
+ };
136
+ neutralStencil1: {
137
+ fillColorRest: string;
138
+ };
139
+ neutralStencil2: {
140
+ fillColorRest: string;
141
+ };
142
+ neutralStroke1: {
143
+ strokeColorRest: string;
144
+ strokeColorHover: string;
145
+ strokeColorPressed: string;
146
+ strokeColorSelected: string;
147
+ strokeWidth: number;
148
+ };
149
+ neutralStroke2: {
150
+ strokeColorRest: string;
151
+ strokeWidth: number;
152
+ };
153
+ neutralStroke3: {
154
+ strokeColorRest: string;
155
+ strokeWidth: number;
156
+ };
157
+ neutralStrokeAccessible: {
158
+ strokeColorRest: string;
159
+ strokeColorHover: string;
160
+ strokeColorPressed: string;
161
+ strokeColorSelected: string;
162
+ strokeWidth: number;
163
+ };
164
+ neutralStrokeDisabled: {
165
+ strokeColorRest: string;
166
+ strokeWidth: number;
167
+ };
168
+ redBackground1: {
169
+ fillColorRest: string;
170
+ };
171
+ redBackground2: {
172
+ fillColorRest: string;
173
+ };
174
+ redBackground3: {
175
+ fillColorRest: string;
176
+ };
177
+ redBorder1: {
178
+ strokeColorRest: string;
179
+ strokeWidth: number;
180
+ };
181
+ redBorder2: {
182
+ strokeColorRest: string;
183
+ strokeWidth: number;
184
+ };
185
+ redBorderActive: {
186
+ strokeColorRest: string;
187
+ strokeWidth: number;
188
+ };
189
+ redForeground1: {
190
+ fillColorRest: string;
191
+ };
192
+ redForeground2: {
193
+ fillColorRest: string;
194
+ };
195
+ redForeground3: {
196
+ fillColorRest: string;
197
+ };
198
+ strokeFocus1: {
199
+ strokeColorRest: string;
200
+ strokeWidth: number;
201
+ };
202
+ strokeFocus2: {
203
+ strokeColorRest: string;
204
+ strokeWidth: number;
205
+ };
206
+ subtleBackground: {
207
+ fillColorRest: string;
208
+ fillColorHover: string;
209
+ fillColorPressed: string;
210
+ fillColorSelected: string;
211
+ };
212
+ transparentBackground: {
213
+ fillColorRest: string;
214
+ fillColorHover: string;
215
+ fillColorPressed: string;
216
+ fillColorSelected: string;
217
+ };
218
+ transparentStroke: {
219
+ strokeAlignment: string;
220
+ strokeColorRest: string;
221
+ strokeColorHover: string;
222
+ strokeColorPressed: string;
223
+ strokeColorDisabled: string;
224
+ strokeWidth: number;
225
+ };
226
+ } | {
227
+ "2": {
228
+ x: number;
229
+ y: number;
230
+ blur: number;
231
+ color: string;
232
+ }[];
233
+ "4": {
234
+ x: number;
235
+ y: number;
236
+ blur: number;
237
+ color: string;
238
+ }[];
239
+ "8": {
240
+ x: number;
241
+ y: number;
242
+ blur: number;
243
+ color: string;
244
+ }[];
245
+ "16": {
246
+ x: number;
247
+ y: number;
248
+ blur: number;
249
+ color: string;
250
+ }[];
251
+ "28": {
252
+ x: number;
253
+ y: number;
254
+ blur: number;
255
+ color: string;
256
+ }[];
257
+ "64": {
258
+ x: number;
259
+ y: number;
260
+ blur: number;
261
+ color: string;
262
+ }[];
263
+ brand: {
264
+ "2": {
265
+ x: number;
266
+ y: number;
267
+ blur: number;
268
+ color: string;
269
+ }[];
270
+ "4": {
271
+ x: number;
272
+ y: number;
273
+ blur: number;
274
+ color: string;
275
+ }[];
276
+ "8": {
277
+ x: number;
278
+ y: number;
279
+ blur: number;
280
+ color: string;
281
+ }[];
282
+ "16": {
283
+ x: number;
284
+ y: number;
285
+ blur: number;
286
+ color: string;
287
+ }[];
288
+ "28": {
289
+ x: number;
290
+ y: number;
291
+ blur: number;
292
+ color: string;
293
+ }[];
294
+ "64": {
295
+ x: number;
296
+ y: number;
297
+ blur: number;
298
+ color: string;
299
+ }[];
300
+ };
301
+ };
302
+ //# sourceMappingURL=getTokens.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getTokens.d.ts","sourceRoot":"","sources":["../src/getTokens.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAGvE,wBAAgB,cAAc,CAAC,IAAI,EAAE,iBAAiB,OAYrD;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYtD"}
@@ -3,10 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.getAliasTokens = void 0;
6
+ exports.getShadowTokens = exports.getAliasTokens = void 0;
7
7
  var tokens_aliases_json_1 = __importDefault(require("@fluentui-react-native/design-tokens-windows/light/tokens-aliases.json"));
8
8
  var tokens_aliases_json_2 = __importDefault(require("@fluentui-react-native/design-tokens-windows/dark/tokens-aliases.json"));
9
9
  var tokens_alias_1 = require("./highContrast/tokens-alias");
10
+ var tokens_shadow_json_1 = __importDefault(require("@fluentui-react-native/design-tokens-windows/light/tokens-shadow.json"));
11
+ var tokens_shadow_json_2 = __importDefault(require("@fluentui-react-native/design-tokens-windows/dark/tokens-shadow.json"));
12
+ var tokens_shadow_json_3 = __importDefault(require("@fluentui-react-native/design-tokens-win32/hc/tokens-shadow.json"));
10
13
  var assert_never_1 = require("assert-never");
11
14
  function getAliasTokens(mode) {
12
15
  if (mode === 'light') {
@@ -24,4 +27,20 @@ function getAliasTokens(mode) {
24
27
  return tokens_aliases_json_1.default;
25
28
  }
26
29
  exports.getAliasTokens = getAliasTokens;
27
- //# sourceMappingURL=getAliasTokens.js.map
30
+ function getShadowTokens(mode) {
31
+ if (mode === 'light') {
32
+ return tokens_shadow_json_1.default.shadow;
33
+ }
34
+ else if (mode === 'dark') {
35
+ return tokens_shadow_json_2.default.shadow;
36
+ }
37
+ else if (mode === 'highContrast') {
38
+ return tokens_shadow_json_3.default.shadow;
39
+ }
40
+ else {
41
+ (0, assert_never_1.assertNever)(mode);
42
+ }
43
+ return tokens_aliases_json_1.default;
44
+ }
45
+ exports.getShadowTokens = getShadowTokens;
46
+ //# sourceMappingURL=getTokens.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getTokens.js","sourceRoot":"","sources":["../src/getTokens.ts"],"names":[],"mappings":";;;;;;AAAA,+HAAsG;AACtG,8HAAoG;AACpG,4DAA4D;AAC5D,6HAAsG;AACtG,4HAAoG;AACpG,wHAA8F;AAE9F,6CAA2C;AAE3C,SAAgB,cAAc,CAAC,IAAuB;IACpD,IAAI,IAAI,KAAK,OAAO,EAAE;QACpB,OAAO,6BAAgB,CAAC;KACzB;SAAM,IAAI,IAAI,KAAK,MAAM,EAAE;QAC1B,OAAO,6BAAe,CAAC;KACxB;SAAM,IAAI,IAAI,KAAK,cAAc,EAAE;QAClC,OAAO,4BAAa,CAAC;KACtB;SAAM;QACL,IAAA,0BAAW,EAAC,IAAI,CAAC,CAAC;KACnB;IAED,OAAO,6BAAgB,CAAC;AAC1B,CAAC;AAZD,wCAYC;AAED,SAAgB,eAAe,CAAC,IAAuB;IACrD,IAAI,IAAI,KAAK,OAAO,EAAE;QACpB,OAAO,4BAAiB,CAAC,MAAM,CAAC;KACjC;SAAM,IAAI,IAAI,KAAK,MAAM,EAAE;QAC1B,OAAO,4BAAgB,CAAC,MAAM,CAAC;KAChC;SAAM,IAAI,IAAI,KAAK,cAAc,EAAE;QAClC,OAAO,4BAAc,CAAC,MAAM,CAAC;KAC9B;SAAM;QACL,IAAA,0BAAW,EAAC,IAAI,CAAC,CAAC;KACnB;IAED,OAAO,6BAAgB,CAAC;AAC1B,CAAC;AAZD,0CAYC"}
@@ -1,4 +1,4 @@
1
1
  export { defaultFluentTheme, defaultFluentDarkTheme } from './defaultTheme';
2
2
  export { createDefaultTheme } from './createDefaultTheme';
3
- export { createAliasTokens } from './createAliasTokens';
3
+ export { createColorAliasTokens as createAliasTokens } from './createAliasTokens';
4
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,sBAAsB,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}
@@ -7,5 +7,5 @@ Object.defineProperty(exports, "defaultFluentDarkTheme", { enumerable: true, get
7
7
  var createDefaultTheme_1 = require("./createDefaultTheme");
8
8
  Object.defineProperty(exports, "createDefaultTheme", { enumerable: true, get: function () { return createDefaultTheme_1.createDefaultTheme; } });
9
9
  var createAliasTokens_1 = require("./createAliasTokens");
10
- Object.defineProperty(exports, "createAliasTokens", { enumerable: true, get: function () { return createAliasTokens_1.createAliasTokens; } });
10
+ Object.defineProperty(exports, "createAliasTokens", { enumerable: true, get: function () { return createAliasTokens_1.createColorAliasTokens; } });
11
11
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,+CAA4E;AAAnE,kHAAA,kBAAkB,OAAA;AAAE,sHAAA,sBAAsB,OAAA;AACnD,2DAA0D;AAAjD,wHAAA,kBAAkB,OAAA;AAC3B,yDAAwD;AAA/C,sHAAA,iBAAiB,OAAA"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,+CAA4E;AAAnE,kHAAA,kBAAkB,OAAA;AAAE,sHAAA,sBAAsB,OAAA;AACnD,2DAA0D;AAAjD,wHAAA,kBAAkB,OAAA;AAC3B,yDAAkF;AAAzE,sHAAA,sBAAsB,OAAqB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui-react-native/default-theme",
3
- "version": "0.10.1",
3
+ "version": "0.11.0",
4
4
  "description": "Typing only package for fluentui-react-native theme types",
5
5
  "repository": {
6
6
  "type": "git",
@@ -27,13 +27,13 @@
27
27
  "author": "",
28
28
  "license": "MIT",
29
29
  "dependencies": {
30
- "@fluentui-react-native/design-tokens-win32": "^0.8.0",
31
- "@fluentui-react-native/design-tokens-windows": "^0.8.0",
30
+ "@fluentui-react-native/design-tokens-win32": "^0.13.0",
31
+ "@fluentui-react-native/design-tokens-windows": "^0.13.0",
32
32
  "@fluentui-react-native/memo-cache": "^1.1.7",
33
- "@fluentui-react-native/theme-tokens": "^0.16.1",
34
- "@fluentui-react-native/theme-types": ">=0.14.1 <1.0.0",
35
- "@fluentui-react-native/theme": ">=0.6.6 <1.0.0",
36
- "@fluentui-react-native/theming-utils": ">=0.10.0 <1.0.0",
33
+ "@fluentui-react-native/theme-tokens": "^0.16.3",
34
+ "@fluentui-react-native/theme-types": ">=0.15.0 <1.0.0",
35
+ "@fluentui-react-native/theme": ">=0.6.9 <1.0.0",
36
+ "@fluentui-react-native/theming-utils": ">=0.11.0 <1.0.0",
37
37
  "assert-never": "^1.2.1"
38
38
  },
39
39
  "devDependencies": {
@@ -1,11 +1,18 @@
1
- import { getAliasTokens } from './getAliasTokens';
2
- import { AliasColorTokens, AppearanceOptions } from '@fluentui-react-native/theme-types';
1
+ import { getAliasTokens, getShadowTokens } from './getTokens';
2
+ import { AliasColorTokens, AppearanceOptions, ThemeShadowDefinition } from '@fluentui-react-native/theme-types';
3
3
  import { memoize } from '@fluentui-react-native/memo-cache';
4
- import { mapPipelineToTheme } from '@fluentui-react-native/theming-utils';
4
+ import { mapPipelineToShadow, mapPipelineToTheme } from '@fluentui-react-native/theming-utils';
5
5
 
6
- function createAliasTokensWorker(mode: AppearanceOptions): AliasColorTokens {
6
+ function createColorAliasTokensWorker(mode: AppearanceOptions): AliasColorTokens {
7
7
  const aliasTokens = getAliasTokens(mode);
8
8
  return mapPipelineToTheme(aliasTokens);
9
9
  }
10
10
 
11
- export const createAliasTokens = memoize(createAliasTokensWorker);
11
+ export const createColorAliasTokens = memoize(createColorAliasTokensWorker);
12
+
13
+ function createShadowAliasTokensWorker(mode: AppearanceOptions): ThemeShadowDefinition {
14
+ const aliasTokens = getShadowTokens(mode);
15
+ return mapPipelineToShadow(aliasTokens);
16
+ }
17
+
18
+ export const createShadowAliasTokens = memoize(createShadowAliasTokensWorker);
@@ -1,6 +1,6 @@
1
1
  import { Palette, FabricWebPalette, ThemeColorDefinition } from '@fluentui-react-native/theme-types';
2
2
  import { globalTokens } from '@fluentui-react-native/theme-tokens';
3
- import { createAliasTokens } from './createAliasTokens';
3
+ import { createColorAliasTokens } from './createAliasTokens';
4
4
 
5
5
  /**
6
6
  * Generate a palette from a set of fabric web colors, like those output from the theme designer.
@@ -253,7 +253,7 @@ export function getStockWebPalette(): ThemeColorDefinition {
253
253
  accent: globalTokens.color.brand.primary,
254
254
  blackTranslucent40: 'rgba(0,0,0,.4)',
255
255
  }),
256
- ...createAliasTokens('light'),
256
+ ...createColorAliasTokens('light'),
257
257
  };
258
258
  }
259
259
 
@@ -292,7 +292,7 @@ export function getStockWebDarkPalette(): ThemeColorDefinition {
292
292
  },
293
293
  true,
294
294
  ),
295
- ...createAliasTokens('dark'),
295
+ ...createColorAliasTokens('dark'),
296
296
  };
297
297
  }
298
298
 
@@ -505,6 +505,6 @@ export function getStockWebHCPalette(): ThemeColorDefinition {
505
505
 
506
506
  personaActivityRing: '#ffffff',
507
507
  personaActivityGlow: 'transparent', // glow probably doesn't make sense on HC
508
- ...createAliasTokens('highContrast'),
508
+ ...createColorAliasTokens('highContrast'),
509
509
  };
510
510
  }
@@ -2,6 +2,7 @@ import { Theme, Typography, Spacing, FontWeightValue, FontSize, FontSizes, Varia
2
2
  import { Platform } from 'react-native';
3
3
  import { getStockWebPalette, getStockWebDarkPalette, getStockWebHCPalette } from './defaultColors';
4
4
  import { globalTokens } from '@fluentui-react-native/theme-tokens';
5
+ import { createShadowAliasTokens } from './createAliasTokens';
5
6
 
6
7
  function _defaultTypography(): Typography {
7
8
  const defaultsDict = {
@@ -96,6 +97,7 @@ export const defaultFluentTheme: Theme = {
96
97
  colors: getStockWebPalette(),
97
98
  typography: _defaultTypography(),
98
99
  spacing: defaultSpacing(),
100
+ shadows: createShadowAliasTokens('light'),
99
101
  components: {},
100
102
  host: { appearance: 'light' },
101
103
  };
@@ -103,6 +105,7 @@ export const defaultFluentTheme: Theme = {
103
105
  export const defaultFluentDarkTheme: Theme = {
104
106
  colors: getStockWebDarkPalette(),
105
107
  typography: defaultFluentTheme.typography,
108
+ shadows: createShadowAliasTokens('dark'),
106
109
  spacing: defaultFluentTheme.spacing,
107
110
  components: {},
108
111
  host: { appearance: 'dark' },
@@ -111,6 +114,7 @@ export const defaultFluentDarkTheme: Theme = {
111
114
  export const defaultFluentHighConstrastTheme: Theme = {
112
115
  colors: getStockWebHCPalette(),
113
116
  typography: defaultFluentTheme.typography,
117
+ shadows: createShadowAliasTokens('highContrast'),
114
118
  spacing: defaultFluentTheme.spacing,
115
119
  components: {},
116
120
  host: { appearance: 'highContrast' },
@@ -1,6 +1,9 @@
1
1
  import lightAliasTokens from '@fluentui-react-native/design-tokens-windows/light/tokens-aliases.json';
2
2
  import darkAliasTokens from '@fluentui-react-native/design-tokens-windows/dark/tokens-aliases.json';
3
3
  import { hcAliasTokens } from './highContrast/tokens-alias';
4
+ import lightShadowTokens from '@fluentui-react-native/design-tokens-windows/light/tokens-shadow.json';
5
+ import darkShadowTokens from '@fluentui-react-native/design-tokens-windows/dark/tokens-shadow.json';
6
+ import hcShadowTokens from '@fluentui-react-native/design-tokens-win32/hc/tokens-shadow.json';
4
7
  import { AppearanceOptions } from '@fluentui-react-native/theme-types';
5
8
  import { assertNever } from 'assert-never';
6
9
 
@@ -17,3 +20,17 @@ export function getAliasTokens(mode: AppearanceOptions) {
17
20
 
18
21
  return lightAliasTokens;
19
22
  }
23
+
24
+ export function getShadowTokens(mode: AppearanceOptions) {
25
+ if (mode === 'light') {
26
+ return lightShadowTokens.shadow;
27
+ } else if (mode === 'dark') {
28
+ return darkShadowTokens.shadow;
29
+ } else if (mode === 'highContrast') {
30
+ return hcShadowTokens.shadow;
31
+ } else {
32
+ assertNever(mode);
33
+ }
34
+
35
+ return lightAliasTokens;
36
+ }
package/src/index.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  export { defaultFluentTheme, defaultFluentDarkTheme } from './defaultTheme';
2
2
  export { createDefaultTheme } from './createDefaultTheme';
3
- export { createAliasTokens } from './createAliasTokens';
3
+ export { createColorAliasTokens as createAliasTokens } from './createAliasTokens';
@@ -1,3 +0,0 @@
1
- import { AppearanceOptions } from '@fluentui-react-native/theme-types';
2
- export declare function getAliasTokens(mode: AppearanceOptions): any;
3
- //# sourceMappingURL=getAliasTokens.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"getAliasTokens.d.ts","sourceRoot":"","sources":["../src/getAliasTokens.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAGvE,wBAAgB,cAAc,CAAC,IAAI,EAAE,iBAAiB,OAYrD"}
@@ -1,20 +0,0 @@
1
- import lightAliasTokens from '@fluentui-react-native/design-tokens-windows/light/tokens-aliases.json';
2
- import darkAliasTokens from '@fluentui-react-native/design-tokens-windows/dark/tokens-aliases.json';
3
- import { hcAliasTokens } from './highContrast/tokens-alias';
4
- import { assertNever } from 'assert-never';
5
- export function getAliasTokens(mode) {
6
- if (mode === 'light') {
7
- return lightAliasTokens;
8
- }
9
- else if (mode === 'dark') {
10
- return darkAliasTokens;
11
- }
12
- else if (mode === 'highContrast') {
13
- return hcAliasTokens;
14
- }
15
- else {
16
- assertNever(mode);
17
- }
18
- return lightAliasTokens;
19
- }
20
- //# sourceMappingURL=getAliasTokens.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"getAliasTokens.js","sourceRoot":"","sources":["../src/getAliasTokens.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,wEAAwE,CAAC;AACtG,OAAO,eAAe,MAAM,uEAAuE,CAAC;AACpG,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,MAAM,UAAU,cAAc,CAAC,IAAuB;IACpD,IAAI,IAAI,KAAK,OAAO,EAAE;QACpB,OAAO,gBAAgB,CAAC;KACzB;SAAM,IAAI,IAAI,KAAK,MAAM,EAAE;QAC1B,OAAO,eAAe,CAAC;KACxB;SAAM,IAAI,IAAI,KAAK,cAAc,EAAE;QAClC,OAAO,aAAa,CAAC;KACtB;SAAM;QACL,WAAW,CAAC,IAAI,CAAC,CAAC;KACnB;IAED,OAAO,gBAAgB,CAAC;AAC1B,CAAC"}
@@ -1,3 +0,0 @@
1
- import { AppearanceOptions } from '@fluentui-react-native/theme-types';
2
- export declare function getAliasTokens(mode: AppearanceOptions): any;
3
- //# sourceMappingURL=getAliasTokens.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"getAliasTokens.d.ts","sourceRoot":"","sources":["../src/getAliasTokens.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAGvE,wBAAgB,cAAc,CAAC,IAAI,EAAE,iBAAiB,OAYrD"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"getAliasTokens.js","sourceRoot":"","sources":["../src/getAliasTokens.ts"],"names":[],"mappings":";;;;;;AAAA,+HAAsG;AACtG,8HAAoG;AACpG,4DAA4D;AAE5D,6CAA2C;AAE3C,SAAgB,cAAc,CAAC,IAAuB;IACpD,IAAI,IAAI,KAAK,OAAO,EAAE;QACpB,OAAO,6BAAgB,CAAC;KACzB;SAAM,IAAI,IAAI,KAAK,MAAM,EAAE;QAC1B,OAAO,6BAAe,CAAC;KACxB;SAAM,IAAI,IAAI,KAAK,cAAc,EAAE;QAClC,OAAO,4BAAa,CAAC;KACtB;SAAM;QACL,IAAA,0BAAW,EAAC,IAAI,CAAC,CAAC;KACnB;IAED,OAAO,6BAAgB,CAAC;AAC1B,CAAC;AAZD,wCAYC"}