Fix/18885 migrate avatar token

[thebinij]

Explanation

• Closes Migrate components to TS: AvatarToken #18885

Screenshots/Screencaps

Before

before.mp4

After

after.mp4

Manual Testing Steps

No functional changes

Pre-merge author checklist

• I've clearly explained:
  • What problem this PR is solving
• Sufficient automated test coverage has been added

Pre-merge reviewer checklist

• Manual testing (e.g. pull and build branch, run in browser, test code being changed)
• PR is linked to the appropriate GitHub issue
• IF this PR fixes a bug in the release milestone, add this PR to the release milestone

If further QA is required (e.g. new feature, complex testing steps, large refactor), add the Extension QA Board label.

In this case, a QA Engineer approval will be be required.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[georgewrmarshall]

Hey @thebinij, I've checked out your branch and tried a few things to get the types to work but I can't seem to find a reliable pattern. I think for now we just make AvatarBaseProps accept all variant size types as a union type for now and update it in the future once we find a scalable pattern to use.

[codecov]

Codecov Report

Merging #19080 (7c476f1) into develop (d6cb724) will decrease coverage by 0.01%.
Report is 2 commits behind head on develop.
The diff coverage is 95.65%.

@@             Coverage Diff             @@
##           develop   #19080      +/-   ##
===========================================
- Coverage    69.46%   69.45%   -0.01%     
===========================================
  Files          983      982       -1     
  Lines        37299    37297       -2     
  Branches     10025    10026       +1     
===========================================
- Hits         25908    25904       -4     
- Misses       11391    11393       +2     

Files Changed	Coverage Δ
...ts/component-library/avatar-token/avatar-token.tsx	95.65% <95.65%> (ø)

... and 2 files with indirect coverage changes

[georgewrmarshall]

Hey @thebinij, Thanks for your time and effort in creating this pull request. As you're probably aware we have identified an issue related to the typing of the Box component, specifically with the polymorphic as prop. To address this issue, we have an open ticket at #19239 and a draft pull request at #19363 that needs to be merged before we can proceed with your PR. Thanks for your patience

[garrettbear]

@georgewrmarshall double-check that this is the right solution.

Before

After

[georgewrmarshall]

I think this makes sense to my limited TypeScript knowledged brain. We are adjusting the types at the same level we are increasing the specificity of the component. We can omit the children prop because we are supplying the children using the <img /> element or fallbackString I think it makes more sense that making children optional on the AvatarBase level

[garrettbear]

ButtonLink lint error that is probably coming from the ButtonBase update and hopefully will be fixed when converting ButtonLink to TS.

[georgewrmarshall]

Looks alll G to ME! Thanks for your contribution @thebinij and for supporting @garrettbear 💯

[georgewrmarshall]

ButtonLink lint error that is probably coming from the ButtonBase update and hopefully will be fixed when converting ButtonLink to TS.

Looks like we are safe for the most part as the only use in tsx files are in stories which are ignored from the linter. I think we can prioritize buttons next