wu-framework 1.1.16 → 1.1.18

package/README.md

@@ -1,5 +1,5 @@
 <p align="center">
-  <img src="https://wu-framework.dev/favicon.svg" width="80" alt="Wu Framework" />
+  <img src="https://raw.githubusercontent.com/LuisPadre25/wu-framework/main/wu-logo.png" width="80" alt="Wu Framework" />
 </p>
 
 <h1 align="center">Wu Framework</h1>
@@ -10,16 +10,16 @@
 
 <p align="center">
   <a href="https://www.npmjs.com/package/wu-framework"><img src="https://img.shields.io/npm/v/wu-framework.svg?color=8b5cf6&label=npm" alt="npm version" /></a>
-  <a href="https://github.com/wu-framework/wu-framework/actions"><img src="https://img.shields.io/github/actions/workflow/status/wu-framework/wu-framework/ci.yml?label=tests&color=10b981" alt="tests" /></a>
+  <a href="https://github.com/LuisPadre25/wu-framework/actions"><img src="https://img.shields.io/github/actions/workflow/status/LuisPadre25/wu-framework/ci.yml?label=tests&color=10b981" alt="tests" /></a>
   <img src="https://img.shields.io/badge/tests-650%20passed-10b981" alt="650 tests" />
   <img src="https://img.shields.io/badge/dependencies-0-8b5cf6" alt="zero deps" />
   <a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="MIT License" /></a>
 </p>
 
 <p align="center">
-  <a href="https://wu-framework.dev">Documentation</a> &middot;
-  <a href="https://wu-framework.dev/docs/quick-start">Quick Start</a> &middot;
-  <a href="https://wu-framework.dev/docs/ai/overview">AI Integration</a> &middot;
+  <a href="https://www.wu-framework.com">Documentation</a> &middot;
+  <a href="https://www.wu-framework.com/docs/quick-start">Quick Start</a> &middot;
+  <a href="https://www.wu-framework.com/docs/ai/overview">AI Integration</a> &middot;
   <a href="#wucommerce--real-world-example">Live Example</a>
 </p>
 
@@ -345,7 +345,7 @@ npm run test:coverage  # Coverage report
 | `wu-framework.esm.js` | ES Module | Bundler imports |
 | `wu-framework.cjs.js` | CommonJS | Node.js require |
 | `wu-framework.umd.js` | UMD | CDN / script tag |
-| `wu-framework.dev.js` | ES Module | Development |
+| `www.wu-framework.com.js` | ES Module | Development |
 
 ---
 
@@ -376,20 +376,20 @@ npm run test:coverage  # Coverage report
 
 ## Documentation
 
