User Profile
The user profile web component shows detailed information about a user. It is customizable enough to allow you to add more user information or even actions if needed.
Usage
Import
npm i @finastra/user-profile
import '@finastra/user-profile';
...
<fds-user-profile userName="Adnen Manai">
<div slot="userInfo">adnen.manai@finastra.com</div>
<div slot="actions">
Actions go here
</div>
</fds-user-profile>API
Properties
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
dense |
dense |
boolean |
false | Align the default avatar with user info |
divider |
boolean |
true | ||
shortName |
shortName |
string |
"" | Use this property to override the initials |
userName |
userName |
string |
"" | Name of the avatar, used to generate the initials (Displayed on hover) |
Slots
| Name | Description |
|---|---|
actions |
Actions that a user can perform |
userInfo |
The user info |