# mount

Mounts a Typed component in an isolated Storybook canvas.

The mount stays alive after its first render so reactive attributes and event
handlers remain attached. It is released explicitly or when Storybook
removes the canvas from its document.

## Signatures

```ts
export declare function mount<E>(content: Fx.Fx<RenderEvent, E, Scope.Scope | RenderTemplate>, document?: Document): Promise<MountedStory>;
```

## Why

Waiting only for the first `RenderEvent` and then ending the fiber would
detach reactive attributes and event handlers. This helper keeps the Typed
renderer alive while still giving tests an explicit disposal boundary.

## Ownership and lifetime

`mount` creates an unsafe Scope dedicated to this story, starts the render
fiber, and resolves only after the first event. `dispose` interrupts and
closes it idempotently. After the canvas has once been connected, a
document-scoped MutationObserver disposes it when removed and then disconnects.
Calling `dispose` while the canvas is still connected does **not** disconnect
that observer: it continues retaining the document, canvas, and disposal
closure until the canvas is removed. Tests or hosts that keep a disposed
canvas connected must remove it themselves to release that observer. If
rendering fails before the first event, Scope cleanup runs before rejection
and no removal observer is installed.

## Platform requirements

This is a browser/testing API. The provided Document supplies element and
MutationObserver implementations. The canvas is returned detached so
Storybook or a test controls where it enters the DOM.

## Examples

```ts
import { mount } from "@typed/ui/Storybook"
import { html } from "@typed/template"

const story = await mount(html`<button type="button">Save</button>`)
document.body.append(story.canvas)
// Run interactions and assertions against story.canvas.
await story.dispose()
story.canvas.remove() // disconnects the removal observer
```