Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(react): add horizontal overflow to Tabs in v11 #10799

Merged
merged 28 commits into from
Mar 2, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
bbf5391
chore: check in progress
abbeyhrt Jan 25, 2022
3f1fca9
chore: check in progress
abbeyhrt Jan 26, 2022
eb28149
Merge branch 'main' of github.com:carbon-design-system/carbon into fe…
abbeyhrt Jan 28, 2022
05401b7
chore: check in progress
abbeyhrt Feb 3, 2022
a6b6a13
chore: check in progress
abbeyhrt Feb 7, 2022
959090b
chore: check in progress
abbeyhrt Feb 7, 2022
7b6d095
feat(react): add horizontal overflow to tabs
abbeyhrt Feb 10, 2022
4d03e3b
fix(react): adjust styles
abbeyhrt Feb 11, 2022
0f9c4a6
feat(react): add horizontal overflow to tabs
abbeyhrt Feb 18, 2022
604113f
chore(react): remove extraneous changes
abbeyhrt Feb 18, 2022
ec44742
chore(react): remove extraneous changes
abbeyhrt Feb 18, 2022
b0209e7
Merge branch 'main' into feat/horizontal-overflow-tabs
abbeyhrt Feb 18, 2022
e678697
fix(react): update snapshots and failing test
abbeyhrt Feb 21, 2022
bfd3f37
Merge branch 'main' of github.com:carbon-design-system/carbon into fe…
abbeyhrt Feb 21, 2022
ba3c7d1
Merge branch 'feat/horizontal-overflow-tabs' of github.com:abbeyhrt/m…
abbeyhrt Feb 21, 2022
4c67e85
fix(react): replace use layout with use isomorphic
abbeyhrt Feb 24, 2022
0788707
fix(react): fix incorrect import
abbeyhrt Feb 24, 2022
3ec218c
Merge branch 'main' into feat/horizontal-overflow-tabs
tay1orjones Feb 25, 2022
c53b9c1
fix(react): scroll tab into view when clicked
abbeyhrt Mar 1, 2022
b263b2c
fix(react): scroll tab into view when clicked
abbeyhrt Mar 1, 2022
d69151d
Merge branch 'feat/horizontal-overflow-tabs' of github.com:abbeyhrt/m…
abbeyhrt Mar 1, 2022
fe430fe
feat(tabs): update scroll position on click
joshblack Mar 1, 2022
50d36d0
fix(tabs): update usePressable and fix interop with long press
joshblack Mar 2, 2022
d710843
fix(tabs): update animation mechanism and fix safari text selection i…
joshblack Mar 2, 2022
1cf9094
fix(tabs): add will-change: scroll-position
joshblack Mar 2, 2022
5780010
chore(tabs): remove extra comments on usePressable
joshblack Mar 2, 2022
0a4b069
fix(react): adjust next button visible and remove transparent keyowrd
abbeyhrt Mar 2, 2022
bb8932c
Merge branch 'main' into feat/horizontal-overflow-tabs
abbeyhrt Mar 2, 2022
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -8767,9 +8767,18 @@ Map {
],
"type": "oneOf",
},
"leftOverflowButtonProps": Object {
"type": "object",
},
"light": Object {
"type": "bool",
},
"rightOverflowButtonProps": Object {
"type": "object",
},
"scrollDebounceWait": Object {
"type": "number",
},
"scrollIntoView": Object {
"type": "bool",
},
Expand Down
2 changes: 1 addition & 1 deletion packages/react/src/components/Tabs/Tabs.js
Original file line number Diff line number Diff line change
Expand Up @@ -390,7 +390,7 @@ export default class Tabs extends React.Component {
};

handleOverflowNavMouseDown = (event, { direction }) => {
// disregard mouse buttons aside from LMB
// disregard mouse buttons aside from left mouse button
if (event.buttons !== 1) {
return;
}
Expand Down
9 changes: 6 additions & 3 deletions packages/react/src/components/Tabs/next/Tabs-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,12 @@ describe('Tabs', () => {
});

it('should set a className from props on outermost element in TabList', () => {
render(
const { container } = render(
<Tabs>
<TabList aria-label="List of tabs" className="custom-class">
<TabList
aria-label="List of tabs"
className="custom-class"
data-test-id="test-id">
<Tab disabled>Tab Label 1</Tab>
<Tab>Tab Label 2</Tab>
<Tab>Tab Label 3</Tab>
Expand All @@ -42,7 +45,7 @@ describe('Tabs', () => {
</Tabs>
);

expect(screen.getByRole('tablist')).toHaveClass('custom-class');
expect(container.firstChild).toHaveClass('custom-class');
});
});

Expand Down
Loading