wu-framework 1.1.7 → 1.1.9

package/src/core/wu-style-bridge.js

@@ -28,9 +28,10 @@
  *    - Riesgo de colisiones: NINGUNO
  */
 
+import { logger } from './wu-logger.js';
+
 export class WuStyleBridge {
   constructor() {
-    this.sharedStyles = new Map();
     this.styleObserver = null;
     this.fullyIsolatedApps = new Map(); // Mapa de appName -> appUrl para apps con fully-isolated
     this.config = {
@@ -57,7 +58,7 @@ export class WuStyleBridge {
       cacheEnabled: true
     };
 
-    console.log('[WuStyleBridge] 🎨 Style sharing system initialized');
+    logger.debug('[WuStyleBridge] 🎨 Style sharing system initialized');
   }
 
   /**
@@ -67,7 +68,7 @@ export class WuStyleBridge {
    */
   registerFullyIsolatedApp(appName, appUrl) {
     this.fullyIsolatedApps.set(appName, appUrl);
-    console.log(`[WuStyleBridge] 🛡️ Registered fully-isolated app: ${appName} (${appUrl})`);
+    logger.debug(`[WuStyleBridge] 🛡️ Registered fully-isolated app: ${appName} (${appUrl})`);
   }
 
   /**
@@ -165,7 +166,7 @@ export class WuStyleBridge {
 
       // Filtrar estilos de apps con fully-isolated (después de obtener viteId para mejor detección)
       if (this.isStyleFromFullyIsolatedApp(style) || (viteId && this.isStyleFromFullyIsolatedApp(viteId))) {
-        console.log(`[WuStyleBridge] 🛡️ Filtered out style from fully-isolated app: ${viteId || 'unknown'}`);
+        logger.debug(`[WuStyleBridge] 🛡️ Filtered out style from fully-isolated app: ${viteId || 'unknown'}`);
         return;
       }
 
@@ -193,7 +194,7 @@ export class WuStyleBridge {
       });
     }
 
-    console.log(`[WuStyleBridge] 🔍 Detected ${styles.length} shareable styles`);
+    logger.debug(`[WuStyleBridge] 🔍 Detected ${styles.length} shareable styles`);
     return styles;
   }
 
@@ -249,26 +250,26 @@ export class WuStyleBridge {
    */
   async injectStylesIntoShadow(shadowRoot, appName, styleMode) {
     if (!shadowRoot) {
-      console.warn('[WuStyleBridge] ⚠️ No shadow root provided');
+      logger.warn('[WuStyleBridge] ⚠️ No shadow root provided');
       return 0;
     }
 
     // 🛡️ MODO FULLY-ISOLATED: No inyectar ningún estilo compartido
     // Los estilos propios se manejan en wu-sandbox.js con injectOwnStylesToShadow
     if (styleMode === 'fully-isolated') {
-      console.log(`[WuStyleBridge] 🛡️ Style mode "fully-isolated" for ${appName}, skipping shared style injection`);
+      logger.debug(`[WuStyleBridge] 🛡️ Style mode "fully-isolated" for ${appName}, skipping shared style injection`);
       return 0;
     }
 
     // 🔒 MODO ISOLATED: No inyectar estilos externos - usar encapsulamiento nativo de Shadow DOM
     // La app debe manejar sus propios estilos (CSS-in-JS, scoped styles, imports directos)
     if (styleMode === 'isolated') {
-      console.log(`[WuStyleBridge] 🔒 Style mode "isolated" for ${appName}, using native Shadow DOM encapsulation (no external styles)`);
+      logger.debug(`[WuStyleBridge] 🔒 Style mode "isolated" for ${appName}, using native Shadow DOM encapsulation (no external styles)`);
       return 0;
     }
 
     // 🌐 MODO SHARED (default): Inyectar todos los estilos compartidos del documento
-    console.log(`[WuStyleBridge] 🌐 Style mode "shared" for ${appName}, injecting all shared styles...`);
+    logger.debug(`[WuStyleBridge] 🌐 Style mode "shared" for ${appName}, injecting all shared styles...`);
 
     // Detectar estilos del documento
     const styles = this.detectDocumentStyles();
@@ -294,11 +295,11 @@ export class WuStyleBridge {
             break;
         }
       } catch (error) {
-        console.warn(`[WuStyleBridge] ⚠️ Failed to inject style:`, error);
+        logger.warn(`[WuStyleBridge] ⚠️ Failed to inject style:`, error);
       }
     }
 
-    console.log(`[WuStyleBridge] ✅ Injected ${injectedCount} shared styles into ${appName}`);
+    logger.debug(`[WuStyleBridge] ✅ Injected ${injectedCount} shared styles into ${appName}`);
     return injectedCount;
   }
 
