Tatiana Lopaeva
bec4f11dcd
# Conflicts: # common/ASC.Api.Core/Extensions/HostBuilderExtension.cs # common/services/ASC.Notify/Program.cs # common/services/ASC.Studio.Notify/Program.cs # common/services/ASC.Webhooks.Service/Program.cs # packages/common/components/Loaders/index.js # packages/common/store/AuthStore.js # packages/login/src/client/components/sub-components/recover-access-modal-dialog.tsx # packages/login/webpack.config.js # products/ASC.Files/Service/Program.cs # web/ASC.Web.Api/Program.cs |
||
|---|---|---|
| .. | ||
| svg | ||
| avatar.stories.js | ||
| avatar.test.js | ||
| index.js | ||
| README.md | ||
| styled-avatar.js | ||
Avatar
Used to display an avatar or brand.
Usage
import Avatar from "@docspace/components/avatar";
<Avatar size="max" role="admin" source="" userName="" editing={false} />
If you want to create an avatar with initials, only first letter of first two words of line is used.
Properties
| Props | Type | Required | Values | Default | Description |
|---|---|---|---|---|---|
size |
oneOf |
- | max, big, medium, small, min |
medium |
Size of avatar |
role |
oneOf |
- | owner, admin, guest, user |
user |
Adds a user role table |
source |
string |
- | - | - | The address of the image for an image avatar |
isIcon |
bool |
- | - | false |
Set true if .svg is provided as source prop |
userName |
string |
- | - | - | Need to create an avatar with initials |
editing |
bool |
- | - | false |
Displays avatar edit layer |
editLabel |
string |
- | - | Edit photo |
Label for editing layer |
editAction |
func |
- | - | - | Function called when the avatar change button is pressed |
className |
string |
- | - | - | Accepts class |
id |
string |
- | - | - | Accepts id |
style |
obj, array |
- | - | - | Accepts css style |