@procore/data-table 13.3.1 → 13.3.2

package/dist/legacy/index.mjs

@@ -1,6 +1,6 @@
 import React82, { useState, forwardRef, useContext, useRef, useImperativeHandle, useLayoutEffect, useCallback, useMemo, memo, useEffect, Component as Component$1, createElement } from 'react';
 import { startsWith, equals, omit, isNil, mergeDeepLeft, intersection, isEmpty, groupBy } from 'ramda';
-import { useI18nContext, Select, Input, UNSAFE_useOverlayTriggerContext, Card, Flex, Box, SegmentedController, Calendar, useDateTime, OverlayTrigger, isEventSource, DateInput, UNSAFE_isValidYearRange, DateSelect, PillSelect, TextArea, UNSAFE_useMenuImperativeControlNavigation, UNSAFE_Menu, UNSAFE_menuItemsWrapperAttribute, Spinner, FlexList, Typography, Tooltip, Button, Required, colors, Form, spacing, Switch, Panel, UNSAFE_StyledFilterTokenLabel, typographyWeights, SelectButton, StyledSelectButton, StyledSelectButtonLabel, StyledButton, StyledSelectArrow, Popover, UNSAFE_StyledSuperSelectTrigger, UNSAFE_StyledSuperSelectLabel, UNSAFE_StyledSuperSelectArrow, DateTimeProvider, useField, Label, UNSAFE_mergeRefs, ContactItem as ContactItem$1, ToggleButton, Pagination, Link, AvatarStack, Pill, Typeahead, UNSAFE_FilterToken, useI18n, I18nContext, UNSAFE_SuperSelect, Avatar, MultiSelect, H3, Checkbox, useVisibility, UNSAFE_useSuperSelectContext, DropdownFlyout, StyledDropdownFlyoutLabel, StyledDropdownFlyoutExpandIcon, EmptyState as EmptyState$1 } from '@procore/core-react';
+import { useI18nContext, Select, Input, UNSAFE_useOverlayTriggerContext, Card, Flex, Box, SegmentedController, Calendar, useDateTime, OverlayTrigger, isEventSource, DateInput, UNSAFE_isValidYearRange, DateSelect, PillSelect, TextArea, UNSAFE_useMenuImperativeControlNavigation, UNSAFE_Menu, UNSAFE_menuItemsWrapperAttribute, Spinner as Spinner$1, FlexList, Typography, Tooltip, Button, Required, colors, Form, spacing, Switch, Panel, UNSAFE_StyledFilterTokenLabel, typographyWeights, SelectButton, StyledSelectButton, StyledSelectButtonLabel, StyledButton, StyledSelectArrow, Popover, UNSAFE_StyledSuperSelectTrigger, UNSAFE_StyledSuperSelectLabel, UNSAFE_StyledSuperSelectArrow, DateTimeProvider, useField, Label, UNSAFE_mergeRefs, ContactItem as ContactItem$1, ToggleButton, Pagination, Link, AvatarStack, Pill, Typeahead, UNSAFE_FilterToken, useI18n, I18nContext, UNSAFE_SuperSelect, Avatar, MultiSelect, H3, Checkbox, useVisibility, UNSAFE_useSuperSelectContext, DropdownFlyout, StyledDropdownFlyoutLabel, StyledDropdownFlyoutExpandIcon, EmptyState as EmptyState$1 } from '@procore/core-react';
 import classnames from 'classnames/bind';
 import { Error as Error$1, Grip, Pencil, Building, Calendar as Calendar$1, CaretsInVertical, CaretsOutVertical, CaretsOutVerticalWithLine, CaretsIn, CaretsOut, CaretDown, CaretRight, ArrowDown, ArrowUp } from '@procore/core-icons';
 import classNames from 'classnames';
@@ -996,6 +996,43 @@ var rowHeightMap = {
   [rowSize.md]: "medium",
   [rowSize.lg]: "large"
 };
