# blocks

`RenderBlocks` — generyczny, serwerowy silnik renderowania bloków. Plugin nie
zna Twoich bloków: iteruje po danych, mapuje `blockType` → komponent przez
registry (prop), obsługuje zagnieżdżanie i rozszerzenia per-blok. Bloki
(schemat + komponenty) definiujesz u siebie.

## Config

Brak opcji w payload.config — bloki definiujesz w swoich kolekcjach
(pole typu `blocks`). Plugin dostarcza tylko silnik renderujący.

## Front — RenderBlocks

Import z `ipal-kit/rsc` (to komponent serwerowy):

```tsx
import { RenderBlocks } from 'ipal-kit/rsc'

// Twój registry: blockType → komponent (komponenty są Twoje)
import { Hero } from '@/blocks/Hero'
import { FormBlock } from '@/blocks/FormBlock'

const registry = { hero: Hero, formBlock: FormBlock }

export default async function Page() {
  const page = await payload.findByID({ collection: 'pages', id })
  return <RenderBlocks blocks={page.layout} components={registry} />
}
```

- nieznany `blockType` → pomijany (null), nie crashuje
- każdy blok dostaje `_components` (mapę) — do rekursji zagnieżdżonych bloków
  bez React Context (wymóg RSC)

## enhanceProps — logika per-blok bez wiedzy pluginu

Gdy blok potrzebuje danych z innych bloków (np. nawigacja zbierająca kotwice
z sekcji), podaj `enhanceProps`. Plugin go wywołuje, nie znając Twoich bloków:

```tsx
const enhanceProps = ({ block, allBlocks }) => {
  if (block.blockType !== 'sectionNav') return {}
  const sections = allBlocks
    .filter((b) => b.blockType === 'anchoredSection')
    .map((b) => ({ anchor: b.anchor, label: b.navLabel }))
  return { _sections: sections }
}

<RenderBlocks blocks={page.layout} components={registry} enhanceProps={enhanceProps} />
```

## Komponent bloku

Każdy komponent dostaje dane bloku jako propsy (plus `_components`, plus to co
zwróci `enhanceProps`). Spacing/layout należą do Ciebie — silnik nie owija
bloków żadnym markupem.

```tsx
export function Hero(props) {
  return <section className="py-16">{/* ... */}</section>
}
```