Button

Variants: default, secondary, flat, success, danger, warning. Pass tooltip for a styled tooltip instead of the native title.

Children are laid out in a row with a gap, so an icon next to the text sits beside it: <Button><PlusIcon />New</Button>.

Props

variant'default' | 'secondary' | 'flat' | 'success' | 'danger' | 'warning'
Default: 'default'
Visual style.
tooltipstring
Shows a styled Tooltip (use instead of the native title).
tooltipPlacementstring
Default: 'bottom'
Tooltip placement (see Tooltip).
onClick(event) => void
Click handler.
typestring
Default: 'button'
Native button type.
disabledboolean
Default: false
Disable the button.
classNamestring
Default: ''
Extra classes for the root element.
childrenReactNode
Content.
...rest
Any other props are passed to the underlying element.

Button props
Prop	Type	Default	Description
`variant`	'default' \| 'secondary' \| 'flat' \| 'success' \| 'danger' \| 'warning'	`'default'`	Visual style.
`tooltip`	string	–	Shows a styled Tooltip (use instead of the native `title`).
`tooltipPlacement`	string	`'bottom'`	Tooltip placement (see Tooltip).
`onClick`	(event) => void	–	Click handler.
`type`	string	`'button'`	Native button type.
`disabled`	boolean	`false`	Disable the button.
`className`	string	`''`	Extra classes for the root element.
`children`	ReactNode	–	Content.
`...rest`		–	Any other props are passed to the underlying element.