@@ -311,7 +312,7 @@ export class WuStyleBridge {
     // Verificar si ya existe
     const existing = shadowRoot.querySelector(`link[href="${style.href}"]`);
     if (existing) {
-      console.log(`[WuStyleBridge] ⏭️ Style already exists: ${style.library || style.href}`);
+      logger.debug(`[WuStyleBridge] ⏭️ Style already exists: ${style.library || style.href}`);
       return;
     }
 
@@ -325,7 +326,7 @@ export class WuStyleBridge {
     // Insertar al principio del shadow root (antes de otros estilos)
     shadowRoot.insertBefore(link, shadowRoot.firstChild);
 
-    console.log(`[WuStyleBridge] 🔗 Injected link: ${style.library || style.href}`);
+    logger.debug(`[WuStyleBridge] 🔗 Injected link: ${style.library || style.href}`);
   }
 
   /**
@@ -339,7 +340,7 @@ export class WuStyleBridge {
     if (viteId) {
       const existing = shadowRoot.querySelector(`style[data-wu-vite-id="${viteId}"]`);
       if (existing) {
-        console.log(`[WuStyleBridge] ⏭️ Inline style already exists: ${viteId}`);
+        logger.debug(`[WuStyleBridge] ⏭️ Inline style already exists: ${viteId}`);
         return;
       }
     }
@@ -356,7 +357,7 @@ export class WuStyleBridge {
     // Insertar al principio del shadow root
     shadowRoot.insertBefore(styleTag, shadowRoot.firstChild);
 
-    console.log(`[WuStyleBridge] 📝 Injected inline style: ${style.library || viteId}`);
+    logger.debug(`[WuStyleBridge] 📝 Injected inline style: ${style.library || viteId}`);
   }
 
   /**
@@ -373,7 +374,7 @@ export class WuStyleBridge {
 
       // Verificar si ya existe
       if (shadowRoot.adoptedStyleSheets.includes(style.sheet)) {
-        console.log(`[WuStyleBridge] ⏭️ Adopted stylesheet already exists`);
+        logger.debug(`[WuStyleBridge] ⏭️ Adopted stylesheet already exists`);
         return;
       }
 
@@ -382,9 +383,9 @@ export class WuStyleBridge {
         style.sheet
       ];
 
-      console.log(`[WuStyleBridge] 📋 Injected adopted stylesheet`);
+      logger.debug(`[WuStyleBridge] 📋 Injected adopted stylesheet`);
     } catch (error) {
-      console.warn(`[WuStyleBridge] ⚠️ Failed to inject adopted stylesheet:`, error);
+      logger.warn(`[WuStyleBridge] ⚠️ Failed to inject adopted stylesheet:`, error);
     }
   }
 
@@ -418,7 +419,7 @@ export class WuStyleBridge {
       }
 
       if (hasStyleChanges && callback) {
-        console.log('[WuStyleBridge] 🔄 Style changes detected');
+        logger.debug('[WuStyleBridge] 🔄 Style changes detected');
         callback();
       }
     });
@@ -429,7 +430,7 @@ export class WuStyleBridge {
       subtree: true
     });
 
-    console.log('[WuStyleBridge] 👀 Observing style changes');
+    logger.debug('[WuStyleBridge] 👀 Observing style changes');
   }
 
   /**
@@ -442,7 +443,7 @@ export class WuStyleBridge {
       ...config
     };
 
-    console.log('[WuStyleBridge] ⚙️ Configuration updated:', this.config);
+    logger.debug('[WuStyleBridge] ⚙️ Configuration updated:', this.config);
   }
 
   /**
@@ -454,8 +455,7 @@ export class WuStyleBridge {
       this.styleObserver = null;
     }
 
-    this.sharedStyles.clear();
-    console.log('[WuStyleBridge] 🧹 StyleBridge cleaned up');
+    logger.debug('[WuStyleBridge] 🧹 StyleBridge cleaned up');
   }
 
   /**