SiAvatarComponent documentation¶
selector
si-avatarInput Properties¶
| Name | Type | Default | Description |
|---|---|---|---|
altText ¶ | string | The alt text for image, title for other modes. | |
| autoColor ¶ | boolean | false | Automatically calculates the background color. If set, color will be ignored. |
| color ¶ | number | undefined | The desired color index from $element-data-* color tokens. This can be set to any kind of positive integer that is then mapped to a color index. A better way to set a pseudo-random color is to set * autoColor to true . |
| icon ¶ | string | Icon name when using an icon. | |
| imageUrl ¶ | string | Image src URL when using an image. | |
| initials ¶ | string | Initials to be displayed as default avatar if no icon or imageUrl are provided. If also no initials are provided, they will be automatically calculated from the altText . The value will be used to calculate the background color when autoColor is true. | |
| size ¶ | AvatarSize | 'regular' | Size of the component. |
| status ¶ | EntityStatusType | The status (success, info, warning, caution, danger, critical, pending, progress) to be visualized. | |
| statusAriaLabel ¶ | TranslatableString | aria-label for status |
Types Documentation¶
| Represents a translatable string. This can either be a translation key, e.g. ACTIONS.EDIT that will be automatically translated when displayed on the UI or a pre-translated string, e.g. Edit . Equivalent to a normal string in usage and functionality. |
|---|
Translatable import imported from @siemens/element-translate-ng |
|---|
Property The desired color index from $element-data-* color tokens. This can be set to any kind of positive integer that is then mapped to a color index. A better way to set a pseudo-random color is to set autoColor to true . |
|---|
Except where otherwise noted, content on this site is licensed under MIT License.