@procore/data-table 14.13.0 → 14.15.0

package/dist/legacy/index.cjs

@@ -9,6 +9,7 @@ var coreIcons = require('@procore/core-icons');
 var classNames = require('classnames');
 var dateFns = require('date-fns');
 var labsFinancialsUtils = require('@procore/labs-financials-utils');
+var format = require('@procore/labs-financials-utils/dist/format');
 var ulid$1 = require('ulid');
 var toastAlert = require('@procore/toast-alert');
 var ReactDOM = require('react-dom');
@@ -1423,7 +1424,7 @@ ag-grid, ag-grid-angular, ag-grid-ng2, ag-grid-polymer, ag-grid-aurelia {
   animation-iteration-count: infinite;
   animation-name: ag-shake-left-to-right;
 }
-@keyframes _ag-shake-left-to-right_1c24o_369 {
+@keyframes _ag-shake-left-to-right_ye2ai_369 {
   from {
     padding-left: 6px;
     padding-right: 2px;
@@ -5424,7 +5425,7 @@ input[class^=ag-][type=button]:focus, button[class^=ag-]:focus {
   animation-iteration-count: infinite;
   animation-timing-function: linear;
 }
-@keyframes _spin_1c24o_1 {
+@keyframes _spin_ye2ai_1 {
   from {
     transform: rotate(0deg);
   }
@@ -7509,10 +7510,15 @@ input[class^=ag-][type=range]:disabled {
 }
 .ag-theme-alpine.ag-theme-alpine .ag-row--dt-active {
   background-color: #e4ecfb;
-  border-left: 4px solid #2066df;
 }
-.ag-theme-alpine.ag-theme-alpine .ag-row--dt-active > .ag-cell {
-  padding-left: 12px;
+.ag-theme-alpine.ag-theme-alpine .ag-row--dt-active::before {
+  background-color: #2066df;
+  content: "";
+  width: 4px;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
 }
 .ag-theme-alpine.ag-theme-alpine .ag-row--dt-overdue span {
   color: #e61920;
@@ -7924,7 +7930,7 @@ input[class^=ag-][type=range]:disabled {
   padding-left: 16px;
 }
 
-div._contextPanel_1c24o_7148 {
+div._contextPanel_ye2ai_7153 {
   width: 400px;
   transition: all ease 500ms;
   flex: 0 0 auto;
@@ -7933,7 +7939,7 @@ div._contextPanel_1c24o_7148 {
   border: 1px solid #d6dadc;
   display: flex;
 }
-div._contextPanel--hidden_1c24o_7157 {
+div._contextPanel--hidden_ye2ai_7162 {
   border: none;
   overflow: hidden;
   padding: 0px;
@@ -7941,50 +7947,50 @@ div._contextPanel--hidden_1c24o_7157 {
   width: 0px;
 }
 
-._contextPanelWrapper_1c24o_7165 {
+._contextPanelWrapper_ye2ai_7170 {
   position: relative;
   flex-grow: 1;
 }
 
-._contextPanelBody_1c24o_7170 {
+._contextPanelBody_ye2ai_7175 {
   width: clamp(380px, 400px, 100%);
 }
 
-._contextPanel-stickyHeader_1c24o_7174 {
+._contextPanel-stickyHeader_ye2ai_7179 {
   background-color: #ffffff;
   position: sticky;
   top: 0;
   z-index: 5;
 }
 
-._filters-list_1c24o_7181 {
+._filters-list_ye2ai_7186 {
   padding: 0;
   margin: 0;
 }
-._filters-list_1c24o_7181 ol {
+._filters-list_ye2ai_7186 ol {
   padding: 0;
   margin: 0;
 }
 
-._col-drag-column-icon_1c24o_7190 {
+._col-drag-column-icon_ye2ai_7195 {
   color: #6a767c;
 }
 
-._tabular-nums_1c24o_7194 {
+._tabular-nums_ye2ai_7199 {
   font-variant-numeric: tabular-nums;
 }`;
 document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
 var styles_default = {
-  "contextPanel": "_contextPanel_1c24o_7148",
-  "contextPanel--hidden": "_contextPanel--hidden_1c24o_7157",
-  "contextPanelWrapper": "_contextPanelWrapper_1c24o_7165",
-  "contextPanelBody": "_contextPanelBody_1c24o_7170",
-  "contextPanel-stickyHeader": "_contextPanel-stickyHeader_1c24o_7174",
-  "filters-list": "_filters-list_1c24o_7181",
-  "col-drag-column-icon": "_col-drag-column-icon_1c24o_7190",
-  "tabular-nums": "_tabular-nums_1c24o_7194",
-  "ag-shake-left-to-right": "_ag-shake-left-to-right_1c24o_369",
-  "spin": "_spin_1c24o_1"
+  "contextPanel": "_contextPanel_ye2ai_7153",
+  "contextPanel--hidden": "_contextPanel--hidden_ye2ai_7162",
+  "contextPanelWrapper": "_contextPanelWrapper_ye2ai_7170",
+  "contextPanelBody": "_contextPanelBody_ye2ai_7175",
+  "contextPanel-stickyHeader": "_contextPanel-stickyHeader_ye2ai_7179",
+  "filters-list": "_filters-list_ye2ai_7186",
+  "col-drag-column-icon": "_col-drag-column-icon_ye2ai_7195",
+  "tabular-nums": "_tabular-nums_ye2ai_7199",
+  "ag-shake-left-to-right": "_ag-shake-left-to-right_ye2ai_369",
+  "spin": "_spin_ye2ai_1"
 };
 
 // src/utils/getCellValueTypographyProps.ts
@@ -8665,12 +8671,12 @@ var DateCellValue = ({
   value
 }) => {
   var _a, _b;
-  const { format } = coreReact.useDateTime();
+  const { format: format2 } = coreReact.useDateTime();
   if (isGroup || isEmptyValue(value)) {
     return null;
   }
   const parsedValue = getDateObject(value);
-  const internalValue = parsedValue ? format(
+  const internalValue = parsedValue ? format2(
     parsedValue,
     ((_a = columnDefinition.cellRendererParams) == null ? void 0 : _a.dateFormatType) || "numeric-date"
   ) : void 0;
@@ -8739,12 +8745,12 @@ var DateTimeCellValue = ({
   value
 }) => {
   var _a, _b;
-  const { format } = coreReact.useDateTime();
+  const { format: format2 } = coreReact.useDateTime();
   if (isGroup || isEmptyValue(value)) {
     return null;
   }
   const parsedValue = getDateObject2(value);
-  const internalValue = parsedValue ? format(
+  const internalValue = parsedValue ? format2(
     parsedValue,
     ((_a = columnDefinition.cellRendererParams) == null ? void 0 : _a.dateFormatType) || "abbr-weekday-abbr-date-at-time"
   ) : void 0;
@@ -16667,7 +16673,7 @@ var calculateOrdinal = (value) => {
   }
   return "th";
 };
-function dateToFormattedString(date, format = "YYYY-MM-DD") {
+function dateToFormattedString(date, format2 = "YYYY-MM-DD") {
   const fullYear = padStartWidthZeros(date.getFullYear(), 4);
   const months = [
     "January",
@@ -16711,7 +16717,7 @@ function dateToFormattedString(date, format = "YYYY-MM-DD") {
     d: () => `${date.getDay()}`
   };
   const regexp = new RegExp(Object.keys(replace).join("|"), "g");
-  return format.replace(regexp, (match) => {
+  return format2.replace(regexp, (match) => {
     if (match in replace) {
       return replace[match]();
     }
@@ -21354,14 +21360,14 @@ var DateFilterModelFormatter = class extends SimpleFilterModelFormatter {
     const isRange = type == SimpleFilter.IN_RANGE || numberOfInputs === 2;
     const dateFrom = parseDateTimeFromString(condition.dateFrom);
     const dateTo = parseDateTimeFromString(condition.dateTo);
-    const format = this.dateFilterParams.inRangeFloatingFilterDateFormat;
+    const format2 = this.dateFilterParams.inRangeFloatingFilterDateFormat;
     if (isRange) {
-      const formattedFrom = dateFrom !== null ? dateToFormattedString(dateFrom, format) : "null";
-      const formattedTo = dateTo !== null ? dateToFormattedString(dateTo, format) : "null";
+      const formattedFrom = dateFrom !== null ? dateToFormattedString(dateFrom, format2) : "null";
+      const formattedTo = dateTo !== null ? dateToFormattedString(dateTo, format2) : "null";
       return `${formattedFrom}-${formattedTo}`;
     }
     if (dateFrom != null) {
-      return dateToFormattedString(dateFrom, format);
+      return dateToFormattedString(dateFrom, format2);
     }
     return `${type}`;
   }
@@ -52984,7 +52990,27 @@ var InternalLinkCellRenderer = ({ columnDefinition, isGroup, data, rowHeight, va
   if (isGroup) {
     return /* @__PURE__ */ React76__default.default.createElement(coreReact.Typography, { ...typographyProps, className, weight: "semibold" }, value);
   }
+  const isExternalLink = columnDefinition.cellRendererParams.isExternalLink ?? false;
   const URL = columnDefinition.cellRendererParams.getURL(value, data);
+  if (isExternalLink && value && URL) {
+    return /* @__PURE__ */ React76__default.default.createElement(
+      coreReact.Typography,
+      {
+        ...typographyProps,
+        className,
+        style: { display: "flex", alignItems: "center", gap: "5px" }
+      },
+      internalValue,
+      /* @__PURE__ */ React76__default.default.createElement(
+        coreIcons.ExternalLink,
+        {
+          cursor: "pointer",
+          size: "sm",
+          onClick: () => window.open(URL, "_blank")
+        }
+      )
+    );
+  }
   return URL ? /* @__PURE__ */ React76__default.default.createElement(coreReact.Typography, { ...typographyProps, className }, /* @__PURE__ */ React76__default.default.createElement(coreReact.Link, { href: URL }, internalValue)) : /* @__PURE__ */ React76__default.default.createElement(coreReact.Typography, { ...typographyProps }, internalValue);
 };
 var LinkCellRenderer = withDataTableRenderer(
@@ -53013,9 +53039,10 @@ var InternalNumberCellRenderer = ({ columnDefinition, rowPinned, isGroup, value
     }
     return /* @__PURE__ */ React76__default.default.createElement(React76__default.default.Fragment, null);
   }
-  const internalValue = labsFinancialsUtils.formatNumber(value, {
+  const internalValue = format.format(value, {
     maxDecimalPrecision: 15,
     minDecimalPrecision: 0,
+    shouldUseGtk: true,
     symbol: "",
     ...(_d = columnDefinition.cellRendererParams) == null ? void 0 : _d.formatConfig
   });
@@ -53407,7 +53434,7 @@ var Renderer9 = ({
   rowPinned
 }) => {
   var _a, _b, _c, _d;
-  const { getColor } = columnDefinition.cellRendererParams;
+  const { getColor, displayAsPill } = columnDefinition.cellRendererParams;
   const I18n = coreReact.useI18nContext();
   if (isEmptyValue(value)) {
     if (isGroup) {
@@ -53433,10 +53460,10 @@ var Renderer9 = ({
   const typographyProps = getCellValueTypographyProps(
     (_d = columnDefinition.cellRendererParams) == null ? void 0 : _d.typographyProps
   );
-  if (isGroup || rowPinned && columnDefinition.aggFunc) {
+  if ((isGroup || rowPinned && columnDefinition.aggFunc) && !displayAsPill) {
     return /* @__PURE__ */ React76__default.default.createElement(coreReact.Typography, { ...typographyProps, weight: "semibold" }, label);
   }
-  return /* @__PURE__ */ React76__default.default.createElement(coreReact.Pill, { color: getColor(value), className: cx10("pill-cell") }, label == null ? void 0 : label.toUpperCase());
+  return /* @__PURE__ */ React76__default.default.createElement(coreReact.Pill, { color: getColor(value), className: cx10("pill-cell") }, label);
 };
 var PillCellRenderer = withDataTableRenderer(Renderer9, "select");
 var Editor5 = React76__default.default.forwardRef(
@@ -53473,7 +53500,7 @@ var Editor5 = React76__default.default.forwardRef(
     function getLabel3(item) {
       var _a2;
       const unformattedLabel = ((_a2 = columnDefinition.getStringFormattedValue) == null ? void 0 : _a2.call(columnDefinition, item)) || "";
-      return unformattedLabel.toUpperCase();
+      return unformattedLabel;
     }
     return /* @__PURE__ */ React76__default.default.createElement(
       coreReact.PillSelect,
@@ -54872,8 +54899,8 @@ function transformToExcelStyles(excelDataFormats) {
   if (excelDataFormats === void 0) {
     return void 0;
   }
-  return excelDataFormats.map((format) => {
-    const { id, ...rest } = format;
+  return excelDataFormats.map((format2) => {
+    const { id, ...rest } = format2;
     return {
       id: toExcelCellClass(id),
       ...rest
@@ -55914,7 +55941,7 @@ var DataTableCellRenderer = ({
   value,
   setValue
 }) => {
-  var _a, _b, _c;
+  var _a, _b, _c, _d, _e, _f;
   const { columnApi } = useInternalTableContext();
   const columnDefinition = transformToColumnDefinition(colDef);
   const validationOutput = ((_a = colDef.valueValidator) == null ? void 0 : _a.call(colDef, {
@@ -55949,6 +55976,8 @@ var DataTableCellRenderer = ({
     value
   };
   const hasValue = value !== void 0 && value !== null && value !== "";
+  const isSelectCellComponent = ((_c = (_b = columnDefinition.cellEditor) == null ? void 0 : _b.render) == null ? void 0 : _c.displayName) === "SelectCellEditor";
+  const URL = isSelectCellComponent && ((_d = columnDefinition == null ? void 0 : columnDefinition.cellRendererParams) == null ? void 0 : _d.getURL) ? columnDefinition.cellRendererParams.getURL(value) : null;
   const startEditing = React76.useCallback(
     () => api.startEditingCell({
       rowIndex: node.rowIndex,
@@ -55956,34 +55985,54 @@ var DataTableCellRenderer = ({
     }),
     [column2, node]
   );
-  return /* @__PURE__ */ React76__default.default.createElement(React76__default.default.Fragment, null, shouldDisplayRowCheckbox(columnApi, column2, node) && /* @__PURE__ */ React76__default.default.createElement(coreReact.Box, { paddingLeft: "sm" }, /* @__PURE__ */ React76__default.default.createElement(RowCheckbox, { api, data, node })), columnDefinition.editable ? /* @__PURE__ */ React76__default.default.createElement(
-    PseudoInlineEditorWrapper,
-    {
-      showArrow: editorType === "select",
-      onClick: startEditing,
-      onClear: ((_b = columnDefinition.cellEditorParams) == null ? void 0 : _b.clearable) && hasValue ? () => {
-        setValue == null ? void 0 : setValue(null);
-      } : void 0,
-      showCalendar: editorType === "date",
-      rightAligned: colDef.type === "rightAligned",
-      hasValue,
-      alwaysShowEditors: (_c = columnDefinition.cellEditorParams) == null ? void 0 : _c.alwaysShowPseudoEditors,
-      ...validationOutput
-    },
-    /* @__PURE__ */ React76__default.default.createElement(Component4, { ...componentParams })
-  ) : /* @__PURE__ */ React76__default.default.createElement(
-    NonEditorWrapper,
+  return /* @__PURE__ */ React76__default.default.createElement(React76__default.default.Fragment, null, shouldDisplayRowCheckbox(columnApi, column2, node) && /* @__PURE__ */ React76__default.default.createElement(coreReact.Box, { paddingLeft: "sm" }, /* @__PURE__ */ React76__default.default.createElement(RowCheckbox, { api, data, node })), /* @__PURE__ */ React76__default.default.createElement(
+    coreReact.Flex,
     {
-      rightAligned: colDef.type === "rightAligned",
-      ...validationOutput,
-      rowPinned: Boolean(componentParams.rowPinned),
-      isGroup: Boolean(componentParams.isGroup)
+      gap: "5px",
+      alignItems: "center",
+      justifyContent: "center",
+      style: { width: "100%" }
     },
-    /* @__PURE__ */ React76__default.default.createElement(
-      Component4,
+    columnDefinition.editable ? /* @__PURE__ */ React76__default.default.createElement(
+      PseudoInlineEditorWrapper,
+      {
+        showArrow: editorType === "select",
+        onClick: startEditing,
+        onClear: ((_e = columnDefinition.cellEditorParams) == null ? void 0 : _e.clearable) && hasValue ? () => {
+          setValue == null ? void 0 : setValue(null);
+        } : void 0,
+        showCalendar: editorType === "date",
+        rightAligned: colDef.type === "rightAligned",
+        hasValue,
+        alwaysShowEditors: (_f = columnDefinition.cellEditorParams) == null ? void 0 : _f.alwaysShowPseudoEditors,
+        ...validationOutput
+      },
+      /* @__PURE__ */ React76__default.default.createElement(Component4, { ...componentParams })
+    ) : /* @__PURE__ */ React76__default.default.createElement(
+      NonEditorWrapper,
+      {
+        rightAligned: colDef.type === "rightAligned",
+        ...validationOutput,
+        rowPinned: Boolean(componentParams.rowPinned),
+        isGroup: Boolean(componentParams.isGroup)
+      },
+      /* @__PURE__ */ React76__default.default.createElement(
+        Component4,
+        {
+          ...componentParams,
+          tableRef: columnDefinition.cellRendererParams.tableRef
+        }
+      )
+    ),
+    URL && /* @__PURE__ */ React76__default.default.createElement(
+      coreIcons.ExternalLink,
       {
-        ...componentParams,
-        tableRef: columnDefinition.cellRendererParams.tableRef
+        cursor: "pointer",
+        size: "sm",
+        onClick: (e) => {
+          e.stopPropagation();
+          window.open(URL, "_blank");
+        }
       }
     )
   ));
@@ -56625,9 +56674,10 @@ var GenericHeaderRenderer = (props) => {
     props.api.addEventListener("columnRowGroupChanged", updateExpandedState);
     return () => {
       props.column.removeEventListener("sortChanged", onSortChanged);
-      props.api.removeEventListener(
+      removeEventListenerFromGrid(
         "columnRowGroupChanged",
-        updateExpandedState
+        updateExpandedState,
+        props.api
       );
     };
   }, [props.column]);
@@ -57722,6 +57772,7 @@ var InternalTableContext = React76__default.default.createContext({
   getRowHeight: () => () => rowSize.md,
   grandTotalsLabelInnerRenderer: void 0,
   gridApi: void 0,
+  localStoragePersistenceKey: void 0,
   onBulkEditUpdate: () => Promise.resolve(),
   onServerSideDataRequest: void 0,
   onTableConfigChange: () => {
@@ -57738,6 +57789,7 @@ var InternalTableContext = React76__default.default.createContext({
   setRowHeight: () => {
   },
   showExpandCollapseAllToggle: false,
+  expandCollapseStateRef: null,
   tableRef: null,
   getColumnDefinition: () => void 0,
   setSelectedGroupIndex: () => {
@@ -61560,14 +61612,14 @@ var protection_default = protection;
 // ../../node_modules/@ag-grid-enterprise/excel-export/dist/esm/es6/excelExport/files/xml/styles/numberFormat.mjs
 var numberFormat = {
   getTemplate(styleProperties) {
-    const { format } = styleProperties.numberFormat;
+    const { format: format2 } = styleProperties.numberFormat;
     return {
       name: "NumberFormat",
       properties: {
         prefixedAttributes: [{
           prefix: "ss:",
           map: {
-            Format: format
+            Format: format2
           }
         }]
       }
@@ -63518,15 +63570,15 @@ var registerFill = (fill) => {
   }
   return pos;
 };
-var registerNumberFmt = (format) => {
-  format = _.utf8_encode(format);
-  if (numberFormatMap[format]) {
-    return numberFormatMap[format];
+var registerNumberFmt = (format2) => {
+  format2 = _.utf8_encode(format2);
+  if (numberFormatMap[format2]) {
+    return numberFormatMap[format2];
   }
-  let pos = registeredNumberFmts.findIndex((currentFormat) => currentFormat.formatCode === format);
+  let pos = registeredNumberFmts.findIndex((currentFormat) => currentFormat.formatCode === format2);
   if (pos === -1) {
     pos = registeredNumberFmts.length + 164;
-    registeredNumberFmts.push({ formatCode: format, numFmtId: pos });
+    registeredNumberFmts.push({ formatCode: format2, numFmtId: pos });
   } else {
     pos = registeredNumberFmts[pos].numFmtId;
   }
@@ -78185,6 +78237,63 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
   };
 };
 
+// src/utils/expandRows.ts
+var getGroupRowState = (gridApi, groupDefaultExpanded = 0) => {
+  const expandedRoutes = [];
+  const collapsedRoutes = [];
+  if (gridApi) {
+    gridApi.forEachNode((node) => {
+      const route = node.getRoute();
+      if (route) {
+        const routePath = route.join(",");
+        const defaultExpandLevel = groupDefaultExpanded === -1 ? Infinity : groupDefaultExpanded;
+        if (node.level > defaultExpandLevel - 1) {
+          if (node.expanded) {
+            expandedRoutes.push(routePath);
+          }
+        } else if (!node.expanded) {
+          collapsedRoutes.push(routePath);
+        }
+      }
+    });
+  }
+  return { expandedRoutes, collapsedRoutes };
+};
+var setExpandCollapseRow = (gridApi, tableConfig, groupDefaultExpanded = 0) => {
+  var _a, _b;
+  const expandedRoutes = ((_a = tableConfig.groupRowState) == null ? void 0 : _a.expandedRoutes) ?? [];
+  const collapsedRoutes = ((_b = tableConfig.groupRowState) == null ? void 0 : _b.collapsedRoutes) ?? [];
+  gridApi.forEachNode((node) => {
+    const route = node.getRoute();
+    if (route) {
+      const routePath = route.join(",");
+      const defaultExpandLevel = groupDefaultExpanded === -1 ? Infinity : groupDefaultExpanded;
+      if (node.level > defaultExpandLevel - 1) {
+        if (expandedRoutes.includes(routePath)) {
+          node.setExpanded(true);
+        }
+      } else if (collapsedRoutes.includes(routePath)) {
+        node.setExpanded(false);
+      }
+    }
+  });
+};
+var isRowOpenedByDefault = (node, tableConfig, groupDefaultExpanded = 0) => {
+  var _a, _b;
+  const expandedRoutes = ((_a = tableConfig == null ? void 0 : tableConfig.groupRowState) == null ? void 0 : _a.expandedRoutes) ?? [];
+  const collapsedRoutes = ((_b = tableConfig == null ? void 0 : tableConfig.groupRowState) == null ? void 0 : _b.collapsedRoutes) ?? [];
+  const route = node.getRoute();
+  if (!route) {
+    return false;
+  }
+  const routePath = route.join(",");
+  const defaultExpandLevel = groupDefaultExpanded === -1 ? Infinity : groupDefaultExpanded;
+  if (node.level > defaultExpandLevel - 1) {
+    return expandedRoutes.includes(routePath);
+  } else
+    return !collapsedRoutes.includes(routePath);
+};
+
 // src/utils/getRootRowNode.ts
 function getRootRowNode(rowNode) {
   return rowNode.level > 0 && rowNode.parent ? getRootRowNode(rowNode.parent) : rowNode;
@@ -80546,6 +80655,7 @@ function generateHTMLString({
         clearTimeout(exportTimeoutId);
       }
       exportTimeoutId = setTimeout(() => {
+        var _a2, _b2;
         const exportedDocument = document.implementation.createHTMLDocument();
         const printStylesElement = exportedDocument.createElement("style");
         tableContainer.querySelectorAll(
@@ -80624,44 +80734,73 @@ function generateHTMLString({
         if (exportedDocument.querySelector(".ag-header-container") && showTableHeaderOnEveryPage) {
           const tableHeaderStylesElement = exportedDocument.createElement("style");
           tableHeaderStylesElement.innerHTML = `
+            /* Original header styles */
             .ag-header-container {
               height: ${TABLE_HEADER_HEIGHT}px;
               background: ${coreReact.colors.gray96};
               border-bottom: 1px solid #d6dadc;
-              break-before: page;
+            }
+            /* Cloned header styles */
+            .paginated-header {
+              height: ${TABLE_HEADER_HEIGHT}px;
+              background: ${coreReact.colors.gray96};
+              border-bottom: 1px solid #d6dadc;
+              /* Ensure cloned headers start on a new page */
+              page-break-before: always;
             }
           `;
           exportedDocument.head.appendChild(tableHeaderStylesElement);
-          const tableHeader = exportedDocument.querySelector(".ag-header-container").cloneNode(true);
+          const tableHeaderElement = exportedDocument.querySelector(
+            ".ag-header-container"
+          );
+          if (!tableHeaderElement) {
+            return reject(new Error("Table header container not found."));
+          }
+          const tableHeader = tableHeaderElement.cloneNode(true);
+          tableHeader.classList.add("paginated-header");
           const tableRowsContainer = exportedDocument.querySelector(
             ".ag-center-cols-container"
           );
-          const totalRows = tableRowsContainer.children.length;
-          const maxPageContentHeight = pageHeight - pageFormat.marginInPixels.top - pageFormat.marginInPixels.bottom;
-          let pageContentHeight = TABLE_HEADER_HEIGHT;
-          let currentPage = 1;
-          for (let index = 0; index < totalRows; index++) {
-            const getScaledRowHeight = (row3) => {
-              const scale = pageHeight / tableWidth;
-              let rowHeight2 = Number(row3.style.height.replace("px", ""));
-              if (scale < 1) {
-                rowHeight2 *= scale;
+          if (!tableRowsContainer) {
+            console.error("Table rows container not found.");
+            return;
+          }
+          const allRows = Array.from(
+            tableRowsContainer.children
+          );
+          tableRowsContainer.innerHTML = "";
+          const maxPageContentHeight = pageHeight - (((_a2 = pageFormat.marginInPixels) == null ? void 0 : _a2.top) ?? DEFAULT_PAGE_MARGIN) - (((_b2 = pageFormat.marginInPixels) == null ? void 0 : _b2.bottom) ?? DEFAULT_PAGE_MARGIN) - TABLE_HEADER_HEIGHT;
+          let currentPageContentHeight = 0;
+          let rowsInCurrentPage = [];
+          let isFirstPage = true;
+          const appendPage = () => {
+            if (rowsInCurrentPage.length > 0) {
+              if (!isFirstPage) {
+                tableRowsContainer.appendChild(tableHeader.cloneNode(true));
+              } else {
+                isFirstPage = false;
               }
-              return rowHeight2;
-            };
-            const row2 = tableRowsContainer.children[index + currentPage - 1];
-            const rowHeight = getScaledRowHeight(row2);
-            if (pageContentHeight + rowHeight >= maxPageContentHeight) {
-              tableRowsContainer.insertBefore(
-                tableHeader.cloneNode(true),
-                row2
+              rowsInCurrentPage.forEach(
+                (row2) => tableRowsContainer.appendChild(row2)
               );
-              currentPage += 1;
-              pageContentHeight = TABLE_HEADER_HEIGHT;
-            } else {
-              pageContentHeight += rowHeight;
+              rowsInCurrentPage = [];
+              currentPageContentHeight = 0;
             }
-          }
+          };
+          allRows.forEach((row2) => {
+            let rowHeight = parseFloat(row2.style.height.replace("px", "")) || row2.offsetHeight;
+            const scale = pageHeight / tableWidth;
+            if (scale < 1) {
+              rowHeight *= scale;
+            }
+            if (currentPageContentHeight + rowHeight > maxPageContentHeight) {
+              appendPage();
+              isFirstPage = false;
+            }
+            rowsInCurrentPage.push(row2);
+            currentPageContentHeight += rowHeight;
+          });
+          appendPage();
         }
         resolve(exportedDocument.getElementsByTagName("html")[0].outerHTML);
       }, 2e3);
@@ -80707,6 +80846,7 @@ var useTableApi = ({
   columnApi,
   columnDefinitions,
   gridApi,
+  groupDefaultExpanded,
   setLoadingStatus,
   wrapperRef
 }) => {
@@ -80900,10 +81040,33 @@ var useTableApi = ({
   const setSearchValue = React76__default.default.useCallback(
     (value) => {
       gridApi == null ? void 0 : gridApi.setQuickFilter(value);
+      gridApi == null ? void 0 : gridApi.forEachNodeAfterFilterAndSort((node) => {
+        if (node.id) {
+          const currentNode = rowSelectionRef == null ? void 0 : rowSelectionRef.current.affectedRows[node.id];
+          if (currentNode && currentNode.selectedState === rowSelectionState.selected) {
+            node.setSelected(true, false, "checkboxSelected");
+          }
+        }
+      });
       resetPagination();
+      gridApi == null ? void 0 : gridApi.redrawRows();
     },
-    [gridApi]
+    [gridApi, rowSelectionRef.current]
   );
+  React76__default.default.useEffect(() => {
+    function handleRowSelection(event) {
+      if (event.node.displayed && event.node.id) {
+        rowSelectionRef.current.affectedRows[event.node.id] = {
+          node: event.node,
+          selectedState: event.node.isSelected() ? rowSelectionState.selected : rowSelectionState.unselected
+        };
+      }
+    }
+    (gridApi == null ? void 0 : gridApi.addEventListener) && gridApi.addEventListener("rowSelected", handleRowSelection);
+    return () => {
+      removeEventListenerFromGrid("rowSelected", handleRowSelection, gridApi);
+    };
+  }, [gridApi]);
   const setLoading = React76__default.default.useCallback((loading, message = "") => {
     setLoadingStatus({
       loading,
@@ -80965,6 +81128,7 @@ var useTableApi = ({
           adjustRowDragIcon(gridApi, columnApi);
         });
       }
+      setExpandCollapseRow(gridApi, config, groupDefaultExpanded);
     },
     [columnApi, gridApi, internalSetRowHeight, filterStorage.setSelectedFilters]
   );
@@ -81058,7 +81222,8 @@ var useTableApi = ({
       columnApi,
       rowHeight,
       filterStorage,
-      rowSelectionRef
+      rowSelectionRef,
+      groupDefaultExpanded
     }),
     [columnApi, gridApi, rowHeight, filterStorage]
   );
@@ -81332,7 +81497,6 @@ function buildPartialTableApi({
     focusField && (gridApi == null ? void 0 : gridApi.setFocusedCell(rowIndex, focusField));
   };
   return {
-    getVisibleRowNodes,
     applyTransaction,
     applyServerSideTransaction,
     collapseAll,
@@ -81347,6 +81511,7 @@ function buildPartialTableApi({
     getSelectedRows: getSelectedRows2,
     getServerSideSelectionState,
     getTableConfiguration,
+    getVisibleRowNodes,
     refreshCells,
     setPinnedBottomRowData,
     setRowData,
@@ -81464,6 +81629,12 @@ var DataTable = ({
   const [rowHeight, setRowHeight] = React76__default.default.useState(
     (initialTableConfig == null ? void 0 : initialTableConfig.rowHeight) || rowSize.md
   );
+  const expandCollapseStateRef = React76__default.default.useRef(
+    (initialTableConfig == null ? void 0 : initialTableConfig.groupRowState) || {
+      expandedRoutes: [],
+      collapsedRoutes: []
+    }
+  );
   const rowHeightRef = React76__default.default.useRef(
     (initialTableConfig == null ? void 0 : initialTableConfig.rowHeight) || rowSize.md
   );
@@ -81511,12 +81682,14 @@ var DataTable = ({
       if (localStoragePersistenceKey) {
         webSdkStorage.storage.local.setItem(localStoragePersistenceKey, {
           ...config,
+          groupRowState: expandCollapseStateRef.current,
           rowHeight: rowHeightRef.current,
           serverFilters: filterStorage.filtersState
         });
       }
       onTableConfigChange == null ? void 0 : onTableConfigChange({
         ...config,
+        groupRowState: expandCollapseStateRef.current,
         rowHeight: rowHeightRef.current,
         serverFilters: filterStorage.filtersState
       });
@@ -81627,6 +81800,7 @@ var DataTable = ({
         onServerSideDataRequest,
         onTableConfigChange: internalOnTableConfigChange,
         rowSelectionRef,
+        expandCollapseStateRef,
         rowHeight,
         searchStorage,
         selectedGroupIndex,
@@ -81687,7 +81861,7 @@ function getServerSideDatasource(onServerSideDataRequestCallbackRef, onEmptyResp
 }
 var minimumColumnWidth = 140;
 var Table = (props) => {
-  var _a, _b;
+  var _a, _b, _c;
   const { suppressColumnVirtualisation = true, rowActionsConfig = {} } = props;
   const I18n = coreReact.useI18nContext();
   const internalTableContext = useInternalTableContext();
@@ -81729,8 +81903,10 @@ var Table = (props) => {
     columnDefinitions: internalTableContext.columnDefinitions,
     gridApi,
     setLoadingStatus,
-    wrapperRef
+    wrapperRef,
+    groupDefaultExpanded: props.groupDefaultExpanded
   });
+  const initialTableConfig = internalTableContext.initialTableConfig;
   React76__default.default.useImperativeHandle(internalTableContext.tableRef, () => tableApi, [
     tableApi
   ]);
@@ -82044,8 +82220,8 @@ var Table = (props) => {
   );
   const onColumnGroupOpened = React76__default.default.useCallback(
     (event) => {
-      var _a2, _b2, _c;
-      (_c = internalTableContext.analytics) == null ? void 0 : _c.client.addEvent(
+      var _a2, _b2, _c2;
+      (_c2 = internalTableContext.analytics) == null ? void 0 : _c2.client.addEvent(
         "design_system.data_table.column.expand_toggled",
         {
           client: internalTableContext.analytics.clientName,
@@ -82062,14 +82238,14 @@ var Table = (props) => {
   );
   const onColumnPinned = React76__default.default.useCallback(
     (event) => {
-      var _a2, _b2, _c, _d;
+      var _a2, _b2, _c2, _d;
       (_d = internalTableContext.analytics) == null ? void 0 : _d.client.addEvent(
         "design_system.data_table.column.pinned",
         {
           client: internalTableContext.analytics.clientName,
           column: (_a2 = event.column) == null ? void 0 : _a2.getColId(),
           side: (_b2 = event.column) == null ? void 0 : _b2.getPinned(),
-          position: (_c = columnApi == null ? void 0 : columnApi.getColumns()) == null ? void 0 : _c.findIndex(
+          position: (_c2 = columnApi == null ? void 0 : columnApi.getColumns()) == null ? void 0 : _c2.findIndex(
             (col) => {
               var _a3;
               return col.getId() === ((_a3 = event.column) == null ? void 0 : _a3.getColId());
@@ -82168,7 +82344,7 @@ var Table = (props) => {
   const onDragStopped = React76__default.default.useCallback(
     // eslint-disable-next-line complexity
     (event) => {
-      var _a2, _b2, _c;
+      var _a2, _b2, _c2;
       if (event.target.className.includes("ag-header-cell")) {
         internalTableContext.onTableConfigChange();
       }
@@ -82186,7 +82362,7 @@ var Table = (props) => {
           const firstVisibleColumnIndex = allColumns.findIndex(
             (col) => col.isVisible()
           );
-          if (moveColumnEvent.toIndex === firstVisibleColumnIndex || ((_c = moveColumnEvent.column) == null ? void 0 : _c.getColDef().rowDrag)) {
+          if (moveColumnEvent.toIndex === firstVisibleColumnIndex || ((_c2 = moveColumnEvent.column) == null ? void 0 : _c2.getColDef().rowDrag)) {
             adjustRowDragIcon(event.api, event.columnApi);
           }
         }
@@ -82265,27 +82441,55 @@ var Table = (props) => {
       (_a2 = document.getElementsByClassName("ag-body-viewport")[0]) == null ? void 0 : _a2.clientWidth
     );
   }, [setViewportWidth]);
+  const isClientSideGroupOpenByDefault = React76__default.default.useCallback(
+    (params) => {
+      const node = params.rowNode;
+      if (!node) {
+        return false;
+      }
+      return isRowOpenedByDefault(
+        node,
+        initialTableConfig,
+        props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded
+      );
+    },
+    [initialTableConfig, props.groupDefaultExpanded]
+  );
+  const isServerSideGroupOpenByDefault = React76__default.default.useCallback(
+    (params) => {
+      const node = params.rowNode;
+      if (!node) {
+        return false;
+      }
+      return isRowOpenedByDefault(
+        node,
+        initialTableConfig,
+        props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded
+      );
+    },
+    [initialTableConfig, props.groupDefaultExpanded]
+  );
   const onGridReady = (params) => {
-    var _a2, _b2, _c;
+    var _a2, _b2, _c2;
     internalTableContext.setGridApi(params.api);
     internalTableContext.setColumnApi(params.columnApi);
     setViewportWidth(
       (_a2 = document.getElementsByClassName("ag-body-viewport")[0]) == null ? void 0 : _a2.clientWidth
     );
-    (_c = (_b2 = props.UNSAFE_internalAGGridOverrides) == null ? void 0 : _b2.onGridReady) == null ? void 0 : _c.call(_b2, params);
+    (_c2 = (_b2 = props.UNSAFE_internalAGGridOverrides) == null ? void 0 : _b2.onGridReady) == null ? void 0 : _c2.call(_b2, params);
   };
   const postProcessPopup = (params) => {
     params.ePopup.style.top = `${HEADER_HEIGHT}px`;
   };
   const internalOnRowSelected = (event) => {
-    var _a2, _b2, _c;
+    var _a2, _b2, _c2;
     (_a2 = props.onRowSelected) == null ? void 0 : _a2.call(props, event);
     if (props.siblingGroupsRowSelectionDisabled) {
       const rootRowNode = getRootRowNode(event.node);
       if (!event.node.isSelected() && internalTableContext.selectedGroupIndex !== null && (rootRowNode == null ? void 0 : rootRowNode.id) === internalTableContext.selectedGroupIndex && event.api.getSelectedNodes().length === 0) {
         (_b2 = internalTableContext == null ? void 0 : internalTableContext.setSelectedGroupIndex) == null ? void 0 : _b2.call(internalTableContext, null);
       } else {
-        (_c = internalTableContext == null ? void 0 : internalTableContext.setSelectedGroupIndex) == null ? void 0 : _c.call(internalTableContext, (prevState) => {
+        (_c2 = internalTableContext == null ? void 0 : internalTableContext.setSelectedGroupIndex) == null ? void 0 : _c2.call(internalTableContext, (prevState) => {
           return prevState ?? (rootRowNode == null ? void 0 : rootRowNode.id) ?? null;
         });
       }
@@ -82294,13 +82498,26 @@ var Table = (props) => {
   const internalRowGroupOpened = React76__default.default.useCallback(
     (event) => {
       var _a2;
+      if (internalTableContext.expandCollapseStateRef) {
+        internalTableContext.expandCollapseStateRef.current = getGroupRowState(
+          gridApi,
+          props.groupDefaultExpanded
+        );
+      }
+      internalTableContext.onTableConfigChange();
       (_a2 = props.onRowGroupOpened) == null ? void 0 : _a2.call(props, {
         expanded: event.expanded,
         node: serializeNode(event.node),
         rowIndex: event.rowIndex
       });
     },
-    [props.onRowGroupOpened]
+    [
+      props.onRowGroupOpened,
+      internalTableContext.onTableConfigChange,
+      tableApi == null ? void 0 : tableApi.getTableConfiguration(),
+      (_c = internalTableContext.expandCollapseStateRef) == null ? void 0 : _c.current,
+      gridApi
+    ]
   );
   const getGroupRowAgg = React76__default.default.useCallback(
     (params) => {
@@ -82453,6 +82670,8 @@ var Table = (props) => {
             alwaysAggregateAtRootLevel: !onSSDR,
             autoGroupColumnDef: decoratedAutoGroupColDef,
             cacheBlockSize: props.paginationPageSize || defaultPaginationPageSize,
+            isGroupOpenByDefault: isClientSideGroupOpenByDefault,
+            isServerSideGroupOpenByDefault,
             defaultColDef,
             enableGroupEdit: internalTableContext.enableGroupEditAndValidation,
             enableCellTextSelection: internalTableContext.enableCellTextSelection,