feat: infobar: reflow to support small screens according to latest design spec

dkilgore-eightfold commented 3 months ago

SUMMARY:

Prior to this change, the optional action button did not reflow.

Updates SASS modules to reflow at breakpoints specified
Updates InfoBar padding to latest spec
Adds the following props to enable greater customization of InfoBar: actionButtonClassNames, contentClassNames, contentWrapperClassNames, iconClassNames
Updates Snackbar to implement the same reflow relative to its size.

https://github.com/EightfoldAI/octuple/assets/99700808/ffeb4c01-76a0-4e12-b927-10772b596b83

JIRA TASK (Eightfold Employees Only):

ENG-79502

CHANGE TYPE:

[ ] Bugfix Pull Request
[x] Feature Pull Request

TEST COVERAGE:

[x] Tests for this change already exist (Storybook)
[ ] I have added unittests for this change

TEST PLAN:

Pull the PR branch and run yarn and yarn storybook. Verify the InfoBar and Snackbar stories behave as expected.

codesandbox-ci[bot] commented 3 months ago

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

codecov[bot] commented 3 months ago

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 84.37%. Comparing base (bb17b93) to head (9b0dc11).

:exclamation: Current head 9b0dc11 differs from pull request most recent head fac8aa9. Consider uploading reports for the commit fac8aa9 to get more accurate results

Additional details and impacted files

```diff @@ Coverage Diff @@ ## main #798 +/- ## ========================================== - Coverage 84.38% 84.37% -0.02% ========================================== Files 1009 1009 Lines 19909 19896 -13 Branches 7546 7540 -6 ========================================== - Hits 16800 16787 -13 - Misses 3025 3026 +1 + Partials 84 83 -1 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

EightfoldAI / octuple