@pure-ds/storybook 0.1.9 → 0.1.11

package/.storybook/preview.js

@@ -42,7 +42,7 @@ console.log('🎨 Starting PDS initialization with preset:', initialPreset);
 
 // Wrap top-level await in IIFE for production build compatibility
 (async () => {
-  window.__pdsInitializing = true;
+  PDS.initializing = true;
   const pdsOptions = {
     mode: 'live',
     preset: initialPreset,
@@ -70,14 +70,13 @@ console.log('🎨 Starting PDS initialization with preset:', initialPreset);
   }
 
   await PDS.start(pdsOptions);
-  window.__pdsInitializing = false;
+  PDS.initializing = false;
 
   console.log('✨ PDS initialized in live mode for Storybook');
   console.log('📦 AutoDefiner active at:', PDS.autoDefiner?.config?.baseURL);
 
   // Store PDS designer globally for reuse
-  window.__pdsDesigner = PDS.registry._designer;
-  window.__pdsCurrentPreset = initialPreset;
+  PDS.currentPreset = initialPreset;
 })();
 
 // Set up persistent style protection - monitor and restore PDS sheets if cleared
@@ -86,9 +85,9 @@ function ensurePDSStyles() {
   const sheets = document.adoptedStyleSheets || [];
   const hasPDS = sheets.some(s => s._pds === true);
   
-  if (!hasPDS && window.__pdsDesigner) {
+  if (!hasPDS && PDS.Generator.instance) {
     console.log('🛡️ PDS sheets missing - restoring...');
-    PDS.Generator.applyStyles(window.__pdsDesigner);
+    PDS.Generator.applyStyles(PDS.Generator.instance);
   }
 }
 
@@ -107,14 +106,14 @@ const withPDS = (story, context) => {
   console.log('📋 Current adoptedStyleSheets:', currentSheets.length, 'PDS sheets:', pdsSheets.length);
   
   // ALWAYS reapply PDS styles before each story render
-  const designer = window.__pdsDesigner || PDS.registry._designer;
+  const designer = PDS.Generator.instance;
   if (designer) {
     PDS.Generator.applyStyles(designer);
     
     // Check again after applying
     const afterSheets = document.adoptedStyleSheets || [];
     const afterPdsSheets = afterSheets.filter(s => s._pds === true);
-  } else if (!window.__pdsInitializing && PDS.isLiveMode()) {
+  } else if (!PDS.initializing && PDS.isLiveMode()) {
     console.warn('⚠️ No designer found!');
   }
   
@@ -236,13 +235,13 @@ const withGlobalsHandler = (story, context) => {
   const { globals } = context;
   
   // Handle preset changes via decorator (has access to globals)
-  if (globals?.preset && globals.preset !== window.__pdsCurrentPreset) {
-    console.log('🔄 Decorator detected preset change:', window.__pdsCurrentPreset, '→', globals.preset);
+  if (globals?.preset && globals.preset !== PDS.currentPreset) {
+    console.log('🔄 Decorator detected preset change:', PDS.currentPreset, '→', globals.preset);
     
     // Apply preset asynchronously
     (async () => {
       try {
-        window.__pdsCurrentPreset = globals.preset;
+        PDS.currentPreset = globals.preset;
         
         // Store for persistence
         try {
@@ -267,9 +266,6 @@ const withGlobalsHandler = (story, context) => {
           const newDesigner = new PDS.Generator(generatorOptions);
           await PDS.Generator.applyStyles(newDesigner);
           
-          PDS.registry._designer = newDesigner;
-          window.__pdsDesigner = newDesigner;
-          
           console.log(`✅ Preset applied via decorator: ${globals.preset}`);
         }
       } catch (err) {
@@ -1397,10 +1393,10 @@ if (typeof window !== 'undefined') {
       
       if (globals?.preset) {
         console.log('🔔 SET_GLOBALS message received with preset:', globals.preset);
-        console.log('📦 Current stored preset:', window.__pdsCurrentPreset);
+        console.log('📦 Current stored preset:', PDS.currentPreset);
         
         // Skip if already on this preset
-        if (globals.preset === window.__pdsCurrentPreset) {
+        if (globals.preset === PDS.currentPreset) {
           console.log('⏭️ Preset unchanged, skipping');
           return;
         }
@@ -1453,10 +1449,8 @@ if (typeof window !== 'undefined') {
             await PDS.Generator.applyStyles(newDesigner);
             console.log('✅ Styles applied to document');
             
-            // Update BOTH registry designer AND global reference
-            PDS.registry._designer = newDesigner;
-            window.__pdsDesigner = newDesigner;
-            window.__pdsCurrentPreset = presetId;
+            // Update global reference
+            PDS.currentPreset = presetId;
             
             console.log(`✅✅✅ Preset applied successfully: ${presetConfig.name || presetId}`);
           } else {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pure-ds/storybook",
-  "version": "0.1.9",
+  "version": "0.1.11",
   "description": "Storybook showcase for Pure Design System with live configuration",
   "type": "module",
   "private": false,
@@ -32,7 +32,7 @@
     "storybook:build": "npm run build-storybook"
   },
   "peerDependencies": {
-    "@pure-ds/core": "^0.3.1"
+    "@pure-ds/core": "^0.3.3"
   },
   "dependencies": {
     "@custom-elements-manifest/analyzer": "^0.11.0",

package/src/js/pds-core/pds-generator.js

@@ -5311,7 +5311,7 @@ export function createStylesheet(css) {
  * @returns {boolean}
  */
 export function isLiveMode() {
-  return pdsRegistry.isLive;
+  return window.PDS?.registry?.isLive;
 }
 import { enums } from "./pds-enums.js";
 import { ontology } from "./pds-ontology.js";

package/src/js/pds-core/pds-registry.js

@@ -79,30 +79,6 @@ class PDSRegistry {
     }
   }
 
-  // /**
-  //  * Get BLOB URL for a layer (live mode only)
-  //  * Used for @import statements in CSS
-  //  */
-  // getBlobURL(layer) {
-  //   if (this._mode === "live" && this._designer) {
-  //     switch (layer) {
-  //       case "tokens":
-  //         return this._designer.tokensBlobURL;
-  //       case "primitives":
-  //         return this._designer.primitivesBlobURL;
-  //       case "components":
-  //         return this._designer.componentsBlobURL;
-  //       case "utilities":
-  //         return this._designer.utilitiesBlobURL;
-  //       case "styles":
-  //         return this._designer.stylesBlobURL;
-  //       default:
-  //         return null;
-  //     }
-  //   }
-  //   return null;
-  // }
-
   /**
    * Get current mode
    */