wu-framework 2.1.0 → 2.1.2

package/dist/wu-logger-fJfUHBGA.js.map

@@ -1 +1 @@
-{"version":3,"file":"wu-logger-fJfUHBGA.js","sources":["../src/core/wu-logger.js"],"sourcesContent":["/**\r\n * 📝 WU-LOGGER: Sistema de logging inteligente para entornos\r\n * Controla los logs automáticamente según el entorno\r\n */\r\n\r\nexport class WuLogger {\r\n  constructor() {\r\n    // Detectar entorno automáticamente\r\n    this.isDevelopment = this.detectEnvironment();\r\n    // En desarrollo: warn (menos ruido), en producción: error\r\n    this.logLevel = this.isDevelopment ? 'warn' : 'error';\r\n\r\n    this.levels = {\r\n      debug: 0,\r\n      info: 1,\r\n      warn: 2,\r\n      error: 3,\r\n      silent: 4\r\n    };\r\n  }\r\n\r\n  /**\r\n   * Detectar si estamos en desarrollo\r\n   */\r\n  detectEnvironment() {\r\n    // 1. Explicit flag takes priority\r\n    if (typeof window !== 'undefined' && window.WU_DEBUG === true) return true;\r\n    if (typeof window !== 'undefined' && window.WU_DEBUG === false) return false;\r\n\r\n    // 2. NODE_ENV check (works in bundlers and Node)\r\n    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'production') return false;\r\n    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'development') return true;\r\n\r\n    // 3. Browser heuristics (only if window exists)\r\n    if (typeof window !== 'undefined' && window.location) {\r\n      const hostname = window.location.hostname;\r\n      if (hostname === 'localhost' || hostname === '127.0.0.1' || hostname === '[::1]') return true;\r\n\r\n      // URL param override\r\n      try {\r\n        if (new URLSearchParams(window.location.search).has('wu-debug')) return true;\r\n      } catch {}\r\n    }\r\n\r\n    // 4. Default: assume production\r\n    return false;\r\n  }\r\n\r\n  /**\r\n   * Configurar nivel de logging\r\n   */\r\n  setLevel(level) {\r\n    this.logLevel = level;\r\n    return this;\r\n  }\r\n\r\n  /**\r\n   * Habilitar/deshabilitar development mode\r\n   */\r\n  setDevelopment(isDev) {\r\n    this.isDevelopment = isDev;\r\n    this.logLevel = isDev ? 'debug' : 'error';\r\n    return this;\r\n  }\r\n\r\n  /**\r\n   * Verificar si debemos mostrar el log\r\n   */\r\n  shouldLog(level) {\r\n    return this.levels[level] >= this.levels[this.logLevel];\r\n  }\r\n\r\n  /**\r\n   * Logging methods\r\n   */\r\n  debug(...args) {\r\n    if (this.shouldLog('debug')) {\r\n      console.log(...args);\r\n    }\r\n  }\r\n\r\n  info(...args) {\r\n    if (this.shouldLog('info')) {\r\n      console.info(...args);\r\n    }\r\n  }\r\n\r\n  warn(...args) {\r\n    if (this.shouldLog('warn')) {\r\n      console.warn(...args);\r\n    }\r\n  }\r\n\r\n  error(...args) {\r\n    if (this.shouldLog('error')) {\r\n      console.error(...args);\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Logging con contexto Wu\r\n   */\r\n  wu(level, ...args) {\r\n    if (this.shouldLog(level)) {\r\n      const method = level === 'debug' ? 'log' : level;\r\n      console[method]('[Wu]', ...args);\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Helper methods específicos para Wu\r\n   */\r\n  wuDebug(...args) { this.wu('debug', ...args); }\r\n  wuInfo(...args) { this.wu('info', ...args); }\r\n  wuWarn(...args) { this.wu('warn', ...args); }\r\n  wuError(...args) { this.wu('error', ...args); }\r\n}\r\n\r\n// Singleton instance\r\nexport const logger = new WuLogger();\r\n\r\n// Helper para compatibilidad con logs existentes\r\nexport const wuLog = {\r\n  debug: (...args) => logger.wuDebug(...args),\r\n  info: (...args) => logger.wuInfo(...args),\r\n  warn: (...args) => logger.wuWarn(...args),\r\n  error: (...args) => logger.wuError(...args)\r\n};\r\n\r\n/**\r\n * 🔇 Silenciar todos los logs de Wu Framework\r\n * Útil en producción para eliminar todo el ruido\r\n */\r\nexport function silenceAllLogs() {\r\n  logger.setLevel('silent');\r\n}\r\n\r\n/**\r\n * 🔊 Restaurar logs (nivel debug)\r\n */\r\nexport function enableAllLogs() {\r\n  logger.setLevel('debug');\r\n}"],"names":["logger","constructor","this","isDevelopment","detectEnvironment","logLevel","levels","debug","info","warn","error","silent","window","WU_DEBUG","process","env","NODE_ENV","location","hostname","URLSearchParams","search","has","setLevel","level","setDevelopment","isDev","shouldLog","args","console","log","wu","wuDebug","wuInfo","wuWarn","wuError"],"mappings":"AAuHY,MAACA,EAAS,IAlHf,MACL,WAAAC,GAEEC,KAAKC,cAAgBD,KAAKE,oBAE1BF,KAAKG,SAAWH,KAAKC,cAAgB,OAAS,QAE9CD,KAAKI,OAAS,CACZC,MAAO,EACPC,KAAM,EACNC,KAAM,EACNC,MAAO,EACPC,OAAQ,EAEZ,CAKA,iBAAAP,GAEE,GAAsB,oBAAXQ,SAA8C,IAApBA,OAAOC,SAAmB,OAAO,EACtE,GAAsB,oBAAXD,SAA8C,IAApBA,OAAOC,SAAoB,OAAO,EAGvE,GAAuB,oBAAZC,SAAqD,eAA1BA,QAAQC,KAAKC,SAA2B,OAAO,EACrF,GAAuB,oBAAZF,SAAqD,gBAA1BA,QAAQC,KAAKC,SAA4B,OAAO,EAGtF,GAAsB,oBAAXJ,QAA0BA,OAAOK,SAAU,CACpD,MAAMC,EAAWN,OAAOK,SAASC,SACjC,GAAiB,cAAbA,GAAyC,cAAbA,GAAyC,UAAbA,EAAsB,OAAO,EAGzF,IACE,GAAI,IAAIC,gBAAgBP,OAAOK,SAASG,QAAQC,IAAI,YAAa,OAAO,CAC1E,CAAE,MAAO,CACX,CAGA,OAAO,CACT,CAKA,QAAAC,CAASC,GAEP,OADArB,KAAKG,SAAWkB,EACTrB,IACT,CAKA,cAAAsB,CAAeC,GAGb,OAFAvB,KAAKC,cAAgBsB,EACrBvB,KAAKG,SAAWoB,EAAQ,QAAU,QAC3BvB,IACT,CAKA,SAAAwB,CAAUH,GACR,OAAOrB,KAAKI,OAAOiB,IAAUrB,KAAKI,OAAOJ,KAAKG,SAChD,CAKA,KAAAE,IAASoB,GACHzB,KAAKwB,UAAU,UACjBE,QAAQC,OAAOF,EAEnB,CAEA,IAAAnB,IAAQmB,GACFzB,KAAKwB,UAAU,SACjBE,QAAQpB,QAAQmB,EAEpB,CAEA,IAAAlB,IAAQkB,GACFzB,KAAKwB,UAAU,SACjBE,QAAQnB,QAAQkB,EAEpB,CAEA,KAAAjB,IAASiB,GACHzB,KAAKwB,UAAU,UACjBE,QAAQlB,SAASiB,EAErB,CAKA,EAAAG,CAAGP,KAAUI,GACX,GAAIzB,KAAKwB,UAAUH,GAAQ,CAEzBK,QADyB,UAAVL,EAAoB,MAAQA,GAC3B,UAAWI,EAC7B,CACF,CAKA,OAAAI,IAAWJ,GAAQzB,KAAK4B,GAAG,WAAYH,EAAO,CAC9C,MAAAK,IAAUL,GAAQzB,KAAK4B,GAAG,UAAWH,EAAO,CAC5C,MAAAM,IAAUN,GAAQzB,KAAK4B,GAAG,UAAWH,EAAO,CAC5C,OAAAO,IAAWP,GAAQzB,KAAK4B,GAAG,WAAYH,EAAO"}
+{"version":3,"file":"wu-logger-fJfUHBGA.js","sources":["../src/core/wu-logger.js"],"sourcesContent":["/**\n * 📝 WU-LOGGER: Sistema de logging inteligente para entornos\n * Controla los logs automáticamente según el entorno\n */\n\nexport class WuLogger {\n  constructor() {\n    // Detectar entorno automáticamente\n    this.isDevelopment = this.detectEnvironment();\n    // En desarrollo: warn (menos ruido), en producción: error\n    this.logLevel = this.isDevelopment ? 'warn' : 'error';\n\n    this.levels = {\n      debug: 0,\n      info: 1,\n      warn: 2,\n      error: 3,\n      silent: 4\n    };\n  }\n\n  /**\n   * Detectar si estamos en desarrollo\n   */\n  detectEnvironment() {\n    // 1. Explicit flag takes priority\n    if (typeof window !== 'undefined' && window.WU_DEBUG === true) return true;\n    if (typeof window !== 'undefined' && window.WU_DEBUG === false) return false;\n\n    // 2. NODE_ENV check (works in bundlers and Node)\n    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'production') return false;\n    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'development') return true;\n\n    // 3. Browser heuristics (only if window exists)\n    if (typeof window !== 'undefined' && window.location) {\n      const hostname = window.location.hostname;\n      if (hostname === 'localhost' || hostname === '127.0.0.1' || hostname === '[::1]') return true;\n\n      // URL param override\n      try {\n        if (new URLSearchParams(window.location.search).has('wu-debug')) return true;\n      } catch {}\n    }\n\n    // 4. Default: assume production\n    return false;\n  }\n\n  /**\n   * Configurar nivel de logging\n   */\n  setLevel(level) {\n    this.logLevel = level;\n    return this;\n  }\n\n  /**\n   * Habilitar/deshabilitar development mode\n   */\n  setDevelopment(isDev) {\n    this.isDevelopment = isDev;\n    this.logLevel = isDev ? 'debug' : 'error';\n    return this;\n  }\n\n  /**\n   * Verificar si debemos mostrar el log\n   */\n  shouldLog(level) {\n    return this.levels[level] >= this.levels[this.logLevel];\n  }\n\n  /**\n   * Logging methods\n   */\n  debug(...args) {\n    if (this.shouldLog('debug')) {\n      console.log(...args);\n    }\n  }\n\n  info(...args) {\n    if (this.shouldLog('info')) {\n      console.info(...args);\n    }\n  }\n\n  warn(...args) {\n    if (this.shouldLog('warn')) {\n      console.warn(...args);\n    }\n  }\n\n  error(...args) {\n    if (this.shouldLog('error')) {\n      console.error(...args);\n    }\n  }\n\n  /**\n   * Logging con contexto Wu\n   */\n  wu(level, ...args) {\n    if (this.shouldLog(level)) {\n      const method = level === 'debug' ? 'log' : level;\n      console[method]('[Wu]', ...args);\n    }\n  }\n\n  /**\n   * Helper methods específicos para Wu\n   */\n  wuDebug(...args) { this.wu('debug', ...args); }\n  wuInfo(...args) { this.wu('info', ...args); }\n  wuWarn(...args) { this.wu('warn', ...args); }\n  wuError(...args) { this.wu('error', ...args); }\n}\n\n// Singleton instance\nexport const logger = new WuLogger();\n\n// Helper para compatibilidad con logs existentes\nexport const wuLog = {\n  debug: (...args) => logger.wuDebug(...args),\n  info: (...args) => logger.wuInfo(...args),\n  warn: (...args) => logger.wuWarn(...args),\n  error: (...args) => logger.wuError(...args)\n};\n\n/**\n * 🔇 Silenciar todos los logs de Wu Framework\n * Útil en producción para eliminar todo el ruido\n */\nexport function silenceAllLogs() {\n  logger.setLevel('silent');\n}\n\n/**\n * 🔊 Restaurar logs (nivel debug)\n */\nexport function enableAllLogs() {\n  logger.setLevel('debug');\n}"],"names":["logger","constructor","this","isDevelopment","detectEnvironment","logLevel","levels","debug","info","warn","error","silent","window","WU_DEBUG","process","env","NODE_ENV","location","hostname","URLSearchParams","search","has","setLevel","level","setDevelopment","isDev","shouldLog","args","console","log","wu","wuDebug","wuInfo","wuWarn","wuError"],"mappings":"AAuHY,MAACA,EAAS,IAlHf,MACL,WAAAC,GAEEC,KAAKC,cAAgBD,KAAKE,oBAE1BF,KAAKG,SAAWH,KAAKC,cAAgB,OAAS,QAE9CD,KAAKI,OAAS,CACZC,MAAO,EACPC,KAAM,EACNC,KAAM,EACNC,MAAO,EACPC,OAAQ,EAEZ,CAKA,iBAAAP,GAEE,GAAsB,oBAAXQ,SAA8C,IAApBA,OAAOC,SAAmB,OAAO,EACtE,GAAsB,oBAAXD,SAA8C,IAApBA,OAAOC,SAAoB,OAAO,EAGvE,GAAuB,oBAAZC,SAAqD,eAA1BA,QAAQC,KAAKC,SAA2B,OAAO,EACrF,GAAuB,oBAAZF,SAAqD,gBAA1BA,QAAQC,KAAKC,SAA4B,OAAO,EAGtF,GAAsB,oBAAXJ,QAA0BA,OAAOK,SAAU,CACpD,MAAMC,EAAWN,OAAOK,SAASC,SACjC,GAAiB,cAAbA,GAAyC,cAAbA,GAAyC,UAAbA,EAAsB,OAAO,EAGzF,IACE,GAAI,IAAIC,gBAAgBP,OAAOK,SAASG,QAAQC,IAAI,YAAa,OAAO,CAC1E,CAAE,MAAO,CACX,CAGA,OAAO,CACT,CAKA,QAAAC,CAASC,GAEP,OADArB,KAAKG,SAAWkB,EACTrB,IACT,CAKA,cAAAsB,CAAeC,GAGb,OAFAvB,KAAKC,cAAgBsB,EACrBvB,KAAKG,SAAWoB,EAAQ,QAAU,QAC3BvB,IACT,CAKA,SAAAwB,CAAUH,GACR,OAAOrB,KAAKI,OAAOiB,IAAUrB,KAAKI,OAAOJ,KAAKG,SAChD,CAKA,KAAAE,IAASoB,GACHzB,KAAKwB,UAAU,UACjBE,QAAQC,OAAOF,EAEnB,CAEA,IAAAnB,IAAQmB,GACFzB,KAAKwB,UAAU,SACjBE,QAAQpB,QAAQmB,EAEpB,CAEA,IAAAlB,IAAQkB,GACFzB,KAAKwB,UAAU,SACjBE,QAAQnB,QAAQkB,EAEpB,CAEA,KAAAjB,IAASiB,GACHzB,KAAKwB,UAAU,UACjBE,QAAQlB,SAASiB,EAErB,CAKA,EAAAG,CAAGP,KAAUI,GACX,GAAIzB,KAAKwB,UAAUH,GAAQ,CAEzBK,QADyB,UAAVL,EAAoB,MAAQA,GAC3B,UAAWI,EAC7B,CACF,CAKA,OAAAI,IAAWJ,GAAQzB,KAAK4B,GAAG,WAAYH,EAAO,CAC9C,MAAAK,IAAUL,GAAQzB,KAAK4B,GAAG,UAAWH,EAAO,CAC5C,MAAAM,IAAUN,GAAQzB,KAAK4B,GAAG,UAAWH,EAAO,CAC5C,OAAAO,IAAWP,GAAQzB,KAAK4B,GAAG,WAAYH,EAAO"}

