# Astro, Next, and helper reference

Client and server integration points and exported utility functions.

<span id="elegir-una-entrada-del-paquete"></span>

<span class="section-anchor" id="section-1"></span>

## Choosing a package entrypoint

Import Astro components from `wu-framework/integrations/astro/*.astro`. The `astro.config` factory is in `wu-framework/integrations/astro`. In Next, use the `wu-framework/integrations/next` barrel or its `WuShell`, `WuApp`, `WuAppSSR`, and `WuMount` subpaths.

`WuShell` initializes the catalog, `WuApp` mounts on the client, and `WuAppSSR` composes initial HTML with a hydration bridge. A UI component does not constitute an additional remote registration: keep app names consistent across the server, catalog, and browser entrypoint.

Astro examples use frontmatter; Next examples use JSX. The [server recipe](/docs/framework/server-recipes/) shows composition with SSR modules. For helper functions, explicitly import the indicated name from `wu-framework`.

<span class="section-anchor" id="section-2"></span>

## wuIntegration

Configures Vite and injects client initialization from astro.config.

`wuIntegration(options?): AstroIntegration`

- **Parameters:** apps, sandbox, cdn, and debug.
- **Returns:** Astro integration object with an astro:config:setup hook.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** Keep one shell instance per document and unmount applications when their host is removed.

```js
import { defineConfig } from 'astro/config';
import wuIntegration from 'wu-framework/integrations/astro';
export default defineConfig({ integrations: [wuIntegration({ apps: [{ name: 'card', url: '/apps/card' }], sandbox: 'module' })] });
```

cdn adds a UMD script to head, but app auto-init still imports the wu-framework package. Choosing CDN here does not automatically replace that import.

Reference: `integrations/astro/index.js`.

<span class="section-anchor" id="section-3"></span>

## Astro WuShell

Emits catalog configuration and runs wu.init in a client script.

`<WuShell apps={apps} sandbox? debug?>children</WuShell>`

- **Parameters:** Required apps; sandbox and debug. Renders its slot.
- **Returns:** Astro markup with JSON configuration and a bundled script.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** Keep one shell instance per document and unmount applications when their host is removed.

```astro
---
import WuShell from 'wu-framework/integrations/astro/WuShell.astro';
---
<WuShell apps={[{ name: 'card', url: '/apps/card' }]}><main>Contenido</main></WuShell>
```

It is not a reactive provider: changing an HTML attribute does not update runtime configuration or create a second instance.

Reference: `integrations/astro/WuShell.astro`.

<span class="section-anchor" id="section-4"></span>

## Astro WuApp

Emits a client mount point for a registered application.

`<WuApp name="card" lazy? class? style? />`

- **Parameters:** name; lazy enables IntersectionObserver; container class and style.
- **Returns:** Astro container and mounting script.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** Keep one shell instance per document and unmount applications when their host is removed.

```astro
---
import WuApp from 'wu-framework/integrations/astro/WuApp.astro';
---
<WuApp name="card" lazy />
```

Initialize and register the application through a shell or integration. The component does not receive module or render SSR.

Reference: `integrations/astro/WuApp.astro`.

<span class="section-anchor" id="section-5"></span>

## Astro WuAppSSR

Renders an application in Astro SSR or SSG and publishes props for optional hydration.

`<WuAppSSR name module props? styles? hydrate? fallbackToClient? />`

- **Parameters:** Required server module; hydrate and fallbackToClient true; optional class/style.
- **Returns:** Initial HTML with an SSR marker and JSON state when hydrating.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** Keep one shell instance per document and unmount applications when their host is removed.

```astro
---
import WuAppSSR from 'wu-framework/integrations/astro/WuAppSSR.astro';
import { renderHtml } from 'wu-framework/server';
const module = renderHtml(() => '<p>Resumen</p>');
---
<WuAppSSR name="card" module={module} hydrate={false} />
```

hydrate:false keeps server HTML only. fallbackToClient:false propagates the SSR error. The component does not expose every nonce/shadowMode option of renderApp.

Reference: `integrations/astro/WuAppSSR.astro`.

<span class="section-anchor" id="section-6"></span>

## Next WuShell

Initializes the client runtime and coordinates descendants through the shell promise.

`WuShell({apps, sandbox?, debug?, children?}): ReactNode`

- **Parameters:** apps and children; sandbox/debug.
- **Returns:** children without an extra DOM wrapper.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** Keep one shell instance per document and unmount applications when their host is removed.

```jsx
import { WuShell } from 'wu-framework/integrations/next';
export default function Layout({ children }) {
  return <WuShell apps={[{ name: 'card', url: '/apps/card' }]}>{children}</WuShell>;
}
```

Initialization runs once per shell mount. Changing apps afterward does not automatically reconfigure the catalog.

Reference: `integrations/next/WuShell.js`.

<span class="section-anchor" id="section-7"></span>

## Next WuApp

Mounts a WU app from a Next client component.

`WuApp({name, appName?, lazy?, ...props}): ReactNode`

- **Parameters:** Registered name, lazy, className/style, onMount/onUnmount, and additional props.
- **Returns:** React-managed host element.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** Keep one shell instance per document and unmount applications when their host is removed.

