WU / DOCSUNIVERSAL MICROFRONTENDS
EN

Adapter and binding reference

Registration for thirteen technologies, custom adapters, slots, hooks, reactive stores and AI helpers.

See versions, changes and requirements in Framework 4.0 and CLI 1.2.

A shared contract with framework-specific capabilities

Each wu-framework/adapters/<framework> subpath exports register and its own utilities. Import the adapter you actually use. wu-framework/adapters groups aliases such as registerReact, registerVue, and createVueUseWuAI; wuReact, wuVue, and equivalent objects group the same functions, and their default exports are that same utility family.

A true registration result means the lifecycle was defined or standalone mounting finished. register() awaits that mount and rejects if it fails. In a shell, register from the microapp entrypoint and await wu.mount; adapter lifecycles are asynchronous.

Hook factories are created outside render and used inside the corresponding component. Imports of Card, Root and other sample components represent your application’s modules, already compiled by their framework. Each entry specifies its cleanup and contract in 4.0.0.

Event and store hooks resolve the mounted app’s facade. They use the global runtime only outside a WU mount. getWuInstance() still returns the host, and AI helpers still use its wu.ai. See integrations and composition permissions.

loadAdapter

Loads and memoizes an adapter module by name.

loadAdapter(name): Promise<AdapterModule>

  • Parameters: One of ADAPTER_NAMES; lowercase names.
  • Returns: Adapter object (wuReact, wuVue or equivalent); shares the promise of an in-progress load.
  • Errors: Unknown names or failed imports reject. A failed load releases its promise to allow retrying.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: The imported module remains in the process cache.
import { loadAdapter } from 'wu-framework/adapters';
const { register } = await loadAdapter('react');

Reference: src/adapters/index.js.

ADAPTER_NAMES

Lists adapters loadable from the barrel.

ADAPTER_NAMES: readonly string[]

  • Parameters: Frozen constant.
  • Returns: List of names.
  • Errors: Read without side effects.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: No cleanup required.
import { ADAPTER_NAMES } from 'wu-framework/adapters';
console.log(ADAPTER_NAMES);

Reference: src/adapters/index.js.

getWuInstance

Looks for WU in the current window and accessible parent and top windows.

getWuInstance(): WuCore | null

  • Parameters: Exported by shared and the adapters.
  • Returns: The instance found, or null.
  • Errors: Catches cross-origin parent/top access; does not throw for it.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Creates no subscriptions.
import { getWuInstance } from 'wu-framework/adapters/shared';
const wu = getWuInstance();

Reference: src/adapters/shared.js.

waitForWu

Waits for a global instance using ready events and polling.

waitForWu(timeout?): Promise<WuCore | null>

  • Parameters: Time in ms, 5000 by default.
  • Returns: The instance found; an external ready event without an instance may resolve null.
  • Errors: Rejects when the timeout expires; requires window.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: The helper removes listeners and the timer when resolving or rejecting.
import { waitForWu } from 'wu-framework/adapters/shared';
const wu = await waitForWu(3000);
if (!wu) throw new Error('No hay runtime disponible');

Reference: src/adapters/shared.js.

createWuAdapter

Builds a custom adapter with per-application mount state and props.

createWuAdapter(config): register

  • Parameters: Required mount and unmount; optional name, ensure, update, hydrate, defineTimeout. The resulting function receives appName, Component, options.
  • Returns: Asynchronous registration function returning boolean.
  • Errors: Throws if mount/unmount are missing; ensure:false produces false.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
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 });

Includes no permission policy of its own. The container and lifecycle come from WU.

Reference: src/adapters/shared.js.

react.register

Registers a react application using the callbacks WU understands.

register(appName, Component, options?): Promise<boolean>

  • Parameters: strictMode true, props, onMount/onUnmount, standalone true, standaloneContainer #root, optional runtime:{React,ReactDOM}.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
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 must use createRoot; hydration requires hydrateRoot in the same instance.

Reference: src/adapters/react/index.js.

vue.register

Registers a vue application using the callbacks WU understands.

register(appName, RootComponent, options?): Promise<boolean>

  • Parameters: props, setup(app), onMount/onUnmount, standalone true, standaloneContainer #app.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/vue';
await register('card', Card, { props: { count: 1 }, standalone: false });

Vue updates the props of the mounted or hydrated child instance through a reactive wrapper, preserving keep-alive.

Reference: src/adapters/vue/index.js.

angular.register

Registers a angular application using the callbacks WU understands.

register(appName, AppModule, options?): Promise<boolean>

  • Parameters: platformFactory, providers, rootSelector app-root, standalone, and callbacks.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/angular';
