@reltio/components 1.4.1625 → 1.4.1626
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/cjs/components/BasicTableView/BasicTable/hooks/useDynamicRowCellHeight.d.ts +2 -2
- package/cjs/components/BasicTableView/BasicTable/hooks/useDynamicRowCellHeight.js +15 -13
- package/cjs/components/BasicTableView/RowCellAutoSizer/RowCellAutoSizer.js +0 -1
- package/esm/components/BasicTableView/BasicTable/hooks/useDynamicRowCellHeight.d.ts +2 -2
- package/esm/components/BasicTableView/BasicTable/hooks/useDynamicRowCellHeight.js +16 -14
- package/esm/components/BasicTableView/RowCellAutoSizer/RowCellAutoSizer.js +1 -2
- package/package.json +3 -3
|
@@ -5,8 +5,8 @@ type GetRowCellKeyProps = {
|
|
|
5
5
|
columnData: ColumnData;
|
|
6
6
|
rowValue: RowValue;
|
|
7
7
|
};
|
|
8
|
-
declare const useDynamicRowCellHeight: (getRowCellKey?: ({ rowIndex, columnData
|
|
9
|
-
getDynamicRowCellHeight:
|
|
8
|
+
declare const useDynamicRowCellHeight: (getRowCellKey?: ({ rowIndex, columnData, cellIndex }: GetRowCellKeyProps) => string) => {
|
|
9
|
+
getDynamicRowCellHeight: (cell: GetRowCellKeyProps) => number;
|
|
10
10
|
changeRowCellHeight: any;
|
|
11
11
|
clearHeightsCache: () => void;
|
|
12
12
|
};
|
|
@@ -15,27 +15,29 @@ var react_1 = require("react");
|
|
|
15
15
|
var ramda_1 = require("ramda");
|
|
16
16
|
var mdm_sdk_1 = require("@reltio/mdm-sdk");
|
|
17
17
|
var defaultGetRowCellKey = function (_a) {
|
|
18
|
-
var rowIndex = _a.rowIndex,
|
|
19
|
-
return "".concat(id, "[").concat(rowIndex, "][").concat(cellIndex, "]");
|
|
18
|
+
var rowIndex = _a.rowIndex, columnData = _a.columnData, cellIndex = _a.cellIndex;
|
|
19
|
+
return "".concat(columnData.id, "[").concat(rowIndex, "][").concat(cellIndex, "]");
|
|
20
20
|
};
|
|
21
21
|
var useDynamicRowCellHeight = function (getRowCellKey) {
|
|
22
22
|
if (getRowCellKey === void 0) { getRowCellKey = defaultGetRowCellKey; }
|
|
23
23
|
var _a = (0, react_1.useState)({}), rowCellHeightsMap = _a[0], setRowCellHeightsMap = _a[1];
|
|
24
24
|
var rowCellHeightsMapCache = (0, react_1.useRef)({});
|
|
25
|
-
var
|
|
26
|
-
rowCellHeightsMapCache.current[key] = value;
|
|
27
|
-
};
|
|
28
|
-
var flushHeightUpdates = (0, react_1.useCallback)((0, mdm_sdk_1.debounce)(function () {
|
|
29
|
-
setRowCellHeightsMap(function (prev) {
|
|
30
|
-
var next = __assign({}, rowCellHeightsMapCache.current);
|
|
31
|
-
return (0, ramda_1.equals)(prev, next) ? prev : next;
|
|
32
|
-
});
|
|
33
|
-
}), []);
|
|
25
|
+
var flushHeightUpdates = (0, react_1.useCallback)((0, mdm_sdk_1.debounce)(function () { return setRowCellHeightsMap(__assign({}, rowCellHeightsMapCache.current)); }), []);
|
|
34
26
|
var clearHeightsCache = (0, react_1.useCallback)(function () {
|
|
35
27
|
rowCellHeightsMapCache.current = {};
|
|
36
28
|
}, []);
|
|
37
|
-
var getDynamicRowCellHeight = (0, react_1.useCallback)(
|
|
38
|
-
|
|
29
|
+
var getDynamicRowCellHeight = (0, react_1.useCallback)(function (cell) {
|
|
30
|
+
var key = getRowCellKey(cell);
|
|
31
|
+
return rowCellHeightsMap[key];
|
|
32
|
+
}, [getRowCellKey, rowCellHeightsMap]);
|
|
33
|
+
var changeRowCellHeight = (0, react_1.useCallback)((0, ramda_1.curry)(function (cell, height) {
|
|
34
|
+
var key = getRowCellKey(cell);
|
|
35
|
+
var currentHeight = rowCellHeightsMapCache.current[key];
|
|
36
|
+
if (currentHeight !== height) {
|
|
37
|
+
rowCellHeightsMapCache.current[key] = height;
|
|
38
|
+
flushHeightUpdates();
|
|
39
|
+
}
|
|
40
|
+
}), [flushHeightUpdates, getRowCellKey]);
|
|
39
41
|
return { getDynamicRowCellHeight: getDynamicRowCellHeight, changeRowCellHeight: changeRowCellHeight, clearHeightsCache: clearHeightsCache };
|
|
40
42
|
};
|
|
41
43
|
exports.default = useDynamicRowCellHeight;
|
|
@@ -47,7 +47,6 @@ var RowCellAutoSizer = function (_a) {
|
|
|
47
47
|
var changeCellHeight = onChangeHeight({ rowIndex: rowIndex, cellIndex: cellIndex, columnData: columnData, rowValue: rowValue });
|
|
48
48
|
var adjustCellHeight = function () { return cellRef.current && changeCellHeight(cellRef.current.clientHeight); };
|
|
49
49
|
(0, hooks_1.useDidUpdateEffect)(adjustCellHeight, [rowValue.rawValue]);
|
|
50
|
-
(0, react_1.useEffect)(function () { return function () { return changeCellHeight(undefined); }; }, []);
|
|
51
50
|
return (react_1.default.createElement("div", { ref: cellRef },
|
|
52
51
|
react_1.default.createElement(react_resize_detector_1.default, { handleHeight: true, onResize: adjustCellHeight }),
|
|
53
52
|
cell));
|
|
@@ -5,8 +5,8 @@ type GetRowCellKeyProps = {
|
|
|
5
5
|
columnData: ColumnData;
|
|
6
6
|
rowValue: RowValue;
|
|
7
7
|
};
|
|
8
|
-
declare const useDynamicRowCellHeight: (getRowCellKey?: ({ rowIndex, columnData
|
|
9
|
-
getDynamicRowCellHeight:
|
|
8
|
+
declare const useDynamicRowCellHeight: (getRowCellKey?: ({ rowIndex, columnData, cellIndex }: GetRowCellKeyProps) => string) => {
|
|
9
|
+
getDynamicRowCellHeight: (cell: GetRowCellKeyProps) => number;
|
|
10
10
|
changeRowCellHeight: any;
|
|
11
11
|
clearHeightsCache: () => void;
|
|
12
12
|
};
|
|
@@ -10,30 +10,32 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
12
|
import { useCallback, useRef, useState } from 'react';
|
|
13
|
-
import {
|
|
13
|
+
import { curry } from 'ramda';
|
|
14
14
|
import { debounce } from '@reltio/mdm-sdk';
|
|
15
15
|
var defaultGetRowCellKey = function (_a) {
|
|
16
|
-
var rowIndex = _a.rowIndex,
|
|
17
|
-
return "".concat(id, "[").concat(rowIndex, "][").concat(cellIndex, "]");
|
|
16
|
+
var rowIndex = _a.rowIndex, columnData = _a.columnData, cellIndex = _a.cellIndex;
|
|
17
|
+
return "".concat(columnData.id, "[").concat(rowIndex, "][").concat(cellIndex, "]");
|
|
18
18
|
};
|
|
19
19
|
var useDynamicRowCellHeight = function (getRowCellKey) {
|
|
20
20
|
if (getRowCellKey === void 0) { getRowCellKey = defaultGetRowCellKey; }
|
|
21
21
|
var _a = useState({}), rowCellHeightsMap = _a[0], setRowCellHeightsMap = _a[1];
|
|
22
22
|
var rowCellHeightsMapCache = useRef({});
|
|
23
|
-
var
|
|
24
|
-
rowCellHeightsMapCache.current[key] = value;
|
|
25
|
-
};
|
|
26
|
-
var flushHeightUpdates = useCallback(debounce(function () {
|
|
27
|
-
setRowCellHeightsMap(function (prev) {
|
|
28
|
-
var next = __assign({}, rowCellHeightsMapCache.current);
|
|
29
|
-
return equals(prev, next) ? prev : next;
|
|
30
|
-
});
|
|
31
|
-
}), []);
|
|
23
|
+
var flushHeightUpdates = useCallback(debounce(function () { return setRowCellHeightsMap(__assign({}, rowCellHeightsMapCache.current)); }), []);
|
|
32
24
|
var clearHeightsCache = useCallback(function () {
|
|
33
25
|
rowCellHeightsMapCache.current = {};
|
|
34
26
|
}, []);
|
|
35
|
-
var getDynamicRowCellHeight = useCallback(
|
|
36
|
-
|
|
27
|
+
var getDynamicRowCellHeight = useCallback(function (cell) {
|
|
28
|
+
var key = getRowCellKey(cell);
|
|
29
|
+
return rowCellHeightsMap[key];
|
|
30
|
+
}, [getRowCellKey, rowCellHeightsMap]);
|
|
31
|
+
var changeRowCellHeight = useCallback(curry(function (cell, height) {
|
|
32
|
+
var key = getRowCellKey(cell);
|
|
33
|
+
var currentHeight = rowCellHeightsMapCache.current[key];
|
|
34
|
+
if (currentHeight !== height) {
|
|
35
|
+
rowCellHeightsMapCache.current[key] = height;
|
|
36
|
+
flushHeightUpdates();
|
|
37
|
+
}
|
|
38
|
+
}), [flushHeightUpdates, getRowCellKey]);
|
|
37
39
|
return { getDynamicRowCellHeight: getDynamicRowCellHeight, changeRowCellHeight: changeRowCellHeight, clearHeightsCache: clearHeightsCache };
|
|
38
40
|
};
|
|
39
41
|
export default useDynamicRowCellHeight;
|
|
@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
-
import React, {
|
|
12
|
+
import React, { useRef } from 'react';
|
|
13
13
|
import ReactResizeDetector from 'react-resize-detector';
|
|
14
14
|
import { useDidUpdateEffect } from '../../../hooks';
|
|
15
15
|
var RowCellAutoSizer = function (_a) {
|
|
@@ -19,7 +19,6 @@ var RowCellAutoSizer = function (_a) {
|
|
|
19
19
|
var changeCellHeight = onChangeHeight({ rowIndex: rowIndex, cellIndex: cellIndex, columnData: columnData, rowValue: rowValue });
|
|
20
20
|
var adjustCellHeight = function () { return cellRef.current && changeCellHeight(cellRef.current.clientHeight); };
|
|
21
21
|
useDidUpdateEffect(adjustCellHeight, [rowValue.rawValue]);
|
|
22
|
-
useEffect(function () { return function () { return changeCellHeight(undefined); }; }, []);
|
|
23
22
|
return (React.createElement("div", { ref: cellRef },
|
|
24
23
|
React.createElement(ReactResizeDetector, { handleHeight: true, onResize: adjustCellHeight }),
|
|
25
24
|
cell));
|
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@reltio/components",
|
|
3
|
-
"version": "1.4.
|
|
3
|
+
"version": "1.4.1626",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE FILE",
|
|
5
5
|
"main": "./cjs/index.js",
|
|
6
6
|
"module": "./esm/index.js",
|
|
7
7
|
"dependencies": {
|
|
8
8
|
"@date-io/moment": "^1.3.5",
|
|
9
9
|
"@react-google-maps/api": "2.7.0",
|
|
10
|
-
"@reltio/mdm-module": "^1.4.
|
|
11
|
-
"@reltio/mdm-sdk": "^1.4.
|
|
10
|
+
"@reltio/mdm-module": "^1.4.1626",
|
|
11
|
+
"@reltio/mdm-sdk": "^1.4.1626",
|
|
12
12
|
"classnames": "^2.2.5",
|
|
13
13
|
"d3-cloud": "^1.2.5",
|
|
14
14
|
"d3-geo": "^2.0.1",
|