# whileLive

> Ties a subscription to a model, session, frame or global to the time a mixin's host or an island component is live in a document, so code that renders on a server as well as in a browser subscribes only in the browser, with a real signal that detaches the listeners.

```ts
import { whileLive } from "@sdxc/ui/mixins";
```

Keeps `subscribe` bound to the latest target handed to the returned function while the host
is inserted, or once an island component's first render commits: server rendering never
subscribes, and a new target detaches the previous one's listeners. Call it during setup.

## Signature

```ts
whileLive<target extends object, node extends EventTarget = Element>(handle: MixinHandle<node> | Pick<Handle, "signal" | "queueTask">, subscribe: (target: target, signal: AbortSignal) => void): (target: target) => void
```

Returns: A function to call with the current target, from render or straight after setup.

## Parameters

| Parameter | Type | Description |
| --- | --- | --- |
| `handle` | `MixinHandle<node> \| Pick<Handle, "signal" \| "queueTask">` | Handle of the mixin or island component whose lifetime bounds every subscription. |
| `subscribe` | `(target: target, signal: AbortSignal) => void` | Registers listeners on `target` with `signal`, which aborts once that target is replaced or the mixin slot or component is disposed. |

## Examples

```tsx
let follow = whileLive(handle, (model, signal) => model.addEventListener("change", sync, { signal }));
```

```tsx
whileLive(handle, (model: Toaster, signal) => model.addEventListener("change", () => void handle.update(), { signal }))(toaster);
```