```jsx
import { WuApp } from 'wu-framework/integrations/next';
export default function Page() { return <WuApp name="card" lazy />; }
```

Import the integration subpath, not runtime WuApp: the latter is a different imperative wrapper.

Reference: `integrations/next/WuApp.js`.

<span class="section-anchor" id="section-8"></span>

## Next WuAppSSR

Renders the server module and adds the client bridge when hydrate is true.

`WuAppSSR({name, module, props?, ...options}): Promise<ReactNode>`

- **Parameters:** Required module; props, styles, shadowMode, hydrate true, fallbackToClient true.
- **Returns:** React tree with SSR HTML and optional WuMount bridge.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** Keep one shell instance per document and unmount applications when their host is removed.

```jsx
import { WuAppSSR } from 'wu-framework/integrations/next';
import { renderHtml } from 'wu-framework/server';
const module = renderHtml(() => '<p>Resumen</p>');
export default async function Page() {
  return <WuAppSSR name="card" module={module} hydrate={false} />;
}
```

The browser bundle must register compatible hydrate to adopt DOM; a server renderer does not supply that lifecycle automatically.

Reference: `integrations/next/WuAppSSR.js`.

<span class="section-anchor" id="section-9"></span>

## Next WuMount

Connects an existing server container to core mounting or hydration.

`WuMount({name, containerId, props?, ssr?}): null`

- **Parameters:** name, id of an existing element, optional props, and ssr true.
- **Returns:** null; performs client effects only.
- **Errors:** Handles registration or module-loading failures; components may log errors according to their contract.
- **Permissions:** The host controls the catalog and WU policy. The integration does not itself grant application capabilities.
- **Cleanup:** The effect unmounts on removal and also reverses a mount finishing after cancellation. Does not destroy the singleton.

```jsx
import WuMount from 'wu-framework/integrations/next/WuMount';
const bridge = <WuMount name="card" containerId="wu-app-card" props={{ count: 1 }} />;
```

props are published before mounting; props are absent from effect dependencies, so changing them is not a reactive update channel.

Reference: `integrations/next/WuMount.js`.

<span class="section-anchor" id="section-10"></span>

## parseVersion

Parses a version for versioned contracts.

`parseVersion(version): [number, number, number]`

- **Parameters:** Value converted to string; removes v/= prefixes, prerelease, and build. Nonnumeric components become 0.
- **Returns:** Tuple [major,minor,patch].
- **Errors:** Not a strict validator: a nonnumeric version may produce [0,0,0].
- **Permissions:** Utility function without grants or privileged access of its own.
- **Cleanup:** Creates no persistent resources.

```js
import { parseVersion } from 'wu-framework';
console.log(parseVersion('1.2.3'));
```

Uses the same semantics as contracts; does not replace all node-semver rules.

Reference: `src/core/wu-semver.js`.

<span class="section-anchor" id="section-11"></span>

## compareVersions

Compares version structures to order compatibility.

`compareVersions(a, b): number`

- **Parameters:** Two version strings or [major,minor,patch] tuples.
- **Returns:** Negative, zero, or positive value.
- **Errors:** Validates according to its implementation; not a general package parser.
- **Permissions:** Utility function without grants or privileged access of its own.
- **Cleanup:** Creates no persistent resources.

```js
import { compareVersions, parseVersion } from 'wu-framework';
console.log(compareVersions(parseVersion('1.0.0'), parseVersion('2.0.0')));
```

Reference: `src/core/wu-semver.js`.

<span class="section-anchor" id="section-12"></span>

## satisfies

Checks a version range supported by WU contracts.

`satisfies(version, range): boolean`

- **Parameters:** Version and range strings.
- **Returns:** Boolean.
- **Errors:** Validates according to its implementation; not a general package parser.
- **Permissions:** Utility function without grants or privileged access of its own.
- **Cleanup:** Creates no persistent resources.

```js
import { satisfies } from 'wu-framework';
console.log(satisfies('1.2.3', '^1.0.0'));
```

Supported operators are those WU implements; do not assume complete npm grammar support.

Reference: `src/core/wu-semver.js`.

<span class="section-anchor" id="section-13"></span>

## silenceAllLogs

Disables framework central-logger levels.

`silenceAllLogs(): void`

- **Parameters:** No arguments.
- **Returns:** void.
- **Errors:** Validates according to its implementation; not a general package parser.
- **Permissions:** Utility function without grants or privileged access of its own.
- **Cleanup:** Creates no persistent resources.

```js
import { silenceAllLogs } from 'wu-framework';
silenceAllLogs();
```

Does not intercept all browser console output or guarantee silencing adapter/application console calls.

Reference: `src/index.js`.

<span class="section-anchor" id="section-14"></span>

## enableAllLogs

Enables framework central-logger levels.

`enableAllLogs(): void`

- **Parameters:** No arguments.
- **Returns:** void.
- **Errors:** Validates according to its implementation; not a general package parser.
- **Permissions:** Utility function without grants or privileged access of its own.
- **Cleanup:** Creates no persistent resources.

```js
import { enableAllLogs } from 'wu-framework';
enableAllLogs();
```

Controls the shared central logger of that imported module.

Reference: `src/index.js`.