await register('card', AppModule, { rootSelector: 'card-root', standalone: false });

Use registerStandalone for standalone components. This registration creates and destroys the Angular platform and module.

Reference: src/adapters/angular/index.js.

svelte.register

Registers a svelte application using the callbacks WU understands.

register(appName, Component, options?): Promise<boolean>

  • Parameters: props, context Map, intro false, standalone true, standaloneContainer #app, and callbacks.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/svelte';
await register('card', Card, { props: { count: 1 }, standalone: false });

This registration uses the Svelte 4 model’s constructor, $set, and $destroy. Use registerSvelte5 for the modern API.

Reference: src/adapters/svelte/index.js.

preact.register

Registers a preact application using the callbacks WU understands.

register(appName, Component, options?): Promise<boolean>

  • Parameters: props, callbacks, standalone true, and standaloneContainer #app.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/preact';
await register('card', Card, { props: { count: 1 }, standalone: false });

Adds wuAppName and wuInstance to props; update renders again with merged props.

Reference: src/adapters/preact/index.js.

solid.register

Registers a solid application using the callbacks WU understands.

register(appName, Component, options?): Promise<boolean>

  • Parameters: props, callbacks, standalone true, and standaloneContainer #root.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/solid';
await register('card', Card, { props: { count: 1 }, standalone: false });

Registration requires solid-js/web. It does not assume React’s update/hydrate contract.

Reference: src/adapters/solid/index.js.

lit.register

Registers a lit application using the callbacks WU understands.

register(appName, ElementClass, options?): Promise<boolean>

  • Parameters: tagName, properties, callbacks, standalone true, and standaloneContainer #root.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/lit';
await register('card', CardElement, { tagName: 'demo-card', properties: { count: 1 }, standalone: false });

The custom element remains in customElements after unmounting: global registration cannot be undone.

Reference: src/adapters/lit/index.js.

vanilla.register

Registers a vanilla application using the callbacks WU understands.

register(appName, config, options?): Promise<boolean>

  • Parameters: Required config.render, optional init/destroy/state; shared-adapter options.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/vanilla';
await register('card', {
  state: { count: 1 },
  render(container, state) { container.textContent = String(state.count); },
}, { standalone: false });

Your render controls container content and your destroy releases external resources.

Reference: src/adapters/vanilla/index.js.

alpine.register

Registers a alpine application using the callbacks WU understands.

register(appName, appConfig, options?): Promise<boolean>

  • Parameters: template and data(); Alpine runtime and dataName may be in config or options; standalone/callbacks.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/alpine';
await register('card', {
  template: '<section x-data="__WU_ALPINE_DATA__"><b x-text="count"></b></section>',
  data: () => ({ count: 1 }),
}, { runtime: Alpine, standalone: false });

Without the Alpine runtime, it inserts HTML and warns; true registration does not certify that Alpine attributes work.

Reference: src/adapters/alpine/index.js.

qwik.register

Registers a qwik application using the callbacks WU understands.

register(appName, Component, options?): Promise<boolean>

  • Parameters: props and runtime; the runtime can be Qwik 1 or Qwik 2. It does not accept base, createProps, loadQwikLoader or standalone options.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/qwik';
await register('card', Card, { props: { count: 1 } });

The adapter prefers @qwik.dev/core, then @builder.io/qwik; it loads the qwikloader matching the runtime version. The wu prop uses noSerialize and contains the app’s facade.

Reference: src/adapters/qwik/index.js.

stencil.register

Registers a stencil application using the callbacks WU understands.

register(appName, tagName, options?): Promise<boolean>

  • Parameters: props for JavaScript values, attributes for strings, callbacks, and standalone.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/stencil';
await register('card', 'demo-card', { props: { count: 1 }, attributes: { label: 'Resumen' }, standalone: false });

Register the Stencil bundle’s custom elements beforehand; this helper creates the tag but does not load its definition.

Reference: src/adapters/stencil/index.js.

htmx.register

Registers a htmx application using the callbacks WU understands.

register(appName, config, options?): Promise<boolean>

  • Parameters: Required template; baseUrl, setup(container,htmx); runtime and standalone/callback options.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/htmx';
await register('card', {
  template: '<button hx-get="/fragment">Actualizar</button>',
  baseUrl: '/api',
}, { runtime: htmx, standalone: false });

Rewrites hx-* paths beginning with / by concatenating baseUrl. Without htmx, it inserts HTML without activating requests. setup may return cleanup.

Reference: src/adapters/htmx/index.js.

stimulus.register

Registers a stimulus application using the callbacks WU understands.