-Full documentation at **[wu-framework.dev](https://wu-framework.dev)**
-
-- [Quick Start](https://wu-framework.dev/docs/quick-start) — Get running in 5 minutes
-- [Getting Started](https://wu-framework.dev/docs/getting-started) — Deeper tutorial with cross-app communication
-- [API Reference](https://wu-framework.dev/docs/core/api) — Full API docs
-- [Event Bus](https://wu-framework.dev/docs/core/event-bus) — Inter-app communication
-- [Shared Store](https://wu-framework.dev/docs/core/store) — Cross-app reactive state
-- [Sandbox](https://wu-framework.dev/docs/core/sandbox) — JS isolation strategies
-- [AI Overview](https://wu-framework.dev/docs/ai/overview) — 4 AI paradigms
-- [AI Actions](https://wu-framework.dev/docs/ai/actions) — Register tools for the LLM
-- [Browser Actions](https://wu-framework.dev/docs/ai/browser-actions) — 10 built-in browser tools
-- [MCP Server](https://wu-framework.dev/docs/ai/mcp-server) — Connect AI agents to live apps
-- [CSS Isolation](https://wu-framework.dev/docs/guides/css-isolation) — Shadow DOM style modes
-- [Deployment](https://wu-framework.dev/docs/guides/deployment) — Production deployment guide
+Full documentation at **[www.wu-framework.com](https://www.wu-framework.com)**
+
+- [Quick Start](https://www.wu-framework.com/docs/quick-start) — Get running in 5 minutes
+- [Getting Started](https://www.wu-framework.com/docs/getting-started) — Deeper tutorial with cross-app communication
+- [API Reference](https://www.wu-framework.com/docs/core/api) — Full API docs
+- [Event Bus](https://www.wu-framework.com/docs/core/event-bus) — Inter-app communication
+- [Shared Store](https://www.wu-framework.com/docs/core/store) — Cross-app reactive state
+- [Sandbox](https://www.wu-framework.com/docs/core/sandbox) — JS isolation strategies
+- [AI Overview](https://www.wu-framework.com/docs/ai/overview) — 4 AI paradigms
+- [AI Actions](https://www.wu-framework.com/docs/ai/actions) — Register tools for the LLM
+- [Browser Actions](https://www.wu-framework.com/docs/ai/browser-actions) — 10 built-in browser tools
+- [MCP Server](https://www.wu-framework.com/docs/ai/mcp-server) — Connect AI agents to live apps
+- [CSS Isolation](https://www.wu-framework.com/docs/guides/css-isolation) — Shadow DOM style modes
+- [Deployment](https://www.wu-framework.com/docs/guides/deployment) — Production deployment guide
 
 ---
 
@@ -397,6 +397,38 @@ Full documentation at **[wu-framework.dev](https://wu-framework.dev)**
 
 Chrome 80+, Firefox 78+, Safari 14+, Edge 80+. Shadow DOM v1 required.
 
+---
+
+<div align="center">
+
+### What if Wu Framework could think without thinking?
+
+</div>
+
+```
+User: "add to cart"
+
+                  Before                              After
+                  ──────                              ─────
+          wu.ai.send() → LLM                 wu.ai.send() → ???
+          ~2,000 ms                           ~0.73 ms
+          $0.003 per call                     $0.000
+```
+
+Something is coming. It learned from every LLM call you ever made. It doesn't need the cloud anymore.
+
+**99.79% accuracy. 0.73 milliseconds. 800 KB. Zero GPU. Zero internet.**
+
+274x faster than neural networks. And it dreams.
+
+<div align="center">
+
+**COMING SOON**
+
+</div>
+
+---
+
 ## Contributing
 
 Contributions welcome. Please open an issue first to discuss what you'd like to change.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wu-framework",
-  "version": "1.1.16",
+  "version": "1.1.18",
   "description": "Universal Microfrontends Framework - 8 frameworks, zero config, Shadow DOM isolation",
   "main": "dist/wu-framework.cjs.js",
   "module": "src/index.js",
@@ -22,6 +22,11 @@
     "./adapters/solid": "./src/adapters/solid/index.js",
     "./adapters/lit": "./src/adapters/lit/index.js",
     "./adapters/vanilla": "./src/adapters/vanilla/index.js",
+    "./adapters/alpine": "./src/adapters/alpine/index.js",
+    "./adapters/qwik": "./src/adapters/qwik/index.js",
+    "./adapters/stencil": "./src/adapters/stencil/index.js",
+    "./adapters/htmx": "./src/adapters/htmx/index.js",
+    "./adapters/stimulus": "./src/adapters/stimulus/index.js",
     "./integrations/astro": "./integrations/astro/index.js",
     "./integrations/astro/WuApp.astro": "./integrations/astro/WuApp.astro",
     "./integrations/astro/WuShell.astro": "./integrations/astro/WuShell.astro"
@@ -35,7 +40,10 @@
     "clean": "node -e \"require('fs').rmSync('dist',{recursive:true,force:true})\"",
     "test": "vitest run",
     "test:watch": "vitest",
-    "test:coverage": "vitest run --coverage"
+    "test:coverage": "vitest run --coverage",
+    "lint": "eslint src/",
+    "format": "prettier --write src/",
+    "format:check": "prettier --check src/"
   },
   "keywords": [
     "microfrontends",
@@ -109,6 +117,21 @@
       ],
       "adapters/vanilla": [
         "src/adapters/vanilla/index.d.ts"
+      ],
+      "adapters/alpine": [
+        "src/adapters/alpine/index.d.ts"
+      ],
+      "adapters/qwik": [
+        "src/adapters/qwik/index.d.ts"
+      ],
+      "adapters/stencil": [
+        "src/adapters/stencil/index.d.ts"
+      ],
+      "adapters/htmx": [
+        "src/adapters/htmx/index.d.ts"
+      ],
+      "adapters/stimulus": [
+        "src/adapters/stimulus/index.d.ts"
       ]
     }
   },
@@ -118,7 +141,9 @@
     "@rollup/plugin-replace": "^5.0.5",
     "@rollup/plugin-terser": "^0.4.4",
     "@vitest/coverage-v8": "^4.0.18",
+    "eslint": "^10.0.2",
     "jsdom": "^28.0.0",
+    "prettier": "^3.8.1",
     "rollup": "^4.9.0",
     "vitest": "^4.0.18"
   },
@@ -130,7 +155,12 @@
     "react-dom": ">=16.8.0",
     "solid-js": ">=1.0.0",
     "svelte": ">=3.0.0",
-    "vue": ">=3.0.0"
+    "vue": ">=3.0.0",
+    "alpinejs": ">=3.0.0",
+    "@builder.io/qwik": ">=1.0.0",
+    "@stencil/core": ">=4.0.0",
+    "htmx.org": ">=2.0.0",
+    "@hotwired/stimulus": ">=3.0.0"
   },
   "peerDependenciesMeta": {
     "react": {
@@ -156,6 +186,21 @@
     },
     "lit": {
       "optional": true
+    },
+    "alpinejs": {
+      "optional": true
+    },
+    "@builder.io/qwik": {
+      "optional": true
+    },
+    "@stencil/core": {
+      "optional": true
+    },
+    "htmx.org": {
+      "optional": true
+    },
+    "@hotwired/stimulus": {
+      "optional": true
     }
   }
 }

package/src/adapters/alpine/index.d.ts

@@ -0,0 +1,60 @@
+/**
+ * WU-FRAMEWORK ALPINE.JS ADAPTER - TypeScript Declarations
+ */
+
+import type { WuCore } from '../../core/wu-core';
+
+/**
+ * Alpine.js app configuration
+ */
+export interface AlpineAppConfig {
+  /** HTML template string containing Alpine directives (x-data, x-bind, etc.) */
+  template: string;
+  /** Function that returns the Alpine data object */
+  data?: () => Record<string, any>;
+}
+
+/**
+ * Alpine.js adapter registration options
+ */
+export interface AlpineRegisterOptions {
+  /** Callback after mounting */
+  onMount?: (container: HTMLElement) => void;
+  /** Callback before unmounting */
+  onUnmount?: (container: HTMLElement) => void;
+  /** Allow standalone execution when Wu Framework is not available */
+  standalone?: boolean;
+  /** CSS selector for standalone mode container */
+  standaloneContainer?: string;
+}
+
+/**
+ * Register an Alpine.js app as a Wu microfrontend
+ */
+export function register(
+  appName: string,
+  appConfig: AlpineAppConfig,
+  options?: AlpineRegisterOptions
+): Promise<boolean>;
+
+/**
+ * Get the current Wu Framework instance
+ */
+export function getWuInstance(): WuCore | null;
+
+/**
+ * Wait for Wu Framework to become available
+ */
+export function waitForWu(timeout?: number): Promise<WuCore>;
+
+/**
+ * Alpine.js adapter interface
+ */
+export interface WuAlpineAdapter {
+  register: typeof register;
+  getWuInstance: typeof getWuInstance;
+  waitForWu: typeof waitForWu;
+}
+
+export const wuAlpine: WuAlpineAdapter;
+export default wuAlpine;

package/src/adapters/alpine/index.js

@@ -0,0 +1,231 @@
+/**
+ * WU-FRAMEWORK ALPINE.JS ADAPTER
+ *
+ * Bridges Alpine.js reactive components into Wu Framework's
+ * microfrontend orchestration layer. Alpine's declarative
+ * x-data / x-bind paradigm maps naturally to a template + data
+ * registration model.
+ *
+ * @example
+ * import { wuAlpine } from 'wu-framework/adapters/alpine';
+ *
+ * wuAlpine.register('my-app', {
+ *   template: '<div x-data="app"><span x-text="message"></span></div>',
+ *   data: () => ({ message: 'Hello from Alpine' })
+ * });
+ *
+ * @example
+ * // With lifecycle hooks
+ * wuAlpine.register('counter', {
+ *   template: `
+ *     <div x-data="app">
+ *       <span x-text="count"></span>
+ *       <button @click="count++">+</button>
+ *     </div>
+ *   `,
+ *   data: () => ({ count: 0 })
+ * }, {
+ *   onMount: (container) => console.log('Mounted'),
+ *   onUnmount: (container) => console.log('Unmounted')
+ * });
+ */
+
+// Adapter-scoped state
+const adapterState = {
+  apps: new Map()
+};
+
+/**
+ * Obtiene la instancia de Wu Framework
+ */
+function getWuInstance() {
+  if (typeof window === 'undefined') return null;
+
+  return window.wu
+    || window.parent?.wu
+    || window.top?.wu
+    || null;
+}
+
+/**
+ * Espera a que Wu Framework este disponible
+ */
+function waitForWu(timeout = 5000) {
+  return new Promise((resolve, reject) => {
+    const wu = getWuInstance();
+    if (wu) {
+      resolve(wu);
+      return;
+    }
+
+    const startTime = Date.now();
+
+    const handleWuReady = () => {
+      cleanup();
+      resolve(getWuInstance());
+    };
+
+    window.addEventListener('wu:ready', handleWuReady);
+    window.addEventListener('wu:app:ready', handleWuReady);
+
+    const checkInterval = setInterval(() => {
+      const wu = getWuInstance();
+      if (wu) {
+        cleanup();
+        resolve(wu);
+        return;
+      }
+
+      if (Date.now() - startTime > timeout) {
+        cleanup();
+        reject(new Error(`Wu Framework not found after ${timeout}ms`));
+      }
+    }, 200);
+
+    function cleanup() {
+      clearInterval(checkInterval);
+      window.removeEventListener('wu:ready', handleWuReady);
+      window.removeEventListener('wu:app:ready', handleWuReady);
+    }
+  });
+}
+
+/**
+ * Registra una app Alpine.js como microfrontend
+ *
+ * @param {string} appName - Nombre unico del microfrontend
+ * @param {Object} appConfig - Configuracion de la app Alpine
+ * @param {string} appConfig.template - HTML string con directivas Alpine (x-data, x-bind, etc.)
+ * @param {Function} appConfig.data - Funcion que retorna el objeto de datos Alpine
+ * @param {Object} [options] - Opciones adicionales
+ * @param {Function} [options.onMount] - Callback despues de montar
+ * @param {Function} [options.onUnmount] - Callback antes de desmontar
+ * @param {boolean} [options.standalone=true] - Permitir ejecucion standalone
+ * @param {string} [options.standaloneContainer='#app'] - Selector para modo standalone
+ * @returns {Promise<boolean>} true si el registro fue exitoso
+ */
+async function register(appName, appConfig, options = {}) {
+  const { template, data } = appConfig;
+
+  const {
+    onMount = null,
+    onUnmount = null,
+    standalone = true,
+    standaloneContainer = '#app'
+  } = options;
+
+  if (!template || typeof template !== 'string') {
+    throw new Error(`[WuAlpine] template (HTML string) is required for ${appName}`);
+  }
+
+  // Mount function
+  const mountApp = (container) => {
+    if (!container) {
+      console.error(`[WuAlpine] Mount failed for ${appName}: container is null`);
+      return;
+    }
+
+    // Prevent double-mount
+    if (adapterState.apps.has(appName)) {
+      console.warn(`[WuAlpine] ${appName} already mounted, unmounting first`);
+      unmountApp();
+    }
+
+    try {
+      container.innerHTML = '';
+
+      // Inject template HTML
+      container.innerHTML = template;
+
+      // Initialize Alpine on this subtree
+      const Alpine = window.Alpine;
+      if (Alpine) {
+        if (data && typeof data === 'function') {
+          Alpine.data('app', data);
+        }
+        Alpine.initTree(container);
+      } else {
+        console.warn(`[WuAlpine] window.Alpine not found - template inserted but not initialized`);
+      }
+
+      adapterState.apps.set(appName, { container, config: appConfig });
+
+      console.log(`[WuAlpine] ${appName} mounted successfully`);
+
+      if (onMount) {
+        onMount(container);
+      }
+    } catch (error) {
+      console.error(`[WuAlpine] Mount error for ${appName}:`, error);
+      throw error;
+    }
+  };
+
+  // Unmount function
+  const unmountApp = (container) => {
+    const appData = adapterState.apps.get(appName);
+
+    if (appData) {
+      try {
+        if (onUnmount) {
+          onUnmount(appData.container);
+        }
+
+        // Tear down Alpine reactivity on this subtree
+        const Alpine = window.Alpine;
+        if (Alpine && typeof Alpine.destroyTree === 'function') {
+          Alpine.destroyTree(appData.container);
+        }
+
+        appData.container.innerHTML = '';
+        adapterState.apps.delete(appName);
+
+        console.log(`[WuAlpine] ${appName} unmounted successfully`);
+      } catch (error) {
+        console.error(`[WuAlpine] Unmount error for ${appName}:`, error);
+      }
+    }
+
+    if (container) {
+      container.innerHTML = '';
+    }
+  };
+
+  // Register with Wu Framework or fall back to standalone
+  try {
+    const wu = await waitForWu(3000);
+
+    wu.define(appName, {
+      mount: mountApp,
+      unmount: unmountApp
+    });
+
+    console.log(`[WuAlpine] ${appName} registered with Wu Framework`);
+    return true;
+
+  } catch (error) {
+    console.warn(`[WuAlpine] Wu Framework not available for ${appName}`);
+
+    if (standalone) {
+      const containerElement = document.querySelector(standaloneContainer);
+
+      if (containerElement) {
+        console.log(`[WuAlpine] Running ${appName} in standalone mode`);
+        mountApp(containerElement);
+        return true;
+      }
+    }
+
+    return false;
+  }
+}
+
+// Public API
+export const wuAlpine = {
+  register,
+  getWuInstance,
+  waitForWu
+};
+
+export { register, getWuInstance, waitForWu };
+export default wuAlpine;

package/src/adapters/alpine.d.ts

@@ -0,0 +1,3 @@
+// Re-export from folder structure — backward compatibility
+export * from './alpine/index';
+export { default } from './alpine/index';

package/src/adapters/alpine.js

@@ -0,0 +1,3 @@
+// Re-export from folder structure — backward compatibility
+export * from './alpine/index.js';
+export { default } from './alpine/index.js';

package/src/adapters/htmx/index.d.ts

@@ -0,0 +1,60 @@
+/**
+ * WU-FRAMEWORK HTMX ADAPTER - TypeScript Declarations
+ */
+
+import type { WuCore } from '../../core/wu-core';
+
+/**
+ * HTMX app configuration
+ */
+export interface HtmxAppConfig {
+  /** HTML template string containing hx-* attributes */
+  template: string;
+  /** Base URL for HTMX endpoints (rewrites relative paths in hx-get, hx-post, etc.) */
+  baseUrl?: string;
+}
+
+/**
+ * HTMX adapter registration options
+ */
+export interface HtmxRegisterOptions {
+  /** Callback after mounting */
+  onMount?: (container: HTMLElement) => void;
+  /** Callback before unmounting */
+  onUnmount?: (container: HTMLElement) => void;
+  /** Allow standalone execution when Wu Framework is not available */
+  standalone?: boolean;
+  /** CSS selector for standalone mode container */
+  standaloneContainer?: string;
+}
+
+/**
+ * Register an HTMX app as a Wu microfrontend
+ */
+export function register(
+  appName: string,
+  config: HtmxAppConfig,
+  options?: HtmxRegisterOptions
+): Promise<boolean>;
+
+/**
+ * Get the current Wu Framework instance
+ */
+export function getWuInstance(): WuCore | null;
+
+/**
+ * Wait for Wu Framework to become available
+ */
+export function waitForWu(timeout?: number): Promise<WuCore>;
+
+/**
+ * HTMX adapter interface
+ */
+export interface WuHtmxAdapter {
+  register: typeof register;
+  getWuInstance: typeof getWuInstance;
+  waitForWu: typeof waitForWu;
+}
+
+export const wuHtmx: WuHtmxAdapter;
+export default wuHtmx;