Buttons
v4.0.0Buttons make common actions more obvious and help users more easily perform them. Buttons use labels and sometimes icons to communicate the action that will occur when the user touches them.
Released
- History
- View changes
- Install
- npm i @gold.au/buttons
- Tags
- Requires
- Contributors
React Usage
<AUbutton>Primary button</AUbutton>
<AUbutton as='secondary'>Secondary button</AUbutton>
<AUbutton as='tertiary'>Tertiary button</AUbutton>
<AUbutton block>Block button</AUbutton>
<AUbutton dark>Block button</AUbutton>
<AUbutton as='secondary' dark block>
Secondary dark block button
</AUbutton>Props
| Prop name | Type | Description |
|---|---|---|
| link | string | If an link is set the button will render as a link |
| linkComponent | string | The component used for the link, optional |
| as | string | The kind of button, secondary,tertiary |
| block | boolean | The block option to make the button fill the available width |
| dark | boolean | A dark variation of the component |
All other props are spread into the component
Exports
| Name | Type | Description |
|---|---|---|
AUbuttons |
default | The button component |
node_modules import
import AUbuttons from '@gold.au/buttons';pancake import
import AUbuttons from './buttons';