Divider
The Divider component is a versatile component that displays a message to the user with various customization options. It supports different severity levels, variants, colors, and additional actions.
Installation
Install the package
npm i @start-base/start-uiAdd the styles
To use the React form elements styles in a Next.js project, import the styles in your layout.tsx file.
app/layout.tsx
import "@start-base/start-ui/styles.css";Import the component
import Divider from '@start-base/start-ui/Divider';Usages
Divider With Horizontal Orientation
HelloWorld
Divider With Vertical Orientation
HelloWorld
Divider With Children
HelloWorld
Startbase
API
| Name | Type | Default | Variants | Description |
|---|---|---|---|---|
| orientation | string | horizontal | horizontal vertical | Orientation of the Divider |
| variant | string | default | default fullWidth inset middle | Variant of the Divider |
| component | string | div | Component of the Divider | |
| contentAlign | string | center | Content align of the Divider | |
| className | string | Classname of the Divider |