@getflip/swirl-components 0.175.1 → 0.176.0

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/components.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2024-03-22T13:40:47",
2
+ "timestamp": "2024-03-25T10:50:25",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "3.3.1",
@@ -39177,14 +39177,14 @@
39177
39177
  "props": [
39178
39178
  {
39179
39179
  "name": "config",
39180
- "type": "{ rootElement?: HTMLElement; storage?: SwirlThemeProviderStorage; themes?: SwirlThemes; }",
39180
+ "type": "{ enabledThemes?: (keyof SwirlThemes)[]; rootElement?: HTMLElement; storage?: SwirlThemeProviderStorage; themes?: SwirlThemes; }",
39181
39181
  "mutable": false,
39182
39182
  "reflectToAttr": false,
39183
39183
  "docs": "",
39184
39184
  "docsTags": [],
39185
39185
  "values": [
39186
39186
  {
39187
- "type": "{ rootElement?: HTMLElement; storage?: SwirlThemeProviderStorage; themes?: SwirlThemes; }"
39187
+ "type": "{ enabledThemes?: (keyof SwirlThemes)[]; rootElement?: HTMLElement; storage?: SwirlThemeProviderStorage; themes?: SwirlThemes; }"
39188
39188
  }
39189
39189
  ],
39190
39190
  "optional": false,
@@ -47,7 +47,8 @@ const SwirlThemeProvider = class {
47
47
  * the system theme.
48
48
  */
49
49
  async setPreferredOSTheme(theme) {
50
- if (!Boolean(this.resolvedConfig.storage)) {
50
+ if (!Boolean(this.resolvedConfig.storage) ||
51
+ !this.resolvedConfig.enabledThemes.includes(theme)) {
51
52
  return;
52
53
  }
53
54
  this.resolvedConfig.storage.setItem(preferredThemeStorageKey, theme);
@@ -66,9 +67,13 @@ const SwirlThemeProvider = class {
66
67
  resolveConfig() {
67
68
  this.resolvedConfig = {
68
69
  ...(this.config || {}),
70
+ enabledThemes: this.config?.enabledThemes || ["light", "dark"],
69
71
  rootElement: this.config?.rootElement || document.documentElement,
70
72
  storage: this.config?.storage || window?.localStorage,
71
73
  };
74
+ if (!this.resolvedConfig.enabledThemes.includes("light")) {
75
+ throw new Error("[Swirl Theme Provider] Light theme must be enabled.");
76
+ }
72
77
  }
73
78
  determineOSTheme() {
74
79
  if (!Boolean(window.matchMedia)) {
@@ -83,7 +88,13 @@ const SwirlThemeProvider = class {
83
88
  });
84
89
  }
85
90
  async updateAppTheme() {
86
- this.appOSTheme = (await this.getPreferredOSTheme()) || this.osTheme;
91
+ const newAppOSTheme = (await this.getPreferredOSTheme()) || this.osTheme;
92
+ if (!this.resolvedConfig.enabledThemes.includes(newAppOSTheme)) {
93
+ this.appOSTheme = "light";
94
+ }
95
+ else {
96
+ this.appOSTheme = newAppOSTheme;
97
+ }
87
98
  if (this.appOSTheme === "dark") {
88
99
  document.documentElement.classList.remove("theme-light");
89
100
  document.documentElement.classList.add("theme-dark");