@redsift/table 12.5.3-alpha.1 → 12.5.3-alpha.4
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.
- package/_internal/StatefulDataGrid.js +1 -1
- package/_internal/StatefulDataGrid2.js +194 -40
- package/_internal/StatefulDataGrid2.js.map +1 -1
- package/index.d.ts +38 -6
- package/index.js +1 -1
- package/package.json +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { aI as StatefulDataGrid } from './StatefulDataGrid2.js';
|
|
2
2
|
//# sourceMappingURL=StatefulDataGrid.js.map
|
|
@@ -706,7 +706,8 @@ const COLUMN_ORDER_MODEL_KEY = 'columnOrderModel';
|
|
|
706
706
|
const ROW_GROUPING_MODEL_KEY = 'rowGroupingModel';
|
|
707
707
|
const AGGREGATION_MODEL_KEY = 'aggregationModel';
|
|
708
708
|
const PIVOT_MODEL_KEY = 'pivotModel';
|
|
709
|
-
const
|
|
709
|
+
const PIVOT_ACTIVE_KEY = 'pivotActive';
|
|
710
|
+
const CATEGORIES = [PAGINATION_MODEL_KEY, FILTER_MODEL_KEY, SORT_MODEL_KEY, VISIBILITY_MODEL_KEY, DIMENSION_MODEL_KEY, FILTER_SEARCH_KEY, PINNED_COLUMNS, DENSITY_MODEL_KEY, COLUMN_ORDER_MODEL_KEY, ROW_GROUPING_MODEL_KEY, AGGREGATION_MODEL_KEY, PIVOT_MODEL_KEY, PIVOT_ACTIVE_KEY];
|
|
710
711
|
const buildStorageKey = _ref => {
|
|
711
712
|
let {
|
|
712
713
|
id,
|
|
@@ -765,6 +766,10 @@ const clearPreviousVersionStorage = (id, previousLocalStorageVersions) => {
|
|
|
765
766
|
id,
|
|
766
767
|
version,
|
|
767
768
|
category: PIVOT_MODEL_KEY
|
|
769
|
+
}), buildStorageKey({
|
|
770
|
+
id,
|
|
771
|
+
version,
|
|
772
|
+
category: PIVOT_ACTIVE_KEY
|
|
768
773
|
})];
|
|
769
774
|
for (const keyToDelete of keysToDelete) {
|
|
770
775
|
try {
|
|
@@ -776,6 +781,48 @@ const clearPreviousVersionStorage = (id, previousLocalStorageVersions) => {
|
|
|
776
781
|
}
|
|
777
782
|
};
|
|
778
783
|
|
|
784
|
+
/**
|
|
785
|
+
* Clear localStorage keys for all versions from 0 to `maxVersion` (inclusive).
|
|
786
|
+
* Useful when the consumer wants to wipe all persisted grid state regardless of which version is active.
|
|
787
|
+
*/
|
|
788
|
+
const clearAllVersionStorage = (id, maxVersion) => {
|
|
789
|
+
const versions = Array.from({
|
|
790
|
+
length: maxVersion + 1
|
|
791
|
+
}, (_, i) => i);
|
|
792
|
+
clearPreviousVersionStorage(id, versions);
|
|
793
|
+
};
|
|
794
|
+
|
|
795
|
+
/**
|
|
796
|
+
* Fully reset a `StatefulDataGrid` — clear localStorage for the given versions
|
|
797
|
+
* and strip all grid-owned URL params (`_*` and `v=`), preserving any non-grid params.
|
|
798
|
+
*
|
|
799
|
+
* Call from within a component where the router values are available:
|
|
800
|
+
* ```ts
|
|
801
|
+
* const { search, historyReplace } = useMyRouter();
|
|
802
|
+
* resetStatefulDataGridState({ id: 'myGrid', versions: [0, 1, 2], search, historyReplace });
|
|
803
|
+
* ```
|
|
804
|
+
*/
|
|
805
|
+
const resetStatefulDataGridState = _ref2 => {
|
|
806
|
+
let {
|
|
807
|
+
id,
|
|
808
|
+
versions,
|
|
809
|
+
search,
|
|
810
|
+
historyReplace
|
|
811
|
+
} = _ref2;
|
|
812
|
+
clearPreviousVersionStorage(id, versions);
|
|
813
|
+
const params = new URLSearchParams(search);
|
|
814
|
+
const keysToDelete = [];
|
|
815
|
+
params.forEach((_value, key) => {
|
|
816
|
+
if (key.startsWith('_') || key === 'v') {
|
|
817
|
+
keysToDelete.push(key);
|
|
818
|
+
}
|
|
819
|
+
});
|
|
820
|
+
for (const key of keysToDelete) {
|
|
821
|
+
params.delete(key);
|
|
822
|
+
}
|
|
823
|
+
historyReplace(params.toString());
|
|
824
|
+
};
|
|
825
|
+
|
|
779
826
|
/** Maximum query string length (chars) before compression kicks in. */
|
|
780
827
|
const URL_BUDGET = 2000;
|
|
781
828
|
|
|
@@ -2109,6 +2156,22 @@ const getAggregationModel = (search, localStorageAggregation, setLocalStorageAgg
|
|
|
2109
2156
|
|
|
2110
2157
|
/** PIVOT */
|
|
2111
2158
|
|
|
2159
|
+
/** Convert MUI's GridPivotModel → our simplified PivotModel */
|
|
2160
|
+
const fromGridPivotModel = model => ({
|
|
2161
|
+
columns: model.columns.map(c => c.field),
|
|
2162
|
+
rows: model.rows.map(r => r.field),
|
|
2163
|
+
values: model.values.map(_ref2 => {
|
|
2164
|
+
let {
|
|
2165
|
+
field,
|
|
2166
|
+
aggFunc
|
|
2167
|
+
} = _ref2;
|
|
2168
|
+
return {
|
|
2169
|
+
field,
|
|
2170
|
+
aggFunc
|
|
2171
|
+
};
|
|
2172
|
+
})
|
|
2173
|
+
});
|
|
2174
|
+
|
|
2112
2175
|
/**
|
|
2113
2176
|
* Pivot format: `cols:f1,f2;rows:f3;vals:f4.sum,f5.avg`
|
|
2114
2177
|
*/
|
|
@@ -2165,7 +2228,8 @@ const getSearchParamsFromPivot = pivot => {
|
|
|
2165
2228
|
return searchParams;
|
|
2166
2229
|
};
|
|
2167
2230
|
const getPivotModel = (search, localStoragePivot, setLocalStoragePivot, initialState, isNewVersion) => {
|
|
2168
|
-
|
|
2231
|
+
var _initialState$pivotin;
|
|
2232
|
+
const defaultValue = initialState !== null && initialState !== void 0 && (_initialState$pivotin = initialState.pivoting) !== null && _initialState$pivotin !== void 0 && _initialState$pivotin.model ? fromGridPivotModel(initialState.pivoting.model) : {
|
|
2169
2233
|
columns: [],
|
|
2170
2234
|
rows: [],
|
|
2171
2235
|
values: []
|
|
@@ -2197,7 +2261,56 @@ const getPivotModel = (search, localStoragePivot, setLocalStoragePivot, initialS
|
|
|
2197
2261
|
persistDefault();
|
|
2198
2262
|
return defaultValue;
|
|
2199
2263
|
};
|
|
2200
|
-
|
|
2264
|
+
|
|
2265
|
+
/** PIVOT ACTIVE */
|
|
2266
|
+
|
|
2267
|
+
const getPivotActiveFromString = searchString => {
|
|
2268
|
+
if (!searchString) return 'invalid';
|
|
2269
|
+
const searchParams = new URLSearchParams(searchString);
|
|
2270
|
+
const value = searchParams.get('_pivotActive');
|
|
2271
|
+
if (value === 'true') return true;
|
|
2272
|
+
if (value === 'false') return false;
|
|
2273
|
+
return 'invalid';
|
|
2274
|
+
};
|
|
2275
|
+
const getSearchParamsFromPivotActive = active => {
|
|
2276
|
+
const searchParams = new URLSearchParams();
|
|
2277
|
+
// Only write to URL when active — false is the default and omitting keeps URLs clean
|
|
2278
|
+
if (active) {
|
|
2279
|
+
searchParams.set('_pivotActive', 'true');
|
|
2280
|
+
}
|
|
2281
|
+
return searchParams;
|
|
2282
|
+
};
|
|
2283
|
+
const getPivotActive = (search, localStoragePivotActive, setLocalStoragePivotActive, initialState, isNewVersion) => {
|
|
2284
|
+
var _initialState$pivotin2, _initialState$pivotin3;
|
|
2285
|
+
const defaultValue = (_initialState$pivotin2 = initialState === null || initialState === void 0 ? void 0 : (_initialState$pivotin3 = initialState.pivoting) === null || _initialState$pivotin3 === void 0 ? void 0 : _initialState$pivotin3.enabled) !== null && _initialState$pivotin2 !== void 0 ? _initialState$pivotin2 : false;
|
|
2286
|
+
const persistDefault = () => {
|
|
2287
|
+
const searchFromDefault = getSearchParamsFromPivotActive(defaultValue);
|
|
2288
|
+
const searchString = urlSearchParamsToString(searchFromDefault);
|
|
2289
|
+
if (searchString !== localStoragePivotActive) {
|
|
2290
|
+
setLocalStoragePivotActive(searchString);
|
|
2291
|
+
}
|
|
2292
|
+
};
|
|
2293
|
+
if (isNewVersion) {
|
|
2294
|
+
persistDefault();
|
|
2295
|
+
return defaultValue;
|
|
2296
|
+
}
|
|
2297
|
+
const fromUrl = getPivotActiveFromString(search);
|
|
2298
|
+
if (fromUrl !== 'invalid') {
|
|
2299
|
+
const searchFromModel = getSearchParamsFromPivotActive(fromUrl);
|
|
2300
|
+
const searchString = urlSearchParamsToString(searchFromModel);
|
|
2301
|
+
if (searchString !== localStoragePivotActive) {
|
|
2302
|
+
setLocalStoragePivotActive(searchString);
|
|
2303
|
+
}
|
|
2304
|
+
return fromUrl;
|
|
2305
|
+
}
|
|
2306
|
+
const fromLocalStorage = getPivotActiveFromString(localStoragePivotActive);
|
|
2307
|
+
if (fromLocalStorage !== 'invalid') {
|
|
2308
|
+
return fromLocalStorage;
|
|
2309
|
+
}
|
|
2310
|
+
persistDefault();
|
|
2311
|
+
return defaultValue;
|
|
2312
|
+
};
|
|
2313
|
+
const getFinalSearch = _ref3 => {
|
|
2201
2314
|
let {
|
|
2202
2315
|
search,
|
|
2203
2316
|
localStorageVersion,
|
|
@@ -2212,8 +2325,9 @@ const getFinalSearch = _ref2 => {
|
|
|
2212
2325
|
rowGroupingModel,
|
|
2213
2326
|
aggregationModel,
|
|
2214
2327
|
pivotModel,
|
|
2328
|
+
pivotActive,
|
|
2215
2329
|
columns
|
|
2216
|
-
} =
|
|
2330
|
+
} = _ref3;
|
|
2217
2331
|
const filterModelSearch = getSearchParamsFromFilterModel(filterModel);
|
|
2218
2332
|
const sortModelSearch = getSearchParamsFromSorting(sortModel);
|
|
2219
2333
|
const paginationModelSearch = getSearchParamsFromPagination(paginationModel);
|
|
@@ -2225,6 +2339,7 @@ const getFinalSearch = _ref2 => {
|
|
|
2225
2339
|
const rowGroupingSearch = getSearchParamsFromRowGrouping(rowGroupingModel);
|
|
2226
2340
|
const aggregationSearch = getSearchParamsFromAggregation(aggregationModel);
|
|
2227
2341
|
const pivotSearch = getSearchParamsFromPivot(pivotModel);
|
|
2342
|
+
const pivotActiveSearch = getSearchParamsFromPivotActive(pivotActive);
|
|
2228
2343
|
const tabSearch = getSearchParamsFromTab(search);
|
|
2229
2344
|
const searchParams = new URLSearchParams();
|
|
2230
2345
|
for (const [key, value] of new URLSearchParams(search)) {
|
|
@@ -2239,7 +2354,7 @@ const getFinalSearch = _ref2 => {
|
|
|
2239
2354
|
// Encode array as JSON string to preserve all values in one param
|
|
2240
2355
|
searchParams.set('_quickFilterValues', encodeURIComponent(JSON.stringify(filterModel.quickFilterValues)));
|
|
2241
2356
|
}
|
|
2242
|
-
return new URLSearchParams([...searchParams, ...filterModelSearch, ...sortModelSearch, ...paginationModelSearch, ...tabSearch, ...pinnedColumnsModelSearch, ...columnVisibilityModelSearch, ...densitySearch, ...columnOrderSearch, ...rowGroupingSearch, ...aggregationSearch, ...pivotSearch]);
|
|
2357
|
+
return new URLSearchParams([...searchParams, ...filterModelSearch, ...sortModelSearch, ...paginationModelSearch, ...tabSearch, ...pinnedColumnsModelSearch, ...columnVisibilityModelSearch, ...densitySearch, ...columnOrderSearch, ...rowGroupingSearch, ...aggregationSearch, ...pivotSearch, ...pivotActiveSearch]);
|
|
2243
2358
|
};
|
|
2244
2359
|
/** Return the state of the table given the URL and the local storage state */
|
|
2245
2360
|
const getModelsParsedOrUpdateLocalStorage = (search, localStorageVersion, columns, initialState, localStorage) => {
|
|
@@ -2270,7 +2385,9 @@ const getModelsParsedOrUpdateLocalStorage = (search, localStorageVersion, column
|
|
|
2270
2385
|
localStorageAggregation,
|
|
2271
2386
|
setLocalStorageAggregation,
|
|
2272
2387
|
localStoragePivot,
|
|
2273
|
-
setLocalStoragePivot
|
|
2388
|
+
setLocalStoragePivot,
|
|
2389
|
+
localStoragePivotActive,
|
|
2390
|
+
setLocalStoragePivotActive
|
|
2274
2391
|
} = localStorage;
|
|
2275
2392
|
const filterModel = getFilterModel(decodedSearch, columns, localStorageFilters, setLocalStorageFilters, initialState, isNewVersion);
|
|
2276
2393
|
const sortModel = getSortModel(decodedSearch, columns, localStorageSorting, setLocalStorageSorting, initialState, isNewVersion);
|
|
@@ -2282,6 +2399,7 @@ const getModelsParsedOrUpdateLocalStorage = (search, localStorageVersion, column
|
|
|
2282
2399
|
const rowGroupingModel = getRowGroupingModel(decodedSearch, localStorageRowGrouping, setLocalStorageRowGrouping, initialState, isNewVersion);
|
|
2283
2400
|
const aggregationModel = getAggregationModel(decodedSearch, localStorageAggregation, setLocalStorageAggregation, initialState, isNewVersion);
|
|
2284
2401
|
const pivotModel = getPivotModel(decodedSearch, localStoragePivot, setLocalStoragePivot, initialState, isNewVersion);
|
|
2402
|
+
const pivotActive = getPivotActive(decodedSearch, localStoragePivotActive, setLocalStoragePivotActive, initialState, isNewVersion);
|
|
2285
2403
|
const defaultColumnOrder = (_initialState$columns6 = initialState === null || initialState === void 0 ? void 0 : (_initialState$columns7 = initialState.columns) === null || _initialState$columns7 === void 0 ? void 0 : _initialState$columns7.orderedFields) !== null && _initialState$columns6 !== void 0 ? _initialState$columns6 : columns.map(c => c.field);
|
|
2286
2404
|
const finalSearch = getFinalSearch({
|
|
2287
2405
|
localStorageVersion,
|
|
@@ -2297,6 +2415,7 @@ const getModelsParsedOrUpdateLocalStorage = (search, localStorageVersion, column
|
|
|
2297
2415
|
rowGroupingModel,
|
|
2298
2416
|
aggregationModel,
|
|
2299
2417
|
pivotModel,
|
|
2418
|
+
pivotActive,
|
|
2300
2419
|
columns
|
|
2301
2420
|
});
|
|
2302
2421
|
const internalSearchString = urlSearchParamsToString(finalSearch);
|
|
@@ -2320,10 +2439,11 @@ const getModelsParsedOrUpdateLocalStorage = (search, localStorageVersion, column
|
|
|
2320
2439
|
rowGroupingModel,
|
|
2321
2440
|
aggregationModel,
|
|
2322
2441
|
pivotModel,
|
|
2442
|
+
pivotActive,
|
|
2323
2443
|
pendingSearch
|
|
2324
2444
|
};
|
|
2325
2445
|
};
|
|
2326
|
-
const updateUrl = (
|
|
2446
|
+
const updateUrl = (_ref4, search, localStorageVersion, historyReplace, columns) => {
|
|
2327
2447
|
let {
|
|
2328
2448
|
filterModel,
|
|
2329
2449
|
sortModel,
|
|
@@ -2335,8 +2455,9 @@ const updateUrl = (_ref3, search, localStorageVersion, historyReplace, columns)
|
|
|
2335
2455
|
defaultColumnOrder,
|
|
2336
2456
|
rowGroupingModel,
|
|
2337
2457
|
aggregationModel,
|
|
2338
|
-
pivotModel
|
|
2339
|
-
|
|
2458
|
+
pivotModel,
|
|
2459
|
+
pivotActive
|
|
2460
|
+
} = _ref4;
|
|
2340
2461
|
// Convert from display format to internal format if needed
|
|
2341
2462
|
const decodedSearch = getDecodedSearchFromUrl(search, columns);
|
|
2342
2463
|
const newSearch = getFinalSearch({
|
|
@@ -2353,6 +2474,7 @@ const updateUrl = (_ref3, search, localStorageVersion, historyReplace, columns)
|
|
|
2353
2474
|
rowGroupingModel,
|
|
2354
2475
|
aggregationModel,
|
|
2355
2476
|
pivotModel,
|
|
2477
|
+
pivotActive,
|
|
2356
2478
|
columns
|
|
2357
2479
|
});
|
|
2358
2480
|
const internalSearchString = urlSearchParamsToString(newSearch);
|
|
@@ -2555,6 +2677,11 @@ const useTableStates = (id, version) => {
|
|
|
2555
2677
|
version,
|
|
2556
2678
|
category: PIVOT_MODEL_KEY
|
|
2557
2679
|
}));
|
|
2680
|
+
const [pivotActive, setPivotActive] = useFetchState('', buildStorageKey({
|
|
2681
|
+
id,
|
|
2682
|
+
version,
|
|
2683
|
+
category: PIVOT_ACTIVE_KEY
|
|
2684
|
+
}));
|
|
2558
2685
|
return {
|
|
2559
2686
|
paginationModel,
|
|
2560
2687
|
setPaginationModel,
|
|
@@ -2577,7 +2704,9 @@ const useTableStates = (id, version) => {
|
|
|
2577
2704
|
aggregationModel,
|
|
2578
2705
|
setAggregationModel,
|
|
2579
2706
|
pivotModel,
|
|
2580
|
-
setPivotModel
|
|
2707
|
+
setPivotModel,
|
|
2708
|
+
pivotActive,
|
|
2709
|
+
setPivotActive
|
|
2581
2710
|
};
|
|
2582
2711
|
};
|
|
2583
2712
|
|
|
@@ -2601,22 +2730,6 @@ const toGridPivotModel = model => ({
|
|
|
2601
2730
|
})
|
|
2602
2731
|
});
|
|
2603
2732
|
|
|
2604
|
-
/** Convert MUI's GridPivotModel → our simplified PivotModel */
|
|
2605
|
-
const fromGridPivotModel = model => ({
|
|
2606
|
-
columns: model.columns.map(c => c.field),
|
|
2607
|
-
rows: model.rows.map(r => r.field),
|
|
2608
|
-
values: model.values.map(_ref2 => {
|
|
2609
|
-
let {
|
|
2610
|
-
field,
|
|
2611
|
-
aggFunc
|
|
2612
|
-
} = _ref2;
|
|
2613
|
-
return {
|
|
2614
|
-
field,
|
|
2615
|
-
aggFunc
|
|
2616
|
-
};
|
|
2617
|
-
})
|
|
2618
|
-
});
|
|
2619
|
-
|
|
2620
2733
|
/**
|
|
2621
2734
|
* Deep-equal comparison for plain objects / arrays.
|
|
2622
2735
|
* Used to stabilise parsed model references so that MUI v8 does not
|
|
@@ -2683,16 +2796,18 @@ const useStatefulTable = props => {
|
|
|
2683
2796
|
aggregationModel: localStorageAggregation,
|
|
2684
2797
|
setAggregationModel: setLocalStorageAggregation,
|
|
2685
2798
|
pivotModel: localStoragePivot,
|
|
2686
|
-
setPivotModel: setLocalStoragePivot
|
|
2799
|
+
setPivotModel: setLocalStoragePivot,
|
|
2800
|
+
pivotActive: localStoragePivotActive,
|
|
2801
|
+
setPivotActive: setLocalStoragePivotActive
|
|
2687
2802
|
} = useTableStates(id, localStorageVersion);
|
|
2688
2803
|
|
|
2689
2804
|
// clearing up old version keys, triggering only on first render
|
|
2690
2805
|
useEffect(() => clearPreviousVersionStorage(id, previousLocalStorageVersions), [id, previousLocalStorageVersions]);
|
|
2691
|
-
const onColumnDimensionChange = useCallback(
|
|
2806
|
+
const onColumnDimensionChange = useCallback(_ref2 => {
|
|
2692
2807
|
let {
|
|
2693
2808
|
newWidth,
|
|
2694
2809
|
field
|
|
2695
|
-
} =
|
|
2810
|
+
} = _ref2;
|
|
2696
2811
|
setDimensionModel(_objectSpread2(_objectSpread2({}, dimensionModel), {}, {
|
|
2697
2812
|
[field]: newWidth
|
|
2698
2813
|
}));
|
|
@@ -2708,6 +2823,7 @@ const useStatefulTable = props => {
|
|
|
2708
2823
|
rowGroupingModel: rowGroupingParsed,
|
|
2709
2824
|
aggregationModel: aggregationParsed,
|
|
2710
2825
|
pivotModel: pivotParsed,
|
|
2826
|
+
pivotActive: pivotActiveParsed,
|
|
2711
2827
|
pendingSearch
|
|
2712
2828
|
} = getModelsParsedOrUpdateLocalStorage(search || '', localStorageVersion, propsColumns, initialState, {
|
|
2713
2829
|
localStorageFilters,
|
|
@@ -2729,7 +2845,9 @@ const useStatefulTable = props => {
|
|
|
2729
2845
|
localStorageAggregation,
|
|
2730
2846
|
setLocalStorageAggregation,
|
|
2731
2847
|
localStoragePivot,
|
|
2732
|
-
setLocalStoragePivot
|
|
2848
|
+
setLocalStoragePivot,
|
|
2849
|
+
localStoragePivotActive: localStoragePivotActive,
|
|
2850
|
+
setLocalStoragePivotActive: setLocalStoragePivotActive
|
|
2733
2851
|
});
|
|
2734
2852
|
|
|
2735
2853
|
// Sync URL in an effect rather than during render to comply with React rules
|
|
@@ -2811,12 +2929,13 @@ const useStatefulTable = props => {
|
|
|
2811
2929
|
defaultColumnOrder,
|
|
2812
2930
|
rowGroupingModel: rowGroupingParsed,
|
|
2813
2931
|
aggregationModel: aggregationParsed,
|
|
2814
|
-
pivotModel: pivotParsed
|
|
2932
|
+
pivotModel: pivotParsed,
|
|
2933
|
+
pivotActive: pivotActiveParsed
|
|
2815
2934
|
}, search, localStorageVersion, historyReplace, columns);
|
|
2816
2935
|
}
|
|
2817
2936
|
});
|
|
2818
2937
|
return unsub;
|
|
2819
|
-
}, [apiRef, densityParsed, filterParsed, sortModelParsed, paginationModelParsed, pinnedColumnsModel, columnOrderParsed, defaultColumnOrder, rowGroupingParsed, aggregationParsed, pivotParsed, search, localStorageVersion, historyReplace, columns]);
|
|
2938
|
+
}, [apiRef, densityParsed, filterParsed, sortModelParsed, paginationModelParsed, pinnedColumnsModel, columnOrderParsed, defaultColumnOrder, rowGroupingParsed, aggregationParsed, pivotParsed, pivotActiveParsed, search, localStorageVersion, historyReplace, columns]);
|
|
2820
2939
|
|
|
2821
2940
|
// Subscribe to column order changes via columnOrderChange (drag-drop) and columnIndexChange (programmatic setColumnIndex)
|
|
2822
2941
|
useEffect(() => {
|
|
@@ -2836,7 +2955,8 @@ const useStatefulTable = props => {
|
|
|
2836
2955
|
defaultColumnOrder,
|
|
2837
2956
|
rowGroupingModel: rowGroupingParsed,
|
|
2838
2957
|
aggregationModel: aggregationParsed,
|
|
2839
|
-
pivotModel: pivotParsed
|
|
2958
|
+
pivotModel: pivotParsed,
|
|
2959
|
+
pivotActive: pivotActiveParsed
|
|
2840
2960
|
}, search, localStorageVersion, historyReplace, columns);
|
|
2841
2961
|
}
|
|
2842
2962
|
};
|
|
@@ -2846,7 +2966,7 @@ const useStatefulTable = props => {
|
|
|
2846
2966
|
unsub1();
|
|
2847
2967
|
unsub2();
|
|
2848
2968
|
};
|
|
2849
|
-
}, [apiRef, columnOrderParsed, defaultColumnOrder, filterParsed, sortModelParsed, paginationModelParsed, pinnedColumnsModel, densityParsed, rowGroupingParsed, aggregationParsed, pivotParsed, search, localStorageVersion, historyReplace, columns]);
|
|
2969
|
+
}, [apiRef, columnOrderParsed, defaultColumnOrder, filterParsed, sortModelParsed, paginationModelParsed, pinnedColumnsModel, densityParsed, rowGroupingParsed, aggregationParsed, pivotParsed, pivotActiveParsed, search, localStorageVersion, historyReplace, columns]);
|
|
2850
2970
|
|
|
2851
2971
|
// Helper to build the current DataGridModel for updateUrl calls
|
|
2852
2972
|
const buildModel = function () {
|
|
@@ -2863,9 +2983,21 @@ const useStatefulTable = props => {
|
|
|
2863
2983
|
defaultColumnOrder,
|
|
2864
2984
|
rowGroupingModel: rowGroupingParsed,
|
|
2865
2985
|
aggregationModel: aggregationParsed,
|
|
2866
|
-
pivotModel: pivotParsed
|
|
2986
|
+
pivotModel: pivotParsed,
|
|
2987
|
+
pivotActive: pivotActiveParsed
|
|
2867
2988
|
}, overrides);
|
|
2868
2989
|
};
|
|
2990
|
+
|
|
2991
|
+
// Stable GridPivotModel identity — only recompute when the simplified value changes.
|
|
2992
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2993
|
+
const pivotModelMui = useMemo(() => toGridPivotModel(pivotParsed), [JSON.stringify(pivotParsed)]);
|
|
2994
|
+
|
|
2995
|
+
// Track last emitted values for deep-equal guards to avoid feedback loops.
|
|
2996
|
+
// Initialised from the current parsed values; updated only when we actually fire.
|
|
2997
|
+
const lastEmittedFilterRef = useRef(filterParsed);
|
|
2998
|
+
const lastEmittedSortRef = useRef(sortModelParsed);
|
|
2999
|
+
const lastEmittedPaginationRef = useRef(paginationModelParsed);
|
|
3000
|
+
const lastEmittedPivotRef = useRef(pivotParsed);
|
|
2869
3001
|
return {
|
|
2870
3002
|
apiRef,
|
|
2871
3003
|
columns,
|
|
@@ -2873,7 +3005,8 @@ const useStatefulTable = props => {
|
|
|
2873
3005
|
columnOrderModel: columnOrderParsedRef.current,
|
|
2874
3006
|
rowGroupingModel: rowGroupingParsedRef.current,
|
|
2875
3007
|
aggregationModel: aggregationParsedRef.current,
|
|
2876
|
-
pivotModel:
|
|
3008
|
+
pivotModel: pivotModelMui,
|
|
3009
|
+
pivotActive: pivotActiveParsed,
|
|
2877
3010
|
onFilterModelChange: (model, details) => {
|
|
2878
3011
|
const filterModel = _objectSpread2(_objectSpread2({}, model), {}, {
|
|
2879
3012
|
items: model.items.map(item => {
|
|
@@ -2884,6 +3017,8 @@ const useStatefulTable = props => {
|
|
|
2884
3017
|
}),
|
|
2885
3018
|
quickFilterValues: model.quickFilterValues || []
|
|
2886
3019
|
});
|
|
3020
|
+
if (isDeepEqual(filterModel, lastEmittedFilterRef.current)) return;
|
|
3021
|
+
lastEmittedFilterRef.current = filterModel;
|
|
2887
3022
|
updateUrl(buildModel({
|
|
2888
3023
|
filterModel
|
|
2889
3024
|
}), search, localStorageVersion, historyReplace, columns);
|
|
@@ -2891,6 +3026,8 @@ const useStatefulTable = props => {
|
|
|
2891
3026
|
},
|
|
2892
3027
|
filterModel: filterParsedRef.current,
|
|
2893
3028
|
onSortModelChange: (model, details) => {
|
|
3029
|
+
if (isDeepEqual(model, lastEmittedSortRef.current)) return;
|
|
3030
|
+
lastEmittedSortRef.current = model;
|
|
2894
3031
|
updateUrl(buildModel({
|
|
2895
3032
|
sortModel: model
|
|
2896
3033
|
}), search, localStorageVersion, historyReplace, columns);
|
|
@@ -2909,6 +3046,8 @@ const useStatefulTable = props => {
|
|
|
2909
3046
|
const paginationModel = _objectSpread2(_objectSpread2({}, model), {}, {
|
|
2910
3047
|
direction: paginationModelParsed.page < model.page ? 'next' : 'back'
|
|
2911
3048
|
});
|
|
3049
|
+
if (isDeepEqual(paginationModel, lastEmittedPaginationRef.current)) return;
|
|
3050
|
+
lastEmittedPaginationRef.current = paginationModel;
|
|
2912
3051
|
updateUrl(buildModel({
|
|
2913
3052
|
paginationModel
|
|
2914
3053
|
}), search, localStorageVersion, historyReplace, columns);
|
|
@@ -2942,10 +3081,18 @@ const useStatefulTable = props => {
|
|
|
2942
3081
|
},
|
|
2943
3082
|
onPivotModelChange: model => {
|
|
2944
3083
|
const simplified = fromGridPivotModel(model);
|
|
3084
|
+
if (isDeepEqual(simplified, lastEmittedPivotRef.current)) return;
|
|
3085
|
+
lastEmittedPivotRef.current = simplified;
|
|
2945
3086
|
updateUrl(buildModel({
|
|
2946
3087
|
pivotModel: simplified
|
|
2947
3088
|
}), search, localStorageVersion, historyReplace, columns);
|
|
2948
3089
|
propsOnPivotModelChange === null || propsOnPivotModelChange === void 0 ? void 0 : propsOnPivotModelChange(model);
|
|
3090
|
+
},
|
|
3091
|
+
onPivotActiveChange: active => {
|
|
3092
|
+
if (active === pivotActiveParsed) return;
|
|
3093
|
+
updateUrl(buildModel({
|
|
3094
|
+
pivotActive: active
|
|
3095
|
+
}), search, localStorageVersion, historyReplace, columns);
|
|
2949
3096
|
}
|
|
2950
3097
|
};
|
|
2951
3098
|
};
|
|
@@ -3103,9 +3250,11 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
3103
3250
|
rowGroupingModel,
|
|
3104
3251
|
aggregationModel,
|
|
3105
3252
|
pivotModel,
|
|
3253
|
+
pivotActive,
|
|
3106
3254
|
onRowGroupingModelChange,
|
|
3107
3255
|
onAggregationModelChange,
|
|
3108
|
-
onPivotModelChange
|
|
3256
|
+
onPivotModelChange,
|
|
3257
|
+
onPivotActiveChange
|
|
3109
3258
|
} = useStatefulTable({
|
|
3110
3259
|
apiRef: apiRef,
|
|
3111
3260
|
initialState,
|
|
@@ -3337,7 +3486,9 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
3337
3486
|
aggregationModel: aggregationModel,
|
|
3338
3487
|
onAggregationModelChange: onAggregationModelChange,
|
|
3339
3488
|
pivotModel: pivotModel,
|
|
3340
|
-
onPivotModelChange: onPivotModelChange
|
|
3489
|
+
onPivotModelChange: onPivotModelChange,
|
|
3490
|
+
pivotActive: pivotActive,
|
|
3491
|
+
onPivotActiveChange: onPivotActiveChange
|
|
3341
3492
|
// In dataSource mode: models are uncontrolled (MUI owns them),
|
|
3342
3493
|
// onChange handlers are write-only for URL/localStorage persistence,
|
|
3343
3494
|
// and initialState seeds MUI on mount from the persisted URL state.
|
|
@@ -3358,7 +3509,10 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
3358
3509
|
},
|
|
3359
3510
|
pagination: {
|
|
3360
3511
|
paginationModel
|
|
3361
|
-
}
|
|
3512
|
+
},
|
|
3513
|
+
pivoting: _objectSpread2(_objectSpread2({}, initialState === null || initialState === void 0 ? void 0 : initialState.pivoting), {}, {
|
|
3514
|
+
enabled: pivotActive
|
|
3515
|
+
})
|
|
3362
3516
|
})
|
|
3363
3517
|
} : {
|
|
3364
3518
|
filterModel,
|
|
@@ -3537,5 +3691,5 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
3537
3691
|
StatefulDataGrid.className = CLASSNAME;
|
|
3538
3692
|
StatefulDataGrid.displayName = COMPONENT_NAME;
|
|
3539
3693
|
|
|
3540
|
-
export {
|
|
3694
|
+
export { buildStorageKey as $, ARRAY_IS_EMPTY as A, IS as B, CONTAINS_ANY_OF as C, DOES_NOT_CONTAIN as D, ENDS_WITH_ANY_OF as E, IS_NOT as F, getGridStringOperators as G, HAS_WITH_SELECT as H, IS_ANY_OF as I, getGridStringArrayOperators as J, getGridStringArrayOperatorsWithSelect as K, getGridStringArrayOperatorsWithSelectOnStringArrayColumns as L, FILTER_MODEL_KEY as M, SORT_MODEL_KEY as N, PINNED_COLUMNS as O, PAGINATION_MODEL_KEY as P, DIMENSION_MODEL_KEY as Q, FILTER_SEARCH_KEY as R, STARTS_WITH_ANY_OF as S, DENSITY_MODEL_KEY as T, COLUMN_ORDER_MODEL_KEY as U, VISIBILITY_MODEL_KEY as V, ROW_GROUPING_MODEL_KEY as W, AGGREGATION_MODEL_KEY as X, PIVOT_MODEL_KEY as Y, PIVOT_ACTIVE_KEY as Z, CATEGORIES as _, DOES_NOT_EQUAL as a, clearPreviousVersionStorage as a0, clearAllVersionStorage as a1, resetStatefulDataGridState as a2, convertToDisplayFormat as a3, convertFromDisplayFormat as a4, getDecodedSearchFromUrl as a5, buildQueryParamsString as a6, areSearchStringsEqual as a7, decodeValue as a8, encodeValue as a9, getPivotFromString as aA, getSearchParamsFromPivot as aB, getPivotActiveFromString as aC, getSearchParamsFromPivotActive as aD, getFinalSearch as aE, getModelsParsedOrUpdateLocalStorage as aF, updateUrl as aG, areFilterModelsEquivalent as aH, StatefulDataGrid as aI, urlSearchParamsToString as aa, numberOperatorEncoder as ab, numberOperatorDecoder as ac, isOperatorValueValid as ad, isValueValid as ae, getFilterModelFromString as af, getSearchParamsFromFilterModel as ag, getSortingFromString as ah, getSearchParamsFromSorting as ai, getPaginationFromString as aj, getSearchParamsFromPagination as ak, getColumnVisibilityFromString as al, getSearchParamsFromColumnVisibility as am, getPinnedColumnsFromString as an, getSearchParamsFromPinnedColumns as ao, getSearchParamsFromTab as ap, getDensityFromString as aq, getSearchParamsFromDensity as ar, getDensityModel as as, getColumnOrderFromString as at, getSearchParamsFromColumnOrder as au, getRowGroupingFromString as av, getSearchParamsFromRowGrouping as aw, getAggregationFromString as ax, getSearchParamsFromAggregation as ay, fromGridPivotModel as az, DOES_NOT_START_WITH as b, DOES_NOT_END_WITH as c, IS_NOT_ANY_OF as d, DOES_NOT_CONTAIN_ANY_OF as e, DOES_NOT_START_WITH_ANY_OF as f, DOES_NOT_END_WITH_ANY_OF as g, IS_BETWEEN as h, IS_WITH_SELECT as i, IS_NOT_WITH_SELECT as j, IS_ANY_OF_WITH_SELECT as k, IS_NOT_ANY_OF_WITH_SELECT as l, ARRAY_IS_NOT_EMPTY as m, DOES_NOT_HAVE_WITH_SELECT as n, operatorList as o, HAS_ANY_OF_WITH_SELECT as p, HAS_ALL_OF_WITH_SELECT as q, DOES_NOT_HAVE_ANY_OF_WITH_SELECT as r, HAS_ONLY_WITH_SELECT as s, HAS as t, DOES_NOT_HAVE as u, HAS_ANY_OF as v, HAS_ALL_OF as w, DOES_NOT_HAVE_ANY_OF as x, HAS_ONLY as y, getGridNumericOperators as z };
|
|
3541
3695
|
//# sourceMappingURL=StatefulDataGrid2.js.map
|