@pmwcs/fab v1.1.0

Fabs

A floating action button (FAB) represents the primary action of a screen.

• Module @pmwcs/fab
• Import styles:
  • Using CSS Loader
    • import '@pmwcs/fab/styles';
  • Or include stylesheets
    • '@material/fab/dist/mdc.fab.css'
    • '@pmwcs/icon/icon.css'
    • '@material/ripple/dist/mdc.ripple.css'
• MDC Docs: https://material.io/develop/web/components/buttons/floating-action-buttons/

<Fab icon="favorite" />

<Fab icon="favorite" mini />

<>
  <Fab icon="add" label="Create" />
  <Fab trailingIcon="add" label="Create" />
  <Fab label="Label only" />
</>

<>
  <Fab icon="favorite_outline" theme={['primaryBg', 'onPrimary']} />
  <Fab
    icon="delete"
    style={{ backgroundColor: 'var(--mdc-theme-error)' }}
    theme={['onError']}
  />
</>

Fab

A floating action button component

Props