I blocchi

I blocchi sono divisi per livello — atomi, molecole, organismi, contenitori — e la divisione non è tassonomia: dice cosa è annidabile. Atomi, molecole e organismi si possono mettere dentro un altro blocco; i contenitori e i blocchi di sezione no, perché sono loro a contenere.

Il registro completo è quello che finisce in `config.blocks` di Payload. Da lì in poi la lista dei tipi disponibili in un campo è una scelta di configurazione, non una modifica al motore.

• blocks/tiers/atoms.ts — testo, icona, separatore, rich text, figura, progress, selettore di tema
• blocks/tiers/molecules.ts — azione, CTA, navigazione, toggle, gruppo di toggle
• blocks/tiers/organisms.ts — riferimento, riferimento mappato, dialogo, hover card
• blocks/tiers/containers.ts — card, tabs, avatar, collapsible, swiper
• blocks/allBlocks.ts — il registro completo registrato in `config.blocks`
• blocks/nestableBlockSlugs.ts — quali si possono annidare

Ogni blocco riceve, senza doverli dichiarare, il campo del viewMode, quello delle classi, il gruppo degli stili e il gruppo `uiState` — lo stato e i comportamenti dell’istanza. L’iniezione avviene in un punto unico, e il punto unico è la ragione per cui aggiungere un campo trasversale è un cambiamento di una riga invece che di quarantasette.

Il gruppo `uiState` è costruito PER BLOCCO: sa quali slice quel tipo di blocco espone, e le mostra. È una factory e non una costante proprio perché la risposta dipende dallo slug, e l’unico punto che lo conosce è l’iniezione.

• blocks/blockConfig.ts — come un blocco viene usato — statico o dentro una vista — e l’iniezione della configurazione comune
• fields/fieldsViewMode.ts — il campo che nomina la forma
• fields/fieldsStyles.ts — gli stili nominati
• fields/fieldsUiState.ts — stato, trigger e conseguenze dell’istanza, costruiti per blocco

Ognuno dichiara i propri campi e il viewMode di default. Alcuni sono un solo campo (`text`), altri portano una configurazione ampia (`swiper` ha un centinaio di righe di opzioni). La lunghezza del file dice quanta configurazione quel blocco espone, non quanto è importante.

• blockText.ts · blockRichText.ts — testo semplice e Lexical
• blockIcon.ts · blockSeparator.ts · blockProgress.ts — icona, separatore, barra
• blockFigure.ts · blockAvatar.ts — immagini: con didascalia e circolare
• blockAction.ts — link, bottone, comando — più la variante CTA
• blockNavigation.ts · blockThemeSwitch.ts — menu e selettore di tema
• blockCard.ts · blockChildren.ts — contenitori generici
• blockAccordion.ts · blockCollapsible.ts · blockTabs.ts — i tre modi di mostrare una cosa alla volta
• blockToggle.ts · blockToggleGroup.ts — interruttore singolo e gruppo
• blockSwiper.ts — il carosello, con la sua configurazione estesa
• blockHoverCard.ts · blockAlertDialog.ts — pannello al passaggio e dialogo modale
• blockReference.ts · blockMappedReference.ts — un documento riferito, e dei record raggiunti da una relazione
• blockView.ts · blockViewRow.ts — una vista e la sua riga
• blockPathBinding.ts — una struttura ricorsiva mappata (un menu con i figli)
• blockForm.ts · blockFormChildren.ts — il form e i suoi controlli
• blockScrollspy.ts — l’indice di pagina
• blockThumbs.ts — le miniature dei blocchi per l’interfaccia: SVG in data-URI, nessuna richiesta

Le sezioni sono blocchi strutturali di primo livello: una inline (scritta nella pagina) e una per riferimento (scritta una volta nella collection `sections` e riusata). Sono le uniche che il layout di una pagina accetta direttamente.

I blocchi form sono a parte perché la loro configurazione è quella del form-builder, non quella dei blocchi normali: un controllo dichiara nome, tipo, validazione, e i figli ammessi sono solo quelli che un form può contenere.

• blocks/sections/blockSectionInline.ts — la sezione scritta nella pagina
• blocks/sections/blockSectionReference.ts — la sezione riusata da `sections`
• blocks/sections/uimsSections.ts — il registro delle sezioni, più lo scrollspy
• blocks/form/FormControlBlock.ts — il controllo generico
• blocks/form/FormSelectBlock.ts + FormRadioBlock.ts — i controlli con opzioni
• blocks/form/formBlocks.ts + formControlChildSlugs.ts — il registro e i figli ammessi

Tre blocchi che esistono solo per la AdminBar: la sezione modificabile e il suo albero. Stanno in una sottocartella con un registro proprio perché non devono comparire fra i blocchi che si scelgono scrivendo contenuto.

• blocks/admin/blockAdminSection.ts — la sezione, in versione editabile
• blocks/admin/blockAdminSectionTree.ts — l’albero delle sezioni
• blocks/admin/adminBlocks.ts — il registro dell’editor