@reltio/components 1.4.1437 → 1.4.1438

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 (5) hide show
  1. package/cjs/components/attributes/editMode/EntitySelector/components/EntityOption.js +8 -6
  2. package/cjs/components/commonReactSelectComponents/MenuWithPopper.js +7 -2
  3. package/esm/components/attributes/editMode/EntitySelector/components/EntityOption.js +8 -6
  4. package/esm/components/commonReactSelectComponents/MenuWithPopper.js +7 -2
  5. package/package.json +3 -3
package/cjs/components/attributes/editMode/EntitySelector/components/EntityOption.js CHANGED
@@ -17,9 +17,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
17
17
  var react_1 = __importDefault(require("react"));
18
18
  var prop_types_1 = __importDefault(require("prop-types"));
19
19
  var ui_i18n_1 = __importDefault(require("ui-i18n"));
20
- var EntityTypeIcon_1 = __importDefault(require("../../../../EntityTypeIcon/EntityTypeIcon"));
21
20
  var MenuItem_1 = __importDefault(require("@material-ui/core/MenuItem"));
22
21
  var mdm_sdk_1 = require("@reltio/mdm-sdk");
22
+ var EntityTypeIcon_1 = __importDefault(require("../../../../EntityTypeIcon/EntityTypeIcon"));
23
+ var ExpandedValueTooltip_1 = __importDefault(require("../../../../ExpandedValueTooltip/ExpandedValueTooltip"));
23
24
  var styles_1 = require("./styles");
24
25
  var EntityOption = function (_a) {
25
26
  var innerRef = _a.innerRef, innerProps = _a.innerProps, selectOption = _a.selectOption, data = _a.data;
@@ -28,11 +29,12 @@ var EntityOption = function (_a) {
28
29
  if (uri !== '') {
29
30
  return (react_1.default.createElement(MenuItem_1.default, __assign({ className: styles.entityContainer, ref: innerRef, key: uri, onClick: function () { return selectOption({ label: label, uri: uri, entityType: entityType }); } }, innerProps),
30
31
  react_1.default.createElement(EntityTypeIcon_1.default, { className: styles.entityAvatar, entityType: entityType }),
31
- react_1.default.createElement("span", { className: styles.entityLabel },
32
- label,
33
- secondaryLabel && react_1.default.createElement("span", { className: styles.entitySecondaryLabel },
34
- ", ",
35
- secondaryLabel))));
32
+ react_1.default.createElement(ExpandedValueTooltip_1.default, { value: "".concat(label).concat(secondaryLabel ? ', ' + secondaryLabel : '') },
33
+ react_1.default.createElement("span", { className: styles.entityLabel },
34
+ label,
35
+ secondaryLabel && react_1.default.createElement("span", { className: styles.entitySecondaryLabel },
36
+ ", ",
37
+ secondaryLabel)))));
36
38
  }
