Johan Persson
539cf2690a
Removed Base UI dependency from Avatar component and reimplemented
with native HTML elements. Updated size scale with new x-small and
x-large options.
Breaking changes:
- Base UI-specific props (render, etc.) are no longer supported
- Component now uses native div/img elements instead of Base UI primitives
- Size scale updated: large changed from 3rem to 2.5rem
- Added x-small (1.25rem) and x-large (3rem) sizes
Migration:
- <Avatar src="..." name="..." render={...} />
+ <Avatar src="..." name="..." />
- <Avatar size="large" />
+ <Avatar size="x-large" />
New features:
- Added purpose prop with 'informative' (default) and 'decoration' options
- Informative avatars announce name to screen readers
- Decorative avatars hidden from screen readers (use when name appears adjacent)
- Five size options: x-small, small, medium, large, x-large
Documentation updates:
- Updated size examples to show all five sizes
- Added Purpose story and documentation
- Updated prop definitions and usage examples
- Updated changeset with migration guide for size changes
Signed-off-by: Johan Persson <johanopersson@gmail.com>
Backstage UI Docs
Backstage UI is our internal UI library built for Backstage. We built this website to document the library and its components. You can view this website here.
How to run locally
This website is built with Next.js and it is hosted on Github pages. To run it locally, you can run the following command:
yarn start
Deployment
Deployments are done automatically when a PR is merged into the master branch. We host the website using Github pages.