# GoDeeper

Group: Understanding

Understanding in depth: five facets for a term or a whole idea, streamed in one by one, and a way to map it.
- Provide `subject` (the term or idea), `kind` (`term` | `idea`), `context` (where it was found — shown as "in Castes & Roles"), `color` (that idea's topic) and `facets`: `{ id, title, icon?, status: 'pending' | 'loading' | 'ready' | 'error', content?, onRetry? }`. `DEFAULT_FACETS` are the five lenses, in order: **What it means** (lightbulb), **How it works** (cog), **What it's like** (shapes), **A worked example** (flask), **What it's not** (ban). Lucide icons, never emoji.
- Facets are disclosure buttons (`aria-expanded`, 48px rows); content is text (it may contain `SemanticAnchor`s). While streaming, a facet shows a spinner (*writing*) or is queued; an error offers *Retry*. The first facet to arrive opens on its own until the person opens or closes one themselves. A polite live region announces "3 of 5 ready".
- **Visualize it:** the closing card (a spectrum hairline on top, never a gradient) says "*Brood* could use a map of its own." Its button, **Map ‹subject›**, then asks where — **Inside this map** (a layer under the idea, so a ring appears and you can step inside) or **As a new Visualli** (its own map in the vault) — and calls `onVisualize('inside' | 'new')`. "Map" is the brand's own verb (store, map and interact), true for both destinations.
- `layout`: `panel` docks to the right of a wide canvas (380px, floats like the Vault, the map makes room); `sheet` rises from the bottom on touch or narrow canvases (back to the peek with *‹ back*); `stack` replaces the view in small embeds — MCP cards and the Chrome extension — with *‹ back* to the map. `VisualMap` chooses automatically (`deeperLayout="auto"`).
- Opening moves focus to the subject heading; Escape or ✕ closes; the source idea stays highlighted on the canvas.


## Props

```ts
export interface GoDeeperProps { subject: string; kind?: 'term' | 'idea'; context?: string; color?: NodeColor; facets?: Facet[];
```

## Use

```ts
import { GoDeeper } from '@visualli/design-system/components';
```