Button
The Button component is a versatile and customizable button element that can be used in various contexts. It supports different variants, colors, sizes, 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 Button from '@start-base/start-ui/Button';Usages
Button Primary
Button Secondary
Button Destructive
API
| Name | Type | Default | Variants | Description |
|---|---|---|---|---|
| children | ReactNode | Children of the Button | ||
| className | string | Classname of the Button | ||
| variant | string | default | default link outline ghost | Variant of the button |
| color | string | primary | primary secondary destructive | Color of the button |
| size | string | medium | icon small medium large | Size of the button |
| fluid | boolean | false | Fluid of the button | |
| type | string | button | submit reset button | Type of the Button |
| disabled | boolean | false | Disabled of the Button | |
| loading | boolean | false | Loading of the Button |