# Disclosure.Content

Renders native details content synchronized with hydrated state.

## Signatures

```ts
export declare function Content<const Options extends ContentOptions, const Host extends HostResult = never>(options: Options, host?: Dom.HostOverride<Dom.RenderHostProps<Options, ContentInternalProps<Options>>, Options["content"], Host>): Fx<RenderEvent, Renderable.Error<Options | Host>, Renderable.Services<Options | Host> | Scope.Scope | RenderTemplate>;
```

## Why

Native disclosure behavior, semantics, and `toggle` events stay intact while
Effect state can control or observe visibility.

## Ownership and lifetime

Running the Fx owns the native listener and scoped observer. A custom host
must preserve the toggle handler and exactly one composed hydration ref.

## Examples

```ts
import { Effect } from "effect"
import * as Disclosure from "@typed/ui/Disclosure"

const program = Effect.gen(function* () {
  const state = yield* Disclosure.makeState()
  return Disclosure.Content({
    state,
    content: Disclosure.Button({ content: "More" })
  })
})
```