Separator
Vlasová linka přes hairline tokeny (žádné border-*). Tóny dle síly, varianta s textem uprostřed, nebo vertikální pro inline dělení.
4
Tóny
hairline → sage
2
Směry
horizont. · vert.
txt
S textem
linka—text—linka
1px
Token
hairline, ne border
Tóny
soft → hairline (default) → strong → sage.
soft
hairline (default)
strong
sage
S textem
Linka — text — linka. Text jede .eyebrow.
nebo
Vertikální
Inline dělení — např. meta řádek karty.
Doprava zdarmaSkladem4,8 ★
Props & pravidla
<Separator>
components/ui/separator.tsx| Prop | Typ | Default | Použití |
|---|---|---|---|
| orientation | "horizontal" | "vertical" | "horizontal" | Směr |
| tone | "hairline" | "soft" | "strong" | "sage" | "hairline" | Síla / barva linky |
| label | string | — | Text uprostřed (horizontální) |
Linka je vždy přes hairline token (1px bg), nikdy
border-*. Vertikální varianta potřebuje výšku od rodiče (h-* / self-stretch).