From 186a8ada2ddf5665a917b8bd8e79dcf831d152a5 Mon Sep 17 00:00:00 2001 From: Akira Sudoh Date: Thu, 16 Jan 2020 14:28:37 +0900 Subject: [PATCH 1/2] feat(DataTable): allow additional contents to expand cells This change adds `children` prop support to ``. This provides applications with more control so application can better describe the expand cell. Fixes #5028. --- packages/react/src/components/DataTable/TableExpandHeader.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/react/src/components/DataTable/TableExpandHeader.js b/packages/react/src/components/DataTable/TableExpandHeader.js index f28a8f8c969f..31afd1f24df4 100644 --- a/packages/react/src/components/DataTable/TableExpandHeader.js +++ b/packages/react/src/components/DataTable/TableExpandHeader.js @@ -19,6 +19,7 @@ const TableExpandHeader = ({ isExpanded, onExpand, expandIconDescription, + children, ...rest }) => { const className = cx(`${prefix}--table-expand`, headerClassName); @@ -42,6 +43,7 @@ const TableExpandHeader = ({ /> )} + {children} ); }; From 33d225dffc43b4bbfe031980d1f565a7f04fd5e3 Mon Sep 17 00:00:00 2001 From: Akira Sudoh Date: Fri, 17 Jan 2020 14:21:12 +0900 Subject: [PATCH 2/2] chore(TableExpandHeader): add prop types --- .../components/DataTable/TableExpandHeader.js | 28 +++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/packages/react/src/components/DataTable/TableExpandHeader.js b/packages/react/src/components/DataTable/TableExpandHeader.js index 31afd1f24df4..e8228cd6e288 100644 --- a/packages/react/src/components/DataTable/TableExpandHeader.js +++ b/packages/react/src/components/DataTable/TableExpandHeader.js @@ -6,6 +6,7 @@ */ import cx from 'classnames'; +import PropTypes from 'prop-types'; import React from 'react'; import { ChevronRight16 } from '@carbon/icons-react'; import { settings } from 'carbon-components'; @@ -48,4 +49,31 @@ const TableExpandHeader = ({ ); }; +TableExpandHeader.propTypes = { + className: PropTypes.string, + children: PropTypes.node, + + /** + * Specify the string read by a voice reader when the expand trigger is + * focused + */ + ariaLabel: PropTypes.string.isRequired, + + /** + * Specify whether this row is expanded or not. This helps coordinate data + * attributes so that `TableExpandRow` and `TableExapndedRow` work together + */ + isExpanded: PropTypes.bool.isRequired, + + /** + * Hook for when a listener initiates a request to expand the given row + */ + onExpand: PropTypes.func.isRequired, + + /** + * The description of the chevron right icon, to be put in its SVG `` element. + */ + expandIconDescription: PropTypes.string, +}; + export default TableExpandHeader;