1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-02 06:07:06 +01:00
metamask-extension/ui/components/component-library/avatar-account/README.mdx
Nidhi Kumari e72dfad21a
added AvatarAccount component (#15795)
* added AvatarAccount component

* updated avatar account component and README

* updated lint errors

* updated avatar account with types

* updated Jazzicon lint errors

* removed unused imports

* updated type prop and Blockie

* removed unused exports

* updated jazzicon styles

* fixed overflow in jazzicon

* updated avatar account component

* updated avatar account stories with types and size stories

* updated test for avatar account

* updated tests for avatar account

* Adding `TextFieldBase` component (#16043)

* Adding TextInputBase component

* Removing keyup and keydown props, tests and docs

* removing showClear from stories

* removing unneeded css

* simplifying uncontrolled vs controlled to work

* Fortifying maxLength test

* Lint fix for test

* Doc, style and prop updates

* Updating constant names with 'base'

* Adding a background color

* Adding a background color to input

* Adding ast-types to resolutions (#16103)

Co-authored-by: George Marshall <george.marshall@consensys.net>
2022-10-07 21:23:40 +05:30

43 lines
935 B
Plaintext

import { Story, Canvas, ArgsTable } from '@storybook/addon-docs';
import { AvatarAccount } from './avatar-account';
# AvatarAccount
The `AvatarAccount` is a type of avatar reserved for representing accounts.
<Canvas>
<Story id="ui-components-component-library-avatar-account-avatar-account-stories-js--default-story" />
</Canvas>
## Props
The `AvatarAccount` accepts all props below
<ArgsTable of={AvatarAccount} />
### Size
Use the `size` prop to set the size of the `AvatarAccount`.
Possible sizes include:
- `xs` 16px
- `sm` 24px
- `md` 32px
- `lg` 40px
- `xl` 48px
Defaults to `md`
<Canvas>
<Story id="ui-components-component-library-avatar-account-avatar-account-stories-js--size" />
</Canvas>
### type
Use the `type` prop for the avatar to be rendered, it can either be a Jazzicon or a Blockie
<Canvas>
<Story id="ui-components-component-library-avatar-account-avatar-account-stories-js--type" />
</Canvas>