@equinor/eds-data-grid-react 0.7.0 → 0.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/eds-data-grid-react.cjs +17 -5
  2. package/dist/esm/EdsDataGrid.js +14 -4
  3. package/dist/esm/components/TableRow.js +3 -1
  4. package/dist/types/EdsDataGrid.d.ts +2 -1
  5. package/dist/types/EdsDataGridProps.d.ts +13 -0
  6. package/dist/types/components/TableRow.d.ts +1 -1
  7. package/package.json +17 -18
package/dist/eds-data-grid-react.cjs CHANGED
@@ -468,7 +468,8 @@ function TableBodyCell({
468
468
  function TableRow({
469
469
  row,
470
470
  onCellClick,
471
- onClick
471
+ onClick,
472
+ onContextMenu
472
473
  }) {
473
474
  const {
474
475
  rowClass,
@@ -480,6 +481,7 @@ function TableRow({
480
481
  },
481
482
  className: `${row.getIsSelected() ? 'selected' : ''} ${rowClass?.(row)}`,
482
483
  onClick: onClick,
484
+ onContextMenu: onContextMenu,
483
485
  children: row.getVisibleCells().map(cell => /*#__PURE__*/jsxRuntime.jsx(TableBodyCell, {
484
486
  cell: cell,
485
487
  onClick: onCellClick ? event => onCellClick(cell, event) : undefined
@@ -584,9 +586,12 @@ function EdsDataGrid({
584
586
  setExpansionState,
585
587
  getSubRows,
586
588
  defaultColumn,
589
+ onRowContextMenu,
587
590
  onRowClick,
588
591
  onCellClick,
589
- enableFooter
592
+ enableFooter,
593
+ enableSortingRemoval,
594
+ ...rest
590
595
  }) {
591
596
  logDevelopmentWarningOfPropUse({
592
597
  virtualHeight: {
@@ -736,7 +741,8 @@ function EdsDataGrid({
736
741
  enableSubRowSelection: enableSubRowSelection ?? false,
737
742
  enableColumnPinning: true,
738
743
  enablePinning: true,
739
- getRowId
744
+ getRowId,
745
+ enableSortingRemoval: enableSortingRemoval ?? true
740
746
  };
741
747
  react.useEffect(() => {
742
748
  if (columnOrder && columnOrder.length > 0) {
@@ -856,8 +862,12 @@ function EdsDataGrid({
856
862
  stickyHeader: !!stickyHeader,
857
863
  stickyFooter: !!stickyFooter,
858
864
  children: [/*#__PURE__*/jsxRuntime.jsxs(TableWrapper, {
859
- className: "table-wrapper",
860
- style: tableWrapperStyle,
865
+ ...rest,
866
+ className: `table-wrapper ${rest.className ?? ''}`,
867
+ style: {
868
+ ...rest.style,
869
+ ...tableWrapperStyle
870
+ },
861
871
  ref: parentRef,
862
872
  $height: height,
863
873
  $width: width,
@@ -904,6 +914,7 @@ function EdsDataGrid({
904
914
  const row = table.getRowModel().rows[virtualItem.index];
905
915
  return /*#__PURE__*/jsxRuntime.jsx(TableRow, {
906
916
  row: row,
917
+ onContextMenu: onRowContextMenu ? event => onRowContextMenu(row, event) : undefined,
907
918
  onClick: onRowClick ? event => onRowClick(row, event) : undefined,
908
919
  onCellClick: onCellClick
909
920
  }, virtualItem.index);
@@ -921,6 +932,7 @@ function EdsDataGrid({
921
932
  })]
922
933
  }), !enableVirtual && table.getRowModel().rows.map(row => /*#__PURE__*/jsxRuntime.jsx(TableRow, {
923
934
  row: row,
935
+ onContextMenu: onRowContextMenu ? event => onRowContextMenu(row, event) : undefined,
924
936
  onClick: onRowClick ? event => onRowClick(row, event) : undefined,
925
937
  onCellClick: onCellClick
926
938
  }, row.id))]
package/dist/esm/EdsDataGrid.js CHANGED
@@ -62,9 +62,12 @@ function EdsDataGrid({
62
62
  setExpansionState,
63
63
  getSubRows,
64
64
  defaultColumn,
65
+ onRowContextMenu,
65
66
  onRowClick,
66
67
  onCellClick,
67
- enableFooter
68
+ enableFooter,
69
+ enableSortingRemoval,
70
+ ...rest
68
71
  }) {
69
72
  logDevelopmentWarningOfPropUse({
70
73
  virtualHeight: {
@@ -214,7 +217,8 @@ function EdsDataGrid({
214
217
  enableSubRowSelection: enableSubRowSelection ?? false,
215
218
  enableColumnPinning: true,
216
219
  enablePinning: true,
217
- getRowId
220
+ getRowId,
221
+ enableSortingRemoval: enableSortingRemoval ?? true
218
222
  };
219
223
  useEffect(() => {
220
224
  if (columnOrder && columnOrder.length > 0) {
@@ -334,8 +338,12 @@ function EdsDataGrid({
334
338
  stickyHeader: !!stickyHeader,
335
339
  stickyFooter: !!stickyFooter,
336
340
  children: [/*#__PURE__*/jsxs(TableWrapper, {
337
- className: "table-wrapper",
338
- style: tableWrapperStyle,
341
+ ...rest,
342
+ className: `table-wrapper ${rest.className ?? ''}`,
343
+ style: {
344
+ ...rest.style,
345
+ ...tableWrapperStyle
346
+ },
339
347
  ref: parentRef,
340
348
  $height: height,
341
349
  $width: width,
@@ -382,6 +390,7 @@ function EdsDataGrid({
382
390
  const row = table.getRowModel().rows[virtualItem.index];
383
391
  return /*#__PURE__*/jsx(TableRow, {
384
392
  row: row,
393
+ onContextMenu: onRowContextMenu ? event => onRowContextMenu(row, event) : undefined,
385
394
  onClick: onRowClick ? event => onRowClick(row, event) : undefined,
386
395
  onCellClick: onCellClick
387
396
  }, virtualItem.index);
@@ -399,6 +408,7 @@ function EdsDataGrid({
399
408
  })]
400
409
  }), !enableVirtual && table.getRowModel().rows.map(row => /*#__PURE__*/jsx(TableRow, {
401
410
  row: row,
411
+ onContextMenu: onRowContextMenu ? event => onRowContextMenu(row, event) : undefined,
402
412
  onClick: onRowClick ? event => onRowClick(row, event) : undefined,
403
413
  onCellClick: onCellClick
404
414
  }, row.id))]
package/dist/esm/components/TableRow.js CHANGED
@@ -7,7 +7,8 @@ import { jsx } from 'react/jsx-runtime';
7
7
  function TableRow({
8
8
  row,
9
9
  onCellClick,
10
- onClick
10
+ onClick,
11
+ onContextMenu
11
12
  }) {
12
13
  const {
13
14
  rowClass,
@@ -19,6 +20,7 @@ function TableRow({
19
20
  },
20
21
  className: `${row.getIsSelected() ? 'selected' : ''} ${rowClass?.(row)}`,
21
22
  onClick: onClick,
23
+ onContextMenu: onContextMenu,
22
24
  children: row.getVisibleCells().map(cell => /*#__PURE__*/jsx(TableBodyCell, {
23
25
  cell: cell,
24
26
  onClick: onCellClick ? event => onCellClick(cell, event) : undefined
package/dist/types/EdsDataGrid.d.ts CHANGED
@@ -1,2 +1,3 @@
1
+ import { HTMLAttributes } from 'react';
1
2
  import { EdsDataGridProps } from './EdsDataGridProps';
2
- export declare function EdsDataGrid<T>({ rows, columns, columnResizeMode, pageSize, rowSelection, enableRowSelection, enableMultiRowSelection, enableSubRowSelection, selectedRows, rowSelectionState, enableColumnFiltering, debug, enablePagination, enableSorting, stickyHeader, stickyFooter, onSelectRow, onRowSelectionChange, caption, enableVirtual, virtualHeight, columnVisibility, columnVisibilityChange, emptyMessage, columnOrder, cellClass, cellStyle, rowClass, rowStyle, headerClass, headerStyle, footerClass, footerStyle, externalPaginator, onSortingChange, manualSorting, sortingState, columnPinState, scrollbarHorizontal, width, minWidth, height, getRowId, rowVirtualizerInstanceRef, columnSizing, onColumnResize, expansionState, setExpansionState, getSubRows, defaultColumn, onRowClick, onCellClick, enableFooter, }: EdsDataGridProps<T>): import("react/jsx-runtime").JSX.Element;
3
+ export declare function EdsDataGrid<T>({ rows, columns, columnResizeMode, pageSize, rowSelection, enableRowSelection, enableMultiRowSelection, enableSubRowSelection, selectedRows, rowSelectionState, enableColumnFiltering, debug, enablePagination, enableSorting, stickyHeader, stickyFooter, onSelectRow, onRowSelectionChange, caption, enableVirtual, virtualHeight, columnVisibility, columnVisibilityChange, emptyMessage, columnOrder, cellClass, cellStyle, rowClass, rowStyle, headerClass, headerStyle, footerClass, footerStyle, externalPaginator, onSortingChange, manualSorting, sortingState, columnPinState, scrollbarHorizontal, width, minWidth, height, getRowId, rowVirtualizerInstanceRef, columnSizing, onColumnResize, expansionState, setExpansionState, getSubRows, defaultColumn, onRowContextMenu, onRowClick, onCellClick, enableFooter, enableSortingRemoval, ...rest }: EdsDataGridProps<T> & HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
package/dist/types/EdsDataGridProps.d.ts CHANGED
@@ -186,6 +186,13 @@ type FilterProps = {
186
186
  enableColumnFiltering?: boolean;
187
187
  };
188
188
  type HandlersProps<T> = {
189
+ /**
190
+ *
191
+ * @param row the current row
192
+ * @param event The right-click event
193
+ * @returns
194
+ */
195
+ onRowContextMenu?: (row: Row<T>, event: MouseEvent<HTMLTableRowElement>) => unknown;
189
196
  /**
190
197
  * Row click handler.
191
198
  *
@@ -253,6 +260,12 @@ type SortProps = {
253
260
  * Override the default sorting state
254
261
  */
255
262
  sortingState?: SortingState;
263
+ /**
264
+ * By default, the ability to remove sorting while cycling through the sorting states for a column is enabled.
265
+ * You can disable this behavior using the enableSortingRemoval table option.
266
+ * This behavior is useful if you want to ensure that at least one column is always sorted.
267
+ */
268
+ enableSortingRemoval?: boolean;
256
269
  };
257
270
  type ColumnProps = {
258
271
  columnPinState?: ColumnPinningState;
package/dist/types/components/TableRow.d.ts CHANGED
@@ -5,5 +5,5 @@ type Props<T> = {
5
5
  row: Row<T>;
6
6
  onCellClick?: EdsDataGridProps<T>['onCellClick'];
7
7
  } & HTMLAttributes<HTMLTableRowElement>;
8
- export declare function TableRow<T>({ row, onCellClick, onClick }: Props<T>): import("react/jsx-runtime").JSX.Element;
8
+ export declare function TableRow<T>({ row, onCellClick, onClick, onContextMenu, }: Props<T>): import("react/jsx-runtime").JSX.Element;
9
9
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@equinor/eds-data-grid-react",
3
- "version": "0.7.0",
3
+ "version": "0.7.2",
4
4
  "description": "A feature-rich data-grid written in React, implementing the Equinor Design System",
5
5
  "license": "MIT",
6
6
  "types": "dist/types/index.d.ts",
@@ -21,24 +21,24 @@
21
21
  },
22
22
  "dependencies": {
23
23
  "@tanstack/react-table": "^8.20.1",
24
- "@tanstack/react-virtual": "^3.10.6",
25
- "@equinor/eds-tokens": "0.9.2",
24
+ "@tanstack/react-virtual": "^3.10.8",
26
25
  "@equinor/eds-icons": "^0.21.0",
26
+ "@equinor/eds-tokens": "0.9.2",
27
27
  "@equinor/eds-utils": "^0.8.5"
28
28
  },
29
29
  "devDependencies": {
30
30
  "@rollup/plugin-babel": "^6.0.4",
31
- "@rollup/plugin-commonjs": "^26.0.1",
32
- "@rollup/plugin-node-resolve": "^15.2.3",
33
- "@storybook/addon-a11y": "^8.2.8",
34
- "@storybook/addon-actions": "^8.2.8",
35
- "@storybook/addon-docs": "^8.2.8",
36
- "@storybook/addon-essentials": "^8.2.8",
37
- "@storybook/addon-links": "^8.2.8",
38
- "@storybook/blocks": "^8.2.8",
39
- "@storybook/preview-api": "^8.2.8",
40
- "@storybook/react": "^8.2.8",
41
- "@storybook/react-vite": "^8.2.8",
31
+ "@rollup/plugin-commonjs": "^27.0.0",
32
+ "@rollup/plugin-node-resolve": "^15.3.0",
33
+ "@storybook/addon-a11y": "^8.3.4",
34
+ "@storybook/addon-actions": "^8.3.4",
35
+ "@storybook/addon-docs": "^8.3.4",
36
+ "@storybook/addon-essentials": "^8.3.4",
37
+ "@storybook/addon-links": "^8.3.4",
38
+ "@storybook/blocks": "^8.3.4",
39
+ "@storybook/preview-api": "^8.3.4",
40
+ "@storybook/react": "^8.3.4",
41
+ "@storybook/react-vite": "^8.3.4",
42
42
  "@testing-library/dom": "^10.4.0",
43
43
  "@testing-library/jest-dom": "^6.4.8",
44
44
  "@testing-library/react": "16.0.0",
@@ -48,7 +48,6 @@
48
48
  "@types/ramda": "^0.30.1",
49
49
  "@types/react": "^18.3.3",
50
50
  "@types/react-dom": "^18.3.0",
51
- "babel-loader": "^9.1.3",
52
51
  "babel-plugin-styled-components": "^2.1.4",
53
52
  "jest": "29.7.0",
54
53
  "jest-environment-jsdom": "29.7.0",
@@ -59,10 +58,10 @@
59
58
  "react": "^18.3.1",
60
59
  "react-dom": "^18.3.1",
61
60
  "react-hook-form": "^7.52.2",
62
- "rollup": "^4.20.0",
63
- "rollup-plugin-delete": "^2.0.0",
61
+ "rollup": "^4.22.5",
62
+ "rollup-plugin-delete": "^2.1.0",
64
63
  "rollup-plugin-postcss": "^4.0.2",
65
- "storybook": "^8.2.8",
64
+ "storybook": "^8.3.4",
66
65
  "styled-components": "6.1.12",
67
66
  "ts-jest": "29.2.4",
68
67
  "ts-node": "10.9.2",