@reltio/components 1.4.1032 → 1.4.1035

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.
Files changed (7) hide show
  1. package/cjs/components/AutoSizeList/AutoSizeList.d.ts +5 -2
  2. package/cjs/components/AutoSizeList/AutoSizeList.js +14 -7
  3. package/cjs/contexts/EntitiesMapContext/index.d.ts +1 -1
  4. package/esm/components/AutoSizeList/AutoSizeList.d.ts +5 -2
  5. package/esm/components/AutoSizeList/AutoSizeList.js +15 -8
  6. package/esm/contexts/EntitiesMapContext/index.d.ts +1 -1
  7. package/package.json +3 -3
package/cjs/components/AutoSizeList/AutoSizeList.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import React from 'react';
1
+ import React, { MutableRefObject } from 'react';
2
+ import { VariableSizeList as List } from 'react-window';
2
3
  declare type Props<T> = {
3
4
  width: number;
4
5
  height: number;
@@ -9,6 +10,8 @@ declare type Props<T> = {
9
10
  data: T[];
10
11
  index: number;
11
12
  }) => React.ReactNode;
13
+ showNotMeasuredItems?: boolean;
14
+ listRef?: MutableRefObject<List>;
12
15
  };
13
- declare const _default: React.MemoExoticComponent<(<T extends unknown>({ width, height, defaultItemSize, data, children, itemKey }: Props<T>) => JSX.Element)>;
16
+ declare const _default: React.MemoExoticComponent<(<T extends unknown>({ width, height, defaultItemSize, data, children, itemKey, showNotMeasuredItems, listRef: listRefProp }: Props<T>) => JSX.Element)>;
14
17
  export default _default;
package/cjs/components/AutoSizeList/AutoSizeList.js CHANGED
@@ -39,7 +39,7 @@ var react_resize_detector_1 = __importDefault(require("react-resize-detector"));
39
39
  var mdm_sdk_1 = require("@reltio/mdm-sdk");
40
40
  var styles_1 = require("./styles");