37
39
  else {
38
40
  return (react_1.default.createElement(MenuItem_1.default, __assign({ className: styles.entityContainer, ref: innerRef, key: uri }, innerProps, { disabled: true }),
package/cjs/components/commonReactSelectComponents/MenuWithPopper.js CHANGED
@@ -45,6 +45,7 @@ var Popper_1 = __importDefault(require("../Popper/Popper"));
45
45
  var Paper_1 = __importDefault(require("@material-ui/core/Paper"));
46
46
  var menuStyles_1 = require("./menuStyles");
47
47
  var PopupBoundariesContext_1 = require("../../contexts/PopupBoundariesContext");
48
+ var DEFAULT_MAX_WIDTH = 521;
48
49
  var MenuWithPopper = function (props) {
49
50
  var _a = props.selectProps, inputRef = _a.inputRef, menuIsOpen = _a.menuIsOpen, inputValue = _a.inputValue, innerRef = props.innerRef, children = props.children, innerProps = props.innerProps;
50
51
  var _b = (0, react_1.useState)('id'), key = _b[0], setKey = _b[1];
@@ -54,6 +55,7 @@ var MenuWithPopper = function (props) {
54
55
  var styles = (0, menuStyles_1.useMenuStyles)();
55
56
  var popupBoundariesContext = (0, react_1.useContext)(PopupBoundariesContext_1.PopupBoundariesContext);
56
57
  var hasBoundariesElement = popupBoundariesContext && popupBoundariesContext.element;
58
+ var boundariesWidth = hasBoundariesElement ? popupBoundariesContext.element.clientWidth : window.innerWidth;
57
59
  return (react_1.default.createElement(Popper_1.default, { anchorEl: inputRef.current, open: menuIsOpen, className: styles.popper, key: key, modifiers: hasBoundariesElement
58
60
  ? {
59
61
  preventOverflow: {
@@ -61,8 +63,11 @@ var MenuWithPopper = function (props) {
61
63
  priority: popupBoundariesContext.priority
62
64
  }
63
65
  }
64
- : undefined, placement: "bottom" },
65
- react_1.default.createElement(Paper_1.default, __assign({ ref: innerRef, style: { width: (0, ramda_1.prop)('clientWidth', inputRef.current) } }, innerProps), children)));
66
+ : undefined, placement: "bottom-start" },
67
+ react_1.default.createElement(Paper_1.default, __assign({ ref: innerRef, style: {
68
+ minWidth: Math.min((0, ramda_1.prop)('clientWidth', inputRef.current), boundariesWidth),
69
+ maxWidth: Math.min(DEFAULT_MAX_WIDTH, boundariesWidth)
70
+ } }, innerProps), children)));
66
71
  };
67
72
  MenuWithPopper.propTypes = {
68
73
  children: prop_types_1.default.oneOfType([prop_types_1.default.element, prop_types_1.default.array]).isRequired,
package/esm/components/attributes/editMode/EntitySelector/components/EntityOption.js CHANGED
@@ -12,9 +12,10 @@ var __assign = (this && this.__assign) || function () {
12
12
  import React from 'react';
13
13
  import PropTypes from 'prop-types';
14
14
  import i18n from 'ui-i18n';
15
- import EntityTypeIcon from '../../../../EntityTypeIcon/EntityTypeIcon';
16
15
  import MenuItem from '@material-ui/core/MenuItem';
17
16
  import { EntityType } from '@reltio/mdm-sdk';
17
+ import EntityTypeIcon from '../../../../EntityTypeIcon/EntityTypeIcon';
18
+ import ExpandedValueTooltip from '../../../../ExpandedValueTooltip/ExpandedValueTooltip';
18
19
  import { useStyles } from './styles';
19
20
  var EntityOption = function (_a) {
20
21
  var innerRef = _a.innerRef, innerProps = _a.innerProps, selectOption = _a.selectOption, data = _a.data;
@@ -23,11 +24,12 @@ var EntityOption = function (_a) {
23
24
  if (uri !== '') {
24
25
  return (React.createElement(MenuItem, __assign({ className: styles.entityContainer, ref: innerRef, key: uri, onClick: function () { return selectOption({ label: label, uri: uri, entityType: entityType }); } }, innerProps),
25
26
  React.createElement(EntityTypeIcon, { className: styles.entityAvatar, entityType: entityType }),
26
- React.createElement("span", { className: styles.entityLabel },
27
- label,
28
- secondaryLabel && React.createElement("span", { className: styles.entitySecondaryLabel },
29
- ", ",
30
- secondaryLabel))));
27
+ React.createElement(ExpandedValueTooltip, { value: "".concat(label).concat(secondaryLabel ? ', ' + secondaryLabel : '') },
28
+ React.createElement("span", { className: styles.entityLabel },
29
+ label,
30
+ secondaryLabel && React.createElement("span", { className: styles.entitySecondaryLabel },
31
+ ", ",
32
+ secondaryLabel)))));
31
33
  }
32
34
  else {
33
35
  return (React.createElement(MenuItem, __assign({ className: styles.entityContainer, ref: innerRef, key: uri }, innerProps, { disabled: true }),
package/esm/components/commonReactSelectComponents/MenuWithPopper.js CHANGED
@@ -17,6 +17,7 @@ import Popper from '../Popper/Popper';
17
17
  import Paper from '@material-ui/core/Paper';
18
18
  import { useMenuStyles } from './menuStyles';
19
19
  import { PopupBoundariesContext } from '../../contexts/PopupBoundariesContext';
20
+ var DEFAULT_MAX_WIDTH = 521;
20
21
  var MenuWithPopper = function (props) {
21
22
  var _a = props.selectProps, inputRef = _a.inputRef, menuIsOpen = _a.menuIsOpen, inputValue = _a.inputValue, innerRef = props.innerRef, children = props.children, innerProps = props.innerProps;
22
23
  var _b = useState('id'), key = _b[0], setKey = _b[1];
@@ -26,6 +27,7 @@ var MenuWithPopper = function (props) {
26
27
  var styles = useMenuStyles();
27
28
  var popupBoundariesContext = useContext(PopupBoundariesContext);
28
29
  var hasBoundariesElement = popupBoundariesContext && popupBoundariesContext.element;
30
+ var boundariesWidth = hasBoundariesElement ? popupBoundariesContext.element.clientWidth : window.innerWidth;
29
31
  return (React.createElement(Popper, { anchorEl: inputRef.current, open: menuIsOpen, className: styles.popper, key: key, modifiers: hasBoundariesElement
30
32
  ? {
31
33
  preventOverflow: {
@@ -33,8 +35,11 @@ var MenuWithPopper = function (props) {
33
35
  priority: popupBoundariesContext.priority
34
36
  }
35
37
  }
36
- : undefined, placement: "bottom" },
37
- React.createElement(Paper, __assign({ ref: innerRef, style: { width: prop('clientWidth', inputRef.current) } }, innerProps), children)));
38
+ : undefined, placement: "bottom-start" },
39
+ React.createElement(Paper, __assign({ ref: innerRef, style: {
40
+ minWidth: Math.min(prop('clientWidth', inputRef.current), boundariesWidth),
41
+ maxWidth: Math.min(DEFAULT_MAX_WIDTH, boundariesWidth)
42
+ } }, innerProps), children)));
38
43
  };
39
44
  MenuWithPopper.propTypes = {
40
45
  children: PropTypes.oneOfType([PropTypes.element, PropTypes.array]).isRequired,
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.1437",
3
+ "version": "1.4.1438",
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.1437",
11
- "@reltio/mdm-sdk": "^1.4.1437",
10
+ "@reltio/mdm-module": "^1.4.1438",
11
+ "@reltio/mdm-sdk": "^1.4.1438",
12
12
  "classnames": "^2.2.5",
13
13
  "d3-cloud": "^1.2.5",
14
14
  "d3-geo": "^2.0.1",