# Referencia de adapters y bindings Registro de trece tecnologías, adapters personalizados, slots, hooks, stores reactivos y helpers de IA. Consulta las versiones, cambios y requisitos en [Framework 4.0 y CLI 1.2](/es/docs/guides/releases/). ## Un contrato común con capacidades por framework Cada subpath `wu-framework/adapters/` exporta `register` y utilidades propias. Importa el adapter que realmente utilizas. `wu-framework/adapters` reúne aliases como `registerReact`, `registerVue` y `createVueUseWuAI`; los objetos `wuReact`, `wuVue` y equivalentes agrupan las mismas funciones, y sus exports default son esa misma familia de utilidades. Un registro `true` informa que se definió el lifecycle o terminó el montaje standalone. `register()` espera ese montaje y rechaza si falla. En un shell, registra desde el entry de la microapp y espera `wu.mount`; los lifecycles de adapters son asíncronos. Las factories de hooks se construyen fuera del render y se utilizan dentro del componente correspondiente. Los imports de `Card`, `Root` y otros componentes de ejemplo representan módulos de tu aplicación, ya compilados por su framework. Cada entrada especifica su limpieza y contrato en `4.0.0`. Los hooks de eventos y store resuelven la facade de la app montada. Solo fuera de un montaje WU usan el runtime global. `getWuInstance()` sigue devolviendo el host y los helpers de IA siguen usando su `wu.ai`. Consulta [integraciones](/es/docs/framework/integrations/) y [permisos de composición](/es/docs/framework/api-core/). ## loadAdapter Carga y memoriza el módulo de un adapter por nombre. `loadAdapter(name): Promise` - **Parámetros:** Uno de ADAPTER_NAMES; nombres minúsculos. - **Retorno:** Objeto del adapter (`wuReact`, `wuVue` o equivalente); comparte la promesa de una carga en curso. - **Errores:** Nombre desconocido o import fallido rechazan. La carga fallida libera su promesa para permitir reintento. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** El módulo importado permanece en la caché del proceso. ```js import { loadAdapter } from 'wu-framework/adapters'; const { register } = await loadAdapter('react'); ``` Referencia: `src/adapters/index.js`. ## ADAPTER_NAMES Enumera los adapters cargables desde el barrel. `ADAPTER_NAMES: readonly string[]` - **Parámetros:** Constante congelada. - **Retorno:** Lista de nombres. - **Errores:** Lectura sin efectos. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** No requiere limpieza. ```js import { ADAPTER_NAMES } from 'wu-framework/adapters'; console.log(ADAPTER_NAMES); ``` Referencia: `src/adapters/index.js`. ## getWuInstance Busca WU en la ventana actual, parent y top accesibles. `getWuInstance(): WuCore | null` - **Parámetros:** Exportado por shared y los adapters. - **Retorno:** Instancia encontrada o null. - **Errores:** Captura accesos cross-origin a parent/top; no lanza por ellos. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** No crea suscripciones. ```js import { getWuInstance } from 'wu-framework/adapters/shared'; const wu = getWuInstance(); ``` Referencia: `src/adapters/shared.js`. ## waitForWu Espera una instancia global con eventos ready y sondeo. `waitForWu(timeout?): Promise` - **Parámetros:** Tiempo en ms, 5000 por defecto. - **Retorno:** Instancia encontrada; un evento ready externo sin instancia puede resolver null. - **Errores:** Rechaza al agotar el timeout; necesita window. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** El helper retira listeners y temporizador al resolver o rechazar. ```js import { waitForWu } from 'wu-framework/adapters/shared'; const wu = await waitForWu(3000); if (!wu) throw new Error('No hay runtime disponible'); ``` Referencia: `src/adapters/shared.js`. ## createWuAdapter Construye un adapter personalizado con estado de montaje y props por aplicación. `createWuAdapter(config): register` - **Parámetros:** mount y unmount obligatorios; name, ensure, update, hydrate, defineTimeout opcionales. La función resultante recibe appName, Component, options. - **Retorno:** Función asíncrona de registro que devuelve boolean. - **Errores:** Lanza si faltan mount/unmount; ensure:false produce false. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { createWuAdapter } from 'wu-framework/adapters/shared'; const register = createWuAdapter({ mount(container, { Component, props }) { return Component(container, props); }, unmount(_container, { instance }) { instance?.dispose?.(); }, }); await register('plain', (container) => { container.textContent = 'Hola'; return { dispose() { container.replaceChildren(); } }; }, { standalone: false }); ``` No incluye una política propia de permisos. El container y el ciclo de vida proceden de WU. Referencia: `src/adapters/shared.js`. ## react.register Registra una aplicación react mediante los callbacks que entiende WU. `register(appName, Component, options?): Promise` - **Parámetros:** strictMode true, props, onMount/onUnmount, standalone true, standaloneContainer #root, runtime:{React,ReactDOM} opcional. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/react'; import React from 'react'; import * as ReactDOM from 'react-dom/client'; await register('card', Card, { runtime: { React, ReactDOM }, props: { count: 1 }, standalone: false }); ``` React debe usar createRoot; para hidratación necesita hydrateRoot en la misma instancia. Referencia: `src/adapters/react/index.js`. ## vue.register Registra una aplicación vue mediante los callbacks que entiende WU. `register(appName, RootComponent, options?): Promise` - **Parámetros:** props, setup(app), onMount/onUnmount, standalone true, standaloneContainer #app. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/vue'; await register('card', Card, { props: { count: 1 }, standalone: false }); ``` Vue actualiza las props de la instancia hija montada o hidratada mediante un wrapper reactivo, conservando keep-alive. Referencia: `src/adapters/vue/index.js`. ## angular.register Registra una aplicación angular mediante los callbacks que entiende WU. `register(appName, AppModule, options?): Promise` - **Parámetros:** platformFactory, providers, rootSelector app-root, standalone y callbacks. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/angular'; await register('card', AppModule, { rootSelector: 'card-root', standalone: false }); ``` Para componentes standalone usa registerStandalone. Este registro crea y destruye plataforma y módulo Angular. Referencia: `src/adapters/angular/index.js`. ## svelte.register Registra una aplicación svelte mediante los callbacks que entiende WU. `register(appName, Component, options?): Promise` - **Parámetros:** props, context Map, intro false, standalone true, standaloneContainer #app y callbacks. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/svelte'; await register('card', Card, { props: { count: 1 }, standalone: false }); ``` Este registro usa constructor, $set y $destroy del modelo Svelte 4. Usa registerSvelte5 para el API moderno. Referencia: `src/adapters/svelte/index.js`. ## preact.register Registra una aplicación preact mediante los callbacks que entiende WU. `register(appName, Component, options?): Promise` - **Parámetros:** props, callbacks, standalone true y standaloneContainer #app. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/preact'; await register('card', Card, { props: { count: 1 }, standalone: false }); ``` Añade wuAppName y wuInstance a props; update vuelve a renderizar con props fusionadas. Referencia: `src/adapters/preact/index.js`. ## solid.register Registra una aplicación solid mediante los callbacks que entiende WU. `register(appName, Component, options?): Promise` - **Parámetros:** props, callbacks, standalone true y standaloneContainer #root. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/solid'; await register('card', Card, { props: { count: 1 }, standalone: false }); ``` El registro requiere solid-js/web. No presupone el mismo contrato update/hydrate de React. Referencia: `src/adapters/solid/index.js`. ## lit.register Registra una aplicación lit mediante los callbacks que entiende WU. `register(appName, ElementClass, options?): Promise` - **Parámetros:** tagName, properties, callbacks, standalone true y standaloneContainer #root. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/lit'; await register('card', CardElement, { tagName: 'demo-card', properties: { count: 1 }, standalone: false }); ``` El custom element permanece en customElements tras desmontar: el registro global no se puede deshacer. Referencia: `src/adapters/lit/index.js`. ## vanilla.register Registra una aplicación vanilla mediante los callbacks que entiende WU. `register(appName, config, options?): Promise` - **Parámetros:** config.render obligatorio, init/destroy/state opcionales; options del adapter compartido. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/vanilla'; await register('card', { state: { count: 1 }, render(container, state) { container.textContent = String(state.count); }, }, { standalone: false }); ``` Tu render controla el contenido del contenedor y tu destroy libera recursos externos. Referencia: `src/adapters/vanilla/index.js`. ## alpine.register Registra una aplicación alpine mediante los callbacks que entiende WU. `register(appName, appConfig, options?): Promise` - **Parámetros:** template y data(); runtime Alpine y dataName pueden ir en config u options; standalone/callbacks. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/alpine'; await register('card', { template: '
', data: () => ({ count: 1 }), }, { runtime: Alpine, standalone: false }); ``` Sin runtime Alpine inserta HTML y advierte; un registro true no certifica que los atributos Alpine funcionen. Referencia: `src/adapters/alpine/index.js`. ## qwik.register Registra una aplicación qwik mediante los callbacks que entiende WU. `register(appName, Component, options?): Promise` - **Parámetros:** props y runtime; el runtime puede ser Qwik 1 o Qwik 2. No admite `base`, `createProps`, `loadQwikLoader` ni opciones standalone. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/qwik'; await register('card', Card, { props: { count: 1 } }); ``` El adapter prefiere `@qwik.dev/core` y luego `@builder.io/qwik`; carga el qwikloader correspondiente a la versión del runtime. La prop `wu` usa `noSerialize` y contiene la facade de la app. Referencia: `src/adapters/qwik/index.js`. ## stencil.register Registra una aplicación stencil mediante los callbacks que entiende WU. `register(appName, tagName, options?): Promise` - **Parámetros:** props para valores JavaScript, attributes para strings, callbacks y standalone. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/stencil'; await register('card', 'demo-card', { props: { count: 1 }, attributes: { label: 'Resumen' }, standalone: false }); ``` Registra previamente los custom elements del bundle Stencil; este helper crea el tag pero no carga su definición. Referencia: `src/adapters/stencil/index.js`. ## htmx.register Registra una aplicación htmx mediante los callbacks que entiende WU. `register(appName, config, options?): Promise` - **Parámetros:** template obligatorio; baseUrl, setup(container,htmx); runtime y opciones standalone/callbacks. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/htmx'; await register('card', { template: '', baseUrl: '/api', }, { runtime: htmx, standalone: false }); ``` Reescribe rutas hx-* que empiezan por / concatenando baseUrl. Sin htmx inserta HTML sin activar peticiones. setup puede devolver cleanup. Referencia: `src/adapters/htmx/index.js`. ## stimulus.register Registra una aplicación stimulus mediante los callbacks que entiende WU. `register(appName, config, options?): Promise` - **Parámetros:** template y mapa controllers no vacío; callbacks y standalone. - **Retorno:** true si define el lifecycle o logra el fallback standalone; false cuando no puede completar el registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { register } from 'wu-framework/adapters/stimulus'; await register('card', { template: '
', controllers: { counter: CounterController }, }, { standalone: false }); ``` Crea una Application de Stimulus para el subtree y la detiene al desmontar. Referencia: `src/adapters/stimulus/index.js`. ## angular.registerStandalone Monta un componente standalone de Angular con un host dentro del contenedor de WU. `registerStandalone(appName, RootComponent, options?): Promise` - **Parámetros:** appConfig, createApplication, createComponent, provideZoneChangeDetection, callbacks y standalone. - **Retorno:** Boolean de registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { registerStandalone } from 'wu-framework/adapters/angular'; import { createApplication } from '@angular/platform-browser'; import { createComponent } from '@angular/core'; await registerStandalone('card', Card, { createApplication, createComponent, standalone: false }); ``` Las props iniciales y `wu.update()` se aplican a inputs de la instancia Angular. Referencia: `src/adapters/angular/index.js`. ## angular.registerElement Expone un componente Angular mediante Angular Elements. `registerElement(appName, Component, options?): Promise` - **Parámetros:** elementTag, appConfig, callbacks, standalone y standaloneContainer. - **Retorno:** Boolean de registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { registerElement } from 'wu-framework/adapters/angular'; await registerElement('card', Card, { elementTag: 'angular-card', standalone: false }); ``` Requiere @angular/elements. Retirar el elemento no desregistra su constructor global. Referencia: `src/adapters/angular/index.js`. ## svelte.registerSvelte5 Utiliza mount/unmount de Svelte 5, con fallback a la API de componentes anterior. `registerSvelte5(appName, Component, options?): Promise` - **Parámetros:** props, onMount, onUnmount y opciones standalone. No admite `createProps`. - **Retorno:** Boolean de registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { registerSvelte5 } from 'wu-framework/adapters/svelte'; await registerSvelte5('card', Card, { props: { count: 1 }, standalone: false }); ``` `registerSvelte5` registra mount/unmount y no ofrece un slot `update`. Para datos vivos usa un store compartido; no esperes que `wu.update()` cambie las props del componente registrado por esta función. Referencia: `src/adapters/svelte/index.js`. ## preact.registerCompat Renderiza con preact/compat y recurre al adapter Preact cuando no puede importarlo. `registerCompat(appName, Component, options?): Promise` - **Parámetros:** props, callbacks y standalone. - **Retorno:** Boolean de registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { registerCompat } from 'wu-framework/adapters/preact'; await registerCompat('card', Card, { standalone: false }); ``` La ruta compat registra mount/unmount; no equivale al canal update de register normal. Referencia: `src/adapters/preact/index.js`. ## lit.registerWebComponent Reutiliza el registro Lit para una clase HTMLElement sin dependencia de Lit. `registerWebComponent(appName, ElementClass, options?): Promise` - **Parámetros:** Clase custom element y las mismas options de register Lit. - **Retorno:** Boolean de registro. - **Errores:** Un registro puede devolver false si WU o el framework no están disponibles; captura también errores del renderer durante mount. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Desmonta mediante wu.unmount(appName) para ejecutar el cleanup del framework; conserva y cancela suscripciones propias. ```js import { registerWebComponent } from 'wu-framework/adapters/lit'; class Card extends HTMLElement { connectedCallback() { this.textContent = 'Hola'; } } await registerWebComponent('card', Card, { tagName: 'plain-card', standalone: false }); ``` Referencia: `src/adapters/lit/index.js`. ## react.createUseWuEvents Crea un hook de eventos ligado al ciclo de vida del componente. `createUseWuEvents(React): () => EventsHelper` - **Parámetros:** Namespace React con los hooks requeridos. El helper devuelve emit, on y once. - **Retorno:** Hook que devuelve funciones de publicación y suscripción. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Las suscripciones creadas con on se retiran al desmontar; conserva también el disposer de once si puede quedar pendiente. ```js import React from 'react'; import { createUseWuEvents } from 'wu-framework/adapters/react'; const useWuEvents = createUseWuEvents(React); function View() { const events = useWuEvents(); return null; } ``` Referencia: `src/adapters/react/index.js`. ## react.createUseWuStore Crea un hook que refleja una ruta del store en estado del componente. `createUseWuStore(React): (namespace?) => StoreHelper` - **Parámetros:** Namespace de hooks; el hook acepta un prefijo de estado, vacío para raíz. - **Retorno:** Objeto {state,setState,getState}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import React from 'react'; import { createUseWuStore } from 'wu-framework/adapters/react'; const useWuStore = createUseWuStore(React); function View() { const { state, setState } = useWuStore('cart'); return null; } ``` Referencia: `src/adapters/react/index.js`. ## react.createWuSlot Crea un componente que hospeda una app WU por nombre y URL. `createWuSlot(React): WuSlotComponent` - **Parámetros:** Nombre del framework y hooks; props name, url, appName, fallback y callbacks. - **Retorno:** Componente para renderizar un slot. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import React from 'react'; import { createWuSlot } from 'wu-framework/adapters/react'; const WuSlot = createWuSlot(React); const element = React.createElement(WuSlot, { name: 'card', url: '/apps/card' }); ``` Referencia: `src/adapters/react/index.js`. ## preact.createUseWuEvents Crea un hook de eventos ligado al ciclo de vida del componente. `createUseWuEvents(hooks): () => EventsHelper` - **Parámetros:** Namespace hooks con los hooks requeridos. El helper devuelve emit, on y once. - **Retorno:** Hook que devuelve funciones de publicación y suscripción. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Las suscripciones creadas con on se retiran al desmontar; conserva también el disposer de once si puede quedar pendiente. ```js import * as hooks from 'preact/hooks'; import { createUseWuEvents } from 'wu-framework/adapters/preact'; const useWuEvents = createUseWuEvents(hooks); function View() { const events = useWuEvents(); return null; } ``` Referencia: `src/adapters/preact/index.js`. ## preact.createUseWuStore Crea un hook que refleja una ruta del store en estado del componente. `createUseWuStore(hooks): (namespace?) => StoreHelper` - **Parámetros:** Namespace de hooks; el hook acepta un prefijo de estado, vacío para raíz. - **Retorno:** Objeto {state,setState,getState}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import * as hooks from 'preact/hooks'; import { createUseWuStore } from 'wu-framework/adapters/preact'; const useWuStore = createUseWuStore(hooks); function View() { const { state, setState } = useWuStore('cart'); return null; } ``` Referencia: `src/adapters/preact/index.js`. ## preact.createWuSlot Crea un componente que hospeda una app WU por nombre y URL. `createWuSlot(h, hooks?): WuSlotComponent` - **Parámetros:** Función h de Preact y objeto de hooks useState/useEffect/useRef. Sin hooks devuelve una versión básica con menos comportamiento. - **Retorno:** Componente para renderizar un slot. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { h } from 'preact'; import * as hooks from 'preact/hooks'; import { createWuSlot } from 'wu-framework/adapters/preact'; const WuSlot = createWuSlot(h, hooks); ``` Referencia: `src/adapters/preact/index.js`. ## vue.useWuEvents Entrega utilidades de eventos y una limpieza explícita. `useWuEvents(): EventsHelper` - **Parámetros:** Sin argumentos. - **Retorno:** {emit,on,once,off,cleanup}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Llama cleanup desde onUnmounted y conserva canceladores de once cuando sea necesario. ```js import { useWuEvents } from 'wu-framework/adapters/vue'; import { onUnmounted } from 'vue'; const events = useWuEvents(); events.on('cart:changed', console.log); onUnmounted(events.cleanup); ``` Referencia: `src/adapters/vue/index.js`. ## vue.useWuStore Refleja una ruta del store en un ref de Vue cuando el adapter tiene el runtime disponible. `useWuStore(namespace?): StoreHelper` - **Parámetros:** Namespace opcional. - **Retorno:** {state,setState,getState,cleanup}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Llama cleanup al desmontar. ```js import * as Vue from 'vue'; import { useWuStore, wuVuePlugin } from 'wu-framework/adapters/vue'; app.use(wuVuePlugin, { Vue }); const cart = useWuStore('cart'); Vue.onUnmounted(cart.cleanup); ``` El runtime Vue debe estar configurado; no interpreta patrones namespace.* como observación de descendientes arbitrarios. Referencia: `src/adapters/vue/index.js`. ## vue.wuVuePlugin Instala WuSlot, utilidades globales y la instancia de Vue que usa el adapter. `app.use(wuVuePlugin, options?): app` - **Parámetros:** options.Vue permite pasar el namespace Vue del host. - **Retorno:** El resultado de app.use de Vue. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** El host desmonta la aplicación Vue; limpia listeners propios de sus componentes. ```js import * as Vue from 'vue'; import { wuVuePlugin } from 'wu-framework/adapters/vue'; const app = Vue.createApp(Root); app.use(wuVuePlugin, { Vue }); ``` Referencia: `src/adapters/vue/index.js`. ## vue.WuSlot Expone el componente Vue que monta una aplicación WU. `WuSlot: Vue component options` - **Parámetros:** Props name, url, appName y fallbackText; runtime Vue disponible. - **Retorno:** Objeto de definición de componente. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { WuSlot } from 'wu-framework/adapters/vue'; const components = { WuSlot }; ``` WuSlot opera en el ciclo de vida Vue; no representa el WuApp del subpath Next. Referencia: `src/adapters/vue/index.js`. ## svelte.createWuStore Crea un store compatible con subscribe de Svelte conectado a WU. `createWuStore(namespace?): SvelteStore` - **Parámetros:** Prefijo de ruta; vacío observa la raíz. - **Retorno:** {subscribe,set,get,update}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Al cancelar el último subscriber se retira la suscripción WU; una nueva suscripción vuelve a conectarla. ```js import { createWuStore } from 'wu-framework/adapters/svelte'; const cart = createWuStore('cart'); const stop = cart.subscribe(value => console.log(value)); stop(); ``` Referencia: `src/adapters/svelte/index.js`. ## svelte.createWuEventStore Expone el último evento como store suscribible. `createWuEventStore(eventPattern): EventStore` - **Parámetros:** Patrón reconocido por el event bus. - **Retorno:** {subscribe,emit}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Cancelar el último subscriber desconecta el listener WU. ```js import { createWuEventStore } from 'wu-framework/adapters/svelte'; const changes = createWuEventStore('cart:changed'); const stop = changes.subscribe(console.log); stop(); ``` Referencia: `src/adapters/svelte/index.js`. ## svelte.useWuEvents Entrega emit/on/once/off con limpieza manual para componentes Svelte. `useWuEvents(): EventsHelper` - **Parámetros:** Sin argumentos. - **Retorno:** {emit,on,once,off,cleanup}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Invoca cleanup desde onDestroy; la función no registra ese lifecycle por ti. ```js import { onDestroy } from 'svelte'; import { useWuEvents } from 'wu-framework/adapters/svelte'; const events = useWuEvents(); onDestroy(events.cleanup); ``` Referencia: `src/adapters/svelte/index.js`. ## svelte.createWuSlotConfig Devuelve una plantilla y configuración para construir un slot Svelte. `createWuSlotConfig(): SlotConfig` - **Parámetros:** Sin argumentos. - **Retorno:** {props,template,createInstance}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { createWuSlotConfig } from 'wu-framework/adapters/svelte'; const config = createWuSlotConfig(); console.log(config.props, config.template); ``` Es una configuración con texto fuente de componente; no es un componente compilado ni una función que renderice por sí sola. Referencia: `src/adapters/svelte/index.js`. ## solid.createWuStore Conecta una ruta de WU con un signal de Solid. `createWuStore(namespace?): [accessor, setter]` - **Parámetros:** Namespace; debe ejecutarse en un owner de Solid con runtime disponible. - **Retorno:** Tupla de accessor de estado y función setWuState(path,value). - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Registra el unsubscribe en onCleanup del owner Solid. ```js import { createWuStore } from 'wu-framework/adapters/solid'; function View() { const [cart, setCart] = createWuStore('cart'); setCart('count', 1); return null; } ``` Referencia: `src/adapters/solid/index.js`. ## solid.createWuEvent Refleja el último evento en un signal. `createWuEvent(pattern): accessor` - **Parámetros:** Patrón del bus. - **Retorno:** Accessor que devuelve el evento o null inicial. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Registra unsubscribe mediante onCleanup. ```js import { createWuEvent } from 'wu-framework/adapters/solid'; function View() { const latest = createWuEvent('cart:changed'); return null; } ``` Referencia: `src/adapters/solid/index.js`. ## solid.useWuEvents Proporciona utilidades de eventos dentro de un owner Solid. `useWuEvents(): EventsHelper` - **Parámetros:** Sin argumentos. - **Retorno:** {emit,on,once,off}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { useWuEvents } from 'wu-framework/adapters/solid'; function View() { const events = useWuEvents(); return null; } ``` Referencia: `src/adapters/solid/index.js`. ## solid.createWuContext Crea un contexto de Solid para compartir la instancia WU. `createWuContext(): { WuProvider, useWu, WuContext }` - **Parámetros:** Sin argumentos; necesita runtime Solid disponible. - **Retorno:** Provider, hook y contexto. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** El contexto no abre transporte ni recursos persistentes. ```js import { createWuContext } from 'wu-framework/adapters/solid'; const { WuProvider, useWu } = createWuContext(); ``` Referencia: `src/adapters/solid/index.js`. ## solid.createWuSlot Crea el componente de slot de Solid. `createWuSlot(): WuSlotComponent` - **Parámetros:** Sin argumentos; el componente recibe name, url, appName, fallback y callbacks. - **Retorno:** Función de componente. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { createWuSlot } from 'wu-framework/adapters/solid'; const WuSlot = createWuSlot(); ``` Referencia: `src/adapters/solid/index.js`. ## angular.createWuService Entrega funciones de eventos y estado para un servicio Angular. `createWuService(): WuService` - **Parámetros:** Sin argumentos. - **Retorno:** emit,on,once,off,getState,setState,onStateChange,destroy y getter wu. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Llama destroy desde ngOnDestroy; las suscripciones de once deben cancelarse si continúan pendientes. ```js import { createWuService } from 'wu-framework/adapters/angular'; const service = createWuService(); service.on('cart:changed', console.log); service.destroy(); ``` `getState` convierte valores falsy en null. Para conservar `false`, `0` o una cadena vacía dentro de la app, usa `inject(WuAppScope).wu.store.get(path)` en un contexto DI. `service.wu` devuelve el host y no debe usarse para eludir los grants. Referencia: `src/adapters/angular/index.js`. ## angular.createWuSlotComponent Devuelve metadatos y métodos base para implementar un slot Angular. `createWuSlotComponent(): ComponentConfig` - **Parámetros:** Sin argumentos. - **Retorno:** Objeto selector, template, styles y methods. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { createWuSlotComponent } from 'wu-framework/adapters/angular'; const config = createWuSlotComponent(); console.log(config.selector, config.methods); ``` No devuelve una clase ya decorada por @Component. Debes integrar metadatos, ViewChild y métodos en una clase Angular. Referencia: `src/adapters/angular/index.js`. ## angular.getWuSlotModuleConfig Describe los nombres del módulo que hospeda un slot Angular. `getWuSlotModuleConfig(): object` - **Parámetros:** Sin argumentos. - **Retorno:** {imports,declarations,exports} con nombres string. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { getWuSlotModuleConfig } from 'wu-framework/adapters/angular'; console.log(getWuSlotModuleConfig()); ``` Son nombres descriptivos; no son referencias de clases para pasarlas directamente a @NgModule. Referencia: `src/adapters/angular/index.js`. ## lit.createWuSlotElement Crea una clase Lit que hospeda un slot WU. `createWuSlotElement(LitElement, html, css?): ElementClass` - **Parámetros:** Primitivas de la misma instancia Lit del host. - **Retorno:** Clase de custom element para registrar. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { LitElement, html, css } from 'lit'; import { createWuSlotElement } from 'wu-framework/adapters/lit'; customElements.define('demo-wu-slot', createWuSlotElement(LitElement, html, css)); ``` El core monta por selector de documento; verifica la estrategia de DOM del slot y la versión antes de alojarlo dentro de otro shadow root. Referencia: `src/adapters/lit/index.js`. ## lit.WuMixin Añade wuEmit/wuOn/wuOnce y acceso al store a una clase de elemento. `WuMixin(Base): subclass` - **Parámetros:** Clase base HTMLElement o LitElement. - **Retorno:** Subclase con métodos WU y cleanup en disconnectedCallback. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Llama super.disconnectedCallback cuando lo sobrescribas para ejecutar la limpieza del mixin. ```js import { LitElement } from 'lit'; import { WuMixin } from 'wu-framework/adapters/lit'; class Card extends WuMixin(LitElement) { connectedCallback() { super.connectedCallback(); this.wuOn('cart:changed', console.log); } } ``` Referencia: `src/adapters/lit/index.js`. ## lit.wuProperty Conecta una propiedad del elemento con una ruta del store. `wuProperty(storePath): legacy property decorator` - **Parámetros:** Ruta string; decorador legacy aplicado a prototype y nombre de propiedad. - **Retorno:** Función decoradora que instala getter/setter y hooks de conexión. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { wuProperty } from 'wu-framework/adapters/lit'; wuProperty('cart.count')(Card.prototype, 'count'); ``` No es un decorador Stage 3 genérico. El setter escribe en WU y la suscripción sincroniza el valor local. Referencia: `src/adapters/lit/index.js`. ## lit.createSimpleElement Construye un custom element con template, estilos y callbacks. `createSimpleElement(config): ElementClass` - **Parámetros:** name opcional, template string o función, styles y shadow true por defecto. - **Retorno:** Clase HTMLElement; name puede registrar el custom element. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { createSimpleElement } from 'wu-framework/adapters/lit'; const Card = createSimpleElement({ template: () => '

