@fluentui-react-native/default-theme 0.27.6 → 0.27.11
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.
- package/.cache/tsconfig.tsbuildinfo +1 -1
- package/CHANGELOG.md +60 -0
- package/lib/__tests__/default-theme.test.js +16 -0
- package/lib/__tests__/default-theme.test.js.map +1 -1
- package/lib/createAliasTokens.js +2 -2
- package/lib/createAliasTokens.js.map +1 -1
- package/lib/createDefaultTheme.d.ts.map +1 -1
- package/lib/createDefaultTheme.js +23 -22
- package/lib/createDefaultTheme.js.map +1 -1
- package/lib/defaultTheme.d.ts +3 -5
- package/lib/defaultTheme.d.ts.map +1 -1
- package/lib/defaultTheme.js +16 -102
- package/lib/defaultTheme.js.map +1 -1
- package/lib/stockWebPalette.js +1 -1
- package/lib/stockWebPalette.js.map +1 -1
- package/lib/stockWebPalette.macos.js +1 -1
- package/lib/stockWebPalette.macos.js.map +1 -1
- package/lib/stockWebPalette.win32.js +1 -1
- package/lib/stockWebPalette.win32.js.map +1 -1
- package/package.json +3 -5
- package/src/__tests__/default-theme.test.ts +22 -0
- package/src/createAliasTokens.ts +2 -2
- package/src/createDefaultTheme.ts +28 -25
- package/src/defaultTheme.ts +19 -112
- package/src/stockWebPalette.macos.ts +1 -1
- package/src/stockWebPalette.ts +1 -1
- package/src/stockWebPalette.win32.ts +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,65 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/default-theme
|
|
2
2
|
|
|
3
|
+
## 0.27.11
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 4157768: Add appearance-aware Flex theme sources with stable token identity and lazy compatibility bridges for legacy themes.
|
|
8
|
+
- Updated dependencies [24be698]
|
|
9
|
+
- Updated dependencies [4157768]
|
|
10
|
+
- @fluentui-react-native/framework-base@0.7.0
|
|
11
|
+
- @fluentui-react-native/design@0.4.0
|
|
12
|
+
|
|
13
|
+
## 0.27.10
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- Updated dependencies [587845c]
|
|
18
|
+
- Updated dependencies [a0ef3f4]
|
|
19
|
+
- @fluentui-react-native/design@0.3.3
|
|
20
|
+
|
|
21
|
+
## 0.27.9
|
|
22
|
+
|
|
23
|
+
### Patch Changes
|
|
24
|
+
|
|
25
|
+
- 51fab45: Updating path references to components and design packages
|
|
26
|
+
- cfef63e: update package references to use consolidated package directly
|
|
27
|
+
- cfef63e: Consolidate theming utilities in the design package and move compatibility packages to the shim directory
|
|
28
|
+
- Updated dependencies [51fab45]
|
|
29
|
+
- Updated dependencies [cfef63e]
|
|
30
|
+
- Updated dependencies [7372841]
|
|
31
|
+
- Updated dependencies [cfef63e]
|
|
32
|
+
- Updated dependencies [cfef63e]
|
|
33
|
+
- @fluentui-react-native/design@0.3.2
|
|
34
|
+
|
|
35
|
+
## 0.27.8
|
|
36
|
+
|
|
37
|
+
### Patch Changes
|
|
38
|
+
|
|
39
|
+
- cbd319c: Bump package to publish via ESRP (no changes)
|
|
40
|
+
- Updated dependencies [5bc9e81]
|
|
41
|
+
- Updated dependencies [5bc9e81]
|
|
42
|
+
- Updated dependencies [cbd319c]
|
|
43
|
+
- @fluentui-react-native/framework-base@0.6.1
|
|
44
|
+
- @fluentui-react-native/design@0.3.1
|
|
45
|
+
- @fluentui-react-native/theme-tokens@0.29.2
|
|
46
|
+
- @fluentui-react-native/theming-utils@0.27.8
|
|
47
|
+
|
|
48
|
+
## 0.27.7
|
|
49
|
+
|
|
50
|
+
### Patch Changes
|
|
51
|
+
|
|
52
|
+
- Updated dependencies [3abc13a]
|
|
53
|
+
- Updated dependencies [778d82b]
|
|
54
|
+
- Updated dependencies [3abc13a]
|
|
55
|
+
- Updated dependencies [1157793]
|
|
56
|
+
- Updated dependencies [778d82b]
|
|
57
|
+
- Updated dependencies [ea738f0]
|
|
58
|
+
- @fluentui-react-native/design@0.3.0
|
|
59
|
+
- @fluentui-react-native/framework-base@0.6.0
|
|
60
|
+
- @fluentui-react-native/theme-tokens@0.29.1
|
|
61
|
+
- @fluentui-react-native/theming-utils@0.27.7
|
|
62
|
+
|
|
3
63
|
## 0.27.6
|
|
4
64
|
|
|
5
65
|
### Patch Changes
|
|
@@ -26,6 +26,22 @@ describe('createDefaultTheme test', () => {
|
|
|
26
26
|
const defaultTheme = createDefaultTheme(themeOption).theme;
|
|
27
27
|
expect(defaultTheme).toMatchSnapshot();
|
|
28
28
|
});
|
|
29
|
+
it('resolves mutable compatibility options again after invalidation', () => {
|
|
30
|
+
const options = { appearance: 'light' };
|
|
31
|
+
const reference = createDefaultTheme(options);
|
|
32
|
+
expect(reference.theme.host.appearance).toBe('light');
|
|
33
|
+
options.appearance = 'dark';
|
|
34
|
+
reference.invalidate();
|
|
35
|
+
expect(reference.theme.host.appearance).toBe('dark');
|
|
36
|
+
});
|
|
37
|
+
it('resolves mutable default appearance options again after invalidation', () => {
|
|
38
|
+
const options = { defaultAppearance: 'light' };
|
|
39
|
+
const reference = createDefaultTheme(options);
|
|
40
|
+
expect(reference.theme.host.appearance).toBe('light');
|
|
41
|
+
options.defaultAppearance = 'dark';
|
|
42
|
+
reference.invalidate();
|
|
43
|
+
expect(reference.theme.host.appearance).toBe('dark');
|
|
44
|
+
});
|
|
29
45
|
});
|
|
30
46
|
describe('createColorAliasTokens test', () => {
|
|
31
47
|
it.concurrent.each(appearanceOptions)('appearanceOptions - %s', async (appearanceOption) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"default-theme.test.js","sourceRoot":"","sources":["../../src/__tests__/default-theme.test.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,sBAAsB,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACvF,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAE7E,MAAM,mBAAmB,GAAqB;IAC5C,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,iBAAiB,EAAE,OAAO,EAAE,CAAC;IACrD,CAAC,EAAE,UAAU,EAAE,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,CAAC;IACpD,CAAC,EAAE,UAAU,EAAE,cAAc,EAAE,iBAAiB,EAAE,OAAO,EAAE,CAAC;IAC5D,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,iBAAiB,EAAE,OAAO,EAAE,CAAC;IACvD,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,iBAAiB,EAAE,OAAO,EAAE,CAAC;CACxD,CAAC;AAEF,MAAM,iBAAiB,GAAwB,CAAC,OAAO,EAAE,MAAM,EAAE,cAAc,CAAC,CAAC;AAEjF,SAAS,CAAC,GAAG,EAAE;IACb,IAAI,CAAC,IAAI,CAAC,6CAA6C,EAAE,GAAG,EAAE,CAAC,CAAC;QAC9D,cAAc,EAAE,GAAG,EAAE,CAAC,MAAM;QAC5B,iBAAiB,EAAE,GAAG,EAAE,CAAC,IAAI;KAC9B,CAAC,CAAC,CAAC;AACN,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;IACjC,MAAM,CAAC,kBAAkB,CAAC,CAAC,eAAe,EAAE,CAAC;AAC/C,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,6BAA6B,EAAE,GAAG,EAAE;IACrC,MAAM,CAAC,sBAAsB,CAAC,CAAC,eAAe,EAAE,CAAC;AACnD,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,yBAAyB,EAAE,GAAG,EAAE;IACvC,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC,kBAAkB,EAAE,KAAK,EAAE,WAAyB,EAAE,EAAE;QAC9F,MAAM,YAAY,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC;QAC3D,MAAM,CAAC,YAAY,CAAC,CAAC,eAAe,EAAE,CAAC;IACzC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,6BAA6B,EAAE,GAAG,EAAE;IAC3C,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,wBAAwB,EAAE,KAAK,EAAE,gBAAmC,EAAE,EAAE;QAC5G,MAAM,CAAC,sBAAsB,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe,EAAE,CAAC;IACrE,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,8BAA8B,EAAE,GAAG,EAAE;IAC5C,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,wBAAwB,EAAE,KAAK,EAAE,gBAAmC,EAAE,EAAE;QAC5G,MAAM,CAAC,uBAAuB,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe,EAAE,CAAC;IACtE,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
1
|
+
{"version":3,"file":"default-theme.test.js","sourceRoot":"","sources":["../../src/__tests__/default-theme.test.ts"],"names":[],"mappings":"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"}
|
package/lib/createAliasTokens.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { memoize } from '@fluentui-react-native/framework-base';
|
|
2
|
-
import { getAliasTokens, getShadowTokens } from '@fluentui-react-native/
|
|
3
|
-
import { mapPipelineToShadow, mapPipelineToTheme } from '@fluentui-react-native/theming
|
|
2
|
+
import { getAliasTokens, getShadowTokens } from '@fluentui-react-native/design/tokens/legacy';
|
|
3
|
+
import { mapPipelineToShadow, mapPipelineToTheme } from '@fluentui-react-native/design/theming';
|
|
4
4
|
function createColorAliasTokensWorker(mode) {
|
|
5
5
|
const aliasTokens = getAliasTokens(mode);
|
|
6
6
|
return mapPipelineToTheme(aliasTokens);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createAliasTokens.js","sourceRoot":"","sources":["../src/createAliasTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uCAAuC,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"createAliasTokens.js","sourceRoot":"","sources":["../src/createAliasTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uCAAuC,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,6CAA6C,CAAC;AAE9F,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,uCAAuC,CAAC;AAEhG,SAAS,4BAA4B,CAAC,IAAuB;IAC3D,MAAM,WAAW,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;IACzC,OAAO,kBAAkB,CAAC,WAAW,CAAC,CAAC;AACzC,CAAC;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,OAAO,CAAC,4BAA4B,CAAC,CAAC;AAE5E,SAAS,6BAA6B,CAAC,IAAuB;IAC5D,MAAM,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC;IAC1C,OAAO,mBAAmB,CAAC,WAAW,CAAC,CAAC;AAC1C,CAAC;AAED,MAAM,CAAC,MAAM,uBAAuB,GAAG,OAAO,CAAC,6BAA6B,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createDefaultTheme.d.ts","sourceRoot":"","sources":["../src/createDefaultTheme.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"createDefaultTheme.d.ts","sourceRoot":"","sources":["../src/createDefaultTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AACvE,OAAO,KAAK,EAAS,YAAY,EAAE,MAAM,uCAAuC,CAAC;AAWjF,wBAAgB,kBAAkB,CAAC,OAAO,GAAE,YAAiB,GAAG,cAAc,CAwB7E"}
|
|
@@ -1,29 +1,30 @@
|
|
|
1
|
-
import { Appearance } from 'react-native';
|
|
2
1
|
import { ThemeReference } from '@fluentui-react-native/design/theming';
|
|
3
|
-
import { getCurrentAppearance } from '@fluentui-react-native/design/theming';
|
|
2
|
+
import { appearanceOptionFromResolved, appearanceOptionsFromLegacy, getCurrentAppearance, resolveThemeAppearance, } from '@fluentui-react-native/design/theming';
|
|
4
3
|
import assertNever from 'assert-never';
|
|
5
4
|
import { defaultFluentDarkTheme, defaultFluentHighConstrastTheme, defaultFluentTheme } from './defaultTheme';
|
|
6
5
|
export function createDefaultTheme(options = {}) {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
6
|
+
return new ThemeReference({
|
|
7
|
+
base: {},
|
|
8
|
+
getAppearance: () => appearanceOptionsFromLegacy(options.appearance ?? options.defaultAppearance ?? 'light'),
|
|
9
|
+
getFallbackAppearance: () => resolveThemeAppearance(appearanceOptionsFromLegacy(options.defaultAppearance ?? 'light')).resolved,
|
|
10
|
+
recipes: [
|
|
11
|
+
(_theme, resolvedAppearance) => {
|
|
12
|
+
const current = resolvedAppearance
|
|
13
|
+
? appearanceOptionFromResolved(resolvedAppearance)
|
|
14
|
+
: getCurrentAppearance(options.appearance, options.defaultAppearance ?? 'light');
|
|
15
|
+
switch (current) {
|
|
16
|
+
case 'light':
|
|
17
|
+
return defaultFluentTheme;
|
|
18
|
+
case 'dark':
|
|
19
|
+
case 'darkElevated':
|
|
20
|
+
return defaultFluentDarkTheme;
|
|
21
|
+
case 'highContrast':
|
|
22
|
+
return defaultFluentHighConstrastTheme;
|
|
23
|
+
default:
|
|
24
|
+
assertNever(current);
|
|
25
|
+
}
|
|
26
|
+
},
|
|
27
|
+
],
|
|
21
28
|
});
|
|
22
|
-
if (Appearance && options.appearance === 'dynamic') {
|
|
23
|
-
Appearance.addChangeListener(() => {
|
|
24
|
-
themeRef.invalidate();
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
return themeRef;
|
|
28
29
|
}
|
|
29
30
|
//# sourceMappingURL=createDefaultTheme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createDefaultTheme.js","sourceRoot":"","sources":["../src/createDefaultTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"createDefaultTheme.js","sourceRoot":"","sources":["../src/createDefaultTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAEvE,OAAO,EACL,4BAA4B,EAC5B,2BAA2B,EAC3B,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,WAAW,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,sBAAsB,EAAE,+BAA+B,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAE7G,MAAM,UAAU,kBAAkB,CAAC,OAAO,GAAiB,EAAE;IAC3D,OAAO,IAAI,cAAc,CAAC;QACxB,IAAI,EAAE,EAAW;QACjB,aAAa,EAAE,GAAG,EAAE,CAAC,2BAA2B,CAAC,OAAO,CAAC,UAAU,IAAI,OAAO,CAAC,iBAAiB,IAAI,OAAO,CAAC;QAC5G,qBAAqB,EAAE,GAAG,EAAE,CAAC,sBAAsB,CAAC,2BAA2B,CAAC,OAAO,CAAC,iBAAiB,IAAI,OAAO,CAAC,CAAC,CAAC,QAAQ;QAC/H,OAAO,EAAE;YACP,CAAC,MAAM,EAAE,kBAAkB,EAAE,EAAE;gBAC7B,MAAM,OAAO,GAAG,kBAAkB;oBAChC,CAAC,CAAC,4BAA4B,CAAC,kBAAkB,CAAC;oBAClD,CAAC,CAAC,oBAAoB,CAAC,OAAO,CAAC,UAAU,EAAE,OAAO,CAAC,iBAAiB,IAAI,OAAO,CAAC,CAAC;gBACnF,QAAQ,OAAO,EAAE,CAAC;oBAChB,KAAK,OAAO;wBACV,OAAO,kBAAkB,CAAC;oBAC5B,KAAK,MAAM,CAAC;oBACZ,KAAK,cAAc;wBACjB,OAAO,sBAAsB,CAAC;oBAChC,KAAK,cAAc;wBACjB,OAAO,+BAA+B,CAAC;oBACzC;wBACE,WAAW,CAAC,OAAO,CAAC,CAAC;gBACzB,CAAC;YACH,CAAC;SACF;KACF,CAAC,CAAC;AACL,CAAC"}
|
package/lib/defaultTheme.d.ts
CHANGED
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
export declare
|
|
3
|
-
export declare const
|
|
4
|
-
export declare const defaultFluentDarkTheme: Theme;
|
|
5
|
-
export declare const defaultFluentHighConstrastTheme: Theme;
|
|
1
|
+
export declare const defaultFluentTheme: import("@fluentui-react-native/design/theming").Theme;
|
|
2
|
+
export declare const defaultFluentDarkTheme: import("@fluentui-react-native/design/theming").Theme;
|
|
3
|
+
export declare const defaultFluentHighConstrastTheme: import("@fluentui-react-native/design/theming").Theme;
|
|
6
4
|
//# sourceMappingURL=defaultTheme.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../src/defaultTheme.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../src/defaultTheme.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,uDAI7B,CAAC;AAEH,eAAO,MAAM,sBAAsB,uDAIjC,CAAC;AAEH,eAAO,MAAM,+BAA+B,uDAI1C,CAAC"}
|
package/lib/defaultTheme.js
CHANGED
|
@@ -1,103 +1,17 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
},
|
|
18
|
-
weights: {
|
|
19
|
-
regular: fontWeightRegular,
|
|
20
|
-
semiBold: fontWeightSemibold,
|
|
21
|
-
},
|
|
22
|
-
families: {
|
|
23
|
-
primary: 'Segoe UI',
|
|
24
|
-
secondary: 'Segoe UI',
|
|
25
|
-
cursive: 'System',
|
|
26
|
-
monospace: 'System',
|
|
27
|
-
numeric: 'System',
|
|
28
|
-
sansSerif: 'System',
|
|
29
|
-
serif: 'System',
|
|
30
|
-
},
|
|
31
|
-
variants: {
|
|
32
|
-
captionStandard: { face: 'primary', size: 'caption', weight: 'regular' },
|
|
33
|
-
secondaryStandard: { face: 'primary', size: 'secondary', weight: 'regular' },
|
|
34
|
-
secondarySemibold: { face: 'primary', size: 'secondary', weight: 'semiBold' },
|
|
35
|
-
bodyStandard: { face: 'primary', size: 'body', weight: 'regular' },
|
|
36
|
-
bodySemibold: { face: 'primary', size: 'body', weight: 'semiBold' },
|
|
37
|
-
subheaderStandard: { face: 'primary', size: 'subheader', weight: 'regular' },
|
|
38
|
-
subheaderSemibold: { face: 'primary', size: 'subheader', weight: 'semiBold' },
|
|
39
|
-
headerStandard: { face: 'primary', size: 'header', weight: 'regular' },
|
|
40
|
-
headerSemibold: { face: 'primary', size: 'header', weight: 'semiBold' },
|
|
41
|
-
heroStandard: { face: 'primary', size: 'hero', weight: 'regular' },
|
|
42
|
-
heroSemibold: { face: 'primary', size: 'hero', weight: 'semiBold' },
|
|
43
|
-
heroLargeStandard: { face: 'primary', size: 'heroLarge', weight: 'regular' },
|
|
44
|
-
heroLargeSemibold: { face: 'primary', size: 'heroLarge', weight: 'semiBold' },
|
|
45
|
-
// mocked out
|
|
46
|
-
caption1: { face: 'primary', size: 'caption', weight: 'regular' },
|
|
47
|
-
caption1Strong: { face: 'primary', size: 'caption', weight: 'semiBold' },
|
|
48
|
-
body1: { face: 'primary', size: 'secondary', weight: 'regular' },
|
|
49
|
-
body1Strong: { face: 'primary', size: 'secondary', weight: 'semiBold' },
|
|
50
|
-
body2: { face: 'primary', size: 'body', weight: 'regular' },
|
|
51
|
-
body2Strong: { face: 'primary', size: 'body', weight: 'semiBold' },
|
|
52
|
-
subtitle1: { face: 'primary', size: 'header', weight: 'regular' },
|
|
53
|
-
subtitle1Strong: { face: 'primary', size: 'header', weight: 'semiBold' },
|
|
54
|
-
subtitle2: { face: 'primary', size: 'subheader', weight: 'regular' },
|
|
55
|
-
subtitle2Strong: { face: 'primary', size: 'subheader', weight: 'semiBold' },
|
|
56
|
-
title1: { face: 'primary', size: 'hero', weight: 'regular' },
|
|
57
|
-
title1Strong: { face: 'primary', size: 'hero', weight: 'semiBold' },
|
|
58
|
-
largeTitle: { face: 'primary', size: 'heroLarge', weight: 'regular' },
|
|
59
|
-
display: { face: 'primary', size: 'heroLarge', weight: 'semiBold' },
|
|
60
|
-
},
|
|
61
|
-
};
|
|
62
|
-
if (Platform.OS === 'macos' || Platform.OS === 'ios') {
|
|
63
|
-
const familiesDictApple = {
|
|
64
|
-
primary: 'System',
|
|
65
|
-
secondary: 'System',
|
|
66
|
-
cursive: 'System',
|
|
67
|
-
monospace: 'System',
|
|
68
|
-
numeric: 'System',
|
|
69
|
-
sansSerif: 'System',
|
|
70
|
-
serif: 'System',
|
|
71
|
-
};
|
|
72
|
-
defaultsDict.families = familiesDictApple;
|
|
73
|
-
}
|
|
74
|
-
return defaultsDict;
|
|
75
|
-
}
|
|
76
|
-
export function defaultSpacing() {
|
|
77
|
-
return { s2: '4px', s1: '8px', m: '16px', l1: '20px', l2: '32px' };
|
|
78
|
-
}
|
|
79
|
-
export const defaultFluentTheme = {
|
|
80
|
-
colors: getStockWebPalette(),
|
|
81
|
-
typography: _defaultTypography(),
|
|
82
|
-
spacing: defaultSpacing(),
|
|
83
|
-
shadows: createShadowAliasTokens('light'),
|
|
84
|
-
components: {},
|
|
85
|
-
host: { appearance: 'light' },
|
|
86
|
-
};
|
|
87
|
-
export const defaultFluentDarkTheme = {
|
|
88
|
-
colors: getStockWebDarkPalette(),
|
|
89
|
-
typography: defaultFluentTheme.typography,
|
|
90
|
-
shadows: createShadowAliasTokens('dark'),
|
|
91
|
-
spacing: defaultFluentTheme.spacing,
|
|
92
|
-
components: {},
|
|
93
|
-
host: { appearance: 'dark' },
|
|
94
|
-
};
|
|
95
|
-
export const defaultFluentHighConstrastTheme = {
|
|
96
|
-
colors: getStockWebHCPalette(),
|
|
97
|
-
typography: defaultFluentTheme.typography,
|
|
98
|
-
shadows: createShadowAliasTokens('highContrast'),
|
|
99
|
-
spacing: defaultFluentTheme.spacing,
|
|
100
|
-
components: {},
|
|
101
|
-
host: { appearance: 'highContrast' },
|
|
102
|
-
};
|
|
1
|
+
import { getDefaultLegacyTheme } from '@fluentui-react-native/design/theming/compat/defaults';
|
|
2
|
+
export const defaultFluentTheme = getDefaultLegacyTheme({
|
|
3
|
+
colorScheme: 'light',
|
|
4
|
+
contrast: 'standard',
|
|
5
|
+
interfaceLevel: 'base',
|
|
6
|
+
});
|
|
7
|
+
export const defaultFluentDarkTheme = getDefaultLegacyTheme({
|
|
8
|
+
colorScheme: 'dark',
|
|
9
|
+
contrast: 'standard',
|
|
10
|
+
interfaceLevel: 'base',
|
|
11
|
+
});
|
|
12
|
+
export const defaultFluentHighConstrastTheme = getDefaultLegacyTheme({
|
|
13
|
+
colorScheme: 'dark',
|
|
14
|
+
contrast: 'highContrast',
|
|
15
|
+
interfaceLevel: 'base',
|
|
16
|
+
});
|
|
103
17
|
//# sourceMappingURL=defaultTheme.js.map
|
package/lib/defaultTheme.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaultTheme.js","sourceRoot":"","sources":["../src/defaultTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"defaultTheme.js","sourceRoot":"","sources":["../src/defaultTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,uDAAuD,CAAC;AAE9F,MAAM,CAAC,MAAM,kBAAkB,GAAG,qBAAqB,CAAC;IACtD,WAAW,EAAE,OAAO;IACpB,QAAQ,EAAE,UAAU;IACpB,cAAc,EAAE,MAAM;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,sBAAsB,GAAG,qBAAqB,CAAC;IAC1D,WAAW,EAAE,MAAM;IACnB,QAAQ,EAAE,UAAU;IACpB,cAAc,EAAE,MAAM;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,+BAA+B,GAAG,qBAAqB,CAAC;IACnE,WAAW,EAAE,MAAM;IACnB,QAAQ,EAAE,cAAc;IACxB,cAAc,EAAE,MAAM;CACvB,CAAC,CAAC"}
|
package/lib/stockWebPalette.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* eslint-disable @typescript-eslint/ban-ts-comment */
|
|
2
|
-
import { globalTokens } from '@fluentui-react-native/
|
|
2
|
+
import { globalTokens } from '@fluentui-react-native/design/tokens/legacy';
|
|
3
3
|
import { colorBlack, colorBurgundyPrimary, colorRedPrimary, colorWhite } from '@fluentui-react-native/design/tokens/global';
|
|
4
4
|
import { createColorAliasTokens } from './createAliasTokens';
|
|
5
5
|
import { paletteFromFabricColors } from './defaultColors';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stockWebPalette.js","sourceRoot":"","sources":["../src/stockWebPalette.ts"],"names":[],"mappings":"AAAA,sDAAsD;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"stockWebPalette.js","sourceRoot":"","sources":["../src/stockWebPalette.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { globalTokens } from '@fluentui-react-native/
|
|
1
|
+
import { globalTokens } from '@fluentui-react-native/design/tokens/legacy';
|
|
2
2
|
import { colorBlack, colorBurgundyPrimary, colorRedPrimary, colorWhite } from '@fluentui-react-native/design/tokens/global';
|
|
3
3
|
import { createColorAliasTokens } from './createAliasTokens';
|
|
4
4
|
import { paletteFromFabricColors } from './defaultColors';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stockWebPalette.macos.js","sourceRoot":"","sources":["../src/stockWebPalette.macos.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"stockWebPalette.macos.js","sourceRoot":"","sources":["../src/stockWebPalette.macos.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { globalTokens } from '@fluentui-react-native/
|
|
1
|
+
import { globalTokens } from '@fluentui-react-native/design/tokens/legacy';
|
|
2
2
|
import { colorBlack, colorBurgundyPrimary, colorRedPrimary, colorWhite } from '@fluentui-react-native/design/tokens/global';
|
|
3
3
|
import { createColorAliasTokens } from './createAliasTokens';
|
|
4
4
|
import { paletteFromFabricColors } from './defaultColors';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stockWebPalette.win32.js","sourceRoot":"","sources":["../src/stockWebPalette.win32.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"stockWebPalette.win32.js","sourceRoot":"","sources":["../src/stockWebPalette.win32.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/default-theme",
|
|
3
|
-
"version": "0.27.
|
|
3
|
+
"version": "0.27.11",
|
|
4
4
|
"description": "Typing only package for fluentui-react-native theme types",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -33,10 +33,8 @@
|
|
|
33
33
|
"update-snapshots": "fluentui-scripts jest -u"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@fluentui-react-native/design": "0.
|
|
37
|
-
"@fluentui-react-native/framework-base": "0.
|
|
38
|
-
"@fluentui-react-native/theme-tokens": "0.29.0",
|
|
39
|
-
"@fluentui-react-native/theming-utils": "0.27.6",
|
|
36
|
+
"@fluentui-react-native/design": "0.4.0",
|
|
37
|
+
"@fluentui-react-native/framework-base": "0.7.0",
|
|
40
38
|
"assert-never": "^1.2.1"
|
|
41
39
|
},
|
|
42
40
|
"devDependencies": {
|
|
@@ -34,6 +34,28 @@ describe('createDefaultTheme test', () => {
|
|
|
34
34
|
const defaultTheme = createDefaultTheme(themeOption).theme;
|
|
35
35
|
expect(defaultTheme).toMatchSnapshot();
|
|
36
36
|
});
|
|
37
|
+
|
|
38
|
+
it('resolves mutable compatibility options again after invalidation', () => {
|
|
39
|
+
const options: ThemeOptions = { appearance: 'light' };
|
|
40
|
+
const reference = createDefaultTheme(options);
|
|
41
|
+
expect(reference.theme.host.appearance).toBe('light');
|
|
42
|
+
|
|
43
|
+
options.appearance = 'dark';
|
|
44
|
+
reference.invalidate();
|
|
45
|
+
|
|
46
|
+
expect(reference.theme.host.appearance).toBe('dark');
|
|
47
|
+
});
|
|
48
|
+
|
|
49
|
+
it('resolves mutable default appearance options again after invalidation', () => {
|
|
50
|
+
const options: ThemeOptions = { defaultAppearance: 'light' };
|
|
51
|
+
const reference = createDefaultTheme(options);
|
|
52
|
+
expect(reference.theme.host.appearance).toBe('light');
|
|
53
|
+
|
|
54
|
+
options.defaultAppearance = 'dark';
|
|
55
|
+
reference.invalidate();
|
|
56
|
+
|
|
57
|
+
expect(reference.theme.host.appearance).toBe('dark');
|
|
58
|
+
});
|
|
37
59
|
});
|
|
38
60
|
|
|
39
61
|
describe('createColorAliasTokens test', () => {
|
package/src/createAliasTokens.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { memoize } from '@fluentui-react-native/framework-base';
|
|
2
|
-
import { getAliasTokens, getShadowTokens } from '@fluentui-react-native/
|
|
2
|
+
import { getAliasTokens, getShadowTokens } from '@fluentui-react-native/design/tokens/legacy';
|
|
3
3
|
import type { AliasColorTokens, AppearanceOptions, ThemeShadowDefinition } from '@fluentui-react-native/design/theming';
|
|
4
|
-
import { mapPipelineToShadow, mapPipelineToTheme } from '@fluentui-react-native/theming
|
|
4
|
+
import { mapPipelineToShadow, mapPipelineToTheme } from '@fluentui-react-native/design/theming';
|
|
5
5
|
|
|
6
6
|
function createColorAliasTokensWorker(mode: AppearanceOptions): AliasColorTokens {
|
|
7
7
|
const aliasTokens = getAliasTokens(mode);
|
|
@@ -1,34 +1,37 @@
|
|
|
1
|
-
import { Appearance } from 'react-native';
|
|
2
|
-
|
|
3
1
|
import { ThemeReference } from '@fluentui-react-native/design/theming';
|
|
4
2
|
import type { Theme, ThemeOptions } from '@fluentui-react-native/design/theming';
|
|
5
|
-
import {
|
|
3
|
+
import {
|
|
4
|
+
appearanceOptionFromResolved,
|
|
5
|
+
appearanceOptionsFromLegacy,
|
|
6
|
+
getCurrentAppearance,
|
|
7
|
+
resolveThemeAppearance,
|
|
8
|
+
} from '@fluentui-react-native/design/theming';
|
|
6
9
|
import assertNever from 'assert-never';
|
|
7
10
|
|
|
8
11
|
import { defaultFluentDarkTheme, defaultFluentHighConstrastTheme, defaultFluentTheme } from './defaultTheme';
|
|
9
12
|
|
|
10
13
|
export function createDefaultTheme(options: ThemeOptions = {}): ThemeReference {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
14
|
+
return new ThemeReference({
|
|
15
|
+
base: {} as Theme,
|
|
16
|
+
getAppearance: () => appearanceOptionsFromLegacy(options.appearance ?? options.defaultAppearance ?? 'light'),
|
|
17
|
+
getFallbackAppearance: () => resolveThemeAppearance(appearanceOptionsFromLegacy(options.defaultAppearance ?? 'light')).resolved,
|
|
18
|
+
recipes: [
|
|
19
|
+
(_theme, resolvedAppearance) => {
|
|
20
|
+
const current = resolvedAppearance
|
|
21
|
+
? appearanceOptionFromResolved(resolvedAppearance)
|
|
22
|
+
: getCurrentAppearance(options.appearance, options.defaultAppearance ?? 'light');
|
|
23
|
+
switch (current) {
|
|
24
|
+
case 'light':
|
|
25
|
+
return defaultFluentTheme;
|
|
26
|
+
case 'dark':
|
|
27
|
+
case 'darkElevated':
|
|
28
|
+
return defaultFluentDarkTheme;
|
|
29
|
+
case 'highContrast':
|
|
30
|
+
return defaultFluentHighConstrastTheme;
|
|
31
|
+
default:
|
|
32
|
+
assertNever(current);
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
],
|
|
25
36
|
});
|
|
26
|
-
|
|
27
|
-
if (Appearance && options.appearance === 'dynamic') {
|
|
28
|
-
Appearance.addChangeListener(() => {
|
|
29
|
-
themeRef.invalidate();
|
|
30
|
-
});
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
return themeRef;
|
|
34
37
|
}
|