register(appName, config, options?): Promise<boolean>

  • Parameters: template and a nonempty controllers map; callbacks and standalone.
  • Returns: true if it defines the lifecycle or achieves standalone fallback; false when registration cannot complete.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { register } from 'wu-framework/adapters/stimulus';
await register('card', {
  template: '<section data-controller="counter"></section>',
  controllers: { counter: CounterController },
}, { standalone: false });

Creates a Stimulus Application for the subtree and stops it on unmount.

Reference: src/adapters/stimulus/index.js.

angular.registerStandalone

Mounts an Angular standalone component with a host inside the WU container.

registerStandalone(appName, RootComponent, options?): Promise<boolean>

  • Parameters: appConfig, createApplication, createComponent, provideZoneChangeDetection, callbacks, and standalone.
  • Returns: Registration boolean.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
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 });

Initial props and wu.update() are applied to inputs on the Angular instance.

Reference: src/adapters/angular/index.js.

angular.registerElement

Exposes an Angular component through Angular Elements.

registerElement(appName, Component, options?): Promise<boolean>

  • Parameters: elementTag, appConfig, callbacks, standalone, and standaloneContainer.
  • Returns: Registration boolean.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { registerElement } from 'wu-framework/adapters/angular';
await registerElement('card', Card, { elementTag: 'angular-card', standalone: false });

Requires @angular/elements. Removing the element does not unregister its global constructor.

Reference: src/adapters/angular/index.js.

svelte.registerSvelte5

Uses Svelte 5 mount/unmount, with fallback to the earlier component API.

registerSvelte5(appName, Component, options?): Promise<boolean>

  • Parameters: props, onMount, onUnmount and standalone options. It does not accept createProps.
  • Returns: Registration boolean.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { registerSvelte5 } from 'wu-framework/adapters/svelte';
await registerSvelte5('card', Card, { props: { count: 1 }, standalone: false });

registerSvelte5 registers mount/unmount and does not provide an update slot. Use a shared store for live data; do not expect wu.update() to change the props of a component registered by this function.

Reference: src/adapters/svelte/index.js.

preact.registerCompat

Renders with preact/compat and falls back to the Preact adapter when it cannot import it.

registerCompat(appName, Component, options?): Promise<boolean>

  • Parameters: props, callbacks, and standalone.
  • Returns: Registration boolean.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { registerCompat } from 'wu-framework/adapters/preact';
await registerCompat('card', Card, { standalone: false });

The compat path registers mount/unmount; it is not equivalent to normal register’s update channel.

Reference: src/adapters/preact/index.js.

lit.registerWebComponent

Reuses Lit registration for an HTMLElement class without a Lit dependency.

registerWebComponent(appName, ElementClass, options?): Promise<boolean>

  • Parameters: Custom-element class and the same options as Lit register.
  • Returns: Registration boolean.
  • Errors: Registration may return false if WU or the framework is unavailable; also catches renderer errors during mount.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Unmount using wu.unmount(appName) to run framework cleanup; retain and cancel your own subscriptions.
import { registerWebComponent } from 'wu-framework/adapters/lit';
class Card extends HTMLElement { connectedCallback() { this.textContent = 'Hola'; } }
await registerWebComponent('card', Card, { tagName: 'plain-card', standalone: false });

Reference: src/adapters/lit/index.js.

react.createUseWuEvents

Creates an events hook tied to the component lifecycle.

createUseWuEvents(React): () => EventsHelper

  • Parameters: React namespace with the required hooks. The helper returns emit, on, and once.
  • Returns: Hook returning publish and subscribe functions.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Subscriptions created with on are removed on unmount; also retain the once disposer if it may remain pending.
import React from 'react';
import { createUseWuEvents } from 'wu-framework/adapters/react';
const useWuEvents = createUseWuEvents(React);
function View() {
  const events = useWuEvents();
  return null;
}

Reference: src/adapters/react/index.js.

react.createUseWuStore

Creates a hook reflecting a store path in component state.

createUseWuStore(React): (namespace?) => StoreHelper

  • Parameters: Hooks namespace; the hook accepts a state prefix, empty for root.
  • Returns: Object {state,setState,getState}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import React from 'react';
import { createUseWuStore } from 'wu-framework/adapters/react';
const useWuStore = createUseWuStore(React);
function View() {
  const { state, setState } = useWuStore('cart');
  return null;
}

Reference: src/adapters/react/index.js.

react.createWuSlot

Creates a component hosting a WU app by name and URL.

createWuSlot(React): WuSlotComponent

  • Parameters: Framework name and hooks; name, url, appName, fallback props, and callbacks.
  • Returns: Component for rendering a slot.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
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' });

Reference: src/adapters/react/index.js.

preact.createUseWuEvents

