Buttons

v4.0.0

Buttons 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
  • Simon Pascal Klein avatar picture
  • Julian Fleetwood avatar picture
  • Alex Page avatar picture
  • Monica Gee avatar picture
  • Patrick De Young avatar picture
  • Dominik Wilkowski avatar picture
  • Alexander Sadleir avatar picture
  • Hannah J. Nicdao avatar picture
  • Trevor Brennan avatar picture
  • Petra Gulicher avatar picture
  • Gary Broadbent avatar picture

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';