Avatar
The Avatar component assists users in understanding content, without being the focal point in a UI. They can represent a user or a brand.
Namn | Typ | Beskrivning |
---|---|---|
customAttribute | { attribute: string; value: string |
number } | Used for tests. Clickable and requested subcomponents will be suffixed with "-[ComponentName]". |
icon | string |
ComponentClass |
FunctionComponent | Icon to display in the avatar. Can be a string representing the icon name or a React component of type SVG. |
id | string | Unique identifier for the component. |
initials | string | Initials to display in the avatar. Must be exactly two characters, representing the first and last name, without any spaces (e.g., "JD"). |
isLoading | boolean | If true, a loading skeleton will be rendered instead of the component. |
passengerCategory | "ADULT" |
"CHILD_AND_YOUTH" |
"STUDENT" |
"SENIOR" | Specifies the background color of the avatar based on the category of the passenger. |
size | "sm" |
"xs" |
"md" |
"lg" |
"xl" | Size of the avatar. |
npm install @sj-ab/component-library.ui.avatar
Avatar ska enbart användas som komplement till annat innehåll. Bilden och textinitialerna är därför dolda för skärmläsare med aria-hidden.
Importer av Avatar
17
Repos med Avatar
40%
Senaste installerade version av Avatar
8.0.20
Äldsta installerade version av Avatar
8.0.13