@shopgate/engage 7.32.0-beta.3 → 7.32.0-beta.5
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/admin-preview/components/FrontendSettingsPreviewBridge/FrontendSettingsPreviewBridge.d.ts +2 -1
- package/admin-preview/components/FrontendSettingsPreviewBridge/FrontendSettingsPreviewBridge.d.ts.map +1 -1
- package/admin-preview/components/FrontendSettingsPreviewBridge/FrontendSettingsPreviewBridge.js +23 -1
- package/admin-preview/components/FrontendSettingsPreviewBridge/helpers.d.ts +7 -1
- package/admin-preview/components/FrontendSettingsPreviewBridge/helpers.d.ts.map +1 -1
- package/admin-preview/components/FrontendSettingsPreviewBridge/helpers.js +14 -2
- package/admin-preview/components/FrontendSettingsPreviewBridge/types.d.ts +6 -0
- package/admin-preview/components/FrontendSettingsPreviewBridge/types.d.ts.map +1 -1
- package/components/Badge/Badge.d.ts +30 -0
- package/components/Badge/Badge.d.ts.map +1 -0
- package/components/Badge/Badge.js +48 -0
- package/components/Badge/index.d.ts +3 -0
- package/components/Badge/index.d.ts.map +1 -0
- package/components/Badge/index.js +1 -0
- package/components/Badge/spec.d.ts +2 -0
- package/components/Badge/spec.d.ts.map +1 -0
- package/components/Badge/spec.js +75 -0
- package/components/View/components/Content/index.d.ts.map +1 -1
- package/components/View/components/Content/index.js +4 -1
- package/components/index.d.ts +1 -0
- package/components/index.d.ts.map +1 -1
- package/components/index.js +2 -1
- package/core/hooks/useLocalStorage.d.ts +8 -0
- package/core/hooks/useLocalStorage.d.ts.map +1 -1
- package/core/hooks/useLocalStorage.js +22 -15
- package/core/initialization/fetchSettings.d.ts +12 -0
- package/core/initialization/fetchSettings.d.ts.map +1 -0
- package/core/initialization/fetchSettings.js +134 -0
- package/core/initialization/index.d.ts +33 -2
- package/core/initialization/index.d.ts.map +1 -1
- package/core/initialization/index.js +25 -103
- package/package.json +9 -9
- package/page/components/NotFound.d.ts +7 -0
- package/page/components/NotFound.d.ts.map +1 -0
- package/page/components/NotFound.js +1 -2
- package/page/components/ResponsiveWidgetImage/ResponsiveWidgetImage.d.ts +52 -0
- package/page/components/ResponsiveWidgetImage/ResponsiveWidgetImage.d.ts.map +1 -0
- package/page/components/ResponsiveWidgetImage/index.d.ts +2 -0
- package/page/components/ResponsiveWidgetImage/index.d.ts.map +1 -0
- package/page/components/WidgetRichText/WidgetRichText.d.ts +25 -0
- package/page/components/WidgetRichText/WidgetRichText.d.ts.map +1 -0
- package/page/components/WidgetRichText/index.d.ts +2 -0
- package/page/components/WidgetRichText/index.d.ts.map +1 -0
- package/page/components/WidgetVideo/WidgetVideo.d.ts +43 -0
- package/page/components/WidgetVideo/WidgetVideo.d.ts.map +1 -0
- package/page/components/WidgetVideo/WidgetVideo.js +33 -39
- package/page/components/WidgetVideo/index.d.ts +2 -0
- package/page/components/WidgetVideo/index.d.ts.map +1 -0
- package/page/components/Widgets/Overlay.d.ts +17 -0
- package/page/components/Widgets/Overlay.d.ts.map +1 -0
- package/page/components/Widgets/Overlay.js +24 -38
- package/page/components/Widgets/Tooltip.d.ts +20 -0
- package/page/components/Widgets/Tooltip.d.ts.map +1 -0
- package/page/components/Widgets/Tooltip.js +6 -10
- package/page/components/Widgets/Widget.d.ts +32 -0
- package/page/components/Widgets/Widget.d.ts.map +1 -0
- package/page/components/Widgets/Widget.js +7 -18
- package/page/components/Widgets/WidgetContext.d.ts +32 -38
- package/page/components/Widgets/WidgetContext.d.ts.map +1 -0
- package/page/components/Widgets/WidgetContext.js +2 -8
- package/page/components/Widgets/WidgetProvider.d.ts +25 -0
- package/page/components/Widgets/WidgetProvider.d.ts.map +1 -0
- package/page/components/Widgets/WidgetProvider.js +5 -12
- package/page/components/Widgets/Widgets.d.ts +16 -0
- package/page/components/Widgets/Widgets.d.ts.map +1 -0
- package/page/components/Widgets/Widgets.js +5 -12
- package/page/components/Widgets/WidgetsPreviewContext.d.ts +21 -0
- package/page/components/Widgets/WidgetsPreviewContext.d.ts.map +1 -0
- package/page/components/Widgets/WidgetsPreviewContext.js +5 -7
- package/page/components/Widgets/WidgetsPreviewProvider.d.ts +18 -0
- package/page/components/Widgets/WidgetsPreviewProvider.d.ts.map +1 -0
- package/page/components/Widgets/WidgetsPreviewProvider.js +5 -6
- package/page/components/Widgets/constants.d.ts +5 -0
- package/page/components/Widgets/constants.d.ts.map +1 -0
- package/page/components/Widgets/constants.js +3 -1
- package/page/components/Widgets/events.d.ts +38 -0
- package/page/components/Widgets/events.d.ts.map +1 -0
- package/page/components/Widgets/events.js +8 -12
- package/page/components/Widgets/helpers.d.ts +50 -0
- package/page/components/Widgets/helpers.d.ts.map +1 -0
- package/page/components/Widgets/helpers.js +8 -13
- package/page/components/Widgets/hooks.d.ts +13 -0
- package/page/components/Widgets/hooks.d.ts.map +1 -0
- package/page/components/Widgets/hooks.js +13 -11
- package/page/components/Widgets/index.d.ts +3 -0
- package/page/components/Widgets/index.d.ts.map +1 -0
- package/page/components/Widgets/types.d.ts +111 -113
- package/page/components/Widgets/types.d.ts.map +1 -0
- package/page/components/Widgets/types.js +1 -0
- package/page/components/index.d.ts +5 -0
- package/page/components/index.d.ts.map +1 -0
- package/page/constants/actionTypes.d.ts +4 -0
- package/page/constants/actionTypes.d.ts.map +1 -0
- package/page/constants/index.d.ts +25 -0
- package/page/constants/index.d.ts.map +1 -0
- package/page/helpers/index.d.ts +67 -62
- package/page/helpers/index.d.ts.map +1 -0
- package/page/helpers/index.js +24 -25
- package/page/hooks/index.d.ts +54 -53
- package/page/hooks/index.d.ts.map +1 -0
- package/page/hooks/index.js +20 -15
- package/page/selectors/index.d.ts +32 -0
- package/page/selectors/index.d.ts.map +1 -0
- package/page/widgets/Video/Video.d.ts +6 -0
- package/page/widgets/Video/Video.d.ts.map +1 -0
- package/page/widgets/Video/Video.js +0 -2
- package/page/widgets/Video/hooks.d.ts +53 -0
- package/page/widgets/Video/hooks.d.ts.map +1 -0
- package/page/widgets/Video/hooks.js +4 -12
- package/page/widgets/Video/index.d.ts +2 -0
- package/page/widgets/Video/index.d.ts.map +1 -0
- package/product/components/Description/index.js +0 -2
- package/product/components/ProductCard/index.js +1 -0
- package/product/components/ProductGrid/components/Item/components/ItemDetails/index.js +1 -1
- package/product/components/ProductGrid/components/Item/components/ItemImage/index.js +10 -0
- package/product/components/ProductGrid/components/Item/components/ItemName/index.js +1 -0
- package/product/components/ProductGrid/components/Item/index.js +0 -1
- package/product/components/ProductGrid/components/Layout/index.js +17 -3
- package/product/components/ProductGrid/constants.d.ts +2 -0
- package/product/components/ProductGrid/constants.d.ts.map +1 -0
- package/product/components/ProductGrid/constants.js +1 -0
- package/product/components/ProductGrid/hooks.d.ts +18 -0
- package/product/components/ProductGrid/hooks.d.ts.map +1 -0
- package/product/components/ProductGrid/hooks.js +49 -0
- package/product/components/ProductGrid/index.js +3 -6
- package/product/components/ProductGrid/spec.js +3 -0
- package/product/components/ProductList/components/Layout/index.js +8 -20
- package/settings/reducers/appSettings.d.ts.map +1 -1
- package/settings/reducers/appSettings.js +8 -0
- package/settings/selectors/appSettings.d.ts +8 -0
- package/settings/selectors/appSettings.d.ts.map +1 -1
- package/settings/selectors/appSettings.js +6 -1
- package/settings/types/appSettings.d.ts +21 -0
- package/settings/types/appSettings.d.ts.map +1 -1
- package/styles/helpers/index.d.ts +1 -0
- package/styles/helpers/index.js +1 -0
- package/styles/helpers/loadThemeCss.d.ts +14 -0
- package/styles/helpers/loadThemeCss.d.ts.map +1 -0
- package/styles/helpers/loadThemeCss.js +112 -0
- package/styles/index.d.ts +1 -1
- package/styles/index.d.ts.map +1 -1
- package/styles/reset/root.js +1 -1
- package/styles/theme/createDefaultThemeOptions/index.d.ts.map +1 -1
- package/styles/theme/createDefaultThemeOptions/index.js +12 -1
- package/styles/theme/createTheme/createComponents.types.d.ts +22 -0
- package/styles/theme/createTheme/createComponents.types.d.ts.map +1 -1
- package/styles/theme/createTheme/createComponents.types.js +23 -1
- package/styles/theme/createTheme/createCssVarsForColorSchemeThemes.d.ts.map +1 -1
- package/styles/theme/createTheme/createCssVarsForColorSchemeThemes.js +4 -1
- package/styles/theme/createTheme/index.d.ts +1 -0
- package/styles/theme/createTheme/index.d.ts.map +1 -1
- package/styles/theme/createTheme/index.js +2 -0
- package/styles/theme/createTheme/types.d.ts +2 -2
- package/styles/theme/createTheme/types.d.ts.map +1 -1
- package/styles/theme/createTheme/types.js +2 -3
- package/styles/theme/hooks/useColorScheme.d.ts +4 -3
- package/styles/theme/hooks/useColorScheme.d.ts.map +1 -1
- package/styles/theme/hooks/useColorScheme.js +4 -3
- package/styles/theme/index.d.ts +1 -1
- package/styles/theme/index.d.ts.map +1 -1
- package/styles/theme/providers/ColorSchemeContext.d.ts +19 -0
- package/styles/theme/providers/ColorSchemeContext.d.ts.map +1 -0
- package/styles/theme/providers/ColorSchemeContext.js +6 -0
- package/styles/theme/providers/ThemeProvider.d.ts +2 -12
- package/styles/theme/providers/ThemeProvider.d.ts.map +1 -1
- package/styles/theme/providers/ThemeProvider.js +32 -8
|
@@ -9,6 +9,8 @@ import createThemeFromColorScheme from "./createThemeFromColorScheme";
|
|
|
9
9
|
import createCssVarsForColorSchemeThemes from "./createCssVarsForColorSchemeThemes";
|
|
10
10
|
import applyStyles from "./applyStyles";
|
|
11
11
|
import { createGetColorSchemeSelector, createSetActiveColorScheme } from "./helpers";
|
|
12
|
+
export { COLOR_SCHEME_NAMES } from "./types";
|
|
13
|
+
|
|
12
14
|
/**
|
|
13
15
|
* Creates a theme object for the ThemeProvider.
|
|
14
16
|
* @param options The theme options.
|
|
@@ -13,8 +13,8 @@ import type { Shape, ShapeOptions } from './createShape';
|
|
|
13
13
|
import type { Shadows } from './shadows';
|
|
14
14
|
export type { Breakpoint } from './createBreakpoints';
|
|
15
15
|
export type { PaletteColorsWithMain } from './createPalette';
|
|
16
|
-
declare const
|
|
17
|
-
export type ColorSchemeName = (typeof
|
|
16
|
+
export declare const COLOR_SCHEME_NAMES: readonly ["light", "dark"];
|
|
17
|
+
export type ColorSchemeName = (typeof COLOR_SCHEME_NAMES)[number];
|
|
18
18
|
declare const selectorTypes: readonly ["data", "class"];
|
|
19
19
|
export type ColorSchemeSelectorType = (typeof selectorTypes)[number];
|
|
20
20
|
type DeepPartial<T> = T extends object ? {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../styles/theme/createTheme/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACxE,OAAO,KAAK,EAAE,iBAAiB,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACvF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,KAAK,EAAE,sBAAsB,EAAE,yBAAyB,EAAE,MAAM,WAAW,CAAC;AACnF,OAAO,KAAK,EAAE,4CAA4C,EAAE,MAAM,qCAAqC,CAAC;AACxG,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEzC,YAAY,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACtD,YAAY,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAE7D,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../styles/theme/createTheme/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const
|
|
1
|
+
export const COLOR_SCHEME_NAMES = ['light', 'dark'];
|
|
2
2
|
const selectorTypes = ['data', 'class'];
|
|
3
3
|
|
|
4
4
|
/**
|
|
@@ -17,5 +17,4 @@ const selectorTypes = ['data', 'class'];
|
|
|
17
17
|
/**
|
|
18
18
|
* A record of themes for each color scheme. Each key is a color scheme name (e.g., 'light', 'dark'),
|
|
19
19
|
* and the value is a fully-resolved color-scheme theme ({@link ColorSchemeTheme}).
|
|
20
|
-
*/
|
|
21
|
-
export {};
|
|
20
|
+
*/
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
3
|
-
* @returns
|
|
2
|
+
* Provides access to the color scheme context.
|
|
3
|
+
* @returns The color scheme context value, containing the current `mode`, a `setMode` function to
|
|
4
|
+
* update it, and the list of `modes` the active theme actually provides.
|
|
4
5
|
*/
|
|
5
|
-
declare const useColorScheme: () => import("../providers/
|
|
6
|
+
declare const useColorScheme: () => import("../providers/ColorSchemeContext").ColorSchemeContextValue;
|
|
6
7
|
export default useColorScheme;
|
|
7
8
|
//# sourceMappingURL=useColorScheme.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorScheme.d.ts","sourceRoot":"","sources":["../../../../styles/theme/hooks/useColorScheme.ts"],"names":[],"mappings":"AAGA
|
|
1
|
+
{"version":3,"file":"useColorScheme.d.ts","sourceRoot":"","sources":["../../../../styles/theme/hooks/useColorScheme.ts"],"names":[],"mappings":"AAGA;;;;GAIG;AACH,QAAA,MAAM,cAAc,yEAAuC,CAAC;AAE5D,eAAe,cAAc,CAAC"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { useContext } from 'react';
|
|
2
|
-
import { ColorSchemeContext } from "../providers/
|
|
2
|
+
import { ColorSchemeContext } from "../providers/ColorSchemeContext";
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
|
-
*
|
|
6
|
-
* @returns
|
|
5
|
+
* Provides access to the color scheme context.
|
|
6
|
+
* @returns The color scheme context value, containing the current `mode`, a `setMode` function to
|
|
7
|
+
* update it, and the list of `modes` the active theme actually provides.
|
|
7
8
|
*/
|
|
8
9
|
const useColorScheme = () => useContext(ColorSchemeContext);
|
|
9
10
|
export default useColorScheme;
|
package/styles/theme/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export { default as ThemeProvider } from './providers/ThemeProvider';
|
|
2
2
|
export { createTheme } from './createTheme';
|
|
3
|
-
export type { Theme, Breakpoint, PaletteColorsWithMain } from './createTheme';
|
|
3
|
+
export type { Theme, Breakpoint, PaletteColorsWithMain, ColorSchemeName, } from './createTheme';
|
|
4
4
|
export { useActiveBreakpoint, useMediaQuery, useResponsiveValue, useTheme, useColorScheme, } from './hooks';
|
|
5
5
|
export { withTheme, type WithThemeProps } from './hocs';
|
|
6
6
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../styles/theme/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../styles/theme/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EACV,KAAK,EAAE,UAAU,EAAE,qBAAqB,EAAE,eAAe,GAC1D,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,mBAAmB,EACnB,aAAa,EACb,kBAAkB,EAClB,QAAQ,EACR,cAAc,GACf,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,QAAQ,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { type Dispatch, type SetStateAction } from 'react';
|
|
2
|
+
import { type ColorSchemeName } from '../createTheme';
|
|
3
|
+
export interface ColorSchemeContextValue {
|
|
4
|
+
/**
|
|
5
|
+
* The current color scheme (e.g., 'light' or 'dark')
|
|
6
|
+
*/
|
|
7
|
+
mode: ColorSchemeName | null;
|
|
8
|
+
/**
|
|
9
|
+
* Function to update the color scheme
|
|
10
|
+
*/
|
|
11
|
+
setMode: Dispatch<SetStateAction<ColorSchemeName | null>>;
|
|
12
|
+
/**
|
|
13
|
+
* The modes the active theme actually provides. Only these can be set - passing anything else
|
|
14
|
+
* to setMode has no effect.
|
|
15
|
+
*/
|
|
16
|
+
modes: ColorSchemeName[];
|
|
17
|
+
}
|
|
18
|
+
export declare const ColorSchemeContext: import("react").Context<ColorSchemeContextValue>;
|
|
19
|
+
//# sourceMappingURL=ColorSchemeContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColorSchemeContext.d.ts","sourceRoot":"","sources":["../../../../styles/theme/providers/ColorSchemeContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEtD,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,IAAI,EAAE,eAAe,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,OAAO,EAAE,QAAQ,CAAC,cAAc,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC,CAAC;IAC1D;;;OAGG;IACH,KAAK,EAAE,eAAe,EAAE,CAAC;CAC1B;AAED,eAAO,MAAM,kBAAkB,kDAI7B,CAAC"}
|
|
@@ -1,16 +1,6 @@
|
|
|
1
|
-
import { type Theme, type ThemeInternal
|
|
2
|
-
export
|
|
3
|
-
/**
|
|
4
|
-
* The current color scheme (e.g., 'light' or 'dark')
|
|
5
|
-
*/
|
|
6
|
-
mode: ColorSchemeName | null;
|
|
7
|
-
/**
|
|
8
|
-
* Function to update the color scheme
|
|
9
|
-
*/
|
|
10
|
-
setMode: React.Dispatch<React.SetStateAction<ColorSchemeName | null>>;
|
|
11
|
-
}
|
|
1
|
+
import { type Theme, type ThemeInternal } from '../createTheme';
|
|
2
|
+
export { ColorSchemeContext, type ColorSchemeContextValue } from './ColorSchemeContext';
|
|
12
3
|
export declare const ThemeContext: import("react").Context<Theme>;
|
|
13
|
-
export declare const ColorSchemeContext: import("react").Context<ColorSchemeContextValue>;
|
|
14
4
|
type ThemeProviderProps = {
|
|
15
5
|
/**
|
|
16
6
|
* The theme object to provide to the context.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../../styles/theme/providers/ThemeProvider.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../../styles/theme/providers/ThemeProvider.tsx"],"names":[],"mappings":"AAUA,OAAO,EACL,KAAK,KAAK,EAAE,KAAK,aAAa,EAC/B,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAExF,eAAO,MAAM,YAAY,gCAAqC,CAAC;AAwE/D,KAAK,kBAAkB,GAAG;IACxB;;OAEG;IACH,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAA;mFAtEE,kBAAkB;AAwErB,wBAAmC"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import
|
|
1
|
+
import "core-js/modules/es.array.includes.js";
|
|
2
|
+
import { createContext, memo, useCallback, useMemo, useLayoutEffect } from 'react';
|
|
2
3
|
import useLocalStorage from '@shopgate/engage/core/hooks/useLocalStorage';
|
|
4
|
+
import { logger } from '@shopgate/engage/core/helpers';
|
|
3
5
|
import { GlobalStyles } from '@shopgate/engage/styles';
|
|
4
6
|
import { isFrontendSettingsAdminPreviewActive } from '@shopgate/engage/admin-preview/helpers';
|
|
5
7
|
import { FrontendSettingsPreviewBridge } from '@shopgate/engage/admin-preview/components';
|
|
6
8
|
import ActiveBreakpointProvider from "./ActiveBreakpointProvider";
|
|
9
|
+
import { ColorSchemeContext } from "./ColorSchemeContext";
|
|
7
10
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
+
export { ColorSchemeContext } from "./ColorSchemeContext";
|
|
8
12
|
export const ThemeContext = /*#__PURE__*/createContext({});
|
|
9
|
-
export const ColorSchemeContext = /*#__PURE__*/createContext({
|
|
10
|
-
mode: 'light',
|
|
11
|
-
setMode: () => ''
|
|
12
|
-
});
|
|
13
13
|
|
|
14
14
|
/**
|
|
15
15
|
* The ThemeProvider component provides the theme context to its children.
|
|
@@ -18,13 +18,37 @@ const ThemeProvider = ({
|
|
|
18
18
|
children,
|
|
19
19
|
theme
|
|
20
20
|
}) => {
|
|
21
|
+
// The color schemes the active theme actually provides. createTheme() can be configured with only
|
|
22
|
+
// a subset of the possible schemes (it defaults to just `light`), so `modes` and the validation
|
|
23
|
+
// below are derived from the resolved theme rather than the full COLOR_SCHEME_NAMES tuple.
|
|
24
|
+
// Otherwise the provider could expose and accept a scheme (e.g. `dark`) the theme doesn't style,
|
|
25
|
+
// and setActiveColorScheme would flip the root selector to an unstyled scheme.
|
|
26
|
+
const modes = useMemo(() => Object.keys(theme.colorSchemes), [theme]);
|
|
21
27
|
const [activeColorScheme, setActiveColorScheme] = useLocalStorage('persistedColorScheme', {
|
|
22
|
-
initialValue: theme.defaultColorScheme
|
|
28
|
+
initialValue: theme.defaultColorScheme,
|
|
29
|
+
// The frontend settings preview runs the app in an iframe on the shop origin. Persisting the
|
|
30
|
+
// color scheme there would write the admin's preview choice into the visitor's own storage and
|
|
31
|
+
// outlive the preview, so the scheme is kept in memory only while previewing.
|
|
32
|
+
persist: !isFrontendSettingsAdminPreviewActive()
|
|
23
33
|
});
|
|
34
|
+
|
|
35
|
+
// Wraps the raw storage setter, so an unsupported mode is rejected before it is persisted.
|
|
36
|
+
// Setting null is allowed and clears the stored preference.
|
|
37
|
+
const setMode = useCallback(value => {
|
|
38
|
+
setActiveColorScheme(currentColorScheme => {
|
|
39
|
+
const nextColorScheme = typeof value === 'function' ? value(currentColorScheme) : value;
|
|
40
|
+
if (nextColorScheme !== null && !modes.includes(nextColorScheme)) {
|
|
41
|
+
logger.warn(`ThemeProvider: "${nextColorScheme}" is not a supported color scheme.`);
|
|
42
|
+
return currentColorScheme;
|
|
43
|
+
}
|
|
44
|
+
return nextColorScheme;
|
|
45
|
+
});
|
|
46
|
+
}, [modes, setActiveColorScheme]);
|
|
24
47
|
const colorSchemeContextValue = useMemo(() => ({
|
|
25
48
|
mode: activeColorScheme,
|
|
26
|
-
setMode
|
|
27
|
-
|
|
49
|
+
setMode,
|
|
50
|
+
modes
|
|
51
|
+
}), [activeColorScheme, modes, setMode]);
|
|
28
52
|
useLayoutEffect(() => {
|
|
29
53
|
if (!activeColorScheme) return;
|
|
30
54
|
theme.setActiveColorScheme(activeColorScheme);
|