diff --git a/packages/patternfly-4/react-table/src/components/Table/Body.js b/packages/patternfly-4/react-table/src/components/Table/Body.js index 78e5dc79d05..cbadd6b59e7 100644 --- a/packages/patternfly-4/react-table/src/components/Table/Body.js +++ b/packages/patternfly-4/react-table/src/components/Table/Body.js @@ -54,7 +54,7 @@ class ContextBody extends React.Component { }) }, { id: oneRowKey }), - ...oneRow.parent ? { + ...oneRow.parent !== undefined ? { isExpanded: this.parentsExpanded(oneRow.parent) && rows[oneRow.parent].isOpen } : {}, } diff --git a/packages/patternfly-4/react-table/src/components/Table/ExpandableRowContent.js b/packages/patternfly-4/react-table/src/components/Table/ExpandableRowContent.js index 087a67853b7..522dc866964 100644 --- a/packages/patternfly-4/react-table/src/components/Table/ExpandableRowContent.js +++ b/packages/patternfly-4/react-table/src/components/Table/ExpandableRowContent.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { css } from '@patternfly/react-styles'; -import { tableExpandableRowContent } from '@patternfly/patternfly-next/components/Table/table.css'; +import styles from '@patternfly/patternfly-next/components/Table/table.css'; const propTypes = { children: PropTypes.node @@ -11,7 +11,7 @@ const defaultProps = { }; const ExpandableRowContent = ({ children, className, ...props }) => ( -
+
{children}
); diff --git a/packages/patternfly-4/react-table/src/components/Table/RowWrapper.js b/packages/patternfly-4/react-table/src/components/Table/RowWrapper.js index c6f04c2e2c9..9b39ca8245d 100644 --- a/packages/patternfly-4/react-table/src/components/Table/RowWrapper.js +++ b/packages/patternfly-4/react-table/src/components/Table/RowWrapper.js @@ -1,11 +1,11 @@ import React from 'react'; import PropsType from 'prop-types'; -import { tableExpandableRow, modifiers } from '@patternfly/patternfly-next/components/Table/table.css'; +import styles from '@patternfly/patternfly-next/components/Table/table.css'; import { css } from '@patternfly/react-styles'; const RowWrapper = ({ isOpen, isExpanded, ...props }) => { return ; }; diff --git a/packages/patternfly-4/react-table/src/components/Table/SelectColumn.js b/packages/patternfly-4/react-table/src/components/Table/SelectColumn.js index e3290b09d07..abbcac25f10 100644 --- a/packages/patternfly-4/react-table/src/components/Table/SelectColumn.js +++ b/packages/patternfly-4/react-table/src/components/Table/SelectColumn.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { css } from '@patternfly/react-styles'; -import { checkInput } from '@patternfly/patternfly-next/components/Check/check.css'; +import styles from '@patternfly/patternfly-next/components/Check/check.css'; const propTypes = { children: PropTypes.node, @@ -16,7 +16,7 @@ const defaultProps = { const SelectColumn = ({ children, className, onSelect, ...props }) => ( - + {children} ); diff --git a/packages/patternfly-4/react-table/src/components/Table/SortColumn.js b/packages/patternfly-4/react-table/src/components/Table/SortColumn.js index 76215cb1dc0..21ab54d6aef 100644 --- a/packages/patternfly-4/react-table/src/components/Table/SortColumn.js +++ b/packages/patternfly-4/react-table/src/components/Table/SortColumn.js @@ -2,7 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { AngleUpIcon, SortIcon } from '@patternfly/react-icons'; import { css } from '@patternfly/react-styles'; -import { tableSortIndicator } from '@patternfly/patternfly-next/components/Table/table.css'; +import styles from '@patternfly/patternfly-next/components/Table/table.css'; const propTypes = { children: PropTypes.node, @@ -27,7 +27,7 @@ const SortColumn = ({ isSortedBy, children, className, onSort, ...props }) => { return ( diff --git a/packages/patternfly-4/react-table/src/components/Table/Table.js b/packages/patternfly-4/react-table/src/components/Table/Table.js index de3a512d99d..1c7fe215c46 100644 --- a/packages/patternfly-4/react-table/src/components/Table/Table.js +++ b/packages/patternfly-4/react-table/src/components/Table/Table.js @@ -52,6 +52,7 @@ const propTypes = { cells: PropTypes.arrayOf(PropTypes.node), isOpen: PropTypes.bool, parent: PropTypes.number, + showSelect: PropTypes.bool, props: PropTypes.any }), PropTypes.arrayOf(PropTypes.oneOfType([ diff --git a/packages/patternfly-4/react-table/src/components/Table/__snapshots__/Table.test.js.snap b/packages/patternfly-4/react-table/src/components/Table/__snapshots__/Table.test.js.snap index c3ffe45f610..3ebc89f8b1a 100644 --- a/packages/patternfly-4/react-table/src/components/Table/__snapshots__/Table.test.js.snap +++ b/packages/patternfly-4/react-table/src/components/Table/__snapshots__/Table.test.js.snap @@ -11636,6 +11636,12 @@ exports[`Collapsible nested table 1`] = ` border-top-color: transparent; border-top-width: 0; } +.pf-c-table__expandable-row { + display: block; + position: relative; + border-bottom: 0 solid transparent; + box-shadow: 0 0 0 0 transparent; +} .pf-c-table__toggle { display: block; } @@ -12864,6 +12870,7 @@ exports[`Collapsible nested table 1`] = ` "title": "one", }, "id": 1, + "isExpanded": false, "isOpen": true, "last-commit": Object { "props": undefined, @@ -13777,6 +13784,7 @@ exports[`Collapsible nested table 1`] = ` "title": "one", }, "id": 1, + "isExpanded": false, "isOpen": true, "last-commit": Object { "props": undefined, @@ -13797,12 +13805,13 @@ exports[`Collapsible nested table 1`] = ` rowKey="1-row" > @@ -21434,6 +21454,12 @@ exports[`Header width table 1`] = ` border-bottom: 0 solid transparent; box-shadow: 0 0 0 0 transparent; } +.pf-c-table__expandable-row { + display: block; + position: relative; + border-bottom: 0 solid transparent; + box-shadow: 0 0 0 0 transparent; +} .pf-c-table.pf-m-grid-md { display: block; width: 100%; @@ -22408,6 +22434,7 @@ exports[`Header width table 1`] = ` "title": "one", }, "id": 1, + "isExpanded": false, "isOpen": true, "last-commit": Object { "props": undefined, @@ -23164,6 +23191,7 @@ exports[`Header width table 1`] = ` "title": "one", }, "id": 1, + "isExpanded": false, "isOpen": true, "last-commit": Object { "props": undefined, @@ -23184,12 +23212,13 @@ exports[`Header width table 1`] = ` rowKey="1-row" > - - - - + /> - - - - + /> - - - - + /> { @@ -10,7 +10,7 @@ export default (actions) => { extraParams: { dropdownPosition, dropdownDirection } } }) => ({ - className: css(tableAction), + className: css(styles.tableAction), children: { + if (rowData && rowData.hasOwnProperty('parent') && !rowData.showSelect) { + return { + component: 'td', + scope: '' + } + } const rowId = rowIndex !== undefined ? rowIndex : -1; function selectClick(event) { let selected = rowIndex === undefined ? event.target.checked : rowData && !rowData.selected; @@ -19,7 +25,7 @@ export default (label, { column: { extraParams: { onSelect, rowLabeledBy = 'simp } return ({ - className: css(tableCheck), + className: css(styles.tableCheck), component: 'td', scope: '', children: ( diff --git a/packages/patternfly-4/react-table/src/components/Table/utils/decorators/sortable.js b/packages/patternfly-4/react-table/src/components/Table/utils/decorators/sortable.js index cba06e5ae76..3be3e1b5392 100644 --- a/packages/patternfly-4/react-table/src/components/Table/utils/decorators/sortable.js +++ b/packages/patternfly-4/react-table/src/components/Table/utils/decorators/sortable.js @@ -1,11 +1,13 @@ import React from 'react'; import SortColumn, { SortByDirection } from '../../SortColumn'; import { css } from '@patternfly/react-styles'; -import { tableSort, modifiers } from '@patternfly/patternfly-next/components/Table/table.css'; +import styles from '@patternfly/patternfly-next/components/Table/table.css'; export default (label, { column: { extraParams: { sortBy, onSort } }, columnIndex }) => { const isSortedBy = sortBy && columnIndex === sortBy.index; - const direction = sortBy && sortBy.direction === SortByDirection.asc ? modifiers.ascending : modifiers.descending; + const direction = sortBy && sortBy.direction === SortByDirection.asc ? + styles.modifiers.ascending : + styles.modifiers.descending; function sortClicked(event) { let reversedDirection; if (!isSortedBy) { @@ -17,7 +19,7 @@ export default (label, { column: { extraParams: { sortBy, onSort } }, columnInde } return ({ - className: css(tableSort, isSortedBy && direction), + className: css(styles.tableSort, isSortedBy && direction), 'aria-sort': isSortedBy ? `${sortBy.direction}ending` : 'none', children: (