Divider
Horizontal or vertical separator with optional centered label. Supports three color themes and three line-style variants (solid, dashed, dotted).
[SRC]tsx
1import { Divider } from "@mdrbx/nerv-ui";
With Label
LABELEDinspection frame
live inspectionframe-01
[ SECTION 01 ]
Without Label
PLAINinspection frame
live inspectionframe-01
Color Themes
COLORSinspection frame
live inspectionframe-01
[ ORANGE ]
[ GREEN ]
[ CYAN ]
Line Style Variants
VARIANTSinspection frame
live inspectionframe-01
[ SOLID ]
[ DASHED ]
[ DOTTED ]
Vertical Orientation
VERTICALinspection frame
live inspectionframe-01
MAGI-01MAGI-02MAGI-03
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label | string | — | Optional centered label text displayed as [ LABEL ] |
| color | "orange" | "green" | "cyan" | "orange" | Color theme for line and label |
| variant | "solid" | "dashed" | "dotted" | "solid" | Line style variant |
| orientation | "horizontal" | "vertical" | "horizontal" | Divider orientation |
| className | string | "" | Additional CSS classes |
[i]VERTICAL MODE
When orientation="vertical", the label prop is ignored. The divider renders
as an inline-block border-left element that stretches to its parent height.