@pure-ds/core 0.5.61 → 0.6.2

package/src/js/pds-core/pds-theme-utils.js

@@ -0,0 +1,33 @@
+const DEFAULT_THEMES = ["light", "dark"];
+const VALID_THEMES = new Set(DEFAULT_THEMES);
+
+export function normalizePresetThemes(preset) {
+  const themes = Array.isArray(preset?.themes)
+    ? preset.themes.map((theme) => String(theme).toLowerCase())
+    : DEFAULT_THEMES;
+  const normalized = themes.filter((theme) => VALID_THEMES.has(theme));
+  return normalized.length ? normalized : DEFAULT_THEMES;
+}
+
+export function resolveThemePreference(preference, { preferDocument = true } = {}) {
+  const normalized = String(preference || "").toLowerCase();
+  if (VALID_THEMES.has(normalized)) return normalized;
+
+  if (preferDocument && typeof document !== "undefined") {
+    const applied = document.documentElement?.getAttribute("data-theme");
+    if (VALID_THEMES.has(applied)) return applied;
+  }
+
+  if (typeof window !== "undefined" && window.matchMedia) {
+    const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+    return prefersDark ? "dark" : "light";
+  }
+
+  return "light";
+}
+
+export function isPresetThemeCompatible(preset, themePreference) {
+  const resolvedTheme = resolveThemePreference(themePreference);
+  const themes = normalizePresetThemes(preset);
+  return themes.includes(resolvedTheme);
+}

package/src/js/pds.d.ts

@@ -104,6 +104,9 @@ export interface CompiledState {
   };
 }
 
+/** Public config types for editor IntelliSense */
+export type PDSInitConfig = import("./pds-core/pds-config.js").PDSInitConfig;
+
 /**
  * Generator - programmatic API to produce tokens, layered CSS and helper modules from a config.
  * Typical usage:

package/src/js/pds.js

@@ -68,6 +68,10 @@ import {
   setupAutoDefinerAndEnhancers,
   stripFunctions,
 } from "./pds-core/pds-start-helpers.js";
+import {
+  isPresetThemeCompatible,
+  resolveThemePreference,
+} from "./pds-core/pds-theme-utils.js";
 
 const __slugifyPreset = (str = "") =>
   String(str)
@@ -261,6 +265,24 @@ Object.defineProperty(PDS, "theme", {
   set(value) {
     try {
       if (typeof window === "undefined") return;
+      const currentPreset = PDS.currentConfig?.design || null;
+      const resolvedTheme = resolveThemePreference(value);
+      if (currentPreset && !isPresetThemeCompatible(currentPreset, resolvedTheme)) {
+        const presetName =
+          currentPreset?.name ||
+          PDS.currentPreset?.name ||
+          PDS.currentConfig?.preset ||
+          "current preset";
+        console.warn(
+          `PDS theme "${resolvedTheme}" not supported by preset "${presetName}".`
+        );
+        PDS.dispatchEvent(
+          new CustomEvent("pds:theme:blocked", {
+            detail: { theme: value, resolvedTheme, preset: presetName },
+          })
+        );
+        return;
+      }
       if (value === null || value === undefined) {
         localStorage.removeItem(__themeStorageKey);
       } else {