@nextcloud/vueNcAvatar
Props
| Prop name | Description | Type | Values | Default |
|---|---|---|---|---|
| url | Set a custom url to the avatar image either the url, user or displayName property must be defined | string | - | undefined |
| iconClass | Set a css icon-class for an icon to be used instead of the avatar. | string | - | undefined |
| user | Set the user id to fetch the avatar either the url, user or displayName property must be defined | string | - | undefined |
| showUserStatus | Whether or not to display the user-status | boolean | - | true |
| showUserStatusCompact | Whether or not to the status-icon should be used instead of online/away | boolean | - | true |
| preloadedUserStatus | When the user status was preloaded via another source it can be handed in with this property to save the request. If this property is not set the status will be fetched automatically. If a preloaded no-status is available provide this object with properties "status", "icon" and "message" set to null. | object | - | undefined |
| isGuest | Is the user a guest user (then we have to user a different endpoint) | boolean | - | false |
| displayName | Set a display name that will be rendered as a tooltip either the url, user or displayName property must be defined specify just the displayname to generate a placeholder avatar without trying to fetch the avatar based on the user id | string | - | undefined |
| size | Set a size in px for the rendered avatar | number | - | 32 |
| allowPlaceholder | Placeholder avatars will be automatically generated when this is set to true | boolean | - | true |
| disableTooltip | Disable the tooltip | boolean | - | false |
| disableMenu | Disable the menu | boolean | - | false |
| tooltipMessage | Declares a custom tooltip when not null Fallback will be the displayName requires disableTooltip not to be set to true | string | - | null |
| title | Declares a native tooltip when not null requires disableTooltip not to be set to true requires tooltipMessage not to be provided | string | - | null |
| isNoUser | Declares username is not a user's name, when true. Prevents loading user's avatar from server and forces generating colored initials, i.e. if the user is a group | boolean | - | false |
| menuPosition | Choose the avatar menu alignment. Possible values are left, center, right. | string | - | 'center' |
| menuContainer | Selector for the popover menu container | string|object|Element|boolean | - | 'body' |
| ariaLabel | string | - | null |
Slots
| Name | Description | Bindings |
|---|---|---|
| icon | Icon slot |
Basic user avatar
loading...
Avatar with image
loading...
Avatar with material design icon
loading...
Avatar with preloaded status
loading...
Avatar for non-users
loading...
Avatar on complex background
loading...