# Het nodemodel

> Wat alle nodes gemeen hebben, waarin ze verschillen, en waar elk van hen is gedocumenteerd.

Source: https://docxcelerate.com/nl/docs/nodes/overview/

Een document is een boom van nodes. Elke node is drie dingen: een **id**, een
**soort**, en een regel om content te produceren.

```tsx
<Paragraph          // the kind
  id="greeting"     // the address
>
  Dear {state.name},  {/* the rule */}
</Paragraph>
```

Opgelost tegen jouw data wordt het pure JSON:

```json
{ "id": "greeting", "kind": "paragraph", "mode": "static", "text": "Dear Adaeze Nkemelu," }
```

Geen opmaak, geen lay-out. Die horen bij de renderer.

## De catalogus

Elk type heeft een eigen pagina, met elke optie die het aanneemt en een preview
van elke manier waarop het geschreven kan worden.

### Structuur

- **[Section](https://docxcelerate.com/nl/docs/nodes/section/)** (`section`) — Groups nodes under a titled heading.
- **[Table of contents](https://docxcelerate.com/nl/docs/nodes/table-of-contents/)** (`tableOfContents`) — A marker for a contents list, ahead of the renderers that build one.

### Tekst

- **[Paragraph](https://docxcelerate.com/nl/docs/nodes/paragraph/)** (`paragraph`) — A block of prose, written from your data or generated from prompts.

### Media

- **[Image](https://docxcelerate.com/nl/docs/nodes/image/)** (`image`) — A picture resolved from your data or described by a prompt.
- **[Shape](https://docxcelerate.com/nl/docs/nodes/shape/)** (`shape`) — A drawn rectangle with the document's own words on top of it.
- **Clip art** (`clipArt`) _(Gepland)_ — Named visual blocks — rules, marks, callouts — drawn by the renderer.

### Data

- **[Graph](https://docxcelerate.com/nl/docs/nodes/graph/)** (`graph`) — A real Word chart, declared as data.
- **[Table](https://docxcelerate.com/nl/docs/nodes/table/)** (`table`) — A grid of cells, with the columns declared once.

## Ids zijn adressen

Het id van een node is hoe een generatie-endpoint die alinea aanwijst, en hoe
twee buildartefacten in een diff naast elkaar komen te liggen. Een id hernoemen
breekt wat er van buitenaf naar wijst, net zoals het hernoemen van een API-route
dat doet.

Houd ze uniek binnen het document. Het kost niets en maakt logs leesbaar.

## Waar de content vandaan komt

Elke node heeft ofwel zijn content ofwel prompts om die te produceren, en dat
beslist het component in plaats van dat het ergens gedeclareerd wordt. Geef een
alinea tekst — of een `Image` een `src`, of een `Graph` zijn `data` — en hij lost
op je eigen machine op. Geef hem in plaats daarvan prompts en een placeholder, dan
wordt hij op het moment van de aanvraag ingevuld.

Beide lossen op naar dezelfde `kind` en verschillen in het gebouwde document door
`mode`. `mode` is uitvoer, geen invoer: de build leidt het af uit wat het component
meegaf, en het pakket vertelt een engine welke nodes die moet oplossen. Beide
meegeven op één element is een fout, geen kop of munt.

[Nodes schrijven](/nl/docs/writing-nodes/) behandelt de promptslots en wat previews
in hun plaats laten zien.

## Nesteling

[`section`](/nl/docs/nodes/section/) is vandaag de enige node die kinderen
bevat, en hij accepteert elke soort, ook andere secties. Een tabelnode met nodes
in zijn cellen is de volgende, volgens hetzelfde principe: containers bevatten de
componenten die je toch al schrijft, in plaats van een tweede contentmodel
ernaast.

## Over deze previews

Elke preview hier is een echte build. `src/nodes/` in de repository van deze site
bevat één bestand per variant, geschreven tegen het gepubliceerde package; een
buildstap lost elk daarvan op via `buildDocument` en rendert het met de renderer
die `dxcl dev` serveert. De getoonde broncode is het bestand dat gedraaid heeft,
en de JSON is wat eruit kwam — zodat deze pagina's luid stukgaan in plaats van
stilletjes te verouderen.