Creates an events hook tied to the component lifecycle.

createUseWuEvents(hooks): () => EventsHelper

  • Parameters: Hooks namespace with the required hooks. The helper returns emit, on, and once.
  • Returns: Hook returning publish and subscribe functions.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Subscriptions created with on are removed on unmount; also retain the once disposer if it may remain pending.
import * as hooks from 'preact/hooks';
import { createUseWuEvents } from 'wu-framework/adapters/preact';
const useWuEvents = createUseWuEvents(hooks);
function View() {
  const events = useWuEvents();
  return null;
}

Reference: src/adapters/preact/index.js.

preact.createUseWuStore

Creates a hook reflecting a store path in component state.

createUseWuStore(hooks): (namespace?) => StoreHelper

  • Parameters: Hooks namespace; the hook accepts a state prefix, empty for root.
  • Returns: Object {state,setState,getState}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
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;
}

Reference: src/adapters/preact/index.js.

preact.createWuSlot

Creates a component hosting a WU app by name and URL.

createWuSlot(h, hooks?): WuSlotComponent

  • Parameters: Preact h function and useState/useEffect/useRef hooks object. Without hooks, returns a basic version with less behavior.
  • Returns: Component for rendering a slot.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { h } from 'preact';
import * as hooks from 'preact/hooks';
import { createWuSlot } from 'wu-framework/adapters/preact';
const WuSlot = createWuSlot(h, hooks);

Reference: src/adapters/preact/index.js.

vue.useWuEvents

Provides event utilities and explicit cleanup.

useWuEvents(): EventsHelper

  • Parameters: No arguments.
  • Returns: {emit,on,once,off,cleanup}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Call cleanup from onUnmounted and retain once cancelers when necessary.
import { useWuEvents } from 'wu-framework/adapters/vue';
import { onUnmounted } from 'vue';
const events = useWuEvents();
events.on('cart:changed', console.log);
onUnmounted(events.cleanup);

Reference: src/adapters/vue/index.js.

vue.useWuStore

Reflects a store path in a Vue ref when the adapter has the runtime available.

useWuStore(namespace?): StoreHelper

  • Parameters: Optional namespace.
  • Returns: {state,setState,getState,cleanup}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Call cleanup on unmount.
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);

The Vue runtime must be configured; it does not interpret namespace.* patterns as observation of arbitrary descendants.

Reference: src/adapters/vue/index.js.

vue.wuVuePlugin

Installs WuSlot, global utilities, and the Vue instance used by the adapter.

app.use(wuVuePlugin, options?): app

  • Parameters: options.Vue lets you pass the host Vue namespace.
  • Returns: The result of Vue app.use.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: The host unmounts the Vue application; clean up its components’ own listeners.
import * as Vue from 'vue';
import { wuVuePlugin } from 'wu-framework/adapters/vue';
const app = Vue.createApp(Root);
app.use(wuVuePlugin, { Vue });

Reference: src/adapters/vue/index.js.

vue.WuSlot

Exposes the Vue component mounting a WU application.

WuSlot: Vue component options

  • Parameters: name, url, appName, and fallbackText props; available Vue runtime.
  • Returns: Component definition object.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { WuSlot } from 'wu-framework/adapters/vue';
const components = { WuSlot };

WuSlot operates in the Vue lifecycle; it does not represent WuApp from the Next subpath.

Reference: src/adapters/vue/index.js.

svelte.createWuStore

Creates a store compatible with Svelte subscribe and connected to WU.

createWuStore(namespace?): SvelteStore

  • Parameters: Path prefix; empty observes the root.
  • Returns: {subscribe,set,get,update}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Canceling the last subscriber removes the WU subscription; a new subscription reconnects it.
import { createWuStore } from 'wu-framework/adapters/svelte';
const cart = createWuStore('cart');
const stop = cart.subscribe(value => console.log(value));
stop();

Reference: src/adapters/svelte/index.js.

svelte.createWuEventStore

Exposes the latest event as a subscribable store.

createWuEventStore(eventPattern): EventStore

  • Parameters: Pattern recognized by the event bus.
  • Returns: {subscribe,emit}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Canceling the last subscriber disconnects the WU listener.
import { createWuEventStore } from 'wu-framework/adapters/svelte';
const changes = createWuEventStore('cart:changed');
const stop = changes.subscribe(console.log);
stop();

Reference: src/adapters/svelte/index.js.

svelte.useWuEvents

Provides emit/on/once/off with manual cleanup for Svelte components.

useWuEvents(): EventsHelper

  • Parameters: No arguments.
  • Returns: {emit,on,once,off,cleanup}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Invoke cleanup from onDestroy; the function does not register that lifecycle for you.
