fix(avatars): explicitly set box sizing for status indicator icon container

[Francois-Esquire]

Description

Fixes a visual bug when box-sizing computes to a value other than content-box for the StatusIndicator icon container element.

Detail

This fix also includes another fix to the StatusIndicator storybook pattern. It wraps the Avatar in an IconButton component.

Checklist

• 👌 design updates will be Garden Designer approved (add the designer as a reviewer)
• 🌐 demo is up-to-date (yarn start)
• ⬅️ renders as expected with reversed (RTL) direction
• 🤘 renders as expected with Bedrock CSS (?bedrock)
• 💂‍♂️ includes new unit tests. Maintain existing coverage (always >= 96%)
• ♿ tested for WCAG 2.1 AA accessibility compliance
• 📝 tested in Chrome, Firefox, Safari, and Edge

[geotrev]

LGTM. Is there any value in adding a test case? I'm not sure how you would test it - just curious if anything sticks out to you there.

[Francois-Esquire]

LGTM. Is there any value in adding a test case? I'm not sure how you would test it - just curious if anything sticks out to you there.

Good question! I don't think there is in this case. However with logic backed CSS, I would see the value in adding a test case.