@equinor/eds-data-grid-react 0.9.0 → 1.0.0

package/dist/eds-data-grid-react.cjs

@@ -199,7 +199,7 @@ function FilterWrapper({
   } = useTableContext();
   const firstValue = table.getPreFilteredRowModel().flatRows[0]?.getValue(column.id);
   const [open, setOpen] = react.useState(false);
-  const filterIconRef = react.useRef();
+  const filterIconRef = react.useRef(null);
   const togglePopover = event => {
     event.stopPropagation();
     setOpen(!open);
@@ -521,9 +521,33 @@ function TableRow({
     rowClass,
     rowStyle
   } = useTableContext();
+  const isMountedRef = react.useRef(true);
+
+  // Set mounted flag to false on unmount to prevent measurements during cleanup
+  react.useEffect(() => {
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
+
+  // Create a stable ref callback that guards against calls during unmount
+  const measureRef = react.useCallback(node => {
+    // Only measure if we have a node, the component is still mounted, and we have a virtualizer
+    if (node && isMountedRef.current && rowVirtualizer) {
+      try {
+        rowVirtualizer.measureElement(node);
+      } catch (error) {
+        // Silently catch any errors during measurement to prevent crashes
+        // This can happen if the virtualizer is in an inconsistent state during unmount
+        if (process.env.NODE_ENV === 'development') {
+          console.warn('Failed to measure element during virtualization:', error);
+        }
+      }
+    }
+  }, [rowVirtualizer]);
   return /*#__PURE__*/jsxRuntime.jsx(StyledTableRow, {
     "data-index": virtualItem?.index,
-    ref: node => node && rowVirtualizer?.measureElement(node) //measure dynamic row height
+    ref: measureRef //measure dynamic row height safely
     ,
     style: {
       ...(rowStyle?.(row) ?? {})

package/dist/esm/components/FilterWrapper.js

@@ -18,7 +18,7 @@ function FilterWrapper({
   } = useTableContext();
   const firstValue = table.getPreFilteredRowModel().flatRows[0]?.getValue(column.id);
   const [open, setOpen] = useState(false);
-  const filterIconRef = useRef();
+  const filterIconRef = useRef(null);
   const togglePopover = event => {
     event.stopPropagation();
     setOpen(!open);

package/dist/esm/components/TableRow.js

@@ -1,4 +1,5 @@
 import { Table } from '@equinor/eds-core-react';
+import { useRef, useEffect, useCallback } from 'react';
 import styled from 'styled-components';
 import { useTableContext } from '../EdsDataGridContext.js';
 import { TableBodyCell } from './TableBodyCell.js';
@@ -17,9 +18,33 @@ function TableRow({
     rowClass,
     rowStyle
   } = useTableContext();
+  const isMountedRef = useRef(true);
+
+  // Set mounted flag to false on unmount to prevent measurements during cleanup
+  useEffect(() => {
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
+
+  // Create a stable ref callback that guards against calls during unmount
+  const measureRef = useCallback(node => {
+    // Only measure if we have a node, the component is still mounted, and we have a virtualizer
+    if (node && isMountedRef.current && rowVirtualizer) {
+      try {
+        rowVirtualizer.measureElement(node);
+      } catch (error) {
+        // Silently catch any errors during measurement to prevent crashes
+        // This can happen if the virtualizer is in an inconsistent state during unmount
+        if (process.env.NODE_ENV === 'development') {
+          console.warn('Failed to measure element during virtualization:', error);
+        }
+      }
+    }
+  }, [rowVirtualizer]);
   return /*#__PURE__*/jsx(StyledTableRow, {
     "data-index": virtualItem?.index,
-    ref: node => node && rowVirtualizer?.measureElement(node) //measure dynamic row height
+    ref: measureRef //measure dynamic row height safely
     ,
     style: {
       ...(rowStyle?.(row) ?? {})

package/dist/types/EdsDataGridContext.d.ts

@@ -17,7 +17,7 @@ type Context<T> = {
 };
 export declare const EdsDataGridContext: import("react").Context<Context<any>>;
 export declare function TableProvider<T>({ children, ...props }: Context<T> & {
-    children: ReactElement | Array<ReactElement>;
+    children: ReactElement | ReactElement[];
 }): import("react/jsx-runtime").JSX.Element;
 export declare const useTableContext: () => Context<any>;
 export {};

package/dist/types/components/TableCell.d.ts

@@ -1,18 +1,6 @@
 import { ColumnPinningPosition } from '@tanstack/react-table';
 export declare const FilterVisibility: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const TableCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(Omit<{
-    variant?: import("@equinor/eds-core-react/dist/types/components/Table/Table.types").Variants;
-    color?: import("@equinor/eds-core-react/dist/types/components/Table/Table.types").Colors;
-    sort?: React.AriaAttributes["aria-sort"];
-} & import("react").TdHTMLAttributes<HTMLTableCellElement> & import("react").RefAttributes<HTMLTableCellElement>, "ref"> & {
-    ref?: import("react").Ref<HTMLTableCellElement>;
-}) | (Omit<{
-    variant?: import("@equinor/eds-core-react/dist/types/components/Table/Table.types").Variants;
-    color?: import("@equinor/eds-core-react/dist/types/components/Table/Table.types").Colors;
-    sort?: React.AriaAttributes["aria-sort"];
-} & import("react").ThHTMLAttributes<HTMLTableCellElement> & import("react").RefAttributes<HTMLTableCellElement>, "ref"> & {
-    ref?: import("react").Ref<HTMLTableCellElement>;
-}), {
+export declare const TableCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(import("@equinor/eds-core-react").CellProps & import("react").RefAttributes<HTMLTableCellElement>) & import("styled-components/dist/types").BaseObject, {
     $sticky: boolean;
     $pinned: ColumnPinningPosition;
     $offset: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/eds-data-grid-react",
-  "version": "0.9.0",
+  "version": "1.0.0",
   "description": "A feature-rich data-grid written in React, implementing the Equinor Design System",
   "license": "MIT",
   "types": "dist/types/index.d.ts",
@@ -15,57 +15,53 @@
   },
   "peerDependencies": {
     "@equinor/eds-core-react": ">=0.42.0",
-    "react": ">=16.8",
+    "react": ">=19.0.0",
     "react-dom": ">=16.8",
     "styled-components": ">=5.1"
   },
   "dependencies": {
     "@tanstack/react-table": "^8.21.3",
     "@tanstack/react-virtual": "^3.13.12",
-    "@equinor/eds-icons": "^0.22.0",
-    "@equinor/eds-tokens": "0.9.2",
-    "@equinor/eds-utils": "^0.8.8"
+    "@equinor/eds-icons": "^1.0.0",
+    "@equinor/eds-utils": "^1.0.0",
+    "@equinor/eds-tokens": "1.0.0"
   },
   "devDependencies": {
     "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-commonjs": "^28.0.3",
+    "@rollup/plugin-commonjs": "^28.0.6",
     "@rollup/plugin-node-resolve": "^16.0.1",
-    "@storybook/addon-a11y": "^8.6.12",
-    "@storybook/addon-actions": "^8.6.12",
-    "@storybook/addon-docs": "^8.6.12",
-    "@storybook/addon-essentials": "^8.6.12",
-    "@storybook/addon-links": "^8.6.12",
-    "@storybook/blocks": "^8.6.12",
-    "@storybook/preview-api": "^8.6.12",
-    "@storybook/react": "^8.6.12",
-    "@storybook/react-vite": "^8.6.12",
-    "@testing-library/dom": "^10.4.0",
-    "@testing-library/jest-dom": "^6.6.3",
+    "@storybook/addon-a11y": "^9.1.5",
+    "@storybook/addon-docs": "^9.1.5",
+    "@storybook/addon-links": "^9.1.5",
+    "@storybook/react-vite": "^9.1.5",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.8.0",
     "@testing-library/react": "16.3.0",
     "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^29.5.14",
-    "@types/node": "^22.15.3",
+    "@types/node": "^22.18.0",
     "@types/ramda": "^0.30.2",
-    "@types/react": "^18.3.20",
-    "@types/react-dom": "^18.3.6",
+    "@types/react": "^19.1.12",
+    "@types/react-dom": "^19.1.9",
     "babel-plugin-styled-components": "^2.1.4",
+    "eslint-plugin-storybook": "9.1.5",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
     "jest-styled-components": "^7.2.0",
     "js-file-download": "^0.4.12",
-    "postcss": "^8.5.3",
+    "postcss": "^8.5.6",
     "ramda": "^0.31.3",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "react-hook-form": "^7.56.1",
-    "rollup": "^4.40.1",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
+    "react-hook-form": "^7.62.0",
+    "rollup": "^4.50.0",
     "rollup-plugin-delete": "^2.2.0",
     "rollup-plugin-postcss": "^4.0.2",
-    "storybook": "^8.6.14",
+    "storybook": "^9.1.5",
     "styled-components": "6.1.19",
     "ts-jest": "29.4.0",
     "ts-node": "10.9.2",
-    "tsc-watch": "^6.2.1",
+    "tsc-watch": "^6.3.1",
     "typescript": "~5.8.3"
   },
   "homepage": "https://eds.equinor.com",
@@ -86,7 +82,7 @@
   ],
   "scripts": {
     "build": "rollup -c --bundleConfigAsCjs && tsc -p tsconfig.build.json",
-    "test": "tsc -p tsconfig.spec.json && jest",
+    "test": "tsc -p tsconfig.test.json && jest",
     "test:watch": "tsc-watch -p tsconfig.test.json --onFirstSuccess  \"jest --watch\"",
     "test:update-snapshots": "jest --updateSnapshot",
     "storybook": "storybook dev -p 9000 --ci",