@procore/data-table 14.21.0 → 14.21.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## 14.21.1
+
+### Patch Changes
+
+- 8cca316b7: Fix issue with filters update
+
 ## 14.21.0
 
 ### Minor Changes

package/dist/legacy/index.cjs

@@ -55284,7 +55284,10 @@ function transformServerSideRequestObj(request, filtersState, searchValue) {
     )
   };
 }
-var transformFilterValue = (value) => {
+var transformFilterValue = (value, field, formatter) => {
+  const formattedValue = formatter == null ? void 0 : formatter(value, field);
+  if (formattedValue)
+    return formattedValue;
   if (value == null ? void 0 : value.date)
     return dateFns.formatISO(value.date, { representation: "date" });
   return value.toString();
@@ -55311,8 +55314,11 @@ function getServerSideParams(request, filtersState, searchValue, options = {}) {
       params.set("group", group);
   }
   if (options.filters !== false) {
+    const formatter = options.filterValueFormatter;
     filtersState.forEach((filter) => {
-      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0]) : `[${filter.selected.map(transformFilterValue)}]`;
+      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0], filter.field, formatter) : `[${filter.selected.map(
+        (value2) => transformFilterValue(value2, filter.field, formatter)
+      )}]`;
       params.set(`filters[${filter.field}]`, value);
     });
     request.groupKeys.forEach((groupKey, index) => {
@@ -57656,7 +57662,7 @@ function useFilterStorage({
     setFiltersState((prev) => {
       const columnDefinition = getColumnDefinition(field);
       return {
-        ...filtersState,
+        ...prev,
         selectedFilters: {
           ...prev.selectedFilters,
           [field]: {
@@ -82848,9 +82854,6 @@ var Table = (props) => {
     );
     (_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, _c2;
     (_a2 = props.onRowSelected) == null ? void 0 : _a2.call(props, event);
@@ -83113,7 +83116,6 @@ var Table = (props) => {
             paginationPageSize: props.paginationPageSize || defaultPaginationPageSize,
             popupParent: props.popupParent,
             pinnedBottomRowData: props.pinnedBottomRowData,
-            postProcessPopup,
             rowBuffer: props.rowBuffer,
             rowClassRules,
             rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,

package/dist/legacy/index.d.cts

@@ -470,6 +470,8 @@ interface ColumnDefinition<TValue = any, TRenderer = React.FC<ICellRendererParam
     groupId?: string;
     cellEditor?: TEditor;
     cellEditorParams?: TEditorParams;
+    cellEditorPopup?: boolean;
+    cellEditorPopupPosition?: 'over' | 'under';
     cellCSVFormatter?: (value: TValue) => string;
     cellExcelFormatter?: (value: TValue) => string;
     cellExcelDataType?: string;
@@ -887,6 +889,12 @@ type ServerSideParamsOptions = {
      * @default filters[search]
      */
     searchKey?: string;
+    /**
+     * Custom function for formatting URL params.
+     * This function will help you to format URL params when value is an object.
+     * If the function does not return anything, the default behavior will be used.
+     */
+    filterValueFormatter?: (value: any, field: string) => string | void;
 };
 interface RowActionsConfig extends Omit<ColDef, 'field' | 'pinned' | 'lockPinned' | 'lockVisible'> {
 }

package/dist/legacy/index.d.ts

@@ -470,6 +470,8 @@ interface ColumnDefinition<TValue = any, TRenderer = React.FC<ICellRendererParam
     groupId?: string;
     cellEditor?: TEditor;
     cellEditorParams?: TEditorParams;
+    cellEditorPopup?: boolean;
+    cellEditorPopupPosition?: 'over' | 'under';
     cellCSVFormatter?: (value: TValue) => string;
     cellExcelFormatter?: (value: TValue) => string;
     cellExcelDataType?: string;
@@ -887,6 +889,12 @@ type ServerSideParamsOptions = {
      * @default filters[search]
      */
     searchKey?: string;
+    /**
+     * Custom function for formatting URL params.
+     * This function will help you to format URL params when value is an object.
+     * If the function does not return anything, the default behavior will be used.
+     */
+    filterValueFormatter?: (value: any, field: string) => string | void;
 };
 interface RowActionsConfig extends Omit<ColDef, 'field' | 'pinned' | 'lockPinned' | 'lockVisible'> {
 }

package/dist/legacy/index.js

@@ -55270,7 +55270,10 @@ function transformServerSideRequestObj(request, filtersState, searchValue) {
     )
   };
 }
-var transformFilterValue = (value) => {
+var transformFilterValue = (value, field, formatter) => {
+  const formattedValue = formatter == null ? void 0 : formatter(value, field);
+  if (formattedValue)
+    return formattedValue;
   if (value == null ? void 0 : value.date)
     return formatISO(value.date, { representation: "date" });
   return value.toString();
@@ -55297,8 +55300,11 @@ function getServerSideParams(request, filtersState, searchValue, options = {}) {
       params.set("group", group);
   }
   if (options.filters !== false) {
+    const formatter = options.filterValueFormatter;
     filtersState.forEach((filter) => {
-      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0]) : `[${filter.selected.map(transformFilterValue)}]`;
+      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0], filter.field, formatter) : `[${filter.selected.map(
+        (value2) => transformFilterValue(value2, filter.field, formatter)
+      )}]`;
       params.set(`filters[${filter.field}]`, value);
     });
     request.groupKeys.forEach((groupKey, index) => {
@@ -57642,7 +57648,7 @@ function useFilterStorage({
     setFiltersState((prev) => {
       const columnDefinition = getColumnDefinition(field);
       return {
-        ...filtersState,
+        ...prev,
         selectedFilters: {
           ...prev.selectedFilters,
           [field]: {
@@ -82834,9 +82840,6 @@ var Table = (props) => {
     );
     (_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, _c2;
     (_a2 = props.onRowSelected) == null ? void 0 : _a2.call(props, event);
@@ -83099,7 +83102,6 @@ var Table = (props) => {
             paginationPageSize: props.paginationPageSize || defaultPaginationPageSize,
             popupParent: props.popupParent,
             pinnedBottomRowData: props.pinnedBottomRowData,
-            postProcessPopup,
             rowBuffer: props.rowBuffer,
             rowClassRules,
             rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,

package/dist/modern/index.cjs

@@ -55215,7 +55215,10 @@ function transformServerSideRequestObj(request, filtersState, searchValue) {
     )
   };
 }
-var transformFilterValue = (value) => {
+var transformFilterValue = (value, field, formatter) => {
+  const formattedValue = formatter?.(value, field);
+  if (formattedValue)
+    return formattedValue;
   if (value?.date)
     return dateFns.formatISO(value.date, { representation: "date" });
   return value.toString();
@@ -55241,8 +55244,11 @@ function getServerSideParams(request, filtersState, searchValue, options = {}) {
       params.set("group", group);
   }
   if (options.filters !== false) {
+    const formatter = options.filterValueFormatter;
     filtersState.forEach((filter) => {
-      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0]) : `[${filter.selected.map(transformFilterValue)}]`;
+      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0], filter.field, formatter) : `[${filter.selected.map(
+        (value2) => transformFilterValue(value2, filter.field, formatter)
+      )}]`;
       params.set(`filters[${filter.field}]`, value);
     });
     request.groupKeys.forEach((groupKey, index) => {
@@ -57541,7 +57547,7 @@ function useFilterStorage({
     setFiltersState((prev) => {
       const columnDefinition = getColumnDefinition(field);
       return {
-        ...filtersState,
+        ...prev,
         selectedFilters: {
           ...prev.selectedFilters,
           [field]: {
@@ -82639,9 +82645,6 @@ var Table = (props) => {
     );
     props.UNSAFE_internalAGGridOverrides?.onGridReady?.(params);
   };
-  const postProcessPopup = (params) => {
-    params.ePopup.style.top = `${HEADER_HEIGHT}px`;
-  };
   const internalOnRowSelected = (event) => {
     props.onRowSelected?.(event);
     if (props.siblingGroupsRowSelectionDisabled) {
@@ -82901,7 +82904,6 @@ var Table = (props) => {
             paginationPageSize: props.paginationPageSize || defaultPaginationPageSize,
             popupParent: props.popupParent,
             pinnedBottomRowData: props.pinnedBottomRowData,
-            postProcessPopup,
             rowBuffer: props.rowBuffer,
             rowClassRules,
             rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,

package/dist/modern/index.d.cts

@@ -470,6 +470,8 @@ interface ColumnDefinition<TValue = any, TRenderer = React.FC<ICellRendererParam
     groupId?: string;
     cellEditor?: TEditor;
     cellEditorParams?: TEditorParams;
+    cellEditorPopup?: boolean;
+    cellEditorPopupPosition?: 'over' | 'under';
     cellCSVFormatter?: (value: TValue) => string;
     cellExcelFormatter?: (value: TValue) => string;
     cellExcelDataType?: string;
@@ -887,6 +889,12 @@ type ServerSideParamsOptions = {
      * @default filters[search]
      */
     searchKey?: string;
+    /**
+     * Custom function for formatting URL params.
+     * This function will help you to format URL params when value is an object.
+     * If the function does not return anything, the default behavior will be used.
+     */
+    filterValueFormatter?: (value: any, field: string) => string | void;
 };
 interface RowActionsConfig extends Omit<ColDef, 'field' | 'pinned' | 'lockPinned' | 'lockVisible'> {
 }

package/dist/modern/index.d.ts

@@ -470,6 +470,8 @@ interface ColumnDefinition<TValue = any, TRenderer = React.FC<ICellRendererParam
     groupId?: string;
     cellEditor?: TEditor;
     cellEditorParams?: TEditorParams;
+    cellEditorPopup?: boolean;
+    cellEditorPopupPosition?: 'over' | 'under';
     cellCSVFormatter?: (value: TValue) => string;
     cellExcelFormatter?: (value: TValue) => string;
     cellExcelDataType?: string;
@@ -887,6 +889,12 @@ type ServerSideParamsOptions = {
      * @default filters[search]
      */
     searchKey?: string;
+    /**
+     * Custom function for formatting URL params.
+     * This function will help you to format URL params when value is an object.
+     * If the function does not return anything, the default behavior will be used.
+     */
+    filterValueFormatter?: (value: any, field: string) => string | void;
 };
 interface RowActionsConfig extends Omit<ColDef, 'field' | 'pinned' | 'lockPinned' | 'lockVisible'> {
 }

package/dist/modern/index.js

@@ -55201,7 +55201,10 @@ function transformServerSideRequestObj(request, filtersState, searchValue) {
     )
   };
 }
-var transformFilterValue = (value) => {
+var transformFilterValue = (value, field, formatter) => {
+  const formattedValue = formatter?.(value, field);
+  if (formattedValue)
+    return formattedValue;
   if (value?.date)
     return formatISO(value.date, { representation: "date" });
   return value.toString();
@@ -55227,8 +55230,11 @@ function getServerSideParams(request, filtersState, searchValue, options = {}) {
       params.set("group", group);
   }
   if (options.filters !== false) {
+    const formatter = options.filterValueFormatter;
     filtersState.forEach((filter) => {
-      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0]) : `[${filter.selected.map(transformFilterValue)}]`;
+      const value = filter.selected.length === 1 ? transformFilterValue(filter.selected[0], filter.field, formatter) : `[${filter.selected.map(
+        (value2) => transformFilterValue(value2, filter.field, formatter)
+      )}]`;
       params.set(`filters[${filter.field}]`, value);
     });
     request.groupKeys.forEach((groupKey, index) => {
@@ -57527,7 +57533,7 @@ function useFilterStorage({
     setFiltersState((prev) => {
       const columnDefinition = getColumnDefinition(field);
       return {
-        ...filtersState,
+        ...prev,
         selectedFilters: {
           ...prev.selectedFilters,
           [field]: {
@@ -82625,9 +82631,6 @@ var Table = (props) => {
     );
     props.UNSAFE_internalAGGridOverrides?.onGridReady?.(params);
   };
-  const postProcessPopup = (params) => {
-    params.ePopup.style.top = `${HEADER_HEIGHT}px`;
-  };
   const internalOnRowSelected = (event) => {
     props.onRowSelected?.(event);
     if (props.siblingGroupsRowSelectionDisabled) {
@@ -82887,7 +82890,6 @@ var Table = (props) => {
             paginationPageSize: props.paginationPageSize || defaultPaginationPageSize,
             popupParent: props.popupParent,
             pinnedBottomRowData: props.pinnedBottomRowData,
-            postProcessPopup,
             rowBuffer: props.rowBuffer,
             rowClassRules,
             rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@procore/data-table",
-  "version": "14.21.0",
+  "version": "14.21.1",
   "description": "Complex data grid built on top of ag-grid, with DST components and styles.",
   "type": "module",
   "main": "dist/legacy/index.cjs",