@rmwc/fab NPM | npm.io

14.2.2 • Published 8 days ago

Install

Weekly downloads

3,841

License

MIT

Repository

Last release

8 days ago

Fabs

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

Module @rmwc/fab
Import styles:
- Using CSS Loader
  - import '@rmwc/fab/styles';
- Or include stylesheets
  - '@material/fab/dist/mdc.fab.css'
  - '@rmwc/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

Name	Type	Description
`children`	`ReactNode`	Content specified as children.
`exited`	`boolean`	Animates the FAB out of view. When this class is removed, the FAB will return to view.
`icon`	`IconPropT`	The icon for the FAB
`label`	`any`	Make the Fab extended with a label.
`mini`	`boolean`	Make the Fab smaller.
`ripple`	`RipplePropT`	Adds a ripple effect to the component
`trailingIcon`	`IconPropT`	A trialing icon for the FAB

@material/fab @rmwc/base @rmwc/icon @rmwc/provider @rmwc/ripple @rmwc/types

@everything-registry/sub-chunk-784 react-material-site rmwc @map-colonies/react-core webiny-ui @webiny/ui @zalastax/nolb-_rm @bobaboard/ui-components apache-beam-jupyterlab-sidepanel

8 days ago

15 days ago

15 days ago

16 days ago

28 days ago

1 month ago

2 months ago

2 months ago

2 months ago

2 months ago

3 months ago

3 months ago

3 months ago

3 months ago

4 months ago

4 months ago

4 months ago

5 months ago

8 months ago

6 months ago

8 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

5 months ago

8 months ago

5 months ago

5 months ago

11 months ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago