@reltio/components 1.4.1500 → 1.4.1501

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 (9) hide show
  1. package/cjs/components/HierarchyNodeTitle/HierarchyNodeTitle.js +2 -2
  2. package/cjs/components/ReltioGridLayout/ReltioGridLayout.js +7 -4
  3. package/cjs/components/ReltioGridLayout/styles.d.ts +1 -1
  4. package/cjs/components/ReltioGridLayout/styles.js +5 -5
  5. package/esm/components/HierarchyNodeTitle/HierarchyNodeTitle.js +2 -2
  6. package/esm/components/ReltioGridLayout/ReltioGridLayout.js +7 -4
  7. package/esm/components/ReltioGridLayout/styles.d.ts +1 -1
  8. package/esm/components/ReltioGridLayout/styles.js +5 -5
  9. package/package.json +3 -3
package/cjs/components/HierarchyNodeTitle/HierarchyNodeTitle.js CHANGED
@@ -46,12 +46,12 @@ var HierarchyNodeTitle = function (_a) {
46
46
  var generateEntityUrl = (0, react_1.useContext)(contexts_1.UrlGeneratorsContext).generateEntityUrl;
47
47
  var _d = (0, useEntityDetails_1.useEntityDetails)(entityUri), isLoading = _d.isLoading, entityDetails = _d.entityDetails, showEntityDetails = _d.showEntityDetails, hideEntityDetails = _d.hideEntityDetails;
48
48
  var link = generateEntityUrl({ uiPath: uiPath, uri: entityUri });
49
- var showPopper = Boolean(entityDetails) || isLoading;
49
+ var showPopper = anchorEl && (Boolean(entityDetails) || isLoading);
50
50
  var handleClick = (0, react_1.useCallback)(function () {
51
51
  dispatch(mdm_module_1.ui.actions.openEntity({ uri: entityUri, viewId: viewId }));
52
52
  }, [dispatch, entityUri, viewId]);
53
53
  return (react_1.default.createElement(react_1.default.Fragment, null,
54
- react_1.default.createElement("span", { className: (0, classnames_1.default)(styles.link, (_b = {}, _b[styles.selected] = isSelected, _b)), onMouseEnter: withEntityDetails ? showEntityDetails : undefined, onMouseLeave: withEntityDetails ? hideEntityDetails : undefined },
54
+ react_1.default.createElement("span", { "data-reltio-id": "reltio-hierarchy-node-title", className: (0, classnames_1.default)(styles.link, (_b = {}, _b[styles.selected] = isSelected, _b)), onMouseEnter: withEntityDetails ? showEntityDetails : undefined, onMouseLeave: withEntityDetails ? hideEntityDetails : undefined },
55
55
  react_1.default.createElement(Link_1.default, { to: link, onClick: handleClick }, title)),
56
56
  react_1.default.createElement(Popper_1.default, { anchorEl: anchorEl, className: styles.popper, open: showPopper, modal: false, placement: "top-start" },
57
57
  react_1.default.createElement(ProfileCard_1.default, { entity: entityDetails, variant: isLoading ? 'loading' : 'normal' }))));
package/cjs/components/ReltioGridLayout/ReltioGridLayout.js CHANGED
@@ -50,8 +50,9 @@ var ReltioGridLayout = function (_a) {
50
50
  var views = _a.views, layout = _a.layout, layoutOptions = _a.layoutOptions, onLayoutChanged = _a.onLayoutChanged, draggableHandle = _a.draggableHandle, LayoutItem = _a.LayoutItem, onRemove = _a.onRemove, onDrop = _a.onDrop, droppingItem = _a.droppingItem, isDroppable = _a.isDroppable, classes = _a.classes;
51
51
  var ref = (0, react_1.useRef)();
52
52
  var styles = (0, styles_1.useStyles)();
53
- var _c = (0, react_1.useState)(null), fullscreenItemId = _c[0], setFullscreenItemId = _c[1];
54
- var _d = (0, react_1.useState)(0), width = _d[0], setWidth = _d[1];
53
+ var _c = (0, react_1.useState)(null), resizingItemId = _c[0], setResizingItemId = _c[1];
54
+ var _d = (0, react_1.useState)(null), fullscreenItemId = _d[0], setFullscreenItemId = _d[1];
55
+ var _e = (0, react_1.useState)(0), width = _e[0], setWidth = _e[1];
55
56
  var cols = layoutOptions.cols, rowHeight = layoutOptions.rowHeight, margin = layoutOptions.margin;
56
57
  var processedLayout = (0, react_1.useMemo)(function () { return (0, helpers_1.reltioLayoutToReactGridLayout)(layout); }, [layout]);
57
58
  var onReltioLayoutChanged = (0, ramda_1.pipe)(helpers_1.reactGridLayoutToReltioLayout, (0, helpers_1.copyPropsFromPreviousLayout)(['autosizing'], layout), onLayoutChanged);
@@ -87,13 +88,15 @@ var ReltioGridLayout = function (_a) {
87
88
  react_1.default.createElement(react_resize_detector_1.default, { refreshMode: "debounce", refreshRate: 50, handleWidth: true, onResize: function (width) { return setWidth(width); } }),
88
89
  !!width && (react_1.default.createElement(react_grid_layout_1.default, { innerRef: ref, layout: processedLayout, cols: cols, draggableHandle: draggableHandle, autoSize: true, rowHeight: rowHeight, width: width, margin: margin, onLayoutChange: onReltioLayoutChanged, isResizable: !isFullscreenEnabled, isDraggable: !isFullscreenEnabled, className: (0, classnames_1.default)(classes.root, styles.gridLayout, (_b = {},
89
90
  _b[styles.gridFullscreen] = isFullscreenEnabled,
90
- _b)), onDrop: handleDrop, droppingItem: droppingItem, isDroppable: isDroppable }, processedLayout.map(function (layoutItem) {
91
+ _b)), onDrop: handleDrop, droppingItem: droppingItem, isDroppable: isDroppable, onResizeStart: function (_, layoutItem) { return setResizingItemId(layoutItem.i); }, onResizeStop: function () { return setResizingItemId(null); } }, processedLayout.map(function (layoutItem) {
92
+ var _a;
91
93
  var isItemFullscreen = fullscreenItemId === layoutItem.i;
94
+ var isResizing = resizingItemId === layoutItem.i;
92
95
  var isAutosize = ((0, helpers_1.getReltioLayoutItemById)(layout, layoutItem.i) || {}).autosizing;
93
96
  var autosizeComponent = isAutosize
94
97
  ? { AutosizeComponent: getAutosizeComponent(layoutItem.i) }
95
98
  : {};
96
- return (react_1.default.createElement(LayoutItem, __assign({ key: layoutItem.i, layoutItemConfig: layoutItem, views: views, onToggleFullscreen: onToggleFullscreen, onRemove: onRemove, className: (0, classnames_1.default)({ fullscreen: isItemFullscreen }, classes.item), isFullscreen: isItemFullscreen }, autosizeComponent)));
99
+ return (react_1.default.createElement(LayoutItem, __assign({ key: layoutItem.i, layoutItemConfig: layoutItem, views: views, onToggleFullscreen: onToggleFullscreen, onRemove: onRemove, className: (0, classnames_1.default)((_a = { fullscreen: isItemFullscreen }, _a[styles.isResizing] = isResizing, _a), classes.item), isFullscreen: isItemFullscreen }, autosizeComponent)));
97
100
  })))));
98
101
  };
