@wise/components-theming 0.0.0-experimental-712c569 → 0.0.0-experimental-f6ecbad
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/ThemeProvider.mjs +1 -1
- package/dist/helpers.d.ts.map +1 -1
- package/dist/helpers.js +2 -2
- package/dist/helpers.js.map +1 -1
- package/dist/helpers.mjs +2 -2
- package/dist/helpers.mjs.map +1 -1
- package/package.json +1 -1
- package/src/helpers.ts +3 -2
- package/src/useTheme.spec.tsx +1 -1
package/dist/ThemeProvider.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useContext, useEffect, useMemo } from 'react';
|
|
2
2
|
import { ThemedChildren } from './ThemedChildren.mjs';
|
|
3
|
-
import {
|
|
3
|
+
import { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const.mjs';
|
|
4
4
|
import { getThemeClassName } from './helpers.mjs';
|
|
5
5
|
import { ThemeContext } from './ThemeProviderContext.mjs';
|
|
6
6
|
import { jsx } from 'react/jsx-runtime';
|
package/dist/helpers.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../src/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,cAAc,EACd,OAAO,EACR,MAAM,SAAS,CAAC;AAGjB,eAAO,MAAM,aAAa,GAAI,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,KAAG,KAAK,IAAI,WACjC,CAAC;AAE9C,eAAO,MAAM,YAAY,GAAI,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,KAAG,KAAK,IAAI,UAClC,CAAC;AAE5C,eAAO,MAAM,kBAAkB,GAC7B,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,KACnC,KAAK,IAAI,gBAA4C,CAAC;AAEzD,eAAO,MAAM,gBAAgB,GAC3B,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EACpC,YAAY,UAAU,KACrB,UAAU,IAAI,cACqD,CAAC;AAEvE,eAAO,MAAM,iBAAiB,GAAI,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,YAAY,UAAU,
|
|
1
|
+
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../src/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,cAAc,EACd,OAAO,EACR,MAAM,SAAS,CAAC;AAGjB,eAAO,MAAM,aAAa,GAAI,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,KAAG,KAAK,IAAI,WACjC,CAAC;AAE9C,eAAO,MAAM,YAAY,GAAI,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,KAAG,KAAK,IAAI,UAClC,CAAC;AAE5C,eAAO,MAAM,kBAAkB,GAC7B,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,KACnC,KAAK,IAAI,gBAA4C,CAAC;AAEzD,eAAO,MAAM,gBAAgB,GAC3B,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EACpC,YAAY,UAAU,KACrB,UAAU,IAAI,cACqD,CAAC;AAEvE,eAAO,MAAM,iBAAiB,GAAI,OAAO,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,YAAY,UAAU,WAc7F,CAAC"}
|
package/dist/helpers.js
CHANGED
|
@@ -7,10 +7,10 @@ const isExtraTheme = theme => _const.extraThemes.includes(theme);
|
|
|
7
7
|
const isForestGreenTheme = theme => theme === _const.extraThemes[0];
|
|
8
8
|
const isScreenModeDark = (theme, screenMode) => isThemeModern(theme) && _const.screenModes[1] === screenMode;
|
|
9
9
|
const getThemeClassName = (theme, screenMode) => {
|
|
10
|
-
let classes = `np-theme-${theme || 'personal'}`;
|
|
11
10
|
if (!isThemeModern(theme)) {
|
|
12
|
-
return
|
|
11
|
+
return `np-theme-${theme || 'personal'}`;
|
|
13
12
|
}
|
|
13
|
+
let classes = `np-theme-${theme === 'business' ? 'business' : 'personal'}`;
|
|
14
14
|
if (isExtraTheme(theme)) {
|
|
15
15
|
classes += ` ${classes}--${theme}`;
|
|
16
16
|
} else if (_const.screenModes[1] === screenMode) {
|
package/dist/helpers.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.js","sources":["../src/helpers.ts"],"sourcesContent":["import type {\n ModernTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n Theming,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (theme: NonNullable<Theming['theme']>): theme is ModernTheme =>\n modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: NonNullable<Theming['theme']>): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: NonNullable<Theming['theme']>,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: NonNullable<Theming['theme']>,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const getThemeClassName = (theme: NonNullable<Theming['theme']>, screenMode: ScreenMode) => {\n
|
|
1
|
+
{"version":3,"file":"helpers.js","sources":["../src/helpers.ts"],"sourcesContent":["import type {\n ModernTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n Theming,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (theme: NonNullable<Theming['theme']>): theme is ModernTheme =>\n modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: NonNullable<Theming['theme']>): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: NonNullable<Theming['theme']>,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: NonNullable<Theming['theme']>,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const getThemeClassName = (theme: NonNullable<Theming['theme']>, screenMode: ScreenMode) => {\n if (!isThemeModern(theme)) {\n return `np-theme-${theme || 'personal'}`;\n }\n\n let classes = `np-theme-${theme === 'business' ? 'business' : '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"],"names":["isThemeModern","theme","modernThemes","includes","isExtraTheme","extraThemes","isForestGreenTheme","isScreenModeDark","screenMode","screenModes","getThemeClassName","classes"],"mappings":";;;;AAUO,MAAMA,aAAa,GAAIC,KAAoC,IAChEC,mBAAY,CAACC,QAAQ,CAACF,KAAoB;AAErC,MAAMG,YAAY,GAAIH,KAAoC,IAC/DI,kBAAW,CAACF,QAAQ,CAACF,KAAmB;AAEnC,MAAMK,kBAAkB,GAC7BL,KAAoC,IACNA,KAAK,KAAKI,kBAAW,CAAC,CAAC;MAE1CE,gBAAgB,GAAGA,CAC9BN,KAAoC,EACpCO,UAAsB,KAEtBR,aAAa,CAACC,KAAoB,CAAC,IAAIQ,kBAAW,CAAC,CAAC,CAAC,KAAKD;MAE/CE,iBAAiB,GAAGA,CAACT,KAAoC,EAAEO,UAAsB,KAAI;AAChG,EAAA,IAAI,CAACR,aAAa,CAACC,KAAK,CAAC,EAAE;AACzB,IAAA,OAAO,CAAA,SAAA,EAAYA,KAAK,IAAI,UAAU,CAAA,CAAE;AAC1C,EAAA;EAEA,IAAIU,OAAO,GAAG,CAAA,SAAA,EAAYV,KAAK,KAAK,UAAU,GAAG,UAAU,GAAG,UAAU,CAAA,CAAE;AAE1E,EAAA,IAAIG,YAAY,CAACH,KAAK,CAAC,EAAE;AACvBU,IAAAA,OAAO,IAAI,CAAA,CAAA,EAAIA,OAAO,CAAA,EAAA,EAAKV,KAAK,CAAA,CAAE;EACpC,CAAC,MAAM,IAAIQ,kBAAW,CAAC,CAAC,CAAC,KAAKD,UAAU,EAAE;AACxCG,IAAAA,OAAO,IAAI,CAAA,CAAA,EAAIA,OAAO,CAAA,EAAA,EAAKH,UAAU,CAAA,CAAE;AACzC,EAAA;AAEA,EAAA,OAAOG,OAAO;AAChB;;;;;;;;"}
|
package/dist/helpers.mjs
CHANGED
|
@@ -5,10 +5,10 @@ const isExtraTheme = theme => extraThemes.includes(theme);
|
|
|
5
5
|
const isForestGreenTheme = theme => theme === extraThemes[0];
|
|
6
6
|
const isScreenModeDark = (theme, screenMode) => isThemeModern(theme) && screenModes[1] === screenMode;
|
|
7
7
|
const getThemeClassName = (theme, screenMode) => {
|
|
8
|
-
let classes = `np-theme-${theme || 'personal'}`;
|
|
9
8
|
if (!isThemeModern(theme)) {
|
|
10
|
-
return
|
|
9
|
+
return `np-theme-${theme || 'personal'}`;
|
|
11
10
|
}
|
|
11
|
+
let classes = `np-theme-${theme === 'business' ? 'business' : 'personal'}`;
|
|
12
12
|
if (isExtraTheme(theme)) {
|
|
13
13
|
classes += ` ${classes}--${theme}`;
|
|
14
14
|
} else if (screenModes[1] === screenMode) {
|
package/dist/helpers.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.mjs","sources":["../src/helpers.ts"],"sourcesContent":["import type {\n ModernTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n Theming,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (theme: NonNullable<Theming['theme']>): theme is ModernTheme =>\n modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: NonNullable<Theming['theme']>): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: NonNullable<Theming['theme']>,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: NonNullable<Theming['theme']>,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const getThemeClassName = (theme: NonNullable<Theming['theme']>, screenMode: ScreenMode) => {\n
|
|
1
|
+
{"version":3,"file":"helpers.mjs","sources":["../src/helpers.ts"],"sourcesContent":["import type {\n ModernTheme,\n ExtraTheme,\n ForestGreenTheme,\n ScreenMode,\n ScreenModeDark,\n Theming,\n} from './const';\nimport { extraThemes, screenModes, modernThemes } from './const';\n\nexport const isThemeModern = (theme: NonNullable<Theming['theme']>): theme is ModernTheme =>\n modernThemes.includes(theme as ModernTheme);\n\nexport const isExtraTheme = (theme: NonNullable<Theming['theme']>): theme is ExtraTheme =>\n extraThemes.includes(theme as ExtraTheme);\n\nexport const isForestGreenTheme = (\n theme: NonNullable<Theming['theme']>,\n): theme is ForestGreenTheme => theme === extraThemes[0];\n\nexport const isScreenModeDark = (\n theme: NonNullable<Theming['theme']>,\n screenMode: ScreenMode,\n): screenMode is ScreenModeDark =>\n isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;\n\nexport const getThemeClassName = (theme: NonNullable<Theming['theme']>, screenMode: ScreenMode) => {\n if (!isThemeModern(theme)) {\n return `np-theme-${theme || 'personal'}`;\n }\n\n let classes = `np-theme-${theme === 'business' ? 'business' : '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"],"names":["isThemeModern","theme","modernThemes","includes","isExtraTheme","extraThemes","isForestGreenTheme","isScreenModeDark","screenMode","screenModes","getThemeClassName","classes"],"mappings":";;AAUO,MAAMA,aAAa,GAAIC,KAAoC,IAChEC,YAAY,CAACC,QAAQ,CAACF,KAAoB;AAErC,MAAMG,YAAY,GAAIH,KAAoC,IAC/DI,WAAW,CAACF,QAAQ,CAACF,KAAmB;AAEnC,MAAMK,kBAAkB,GAC7BL,KAAoC,IACNA,KAAK,KAAKI,WAAW,CAAC,CAAC;MAE1CE,gBAAgB,GAAGA,CAC9BN,KAAoC,EACpCO,UAAsB,KAEtBR,aAAa,CAACC,KAAoB,CAAC,IAAIQ,WAAW,CAAC,CAAC,CAAC,KAAKD;MAE/CE,iBAAiB,GAAGA,CAACT,KAAoC,EAAEO,UAAsB,KAAI;AAChG,EAAA,IAAI,CAACR,aAAa,CAACC,KAAK,CAAC,EAAE;AACzB,IAAA,OAAO,CAAA,SAAA,EAAYA,KAAK,IAAI,UAAU,CAAA,CAAE;AAC1C,EAAA;EAEA,IAAIU,OAAO,GAAG,CAAA,SAAA,EAAYV,KAAK,KAAK,UAAU,GAAG,UAAU,GAAG,UAAU,CAAA,CAAE;AAE1E,EAAA,IAAIG,YAAY,CAACH,KAAK,CAAC,EAAE;AACvBU,IAAAA,OAAO,IAAI,CAAA,CAAA,EAAIA,OAAO,CAAA,EAAA,EAAKV,KAAK,CAAA,CAAE;EACpC,CAAC,MAAM,IAAIQ,WAAW,CAAC,CAAC,CAAC,KAAKD,UAAU,EAAE;AACxCG,IAAAA,OAAO,IAAI,CAAA,CAAA,EAAIA,OAAO,CAAA,EAAA,EAAKH,UAAU,CAAA,CAAE;AACzC,EAAA;AAEA,EAAA,OAAOG,OAAO;AAChB;;;;"}
|
package/package.json
CHANGED
package/src/helpers.ts
CHANGED
|
@@ -25,11 +25,12 @@ export const isScreenModeDark = (
|
|
|
25
25
|
isThemeModern(theme as ModernTheme) && screenModes[1] === screenMode;
|
|
26
26
|
|
|
27
27
|
export const getThemeClassName = (theme: NonNullable<Theming['theme']>, screenMode: ScreenMode) => {
|
|
28
|
-
let classes = `np-theme-${theme || 'personal'}`;
|
|
29
28
|
if (!isThemeModern(theme)) {
|
|
30
|
-
return
|
|
29
|
+
return `np-theme-${theme || 'personal'}`;
|
|
31
30
|
}
|
|
32
31
|
|
|
32
|
+
let classes = `np-theme-${theme === 'business' ? 'business' : 'personal'}`;
|
|
33
|
+
|
|
33
34
|
if (isExtraTheme(theme)) {
|
|
34
35
|
classes += ` ${classes}--${theme}`;
|
|
35
36
|
} else if (screenModes[1] === screenMode) {
|
package/src/useTheme.spec.tsx
CHANGED
|
@@ -4,7 +4,7 @@ import { ThemeProvider } from './ThemeProvider';
|
|
|
4
4
|
import { DEFAULT_BASE_THEME, DEFAULT_SCREEN_MODE } from './const';
|
|
5
5
|
import { useTheme } from './useTheme';
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
describe('useTheme', () => {
|
|
8
8
|
it('returns default light theme', () => {
|
|
9
9
|
jest.spyOn(console, 'warn').mockImplementation();
|
|
10
10
|
|