From 7ea912b2c1c04238f9a37364e85fdd10fdb4936d Mon Sep 17 00:00:00 2001 From: Ahmed Alsinan Date: Wed, 21 Aug 2024 18:58:27 +0300 Subject: [PATCH] fix(DataTable): type issues (#17199) --- .../__snapshots__/PublicAPI-test.js.snap | 6 --- .../src/components/DataTable/DataTable.tsx | 42 +++++++++++-------- .../components/DataTable/TableExpandRow.tsx | 4 +- .../components/DataTable/TableSelectAll.tsx | 4 +- .../components/DataTable/TableSelectRow.tsx | 4 +- 5 files changed, 30 insertions(+), 30 deletions(-) diff --git a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap index 5df7774eaf2e..c01834ff4f62 100644 --- a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap +++ b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap @@ -2069,7 +2069,6 @@ Map { "type": "string", }, "isExpanded": Object { - "isRequired": true, "type": "bool", }, "isSelected": Object { @@ -2167,7 +2166,6 @@ Map { }, "ariaLabel": [Function], "checked": Object { - "isRequired": true, "type": "bool", }, "className": Object { @@ -2200,7 +2198,6 @@ Map { }, "ariaLabel": [Function], "checked": Object { - "isRequired": true, "type": "bool", }, "className": Object { @@ -8115,7 +8112,6 @@ Map { "type": "string", }, "isExpanded": Object { - "isRequired": true, "type": "bool", }, "isSelected": Object { @@ -8213,7 +8209,6 @@ Map { }, "ariaLabel": [Function], "checked": Object { - "isRequired": true, "type": "bool", }, "className": Object { @@ -8246,7 +8241,6 @@ Map { }, "ariaLabel": [Function], "checked": Object { - "isRequired": true, "type": "bool", }, "className": Object { diff --git a/packages/react/src/components/DataTable/DataTable.tsx b/packages/react/src/components/DataTable/DataTable.tsx index 6cf3a59582b3..d20f9a3f6ebf 100644 --- a/packages/react/src/components/DataTable/DataTable.tsx +++ b/packages/react/src/components/DataTable/DataTable.tsx @@ -110,7 +110,7 @@ export interface DataTableRenderProps { header: DataTableHeader; isSortable?: boolean; onClick?: ( - e: React.MouseEvent, + e: React.MouseEvent, sortState: { sortHeaderKey: string; sortDirection: DataTableSortState } ) => void; [key: string]: unknown; @@ -118,23 +118,26 @@ export interface DataTableRenderProps { isSortable: boolean | undefined; isSortHeader: boolean; key: string; - onClick: (e: MouseEvent) => void; + onClick: (e: React.MouseEvent) => void; sortDirection: DataTableSortState; [key: string]: unknown; }; getExpandHeaderProps: (getExpandHeaderPropsArgs?: { - onClick?: (e: MouseEvent, expandState: { isExpanded?: boolean }) => void; - onExpand?: (e: MouseEvent) => void; + onClick?: ( + e: React.MouseEvent, + expandState: { isExpanded?: boolean } + ) => void; + onExpand?: (e: React.MouseEvent) => void; [key: string]: unknown; }) => { ariaLabel: string; // TODO Remove in v12 ['aria-label']: string; isExpanded: boolean; - onExpand: (e: MouseEvent) => void; + onExpand: (e: React.MouseEvent) => void; [key: string]: unknown; }; getRowProps: (getRowPropsArgs: { - onClick?: (e: MouseEvent) => void; + onClick?: (e: React.MouseEvent) => void; row: DataTableRow; [key: string]: unknown; }) => { @@ -144,7 +147,7 @@ export interface DataTableRenderProps { isExpanded?: boolean; isSelected?: boolean; key: string; - onExpand: (e: MouseEvent) => void; + onExpand: (e: React.MouseEvent) => void; [key: string]: unknown; }; getExpandedRowProps: (getExpandedRowPropsArgs: { @@ -154,20 +157,20 @@ export interface DataTableRenderProps { ['id']: string; [key: string]: unknown; }; - getSelectionProps: (getSelectionPropsArgs: { - onClick?: (e: MouseEvent) => void; + getSelectionProps: (getSelectionPropsArgs?: { + onClick?: (e: React.MouseEvent) => void; row: DataTableRow; [key: string]: unknown; }) => { ariaLabel: string; 'aria-label': string; - checked: boolean | undefined; + checked?: boolean; disabled?: boolean | undefined; id: string; indeterminate?: boolean; name: string; - onSelect: (e: MouseEvent) => void; - radio?: boolean | null; + onSelect: (e: React.MouseEvent) => void; + radio?: boolean; [key: string]: unknown; }; getToolbarProps: (getToolbarPropsArgs?: { [key: string]: unknown }) => { @@ -455,7 +458,7 @@ class DataTable extends React.Component< }: { header: DataTableHeader; onClick?: ( - e: React.MouseEvent, + e: React.MouseEvent, sortState: { sortHeaderKey: string; sortDirection: DataTableSortState } ) => void; isSortable?: boolean; @@ -494,8 +497,11 @@ class DataTable extends React.Component< */ getExpandHeaderProps = ( { onClick, onExpand, ...rest } = {} as { - onClick?: (e: MouseEvent, expandState: { isExpanded: boolean }) => void; - onExpand?: (e: MouseEvent) => void; + onClick?: ( + e: React.MouseEvent, + expandState: { isExpanded: boolean } + ) => void; + onExpand?: (e: React.MouseEvent) => void; [key: string]: unknown; } ) => { @@ -561,7 +567,7 @@ class DataTable extends React.Component< onClick, ...rest }: { - onClick?: (e: MouseEvent) => void; + onClick?: (e: React.MouseEvent) => void; row: DataTableRow; [key: string]: unknown; }) => { @@ -616,7 +622,7 @@ class DataTable extends React.Component< */ getSelectionProps = ( { onClick, row, ...rest } = {} as { - onClick?: (e: MouseEvent) => void; + onClick?: (e: React.MouseEvent) => void; row: DataTableRow; [key: string]: unknown; } @@ -640,7 +646,7 @@ class DataTable extends React.Component< ariaLabel: t(translationKey), // TODO remove in v12 'aria-label': t(translationKey), disabled: row.disabled, - radio: this.props.radio || null, + radio: this.props.radio, }; } diff --git a/packages/react/src/components/DataTable/TableExpandRow.tsx b/packages/react/src/components/DataTable/TableExpandRow.tsx index 949b7231b2da..f2d3be5e1a0e 100644 --- a/packages/react/src/components/DataTable/TableExpandRow.tsx +++ b/packages/react/src/components/DataTable/TableExpandRow.tsx @@ -46,7 +46,7 @@ interface TableExpandRowProps extends PropsWithChildren { * Specify whether this row is expanded or not. This helps coordinate data * attributes so that `TableExpandRow` and `TableExpandedRow` work together */ - isExpanded: boolean; + isExpanded?: boolean; /** * Hook for when a listener initiates a request to expand the given row @@ -168,7 +168,7 @@ TableExpandRow.propTypes = { * Specify whether this row is expanded or not. This helps coordinate data * attributes so that `TableExpandRow` and `TableExpandedRow` work together */ - isExpanded: PropTypes.bool.isRequired, + isExpanded: PropTypes.bool, /** * Specify if the row is selected diff --git a/packages/react/src/components/DataTable/TableSelectAll.tsx b/packages/react/src/components/DataTable/TableSelectAll.tsx index 9d0193849191..19da60dc0505 100644 --- a/packages/react/src/components/DataTable/TableSelectAll.tsx +++ b/packages/react/src/components/DataTable/TableSelectAll.tsx @@ -28,7 +28,7 @@ interface TableSelectAllProps { /** * Specify whether all items are selected, or not */ - checked: boolean; + checked?: boolean; /** * The CSS class names of the cell that wraps the underlying input control @@ -107,7 +107,7 @@ TableSelectAll.propTypes = { /** * Specify whether all items are selected, or not */ - checked: PropTypes.bool.isRequired, + checked: PropTypes.bool, /** * The CSS class names of the cell that wraps the underlying input control diff --git a/packages/react/src/components/DataTable/TableSelectRow.tsx b/packages/react/src/components/DataTable/TableSelectRow.tsx index 7aac53933f2b..bfe38b550e37 100644 --- a/packages/react/src/components/DataTable/TableSelectRow.tsx +++ b/packages/react/src/components/DataTable/TableSelectRow.tsx @@ -31,7 +31,7 @@ export interface TableSelectRowProps { /** * Specify whether this row is selected, or not */ - checked: boolean; + checked?: boolean; /** * The CSS class names of the cell that wraps the underlying input control @@ -129,7 +129,7 @@ TableSelectRow.propTypes = { /** * Specify whether this row is selected, or not */ - checked: PropTypes.bool.isRequired, + checked: PropTypes.bool, /** * The CSS class names of the cell that wraps the underlying input control