import { onDestroy } from 'svelte';
import { useWuEvents } from 'wu-framework/adapters/svelte';
const events = useWuEvents();
onDestroy(events.cleanup);

Reference: src/adapters/svelte/index.js.

svelte.createWuSlotConfig

Returns a template and configuration for building a Svelte slot.

createWuSlotConfig(): SlotConfig

  • Parameters: No arguments.
  • Returns: {props,template,createInstance}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { createWuSlotConfig } from 'wu-framework/adapters/svelte';
const config = createWuSlotConfig();
console.log(config.props, config.template);

This is configuration containing component source text; it is neither a compiled component nor a function rendering by itself.

Reference: src/adapters/svelte/index.js.

solid.createWuStore

Connects a WU path to a Solid signal.

createWuStore(namespace?): [accessor, setter]

  • Parameters: Namespace; must run in a Solid owner with the runtime available.
  • Returns: Tuple containing a state accessor and setWuState(path,value) function.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Registers unsubscribe in the Solid owner’s onCleanup.
import { createWuStore } from 'wu-framework/adapters/solid';
function View() {
  const [cart, setCart] = createWuStore('cart');
  setCart('count', 1);
  return null;
}

Reference: src/adapters/solid/index.js.

solid.createWuEvent

Reflects the latest event in a signal.

createWuEvent(pattern): accessor

  • Parameters: Bus pattern.
  • Returns: Accessor returning the event or initially null.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Registers unsubscribe through onCleanup.
import { createWuEvent } from 'wu-framework/adapters/solid';
function View() {
  const latest = createWuEvent('cart:changed');
  return null;
}

Reference: src/adapters/solid/index.js.

solid.useWuEvents

Provides event utilities inside a Solid owner.

useWuEvents(): EventsHelper

  • Parameters: No arguments.
  • Returns: {emit,on,once,off}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { useWuEvents } from 'wu-framework/adapters/solid';
function View() { const events = useWuEvents(); return null; }

Reference: src/adapters/solid/index.js.

solid.createWuContext

Creates a Solid context for sharing the WU instance.

createWuContext(): { WuProvider, useWu, WuContext }

  • Parameters: No arguments; requires an available Solid runtime.
  • Returns: Provider, hook, and context.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: The context opens no transport or persistent resources.
import { createWuContext } from 'wu-framework/adapters/solid';
const { WuProvider, useWu } = createWuContext();

Reference: src/adapters/solid/index.js.

solid.createWuSlot

Creates the Solid slot component.

createWuSlot(): WuSlotComponent

  • Parameters: No arguments; the component receives name, url, appName, fallback, and callbacks.
  • Returns: Component function.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { createWuSlot } from 'wu-framework/adapters/solid';
const WuSlot = createWuSlot();

Reference: src/adapters/solid/index.js.

angular.createWuService

Provides event and state functions for an Angular service.

createWuService(): WuService

  • Parameters: No arguments.
  • Returns: emit,on,once,off,getState,setState,onStateChange,destroy and wu getter.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Call destroy from ngOnDestroy; once subscriptions must be canceled if still pending.
import { createWuService } from 'wu-framework/adapters/angular';
const service = createWuService();
service.on('cart:changed', console.log);
service.destroy();

getState converts falsy values to null. To preserve false, 0 or an empty string inside the app, use inject(WuAppScope).wu.store.get(path) in a DI context. service.wu returns the host and must not be used to bypass grants.

Reference: src/adapters/angular/index.js.

angular.createWuSlotComponent

Returns metadata and base methods for implementing an Angular slot.

createWuSlotComponent(): ComponentConfig

  • Parameters: No arguments.
  • Returns: Object with selector, template, styles, and methods.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { createWuSlotComponent } from 'wu-framework/adapters/angular';
const config = createWuSlotComponent();
console.log(config.selector, config.methods);

It does not return a class already decorated with @Component. Integrate the metadata, ViewChild, and methods into an Angular class.

Reference: src/adapters/angular/index.js.

angular.getWuSlotModuleConfig

Describes module names for hosting an Angular slot.

getWuSlotModuleConfig(): object

  • Parameters: No arguments.
  • Returns: {imports,declarations,exports} with string names.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { getWuSlotModuleConfig } from 'wu-framework/adapters/angular';
console.log(getWuSlotModuleConfig());

These are descriptive names, not class references you can pass directly to @NgModule.

Reference: src/adapters/angular/index.js.

lit.createWuSlotElement

Creates a Lit class hosting a WU slot.

createWuSlotElement(LitElement, html, css?): ElementClass

  • Parameters: Primitives from the host’s same Lit instance.
  • Returns: Custom-element class to register.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { LitElement, html, css } from 'lit';