99
102
  ReltioGridLayout.defaultProps = {
package/cjs/components/ReltioGridLayout/styles.d.ts CHANGED
@@ -1 +1 @@
1
- export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"gridLayout" | "gridFullscreen">;
1
+ export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"gridLayout" | "gridFullscreen" | "isResizing">;
package/cjs/components/ReltioGridLayout/styles.js CHANGED
@@ -26,11 +26,6 @@ exports.useStyles = (0, styles_1.makeStyles)(function (_) { return ({
26
26
  '&.cssTransforms': {
27
27
  transitionProperty: 'transform'
28
28
  },
29
- '&.resizing': {
30
- zIndex: 9,
31
- willChange: 'width, height',
32
- pointerEvents: 'none'
33
- },
34
29
  '&.react-draggable-dragging': {
35
30
  transition: 'none',
36
31
  zIndex: 8,
@@ -67,5 +62,10 @@ exports.useStyles = (0, styles_1.makeStyles)(function (_) { return ({
67
62
  '& .react-resizable-handle, & .react-grid-item': {
68
63
  visibility: 'hidden'
69
64
  }
65
+ },
66
+ isResizing: {
67
+ zIndex: 9,
68
+ willChange: 'width, height',
69
+ pointerEvents: 'none'
70
70
  }
71
71
  }); });
package/esm/components/HierarchyNodeTitle/HierarchyNodeTitle.js CHANGED
@@ -17,12 +17,12 @@ export var HierarchyNodeTitle = function (_a) {
17
17
  var generateEntityUrl = useContext(UrlGeneratorsContext).generateEntityUrl;
18
18
  var _d = useEntityDetails(entityUri), isLoading = _d.isLoading, entityDetails = _d.entityDetails, showEntityDetails = _d.showEntityDetails, hideEntityDetails = _d.hideEntityDetails;
19
19
  var link = generateEntityUrl({ uiPath: uiPath, uri: entityUri });
20
- var showPopper = Boolean(entityDetails) || isLoading;
20
+ var showPopper = anchorEl && (Boolean(entityDetails) || isLoading);
21
21
  var handleClick = useCallback(function () {
22
22
  dispatch(ui.actions.openEntity({ uri: entityUri, viewId: viewId }));
23
23
  }, [dispatch, entityUri, viewId]);
24
24
  return (React.createElement(React.Fragment, null,
25
- React.createElement("span", { className: classnames(styles.link, (_b = {}, _b[styles.selected] = isSelected, _b)), onMouseEnter: withEntityDetails ? showEntityDetails : undefined, onMouseLeave: withEntityDetails ? hideEntityDetails : undefined },
25
+ React.createElement("span", { "data-reltio-id": "reltio-hierarchy-node-title", className: classnames(styles.link, (_b = {}, _b[styles.selected] = isSelected, _b)), onMouseEnter: withEntityDetails ? showEntityDetails : undefined, onMouseLeave: withEntityDetails ? hideEntityDetails : undefined },
26
26
  React.createElement(Link, { to: link, onClick: handleClick }, title)),
27
27
  React.createElement(Popper, { anchorEl: anchorEl, className: styles.popper, open: showPopper, modal: false, placement: "top-start" },
28
28
  React.createElement(ProfileCard, { entity: entityDetails, variant: isLoading ? 'loading' : 'normal' }))));
package/esm/components/ReltioGridLayout/ReltioGridLayout.js CHANGED
@@ -22,8 +22,9 @@ var ReltioGridLayout = function (_a) {
22
22
  var views = _a.views, layout = _a.layout, layoutOptions = _a.layoutOptions, onLayoutChanged = _a.onLayoutChanged, draggableHandle = _a.draggableHandle, LayoutItem = _a.LayoutItem, onRemove = _a.onRemove, onDrop = _a.onDrop, droppingItem = _a.droppingItem, isDroppable = _a.isDroppable, classes = _a.classes;
23
23
  var ref = useRef();
24
24
  var styles = useStyles();
25
- var _c = useState(null), fullscreenItemId = _c[0], setFullscreenItemId = _c[1];
26
- var _d = useState(0), width = _d[0], setWidth = _d[1];
25
+ var _c = useState(null), resizingItemId = _c[0], setResizingItemId = _c[1];
26
+ var _d = useState(null), fullscreenItemId = _d[0], setFullscreenItemId = _d[1];
27
+ var _e = useState(0), width = _e[0], setWidth = _e[1];
27
28
  var cols = layoutOptions.cols, rowHeight = layoutOptions.rowHeight, margin = layoutOptions.margin;
28
29
  var processedLayout = useMemo(function () { return reltioLayoutToReactGridLayout(layout); }, [layout]);
29
30
  var onReltioLayoutChanged = pipe(reactGridLayoutToReltioLayout, copyPropsFromPreviousLayout(['autosizing'], layout), onLayoutChanged);
@@ -59,13 +60,15 @@ var ReltioGridLayout = function (_a) {
59
60
  React.createElement(ReactResizeDetector, { refreshMode: "debounce", refreshRate: 50, handleWidth: true, onResize: function (width) { return setWidth(width); } }),
60
61
  !!width && (React.createElement(GridLayout, { innerRef: ref, layout: processedLayout, cols: cols, draggableHandle: draggableHandle, autoSize: true, rowHeight: rowHeight, width: width, margin: margin, onLayoutChange: onReltioLayoutChanged, isResizable: !isFullscreenEnabled, isDraggable: !isFullscreenEnabled, className: classnames(classes.root, styles.gridLayout, (_b = {},
61
62
  _b[styles.gridFullscreen] = isFullscreenEnabled,
62
- _b)), onDrop: handleDrop, droppingItem: droppingItem, isDroppable: isDroppable }, processedLayout.map(function (layoutItem) {
63
+ _b)), onDrop: handleDrop, droppingItem: droppingItem, isDroppable: isDroppable, onResizeStart: function (_, layoutItem) { return setResizingItemId(layoutItem.i); }, onResizeStop: function () { return setResizingItemId(null); } }, processedLayout.map(function (layoutItem) {
64
+ var _a;
63
65
  var isItemFullscreen = fullscreenItemId === layoutItem.i;
66
+ var isResizing = resizingItemId === layoutItem.i;
64
67
  var isAutosize = (getReltioLayoutItemById(layout, layoutItem.i) || {}).autosizing;
65
68
  var autosizeComponent = isAutosize
66
69
  ? { AutosizeComponent: getAutosizeComponent(layoutItem.i) }
67
70
  : {};
68
- return (React.createElement(LayoutItem, __assign({ key: layoutItem.i, layoutItemConfig: layoutItem, views: views, onToggleFullscreen: onToggleFullscreen, onRemove: onRemove, className: classnames({ fullscreen: isItemFullscreen }, classes.item), isFullscreen: isItemFullscreen }, autosizeComponent)));
71
+ return (React.createElement(LayoutItem, __assign({ key: layoutItem.i, layoutItemConfig: layoutItem, views: views, onToggleFullscreen: onToggleFullscreen, onRemove: onRemove, className: classnames((_a = { fullscreen: isItemFullscreen }, _a[styles.isResizing] = isResizing, _a), classes.item), isFullscreen: isItemFullscreen }, autosizeComponent)));
69
72
  })))));
70
73
  };
71
74
  ReltioGridLayout.defaultProps = {
package/esm/components/ReltioGridLayout/styles.d.ts CHANGED
@@ -1 +1 @@
1
- export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"gridLayout" | "gridFullscreen">;
1
+ export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"gridLayout" | "gridFullscreen" | "isResizing">;
package/esm/components/ReltioGridLayout/styles.js CHANGED
@@ -23,11 +23,6 @@ export var useStyles = makeStyles(function (_) { return ({
23
23
  '&.cssTransforms': {
24
24
  transitionProperty: 'transform'
25
25
  },
26
- '&.resizing': {
27
- zIndex: 9,
28
- willChange: 'width, height',
29
- pointerEvents: 'none'
30
- },
31
26
  '&.react-draggable-dragging': {
32
27
  transition: 'none',
33
28
  zIndex: 8,
@@ -64,5 +59,10 @@ export var useStyles = makeStyles(function (_) { return ({
64
59
  '& .react-resizable-handle, & .react-grid-item': {
65
60
  visibility: 'hidden'
66
61
  }
62
+ },
63
+ isResizing: {
64
+ zIndex: 9,
65
+ willChange: 'width, height',
66
+ pointerEvents: 'none'
67
67
  }
68
68
  }); });
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.1500",
3
+ "version": "1.4.1501",
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.1500",
11
- "@reltio/mdm-sdk": "^1.4.1500",
10
+ "@reltio/mdm-module": "^1.4.1501",
11
+ "@reltio/mdm-sdk": "^1.4.1501",
12
12
  "classnames": "^2.2.5",
13
13
  "d3-cloud": "^1.2.5",
14
14
  "d3-geo": "^2.0.1",