UNPKG

4.04 kBJavaScriptView Raw
1import { __assign } from "tslib";
2import { Customizations, getWindow } from '@uifabric/utilities';
3import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles';
4import { createTheme } from '@fluentui/theme/lib/createTheme';
5export { createTheme } from '@fluentui/theme/lib/createTheme';
6var _theme = createTheme({});
7var _onThemeChangeCallbacks = [];
8export var ThemeSettingName = 'theme';
9export function initializeThemeInCustomizations() {
10 var _a;
11 var _b, _c, _d, _e;
12 // eslint-disable-next-line @typescript-eslint/no-explicit-any
13 var win = getWindow();
14 if ((_c = (_b = win) === null || _b === void 0 ? void 0 : _b.FabricConfig) === null || _c === void 0 ? void 0 : _c.legacyTheme) {
15 // does everything the `else` clause does and more, such as invoke legacy theming
16 loadTheme(win.FabricConfig.legacyTheme);
17 }
18 else if (!Customizations.getSettings([ThemeSettingName]).theme) {
19 if ((_e = (_d = win) === null || _d === void 0 ? void 0 : _d.FabricConfig) === null || _e === void 0 ? void 0 : _e.theme) {
20 _theme = createTheme(win.FabricConfig.theme);
21 }
22 // Set the default theme.
23 Customizations.applySettings((_a = {}, _a[ThemeSettingName] = _theme, _a));
24 }
25}
26initializeThemeInCustomizations();
27/**
28 * Gets the theme object
29 * @param depComments - Whether to include deprecated tags as comments for deprecated slots.
30 */
31export function getTheme(depComments) {
32 if (depComments === void 0) { depComments = false; }
33 if (depComments === true) {
34 _theme = createTheme({}, depComments);
35 }
36 return _theme;
37}
38/**
39 * Registers a callback that gets called whenever the theme changes.
40 * This should only be used when the component cannot automatically get theme changes through its state.
41 * This will not register duplicate callbacks.
42 */
43export function registerOnThemeChangeCallback(callback) {
44 if (_onThemeChangeCallbacks.indexOf(callback) === -1) {
45 _onThemeChangeCallbacks.push(callback);
46 }
47}
48/**
49 * See registerOnThemeChangeCallback().
50 * Removes previously registered callbacks.
51 */
52export function removeOnThemeChangeCallback(callback) {
53 var i = _onThemeChangeCallbacks.indexOf(callback);
54 if (i === -1) {
55 return;
56 }
57 _onThemeChangeCallbacks.splice(i, 1);
58}
59/**
60 * Applies the theme, while filling in missing slots.
61 * @param theme - Partial theme object.
62 * @param depComments - Whether to include deprecated tags as comments for deprecated slots.
63 */
64export function loadTheme(theme, depComments) {
65 var _a;
66 if (depComments === void 0) { depComments = false; }
67 _theme = createTheme(theme, depComments);
68 // Invoke the legacy method of theming the page as well.
69 legacyLoadTheme(__assign(__assign(__assign(__assign({}, _theme.palette), _theme.semanticColors), _theme.effects), _loadFonts(_theme)));
70 Customizations.applySettings((_a = {}, _a[ThemeSettingName] = _theme, _a));
71 _onThemeChangeCallbacks.forEach(function (callback) {
72 try {
73 callback(_theme);
74 }
75 catch (e) {
76 // don't let a bad callback break everything else
77 }
78 });
79 return _theme;
80}
81/**
82 * Loads font variables into a JSON object.
83 * @param theme - The theme object
84 */
85function _loadFonts(theme) {
86 var lines = {};
87 for (var _i = 0, _a = Object.keys(theme.fonts); _i < _a.length; _i++) {
88 var fontName = _a[_i];
89 var font = theme.fonts[fontName];
90 for (var _b = 0, _c = Object.keys(font); _b < _c.length; _b++) {
91 var propName = _c[_b];
92 var name_1 = fontName + propName.charAt(0).toUpperCase() + propName.slice(1);
93 var value = font[propName];
94 if (propName === 'fontSize' && typeof value === 'number') {
95 // if it's a number, convert it to px by default like our theming system does
96 value = value + 'px';
97 }
98 lines[name_1] = value;
99 }
100 }
101 return lines;
102}
103//# sourceMappingURL=theme.js.map
\No newline at end of file