Drawer

Boční panel pro editaci se stejnou a11y laťkou jako dialog: focus trap, ESC, scroll lock a návrat fokusu na spouštěč.

Kdy použít

Editace, u které operátor potřebuje vidět seznam za ní — panel překryje jen část obrazovky.
Rychlá úprava několika polí, u které se dál pracuje se seznamem. Delší editace s vysvětlováním patří do IngotModal — tam je místo i soustředění.
Úprava záznamu z řádku tabulky: drawer se otevře vedle, kontext řádku zůstává na očích.

Obsah je delší než zhruba dvě obrazovky. Pak je to samostatná stránka, ne boční panel.
Jde o rozhodnutí, které musí padnout hned („potvrď / zruš“) — na to je IngotModal, případně IngotConfirm.
Nad otevřeným drawerem nikdy neotvírej další překryv. Jeden překryv v jednu chvíli; výsledek akce ohlas toastem.

title: ReactNode — Vykreslí se do nadpisu h2, na který ukazuje aria-labelledby.
onClose: () => void — Volá ESC, zavírací tlačítko a při dismissable i klik do pozadí.
children: ReactNode — Tělo panelu. Scroluje samo; hlavička a patka zůstávají na místě.
closeLabel: string — Přeložený aria-label křížku — Ingot překlady nemá.
subtitle: ReactNode — Kontext editovaného záznamu pod titulkem; nese aria-describedby.
footer: ReactNode — Lišta akcí. Je vždy viditelná — netlačí se pod scroll těla.
side: "right" | "left" — Ze které strany panel vyjíždí. Výchozí right.
width: number — Šířka panelu v px. Výchozí 400, tvrdý strop 560.
dismissable: boolean — Jestli klik do pozadí zavírá (výchozí ano). U rozepsaného formuláře vypnout.
testId: string — data-testid overlaye; panel dostane `${testId}-panel`.