Hola

', styles: ':host{display:block}' }); customElements.define('simple-card', Card); ``` Template se inserta como HTML sin saneamiento; controla su contenido. Referencia: `src/adapters/lit/index.js`. ## vanilla.registerClass Monta una clase de aplicación con un contenedor propio. `registerClass(appName, AppClass, options?): Promise` - **Parámetros:** constructorArgs, callbacks y standalone. - **Retorno:** Boolean de registro. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { registerClass } from 'wu-framework/adapters/vanilla'; class Card { constructor(container) { this.container = container; } render() { this.container.textContent = 'Hola'; } destroy() {} } await registerClass('card', Card, { standalone: false }); ``` Referencia: `src/adapters/vanilla/index.js`. ## vanilla.registerTemplate Registra una plantilla HTML con datos, estilos y scripts opcionales. `registerTemplate(appName, template, options?): Promise` - **Parámetros:** template string; data, scripts, styles, callbacks y standalone. - **Retorno:** Boolean de registro. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { registerTemplate } from 'wu-framework/adapters/vanilla'; await registerTemplate('card', '

Resumen

', { styles: ['h2{margin:0}'], standalone: false }); ``` Los scripts son código del host y HTML no se sanea. No uses contenido no confiable como plantilla. Referencia: `src/adapters/vanilla/index.js`. ## vanilla.createComponent Crea un componente con estado local y renderizado por plantilla. `createComponent(config): VanillaComponent` - **Parámetros:** state, template(state), actions, onInit y onDestroy. - **Retorno:** {state,init,render,destroy,setState,getState}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Libera las suscripciones al desmontar el componente propietario. ```js import { createComponent, register } from 'wu-framework/adapters/vanilla'; const component = createComponent({ state: { count: 1 }, template: state => `${Number(state.count)}` }); await register('card', component, { standalone: false }); ``` setState fusiona estado local y vuelve a renderizar HTML; no sustituye wu.store. Referencia: `src/adapters/vanilla/index.js`. ## vanilla.useWuEvents Agrupa publicación y suscripciones sin depender de un framework UI. `useWuEvents(scope?): EventsHelper` - **Parámetros:** Sin argumentos. - **Retorno:** {emit,on,once,off,cleanup}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Llama cleanup al desmontar y conserva el cancelador de once si queda pendiente. ```js import { useWuEvents } from 'wu-framework/adapters/vanilla'; const events = useWuEvents(); events.on('cart:changed', console.log); events.cleanup(); ``` Referencia: `src/adapters/vanilla/index.js`. ## vanilla.useWuStore Prefija rutas de lectura, escritura y escucha del store. `useWuStore(namespace?, scope?): StoreHelper` - **Parámetros:** Namespace opcional. - **Retorno:** {get,set,onChange}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Cada onChange devuelve su propio unsubscribe; el helper no los acumula. ```js import { useWuStore } from 'wu-framework/adapters/vanilla'; const cart = useWuStore('cart'); cart.set('count', 1); const stop = cart.onChange('count', console.log); stop(); ``` Referencia: `src/adapters/vanilla/index.js`. ## vanilla.createWuSlot Inserta un contenedor y solicita montar una app WU en él. `createWuSlot(target, props): SlotHandle` - **Parámetros:** target elemento; props name,url,fallbackText,onLoad,onError. - **Retorno:** {container,destroy}. - **Errores:** Necesita el runtime del framework y una instancia WU accesible; controla disponibilidad antes de ejecutar operaciones. - **Permisos:** Los hooks de eventos/store usan la facade de su app; registro y slots usan el host. Solicita los recursos en el manifest y concédelos en el shell. - **Limpieza:** Llama destroy al retirar el host. ```js import { createWuSlot } from 'wu-framework/adapters/vanilla'; const slot = createWuSlot(document.querySelector('#host'), { name: 'card', url: '/apps/card' }); slot.destroy(); ``` El montaje es asíncrono internamente; el handle no es una promesa de app montada. Referencia: `src/adapters/vanilla/index.js`. ## react.createUseWuAI Conecta la interfaz react con una conversación de IA. `createUseWuAI(React): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** Hook useWuAI(options) con messages,isStreaming,error,send,sendSync,abort,clear. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { createUseWuAI } from 'wu-framework/adapters/react'; import React from 'react'; const useWuAI = createUseWuAI(React); ``` Crea el hook una sola vez fuera del componente; úsalo dentro del render. send utiliza streaming y sendSync solicita una respuesta completa. Referencia: `src/adapters/react/index.js`. ## preact.createUseWuAI Conecta la interfaz preact con una conversación de IA. `createUseWuAI(hooks): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** Hook useWuAI(options) con estado de mensajes y funciones send/clear. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { createUseWuAI } from 'wu-framework/adapters/preact'; import * as hooks from 'preact/hooks'; const useWuAI = createUseWuAI(hooks); ``` Usa hooks de la misma instancia Preact que renderiza el componente. Referencia: `src/adapters/preact/ai.js`. ## vue.createUseWuAI Conecta la interfaz vue con una conversación de IA. `createUseWuAI(Vue): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** Composable con refs messages,isStreaming,error y send/clear. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { createUseWuAI } from 'wu-framework/adapters/vue'; import * as Vue from 'vue'; const useWuAI = createUseWuAI(Vue); const chat = useWuAI({ namespace: 'help' }); ``` Esta variante utiliza refs Vue. Referencia: `src/adapters/vue/ai.js`. ## vue.useWuAI Conecta la interfaz vue con una conversación de IA. `useWuAI(options?): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** Helper simple con messages,isStreaming,error,send,clear. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { useWuAI } from 'wu-framework/adapters/vue'; const chat = useWuAI({ namespace: 'help' }); ``` Esta variante no crea refs. Las propiedades copiadas inicialmente no constituyen una vista reactiva completa del estado interno; prefiere createUseWuAI(Vue) en componentes. Referencia: `src/adapters/vue/ai.js`. ## svelte.createWuAIStore Conecta la interfaz svelte con una conversación de IA. `createWuAIStore(options?): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** Store {subscribe,send,clear} cuyo valor contiene messages,isStreaming,error. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { createWuAIStore } from 'wu-framework/adapters/svelte'; const chat = createWuAIStore({ namespace: 'help' }); const stop = chat.subscribe(console.log); stop(); ``` Cancelar subscribe retira ese observador local; no aborta automáticamente la conversación del proveedor. Referencia: `src/adapters/svelte/ai.js`. ## angular.createWuAIService Conecta la interfaz angular con una conversación de IA. `createWuAIService(options?): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** Servicio con getters messages,isStreaming,error y métodos send/clear. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { createWuAIService } from 'wu-framework/adapters/angular'; const chat = createWuAIService({ namespace: 'help' }); ``` No es una clase decorada Injectable ni un Observable RxJS. Integra sus cambios con el mecanismo de detección del host. Referencia: `src/adapters/angular/ai.js`. ## solid.createUseWuAI Conecta la interfaz solid con una conversación de IA. `createUseWuAI(): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** Factory de helper con accessors messages,isStreaming,error y send/clear. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { createUseWuAI } from 'wu-framework/adapters/solid'; const useWuAI = createUseWuAI(); const chat = useWuAI({ namespace: 'help' }); ``` Los accessors leen un objeto ordinario: la implementación no crea signals Solid. No presupongas invalidación reactiva automática. Referencia: `src/adapters/solid/ai.js`. ## vanilla.useWuAI Conecta la interfaz vanilla con una conversación de IA. `useWuAI(options?): helper` - **Parámetros:** Runtime solicitado por la factory; el helper acepta namespace opcional con default por defecto. - **Retorno:** {send,clear,getMessages,getError,isStreaming}. - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { useWuAI } from 'wu-framework/adapters/vanilla'; const chat = useWuAI({ namespace: 'help' }); console.log(chat.getMessages()); ``` clear vacía su historial local y la conversación asociada; actualiza tu UI después de await send. Referencia: `src/adapters/vanilla/ai.js`. ## lit.WuAIMixin Conecta la interfaz lit con una conversación de IA. `WuAIMixin(Base): helper` - **Parámetros:** Clase base de elemento. - **Retorno:** Subclase con wuAI,wuAISend(text,options),wuAISetNamespace(ns). - **Errores:** Comprueba la disponibilidad de WU AI; el helper mantiene un campo de error o devuelve null si no está disponible. - **Permisos:** Usa ai.send del runtime global; las acciones que solicite el proveedor conservan la política IA configurada por el host. - **Limpieza:** No destruye el coordinador IA global. Aborta explícitamente el namespace del componente cuando deba cancelar peticiones pendientes. ```js import { WuAIMixin } from 'wu-framework/adapters/lit'; class Card extends WuAIMixin(HTMLElement) { connectedCallback() { this.wuAISetNamespace('card'); } } ``` No mantiene mensajes reactivos ni agrega un AbortController automáticamente. Referencia: `src/adapters/lit/ai.js`. ## qwik.adoptQwikStyles Copia estilos Qwik a adoptedStyleSheets del root correspondiente. `adoptQwikStyles(container): () => void` - **Parámetros:** Container con estilos; necesita CSSStyleSheet.replaceSync y adoptedStyleSheets. - **Retorno:** Función de limpieza de hojas y observador. - **Errores:** Sin soporte para constructable stylesheets devuelve cleanup vacío. - **Permisos:** Opera sobre estilos del contenedor proporcionado. - **Limpieza:** Llama la función retornada antes de destruir el contenedor. ```js import { adoptQwikStyles } from 'wu-framework/adapters/qwik'; const release = adoptQwikStyles(container); release(); ``` Referencia: `src/adapters/qwik/index.js`. ## qwik.ensureQwikLoader Carga y deduplica la inicialización del loader Qwik del documento. `ensureQwikLoader(load?): Promise` - **Parámetros:** función `load` opcional; por defecto importa `@builder.io/qwik/qwikloader.js`. El registro Qwik pasa el loader correspondiente a su runtime. - **Retorno:** true para la primera carga, false si ya estaba inicializado. - **Errores:** Rechaza si el módulo loader no puede importarse. La recuperación de una promesa fallida depende de la versión. - **Permisos:** El loader es código global del host. - **Limpieza:** No ofrece un API público para deshacer la ejecución del loader. ```js import { ensureQwikLoader } from 'wu-framework/adapters/qwik'; await ensureQwikLoader(); ``` Referencia: `src/adapters/qwik/index.js`. ## shared.snapshot Crea una copia superficial para ayudar a los bindings reactivos a detectar cambios. `snapshot(value): unknown` - **Parámetros:** Array, objeto o primitivo. - **Retorno:** Array nuevo, objeto superficial o el primitivo original. - **Errores:** Propaga getters o errores de propiedades al copiar un objeto. - **Permisos:** No accede al store por sí mismo. - **Limpieza:** Sin recursos persistentes. ```js import { snapshot } from 'wu-framework/adapters/shared'; const next = snapshot(wu.store.get('cart')); ``` No es un clonado profundo ni una validación de datos. Referencia: `src/adapters/shared.js`. ## Migrar hooks y stores a 4.0 Una emisión sin grant devuelve `false`. Suscribirse sin permiso lanza `WU_EVENT_SUBSCRIBE_DENIED`; leer, observar o escribir store sin permiso lanza `WU_CAPABILITY_DENIED`. El unmount libera listeners de la facade. Después, los helpers de eventos avisan y no operan; las llamadas de store lanzan `WU_APP_SCOPE_REVOKED`. ```js // App manifest: wu.permissions. Shell registration: grants. const permissions = ['store.read:cart.count', 'store.write:cart.count', 'events.emit:cart:changed']; await wu.init({ apps: [{ name: 'cart', url: '/apps/cart/', manifest: { entry: 'assets/cart.js', wu: { permissions } }, grants: permissions, }] }); ``` Los setters de React/Preact/Vue y Solid escriben el path observado con un valor o updater: `setState(value)` y `setState(prev => next)`. La forma `setState(path, value)` escribe un subpath. Sin namespace, usa dos argumentos. En Svelte, `set(value)` reemplaza el valor observado y `update(fn)` aplica el updater según el contrato del store. ```jsx const useWuStore = createUseWuStore(React); function Counter() { const { state, setState } = useWuStore('cart.count'); return ; } ``` Para helpers fuera del contexto de un componente, conserva la facade: Vanilla acepta `useWuEvents(scope)` y `useWuStore(namespace, scope)`. `resolveWu(element)` encuentra la facade por DOM en Lit, Alpine, htmx, Stimulus, Stencil y Qwik; un nodo retirado conserva su scope revocado. Angular ofrece `WuAppScope` por DI. Los props e injections de compatibilidad llamados `wuInstance`, y los helpers IA, siguen exponiendo el host. Los slots pasan el elemento contenedor a WU: funcionan dentro de Shadow DOM y con nombres como `cart.v2`. Angular soporta montaje zoneless; solo instala detección por Zone.js si Zone.js está cargado. htmx 2 y 4 comparten `htmx.process()`, pero el código de `setup` debe usar los eventos de su versión. `baseUrl` cubre `hx-action`, `hx-query` y variantes `data-hx-`, y conserva URLs `//`. Qwik no ofrece montaje standalone: `register` devuelve `false` si WU no aparece en 3 segundos o si no puede importar Qwik. No registra un slot `update`. La adaptación de listeners del documento para Shadow DOM permanece activa después del desmontaje. ## shared.resolveWu `resolveWu(target?): WuAppFacade | WuCore | null` Acepta un nodo DOM, un contexto `{ wu }` o una facade. Resuelve el scope del target o del lifecycle síncrono activo; solo fuera de ambos vuelve al host global. Consérvalo antes de un `await` si luego trabajarás fuera del contexto de render. Se exporta desde `wu-framework/adapters/shared` y desde los adapters Lit, Vanilla, Alpine, htmx, Stimulus, Stencil y Qwik.