> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Notities-blok
> Het Aftersell Cart Notes-blok: een inklapbaar veld voor bestelnotities dat instructies van shoppers opslaat bij de winkelwagen en de bestelling.
> Het **Notes**-blok is een inklapbaar veld waarin shoppers bestelnotities of speciale instructies kunnen toevoegen (cadeauberichten, bezorginstructies, enzovoort) zonder de winkelwagen te verlaten. De notitie wordt opgeslagen bij de winkelwagen en gaat mee naar de bestelling.
## Gedrag
* Het veld is een **inklapbare disclosure**, standaard ingeklapt. Inklappen is puur visueel — een opgeslagen notitie blijft van kracht. Wanneer het veld ingeklapt is met een opgeslagen notitie, verschijnt er een vinkje zodat de shopper weet dat de notitie is bewaard.
* De notitie **wordt opgeslagen wanneer de shopper wegklikt** (bij blur), met statusfeedback voor opslaan / opgeslagen / fout.
* Als de winkelwagennotitie elders verandert — op de `/cart`-pagina of in een ander tabblad — synchroniseert het veld mee, tenzij de shopper al is begonnen met typen, zodat een notitie in wording nooit wordt overschreven.
## Instellingen
| Instelling | Wat het regelt | Standaard |
| --------------- | ------------------------------------------------------ | ------------------------------------- |
| **Title** | Het label van het veld. Opgemaakte tekst, vertaalbaar. | `Order notes` |
| **Placeholder** | De placeholder-tekst van het invoerveld. Vertaalbaar. | `Special instructions for your order` |
## Plaatsing en limieten
* **Regio:** body of onderkant.
* **Maximum:** 1 per winkelwagenstaat.
* **Staat:** alleen gevulde winkelwagen.
* Niet standaard toegevoegd. Niet vergrendeld — je kunt het verwijderen of verbergen.
## Aangepaste template
Ondersteunt een [aangepaste template](/nl/aftersell/cart/custom-templates) via het tabblad Code, die de ingebouwde markup van dit blok vervangt door jouw JSX. Dit zijn de props die het ontvangt.
| Prop | Type | Waarvoor het dient |
| --------------- | ------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------- |
| `titleHtml` | `string` | Gesaneerde titel-HTML met opgemaakte tekst. Leeg wanneer de merchant de titel leeg heeft gelaten. |
| `titleText` | `string` | Titel als platte tekst. Gebruik het voor het `aria-label` van de textarea, en als kop wanneer er geen opgemaakte tekst is. |
| `hasTitle` | `boolean` | Of een van beide titelvormen aanwezig is. Bepaalt of de kop en het `aria-label` van de toggle worden getoond. |
| `placeholder` | `string` | Placeholder die in het lege notitieveld wordt getoond. |
| `noteInput` | `string` | Huidige notitietekst. |
| `status` | `'idle' \| 'saving' \| 'saved' \| 'error'` | Levenscyclus van het opslaan. Stuurt de uitgesproken statuslive-regio aan. |
| `statusLabel` | `string` | Opgeloste live-regio-aankondiging voor `status`. Leeg bij idle. |
| `displayStatus` | `'idle' \| 'saving' \| 'saved' \| 'error'` | Status voor het icoon. Zoals `status`, behalve dat een ingeklapte notitie met tekst als `saved` wordt gelezen. |
| `isExpanded` | `boolean` | Of het notitieveld is uitgeklapt. Inklappen is puur visueel; de notitie blijft altijd bewaard. |
| `onNoteChange` | `(value: string) => void` | Werkt de notitietekst bij. Roep aan met de nieuwe waarde, bijvoorbeeld vanuit de `onInput` van de textarea. |
| `onNoteBlur` | `(event: unknown) => void` | Slaat de notitie op. Koppel direct aan de `onBlur` van de textarea; de waarde wordt van het event afgelezen. |
| `onToggle` | `() => void` | Schakelt tussen de uit- en ingeklapte staat. |
**De notitie wordt opgeslagen bij `onNoteBlur`, niet bij elke toetsaanslag.** Koppel zowel `onNoteChange` als `onNoteBlur`, anders worden notities stilzwijgend nooit bewaard. Houd de statustekst in een live-regio zodat screenreaders opslaan en opgeslagen aankondigen.
## Design
Style dit blok via de sectie **Design** in het instellingenpaneel. Dit zijn overrides per blok die bovenop je globale design komen en erop terugvallen wanneer ze leeg zijn.
### Text
De sectie **Text** in Design regelt de typografie van twee elementen. Gebruik de kiezer **Text element** om ertussen te wisselen.
**Title** — de sectiekop boven het notitieveld. Vet stel je in de Rich Text Editor hierboven in (op het tabblad Settings). Tekstkleur stel je in de sectie Toggle van Design in.
| Instelling | Wat het regelt | Standaard |
| ------------------ | ---------------------------- | --------- |
| **Size** | Lettergrootte. | `14px` |
| **Line height** | Regelhoogtevermenigvuldiger. | `1.4` |
| **Letter spacing** | Tracking tussen letters. | Normal |
**Note field** — de tekst in de textarea waarin shoppers hun notitie typen.
| Instelling | Wat het regelt | Standaard |
| ------------------ | ------------------------------------------------------- | ------------------------------------- |
| **Text color** | Kleur van de notitietekst. | Neemt over van winkelwagen-tekstkleur |
| **Size** | Lettergrootte. | `14px` |
| **Weight** | Fontgewicht — Light, Regular, Medium, Semibold of Bold. | Regular (400) |
| **Line height** | Regelhoogtevermenigvuldiger. | `1.5` |
| **Letter spacing** | Tracking tussen letters. | Normal |
Wat zijn design-instellingen? Lees er hier meer over: [Design-instellingen](/nl/aftersell/cart/design-settings).