Skip to content
This repository has been archived by the owner on May 24, 2024. It is now read-only.

Commit

Permalink
Merge remote-tracking branch 'origin/main' into folder-tree
Browse files Browse the repository at this point in the history
  • Loading branch information
@sycombs
sycombs committed Nov 16, 2023
2 parents 2faaa74 + 989a87d commit 270a959
Show file tree
Hide file tree
Showing 55 changed files with 504 additions and 120 deletions.
3 changes: 3 additions & 0 deletions packages/terra-data-grid/CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@

* Fixed
* Fixed issue where focus was given to the column header instead of its button element.

* Added
* Added `hasVisibleColumnHeaders` prop for FlowsheetDataGrid to toggle visibility of column headers.

## 1.1.0 - (November 9, 2023)

Expand Down
36 changes: 23 additions & 13 deletions packages/terra-data-grid/src/DataGrid.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,11 @@ const propTypes = {
* rendered to allow for row selection to occur.
*/
hasSelectableRows: PropTypes.bool,

/**
* Boolean indicating whether or not the DataGrid should hide the column headers.
*/
hasVisibleColumnHeaders: PropTypes.bool,
};

const defaultProps = {
Expand All @@ -136,29 +141,31 @@ const defaultProps = {
pinnedColumns: [],
overflowColumns: [],
rows: [],
hasVisibleColumnHeaders: true,
};

const DataGrid = injectIntl((props) => {
const {
id,
ariaLabelledBy,
ariaLabel,
rows,
pinnedColumns,
overflowColumns,
onColumnResize,
defaultColumnWidth,
ariaLabelledBy,
columnHeaderHeight,
columnResizeIncrement,
rowHeight,
onColumnSelect,
defaultColumnWidth,
hasVisibleColumnHeaders,
hasSelectableRows,
id,
onCellRangeSelect,
onCellSelect,
onClearSelection,
onColumnResize,
onColumnSelect,
onRangeSelection,
onRowSelectionHeaderSelect,
onCellRangeSelect,
hasSelectableRows,
overflowColumns,
pinnedColumns,
rowHeaderIndex,
rowHeight,
rows,
} = props;

const displayedColumns = (hasSelectableRows ? [WorklistDataGridUtils.ROW_SELECTION_COLUMN] : []).concat(pinnedColumns).concat(overflowColumns);
Expand All @@ -179,7 +186,9 @@ const DataGrid = injectIntl((props) => {
const handleFocus = useRef(true);

const [checkResizable, setCheckResizable] = useState(false);
const [focusedRow, setFocusedRow] = useState(0);

// if columns are not visible then set the first selectable row index to 1
const [focusedRow, setFocusedRow] = useState(hasVisibleColumnHeaders ? 0 : 1);
const [focusedCol, setFocusedCol] = useState(0);
const [gridHasFocus, setGridHasFocus] = useState(false);

Expand Down Expand Up @@ -455,7 +464,7 @@ const DataGrid = injectIntl((props) => {
event.preventDefault(); // prevent the page from moving with the arrow keys.
return;
}
if (nextCol < 0 || nextRow < 0) {
if (nextCol < 0 || nextRow < (hasVisibleColumnHeaders ? 0 : 1)) {
event.preventDefault(); // prevent the page from moving with the arrow keys.
return;
}
Expand Down Expand Up @@ -525,6 +534,7 @@ const DataGrid = injectIntl((props) => {
onCellSelect={handleCellSelection}
onRowSelectionHeaderSelect={handleRowSelectionHeaderSelect}
hasSelectableRows={hasSelectableRows}
hasVisibleColumnHeaders={hasVisibleColumnHeaders}
isStriped
/>
</GridContext.Provider>
Expand Down
8 changes: 8 additions & 0 deletions packages/terra-data-grid/src/FlowsheetDataGrid.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,11 @@ const propTypes = {
* The intl object containing translations. This is retrieved from the context automatically by injectIntl.
*/
intl: PropTypes.shape({ formatMessage: PropTypes.func }).isRequired,

/**
* Boolean to show/hide column headers. By default, it is set to `true` and column headers are visible.
*/
hasVisibleColumnHeaders: PropTypes.bool,
};

const defaultProps = {
Expand All @@ -90,6 +95,7 @@ const defaultProps = {
rowHeight: '2.5rem',
rows: [],
columns: [],
hasVisibleColumnHeaders: true,
};

function FlowsheetDataGrid(props) {
Expand All @@ -106,6 +112,7 @@ function FlowsheetDataGrid(props) {
onClearSelectedCells,
onCellRangeSelect,
intl,
hasVisibleColumnHeaders,
} = props;

const anchorCell = useRef(null);
Expand Down Expand Up @@ -295,6 +302,7 @@ function FlowsheetDataGrid(props) {
onCellSelect={handleCellSelection}
onClearSelection={handleClearSelectedCells}
onCellRangeSelect={handleCellRangeSelection}
hasVisibleColumnHeaders={hasVisibleColumnHeaders}
/>
<VisuallyHiddenText aria-live="polite" text={cellSelectionAriaLiveMessage} />
</div>
Expand Down
40 changes: 25 additions & 15 deletions packages/terra-data-grid/tests/jest/__snapshots__/DataGrid.test.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -160,6 +160,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -320,6 +321,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -488,6 +490,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
<InjectIntl(Table)
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
isActiveColumnResizing={false}
isStriped={true}
Expand Down Expand Up @@ -602,7 +605,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
<Table
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
intl={
Object {
Expand Down Expand Up @@ -808,7 +811,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
},
]
}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
headerHeight="2.5rem"
isActiveColumnResizing={false}
onColumnSelect={[Function]}
Expand All @@ -819,7 +822,6 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
>
<thead>
<tr
aria-rowindex={1}
className="column-header-row"
height="2.5rem"
>
Expand Down Expand Up @@ -3081,6 +3083,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -3241,6 +3244,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -3409,6 +3413,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
<InjectIntl(Table)
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
isActiveColumnResizing={false}
isStriped={true}
Expand Down Expand Up @@ -3523,7 +3528,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
<Table
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
intl={
Object {
Expand Down Expand Up @@ -3729,7 +3734,7 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
},
]
}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
headerHeight="2.5rem"
isActiveColumnResizing={false}
onColumnSelect={[Function]}
Expand All @@ -3740,7 +3745,6 @@ exports[`DataGrid verifies onCellSelect callback is triggered when space is pres
>
<thead>
<tr
aria-rowindex={1}
className="column-header-row"
height="2.5rem"
>
Expand Down Expand Up @@ -5994,6 +5998,7 @@ exports[`DataGrid verifies row selection column header selection 1`] = `
defaultColumnWidth={200}
focusFuncRef={null}
hasSelectableRows={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -6145,6 +6150,7 @@ exports[`DataGrid verifies row selection column header selection 1`] = `
defaultColumnWidth={200}
focusFuncRef={null}
hasSelectableRows={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -6304,6 +6310,7 @@ exports[`DataGrid verifies row selection column header selection 1`] = `
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasSelectableRows={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
isActiveColumnResizing={false}
isStriped={true}
Expand Down Expand Up @@ -6418,8 +6425,8 @@ exports[`DataGrid verifies row selection column header selection 1`] = `
<Table
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasColumnHeaders={true}
hasSelectableRows={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
intl={
Object {
Expand Down Expand Up @@ -6641,7 +6648,7 @@ exports[`DataGrid verifies row selection column header selection 1`] = `
},
]
}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
headerHeight="2.5rem"
isActiveColumnResizing={false}
onColumnSelect={[Function]}
Expand All @@ -6652,7 +6659,6 @@ exports[`DataGrid verifies row selection column header selection 1`] = `
>
<thead>
<tr
aria-rowindex={1}
className="column-header-row"
height="2.5rem"
>
Expand Down Expand Up @@ -9620,6 +9626,7 @@ exports[`DataGrid verifies that the grid created is consistent with the rows and
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -9757,6 +9764,7 @@ exports[`DataGrid verifies that the grid created is consistent with the rows and
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -9902,6 +9910,7 @@ exports[`DataGrid verifies that the grid created is consistent with the rows and
<InjectIntl(Table)
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
isActiveColumnResizing={false}
isStriped={true}
Expand Down Expand Up @@ -10016,7 +10025,7 @@ exports[`DataGrid verifies that the grid created is consistent with the rows and
<Table
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
intl={
Object {
Expand Down Expand Up @@ -10222,7 +10231,7 @@ exports[`DataGrid verifies that the grid created is consistent with the rows and
},
]
}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
headerHeight="2.5rem"
isActiveColumnResizing={false}
onColumnSelect={[Function]}
Expand All @@ -10233,7 +10242,6 @@ exports[`DataGrid verifies that the grid created is consistent with the rows and
>
<thead>
<tr
aria-rowindex={1}
className="column-header-row"
height="2.5rem"
>
Expand Down Expand Up @@ -12468,6 +12476,7 @@ exports[`DataGrid verifies the rows are created with the right props 1`] = `
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -12602,6 +12611,7 @@ exports[`DataGrid verifies the rows are created with the right props 1`] = `
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
focusFuncRef={null}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid"
intl={
Object {
Expand Down Expand Up @@ -12744,6 +12754,7 @@ exports[`DataGrid verifies the rows are created with the right props 1`] = `
<InjectIntl(Table)
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
isActiveColumnResizing={false}
isStriped={true}
Expand Down Expand Up @@ -12855,7 +12866,7 @@ exports[`DataGrid verifies the rows are created with the right props 1`] = `
<Table
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
id="test-terra-data-grid-table"
intl={
Object {
Expand Down Expand Up @@ -13058,7 +13069,7 @@ exports[`DataGrid verifies the rows are created with the right props 1`] = `
},
]
}
hasColumnHeaders={true}
hasVisibleColumnHeaders={true}
headerHeight="2.5rem"
isActiveColumnResizing={false}
onColumnSelect={[Function]}
Expand All @@ -13069,7 +13080,6 @@ exports[`DataGrid verifies the rows are created with the right props 1`] = `
>
<thead>
<tr
aria-rowindex={1}
className="column-header-row"
height="2.5rem"
>
Expand Down
2 changes: 2 additions & 0 deletions packages/terra-data-grid/tests/jest/__snapshots__/FlowsheetDataGrid.test.jsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ exports[`FlowsheetDataGrid renders the row header column as pinned and remaining
ariaLabel="Test Flowsheet Data Grid"
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasVisibleColumnHeaders={true}
id="test-terra-flowsheet-data-grid"
onCellRangeSelect={[Function]}
onCellSelect={[Function]}
Expand Down Expand Up @@ -130,6 +131,7 @@ exports[`FlowsheetDataGrid replaces non-header empty, null, or "--" cell content
ariaLabel="Test Flowsheet Data Grid"
columnHeaderHeight="2.5rem"
defaultColumnWidth={200}
hasVisibleColumnHeaders={true}
id="test-terra-flowsheet-data-grid"
onCellRangeSelect={[Function]}
onCellSelect={[Function]}
Expand Down
Loading

0 comments on commit 270a959

Please sign in to comment.