+var Spinner = ({
+  loading,
+  ...rest
+}) => /* @__PURE__ */ React82.createElement(Box, { "data-qa": loading ? "loading" : "loaded", display: "flex-row", flex: 1 }, /* @__PURE__ */ React82.createElement(Spinner$1, { loading, size: "md", centered: true, ...rest }));
+function isNestedColumnDefinition(Column2) {
+  return "children" in Column2;
+}
+function isNestedColDef(colDef) {
+  if (!colDef.groupId) {
+    return false;
+  }
+  return "groupId" in colDef;
+}
+function getLeafColDefs(columnDefinitions) {
+  return columnDefinitions.flatMap((colDef) => {
+    return isNestedColDef(colDef) ? getLeafColDefs(colDef.children) : [colDef];
+  });
+}
+function isFirstColumn(params) {
+  var _a;
+  const displayedColumns = ((_a = params == null ? void 0 : params.columnApi) == null ? void 0 : _a.getAllDisplayedColumns()) || [];
+  return displayedColumns.length ? displayedColumns[0] === params.column : false;
+}
+function getCheckboxColumn(columnApi) {
+  var _a, _b;
+  const isGrouping = ((_b = (_a = columnApi == null ? void 0 : columnApi.getRowGroupColumns) == null ? void 0 : _a.call(columnApi)) == null ? void 0 : _b.length) !== 0;
+  if (isGrouping) {
+    return null;
+  }
+  const displayedColumns = (columnApi == null ? void 0 : columnApi.getAllDisplayedColumns()) || [];
+  return displayedColumns.length ? displayedColumns[0] : null;
+}
+function removeEventListenerFromGrid(event, listener, gridApi) {
+  if (!gridApi || (gridApi == null ? void 0 : gridApi.destroyCalled))
+    return;
+  gridApi == null ? void 0 : gridApi.removeEventListener(event, listener);
+}
 
 // src/styles.scss
 var styles_exports = {};
@@ -53833,7 +53870,7 @@ var LocationFilterOverlay = React82.forwardRef(
           getLabel3(item)
         );
       })),
-      loading && /* @__PURE__ */ React82.createElement(UNSAFE_Menu.Footer, null, /* @__PURE__ */ React82.createElement(Flex, { justifyContent: "center" }, /* @__PURE__ */ React82.createElement(Spinner, { size: "sm" })))
+      loading && /* @__PURE__ */ React82.createElement(UNSAFE_Menu.Footer, null, /* @__PURE__ */ React82.createElement(Flex, { justifyContent: "center" }, /* @__PURE__ */ React82.createElement(Spinner$1, { size: "sm" })))
     ));
   }
 );
@@ -54038,8 +54075,16 @@ function useFilterState({
     }
     return () => {
       listenersEnabled.current = false;
-      gridApi == null ? void 0 : gridApi.removeEventListener("filterChanged", filterEventFunction);
-      gridApi == null ? void 0 : gridApi.removeEventListener("rowDataUpdated", filterEventFunction);
+      removeEventListenerFromGrid(
+        "filterChanged",
+        filterEventFunction,
+        gridApi
+      );
+      removeEventListenerFromGrid(
+        "rowDataUpdated",
+        filterEventFunction,
+        gridApi
+      );
     };
   }, [gridApi, columnDefinitions]);
   return { allAvailableFilters, changeFilterValue, filterableColumns };
@@ -54533,38 +54578,6 @@ var ServerSideFilter = ({
     )
   );
 };
-var Spinner2 = ({
-  loading,
-  ...rest
-}) => /* @__PURE__ */ React82.createElement(Box, { "data-qa": loading ? "loading" : "loaded", display: "flex-row", flex: 1 }, /* @__PURE__ */ React82.createElement(Spinner, { loading, size: "md", centered: true, ...rest }));
-function isNestedColumnDefinition(Column2) {
-  return "children" in Column2;
-}
-function isNestedColDef(colDef) {
-  if (!colDef.groupId) {
-    return false;
-  }
-  return "groupId" in colDef;
-}
-function getLeafColDefs(columnDefinitions) {
-  return columnDefinitions.flatMap((colDef) => {
-    return isNestedColDef(colDef) ? getLeafColDefs(colDef.children) : [colDef];
-  });
-}
-function isFirstColumn(params) {
-  var _a;
-  const displayedColumns = ((_a = params == null ? void 0 : params.columnApi) == null ? void 0 : _a.getAllDisplayedColumns()) || [];
-  return displayedColumns.length ? displayedColumns[0] === params.column : false;
-}
-function getCheckboxColumn(columnApi) {
-  var _a, _b;
-  const isGrouping = ((_b = (_a = columnApi == null ? void 0 : columnApi.getRowGroupColumns) == null ? void 0 : _a.call(columnApi)) == null ? void 0 : _b.length) !== 0;
-  if (isGrouping) {
-    return null;
-  }
-  const displayedColumns = (columnApi == null ? void 0 : columnApi.getAllDisplayedColumns()) || [];
-  return displayedColumns.length ? displayedColumns[0] : null;
-}
 
 // src/utils/transformers.ts
 var emptyObject = {};
@@ -55279,7 +55292,7 @@ function ClientSideRowCheckbox(props) {
   useEffect(() => {
     props.api.addEventListener("rowSelected", handleRowSelection);
     return () => {
-      props.api.removeEventListener("rowSelected", handleRowSelection);
+      removeEventListenerFromGrid("rowSelected", handleRowSelection, props.api);
     };
   }, []);
   return /* @__PURE__ */ React82.createElement(Box, { paddingRight: "md" }, /* @__PURE__ */ React82.createElement(
@@ -55393,7 +55406,11 @@ function GroupCaret(props) {
     props.api.addEventListener("rowGroupOpened", handleRowGroupToggle);
     return () => {
       mounted.current = false;
-      props.api.removeEventListener("rowGroupOpened", handleRowGroupToggle);
+      removeEventListenerFromGrid(
+        "rowGroupOpened",
+        handleRowGroupToggle,
+        props.api
+      );
     };
   }, []);
   return /* @__PURE__ */ React82.createElement(Box, { className: AutoGroupCell_default.expandableCaret }, props.node.isExpandable() && /* @__PURE__ */ React82.createElement(
@@ -55420,7 +55437,11 @@ var AutoGroupCellRenderer = (props) => {
   useEffect(() => {
     props.api.addEventListener("cellValueChanged", handleCellValueChange);
     return () => {
-      props.api.removeEventListener("cellValueChanged", handleCellValueChange);
+      removeEventListenerFromGrid(
+        "cellValueChanged",
+        handleCellValueChange,
+        props.api
+      );
     };
   }, []);
   const adjustedLevel = props.node.footer ? props.node.level + 1 : props.node.level;
@@ -56282,7 +56303,7 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener("columnMoved", calculatePosition);
     calculatePosition();
     return () => {
-      props.api.removeEventListener("columnMoved", calculatePosition);
+      removeEventListenerFromGrid("columnMoved", calculatePosition, props.api);
     };
   }, []);
   const onSortToggled = (event) => {
@@ -56361,8 +56382,11 @@ var GenericHeaderRenderer = (props) => {
     };
     (_a2 = props.api) == null ? void 0 : _a2.addEventListener("expandOrCollapseAll", onExpandAllChange);
     return () => {
-      var _a3;
-      (_a3 = props.api) == null ? void 0 : _a3.removeEventListener("expandOrCollapseAll", onExpandAllChange);
+      removeEventListenerFromGrid(
+        "expandOrCollapseAll",
+        onExpandAllChange,
+        props.api
+      );
     };
   }, [props.api]);
   React82.useEffect(() => {
@@ -56453,7 +56477,11 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener(selectionChanged, onSelectionChanged);
     onSelectionChanged();
     return () => {
-      props.api.removeEventListener(selectionChanged, onSelectionChanged);
+      removeEventListenerFromGrid(
+        selectionChanged,
+        onSelectionChanged,
+        props.api
+      );
     };
   }, [isFirstColumn2, selectAll]);
   const { ref, isOverflowing, recalculate } = useOverflowObserver();
@@ -56465,8 +56493,8 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener("cellMouseOver", handler);
     props.api.addEventListener("columnResized", handler);
     return () => {
-      props.api.removeEventListener("cellMouseOver", handler);
-      props.api.removeEventListener("columnResized", handler);
+      removeEventListenerFromGrid("cellMouseOver", handler, props.api);
+      removeEventListenerFromGrid("columnResized", handler, props.api);
     };
   }, []);
   React82.useEffect(() => {
@@ -56492,8 +56520,16 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener(selectionChanged, updateSelectAllCheckbox);
     props.api.addEventListener(paginationChanged, updateSelectAllCheckbox);
     return () => {
-      props.api.removeEventListener(selectionChanged, updateSelectAllCheckbox);
-      props.api.removeEventListener(paginationChanged, updateSelectAllCheckbox);
+      removeEventListenerFromGrid(
+        selectionChanged,
+        updateSelectAllCheckbox,
+        props.api
+      );
+      removeEventListenerFromGrid(
+        paginationChanged,
+        updateSelectAllCheckbox,
+        props.api
+      );
     };
   }, [isFirstColumn2, props.selectionSSREnabled, props.api, onSSDR]);
   const toggleSelectAll = React82.useCallback(() => {
@@ -56704,7 +56740,7 @@ function CustomLoader(params) {
         level: params.node.level,
         lastRowInGroup: params.node === groupNodes.last
       }
-    ), /* @__PURE__ */ React82.createElement(Spinner2, { loading: true, size: "sm" }), /* @__PURE__ */ React82.createElement(Box, { paddingLeft: "sm" }, /* @__PURE__ */ React82.createElement(Typography, { color: "gray15", italic: true, intent: "small" }, I18n.t(
+    ), /* @__PURE__ */ React82.createElement(Spinner, { loading: true, size: "sm" }), /* @__PURE__ */ React82.createElement(Box, { paddingLeft: "sm" }, /* @__PURE__ */ React82.createElement(Typography, { color: "gray15", italic: true, intent: "small" }, I18n.t(
       `dataTable.loading.${params.node === groupNodes.first ? "initial" : "secondary"}`
     ))));
   }
@@ -56714,7 +56750,7 @@ var DefaultFrameworkComponents = {
   agColumnHeader: GenericHeaderRenderer,
   agLoadingCellRenderer: CustomLoader,
   agColumnGroupHeader: GenericColumnGroupHeader,
-  loadingOverlayRenderer: Spinner2,
+  loadingOverlayRenderer: Spinner,
   emptyStateRenderer: EmptyState
 };
 function getFrameworkComponents(headerMenuConfig, onSelectAll, selectionSSREnabled) {
@@ -58861,12 +58897,18 @@ var useRowSelectionState = () => {
   const { gridApi, rowSelectionRef } = useInternalTableContext();
   React82.useEffect(() => {
     function selectionEventFunction() {
-      setSelectedRows(getSelectedRows({ gridApi, rowSelectionRef }));
+      if (!(gridApi == null ? void 0 : gridApi.destroyCalled)) {
+        setSelectedRows(getSelectedRows({ gridApi, rowSelectionRef }));
+      }
     }
     selectionEventFunction();
     gridApi == null ? void 0 : gridApi.addEventListener("selectionChanged", selectionEventFunction);
     return () => {
-      gridApi == null ? void 0 : gridApi.removeEventListener("selectionChanged", selectionEventFunction);
+      removeEventListenerFromGrid(
+        "selectionChanged",
+        selectionEventFunction,
+        gridApi
+      );
     };
   }, [gridApi]);
   return selectedRows;
@@ -76369,7 +76411,7 @@ function personOptionRenderer(editorParams) {
   };
 }
 function LoadingField() {
-  return /* @__PURE__ */ React82.createElement(Box, { marginTop: "md" }, /* @__PURE__ */ React82.createElement(Spinner, { size: "sm", loading: true }));
+  return /* @__PURE__ */ React82.createElement(Box, { marginTop: "md" }, /* @__PURE__ */ React82.createElement(Spinner$1, { size: "sm", loading: true }));
 }
 function RadioList({
   getId: getId3,
@@ -76704,7 +76746,7 @@ var BulkEditInput = (props) => {
         );
       } else {
         console.warn(
-          `@procore/labs-data-table: Unable to find the field for ${props.editor}. Will fallback to a Form.Text.`
+          `@procore/data-table: Unable to find the field for ${props.editor}. Will fallback to a Form.Text.`
         );
         return defaultField;
       }
@@ -77179,9 +77221,10 @@ var ConfigurationColumns = React82.forwardRef(
         onDisplayedColumnsChanged
       );
       return () => {
-        gridApi == null ? void 0 : gridApi.removeEventListener(
+        removeEventListenerFromGrid(
           "displayedColumnsChanged",
-          onDisplayedColumnsChanged
+          onDisplayedColumnsChanged,
+          gridApi
         );
       };
     }, [gridApi, colDefs]);
@@ -78050,9 +78093,10 @@ var RowGroupSelector = ({ localeText }) => {
       onDisplayedColumnsChanged
     );
     return () => {
-      gridApi == null ? void 0 : gridApi.removeEventListener(
+      removeEventListenerFromGrid(
         "displayedColumnsChanged",
-        onDisplayedColumnsChanged
+        onDisplayedColumnsChanged,
+        gridApi
       );
     };
   }, [gridApi]);
@@ -81735,7 +81779,9 @@ var Table = (props) => {
         maxHeight = nodeHeight;
       }
     });
-    gridApi == null ? void 0 : gridApi.setHeaderHeight(maxHeight);
+    if (!(gridApi == null ? void 0 : gridApi.destroyCalled)) {
+      gridApi == null ? void 0 : gridApi.setHeaderHeight(maxHeight);
+    }
   }
   React82.useEffect(() => {
     var _a2, _b2;
@@ -81748,7 +81794,11 @@ var Table = (props) => {
       gridApi.addEventListener("firstDataRendered", setHeaderHeight);
       setHeaderHeight();
       return () => {
-        gridApi.removeEventListener("firstDataRendered", setHeaderHeight);
+        removeEventListenerFromGrid(
+          "firstDataRendered",
+          setHeaderHeight,
+          gridApi
+        );
       };
     }
     return;
@@ -81990,7 +82040,10 @@ var Table = (props) => {
   }, [internalTableContext.onTableConfigChange]);
   const onDisplayedColumnsChanged = React82.useCallback(
     (event) => {
+      var _a2;
       if (props.onRowDragEnd) {
+        if ((_a2 = event.columnApi) == null ? void 0 : _a2.destroyCalled)
+          return;
         const firstVisibleColumn = event.columnApi.getAllGridColumns().find((col) => col.isVisible());
         if (!(firstVisibleColumn == null ? void 0 : firstVisibleColumn.getColDef().rowDrag)) {
           adjustRowDragIcon(event.api, event.columnApi);
@@ -82292,7 +82345,7 @@ var Table = (props) => {
     props.UNSAFE_internalAGGridOverrides ?? {}
   );
   return /* @__PURE__ */ React82.createElement(
-    Spinner2,
+    Spinner,
     {
       loading: loadingStatus.loading,
       label: loadingStatus.message,
@@ -82459,7 +82512,11 @@ var TablePagination = ({
     }
     gridApi == null ? void 0 : gridApi.addEventListener("paginationChanged", onPaginationChanged);
     return () => {
-      gridApi == null ? void 0 : gridApi.removeEventListener("paginationChanged", onPaginationChanged);
+      removeEventListenerFromGrid(
+        "paginationChanged",
+        onPaginationChanged,
+        gridApi
+      );
     };
   }, []);
   return /* @__PURE__ */ React82.createElement(
@@ -83024,7 +83081,7 @@ var LocationQuickFilterOverlay = React82.forwardRef(
           getLabel3(item)
         );
       })),
-      loading && /* @__PURE__ */ React82.createElement(UNSAFE_Menu.Footer, null, /* @__PURE__ */ React82.createElement(Flex, { justifyContent: "center" }, /* @__PURE__ */ React82.createElement(Spinner, { size: "sm" })))
+      loading && /* @__PURE__ */ React82.createElement(UNSAFE_Menu.Footer, null, /* @__PURE__ */ React82.createElement(Flex, { justifyContent: "center" }, /* @__PURE__ */ React82.createElement(Spinner$1, { size: "sm" })))
     ));
   }
 );

package/dist/modern/index.js

@@ -1011,6 +1011,41 @@ var rowHeightMap = {
   [rowSize.md]: "medium",
   [rowSize.lg]: "large"
 };
+var Spinner = ({
+  loading,
+  ...rest
+}) => /* @__PURE__ */ React82__default.default.createElement(coreReact.Box, { "data-qa": loading ? "loading" : "loaded", display: "flex-row", flex: 1 }, /* @__PURE__ */ React82__default.default.createElement(coreReact.Spinner, { loading, size: "md", centered: true, ...rest }));
+function isNestedColumnDefinition(Column2) {
+  return "children" in Column2;
+}
+function isNestedColDef(colDef) {
+  if (!colDef.groupId) {
+    return false;
+  }
+  return "groupId" in colDef;
+}
+function getLeafColDefs(columnDefinitions) {
+  return columnDefinitions.flatMap((colDef) => {
+    return isNestedColDef(colDef) ? getLeafColDefs(colDef.children) : [colDef];
+  });
+}
+function isFirstColumn(params) {
+  const displayedColumns = params?.columnApi?.getAllDisplayedColumns() || [];
+  return displayedColumns.length ? displayedColumns[0] === params.column : false;
+}
+function getCheckboxColumn(columnApi) {
+  const isGrouping = columnApi?.getRowGroupColumns?.()?.length !== 0;
+  if (isGrouping) {
+    return null;
+  }
+  const displayedColumns = columnApi?.getAllDisplayedColumns() || [];
+  return displayedColumns.length ? displayedColumns[0] : null;
+}
+function removeEventListenerFromGrid(event, listener, gridApi) {
+  if (!gridApi || gridApi?.destroyCalled)
+    return;
+  gridApi?.removeEventListener(event, listener);
+}
 
 // src/styles.scss
 var styles_exports = {};
@@ -54010,8 +54045,16 @@ function useFilterState({
     }
     return () => {
       listenersEnabled.current = false;
-      gridApi?.removeEventListener("filterChanged", filterEventFunction);
-      gridApi?.removeEventListener("rowDataUpdated", filterEventFunction);
+      removeEventListenerFromGrid(
+        "filterChanged",
+        filterEventFunction,
+        gridApi
+      );
+      removeEventListenerFromGrid(
+        "rowDataUpdated",
+        filterEventFunction,
+        gridApi
+      );
     };
   }, [gridApi, columnDefinitions]);
   return { allAvailableFilters, changeFilterValue, filterableColumns };
@@ -54493,36 +54536,6 @@ var ServerSideFilter = ({
     )
   );
 };
-var Spinner2 = ({
-  loading,
-  ...rest
-}) => /* @__PURE__ */ React82__default.default.createElement(coreReact.Box, { "data-qa": loading ? "loading" : "loaded", display: "flex-row", flex: 1 }, /* @__PURE__ */ React82__default.default.createElement(coreReact.Spinner, { loading, size: "md", centered: true, ...rest }));
-function isNestedColumnDefinition(Column2) {
-  return "children" in Column2;
-}
-function isNestedColDef(colDef) {
-  if (!colDef.groupId) {
-    return false;
-  }
-  return "groupId" in colDef;
-}
-function getLeafColDefs(columnDefinitions) {
-  return columnDefinitions.flatMap((colDef) => {
-    return isNestedColDef(colDef) ? getLeafColDefs(colDef.children) : [colDef];
-  });
-}
-function isFirstColumn(params) {
-  const displayedColumns = params?.columnApi?.getAllDisplayedColumns() || [];
-  return displayedColumns.length ? displayedColumns[0] === params.column : false;
-}
-function getCheckboxColumn(columnApi) {
-  const isGrouping = columnApi?.getRowGroupColumns?.()?.length !== 0;
-  if (isGrouping) {
-    return null;
-  }
-  const displayedColumns = columnApi?.getAllDisplayedColumns() || [];
-  return displayedColumns.length ? displayedColumns[0] : null;
-}
 
 // src/utils/transformers.ts
 var emptyObject = {};
@@ -55220,7 +55233,7 @@ function ClientSideRowCheckbox(props) {
   React82.useEffect(() => {
     props.api.addEventListener("rowSelected", handleRowSelection);
     return () => {
-      props.api.removeEventListener("rowSelected", handleRowSelection);
+      removeEventListenerFromGrid("rowSelected", handleRowSelection, props.api);
     };
   }, []);
   return /* @__PURE__ */ React82__default.default.createElement(coreReact.Box, { paddingRight: "md" }, /* @__PURE__ */ React82__default.default.createElement(
@@ -55331,7 +55344,11 @@ function GroupCaret(props) {
     props.api.addEventListener("rowGroupOpened", handleRowGroupToggle);
     return () => {
       mounted.current = false;
-      props.api.removeEventListener("rowGroupOpened", handleRowGroupToggle);
+      removeEventListenerFromGrid(
+        "rowGroupOpened",
+        handleRowGroupToggle,
+        props.api
+      );
     };
   }, []);
   return /* @__PURE__ */ React82__default.default.createElement(coreReact.Box, { className: AutoGroupCell_default.expandableCaret }, props.node.isExpandable() && /* @__PURE__ */ React82__default.default.createElement(
@@ -55357,7 +55374,11 @@ var AutoGroupCellRenderer = (props) => {
   React82.useEffect(() => {
     props.api.addEventListener("cellValueChanged", handleCellValueChange);
     return () => {
-      props.api.removeEventListener("cellValueChanged", handleCellValueChange);
+      removeEventListenerFromGrid(
+        "cellValueChanged",
+        handleCellValueChange,
+        props.api
+      );
     };
   }, []);
   const adjustedLevel = props.node.footer ? props.node.level + 1 : props.node.level;
@@ -56208,7 +56229,7 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener("columnMoved", calculatePosition);
     calculatePosition();
     return () => {
-      props.api.removeEventListener("columnMoved", calculatePosition);
+      removeEventListenerFromGrid("columnMoved", calculatePosition, props.api);
     };
   }, []);
   const onSortToggled = (event) => {
@@ -56285,7 +56306,11 @@ var GenericHeaderRenderer = (props) => {
     };
     props.api?.addEventListener("expandOrCollapseAll", onExpandAllChange);
     return () => {
-      props.api?.removeEventListener("expandOrCollapseAll", onExpandAllChange);
+      removeEventListenerFromGrid(
+        "expandOrCollapseAll",
+        onExpandAllChange,
+        props.api
+      );
     };
   }, [props.api]);
   React82__default.default.useEffect(() => {
@@ -56376,7 +56401,11 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener(selectionChanged, onSelectionChanged);
     onSelectionChanged();
     return () => {
-      props.api.removeEventListener(selectionChanged, onSelectionChanged);
+      removeEventListenerFromGrid(
+        selectionChanged,
+        onSelectionChanged,
+        props.api
+      );
     };
   }, [isFirstColumn2, selectAll]);
   const { ref, isOverflowing, recalculate } = useOverflowObserver();
@@ -56385,8 +56414,8 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener("cellMouseOver", handler);
     props.api.addEventListener("columnResized", handler);
     return () => {
-      props.api.removeEventListener("cellMouseOver", handler);
-      props.api.removeEventListener("columnResized", handler);
+      removeEventListenerFromGrid("cellMouseOver", handler, props.api);
+      removeEventListenerFromGrid("columnResized", handler, props.api);
     };
   }, []);
   React82__default.default.useEffect(() => {
@@ -56412,8 +56441,16 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener(selectionChanged, updateSelectAllCheckbox);
     props.api.addEventListener(paginationChanged, updateSelectAllCheckbox);
     return () => {
-      props.api.removeEventListener(selectionChanged, updateSelectAllCheckbox);
-      props.api.removeEventListener(paginationChanged, updateSelectAllCheckbox);
+      removeEventListenerFromGrid(
+        selectionChanged,
+        updateSelectAllCheckbox,
+        props.api
+      );
+      removeEventListenerFromGrid(
+        paginationChanged,
+        updateSelectAllCheckbox,
+        props.api
+      );
     };
   }, [isFirstColumn2, props.selectionSSREnabled, props.api, onSSDR]);
   const toggleSelectAll = React82__default.default.useCallback(() => {
@@ -56621,7 +56658,7 @@ function CustomLoader(params) {
         level: params.node.level,
         lastRowInGroup: params.node === groupNodes.last
       }
-    ), /* @__PURE__ */ React82__default.default.createElement(Spinner2, { loading: true, size: "sm" }), /* @__PURE__ */ React82__default.default.createElement(coreReact.Box, { paddingLeft: "sm" }, /* @__PURE__ */ React82__default.default.createElement(coreReact.Typography, { color: "gray15", italic: true, intent: "small" }, I18n.t(
+    ), /* @__PURE__ */ React82__default.default.createElement(Spinner, { loading: true, size: "sm" }), /* @__PURE__ */ React82__default.default.createElement(coreReact.Box, { paddingLeft: "sm" }, /* @__PURE__ */ React82__default.default.createElement(coreReact.Typography, { color: "gray15", italic: true, intent: "small" }, I18n.t(
       `dataTable.loading.${params.node === groupNodes.first ? "initial" : "secondary"}`
     ))));
   }
@@ -56631,7 +56668,7 @@ var DefaultFrameworkComponents = {
   agColumnHeader: GenericHeaderRenderer,
   agLoadingCellRenderer: CustomLoader,
   agColumnGroupHeader: GenericColumnGroupHeader,
-  loadingOverlayRenderer: Spinner2,
+  loadingOverlayRenderer: Spinner,
   emptyStateRenderer: EmptyState
 };
 function getFrameworkComponents(headerMenuConfig, onSelectAll, selectionSSREnabled) {
@@ -58768,12 +58805,18 @@ var useRowSelectionState = () => {
   const { gridApi, rowSelectionRef } = useInternalTableContext();
   React82__default.default.useEffect(() => {
     function selectionEventFunction() {
-      setSelectedRows(getSelectedRows({ gridApi, rowSelectionRef }));
+      if (!gridApi?.destroyCalled) {
+        setSelectedRows(getSelectedRows({ gridApi, rowSelectionRef }));
+      }
     }
     selectionEventFunction();
     gridApi?.addEventListener("selectionChanged", selectionEventFunction);
     return () => {
-      gridApi?.removeEventListener("selectionChanged", selectionEventFunction);
+      removeEventListenerFromGrid(
+        "selectionChanged",
+        selectionEventFunction,
+        gridApi
+      );
     };
   }, [gridApi]);
   return selectedRows;
@@ -76602,7 +76645,7 @@ var BulkEditInput = (props) => {
         );
       } else {
         console.warn(
-          `@procore/labs-data-table: Unable to find the field for ${props.editor}. Will fallback to a Form.Text.`
+          `@procore/data-table: Unable to find the field for ${props.editor}. Will fallback to a Form.Text.`
         );
         return defaultField;
       }
@@ -77063,9 +77106,10 @@ var ConfigurationColumns = React82__default.default.forwardRef(
         onDisplayedColumnsChanged
       );
       return () => {
-        gridApi?.removeEventListener(
+        removeEventListenerFromGrid(
           "displayedColumnsChanged",
-          onDisplayedColumnsChanged
+          onDisplayedColumnsChanged,
+          gridApi
         );
       };
     }, [gridApi, colDefs]);
@@ -77910,9 +77954,10 @@ var RowGroupSelector = ({ localeText }) => {
       onDisplayedColumnsChanged
     );
     return () => {
-      gridApi?.removeEventListener(
+      removeEventListenerFromGrid(
         "displayedColumnsChanged",
-        onDisplayedColumnsChanged
+        onDisplayedColumnsChanged,
+        gridApi
       );
     };
   }, [gridApi]);
@@ -81565,7 +81610,9 @@ var Table = (props) => {
         maxHeight = nodeHeight;
       }
     });
-    gridApi?.setHeaderHeight(maxHeight);
+    if (!gridApi?.destroyCalled) {
+      gridApi?.setHeaderHeight(maxHeight);
+    }
   }
   React82__default.default.useEffect(() => {
     if (gridApi && columnApi && internalTableContext.tableRef?.current) {
@@ -81576,7 +81623,11 @@ var Table = (props) => {
       gridApi.addEventListener("firstDataRendered", setHeaderHeight);
       setHeaderHeight();
       return () => {
-        gridApi.removeEventListener("firstDataRendered", setHeaderHeight);
+        removeEventListenerFromGrid(
+          "firstDataRendered",
+          setHeaderHeight,
+          gridApi
+        );
       };
     }
     return;
@@ -81808,6 +81859,8 @@ var Table = (props) => {
   const onDisplayedColumnsChanged = React82__default.default.useCallback(
     (event) => {
       if (props.onRowDragEnd) {
+        if (event.columnApi?.destroyCalled)
+          return;
         const firstVisibleColumn = event.columnApi.getAllGridColumns().find((col) => col.isVisible());
         if (!firstVisibleColumn?.getColDef().rowDrag) {
           adjustRowDragIcon(event.api, event.columnApi);
@@ -82101,7 +82154,7 @@ var Table = (props) => {
     props.UNSAFE_internalAGGridOverrides ?? {}
   );
   return /* @__PURE__ */ React82__default.default.createElement(
-    Spinner2,
+    Spinner,
     {
       loading: loadingStatus.loading,
       label: loadingStatus.message,
@@ -82268,7 +82321,11 @@ var TablePagination = ({
     }
     gridApi?.addEventListener("paginationChanged", onPaginationChanged);
     return () => {
-      gridApi?.removeEventListener("paginationChanged", onPaginationChanged);
+      removeEventListenerFromGrid(
+        "paginationChanged",
+        onPaginationChanged,
+        gridApi
+      );
     };
   }, []);
   return /* @__PURE__ */ React82__default.default.createElement(