MetaMask / MetaMask/metamask-design-system
[Docs] Avatar family migration documentation (7 components)
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 37
- Forks
- 14
- Avg merge
- 1d 9h
- Merged PRs (30d)
- 60
Description
## Summary
Add migration documentation for the Avatar component family (7 components) that have been migrated from Extension/Mobile to MMDS.
## Components
- AvatarBase
- AvatarIcon
- AvatarAccount
- AvatarNetwork
- AvatarToken
- AvatarFavicon
- AvatarGroup
## Definition of Done
### 1. MIGRATION.md Sections
Add migration sections with API maps to:
- `packages/design-system-react/MIGRATION.md`
- `packages/design-system-react-native/MIGRATION.md`
Include:
- Breaking changes between Extension/Mobile and MMDS
- Prop mapping tables
- Before/after code examples
### 2. README Links
Add migration section to each component's README.mdx:
- Link to relevant MIGRATION.md section
### 3. @deprecated Updates
Add migration links to JSDoc in:
- Extension: `ui/components/component-library/avatar*`
- Mobile: `app/component-library/components/Avatar*`
## Example Reference
Text component migration: https://github.com/MetaMask/metamask-design-system/blob/main/packages/design-system-react/MIGRATION.md#text-component
## Labels
documentation
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Text component migration section in packages/design-system-react/MIGRATION.md, then inspect the React and React Native Avatar README.mdx files and the listed Extension and Mobile component paths. Document all seven Avatar components in both MIGRATION.md files, link each README and deprecated JSDoc entry, and verify that the API maps, breaking changes, and before/after examples are complete.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, react-native, typescript
- Domain
- documentation
- Issue type
- Documentation
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 62/100