fix(Tag): Update tag focus state

[silvalaura]

Issue: none

What I did

I noticed that clickable and deletable tags had been accidentally updated to have the offset of -1, so I updated them to have the correct 2px offset, and also to use the correct focus color. While I was there, I updated the stories on storybook to be less repetitive and added unit tests.

Screenshots:

Before:

After:

Checklist

• [X] changeset has been added
• [X] Pull request description is descriptive
• [-] I have made corresponding changes to the documentation
• [X] New and existing unit tests pass locally with my changes
• [X] I have added tests that prove my fix is effective or that my feature works

How to test

Navigate to storybook and ensure that clickable tags have the expected focus state for both isInverse and default. Also ensure the other tags don't get a focus state.

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: 40ea73b750f820e1c273cd004d207be477eaf741

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

| Name | Type | | --------------- | ----- | | react-magma-dom | Patch |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions[bot]]

🚀 Deployed on https://docs-preview-1582--upbeat-sinoussi-f675aa.netlify.app

[github-actions[bot]]

🚀 Deployed on https://storybook-preview-1582--upbeat-sinoussi-f675aa.netlify.app

[nikitaorliak-cengage]

Cases that have been tested:

• Validate styles for basic Tag;
• Validate styles for Tag with the isInverse prop;
• Delete one element and create it again, then check the styles;
• Check all previous cases with a screen reader.