FAB
The FAB component represents the most important action on a screen. It puts key actions within reach.
Namn | Typ | Beskrivning |
---|---|---|
customAttribute | { attribute: string; value: string |
number } | Used for tests. Clickable and requested subcomponents will be suffixed with "-[ComponentName]". |
elevated | boolean | Determines if the Fab should display a drop shadow (default is true). |
isLoading | boolean | If true, a loading skeleton will be rendered instead of the component. |
label * | string | Text 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 | FC | Optional 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"). |
npm install @sj-ab/component-library.ui.fab
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.