package/integrations/astro/README.md

@@ -1,127 +1,127 @@
-# @wu-framework/astro
-
-Astro integration for **wu-framework** microfrontends. Mount wu micro-apps inside any Astro site with zero runtime overhead at build time.
-
-## Installation
-
-```bash
-npm install @wu-framework/astro wu-framework
-```
-
-## Quick Start
-
-### 1. Add the integration
-
-```js
-// astro.config.mjs
-import { defineConfig } from 'astro/config';
-import wu from '@wu-framework/astro';
-
-export default defineConfig({
-  integrations: [
-    wu({
-      apps: [
-        { name: 'header', url: '/apps/header', strategy: 'eager' },
-        { name: 'dashboard', url: '/apps/dashboard' }
-      ]
-    })
-  ]
-});
-```
-
-The integration injects the wu-framework runtime and auto-calls `wu.init()` with your apps config.
-
-### 2. Mount micro-apps in pages
-
-```astro
----
-import WuApp from '@wu-framework/astro/WuApp.astro';
----
-
-<WuApp name="header" />
-<WuApp name="dashboard" lazy />
-```
-
-The `lazy` prop defers mounting until the element scrolls into view (uses `IntersectionObserver` with a 200px root margin).
-
-## Components
-
-### `WuApp`
-
-Renders a mount point and calls `wu.mount()` on the client.
-
-| Prop    | Type      | Default | Description                              |
-| ------- | --------- | ------- | ---------------------------------------- |
-| `name`  | `string`  | —       | Name of the registered micro-app         |
-| `lazy`  | `boolean` | `false` | Defer mount until visible                |
-| `class` | `string`  | —       | CSS class(es) for the container          |
-| `style` | `string`  | —       | Inline styles for the container          |
-
-### `WuShell`
-
-Layout wrapper that calls `wu.init()` on the client. Useful when you want page-level control instead of the global integration.
-
-```astro
----
-import WuShell from '@wu-framework/astro/WuShell.astro';
----
-
-<WuShell apps={[{ name: 'header', url: '/apps/header' }]}>
-  <main>Page content here</main>
-</WuShell>
-```
-
-| Prop      | Type           | Default | Description                 |
-| --------- | -------------- | ------- | --------------------------- |
-| `apps`    | `WuAppConfig[]`| —       | Micro-app definitions       |
-| `sandbox` | `string`       | —       | Sandbox mode                |
-| `debug`   | `boolean`      | `false` | Enable debug logging        |
-
-## Integration Options
-
-| Option    | Type            | Default | Description                                     |
-| --------- | --------------- | ------- | ----------------------------------------------- |
-| `apps`    | `WuAppConfig[]` | `[]`    | Auto-register apps via `wu.init()`              |
-| `sandbox` | `string`        | —       | Global sandbox mode (`module`/`strict`/`eval`)  |
-| `cdn`     | `string`        | —       | CDN URL for wu-framework UMD bundle             |
-| `debug`   | `boolean`       | `false` | Enable debug logging                            |
-
-## Usage Patterns
-
-### Integration only (auto-init)
-
-Use the integration in `astro.config.mjs` to auto-init, then mount with `WuApp`:
-
-```astro
----
-import WuApp from '@wu-framework/astro/WuApp.astro';
----
-<WuApp name="header" />
-```
-
-### Shell layout (page-level init)
-
-Skip the integration's `apps` option and use `WuShell` for per-page control:
-
-```astro
----
-import WuShell from '@wu-framework/astro/WuShell.astro';
-import WuApp from '@wu-framework/astro/WuApp.astro';
----
-<WuShell apps={[{ name: 'nav', url: '/apps/nav' }]}>
-  <WuApp name="nav" />
-  <slot />
-</WuShell>
-```
-
-### CDN mode
-
-Load wu-framework from a CDN instead of bundling it:
-
-```js
-wu({ cdn: 'https://cdn.example.com/wu-framework@1.1.8/dist/wu-framework.umd.js' })
-```
-
-## License
-
-MIT
+# @wu-framework/astro
+
+Astro integration for **wu-framework** microfrontends. Mount wu micro-apps inside any Astro site with zero runtime overhead at build time.
+
+## Installation
+
+```bash
+npm install @wu-framework/astro wu-framework
+```
+
+## Quick Start
+
+### 1. Add the integration
+
+```js
+// astro.config.mjs
+import { defineConfig } from 'astro/config';
+import wu from '@wu-framework/astro';
+
+export default defineConfig({
+  integrations: [
+    wu({
+      apps: [
+        { name: 'header', url: '/apps/header', strategy: 'eager' },
+        { name: 'dashboard', url: '/apps/dashboard' }
+      ]
+    })
+  ]
+});
+```
+
+The integration injects the wu-framework runtime and auto-calls `wu.init()` with your apps config.
+
+### 2. Mount micro-apps in pages
+
+```astro
+---
+import WuApp from '@wu-framework/astro/WuApp.astro';
+---
+
+<WuApp name="header" />
+<WuApp name="dashboard" lazy />
+```
+
+The `lazy` prop defers mounting until the element scrolls into view (uses `IntersectionObserver` with a 200px root margin).
+
+## Components
+
+### `WuApp`
+
+Renders a mount point and calls `wu.mount()` on the client.
+
+| Prop    | Type      | Default | Description                              |
+| ------- | --------- | ------- | ---------------------------------------- |
+| `name`  | `string`  | —       | Name of the registered micro-app         |
+| `lazy`  | `boolean` | `false` | Defer mount until visible                |
+| `class` | `string`  | —       | CSS class(es) for the container          |
+| `style` | `string`  | —       | Inline styles for the container          |
+
+### `WuShell`
+
+Layout wrapper that calls `wu.init()` on the client. Useful when you want page-level control instead of the global integration.
+
+```astro
+---
+import WuShell from '@wu-framework/astro/WuShell.astro';
+---
+
+<WuShell apps={[{ name: 'header', url: '/apps/header' }]}>
+  <main>Page content here</main>
+</WuShell>
+```
+
+| Prop      | Type           | Default | Description                 |
+| --------- | -------------- | ------- | --------------------------- |
+| `apps`    | `WuAppConfig[]`| —       | Micro-app definitions       |
+| `sandbox` | `string`       | —       | Sandbox mode                |
+| `debug`   | `boolean`      | `false` | Enable debug logging        |
+
+## Integration Options
+
+| Option    | Type            | Default | Description                                     |
+| --------- | --------------- | ------- | ----------------------------------------------- |
+| `apps`    | `WuAppConfig[]` | `[]`    | Auto-register apps via `wu.init()`              |
+| `sandbox` | `string`        | —       | Global sandbox mode (`module`/`strict`/`eval`)  |
+| `cdn`     | `string`        | —       | CDN URL for wu-framework UMD bundle             |
+| `debug`   | `boolean`       | `false` | Enable debug logging                            |
+
+## Usage Patterns
+
+### Integration only (auto-init)
+
+Use the integration in `astro.config.mjs` to auto-init, then mount with `WuApp`:
+
+```astro
+---
+import WuApp from '@wu-framework/astro/WuApp.astro';
+---
+<WuApp name="header" />
+```
+
+### Shell layout (page-level init)
+
+Skip the integration's `apps` option and use `WuShell` for per-page control:
+
+```astro
+---
+import WuShell from '@wu-framework/astro/WuShell.astro';
+import WuApp from '@wu-framework/astro/WuApp.astro';
+---
+<WuShell apps={[{ name: 'nav', url: '/apps/nav' }]}>
+  <WuApp name="nav" />
+  <slot />
+</WuShell>
+```
+
+### CDN mode
+
+Load wu-framework from a CDN instead of bundling it:
+
+```js
+wu({ cdn: 'https://cdn.example.com/wu-framework@1.1.8/dist/wu-framework.umd.js' })
+```
+
+## License
+
+MIT

