refactor(components): Update Avatar UI

[taylorvnoj]

Motivations

Updates the Avatar component with new default styling, hover behavior, and improved handling of custom color backgrounds for initials and the person icon.

Also adds e2e tests that didn't exist for Avatar yet

Changes

Changed

Default avatar (no color prop)

• Background uses interactive--subtle (replacing color-base-blue--600)
• Hover: interactive--subtle--hover for background, shadow-base for elevation
• Hover animation: timing-quick with ease-out on enter and ease-in on leave

Custom colors

• Dark backgrounds (e.g. black, navy): initials and icon use white for contrast
• Default avatar keeps textReverse for icon and color-text--reverse for initials

Typography

• Initials use --avatar-initials-size and typography--fontFamily-normal with size variants for large and small avatars

Known limitation
There are still some less than ideal configurations when using the color prop, however as discussed with design, initial text color and avatar color can be overwritten via UNSAFE_ props if needed.

Testing

https://www.figma.com/design/JLXvXViFbnYaoNEmAyP91K/Assigned-Avatar?m=dev&node-id=89-8506

Go to With Tooltip story.

• verify default Avatar (no color prop) uses text--reverse for initials, interactive--subtle for background color and interactive--subtle--hover for on hover.
• shadow is being used on hover (most visible in light mode)
• tooltip behaviour remains as is
• can tab to the Avatar and Tooltip will appear

Here's some examples of testing. First 2 rows are the new 'default'. interactive and black are to show the consistent white color regardless of theme.

---

In Atlantis we use Github's built in pull request reviews.

[cloudflare-workers-and-pages]

Deploying atlantis with    Cloudflare Pages

Latest commit:	311d67e
Status:	✅  Deploy successful!
Preview URL:	https://4f58de7d.atlantis.pages.dev
Branch Preview URL:	https://job-142335-job-151124-avatar-1nlr.atlantis.pages.dev

View logs

[github-actions]

Published Pre-release for c33c30b with versions:

  - @jobber/components@6.110.3-JOB-142335-c33c30b.4+c33c30baa

To install the new version(s) for Web run:

npm install @jobber/components@6.110.3-JOB-142335-c33c30b.4+c33c30baa

[MichaelParadis]

LGTM!
Thanks for adding the visual regression tests

[MichaelParadis]

LGTM!