diff --git a/lib/src/resultset-table/ResultsetTable.tsx b/lib/src/resultset-table/ResultsetTable.tsx index 4f783c3726..fe416241a3 100644 --- a/lib/src/resultset-table/ResultsetTable.tsx +++ b/lib/src/resultset-table/ResultsetTable.tsx @@ -12,7 +12,7 @@ import CoreTokens from "../common/coreTokens"; const normalizeSortValue = (sortValue: string | React.ReactNode) => typeof sortValue === "string" ? sortValue.toUpperCase() : sortValue; -const sortArray = (index: number, order: "ascending" | "descending", resultset: { id: string; cells: Row[] }[]) => +const sortArray = (index: number, order: "ascending" | "descending", resultset: { id: string; cells: Row }[]) => resultset.slice().sort((element1, element2) => { const sortValueA = normalizeSortValue(element1.cells[index].sortValue || element1[index].displayValue); const sortValueB = normalizeSortValue(element2.cells[index].sortValue || element2[index].displayValue); @@ -35,11 +35,11 @@ const getMinItemsPerPageIndex = (currentPageInternal: number, itemsPerPage: numb const getMaxItemsPerPageIndex = ( minItemsPerPageIndex: number, itemsPerPage: number, - resultset: Row[][], + resultset: Row[], page: number, ) => (minItemsPerPageIndex + itemsPerPage > resultset.length ? resultset.length : itemsPerPage * page - 1); -const assignIdsToRows = (resultset: Row[][]) => { +const assignIdsToRows = (resultset: Row[]) => { if (resultset.length > 0) { return resultset.map((row, index) => ({ cells: row, diff --git a/lib/src/resultset-table/types.ts b/lib/src/resultset-table/types.ts index 20fac4edfa..278c0bd683 100644 --- a/lib/src/resultset-table/types.ts +++ b/lib/src/resultset-table/types.ts @@ -17,7 +17,7 @@ export type Column = { isSortable?: boolean; }; -export type Row = { +type Cell = { /** * Value to be displayed in the cell. */ @@ -29,6 +29,8 @@ export type Row = { sortValue?: string; }; +export type Row = Cell[]; + type CommonProps = { /** * An array of objects representing the columns of the table. @@ -38,7 +40,7 @@ type CommonProps = { * An array of objects representing the rows of the table, you will have * as many objects as columns in the table. */ - rows: Row[][]; + rows: Row[]; /** * Size of the margin to be applied to the component. You can pass an object with 'top', * 'bottom', 'left' and 'right' properties in order to specify different margin sizes. diff --git a/website/screens/components/resultset-table/code/ResultsetTableCodePage.tsx b/website/screens/components/resultset-table/code/ResultsetTableCodePage.tsx index 638deecb76..4fd6631aba 100644 --- a/website/screens/components/resultset-table/code/ResultsetTableCodePage.tsx +++ b/website/screens/components/resultset-table/code/ResultsetTableCodePage.tsx @@ -31,6 +31,15 @@ const actionsType = `{ options: Option[]; }[]`; +const cellTypeString = `{ + displayValue: React.ReactNode; + sortValue?: string; +}[]`; +const columnTypeString = `{ + displayValue: React.ReactNode; + isSortable?: boolean; +}`; + const sections = [ { title: "Props", @@ -53,9 +62,12 @@ const sections = [
+ being Column an object with the following
+ properties:
+
+ being Row a Cell[] and being{" "}
+ Cell an object with the following properties:
+