package/integrations/astro/WuApp.astro

@@ -1,63 +1,63 @@
----
-/**
- * WuApp — Mount point for a wu micro-app.
- *
- * Renders a <div> and runs wu.mount() on the client to hydrate
- * the named micro-app into it.  When `lazy` is true the mount
- * is deferred until the element scrolls into view.
- *
- * @example
- * ---
- * import WuApp from '@wu-framework/astro/WuApp.astro';
- * ---
- * <WuApp name="header" />
- * <WuApp name="dashboard" lazy />
- */
-
-interface Props {
-  /** Name of the registered wu micro-app */
-  name: string;
-  /** Defer mounting until the element is visible */
-  lazy?: boolean;
-  /** CSS class(es) for the container div */
-  class?: string;
-  /** Inline styles for the container div */
-  style?: string;
-}
-
-const { name, lazy = false } = Astro.props;
-const id = `wu-app-${name}`;
----
-
-<div
-  id={id}
-  class={Astro.props.class}
-  style={Astro.props.style}
-  data-wu-app={name}
-  data-wu-lazy={lazy}
-></div>
-
-<script define:vars={{ id, name, lazy }}>
-  async function mountApp() {
-    const { wu } = await import('wu-framework');
-    await wu.mount(name, `#${id}`);
-  }
-
-  if (lazy) {
-    const el = document.getElementById(id);
-    if (el) {
-      const observer = new IntersectionObserver(
-        (entries) => {
-          if (entries[0].isIntersecting) {
-            observer.disconnect();
-            mountApp();
-          }
-        },
-        { rootMargin: '200px' }
-      );
-      observer.observe(el);
-    }
-  } else {
-    mountApp();
-  }
-</script>
+---
+/**
+ * WuApp — Mount point for a wu micro-app.
+ *
+ * Renders a <div> and runs wu.mount() on the client to hydrate
+ * the named micro-app into it.  When `lazy` is true the mount
+ * is deferred until the element scrolls into view.
+ *
+ * @example
+ * ---
+ * import WuApp from '@wu-framework/astro/WuApp.astro';
+ * ---
+ * <WuApp name="header" />
+ * <WuApp name="dashboard" lazy />
+ */
+
+interface Props {
+  /** Name of the registered wu micro-app */
+  name: string;
+  /** Defer mounting until the element is visible */
+  lazy?: boolean;
+  /** CSS class(es) for the container div */
+  class?: string;
+  /** Inline styles for the container div */
+  style?: string;
+}
+
+const { name, lazy = false } = Astro.props;
+const id = `wu-app-${name}`;
+---
+
+<div
+  id={id}
+  class={Astro.props.class}
+  style={Astro.props.style}
+  data-wu-app={name}
+  data-wu-lazy={lazy}
+></div>
+
+<script define:vars={{ id, name, lazy }}>
+  async function mountApp() {
+    const { wu } = await import('wu-framework');
+    await wu.mount(name, `#${id}`);
+  }
+
+  if (lazy) {
+    const el = document.getElementById(id);
+    if (el) {
+      const observer = new IntersectionObserver(
+        (entries) => {
+          if (entries[0].isIntersecting) {
+            observer.disconnect();
+            mountApp();
+          }
+        },
+        { rootMargin: '200px' }
+      );
+      observer.observe(el);
+    }
+  } else {
+    mountApp();
+  }
+</script>

