feat(table): added frozen header, frozen column, permanent scrollbars

[ArtBlue]

Fixes #2457

• This PR contains CSS changes
• This PR does not contain CSS changes

Description

Added the next set of features to table:

• added frozen header
• added full height table modifier
• added frozen column
• added full height table override
• added permanent scrollbars

Notes

For the permanent scrollbars, I created a utility mixin to be used by a public utility class as well as intrinsically for table without the use of the utility class.

Screenshots

Checklist

• I verify the build is in a non-broken state
• I verify all changes are within scope of the linked issue

• I regenerated all CSS files under dist folder
• I tested the UI in all supported browsers
• I did a visual regression check of the components impacted by doing a Percy build and approved the build
• I tested the UI in dark mode and RTL mode
• I added/updated/removed Storybook coverage as appropriate

[changeset-bot]

🦋 Changeset detected

Latest commit: cc37971

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

This PR includes changesets to release 1 package

Name	Type
@ebay/skin	Minor

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

[agliga]

LGTM!

[bill-min]

LGTM, just the freeze-column count feels a bit weird to me. Unless we have usage that ppl are using skin standalone and building bare foot table without wrapping it with component, I think it would be more flexible just add class to tr > td,th and ebayui/table will expose column count then apply to each tr > td,th.

[ArtBlue]

LGTM, just the freeze-column count feels a bit weird to me. Unless we have usage that ppl are using skin standalone and building bare foot table without wrapping it with component, I think it would be more flexible just add class to tr > td,th and ebayui/table will expose column count then apply to each tr > td,th.

Our strategy is typically to lean on static implementation of features without requiring major work from external libraries, and the smallest footprint to accomplish the goal. This makes it more optimal.

1. It allows the css module to work anywhere. Since we are an open-source library, we always want to lean on that.
2. It is far less brittle. If a user forgets to add the the marker to any td or th, the table will break.
3. It is more efficient as fewer changes/updates need to be made on fewer elements.

BTW, the column freezing is not a column count like you see on typical spreadsheets. It freezes only a specific column to avoid the table being unusable in smaller screens.