Buttons
Example
import {
Button,
PrimaryButton,
DangerButton,
IconButton,
} from '@i4o/catalystui'
export default () => {
return (
<div className='flex space-x-2'>
<Button>Button</Button>
<PrimaryButton>Primary Button</PrimaryButton>
<DangerButton>Danger Button</DangerButton>
<IconButton icon={<HomeIcon />} />
</div>
)
}Props
| Name | Type | Default | Description |
|---|---|---|---|
| ariaLabel | string | aria-label of the button | |
| children | ReactNode | Button content | |
| className | string | Additional class name | |
| disabled | boolean | Disabled state | |
| loading | boolean | Loading state | |
| loadingText | string | Loading text | |
| onClick | (event: MouseEvent) => void | Click handler | |
| onMouseDown | (event: MouseEvent) => void | Mouse down handler | |
| leftIcon | ReactNode | Left icon | |
| rightIcon | ReactNode | Right icon | |
| textSize | string | Text size | |
| tooltip | string | Tooltip text | |
| type | string | Button type |
IconButton Props
Refer to Default Button Props. Icon Button also has the following props:
| Name | Type | Default | Description |
|---|---|---|---|
| icon | ReactNode | Icon |