Divider

Visual separator line for content sections. Can be horizontal (default) or vertical.

Import

import { Divider } from 'vuiii'

Basic Usage

View in Storybook

// Horizontal divider (default) import { Divider } from 'vuiii'

<div>Section 1</div>
<Divider />
<div>Section 2</div>

More Examples

// Vertical divider (for inline content)
<div style="display: flex; align-items: center;">
  <span>Item 1</span>
  <Divider orientation="vertical" />
  <span>Item 2</span>
</div>

// In FormFields (using FORM_DIVIDER constant) import { FORM_DIVIDER } from 'vuiii' const fields = [ { name: 'name',
component: Input, label: 'Name' }, FORM_DIVIDER, { name: 'email', component: Input, label: 'Email' } ]

Storybook

For interactive examples with all variants, see Divider in Storybook.