import { createWuSlotElement } from 'wu-framework/adapters/lit';
customElements.define('demo-wu-slot', createWuSlotElement(LitElement, html, css));

The core mounts through a document selector; check the slot’s DOM strategy and version before hosting it inside another shadow root.

Reference: src/adapters/lit/index.js.

lit.WuMixin

Adds wuEmit/wuOn/wuOnce and store access to an element class.

WuMixin(Base): subclass

  • Parameters: HTMLElement or LitElement base class.
  • Returns: Subclass with WU methods and cleanup in disconnectedCallback.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Call super.disconnectedCallback when overriding it to execute mixin cleanup.
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); }
}

Reference: src/adapters/lit/index.js.

lit.wuProperty

Connects an element property to a store path.

wuProperty(storePath): legacy property decorator

  • Parameters: String path; legacy decorator applied to prototype and property name.
  • Returns: Decorator function installing a getter/setter and connection hooks.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { wuProperty } from 'wu-framework/adapters/lit';
wuProperty('cart.count')(Card.prototype, 'count');

It is not a generic Stage 3 decorator. The setter writes to WU and the subscription synchronizes the local value.

Reference: src/adapters/lit/index.js.

lit.createSimpleElement

Builds a custom element with a template, styles, and callbacks.

createSimpleElement(config): ElementClass

  • Parameters: Optional name, template string or function, styles, and shadow true by default.
  • Returns: HTMLElement class; name may register the custom element.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { createSimpleElement } from 'wu-framework/adapters/lit';
const Card = createSimpleElement({ template: () => '<p>Hola</p>', styles: ':host{display:block}' });
customElements.define('simple-card', Card);

Template is inserted as unsanitized HTML; control its content.

Reference: src/adapters/lit/index.js.

vanilla.registerClass

Mounts an application class with its own container.

registerClass(appName, AppClass, options?): Promise<boolean>

  • Parameters: constructorArgs, callbacks, and standalone.
  • Returns: Registration boolean.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
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 });

Reference: src/adapters/vanilla/index.js.

vanilla.registerTemplate

Registers an HTML template with optional data, styles, and scripts.

registerTemplate(appName, template, options?): Promise<boolean>

  • Parameters: template string; data, scripts, styles, callbacks, and standalone.
  • Returns: Registration boolean.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { registerTemplate } from 'wu-framework/adapters/vanilla';
await registerTemplate('card', '<h2>Resumen</h2>', { styles: ['h2{margin:0}'], standalone: false });

Scripts are host code and HTML is not sanitized. Do not use untrusted content as a template.

Reference: src/adapters/vanilla/index.js.

vanilla.createComponent

Creates a component with local state and template rendering.

createComponent(config): VanillaComponent

  • Parameters: state, template(state), actions, onInit, and onDestroy.
  • Returns: {state,init,render,destroy,setState,getState}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Releases subscriptions when the owning component unmounts.
import { createComponent, register } from 'wu-framework/adapters/vanilla';
const component = createComponent({ state: { count: 1 }, template: state => `<b>${Number(state.count)}</b>` });
await register('card', component, { standalone: false });

setState merges local state and renders HTML again; it does not replace wu.store.

Reference: src/adapters/vanilla/index.js.

vanilla.useWuEvents

Groups publishing and subscriptions without depending on a UI framework.

useWuEvents(scope?): EventsHelper

  • Parameters: No arguments.
  • Returns: {emit,on,once,off,cleanup}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Call cleanup on unmount and retain the once canceler if it remains pending.
import { useWuEvents } from 'wu-framework/adapters/vanilla';
const events = useWuEvents();
events.on('cart:changed', console.log);
events.cleanup();

Reference: src/adapters/vanilla/index.js.

vanilla.useWuStore

Prefixes store read, write, and subscription paths.

useWuStore(namespace?, scope?): StoreHelper

  • Parameters: Optional namespace.
  • Returns: {get,set,onChange}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Each onChange returns its own unsubscribe; the helper does not collect them.
import { useWuStore } from 'wu-framework/adapters/vanilla';
const cart = useWuStore('cart');
cart.set('count', 1);
const stop = cart.onChange('count', console.log);
stop();

Reference: src/adapters/vanilla/index.js.

vanilla.createWuSlot

Inserts a container and requests mounting a WU app inside it.

createWuSlot(target, props): SlotHandle

  • Parameters: target element; name,url,fallbackText,onLoad,onError props.
  • Returns: {container,destroy}.
  • Errors: Requires the framework runtime and an accessible WU instance; check availability before running operations.
  • Permissions: Event/store hooks use their app’s facade; registration and slots use the host. Request resources in the manifest and grant them in the shell.
  • Cleanup: Call destroy when removing the host.
