• Start
  • Blogg
  • Kom igång
  • Riktlinjer
  • Komponenter
  • Changelog
  • Tillgänglighet
  • Statistik
  • Inställningar

Komponenter

Komponenter

​
​

Inga resultat hittade, prova med andra sökvillkor.

FAB

FAB

4.5.0

The FAB component represents the most important action on a screen. It puts key actions within reach.

Demo
Props
Installation
Länkar
Tillgänglighet
Change log
Statistik

Demo

Props

Se fullständing dokumentation(öppnas i ny flik)
NamnTypBeskrivning

customAttribute

{ attribute: string; value: string | number }Used for tests. Clickable and requested subcomponents will be suffixed with "-[ComponentName]".

elevated

booleanDetermines if the Fab should display a drop shadow (default is true).

isLoading

booleanIf true, a loading skeleton will be rendered instead of the component.

label *

stringText label for the button, used as aria-label for "circular" variant. If variant is "circular", the label prop is used to set an aria-label instead.

leadingIcon

FCOptional icon to be displayed to the left inside the Fab.

variant

"extended" | "circular"Variant of the Fab, can be either "circular" or "extended" (default is "circular").

Installation

Kodexempel
npm install @sj-ab/component-library.ui.fab

Länkar

  • Storybook

  • Figma

  • Bit.cloud

Tillgänglighet

Semantik

Som standard visas FAB som en <button type="button">.

Tillgängligt namn

FAB får ett tillgängligt namn genom den obligatoriska propen label. Label kommer antingen visas visuellt eller sättas som dold aria-label, beroende på vilken variant av FAB som används.

Change log

  • Icons

    4.5.0
  • Adds new focus-visible markings.

    4.4.0
  • Scrollable container imported packages for sideeffects

    4.3.0
  • New ScrollableContainer

    4.3.0
  • Upgrade to React 19

    4.2.0

Statistik