package/integrations/astro/WuShell.astro

@@ -1,39 +1,39 @@
----
-/**
- * WuShell — Layout wrapper that initializes wu-framework on the client.
- *
- * Wraps page content in a <slot /> and runs wu.init() with the
- * provided app configuration once the page loads.
- *
- * @example
- * ---
- * import WuShell from '@wu-framework/astro/WuShell.astro';
- * ---
- * <WuShell apps={[{ name: 'header', url: '/apps/header' }]}>
- *   <main>My page content</main>
- * </WuShell>
- */
-
-interface Props {
-  /** Array of micro-app definitions to register with wu.init() */
-  apps: Array<{
-    name: string;
-    url: string;
-    strategy?: 'eager' | 'lazy' | 'manual';
-  }>;
-  /** Sandbox isolation mode */
-  sandbox?: 'module' | 'strict' | 'eval';
-  /** Enable debug logging */
-  debug?: boolean;
-}
-
-const { apps, sandbox, debug = false } = Astro.props;
----
-
-<slot />
-
-<script define:vars={{ apps, sandbox, debug }}>
-  import('wu-framework').then(({ wu }) => {
-    wu.init({ apps, sandbox, debug });
-  });
-</script>
+---
+/**
+ * WuShell — Layout wrapper that initializes wu-framework on the client.
+ *
+ * Wraps page content in a <slot /> and runs wu.init() with the
+ * provided app configuration once the page loads.
+ *
+ * @example
+ * ---
+ * import WuShell from '@wu-framework/astro/WuShell.astro';
+ * ---
+ * <WuShell apps={[{ name: 'header', url: '/apps/header' }]}>
+ *   <main>My page content</main>
+ * </WuShell>
+ */
+
+interface Props {
+  /** Array of micro-app definitions to register with wu.init() */
+  apps: Array<{
+    name: string;
+    url: string;
+    strategy?: 'eager' | 'lazy' | 'manual';
+  }>;
+  /** Sandbox isolation mode */
+  sandbox?: 'module' | 'strict' | 'eval';
+  /** Enable debug logging */
+  debug?: boolean;
+}
+
+const { apps, sandbox, debug = false } = Astro.props;
+---
+
+<slot />
+
+<script define:vars={{ apps, sandbox, debug }}>
+  import('wu-framework').then(({ wu }) => {
+    wu.init({ apps, sandbox, debug });
+  });
+</script>

package/integrations/astro/index.js

@@ -1,68 +1,68 @@
-/**
- * @wu-framework/astro — Astro integration for wu-framework microfrontends.
- *
- * Injects the wu-framework runtime into Astro pages and optionally
- * auto-initializes registered micro-apps via wu.init().
- *
- * @example
- * // astro.config.mjs
- * import wu from '@wu-framework/astro';
- *
- * export default defineConfig({
- *   integrations: [
- *     wu({
- *       apps: [
- *         { name: 'header', url: '/apps/header', strategy: 'eager' },
- *         { name: 'dashboard', url: '/apps/dashboard' }
- *       ]
- *     })
- *   ]
- * });
- */
-
-/**
- * @param {import('./types').WuIntegrationOptions} options
- * @returns {import('astro').AstroIntegration}
- */
-export default function wuIntegration(options = {}) {
-  const {
-    apps = [],
-    sandbox,
-    cdn,
-    debug = false,
-  } = options;
-
-  return {
-    name: '@wu-framework/astro',
-    hooks: {
-      'astro:config:setup': ({ injectScript, updateConfig }) => {
-        // 1. Inject wu-framework runtime
-        if (cdn) {
-          // Use external CDN script (client-only)
-          injectScript(
-            'head-inline',
-            `(function(){var s=document.createElement('script');s.src='${cdn}';s.defer=true;document.head.appendChild(s);})()`
-          );
-        }
-
-        // 2. Auto-init if apps are provided (client-only via 'page')
-        if (apps.length > 0) {
-          const initConfig = JSON.stringify({ apps, sandbox, debug });
-          injectScript(
-            'page',
-            `import('wu-framework').then(function(m){m.wu.init(${initConfig});});`
-          );
-        }
-
-        // 3. Ensure Vite resolves wu-framework correctly
-        updateConfig({
-          vite: {
-            optimizeDeps: {
-              include: ['wu-framework'],
-            },
-          },
-        });
-      },
-    },
-  };
-}
+/**
+ * @wu-framework/astro — Astro integration for wu-framework microfrontends.
+ *
+ * Injects the wu-framework runtime into Astro pages and optionally
+ * auto-initializes registered micro-apps via wu.init().
+ *
+ * @example
+ * // astro.config.mjs
+ * import wu from '@wu-framework/astro';
+ *
+ * export default defineConfig({
+ *   integrations: [
+ *     wu({
+ *       apps: [
+ *         { name: 'header', url: '/apps/header', strategy: 'eager' },
+ *         { name: 'dashboard', url: '/apps/dashboard' }
+ *       ]
+ *     })
+ *   ]
+ * });
+ */
+
+/**
+ * @param {import('./types').WuIntegrationOptions} options
+ * @returns {import('astro').AstroIntegration}
+ */
+export default function wuIntegration(options = {}) {
+  const {
+    apps = [],
+    sandbox,
+    cdn,
+    debug = false,
+  } = options;
+
+  return {
+    name: '@wu-framework/astro',
+    hooks: {
+      'astro:config:setup': ({ injectScript, updateConfig }) => {
+        // 1. Inject wu-framework runtime
+        if (cdn) {
+          // Use external CDN script (client-only)
+          injectScript(
+            'head-inline',
+            `(function(){var s=document.createElement('script');s.src='${cdn}';s.defer=true;document.head.appendChild(s);})()`
+          );
+        }
+
+        // 2. Auto-init if apps are provided (client-only via 'page')
+        if (apps.length > 0) {
+          const initConfig = JSON.stringify({ apps, sandbox, debug });
+          injectScript(
+            'page',
+            `import('wu-framework').then(function(m){m.wu.init(${initConfig});});`
+          );
+        }
+
+        // 3. Ensure Vite resolves wu-framework correctly
+        updateConfig({
+          vite: {
+            optimizeDeps: {
+              include: ['wu-framework'],
+            },
+          },
+        });
+      },
+    },
+  };
+}