import { createWuSlot } from 'wu-framework/adapters/vanilla';
const slot = createWuSlot(document.querySelector('#host'), { name: 'card', url: '/apps/card' });
slot.destroy();

Mounting is asynchronous internally; the handle is not a promise of a mounted app.

Reference: src/adapters/vanilla/index.js.

react.createUseWuAI

Connects the React interface to an AI conversation.

createUseWuAI(React): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: useWuAI(options) hook with messages,isStreaming,error,send,sendSync,abort,clear.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { createUseWuAI } from 'wu-framework/adapters/react';
import React from 'react';
const useWuAI = createUseWuAI(React);

Create the hook once outside the component; use it inside render. send uses streaming and sendSync requests a complete response.

Reference: src/adapters/react/index.js.

preact.createUseWuAI

Connects the Preact interface to an AI conversation.

createUseWuAI(hooks): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: useWuAI(options) hook with message state and send/clear functions.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { createUseWuAI } from 'wu-framework/adapters/preact';
import * as hooks from 'preact/hooks';
const useWuAI = createUseWuAI(hooks);

Use hooks from the same Preact instance that renders the component.

Reference: src/adapters/preact/ai.js.

vue.createUseWuAI

Connects the Vue interface to an AI conversation.

createUseWuAI(Vue): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: Composable with messages,isStreaming,error refs and send/clear.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { createUseWuAI } from 'wu-framework/adapters/vue';
import * as Vue from 'vue';
const useWuAI = createUseWuAI(Vue);
const chat = useWuAI({ namespace: 'help' });

This variant uses Vue refs.

Reference: src/adapters/vue/ai.js.

vue.useWuAI

Connects the Vue interface to an AI conversation.

useWuAI(options?): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: Simple helper with messages,isStreaming,error,send,clear.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { useWuAI } from 'wu-framework/adapters/vue';
const chat = useWuAI({ namespace: 'help' });

This variant creates no refs. Initially copied properties do not provide a complete reactive view of internal state; prefer createUseWuAI(Vue) in components.

Reference: src/adapters/vue/ai.js.

svelte.createWuAIStore

Connects the Svelte interface to an AI conversation.

createWuAIStore(options?): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: Store {subscribe,send,clear} whose value contains messages,isStreaming,error.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { createWuAIStore } from 'wu-framework/adapters/svelte';
const chat = createWuAIStore({ namespace: 'help' });
const stop = chat.subscribe(console.log);
stop();

Canceling subscribe removes that local observer; it does not automatically abort the provider conversation.

Reference: src/adapters/svelte/ai.js.

angular.createWuAIService

Connects the Angular interface to an AI conversation.

createWuAIService(options?): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: Service with messages,isStreaming,error getters and send/clear methods.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { createWuAIService } from 'wu-framework/adapters/angular';
const chat = createWuAIService({ namespace: 'help' });

It is neither an Injectable-decorated class nor an RxJS Observable. Integrate its changes with the host’s detection mechanism.

Reference: src/adapters/angular/ai.js.

solid.createUseWuAI

Connects the Solid interface to an AI conversation.

createUseWuAI(): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: Helper factory with messages,isStreaming,error accessors and send/clear.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { createUseWuAI } from 'wu-framework/adapters/solid';
const useWuAI = createUseWuAI();
const chat = useWuAI({ namespace: 'help' });

The accessors read an ordinary object: the implementation creates no Solid signals. Do not assume automatic reactive invalidation.

Reference: src/adapters/solid/ai.js.

vanilla.useWuAI

Connects the vanilla interface to an AI conversation.

useWuAI(options?): helper

  • Parameters: Runtime required by the factory; the helper accepts an optional namespace, defaulting to default.
  • Returns: {send,clear,getMessages,getError,isStreaming}.
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { useWuAI } from 'wu-framework/adapters/vanilla';
const chat = useWuAI({ namespace: 'help' });
console.log(chat.getMessages());

clear empties its local history and associated conversation; update your UI after await send.

Reference: src/adapters/vanilla/ai.js.

lit.WuAIMixin

Connects the Lit interface to an AI conversation.

WuAIMixin(Base): helper

  • Parameters: Element base class.
  • Returns: Subclass with wuAI,wuAISend(text,options),wuAISetNamespace(ns).
  • Errors: Check WU AI availability; the helper maintains an error field or returns null if unavailable.
  • Permissions: Uses ai.send on the global runtime; actions requested by the provider retain the host-configured AI policy.
  • Cleanup: Does not destroy the global AI coordinator. Explicitly abort the component namespace when pending requests need cancellation.
