diff --git a/package.json b/package.json index 40d6f90..8165ee0 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@dellstorage/dell-design-react-common", "description": "Override CSS of Clarity-React components to align it with Dell design standards", - "version": "0.2.9", + "version": "0.2.10", "license": "Apache-2.0", "private": false, "outDir": "dist", @@ -12,7 +12,7 @@ "node": ">=16.14.1" }, "dependencies": { - "@dellstorage/clarity-react": "^1.2.12", + "@dellstorage/clarity-react": "^1.2.13", "@types/node": "^12.14.1", "bootstrap": "^5.2.0", "react": "^17.0.2", diff --git a/src/components/dataGrid/DataGrid.stories.tsx b/src/components/dataGrid/DataGrid.stories.tsx index 75b1a29..e10e8f9 100644 --- a/src/components/dataGrid/DataGrid.stories.tsx +++ b/src/components/dataGrid/DataGrid.stories.tsx @@ -35,7 +35,7 @@ import { sortFunction, columnsForCustomRows, paginationRowsWithLinks, - paginationDetailswithDefaultPageSizes + paginationDetailswithCustomPageSize, } from "./DataGridStoriesData"; const datagridFilterRef = React.createRef(); @@ -91,12 +91,12 @@ storiesOf("DataGrid", module) /> )) - .add("Grid with pagination and default pageSizes dropdown", () => ( + .add("Grid with pagination and custom pageSize", () => (
diff --git a/src/components/dataGrid/DataGridStoriesData.tsx b/src/components/dataGrid/DataGridStoriesData.tsx index fe425c9..efc57b6 100644 --- a/src/components/dataGrid/DataGridStoriesData.tsx +++ b/src/components/dataGrid/DataGridStoriesData.tsx @@ -9,7 +9,14 @@ */ import React from "react"; -import {DataGridRow, DataGridFilterResult, SortOrder, DataGridColumn} from "@dellstorage/clarity-react/datagrid"; +import { + DataGridRow, + DataGridFilterResult, + SortOrder, + DataGridColumn, + DataGridPaginationProps, + CUSTOM_PAGE_SIZE_OPTION +} from "@dellstorage/clarity-react/datagrid"; import {Icon} from "@dellstorage/clarity-react/icon"; import {Button} from "@dellstorage/clarity-react/forms/button"; /** @@ -280,17 +287,18 @@ export function getRowData() { // Data for pagination rows export const paginationRows = getRowData(); -export const paginationDetails = { +export const paginationDetails: DataGridPaginationProps = { totalItems: paginationRows.length, getPageData: getPageData, pageSize: 5, pageSizes: ["5", "10"], }; -export const paginationDetailswithDefaultPageSizes = { +export const paginationDetailswithCustomPageSize: DataGridPaginationProps = { totalItems: paginationRows.length, getPageData: getPageDataForCustomPageSize, pageSize: 10, + pageSizes: ["10", "20", "50", "100", CUSTOM_PAGE_SIZE_OPTION], }; /** diff --git a/yarn.lock b/yarn.lock index 1d4e6cb..3e3e991 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1337,10 +1337,10 @@ resolved "https://registry.yarnpkg.com/@csstools/normalize.css/-/normalize.css-10.1.0.tgz#f0950bba18819512d42f7197e56c518aa491cf18" integrity sha512-ij4wRiunFfaJxjB0BdrYHIH8FxBJpOwNPhhAcunlmPdXudL1WQV1qoP9un6JsEBAgQH+7UXyyjh0g7jTxXK6tg== -"@dellstorage/clarity-react@^1.2.12": - version "1.2.12" - resolved "https://registry.yarnpkg.com/@dellstorage/clarity-react/-/clarity-react-1.2.12.tgz#2fdb064f3fc98775d41c93f7e2927ece61194516" - integrity sha512-ueBMht6ZmF2lMmj7jBuMNivXVT5wfK2DEl2igDxzHo4NoCLKUn71nLsvIQxCskQFW8t250Y4p07jQDizYik+GA== +"@dellstorage/clarity-react@^1.2.13": + version "1.2.13" + resolved "https://registry.yarnpkg.com/@dellstorage/clarity-react/-/clarity-react-1.2.13.tgz#c5355efd6515d6875e9513cbd98b4fcadc469f45" + integrity sha512-IKu65gzeTNTUTWywP7enrOQ3SkSdym+gblbEYtXdV6B3iS5LmKxkehbRFIuzohxajGLilwftWDlwTLnC7welNw== dependencies: "@clr/icons" "12.0.8" "@clr/ui" "12.0.8"