Components
Separator
Visual divider for separating content sections.
Separator
A visual divider line for separating content into logical sections.
Import
import { Separator } from '@mks2508/mks-ui/react';Basic Usage
Basic Usage
Section one
Section two
.tsx
<div className="space-y-4">
<p>Section one</p>
<Separator />
<p>Section two</p>
</div>Orientation
Orientation
Section one
Section two
LeftRight
Decorative
Non-semantic, purely visual separator (removed from accessibility tree):
<Separator decorative />API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
orientation | 'horizontal' | 'vertical' | 'horizontal' | Direction of the separator |
decorative | boolean | false | If true, removes from accessibility tree |
className | string | — | Additional CSS classes |