import { WuAIMixin } from 'wu-framework/adapters/lit';
class Card extends WuAIMixin(HTMLElement) {
  connectedCallback() { this.wuAISetNamespace('card'); }
}

It does not maintain reactive messages or add an AbortController automatically.

Reference: src/adapters/lit/ai.js.

qwik.adoptQwikStyles

Copies Qwik styles to the corresponding root’s adoptedStyleSheets.

adoptQwikStyles(container): () => void

  • Parameters: Container with styles; requires CSSStyleSheet.replaceSync and adoptedStyleSheets.
  • Returns: Cleanup function for stylesheets and observer.
  • Errors: Without constructable-stylesheet support, returns empty cleanup.
  • Permissions: Operates on styles of the supplied container.
  • Cleanup: Call the returned function before destroying the container.
import { adoptQwikStyles } from 'wu-framework/adapters/qwik';
const release = adoptQwikStyles(container);
release();

Reference: src/adapters/qwik/index.js.

qwik.ensureQwikLoader

Loads and deduplicates initialization of the document’s Qwik loader.

ensureQwikLoader(load?): Promise<boolean>

  • Parameters: Optional load function; by default it imports @builder.io/qwik/qwikloader.js. Qwik registration passes the loader matching its runtime.
  • Returns: true for the first load, false if already initialized.
  • Errors: Rejects if the loader module cannot be imported. Recovery from a failed promise depends on the version.
  • Permissions: The loader is global host code.
  • Cleanup: Offers no public API to undo loader execution.
import { ensureQwikLoader } from 'wu-framework/adapters/qwik';
await ensureQwikLoader();

Reference: src/adapters/qwik/index.js.

shared.snapshot

Creates a shallow copy to help reactive bindings detect changes.

snapshot(value): unknown

  • Parameters: Array, object, or primitive.
  • Returns: New array, shallow object, or the original primitive.
  • Errors: Propagates getters or property errors when copying an object.
  • Permissions: Does not access the store itself.
  • Cleanup: No persistent resources.
import { snapshot } from 'wu-framework/adapters/shared';
const next = snapshot(wu.store.get('cart'));

This is not a deep clone or data validation.

Reference: src/adapters/shared.js.

Migrating hooks and stores to 4.0

An emit without a grant returns false. Subscribing without permission throws WU_EVENT_SUBSCRIBE_DENIED; reading, observing or writing the store without permission throws WU_CAPABILITY_DENIED. Unmount releases facade listeners. Afterwards, event helpers warn and do nothing; store calls throw WU_APP_SCOPE_REVOKED.

// 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,
}] });

React/Preact/Vue and Solid setters write the observed path with a value or updater: setState(value) and setState(prev => next). The setState(path, value) form writes a subpath. Without a namespace, use two arguments. In Svelte, set(value) replaces the observed value and update(fn) applies the updater according to the store contract.

const useWuStore = createUseWuStore(React);
function Counter() {
  const { state, setState } = useWuStore('cart.count');
  return <button onClick={() => setState(value => (value ?? 0) + 1)}>{state ?? 0}</button>;
}

For helpers outside a component context, retain the facade: Vanilla accepts useWuEvents(scope) and useWuStore(namespace, scope). resolveWu(element) finds the facade through the DOM in Lit, Alpine, htmx, Stimulus, Stencil and Qwik; a detached node retains its revoked scope. Angular provides WuAppScope through DI. Compatibility props and injections named wuInstance, and AI helpers, still expose the host.

Slots pass the container element to WU: they work inside Shadow DOM and with names such as cart.v2. Angular supports zoneless mounting; it enables Zone.js detection only when Zone.js is loaded. htmx 2 and 4 share htmx.process(), but setup code must use its version’s events. baseUrl covers hx-action, hx-query and data-hx- variants, and preserves // URLs.

Qwik does not provide standalone mounting: register returns false if WU does not appear within 3 seconds or Qwik cannot be imported. It does not register an update slot. The document listener adaptation for Shadow DOM remains active after unmount.

shared.resolveWu

resolveWu(target?): WuAppFacade | WuCore | null

Accepts a DOM node, a { wu } context or a facade. It resolves the target’s scope or the active synchronous lifecycle; only outside both does it fall back to the global host. Retain it before an await if you will later work outside the render context. It is exported from wu-framework/adapters/shared and the Lit, Vanilla, Alpine, htmx, Stimulus, Stencil and Qwik adapters.

BUILD WU WITH US

Found a bug? Have an idea?

Your experience improves WU. Tell us what went wrong or help support its development.