@pmwcs/fab

PMWCS fab component

Usage no npm install needed!

<script type="module">
  import pmwcsFab from 'https://cdn.skypack.dev/@pmwcs/fab';
</script>

README

Fabs

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

<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

Name Type Description
children React.ReactNode Content specified as children.
exited undefined \| false \| true Animates the FAB out of view. When this class is removed, the FAB will return to view.
icon PMWCS.IconPropT The icon for the FAB
label React.ReactNode &amp; any Make the Fab extended with a label.
mini undefined \| false \| true Make the Fab smaller.
ripple RipplePropT Adds a ripple effect to the component
trailingIcon PMWCS.IconPropT A trialing icon for the FAB