@wise/components-theming 0.0.0-experimental-3ee5bb4 → 0.0.0-experimental-da5f694
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/dist/cjs/index.d.ts +2 -6
- package/dist/cjs/index.js +4 -23
- package/dist/cjs/index.js.map +1 -1
- package/dist/es/index.d.ts +2 -6
- package/dist/es/index.js +6 -23
- package/dist/es/index.js.map +1 -1
- package/package.json +1 -1
- package/src/ThemeProvider.tsx +4 -8
- package/src/const.ts +1 -2
- package/src/helpers.ts +0 -18
- package/src/index.ts +0 -2
- package/src/useTheme.spec.tsx +6 -186
- package/src/useTheme.ts +3 -11
package/dist/cjs/index.d.ts
CHANGED
|
@@ -10,8 +10,7 @@ declare const extraThemes: readonly [
|
|
|
10
10
|
];
|
|
11
11
|
declare const screenModes: readonly [
|
|
12
12
|
"light",
|
|
13
|
-
"dark"
|
|
14
|
-
"system"
|
|
13
|
+
"dark"
|
|
15
14
|
];
|
|
16
15
|
// TODO: componentThemes returned back for backward compatibility, refactor this place in the future
|
|
17
16
|
type ComponentTheme = (typeof baseThemes)[number];
|
|
@@ -27,8 +26,6 @@ declare const isThemeModern: (theme: ComponentTheme | BaseTheme | ExtraTheme) =>
|
|
|
27
26
|
declare const isExtraTheme: (theme: ComponentTheme | BaseTheme | ExtraTheme) => theme is "forest-green" | "bright-green";
|
|
28
27
|
declare const isForestGreenTheme: (theme: ComponentTheme | BaseTheme | ExtraTheme) => theme is "forest-green";
|
|
29
28
|
declare const isScreenModeDark: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => screenMode is "dark";
|
|
30
|
-
declare const isScreenModeSystem: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => screenMode is "system";
|
|
31
|
-
declare const getScreenMode: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => ScreenMode;
|
|
32
29
|
declare const getThemeClassName: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => string;
|
|
33
30
|
type ThemeProviderProps = PropsWithChildren<Theming> & {
|
|
34
31
|
className?: string;
|
|
@@ -40,9 +37,8 @@ interface ThemeHookValue {
|
|
|
40
37
|
isModern: boolean;
|
|
41
38
|
isForestGreenTheme: boolean;
|
|
42
39
|
isScreenModeDark: boolean;
|
|
43
|
-
getScreenMode: ScreenMode;
|
|
44
40
|
className: string;
|
|
45
41
|
}
|
|
46
42
|
declare const useTheme: () => ThemeHookValue;
|
|
47
43
|
export type { ComponentTheme, BaseTheme, ExtraTheme, ScreenMode, Theming };
|
|
48
|
-
export { isThemeModern, isExtraTheme, isForestGreenTheme, isScreenModeDark,
|
|
44
|
+
export { isThemeModern, isExtraTheme, isForestGreenTheme, isScreenModeDark, getThemeClassName, ThemeProvider, useTheme };
|
package/dist/cjs/index.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
4
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
4
|
var react = require('react');
|
|
6
5
|
var classNames = require('classnames');
|
|
@@ -8,7 +7,7 @@ var classNames = require('classnames');
|
|
|
8
7
|
// TODO: Change 'light' with 'legacy' in the future
|
|
9
8
|
var baseThemes = ['light', 'personal'];
|
|
10
9
|
var extraThemes = ['forest-green', 'bright-green'];
|
|
11
|
-
var screenModes = ['light', 'dark'
|
|
10
|
+
var screenModes = ['light', 'dark'];
|
|
12
11
|
var modernThemes = [baseThemes[1]].concat(extraThemes);
|
|
13
12
|
var DEFAULT_BASE_THEME = 'light';
|
|
14
13
|
var DEFAULT_SCREEN_MODE = 'light';
|
|
@@ -25,16 +24,6 @@ var isForestGreenTheme = function isForestGreenTheme(theme) {
|
|
|
25
24
|
var isScreenModeDark = function isScreenModeDark(theme, screenMode) {
|
|
26
25
|
return isThemeModern(theme) && screenModes[1] === screenMode;
|
|
27
26
|
};
|
|
28
|
-
var isScreenModeSystem = function isScreenModeSystem(theme, screenMode) {
|
|
29
|
-
return isThemeModern(theme) && screenModes[2] === screenMode;
|
|
30
|
-
};
|
|
31
|
-
var getScreenMode = function getScreenMode(theme, screenMode) {
|
|
32
|
-
if (isScreenModeSystem(theme, screenMode)) {
|
|
33
|
-
var matchesDarkScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
34
|
-
return matchesDarkScheme ? screenModes[1] : screenModes[0];
|
|
35
|
-
}
|
|
36
|
-
return screenMode;
|
|
37
|
-
};
|
|
38
27
|
var getThemeClassName = function getThemeClassName(theme, screenMode) {
|
|
39
28
|
if (!isThemeModern(theme)) {
|
|
40
29
|
return "np-theme-".concat(theme);
|
|
@@ -68,7 +57,7 @@ var useTheme = function useTheme() {
|
|
|
68
57
|
var _ref = theming !== null && theming !== void 0 ? theming : FALLBACK_VALUES,
|
|
69
58
|
theme = _ref.theme,
|
|
70
59
|
contextScreenMode = _ref.screenMode;
|
|
71
|
-
var screenMode = theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE :
|
|
60
|
+
var screenMode = theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE : contextScreenMode;
|
|
72
61
|
return react.useMemo(function () {
|
|
73
62
|
return {
|
|
74
63
|
theme: theme,
|
|
@@ -76,7 +65,6 @@ var useTheme = function useTheme() {
|
|
|
76
65
|
isModern: isThemeModern(theme),
|
|
77
66
|
isForestGreenTheme: isForestGreenTheme(theme),
|
|
78
67
|
isScreenModeDark: isScreenModeDark(theme, screenMode),
|
|
79
|
-
getScreenMode: getScreenMode(theme, screenMode),
|
|
80
68
|
className: getThemeClassName(theme, screenMode)
|
|
81
69
|
};
|
|
82
70
|
}, [theme, screenMode]);
|
|
@@ -106,23 +94,18 @@ var ThemeProvider = function ThemeProvider(_ref) {
|
|
|
106
94
|
_ref$className = _ref.className,
|
|
107
95
|
className = _ref$className === void 0 ? undefined : _ref$className;
|
|
108
96
|
var isContextRoot = react.useContext(ThemeContext) === undefined;
|
|
109
|
-
var _useState = react.useState(getScreenMode(theme, screenMode)),
|
|
110
|
-
_useState2 = _slicedToArray.default(_useState, 2),
|
|
111
|
-
currentScreenMode = _useState2[0],
|
|
112
|
-
setCurrentScreenMode = _useState2[1];
|
|
113
97
|
// RegEx to check for `np-theme-` class name
|
|
114
98
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
115
99
|
var themeClass = new RegExp(/\bnp-theme-[a-z-]+\b/, 'g');
|
|
116
100
|
// useEffect hook used to apply the theme class to the HTML element
|
|
117
101
|
react.useEffect(function () {
|
|
118
|
-
setCurrentScreenMode(getScreenMode(theme, screenMode));
|
|
119
102
|
if (!isNotRootProvider && isContextRoot) {
|
|
120
103
|
var _document$documentEle;
|
|
121
104
|
// Remove all the theme classes from the documentElement
|
|
122
105
|
(_document$documentEle = document.documentElement.className.match(themeClass)) === null || _document$documentEle === void 0 ? void 0 : _document$documentEle.forEach(function (item) {
|
|
123
106
|
document.documentElement.classList.remove(item);
|
|
124
107
|
});
|
|
125
|
-
getThemeClassName(theme,
|
|
108
|
+
getThemeClassName(theme, screenMode).split(' ').forEach(function (item) {
|
|
126
109
|
document.documentElement.classList.add(item);
|
|
127
110
|
});
|
|
128
111
|
}
|
|
@@ -132,7 +115,7 @@ var ThemeProvider = function ThemeProvider(_ref) {
|
|
|
132
115
|
theme: theme,
|
|
133
116
|
screenMode: screenMode
|
|
134
117
|
};
|
|
135
|
-
}, [
|
|
118
|
+
}, [screenMode, theme]);
|
|
136
119
|
return jsxRuntime.jsx(ThemeContext.Provider, {
|
|
137
120
|
value: contextValue,
|
|
138
121
|
children: jsxRuntime.jsx(ThemedChildren, {
|
|
@@ -143,12 +126,10 @@ var ThemeProvider = function ThemeProvider(_ref) {
|
|
|
143
126
|
};
|
|
144
127
|
|
|
145
128
|
exports.ThemeProvider = ThemeProvider;
|
|
146
|
-
exports.getScreenMode = getScreenMode;
|
|
147
129
|
exports.getThemeClassName = getThemeClassName;
|
|
148
130
|
exports.isExtraTheme = isExtraTheme;
|
|
149
131
|
exports.isForestGreenTheme = isForestGreenTheme;
|
|
150
132
|
exports.isScreenModeDark = isScreenModeDark;
|
|
151
|
-
exports.isScreenModeSystem = isScreenModeSystem;
|
|
152
133
|
exports.isThemeModern = isThemeModern;
|
|
153
134
|
exports.useTheme = useTheme;
|
|
154
135
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/const.ts","../../src/helpers.ts","../../src/useTheme.ts","../../src/ThemedChildren.tsx","../../src/ThemeProvider.tsx"],"sourcesContent":["// TODO: Change 'light' with 'legacy' in the future\nexport const baseThemes = ['light', 'personal'] as const;\nexport const extraThemes = ['forest-green', 'bright-green'] as const;\nexport const screenModes = ['light', 'dark', 'system'] as const;\nexport const modernThemes = [baseThemes[1], ...extraThemes] as const;\n\n// TODO: componentThemes returned back for backward compatibility, refactor this place in the future\nexport type ComponentTheme = (typeof baseThemes)[number];\nexport type ModernTheme = (typeof modernThemes)[number];\nexport type BaseTheme = (typeof baseThemes)[number];\nexport type ExtraTheme = (typeof extraThemes)[number];\nexport type ForestGreenTheme = (typeof extraThemes)[0];\nexport type ScreenMode = (typeof screenModes)[number];\nexport type ScreenModeDark = (typeof screenModes)[1];\nexport type ScreenModeSystem = (typeof screenModes)[2];\n\nexport const DEFAULT_BASE_THEME = 'light' as const;\nexport const DEFAULT_SCREEN_MODE = 'light' as const;\n\nexport type Theming = {\n theme?: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode?: ScreenMode;\n isNotRootProvider?: boolean | undefined;\n};\n","import type {\n ComponentTheme,\n ModernTheme,\n BaseTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n ScreenModeSystem,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ModernTheme => modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: ComponentTheme | BaseTheme | ExtraTheme): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const isScreenModeSystem = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): screenMode is ScreenModeSystem =>\n isThemeModern(theme as ModernTheme) && screenModes[2] === screenMode;\n\nexport const getScreenMode = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): ScreenMode => {\n if (isScreenModeSystem(theme, screenMode)) {\n const matchesDarkScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;\n return matchesDarkScheme ? screenModes[1] : screenModes[0];\n }\n return screenMode;\n};\n\nexport const getThemeClassName = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n) => {\n if (!isThemeModern(theme)) {\n return `np-theme-${theme}`;\n }\n\n let classes = `np-theme-personal`;\n\n if (isExtraTheme(theme)) {\n classes += ` ${classes}--${theme}`;\n } else if (screenModes[1] === screenMode) {\n classes += ` ${classes}--${screenMode}`;\n }\n\n return classes;\n};\n","import { useContext, useMemo } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\nimport type { ComponentTheme, BaseTheme, ScreenMode, ExtraTheme } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport {\n isThemeModern,\n isForestGreenTheme,\n isScreenModeDark,\n getScreenMode,\n getThemeClassName,\n} from './helpers';\n\ninterface ThemeHookValue {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n isModern: boolean;\n isForestGreenTheme: boolean;\n isScreenModeDark: boolean;\n getScreenMode: ScreenMode;\n className: string;\n}\n\nconst FALLBACK_VALUES = {\n theme: DEFAULT_BASE_THEME,\n screenMode: DEFAULT_SCREEN_MODE,\n};\n\nconst isNotProduction = () => {\n try {\n return ['localhost', 'dev-wi.se'].includes(window.location.hostname);\n } catch {\n return false;\n }\n};\n\nexport const useTheme = (): ThemeHookValue => {\n const theming = useContext(ThemeContext);\n\n if (!theming && isNotProduction()) {\n // eslint-disable-next-line no-console\n console.warn('Call to useTheme outside a ThemeProvider');\n }\n\n const { theme, screenMode: contextScreenMode } = theming ?? FALLBACK_VALUES;\n const screenMode =\n theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE : getScreenMode(theme, contextScreenMode);\n\n return useMemo(\n () => ({\n theme,\n screenMode,\n isModern: isThemeModern(theme),\n isForestGreenTheme: isForestGreenTheme(theme),\n isScreenModeDark: isScreenModeDark(theme, screenMode),\n getScreenMode: getScreenMode(theme, screenMode),\n className: getThemeClassName(theme, screenMode),\n }),\n [theme, screenMode],\n );\n};\n","import classNames from 'classnames';\nimport { ReactNode } from 'react';\n\nimport { useTheme } from './useTheme';\n\ntype ThemedChildrenProps = { className?: string; children: ReactNode };\n\nexport const ThemedChildren = ({ className = undefined, children }: ThemedChildrenProps) => {\n const { className: themeClass } = useTheme();\n\n return <div className={classNames(themeClass, className)}>{children}</div>;\n};\n","import { createContext, PropsWithChildren, useContext, useState, useEffect, useMemo } from 'react';\n\nimport { ThemedChildren } from './ThemedChildren';\nimport type { ComponentTheme, BaseTheme, ExtraTheme, ScreenMode, Theming } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport { getScreenMode, getThemeClassName } from './helpers';\n\nexport const ThemeContext = createContext<\n | {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n }\n | undefined\n>(undefined);\n\ntype ThemeProviderProps = PropsWithChildren<Theming> & { className?: string };\n\nexport const ThemeProvider = ({\n theme = DEFAULT_BASE_THEME,\n screenMode = DEFAULT_SCREEN_MODE,\n isNotRootProvider = false,\n children,\n className = undefined,\n}: ThemeProviderProps) => {\n const isContextRoot = useContext(ThemeContext) === undefined;\n const [currentScreenMode, setCurrentScreenMode] = useState(getScreenMode(theme, screenMode));\n\n // RegEx to check for `np-theme-` class name\n // eslint-disable-next-line react-hooks/exhaustive-deps\n const themeClass = new RegExp(/\\bnp-theme-[a-z-]+\\b/, 'g');\n\n // useEffect hook used to apply the theme class to the HTML element\n useEffect(() => {\n setCurrentScreenMode(getScreenMode(theme, screenMode));\n\n if (!isNotRootProvider && isContextRoot) {\n // Remove all the theme classes from the documentElement\n document.documentElement.className.match(themeClass)?.forEach((item) => {\n document.documentElement.classList.remove(item);\n });\n\n getThemeClassName(theme, currentScreenMode)\n .split(' ')\n .forEach((item) => {\n document.documentElement.classList.add(item);\n });\n }\n }, [isNotRootProvider, isContextRoot, theme, screenMode, themeClass]);\n\n const contextValue = useMemo(() => ({ theme, screenMode }), [theme, screenMode]);\n\n return (\n <ThemeContext.Provider value={contextValue}>\n <ThemedChildren className={className}>{children}</ThemedChildren>\n </ThemeContext.Provider>\n );\n};\n"],"names":["baseThemes","extraThemes","screenModes","modernThemes","concat","DEFAULT_BASE_THEME","DEFAULT_SCREEN_MODE","isThemeModern","theme","includes","isExtraTheme","isForestGreenTheme","isScreenModeDark","screenMode","isScreenModeSystem","getScreenMode","matchesDarkScheme","window","matchMedia","matches","getThemeClassName","classes","FALLBACK_VALUES","isNotProduction","location","hostname","_unused","useTheme","theming","useContext","ThemeContext","console","warn","_ref","contextScreenMode","useMemo","isModern","className","ThemedChildren","_ref$className","undefined","children","_useTheme","themeClass","_jsx","classNames","createContext","ThemeProvider","_ref$theme","_ref$screenMode","_ref$isNotRootProvide","isNotRootProvider","isContextRoot","_useState","useState","_useState2","_slicedToArray","currentScreenMode","setCurrentScreenMode","RegExp","useEffect","_document$documentEle","document","documentElement","match","forEach","item","classList","remove","split","add","contextValue","Provider","value"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/const.ts","../../src/helpers.ts","../../src/useTheme.ts","../../src/ThemedChildren.tsx","../../src/ThemeProvider.tsx"],"sourcesContent":["// TODO: Change 'light' with 'legacy' in the future\nexport const baseThemes = ['light', 'personal'] as const;\nexport const extraThemes = ['forest-green', 'bright-green'] as const;\nexport const screenModes = ['light', 'dark'] as const;\nexport const modernThemes = [baseThemes[1], ...extraThemes] as const;\n\n// TODO: componentThemes returned back for backward compatibility, refactor this place in the future\nexport type ComponentTheme = (typeof baseThemes)[number];\nexport type ModernTheme = (typeof modernThemes)[number];\nexport type BaseTheme = (typeof baseThemes)[number];\nexport type ExtraTheme = (typeof extraThemes)[number];\nexport type ForestGreenTheme = (typeof extraThemes)[0];\nexport type ScreenMode = (typeof screenModes)[number];\nexport type ScreenModeDark = (typeof screenModes)[1];\n\nexport const DEFAULT_BASE_THEME = 'light' as const;\nexport const DEFAULT_SCREEN_MODE = 'light' as const;\n\nexport type Theming = {\n theme?: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode?: ScreenMode;\n isNotRootProvider?: boolean | undefined;\n};\n","import type {\n ComponentTheme,\n ModernTheme,\n BaseTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ModernTheme => modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: ComponentTheme | BaseTheme | ExtraTheme): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const getThemeClassName = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n) => {\n if (!isThemeModern(theme)) {\n return `np-theme-${theme}`;\n }\n\n let classes = `np-theme-personal`;\n\n if (isExtraTheme(theme)) {\n classes += ` ${classes}--${theme}`;\n } else if (screenModes[1] === screenMode) {\n classes += ` ${classes}--${screenMode}`;\n }\n\n return classes;\n};\n","import { useContext, useMemo } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\nimport type { ComponentTheme, BaseTheme, ScreenMode, ExtraTheme } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport { isThemeModern, isForestGreenTheme, isScreenModeDark, getThemeClassName } from './helpers';\n\ninterface ThemeHookValue {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n isModern: boolean;\n isForestGreenTheme: boolean;\n isScreenModeDark: boolean;\n className: string;\n}\n\nconst FALLBACK_VALUES = {\n theme: DEFAULT_BASE_THEME,\n screenMode: DEFAULT_SCREEN_MODE,\n};\n\nconst isNotProduction = () => {\n try {\n return ['localhost', 'dev-wi.se'].includes(window.location.hostname);\n } catch {\n return false;\n }\n};\n\nexport const useTheme = (): ThemeHookValue => {\n const theming = useContext(ThemeContext);\n\n if (!theming && isNotProduction()) {\n // eslint-disable-next-line no-console\n console.warn('Call to useTheme outside a ThemeProvider');\n }\n\n const { theme, screenMode: contextScreenMode } = theming ?? FALLBACK_VALUES;\n\n const screenMode = theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE : contextScreenMode;\n\n return useMemo(\n () => ({\n theme,\n screenMode,\n isModern: isThemeModern(theme),\n isForestGreenTheme: isForestGreenTheme(theme),\n isScreenModeDark: isScreenModeDark(theme, screenMode),\n className: getThemeClassName(theme, screenMode),\n }),\n [theme, screenMode],\n );\n};\n","import classNames from 'classnames';\nimport { ReactNode } from 'react';\n\nimport { useTheme } from './useTheme';\n\ntype ThemedChildrenProps = { className?: string; children: ReactNode };\n\nexport const ThemedChildren = ({ className = undefined, children }: ThemedChildrenProps) => {\n const { className: themeClass } = useTheme();\n\n return <div className={classNames(themeClass, className)}>{children}</div>;\n};\n","import { createContext, PropsWithChildren, useContext, useEffect, useMemo } from 'react';\n\nimport { ThemedChildren } from './ThemedChildren';\nimport type { ComponentTheme, BaseTheme, ExtraTheme, ScreenMode, Theming } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport { getThemeClassName } from './helpers';\n\nexport const ThemeContext = createContext<\n | {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n }\n | undefined\n>(undefined);\n\ntype ThemeProviderProps = PropsWithChildren<Theming> & { className?: string };\n\nexport const ThemeProvider = ({\n theme = DEFAULT_BASE_THEME,\n screenMode = DEFAULT_SCREEN_MODE,\n isNotRootProvider = false,\n children,\n className = undefined,\n}: ThemeProviderProps) => {\n const isContextRoot = useContext(ThemeContext) === undefined;\n\n // RegEx to check for `np-theme-` class name\n // eslint-disable-next-line react-hooks/exhaustive-deps\n const themeClass = new RegExp(/\\bnp-theme-[a-z-]+\\b/, 'g');\n\n // useEffect hook used to apply the theme class to the HTML element\n useEffect(() => {\n if (!isNotRootProvider && isContextRoot) {\n // Remove all the theme classes from the documentElement\n document.documentElement.className.match(themeClass)?.forEach((item) => {\n document.documentElement.classList.remove(item);\n });\n getThemeClassName(theme, screenMode)\n .split(' ')\n .forEach((item) => {\n document.documentElement.classList.add(item);\n });\n }\n }, [isNotRootProvider, isContextRoot, theme, screenMode, themeClass]);\n\n const contextValue = useMemo(() => ({ theme, screenMode }), [screenMode, theme]);\n\n return (\n <ThemeContext.Provider value={contextValue}>\n <ThemedChildren className={className}>{children}</ThemedChildren>\n </ThemeContext.Provider>\n );\n};\n"],"names":["baseThemes","extraThemes","screenModes","modernThemes","concat","DEFAULT_BASE_THEME","DEFAULT_SCREEN_MODE","isThemeModern","theme","includes","isExtraTheme","isForestGreenTheme","isScreenModeDark","screenMode","getThemeClassName","classes","FALLBACK_VALUES","isNotProduction","window","location","hostname","_unused","useTheme","theming","useContext","ThemeContext","console","warn","_ref","contextScreenMode","useMemo","isModern","className","ThemedChildren","_ref$className","undefined","children","_useTheme","themeClass","_jsx","classNames","createContext","ThemeProvider","_ref$theme","_ref$screenMode","_ref$isNotRootProvide","isNotRootProvider","isContextRoot","RegExp","useEffect","_document$documentEle","document","documentElement","match","forEach","item","classList","remove","split","add","contextValue","Provider","value"],"mappings":"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"}
|
package/dist/es/index.d.ts
CHANGED
|
@@ -10,8 +10,7 @@ declare const extraThemes: readonly [
|
|
|
10
10
|
];
|
|
11
11
|
declare const screenModes: readonly [
|
|
12
12
|
"light",
|
|
13
|
-
"dark"
|
|
14
|
-
"system"
|
|
13
|
+
"dark"
|
|
15
14
|
];
|
|
16
15
|
// TODO: componentThemes returned back for backward compatibility, refactor this place in the future
|
|
17
16
|
type ComponentTheme = (typeof baseThemes)[number];
|
|
@@ -27,8 +26,6 @@ declare const isThemeModern: (theme: ComponentTheme | BaseTheme | ExtraTheme) =>
|
|
|
27
26
|
declare const isExtraTheme: (theme: ComponentTheme | BaseTheme | ExtraTheme) => theme is "forest-green" | "bright-green";
|
|
28
27
|
declare const isForestGreenTheme: (theme: ComponentTheme | BaseTheme | ExtraTheme) => theme is "forest-green";
|
|
29
28
|
declare const isScreenModeDark: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => screenMode is "dark";
|
|
30
|
-
declare const isScreenModeSystem: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => screenMode is "system";
|
|
31
|
-
declare const getScreenMode: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => ScreenMode;
|
|
32
29
|
declare const getThemeClassName: (theme: ComponentTheme | BaseTheme | ExtraTheme, screenMode: ScreenMode) => string;
|
|
33
30
|
type ThemeProviderProps = PropsWithChildren<Theming> & {
|
|
34
31
|
className?: string;
|
|
@@ -40,9 +37,8 @@ interface ThemeHookValue {
|
|
|
40
37
|
isModern: boolean;
|
|
41
38
|
isForestGreenTheme: boolean;
|
|
42
39
|
isScreenModeDark: boolean;
|
|
43
|
-
getScreenMode: ScreenMode;
|
|
44
40
|
className: string;
|
|
45
41
|
}
|
|
46
42
|
declare const useTheme: () => ThemeHookValue;
|
|
47
43
|
export type { ComponentTheme, BaseTheme, ExtraTheme, ScreenMode, Theming };
|
|
48
|
-
export { isThemeModern, isExtraTheme, isForestGreenTheme, isScreenModeDark,
|
|
44
|
+
export { isThemeModern, isExtraTheme, isForestGreenTheme, isScreenModeDark, getThemeClassName, ThemeProvider, useTheme };
|
package/dist/es/index.js
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
|
|
2
1
|
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { useContext, useMemo, createContext,
|
|
2
|
+
import { useContext, useMemo, createContext, useEffect } from 'react';
|
|
4
3
|
import classNames from 'classnames';
|
|
5
4
|
|
|
6
5
|
// TODO: Change 'light' with 'legacy' in the future
|
|
7
6
|
var baseThemes = ['light', 'personal'];
|
|
8
7
|
var extraThemes = ['forest-green', 'bright-green'];
|
|
9
|
-
var screenModes = ['light', 'dark'
|
|
8
|
+
var screenModes = ['light', 'dark'];
|
|
10
9
|
var modernThemes = [baseThemes[1]].concat(extraThemes);
|
|
11
10
|
var DEFAULT_BASE_THEME = 'light';
|
|
12
11
|
var DEFAULT_SCREEN_MODE = 'light';
|
|
@@ -23,16 +22,6 @@ var isForestGreenTheme = function isForestGreenTheme(theme) {
|
|
|
23
22
|
var isScreenModeDark = function isScreenModeDark(theme, screenMode) {
|
|
24
23
|
return isThemeModern(theme) && screenModes[1] === screenMode;
|
|
25
24
|
};
|
|
26
|
-
var isScreenModeSystem = function isScreenModeSystem(theme, screenMode) {
|
|
27
|
-
return isThemeModern(theme) && screenModes[2] === screenMode;
|
|
28
|
-
};
|
|
29
|
-
var getScreenMode = function getScreenMode(theme, screenMode) {
|
|
30
|
-
if (isScreenModeSystem(theme, screenMode)) {
|
|
31
|
-
var matchesDarkScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
32
|
-
return matchesDarkScheme ? screenModes[1] : screenModes[0];
|
|
33
|
-
}
|
|
34
|
-
return screenMode;
|
|
35
|
-
};
|
|
36
25
|
var getThemeClassName = function getThemeClassName(theme, screenMode) {
|
|
37
26
|
if (!isThemeModern(theme)) {
|
|
38
27
|
return "np-theme-".concat(theme);
|
|
@@ -66,7 +55,7 @@ var useTheme = function useTheme() {
|
|
|
66
55
|
var _ref = theming !== null && theming !== void 0 ? theming : FALLBACK_VALUES,
|
|
67
56
|
theme = _ref.theme,
|
|
68
57
|
contextScreenMode = _ref.screenMode;
|
|
69
|
-
var screenMode = theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE :
|
|
58
|
+
var screenMode = theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE : contextScreenMode;
|
|
70
59
|
return useMemo(function () {
|
|
71
60
|
return {
|
|
72
61
|
theme: theme,
|
|
@@ -74,7 +63,6 @@ var useTheme = function useTheme() {
|
|
|
74
63
|
isModern: isThemeModern(theme),
|
|
75
64
|
isForestGreenTheme: isForestGreenTheme(theme),
|
|
76
65
|
isScreenModeDark: isScreenModeDark(theme, screenMode),
|
|
77
|
-
getScreenMode: getScreenMode(theme, screenMode),
|
|
78
66
|
className: getThemeClassName(theme, screenMode)
|
|
79
67
|
};
|
|
80
68
|
}, [theme, screenMode]);
|
|
@@ -104,23 +92,18 @@ var ThemeProvider = function ThemeProvider(_ref) {
|
|
|
104
92
|
_ref$className = _ref.className,
|
|
105
93
|
className = _ref$className === void 0 ? undefined : _ref$className;
|
|
106
94
|
var isContextRoot = useContext(ThemeContext) === undefined;
|
|
107
|
-
var _useState = useState(getScreenMode(theme, screenMode)),
|
|
108
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
109
|
-
currentScreenMode = _useState2[0],
|
|
110
|
-
setCurrentScreenMode = _useState2[1];
|
|
111
95
|
// RegEx to check for `np-theme-` class name
|
|
112
96
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
113
97
|
var themeClass = new RegExp(/\bnp-theme-[a-z-]+\b/, 'g');
|
|
114
98
|
// useEffect hook used to apply the theme class to the HTML element
|
|
115
99
|
useEffect(function () {
|
|
116
|
-
setCurrentScreenMode(getScreenMode(theme, screenMode));
|
|
117
100
|
if (!isNotRootProvider && isContextRoot) {
|
|
118
101
|
var _document$documentEle;
|
|
119
102
|
// Remove all the theme classes from the documentElement
|
|
120
103
|
(_document$documentEle = document.documentElement.className.match(themeClass)) === null || _document$documentEle === void 0 ? void 0 : _document$documentEle.forEach(function (item) {
|
|
121
104
|
document.documentElement.classList.remove(item);
|
|
122
105
|
});
|
|
123
|
-
getThemeClassName(theme,
|
|
106
|
+
getThemeClassName(theme, screenMode).split(' ').forEach(function (item) {
|
|
124
107
|
document.documentElement.classList.add(item);
|
|
125
108
|
});
|
|
126
109
|
}
|
|
@@ -130,7 +113,7 @@ var ThemeProvider = function ThemeProvider(_ref) {
|
|
|
130
113
|
theme: theme,
|
|
131
114
|
screenMode: screenMode
|
|
132
115
|
};
|
|
133
|
-
}, [
|
|
116
|
+
}, [screenMode, theme]);
|
|
134
117
|
return jsx(ThemeContext.Provider, {
|
|
135
118
|
value: contextValue,
|
|
136
119
|
children: jsx(ThemedChildren, {
|
|
@@ -140,5 +123,5 @@ var ThemeProvider = function ThemeProvider(_ref) {
|
|
|
140
123
|
});
|
|
141
124
|
};
|
|
142
125
|
|
|
143
|
-
export { ThemeProvider,
|
|
126
|
+
export { ThemeProvider, getThemeClassName, isExtraTheme, isForestGreenTheme, isScreenModeDark, isThemeModern, useTheme };
|
|
144
127
|
//# sourceMappingURL=index.js.map
|
package/dist/es/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/const.ts","../../src/helpers.ts","../../src/useTheme.ts","../../src/ThemedChildren.tsx","../../src/ThemeProvider.tsx"],"sourcesContent":["// TODO: Change 'light' with 'legacy' in the future\nexport const baseThemes = ['light', 'personal'] as const;\nexport const extraThemes = ['forest-green', 'bright-green'] as const;\nexport const screenModes = ['light', 'dark', 'system'] as const;\nexport const modernThemes = [baseThemes[1], ...extraThemes] as const;\n\n// TODO: componentThemes returned back for backward compatibility, refactor this place in the future\nexport type ComponentTheme = (typeof baseThemes)[number];\nexport type ModernTheme = (typeof modernThemes)[number];\nexport type BaseTheme = (typeof baseThemes)[number];\nexport type ExtraTheme = (typeof extraThemes)[number];\nexport type ForestGreenTheme = (typeof extraThemes)[0];\nexport type ScreenMode = (typeof screenModes)[number];\nexport type ScreenModeDark = (typeof screenModes)[1];\nexport type ScreenModeSystem = (typeof screenModes)[2];\n\nexport const DEFAULT_BASE_THEME = 'light' as const;\nexport const DEFAULT_SCREEN_MODE = 'light' as const;\n\nexport type Theming = {\n theme?: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode?: ScreenMode;\n isNotRootProvider?: boolean | undefined;\n};\n","import type {\n ComponentTheme,\n ModernTheme,\n BaseTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n ScreenModeSystem,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ModernTheme => modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: ComponentTheme | BaseTheme | ExtraTheme): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const isScreenModeSystem = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): screenMode is ScreenModeSystem =>\n isThemeModern(theme as ModernTheme) && screenModes[2] === screenMode;\n\nexport const getScreenMode = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): ScreenMode => {\n if (isScreenModeSystem(theme, screenMode)) {\n const matchesDarkScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;\n return matchesDarkScheme ? screenModes[1] : screenModes[0];\n }\n return screenMode;\n};\n\nexport const getThemeClassName = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n) => {\n if (!isThemeModern(theme)) {\n return `np-theme-${theme}`;\n }\n\n let classes = `np-theme-personal`;\n\n if (isExtraTheme(theme)) {\n classes += ` ${classes}--${theme}`;\n } else if (screenModes[1] === screenMode) {\n classes += ` ${classes}--${screenMode}`;\n }\n\n return classes;\n};\n","import { useContext, useMemo } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\nimport type { ComponentTheme, BaseTheme, ScreenMode, ExtraTheme } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport {\n isThemeModern,\n isForestGreenTheme,\n isScreenModeDark,\n getScreenMode,\n getThemeClassName,\n} from './helpers';\n\ninterface ThemeHookValue {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n isModern: boolean;\n isForestGreenTheme: boolean;\n isScreenModeDark: boolean;\n getScreenMode: ScreenMode;\n className: string;\n}\n\nconst FALLBACK_VALUES = {\n theme: DEFAULT_BASE_THEME,\n screenMode: DEFAULT_SCREEN_MODE,\n};\n\nconst isNotProduction = () => {\n try {\n return ['localhost', 'dev-wi.se'].includes(window.location.hostname);\n } catch {\n return false;\n }\n};\n\nexport const useTheme = (): ThemeHookValue => {\n const theming = useContext(ThemeContext);\n\n if (!theming && isNotProduction()) {\n // eslint-disable-next-line no-console\n console.warn('Call to useTheme outside a ThemeProvider');\n }\n\n const { theme, screenMode: contextScreenMode } = theming ?? FALLBACK_VALUES;\n const screenMode =\n theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE : getScreenMode(theme, contextScreenMode);\n\n return useMemo(\n () => ({\n theme,\n screenMode,\n isModern: isThemeModern(theme),\n isForestGreenTheme: isForestGreenTheme(theme),\n isScreenModeDark: isScreenModeDark(theme, screenMode),\n getScreenMode: getScreenMode(theme, screenMode),\n className: getThemeClassName(theme, screenMode),\n }),\n [theme, screenMode],\n );\n};\n","import classNames from 'classnames';\nimport { ReactNode } from 'react';\n\nimport { useTheme } from './useTheme';\n\ntype ThemedChildrenProps = { className?: string; children: ReactNode };\n\nexport const ThemedChildren = ({ className = undefined, children }: ThemedChildrenProps) => {\n const { className: themeClass } = useTheme();\n\n return <div className={classNames(themeClass, className)}>{children}</div>;\n};\n","import { createContext, PropsWithChildren, useContext, useState, useEffect, useMemo } from 'react';\n\nimport { ThemedChildren } from './ThemedChildren';\nimport type { ComponentTheme, BaseTheme, ExtraTheme, ScreenMode, Theming } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport { getScreenMode, getThemeClassName } from './helpers';\n\nexport const ThemeContext = createContext<\n | {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n }\n | undefined\n>(undefined);\n\ntype ThemeProviderProps = PropsWithChildren<Theming> & { className?: string };\n\nexport const ThemeProvider = ({\n theme = DEFAULT_BASE_THEME,\n screenMode = DEFAULT_SCREEN_MODE,\n isNotRootProvider = false,\n children,\n className = undefined,\n}: ThemeProviderProps) => {\n const isContextRoot = useContext(ThemeContext) === undefined;\n const [currentScreenMode, setCurrentScreenMode] = useState(getScreenMode(theme, screenMode));\n\n // RegEx to check for `np-theme-` class name\n // eslint-disable-next-line react-hooks/exhaustive-deps\n const themeClass = new RegExp(/\\bnp-theme-[a-z-]+\\b/, 'g');\n\n // useEffect hook used to apply the theme class to the HTML element\n useEffect(() => {\n setCurrentScreenMode(getScreenMode(theme, screenMode));\n\n if (!isNotRootProvider && isContextRoot) {\n // Remove all the theme classes from the documentElement\n document.documentElement.className.match(themeClass)?.forEach((item) => {\n document.documentElement.classList.remove(item);\n });\n\n getThemeClassName(theme, currentScreenMode)\n .split(' ')\n .forEach((item) => {\n document.documentElement.classList.add(item);\n });\n }\n }, [isNotRootProvider, isContextRoot, theme, screenMode, themeClass]);\n\n const contextValue = useMemo(() => ({ theme, screenMode }), [theme, screenMode]);\n\n return (\n <ThemeContext.Provider value={contextValue}>\n <ThemedChildren className={className}>{children}</ThemedChildren>\n </ThemeContext.Provider>\n );\n};\n"],"names":["baseThemes","extraThemes","screenModes","modernThemes","concat","DEFAULT_BASE_THEME","DEFAULT_SCREEN_MODE","isThemeModern","theme","includes","isExtraTheme","isForestGreenTheme","isScreenModeDark","screenMode","isScreenModeSystem","getScreenMode","matchesDarkScheme","window","matchMedia","matches","getThemeClassName","classes","FALLBACK_VALUES","isNotProduction","location","hostname","_unused","useTheme","theming","useContext","ThemeContext","console","warn","_ref","contextScreenMode","useMemo","isModern","className","ThemedChildren","_ref$className","undefined","children","_useTheme","themeClass","_jsx","classNames","createContext","ThemeProvider","_ref$theme","_ref$screenMode","_ref$isNotRootProvide","isNotRootProvider","isContextRoot","_useState","useState","_useState2","_slicedToArray","currentScreenMode","setCurrentScreenMode","RegExp","useEffect","_document$documentEle","document","documentElement","match","forEach","item","classList","remove","split","add","contextValue","Provider","value"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/const.ts","../../src/helpers.ts","../../src/useTheme.ts","../../src/ThemedChildren.tsx","../../src/ThemeProvider.tsx"],"sourcesContent":["// TODO: Change 'light' with 'legacy' in the future\nexport const baseThemes = ['light', 'personal'] as const;\nexport const extraThemes = ['forest-green', 'bright-green'] as const;\nexport const screenModes = ['light', 'dark'] as const;\nexport const modernThemes = [baseThemes[1], ...extraThemes] as const;\n\n// TODO: componentThemes returned back for backward compatibility, refactor this place in the future\nexport type ComponentTheme = (typeof baseThemes)[number];\nexport type ModernTheme = (typeof modernThemes)[number];\nexport type BaseTheme = (typeof baseThemes)[number];\nexport type ExtraTheme = (typeof extraThemes)[number];\nexport type ForestGreenTheme = (typeof extraThemes)[0];\nexport type ScreenMode = (typeof screenModes)[number];\nexport type ScreenModeDark = (typeof screenModes)[1];\n\nexport const DEFAULT_BASE_THEME = 'light' as const;\nexport const DEFAULT_SCREEN_MODE = 'light' as const;\n\nexport type Theming = {\n theme?: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode?: ScreenMode;\n isNotRootProvider?: boolean | undefined;\n};\n","import type {\n ComponentTheme,\n ModernTheme,\n BaseTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ModernTheme => modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: ComponentTheme | BaseTheme | ExtraTheme): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const getThemeClassName = (\n theme: ComponentTheme | BaseTheme | ExtraTheme,\n screenMode: ScreenMode,\n) => {\n if (!isThemeModern(theme)) {\n return `np-theme-${theme}`;\n }\n\n let classes = `np-theme-personal`;\n\n if (isExtraTheme(theme)) {\n classes += ` ${classes}--${theme}`;\n } else if (screenModes[1] === screenMode) {\n classes += ` ${classes}--${screenMode}`;\n }\n\n return classes;\n};\n","import { useContext, useMemo } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\nimport type { ComponentTheme, BaseTheme, ScreenMode, ExtraTheme } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport { isThemeModern, isForestGreenTheme, isScreenModeDark, getThemeClassName } from './helpers';\n\ninterface ThemeHookValue {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n isModern: boolean;\n isForestGreenTheme: boolean;\n isScreenModeDark: boolean;\n className: string;\n}\n\nconst FALLBACK_VALUES = {\n theme: DEFAULT_BASE_THEME,\n screenMode: DEFAULT_SCREEN_MODE,\n};\n\nconst isNotProduction = () => {\n try {\n return ['localhost', 'dev-wi.se'].includes(window.location.hostname);\n } catch {\n return false;\n }\n};\n\nexport const useTheme = (): ThemeHookValue => {\n const theming = useContext(ThemeContext);\n\n if (!theming && isNotProduction()) {\n // eslint-disable-next-line no-console\n console.warn('Call to useTheme outside a ThemeProvider');\n }\n\n const { theme, screenMode: contextScreenMode } = theming ?? FALLBACK_VALUES;\n\n const screenMode = theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE : contextScreenMode;\n\n return useMemo(\n () => ({\n theme,\n screenMode,\n isModern: isThemeModern(theme),\n isForestGreenTheme: isForestGreenTheme(theme),\n isScreenModeDark: isScreenModeDark(theme, screenMode),\n className: getThemeClassName(theme, screenMode),\n }),\n [theme, screenMode],\n );\n};\n","import classNames from 'classnames';\nimport { ReactNode } from 'react';\n\nimport { useTheme } from './useTheme';\n\ntype ThemedChildrenProps = { className?: string; children: ReactNode };\n\nexport const ThemedChildren = ({ className = undefined, children }: ThemedChildrenProps) => {\n const { className: themeClass } = useTheme();\n\n return <div className={classNames(themeClass, className)}>{children}</div>;\n};\n","import { createContext, PropsWithChildren, useContext, useEffect, useMemo } from 'react';\n\nimport { ThemedChildren } from './ThemedChildren';\nimport type { ComponentTheme, BaseTheme, ExtraTheme, ScreenMode, Theming } from './const';\nimport { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';\nimport { getThemeClassName } from './helpers';\n\nexport const ThemeContext = createContext<\n | {\n theme: ComponentTheme | BaseTheme | ExtraTheme;\n screenMode: ScreenMode;\n }\n | undefined\n>(undefined);\n\ntype ThemeProviderProps = PropsWithChildren<Theming> & { className?: string };\n\nexport const ThemeProvider = ({\n theme = DEFAULT_BASE_THEME,\n screenMode = DEFAULT_SCREEN_MODE,\n isNotRootProvider = false,\n children,\n className = undefined,\n}: ThemeProviderProps) => {\n const isContextRoot = useContext(ThemeContext) === undefined;\n\n // RegEx to check for `np-theme-` class name\n // eslint-disable-next-line react-hooks/exhaustive-deps\n const themeClass = new RegExp(/\\bnp-theme-[a-z-]+\\b/, 'g');\n\n // useEffect hook used to apply the theme class to the HTML element\n useEffect(() => {\n if (!isNotRootProvider && isContextRoot) {\n // Remove all the theme classes from the documentElement\n document.documentElement.className.match(themeClass)?.forEach((item) => {\n document.documentElement.classList.remove(item);\n });\n getThemeClassName(theme, screenMode)\n .split(' ')\n .forEach((item) => {\n document.documentElement.classList.add(item);\n });\n }\n }, [isNotRootProvider, isContextRoot, theme, screenMode, themeClass]);\n\n const contextValue = useMemo(() => ({ theme, screenMode }), [screenMode, theme]);\n\n return (\n <ThemeContext.Provider value={contextValue}>\n <ThemedChildren className={className}>{children}</ThemedChildren>\n </ThemeContext.Provider>\n );\n};\n"],"names":["baseThemes","extraThemes","screenModes","modernThemes","concat","DEFAULT_BASE_THEME","DEFAULT_SCREEN_MODE","isThemeModern","theme","includes","isExtraTheme","isForestGreenTheme","isScreenModeDark","screenMode","getThemeClassName","classes","FALLBACK_VALUES","isNotProduction","window","location","hostname","_unused","useTheme","theming","useContext","ThemeContext","console","warn","_ref","contextScreenMode","useMemo","isModern","className","ThemedChildren","_ref$className","undefined","children","_useTheme","themeClass","_jsx","classNames","createContext","ThemeProvider","_ref$theme","_ref$screenMode","_ref$isNotRootProvide","isNotRootProvider","isContextRoot","RegExp","useEffect","_document$documentEle","document","documentElement","match","forEach","item","classList","remove","split","add","contextValue","Provider","value"],"mappings":"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"}
|
package/package.json
CHANGED
package/src/ThemeProvider.tsx
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { createContext, PropsWithChildren, useContext,
|
|
1
|
+
import { createContext, PropsWithChildren, useContext, useEffect, useMemo } from 'react';
|
|
2
2
|
|
|
3
3
|
import { ThemedChildren } from './ThemedChildren';
|
|
4
4
|
import type { ComponentTheme, BaseTheme, ExtraTheme, ScreenMode, Theming } from './const';
|
|
5
5
|
import { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';
|
|
6
|
-
import {
|
|
6
|
+
import { getThemeClassName } from './helpers';
|
|
7
7
|
|
|
8
8
|
export const ThemeContext = createContext<
|
|
9
9
|
| {
|
|
@@ -23,7 +23,6 @@ export const ThemeProvider = ({
|
|
|
23
23
|
className = undefined,
|
|
24
24
|
}: ThemeProviderProps) => {
|
|
25
25
|
const isContextRoot = useContext(ThemeContext) === undefined;
|
|
26
|
-
const [currentScreenMode, setCurrentScreenMode] = useState(getScreenMode(theme, screenMode));
|
|
27
26
|
|
|
28
27
|
// RegEx to check for `np-theme-` class name
|
|
29
28
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -31,15 +30,12 @@ export const ThemeProvider = ({
|
|
|
31
30
|
|
|
32
31
|
// useEffect hook used to apply the theme class to the HTML element
|
|
33
32
|
useEffect(() => {
|
|
34
|
-
setCurrentScreenMode(getScreenMode(theme, screenMode));
|
|
35
|
-
|
|
36
33
|
if (!isNotRootProvider && isContextRoot) {
|
|
37
34
|
// Remove all the theme classes from the documentElement
|
|
38
35
|
document.documentElement.className.match(themeClass)?.forEach((item) => {
|
|
39
36
|
document.documentElement.classList.remove(item);
|
|
40
37
|
});
|
|
41
|
-
|
|
42
|
-
getThemeClassName(theme, currentScreenMode)
|
|
38
|
+
getThemeClassName(theme, screenMode)
|
|
43
39
|
.split(' ')
|
|
44
40
|
.forEach((item) => {
|
|
45
41
|
document.documentElement.classList.add(item);
|
|
@@ -47,7 +43,7 @@ export const ThemeProvider = ({
|
|
|
47
43
|
}
|
|
48
44
|
}, [isNotRootProvider, isContextRoot, theme, screenMode, themeClass]);
|
|
49
45
|
|
|
50
|
-
const contextValue = useMemo(() => ({ theme, screenMode }), [
|
|
46
|
+
const contextValue = useMemo(() => ({ theme, screenMode }), [screenMode, theme]);
|
|
51
47
|
|
|
52
48
|
return (
|
|
53
49
|
<ThemeContext.Provider value={contextValue}>
|
package/src/const.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// TODO: Change 'light' with 'legacy' in the future
|
|
2
2
|
export const baseThemes = ['light', 'personal'] as const;
|
|
3
3
|
export const extraThemes = ['forest-green', 'bright-green'] as const;
|
|
4
|
-
export const screenModes = ['light', 'dark'
|
|
4
|
+
export const screenModes = ['light', 'dark'] as const;
|
|
5
5
|
export const modernThemes = [baseThemes[1], ...extraThemes] as const;
|
|
6
6
|
|
|
7
7
|
// TODO: componentThemes returned back for backward compatibility, refactor this place in the future
|
|
@@ -12,7 +12,6 @@ export type ExtraTheme = (typeof extraThemes)[number];
|
|
|
12
12
|
export type ForestGreenTheme = (typeof extraThemes)[0];
|
|
13
13
|
export type ScreenMode = (typeof screenModes)[number];
|
|
14
14
|
export type ScreenModeDark = (typeof screenModes)[1];
|
|
15
|
-
export type ScreenModeSystem = (typeof screenModes)[2];
|
|
16
15
|
|
|
17
16
|
export const DEFAULT_BASE_THEME = 'light' as const;
|
|
18
17
|
export const DEFAULT_SCREEN_MODE = 'light' as const;
|
package/src/helpers.ts
CHANGED
|
@@ -6,7 +6,6 @@ import type {
|
|
|
6
6
|
ForestGreenTheme,
|
|
7
7
|
ScreenMode,
|
|
8
8
|
ScreenModeDark,
|
|
9
|
-
ScreenModeSystem,
|
|
10
9
|
} from './const';
|
|
11
10
|
import { extraThemes, screenModes, modernThemes } from './const';
|
|
12
11
|
|
|
@@ -27,23 +26,6 @@ export const isScreenModeDark = (
|
|
|
27
26
|
): screenMode is ScreenModeDark =>
|
|
28
27
|
isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;
|
|
29
28
|
|
|
30
|
-
export const isScreenModeSystem = (
|
|
31
|
-
theme: ComponentTheme | BaseTheme | ExtraTheme,
|
|
32
|
-
screenMode: ScreenMode,
|
|
33
|
-
): screenMode is ScreenModeSystem =>
|
|
34
|
-
isThemeModern(theme as ModernTheme) && screenModes[2] === screenMode;
|
|
35
|
-
|
|
36
|
-
export const getScreenMode = (
|
|
37
|
-
theme: ComponentTheme | BaseTheme | ExtraTheme,
|
|
38
|
-
screenMode: ScreenMode,
|
|
39
|
-
): ScreenMode => {
|
|
40
|
-
if (isScreenModeSystem(theme, screenMode)) {
|
|
41
|
-
const matchesDarkScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
42
|
-
return matchesDarkScheme ? screenModes[1] : screenModes[0];
|
|
43
|
-
}
|
|
44
|
-
return screenMode;
|
|
45
|
-
};
|
|
46
|
-
|
|
47
29
|
export const getThemeClassName = (
|
|
48
30
|
theme: ComponentTheme | BaseTheme | ExtraTheme,
|
|
49
31
|
screenMode: ScreenMode,
|
package/src/index.ts
CHANGED
package/src/useTheme.spec.tsx
CHANGED
|
@@ -18,7 +18,6 @@ describe('useTheme', () => {
|
|
|
18
18
|
isModern: false,
|
|
19
19
|
isForestGreenTheme: false,
|
|
20
20
|
isScreenModeDark: false,
|
|
21
|
-
getScreenMode: 'light',
|
|
22
21
|
className: 'np-theme-light',
|
|
23
22
|
});
|
|
24
23
|
|
|
@@ -41,7 +40,6 @@ describe('useTheme', () => {
|
|
|
41
40
|
isModern: true,
|
|
42
41
|
isForestGreenTheme: false,
|
|
43
42
|
isScreenModeDark: false,
|
|
44
|
-
getScreenMode: 'light',
|
|
45
43
|
className: 'np-theme-personal',
|
|
46
44
|
});
|
|
47
45
|
});
|
|
@@ -62,103 +60,6 @@ describe('useTheme', () => {
|
|
|
62
60
|
isModern: true,
|
|
63
61
|
isForestGreenTheme: true,
|
|
64
62
|
isScreenModeDark: false,
|
|
65
|
-
getScreenMode: 'light',
|
|
66
|
-
className: 'np-theme-personal np-theme-personal--forest-green',
|
|
67
|
-
});
|
|
68
|
-
});
|
|
69
|
-
|
|
70
|
-
it('returns forest-green theme with dark screen mode', () => {
|
|
71
|
-
const {
|
|
72
|
-
result: { current },
|
|
73
|
-
} = renderHook(() => useTheme(), {
|
|
74
|
-
wrapper: ThemeProvider,
|
|
75
|
-
initialProps: {
|
|
76
|
-
theme: 'forest-green' as const,
|
|
77
|
-
screenMode: 'dark' as const,
|
|
78
|
-
},
|
|
79
|
-
});
|
|
80
|
-
|
|
81
|
-
expect(current).toStrictEqual({
|
|
82
|
-
theme: 'forest-green',
|
|
83
|
-
screenMode: 'dark',
|
|
84
|
-
isModern: true,
|
|
85
|
-
isForestGreenTheme: true,
|
|
86
|
-
isScreenModeDark: true,
|
|
87
|
-
getScreenMode: 'dark',
|
|
88
|
-
className: 'np-theme-personal np-theme-personal--forest-green',
|
|
89
|
-
});
|
|
90
|
-
});
|
|
91
|
-
|
|
92
|
-
it("returns forest-green theme with 'light' system screen mode", () => {
|
|
93
|
-
Object.defineProperty(window, 'matchMedia', {
|
|
94
|
-
writable: true,
|
|
95
|
-
value: jest.fn().mockImplementation((query) => ({
|
|
96
|
-
matches: false,
|
|
97
|
-
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
98
|
-
media: query,
|
|
99
|
-
onchange: null,
|
|
100
|
-
addListener: jest.fn(), // Deprecated
|
|
101
|
-
removeListener: jest.fn(), // Deprecated
|
|
102
|
-
addEventListener: jest.fn(),
|
|
103
|
-
removeEventListener: jest.fn(),
|
|
104
|
-
dispatchEvent: jest.fn(),
|
|
105
|
-
})),
|
|
106
|
-
});
|
|
107
|
-
|
|
108
|
-
const {
|
|
109
|
-
result: { current },
|
|
110
|
-
} = renderHook(() => useTheme(), {
|
|
111
|
-
wrapper: ThemeProvider,
|
|
112
|
-
initialProps: {
|
|
113
|
-
theme: 'forest-green' as const,
|
|
114
|
-
screenMode: 'system' as const,
|
|
115
|
-
},
|
|
116
|
-
});
|
|
117
|
-
|
|
118
|
-
expect(current).toStrictEqual({
|
|
119
|
-
theme: 'forest-green',
|
|
120
|
-
screenMode: 'light',
|
|
121
|
-
isModern: true,
|
|
122
|
-
isForestGreenTheme: true,
|
|
123
|
-
isScreenModeDark: false,
|
|
124
|
-
getScreenMode: 'light',
|
|
125
|
-
className: 'np-theme-personal np-theme-personal--forest-green',
|
|
126
|
-
});
|
|
127
|
-
});
|
|
128
|
-
|
|
129
|
-
it("returns forest-green theme with 'dark' system screen mode", () => {
|
|
130
|
-
Object.defineProperty(window, 'matchMedia', {
|
|
131
|
-
writable: true,
|
|
132
|
-
value: jest.fn().mockImplementation((query) => ({
|
|
133
|
-
matches: true,
|
|
134
|
-
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
135
|
-
media: query,
|
|
136
|
-
onchange: null,
|
|
137
|
-
addListener: jest.fn(), // Deprecated
|
|
138
|
-
removeListener: jest.fn(), // Deprecated
|
|
139
|
-
addEventListener: jest.fn(),
|
|
140
|
-
removeEventListener: jest.fn(),
|
|
141
|
-
dispatchEvent: jest.fn(),
|
|
142
|
-
})),
|
|
143
|
-
});
|
|
144
|
-
|
|
145
|
-
const {
|
|
146
|
-
result: { current },
|
|
147
|
-
} = renderHook(() => useTheme(), {
|
|
148
|
-
wrapper: ThemeProvider,
|
|
149
|
-
initialProps: {
|
|
150
|
-
theme: 'forest-green' as const,
|
|
151
|
-
screenMode: 'system' as const,
|
|
152
|
-
},
|
|
153
|
-
});
|
|
154
|
-
|
|
155
|
-
expect(current).toStrictEqual({
|
|
156
|
-
theme: 'forest-green',
|
|
157
|
-
screenMode: 'dark',
|
|
158
|
-
isModern: true,
|
|
159
|
-
isForestGreenTheme: true,
|
|
160
|
-
isScreenModeDark: true,
|
|
161
|
-
getScreenMode: 'dark',
|
|
162
63
|
className: 'np-theme-personal np-theme-personal--forest-green',
|
|
163
64
|
});
|
|
164
65
|
});
|
|
@@ -179,104 +80,28 @@ describe('useTheme', () => {
|
|
|
179
80
|
isModern: true,
|
|
180
81
|
isForestGreenTheme: false,
|
|
181
82
|
isScreenModeDark: false,
|
|
182
|
-
getScreenMode: 'light',
|
|
183
83
|
className: 'np-theme-personal np-theme-personal--bright-green',
|
|
184
84
|
});
|
|
185
85
|
});
|
|
186
86
|
|
|
187
|
-
it('returns
|
|
87
|
+
it('returns default screen mode if used default light theme', () => {
|
|
188
88
|
const {
|
|
189
89
|
result: { current },
|
|
190
90
|
} = renderHook(() => useTheme(), {
|
|
191
91
|
wrapper: ThemeProvider,
|
|
192
92
|
initialProps: {
|
|
193
|
-
theme:
|
|
93
|
+
theme: DEFAULT_BASE_THEME,
|
|
194
94
|
screenMode: 'dark' as const,
|
|
195
95
|
},
|
|
196
96
|
});
|
|
197
97
|
|
|
198
98
|
expect(current).toStrictEqual({
|
|
199
|
-
theme:
|
|
200
|
-
screenMode:
|
|
201
|
-
isModern:
|
|
202
|
-
isForestGreenTheme: false,
|
|
203
|
-
isScreenModeDark: true,
|
|
204
|
-
getScreenMode: 'dark',
|
|
205
|
-
className: 'np-theme-personal np-theme-personal--bright-green',
|
|
206
|
-
});
|
|
207
|
-
});
|
|
208
|
-
|
|
209
|
-
it("returns bright-green theme with 'light' system screen mode", () => {
|
|
210
|
-
Object.defineProperty(window, 'matchMedia', {
|
|
211
|
-
writable: true,
|
|
212
|
-
value: jest.fn().mockImplementation((query) => ({
|
|
213
|
-
matches: false,
|
|
214
|
-
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
215
|
-
media: query,
|
|
216
|
-
onchange: null,
|
|
217
|
-
addListener: jest.fn(), // Deprecated
|
|
218
|
-
removeListener: jest.fn(), // Deprecated
|
|
219
|
-
addEventListener: jest.fn(),
|
|
220
|
-
removeEventListener: jest.fn(),
|
|
221
|
-
dispatchEvent: jest.fn(),
|
|
222
|
-
})),
|
|
223
|
-
});
|
|
224
|
-
|
|
225
|
-
const {
|
|
226
|
-
result: { current },
|
|
227
|
-
} = renderHook(() => useTheme(), {
|
|
228
|
-
wrapper: ThemeProvider,
|
|
229
|
-
initialProps: {
|
|
230
|
-
theme: 'bright-green' as const,
|
|
231
|
-
screenMode: 'system' as const,
|
|
232
|
-
},
|
|
233
|
-
});
|
|
234
|
-
|
|
235
|
-
expect(current).toStrictEqual({
|
|
236
|
-
theme: 'bright-green',
|
|
237
|
-
screenMode: 'light',
|
|
238
|
-
isModern: true,
|
|
99
|
+
theme: DEFAULT_BASE_THEME,
|
|
100
|
+
screenMode: DEFAULT_SCREEN_MODE,
|
|
101
|
+
isModern: false,
|
|
239
102
|
isForestGreenTheme: false,
|
|
240
103
|
isScreenModeDark: false,
|
|
241
|
-
|
|
242
|
-
className: 'np-theme-personal np-theme-personal--bright-green',
|
|
243
|
-
});
|
|
244
|
-
});
|
|
245
|
-
|
|
246
|
-
it("returns bright-green theme with 'dark' system screen mode", () => {
|
|
247
|
-
Object.defineProperty(window, 'matchMedia', {
|
|
248
|
-
writable: true,
|
|
249
|
-
value: jest.fn().mockImplementation((query) => ({
|
|
250
|
-
matches: true,
|
|
251
|
-
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
252
|
-
media: query,
|
|
253
|
-
onchange: null,
|
|
254
|
-
addListener: jest.fn(), // Deprecated
|
|
255
|
-
removeListener: jest.fn(), // Deprecated
|
|
256
|
-
addEventListener: jest.fn(),
|
|
257
|
-
removeEventListener: jest.fn(),
|
|
258
|
-
dispatchEvent: jest.fn(),
|
|
259
|
-
})),
|
|
260
|
-
});
|
|
261
|
-
|
|
262
|
-
const {
|
|
263
|
-
result: { current },
|
|
264
|
-
} = renderHook(() => useTheme(), {
|
|
265
|
-
wrapper: ThemeProvider,
|
|
266
|
-
initialProps: {
|
|
267
|
-
theme: 'bright-green' as const,
|
|
268
|
-
screenMode: 'system' as const,
|
|
269
|
-
},
|
|
270
|
-
});
|
|
271
|
-
|
|
272
|
-
expect(current).toStrictEqual({
|
|
273
|
-
theme: 'bright-green',
|
|
274
|
-
screenMode: 'dark',
|
|
275
|
-
isModern: true,
|
|
276
|
-
isForestGreenTheme: false,
|
|
277
|
-
isScreenModeDark: true,
|
|
278
|
-
getScreenMode: 'dark',
|
|
279
|
-
className: 'np-theme-personal np-theme-personal--bright-green',
|
|
104
|
+
className: 'np-theme-light',
|
|
280
105
|
});
|
|
281
106
|
});
|
|
282
107
|
|
|
@@ -297,7 +122,6 @@ describe('useTheme', () => {
|
|
|
297
122
|
isModern: true,
|
|
298
123
|
isForestGreenTheme: false,
|
|
299
124
|
isScreenModeDark: true,
|
|
300
|
-
getScreenMode: 'dark',
|
|
301
125
|
className: 'np-theme-personal np-theme-personal--dark',
|
|
302
126
|
});
|
|
303
127
|
});
|
|
@@ -322,7 +146,6 @@ describe('useTheme', () => {
|
|
|
322
146
|
isModern: false,
|
|
323
147
|
isForestGreenTheme: false,
|
|
324
148
|
isScreenModeDark: false,
|
|
325
|
-
getScreenMode: 'light',
|
|
326
149
|
className: 'np-theme-light',
|
|
327
150
|
});
|
|
328
151
|
|
|
@@ -346,7 +169,6 @@ describe('useTheme', () => {
|
|
|
346
169
|
isModern: false,
|
|
347
170
|
isForestGreenTheme: false,
|
|
348
171
|
isScreenModeDark: false,
|
|
349
|
-
getScreenMode: 'light',
|
|
350
172
|
className: 'np-theme-light',
|
|
351
173
|
});
|
|
352
174
|
|
|
@@ -370,7 +192,6 @@ describe('useTheme', () => {
|
|
|
370
192
|
isModern: false,
|
|
371
193
|
isForestGreenTheme: false,
|
|
372
194
|
isScreenModeDark: false,
|
|
373
|
-
getScreenMode: 'light',
|
|
374
195
|
className: 'np-theme-light',
|
|
375
196
|
});
|
|
376
197
|
|
|
@@ -392,7 +213,6 @@ describe('useTheme', () => {
|
|
|
392
213
|
isModern: false,
|
|
393
214
|
isForestGreenTheme: false,
|
|
394
215
|
isScreenModeDark: false,
|
|
395
|
-
getScreenMode: 'light',
|
|
396
216
|
className: 'np-theme-light',
|
|
397
217
|
});
|
|
398
218
|
|
package/src/useTheme.ts
CHANGED
|
@@ -3,13 +3,7 @@ import { useContext, useMemo } from 'react';
|
|
|
3
3
|
import { ThemeContext } from './ThemeProvider';
|
|
4
4
|
import type { ComponentTheme, BaseTheme, ScreenMode, ExtraTheme } from './const';
|
|
5
5
|
import { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';
|
|
6
|
-
import {
|
|
7
|
-
isThemeModern,
|
|
8
|
-
isForestGreenTheme,
|
|
9
|
-
isScreenModeDark,
|
|
10
|
-
getScreenMode,
|
|
11
|
-
getThemeClassName,
|
|
12
|
-
} from './helpers';
|
|
6
|
+
import { isThemeModern, isForestGreenTheme, isScreenModeDark, getThemeClassName } from './helpers';
|
|
13
7
|
|
|
14
8
|
interface ThemeHookValue {
|
|
15
9
|
theme: ComponentTheme | BaseTheme | ExtraTheme;
|
|
@@ -17,7 +11,6 @@ interface ThemeHookValue {
|
|
|
17
11
|
isModern: boolean;
|
|
18
12
|
isForestGreenTheme: boolean;
|
|
19
13
|
isScreenModeDark: boolean;
|
|
20
|
-
getScreenMode: ScreenMode;
|
|
21
14
|
className: string;
|
|
22
15
|
}
|
|
23
16
|
|
|
@@ -43,8 +36,8 @@ export const useTheme = (): ThemeHookValue => {
|
|
|
43
36
|
}
|
|
44
37
|
|
|
45
38
|
const { theme, screenMode: contextScreenMode } = theming ?? FALLBACK_VALUES;
|
|
46
|
-
|
|
47
|
-
|
|
39
|
+
|
|
40
|
+
const screenMode = theme === DEFAULT_BASE_THEME ? DEFAULT_SCREEN_MODE : contextScreenMode;
|
|
48
41
|
|
|
49
42
|
return useMemo(
|
|
50
43
|
() => ({
|
|
@@ -53,7 +46,6 @@ export const useTheme = (): ThemeHookValue => {
|
|
|
53
46
|
isModern: isThemeModern(theme),
|
|
54
47
|
isForestGreenTheme: isForestGreenTheme(theme),
|
|
55
48
|
isScreenModeDark: isScreenModeDark(theme, screenMode),
|
|
56
|
-
getScreenMode: getScreenMode(theme, screenMode),
|
|
57
49
|
className: getThemeClassName(theme, screenMode),
|
|
58
50
|
}),
|
|
59
51
|
[theme, screenMode],
|