Componenti & design system

I componenti di @shell/ui sono condivisi da tutti i progetti (nessuna copia). Il colore segue la variabile --brand del tema della surface.

Button (@shell/ui)

import { Button } from "@shell/ui";
<Button>Primario</Button>
<Button variant="ghost">Ghost</Button>

Badge (progetto)

nuovoSSG

import { Badge } from "./_components.js";
<Badge>nuovo</Badge>

Card (@shell/ui)

Card

Contenitore con bordo e ombra.

import { Card } from "@shell/ui";
<Card>contenuto…</Card>

Callout (progetto)

✅ Tutto ok

Componente del progetto, usato anche negli .mdx.

import { Callout } from "./_components.js";
<Callout type="ok">…</Callout>

💡 Overlay / eject

Un progetto può sovrascrivere un componente della shell creando un file con lo stesso nome (alias @project risolto prima di @shell): personalizzazione puntuale senza forkare la shell.