Separator
A visual divider to separate content areas.
Separator creates a line (horizontal or vertical) using terminal border characters. It's useful for breaking up layouts and grouping related information.
Usage
import { Separator, Box, Text } from 'caret-tui';
const App = () => (
<Box flexDirection="column" width={30}>
<Text>Top Section</Text>
<Separator variant="primary" />
<Text>Bottom Section</Text>
</Box>
);Props
| Prop | Type | Default | Description |
|---|---|---|---|
orientation | 'horizontal' | 'vertical' | 'horizontal' | The direction of the separator. |
variant | 'border' | 'primary' | 'secondary' | 'muted' | 'border' | The color variant from the active theme. |