diff --git a/package-lock.json b/package-lock.json
index 5a0b5478483..66f130f6989 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -39396,6 +39396,10 @@
"resolved": "packages/terra-collapsible-menu-view",
"link": true
},
+ "node_modules/terra-compact-interactive-list": {
+ "resolved": "packages/terra-compact-interactive-list",
+ "link": true
+ },
"node_modules/terra-content-container": {
"version": "3.39.1",
"resolved": "https://registry.npmjs.org/terra-content-container/-/terra-content-container-3.39.1.tgz",
@@ -43243,6 +43247,21 @@
"react-intl": ">=2.8.0, <6.0.0"
}
},
+ "packages/terra-compact-interactive-list": {
+ "version": "0.1.0",
+ "license": "Apache-2.0",
+ "dependencies": {
+ "classnames": "^2.2.5",
+ "keycode-js": "^3.1.0",
+ "prop-types": "^15.5.8",
+ "terra-theme-context": "^1.0.0"
+ },
+ "peerDependencies": {
+ "react": "^16.8.5",
+ "react-dom": "^16.8.5",
+ "react-intl": "2 || 3 || 4 || 5"
+ }
+ },
"packages/terra-data-grid": {
"version": "1.0.0",
"license": "Apache-2.0",
@@ -43478,6 +43497,7 @@
"terra-brand-footer": "^3.11.0",
"terra-button": "^3.3.0",
"terra-collapsible-menu-view": "^6.83.0",
+ "terra-compact-interactive-list": "^0.1.0",
"terra-content-container": "^3.0.0",
"terra-data-grid": "^1.0.0",
"terra-date-input": "^1.46.0",
diff --git a/packages/terra-table/CHANGELOG.md b/packages/terra-table/CHANGELOG.md
index 39e98a7aa54..407c73315e4 100644
--- a/packages/terra-table/CHANGELOG.md
+++ b/packages/terra-table/CHANGELOG.md
@@ -8,6 +8,7 @@
* Fixed
* Fixed the column header background color for the Orion Fusion theme.
+ * Fixed issue where column header cell was receiving tab focus instead of the button for table role.
## 5.1.1-alpha.0 - (October 25, 2023)
diff --git a/packages/terra-table/src/subcomponents/ColumnHeaderCell.jsx b/packages/terra-table/src/subcomponents/ColumnHeaderCell.jsx
index 28b34a1c539..e9157ef4283 100644
--- a/packages/terra-table/src/subcomponents/ColumnHeaderCell.jsx
+++ b/packages/terra-table/src/subcomponents/ColumnHeaderCell.jsx
@@ -181,11 +181,6 @@ const ColumnHeaderCell = (props) => {
)
: null;
- let tabIndex = isSelectable ? 0 : undefined;
- if (isGridContext) {
- tabIndex = -1;
- }
-
return (
/* eslint-disable react/forbid-dom-props */
{
selectable: isSelectable,
pinned: columnIndex < columnContext.pinnedColumnOffsets.length,
})}
- tabIndex={tabIndex}
+ tabIndex={isGridContext ? -1 : undefined}
role="columnheader"
scope="col"
aria-sort={sortIndicator}
@@ -204,7 +199,11 @@ const ColumnHeaderCell = (props) => {
// eslint-disable-next-line react/forbid-dom-props
style={{ height: headerHeight, left: cellLeftEdge }}
>
-
+
{errorIcon}
{displayName}
{sortIndicatorIcon}
diff --git a/packages/terra-table/tests/jest/ColumnHeaderCell.test.jsx b/packages/terra-table/tests/jest/ColumnHeaderCell.test.jsx
index 1ce344338b8..4b4a2dcf541 100644
--- a/packages/terra-table/tests/jest/ColumnHeaderCell.test.jsx
+++ b/packages/terra-table/tests/jest/ColumnHeaderCell.test.jsx
@@ -209,12 +209,13 @@ describe('ColumnHeaderCell', () => {
expect(columnHeader.key()).toBe('Column-0');
expect(columnHeader.props().role).toBe('columnheader');
expect(columnHeader.props().scope).toBe('col');
- expect(columnHeader.props().tabIndex).toEqual(0);
+ expect(columnHeader.props().tabIndex).toBeUndefined();
expect(columnHeader.props()['aria-sort']).toBe('ascending');
expect(columnHeader.props().onMouseDown).toBeDefined();
expect(columnHeader.props().style.height).toBe('150px');
const headerContainer = columnHeader.find('.header-container[role="button"]');
+ expect(headerContainer.props().tabIndex).toBe(0);
expect(headerContainer.find('span').text().trim()).toBe('Vitals');
expect(headerContainer.find(IconUp)).toHaveLength(1);
expect(headerContainer.find(IconError)).toHaveLength(1);
@@ -256,6 +257,7 @@ describe('ColumnHeaderCell', () => {
expect(columnHeader.props().style.height).toBe('150px');
const headerContainer = columnHeader.find('.header-container[role="button"]');
+ expect(headerContainer.props().tabIndex).toBeUndefined();
expect(headerContainer.find('span').text().trim()).toBe('Vitals');
expect(headerContainer.find(IconUp)).toHaveLength(1);
expect(headerContainer.find(IconError)).toHaveLength(1);
diff --git a/packages/terra-table/tests/jest/__snapshots__/ColumnHeaderCell.test.jsx.snap b/packages/terra-table/tests/jest/__snapshots__/ColumnHeaderCell.test.jsx.snap
index c757854ca32..809d9012a37 100644
--- a/packages/terra-table/tests/jest/__snapshots__/ColumnHeaderCell.test.jsx.snap
+++ b/packages/terra-table/tests/jest/__snapshots__/ColumnHeaderCell.test.jsx.snap
@@ -141,11 +141,11 @@ exports[`ColumnHeaderCell renders a column header cell with onColumnSelect callb
"left": null,
}
}
- tabIndex={0}
>
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/row-selection-header-selectable.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/row-selection-header-selectable.png
index 65e8948cccf..22040691305 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/row-selection-header-selectable.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/row-selection-header-selectable.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-focused-header.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-focused-header.png
index f0d5d81a158..7d1ccc3022a 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-focused-header.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-focused-header.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-keyboard.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-keyboard.png
index 5ace8e4ca02..56e0534e394 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-keyboard.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table-keyboard.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table.png
deleted file mode 100644
index fff25f1ff68..00000000000
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_large/table-spec/sortable-table.png and /dev/null differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png
index 65e8948cccf..22040691305 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png
index f0d5d81a158..7d1ccc3022a 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png
index 5ace8e4ca02..56e0534e394 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table.png b/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table.png
deleted file mode 100644
index fff25f1ff68..00000000000
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/clinical-lowlight-theme/en/chrome_medium/table-spec/sortable-table.png and /dev/null differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/row-selection-header-selectable.png b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/row-selection-header-selectable.png
index 4a27c02ea5a..a9224b14e84 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/row-selection-header-selectable.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/row-selection-header-selectable.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-focused-header.png b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-focused-header.png
index 1bfbddd0ea5..c37e5af81de 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-focused-header.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-focused-header.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-keyboard.png b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-keyboard.png
index f210707966c..d6c006c9592 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-keyboard.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_large/table-spec/sortable-table-keyboard.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png
index 4a27c02ea5a..a9224b14e84 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png
index 1bfbddd0ea5..c37e5af81de 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png
index f210707966c..d6c006c9592 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/orion-fusion-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/row-selection-header-selectable.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/row-selection-header-selectable.png
index 757f9d44fc3..5e4d7627d4d 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/row-selection-header-selectable.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/row-selection-header-selectable.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-focused-header.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-focused-header.png
index fa65c25d997..6b6fd1b55a8 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-focused-header.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-focused-header.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-keyboard.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-keyboard.png
index be41f746cd9..c50fa08a022 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-keyboard.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table-keyboard.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table.png
deleted file mode 100644
index 8a1d39f11be..00000000000
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_large/table-spec/sortable-table.png and /dev/null differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png
index 757f9d44fc3..5e4d7627d4d 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/row-selection-header-selectable.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png
index fa65c25d997..6b6fd1b55a8 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-focused-header.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png
index be41f746cd9..c50fa08a022 100644
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png and b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table-keyboard.png differ
diff --git a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table.png b/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table.png
deleted file mode 100644
index 8a1d39f11be..00000000000
Binary files a/packages/terra-table/tests/wdio/__snapshots__/reference/terra-default-theme/en/chrome_medium/table-spec/sortable-table.png and /dev/null differ
|