41
41
  var AutoSizeList = function (_a) {
42
- var _b = _a.width, width = _b === void 0 ? 0 : _b, _c = _a.height, height = _c === void 0 ? 0 : _c, defaultItemSize = _a.defaultItemSize, data = _a.data, children = _a.children, itemKey = _a.itemKey;
42
+ var _b = _a.width, width = _b === void 0 ? 0 : _b, _c = _a.height, height = _c === void 0 ? 0 : _c, defaultItemSize = _a.defaultItemSize, data = _a.data, children = _a.children, itemKey = _a.itemKey, showNotMeasuredItems = _a.showNotMeasuredItems, listRefProp = _a.listRef;
43
43
  var styles = styles_1.useStyles();
44
44
  var rowHeightsCache = react_1.useRef({});
45
45
  var cacheRowHeight = function (key, height) {
@@ -50,15 +50,19 @@ var AutoSizeList = function (_a) {
50
50
  var applyRowHeights = react_1.useCallback(mdm_sdk_1.debounce(function () {
51
51
  setRowHeights(__assign({}, rowHeightsCache.current));
52
52
  }), []);
53
- var getItemKey = function (index) { return (itemKey ? itemKey(index, data) : index); };
53
+ var getItemKeyFromData = react_1.useCallback(function (data, index) { return (itemKey ? itemKey(index, data) : index); }, [itemKey]);
54
+ var getItemKey = function (index) { return getItemKeyFromData(data, index); };
54
55
  var getItemSize = function (index) { return rowHeights[getItemKey(index)] || defaultItemSize; };
55
- var listRef = react_1.useRef();
56
+ var localListRef = react_1.useRef();
57
+ var listRef = listRefProp || localListRef;
56
58
  listRef.current && listRef.current.resetAfterIndex(0, false);
57
- return (react_1.default.createElement(react_window_1.VariableSizeList, { ref: listRef, width: width, height: height, itemCount: data.length, itemData: data, itemSize: getItemSize, itemKey: itemKey }, function (_a) {
59
+ var Row = react_1.useMemo(
60
+ //eslint-disable-next-line
61
+ function () { return function (_a) {
58
62
  var data = _a.data, index = _a.index, style = _a.style;
59
- var key = getItemKey(index);
63
+ var key = getItemKeyFromData(data, index);
60
64
  return (react_1.default.createElement("div", { style: style, className: styles.item },
61
- react_1.default.createElement("div", { style: { visibility: key in rowHeights ? undefined : 'hidden' } },
65
+ react_1.default.createElement("div", { style: !showNotMeasuredItems ? { visibility: key in rowHeights ? undefined : 'hidden' } : undefined },
62
66
  react_1.default.createElement(react_resize_detector_1.default, { handleHeight: true, onResize: function (_, height) {
63
67
  if (rowHeightsCache.current[key] !== height) {
64
68
  cacheRowHeight(key, height);
@@ -66,6 +70,9 @@ var AutoSizeList = function (_a) {
66
70
  }
67
71
  } }),
68
72
  children({ data: data, index: index }))));
69
- }));
73
+ }; },
74
+ //eslint-disable-next-line react-hooks/exhaustive-deps
75
+ [children, showNotMeasuredItems, getItemKeyFromData, applyRowHeights, !showNotMeasuredItems && rowHeights]);
76
+ return (react_1.default.createElement(react_window_1.VariableSizeList, { ref: listRef, width: width, height: height, itemCount: data.length, itemData: data, itemSize: getItemSize, itemKey: itemKey }, Row));
70
77
  };
71
78
  exports.default = react_1.memo(AutoSizeList);
package/cjs/contexts/EntitiesMapContext/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { EntitiesMap } from '@reltio/mdm-sdk';
2
2
  import React from 'react';
3
- export declare const EntitiesMapContext: React.Context<EntitiesMap>;
3
+ export declare const EntitiesMapContext: React.Context<EntitiesMap<import("@reltio/mdm-sdk").Entity>>;
package/esm/components/AutoSizeList/AutoSizeList.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import React from 'react';
1
+ import React, { MutableRefObject } from 'react';
2
+ import { VariableSizeList as List } from 'react-window';
2
3
  declare type Props<T> = {
3
4
  width: number;
4
5
  height: number;
@@ -9,6 +10,8 @@ declare type Props<T> = {
9
10
  data: T[];
10
11
  index: number;
11
12
  }) => React.ReactNode;
13
+ showNotMeasuredItems?: boolean;
14
+ listRef?: MutableRefObject<List>;
12
15
  };
13
- declare const _default: React.MemoExoticComponent<(<T extends unknown>({ width, height, defaultItemSize, data, children, itemKey }: Props<T>) => JSX.Element)>;
16
+ declare const _default: React.MemoExoticComponent<(<T extends unknown>({ width, height, defaultItemSize, data, children, itemKey, showNotMeasuredItems, listRef: listRefProp }: Props<T>) => JSX.Element)>;
14
17
  export default _default;
package/esm/components/AutoSizeList/AutoSizeList.js CHANGED
@@ -9,13 +9,13 @@ var __assign = (this && this.__assign) || function () {
9
9
  };
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
- import React, { memo, useCallback, useRef, useState } from 'react';
12
+ import React, { memo, useCallback, useMemo, useRef, useState } from 'react';
13
13
  import { VariableSizeList as List } from 'react-window';
14
14
  import ReactResizeDetector from 'react-resize-detector';
15
15
  import { debounce } from '@reltio/mdm-sdk';
16
16
  import { useStyles } from './styles';
17
17
  var AutoSizeList = function (_a) {
18
- var _b = _a.width, width = _b === void 0 ? 0 : _b, _c = _a.height, height = _c === void 0 ? 0 : _c, defaultItemSize = _a.defaultItemSize, data = _a.data, children = _a.children, itemKey = _a.itemKey;
18
+ var _b = _a.width, width = _b === void 0 ? 0 : _b, _c = _a.height, height = _c === void 0 ? 0 : _c, defaultItemSize = _a.defaultItemSize, data = _a.data, children = _a.children, itemKey = _a.itemKey, showNotMeasuredItems = _a.showNotMeasuredItems, listRefProp = _a.listRef;
19
19
  var styles = useStyles();
20
20
  var rowHeightsCache = useRef({});
21
21
  var cacheRowHeight = function (key, height) {
@@ -26,15 +26,19 @@ var AutoSizeList = function (_a) {
26
26
  var applyRowHeights = useCallback(debounce(function () {
27
27
  setRowHeights(__assign({}, rowHeightsCache.current));
28
28
  }), []);
29
- var getItemKey = function (index) { return (itemKey ? itemKey(index, data) : index); };
29
+ var getItemKeyFromData = useCallback(function (data, index) { return (itemKey ? itemKey(index, data) : index); }, [itemKey]);
30
+ var getItemKey = function (index) { return getItemKeyFromData(data, index); };
30
31
  var getItemSize = function (index) { return rowHeights[getItemKey(index)] || defaultItemSize; };
31
- var listRef = useRef();
32
+ var localListRef = useRef();
33
+ var listRef = listRefProp || localListRef;
32
34
  listRef.current && listRef.current.resetAfterIndex(0, false);
33
- return (React.createElement(List, { ref: listRef, width: width, height: height, itemCount: data.length, itemData: data, itemSize: getItemSize, itemKey: itemKey }, function (_a) {
35
+ var Row = useMemo(
36
+ //eslint-disable-next-line
37
+ function () { return function (_a) {
34
38
  var data = _a.data, index = _a.index, style = _a.style;
35
- var key = getItemKey(index);
39
+ var key = getItemKeyFromData(data, index);
36
40
  return (React.createElement("div", { style: style, className: styles.item },
37
- React.createElement("div", { style: { visibility: key in rowHeights ? undefined : 'hidden' } },
41
+ React.createElement("div", { style: !showNotMeasuredItems ? { visibility: key in rowHeights ? undefined : 'hidden' } : undefined },
38
42
  React.createElement(ReactResizeDetector, { handleHeight: true, onResize: function (_, height) {
39
43
  if (rowHeightsCache.current[key] !== height) {
40
44
  cacheRowHeight(key, height);
@@ -42,6 +46,9 @@ var AutoSizeList = function (_a) {
42
46
  }
43
47
  } }),
44
48
  children({ data: data, index: index }))));
45
- }));
49
+ }; },
50
+ //eslint-disable-next-line react-hooks/exhaustive-deps
51
+ [children, showNotMeasuredItems, getItemKeyFromData, applyRowHeights, !showNotMeasuredItems && rowHeights]);
52
+ return (React.createElement(List, { ref: listRef, width: width, height: height, itemCount: data.length, itemData: data, itemSize: getItemSize, itemKey: itemKey }, Row));
46
53
  };
47
54
  export default memo(AutoSizeList);
package/esm/contexts/EntitiesMapContext/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { EntitiesMap } from '@reltio/mdm-sdk';
2
2
  import React from 'react';
3
- export declare const EntitiesMapContext: React.Context<EntitiesMap>;
3
+ export declare const EntitiesMapContext: React.Context<EntitiesMap<import("@reltio/mdm-sdk").Entity>>;
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.1032",
3
+ "version": "1.4.1035",
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.1032",
11
- "@reltio/mdm-sdk": "^1.4.1032",
10
+ "@reltio/mdm-module": "^1.4.1035",
11
+ "@reltio/mdm-sdk": "^1.4.1035",
12
12
  "classnames": "^2.2.5",
13
13
  "d3-cloud": "^1.2.5",
14
14
  "d3-geo": "^2.0.1",