@reltio/components 1.4.876 → 1.4.880

package/components/attributes/editMode/EntitySelector/components/Group.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,31 +9,27 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var prop_types_1 = __importDefault(require("prop-types"));
-var ui_i18n_1 = __importDefault(require("ui-i18n"));
-var react_select_1 = require("react-select");
-var Add_1 = __importDefault(require("@material-ui/icons/Add"));
-var styles_1 = require("./styles");
-var ComponentsGroup = react_select_1.components.Group;
+import React from 'react';
+import PropTypes from 'prop-types';
+import i18n from 'ui-i18n';
+import { components } from 'react-select';
+import AddIcon from '@material-ui/icons/Add';
+import { useGroupStyles } from './styles';
+var ComponentsGroup = components.Group;
 var Group = function (props) {
     var _a = props.selectProps, inputValue = _a.inputValue, onCreate = _a.onCreate, data = props.data, children = props.children;
-    var styles = styles_1.useGroupStyles();
-    return (react_1.default.createElement(ComponentsGroup, __assign({}, props),
-        react_1.default.createElement("div", { className: styles.groupHeading },
-            react_1.default.createElement("span", null, data.label),
-            onCreate && (react_1.default.createElement("span", { onClick: function () { return onCreate(inputValue, data.entityType); }, className: styles.addLabel },
-                react_1.default.createElement(Add_1.default, { className: styles.addIcon }),
-                ui_i18n_1.default.text("Create " + (inputValue ? "\"" + inputValue + "\" as " : '') + "new " + data.label)))),
+    var styles = useGroupStyles();
+    return (React.createElement(ComponentsGroup, __assign({}, props),
+        React.createElement("div", { className: styles.groupHeading },
+            React.createElement("span", null, data.label),
+            onCreate && (React.createElement("span", { onClick: function () { return onCreate(inputValue, data.entityType); }, className: styles.addLabel },
+                React.createElement(AddIcon, { className: styles.addIcon }),
+                i18n.text("Create " + (inputValue ? "\"" + inputValue + "\" as " : '') + "new " + data.label)))),
         children));
 };
 Group.propTypes = {
-    selectProps: prop_types_1.default.object.isRequired,
-    data: prop_types_1.default.object,
-    children: prop_types_1.default.array
+    selectProps: PropTypes.object.isRequired,
+    data: PropTypes.object,
+    children: PropTypes.array
 };
-exports.default = Group;
+export default Group;

package/components/attributes/editMode/EntitySelector/components/SingleValue.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,71 +9,48 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var ramda_1 = require("ramda");
-var prop_types_1 = __importDefault(require("prop-types"));
-var classnames_1 = __importDefault(require("classnames"));
-var react_redux_1 = require("react-redux");
-var ui_i18n_1 = __importDefault(require("ui-i18n"));
-var styles_1 = require("./styles");
-var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
-var mdm_sdk_1 = require("@reltio/mdm-sdk");
-var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
-var ViewIdContext_1 = require("../../../../../contexts/ViewIdContext");
+import React, { useContext } from 'react';
+import { always, pipe } from 'ramda';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
+import { useDispatch, useSelector } from 'react-redux';
+import i18n from 'ui-i18n';
+import { useSingleValueStyles } from './styles';
+import mdmModule, { ui } from '@reltio/mdm-module';
+import { getEntityLink, getLabel, isTempUri } from '@reltio/mdm-sdk';
+import Typography from '@material-ui/core/Typography';
+import { ViewIdContext } from '../../../../../contexts/ViewIdContext';
 var SingleValue = function (props) {
     var _a = props.selectProps, currentEntityType = _a.currentEntityType, menuIsOpen = _a.menuIsOpen, disableLinkClick = _a.disableLinkClick, children = props.children, data = props.data;
-    var styles = styles_1.useSingleValueStyles();
-    var dispatch = react_redux_1.useDispatch();
-    var viewId = react_1.useContext(ViewIdContext_1.ViewIdContext);
-    var uiPath = react_redux_1.useSelector(mdm_module_1.default.selectors.getUIPath);
+    var styles = useSingleValueStyles();
+    var dispatch = useDispatch();
+    var viewId = useContext(ViewIdContext);
+    var uiPath = useSelector(mdmModule.selectors.getUIPath);
     var handleOnMouseDown = function (event) {
         event.stopPropagation();
         if (!disableLinkClick) {
-            ramda_1.pipe(ramda_1.always({ uri: data.entityUri, viewId: viewId }), mdm_module_1.ui.actions.openEntity, dispatch)();
+            pipe(always({ uri: data.entityUri, viewId: viewId }), ui.actions.openEntity, dispatch)();
         }
     };
-    var valueProps = mdm_sdk_1.isTempUri(data.entityUri)
+    var valueProps = isTempUri(data.entityUri)
         ? {
             className: styles.singleValue,
             component: 'span'
         }
         : {
-            className: classnames_1.default(styles.singleValue, styles.linkValue),
+            className: classnames(styles.singleValue, styles.linkValue),
             onMouseDown: handleOnMouseDown,
             onClick: function (e) { return e.preventDefault(); },
-            href: mdm_sdk_1.getEntityLink({ uiPath: uiPath, uri: data.entityUri }),
+            href: getEntityLink({ uiPath: uiPath, uri: data.entityUri }),
             component: 'a'
         };
-    return (!menuIsOpen && (react_1.default.createElement(Typography_1.default, __assign({}, valueProps), mdm_sdk_1.isTempUri(data.entityUri)
-        ? ui_i18n_1.default.text("New " + currentEntityType.label + " will be created")
-        : mdm_sdk_1.getLabel(children))));
+    return (!menuIsOpen && (React.createElement(Typography, __assign({}, valueProps), isTempUri(data.entityUri)
+        ? i18n.text("New " + currentEntityType.label + " will be created")
+        : getLabel(children))));
 };
 SingleValue.propTypes = {
-    children: prop_types_1.default.string,
-    data: prop_types_1.default.object.isRequired,
-    selectProps: prop_types_1.default.object.isRequired
+    children: PropTypes.string,
+    data: PropTypes.object.isRequired,
+    selectProps: PropTypes.object.isRequired
 };
-exports.default = SingleValue;
+export default SingleValue;

package/components/attributes/editMode/EntitySelector/components/styles.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useClearIconStyles = exports.useGroupStyles = exports.useSingleValueStyles = exports.useStyles = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.useStyles = styles_1.makeStyles({
+import { makeStyles } from '@material-ui/core/styles';
+export var useStyles = makeStyles({
     entityContainer: {
         display: 'flex',
         alignItems: 'center',
@@ -40,7 +37,7 @@ exports.useStyles = styles_1.makeStyles({
         color: 'rgba(0,0,0,0.6)'
     }
 });
-exports.useSingleValueStyles = styles_1.makeStyles(function (theme) { return ({
+export var useSingleValueStyles = makeStyles(function (theme) { return ({
     singleValue: {
         color: 'rgba(0, 0, 0, 0.87)',
         fontSize: '14px',
@@ -55,7 +52,7 @@ exports.useSingleValueStyles = styles_1.makeStyles(function (theme) { return ({
         textDecoration: 'none'
     }
 }); });
-exports.useGroupStyles = styles_1.makeStyles(function (theme) { return ({
+export var useGroupStyles = makeStyles(function (theme) { return ({
     addLabel: {
         color: theme.palette.primary.main,
         display: 'flex',
@@ -80,7 +77,7 @@ exports.useGroupStyles = styles_1.makeStyles(function (theme) { return ({
         padding: '0 9px'
     }
 }); });
-exports.useClearIconStyles = styles_1.makeStyles({
+export var useClearIconStyles = makeStyles({
     clearIcon: {
         cursor: 'pointer',
         height: '20px',

package/components/attributes/editMode/EntitySelector/styles.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.useStyles = styles_1.makeStyles({
+import { makeStyles } from '@material-ui/core/styles';
+export var useStyles = makeStyles({
     creatorWrapper: {
         marginTop: '20px'
     }

package/components/attributes/editMode/ImageAttributesLine/ImageAttributesLine.js

@@ -1,53 +1,29 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_redux_1 = require("react-redux");
-var CloudUpload_1 = __importDefault(require("@material-ui/icons/CloudUpload"));
-var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
-var mdm_sdk_1 = require("@reltio/mdm-sdk");
-var Image_1 = __importDefault(require("../../../Image/Image"));
-var ImageActionsOverlay_1 = __importDefault(require("../../../Image/ImageActionsOverlay/ImageActionsOverlay"));
-var SmallIconButton_1 = require("../../../SmallIconButton");
-var UploadImageDialog_1 = require("../../../UploadImageDialog/UploadImageDialog");
-var ImageAttributesLine_1 = __importDefault(require("../../ImageAttributesLine"));
-var constants_1 = require("../../ImageAttributesLine/constants");
-var styles_1 = require("./styles");
+import React, { useCallback, useState } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import CloudUploadIcon from '@material-ui/icons/CloudUpload';
+import mdmModule, { profile } from '@reltio/mdm-module';
+import { generateUri, getImageAttributeOvThumbnailUrl, getImageAttributeOvUrl } from '@reltio/mdm-sdk';
+import Image from '../../../Image/Image';
+import ImageActionsOverlay from '../../../Image/ImageActionsOverlay/ImageActionsOverlay';
+import { SmallIconButton } from '../../../SmallIconButton';
+import { UploadImageDialog } from '../../../UploadImageDialog/UploadImageDialog';
+import ImageAttributesLineCommon from '../../ImageAttributesLine';
+import { IMAGE_HEIGHT, IMAGE_MARGIN, IMAGE_WIDTH } from '../../ImageAttributesLine/constants';
+import { useStyles } from './styles';
 var ImageAttributesLine = function (_a) {
     var _b = _a.attributeType, attributeType = _b === void 0 ? {} : _b, _c = _a.attributeValues, attributeValues = _c === void 0 ? [] : _c, onDeleteAttribute = _a.onDeleteAttribute, onChangeAttribute = _a.onChangeAttribute, parentUri = _a.parentUri;
-    var styles = styles_1.useStyles({ imageMargin: constants_1.IMAGE_MARGIN, imageWidth: constants_1.IMAGE_WIDTH, imageHeight: constants_1.IMAGE_HEIGHT });
-    var entity = react_redux_1.useSelector(mdm_module_1.default.selectors.getEntity) || {};
-    var defaultProfilePic = react_redux_1.useSelector(function (state) {
-        return mdm_module_1.default.selectors.getModifiedEntityDefaultProfilePic(state, entity.uri);
+    var styles = useStyles({ imageMargin: IMAGE_MARGIN, imageWidth: IMAGE_WIDTH, imageHeight: IMAGE_HEIGHT });
+    var entity = useSelector(mdmModule.selectors.getEntity) || {};
+    var defaultProfilePic = useSelector(function (state) {
+        return mdmModule.selectors.getModifiedEntityDefaultProfilePic(state, entity.uri);
     });
-    var dispatch = react_redux_1.useDispatch();
-    var _d = react_1.useState(false), isVisibleUploadDialog = _d[0], setIsVisibleUploadDialog = _d[1];
-    var toggleVisibilityUploadDialog = react_1.useCallback(function () {
+    var dispatch = useDispatch();
+    var _d = useState(false), isVisibleUploadDialog = _d[0], setIsVisibleUploadDialog = _d[1];
+    var toggleVisibilityUploadDialog = useCallback(function () {
         setIsVisibleUploadDialog(function (visible) { return !visible; });
     }, []);
-    var handleAddAttributes = react_1.useCallback(function (image) {
-        var uri = mdm_sdk_1.generateUri(parentUri, attributeType.name);
+    var handleAddAttributes = useCallback(function (image) {
+        var uri = generateUri(parentUri, attributeType.name);
         var attributeValue = {};
         var _loop_1 = function (key) {
             var attribute = (attributeType.attributes || []).find(function (_a) {
@@ -57,7 +33,7 @@ var ImageAttributesLine = function (_a) {
             if (attribute) {
                 attributeValue[key] = [
                     {
-                        uri: mdm_sdk_1.generateUri(uri, attribute.name),
+                        uri: generateUri(uri, attribute.name),
                         ov: true,
                         value: image[key],
                         type: attribute.uri
@@ -70,12 +46,12 @@ var ImageAttributesLine = function (_a) {
         }
         onChangeAttribute({ attributeType: attributeType, uri: uri, value: attributeValue });
     }, [onChangeAttribute, parentUri, attributeType]);
-    var handleDeleteAttribute = react_1.useCallback(function (param) {
+    var handleDeleteAttribute = useCallback(function (param) {
         var _a;
         onDeleteAttribute(param);
         if (defaultProfilePic === param.uri) {
             var newDefaultPic = ((_a = attributeValues[0]) === null || _a === void 0 ? void 0 : _a.uri) === param.uri ? attributeValues[1] : attributeValues[0];
-            dispatch(mdm_module_1.profile.modifiedEntities.actions.setDefaultProfilePic({
+            dispatch(profile.modifiedEntities.actions.setDefaultProfilePic({
                 entityUri: entity.uri,
                 value: newDefaultPic || {}
             }));
@@ -83,25 +59,25 @@ var ImageAttributesLine = function (_a) {
     }, [onDeleteAttribute, entity, defaultProfilePic, attributeValues]);
     var renderImageActionsOverlay = function (methods, attribute) {
         var onOpenImageGalleryDialog = methods.onOpenImageGalleryDialog, onDownload = methods.onDownload, onShareLink = methods.onShareLink, onSetAsDefault = methods.onSetAsDefault;
-        var imageUrl = mdm_sdk_1.getImageAttributeOvUrl(attribute);
+        var imageUrl = getImageAttributeOvUrl(attribute);
         var uri = attribute.uri;
-        return (react_1.default.createElement(ImageActionsOverlay_1.default, { id: uri, onShareLink: function () { return onShareLink(imageUrl); }, onSetAsDefault: function () { return onSetAsDefault(attribute); }, onDelete: function () { return handleDeleteAttribute({ uri: uri, attributeType: attributeType }); }, onDownload: function () { return onDownload([imageUrl]); }, onClick: function () { return onOpenImageGalleryDialog(uri); } }));
+        return (React.createElement(ImageActionsOverlay, { id: uri, onShareLink: function () { return onShareLink(imageUrl); }, onSetAsDefault: function () { return onSetAsDefault(attribute); }, onDelete: function () { return handleDeleteAttribute({ uri: uri, attributeType: attributeType }); }, onDownload: function () { return onDownload([imageUrl]); }, onClick: function () { return onOpenImageGalleryDialog(uri); } }));
     };
     var renderImage = function (methods) {
         var renderImage = function (attribute) {
             if (attribute === void 0) { attribute = {}; }
-            var src = mdm_sdk_1.getImageAttributeOvThumbnailUrl(attribute);
+            var src = getImageAttributeOvThumbnailUrl(attribute);
             var uri = attribute.uri;
             var onOpenImageGalleryDialog = methods.onOpenImageGalleryDialog;
-            return (react_1.default.createElement("div", { className: styles.image, key: uri },
-                react_1.default.createElement(Image_1.default, { src: src, overlay: renderImageActionsOverlay(methods, attribute), onClick: function () { return onOpenImageGalleryDialog(uri); } })));
+            return (React.createElement("div", { className: styles.image, key: uri },
+                React.createElement(Image, { src: src, overlay: renderImageActionsOverlay(methods, attribute), onClick: function () { return onOpenImageGalleryDialog(uri); } })));
         };
         return renderImage;
     };
-    return (react_1.default.createElement("div", { className: styles.root },
-        react_1.default.createElement(ImageAttributesLine_1.default, { attributeValues: attributeValues, attributeType: attributeType, renderImage: renderImage, overlay: true, countFixedItems: 1, onUpload: toggleVisibilityUploadDialog, onDeleteAttribute: handleDeleteAttribute },
-            react_1.default.createElement("div", { className: styles.uploadContainer, onClick: toggleVisibilityUploadDialog },
-                react_1.default.createElement(SmallIconButton_1.SmallIconButton, { className: styles.uploadButton, iconClassName: styles.uploadIcon, icon: CloudUpload_1.default }))),
-        react_1.default.createElement(UploadImageDialog_1.UploadImageDialog, { open: isVisibleUploadDialog, onUpload: handleAddAttributes, onClose: toggleVisibilityUploadDialog })));
+    return (React.createElement("div", { className: styles.root },
+        React.createElement(ImageAttributesLineCommon, { attributeValues: attributeValues, attributeType: attributeType, renderImage: renderImage, overlay: true, countFixedItems: 1, onUpload: toggleVisibilityUploadDialog, onDeleteAttribute: handleDeleteAttribute },
+            React.createElement("div", { className: styles.uploadContainer, onClick: toggleVisibilityUploadDialog },
+                React.createElement(SmallIconButton, { className: styles.uploadButton, iconClassName: styles.uploadIcon, icon: CloudUploadIcon }))),
+        React.createElement(UploadImageDialog, { open: isVisibleUploadDialog, onUpload: handleAddAttributes, onClose: toggleVisibilityUploadDialog })));
 };
-exports.default = ImageAttributesLine;
+export default ImageAttributesLine;

package/components/attributes/editMode/ImageAttributesLine/index.js

@@ -1,7 +1,2 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var ImageAttributesLine_1 = __importDefault(require("./ImageAttributesLine"));
-exports.default = ImageAttributesLine_1.default;
+import ImageAttributesLine from './ImageAttributesLine';
+export default ImageAttributesLine;

package/components/attributes/editMode/ImageAttributesLine/styles.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.useStyles = styles_1.makeStyles(function () { return ({
+import { makeStyles } from '@material-ui/core/styles';
+export var useStyles = makeStyles(function () { return ({
     root: {
         width: '100%',
         marginBottom: '10px'

package/components/attributes/editMode/MoreAttributesButton/MoreAttributesButton.js

@@ -1,70 +1,46 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var classnames_1 = __importDefault(require("classnames"));
-var prop_types_1 = __importDefault(require("prop-types"));
-var ramda_1 = require("ramda");
-var Button_1 = __importDefault(require("@material-ui/core/Button"));
-var styles_1 = require("./styles");
-var SelectionPopup_1 = __importDefault(require("../../../SelectionPopup/SelectionPopup"));
-var AttributeListItem_1 = __importDefault(require("../../../AttributeListItem/AttributeListItem"));
-var helpers_1 = require("../../../VirtualGroupedList/helpers");
-var VirtualGroupedList_1 = __importDefault(require("../../../VirtualGroupedList/VirtualGroupedList"));
-var helpers_2 = require("../../../SelectionPopup/helpers");
-var Add_1 = __importDefault(require("@material-ui/icons/Add"));
-var Highlighter_1 = __importDefault(require("../../../Highlighter/Highlighter"));
+import React, { useCallback, useMemo, useRef, useState } from 'react';
+import classnames from 'classnames';
+import PropTypes from 'prop-types';
+import { always, any, append, curry, filter, ifElse, map, not, pipe, pluck, propEq, reject } from 'ramda';
+import Button from '@material-ui/core/Button';
+import { useStyles } from './styles';
+import SelectionPopup from '../../../SelectionPopup/SelectionPopup';
+import AttributeListItem from '../../../AttributeListItem/AttributeListItem';
+import { flattenGroupedItemsData } from '../../../VirtualGroupedList/helpers';
+import VirtualGroupedList from '../../../VirtualGroupedList/VirtualGroupedList';
+import { useKeyboardNavigation } from '../../../SelectionPopup/helpers';
+import AddIcon from '@material-ui/icons/Add';
+import Highlighter from '../../../Highlighter/Highlighter';
 var ITEM_HEIGHT = 28;
 var LIST_CONTAINER_WIDTH = 320;
 var MAX_LIST_CONTAINER_HEIGHT = 255;
 var MIN_CONTAINER_HEIGHT = 140;
 var CONTAINER_HEADER_HEIGHT = 112;
-var filterItems = ramda_1.curry(function (filterText, items) {
-    return ramda_1.filter(function (item) { return item.label.toLowerCase().includes(filterText.toLowerCase()); })(items);
+var filterItems = curry(function (filterText, items) {
+    return filter(function (item) { return item.label.toLowerCase().includes(filterText.toLowerCase()); })(items);
 });
 var MoreAttributesButton = function (_a) {
     var _b;
     var label = _a.label, _c = _a.popupTitle, popupTitle = _c === void 0 ? label : _c, data = _a.data, dense = _a.dense, onApply = _a.onApply;
-    var styles = styles_1.useStyles();
-    var inputRef = react_1.useRef();
-    var _d = react_1.useState(false), isOpen = _d[0], setIsOpen = _d[1];
+    var styles = useStyles();
+    var inputRef = useRef();
+    var _d = useState(false), isOpen = _d[0], setIsOpen = _d[1];
     var togglePopupOpen = function () { return setIsOpen(!isOpen); };
     var closePopup = function () { return setIsOpen(false); };
-    var _e = react_1.useState(''), filter = _e[0], setFilter = _e[1];
+    var _e = useState(''), filter = _e[0], setFilter = _e[1];
     var clearFilter = function () { return setFilter(''); };
-    var _f = react_1.useState([]), selectedItems = _f[0], setSelectedItems = _f[1];
+    var _f = useState([]), selectedItems = _f[0], setSelectedItems = _f[1];
     var clearSelectedItems = function () { return setSelectedItems([]); };
     var addSelectedAttributes = function () {
         if (selectedItems.length > 0) {
-            onApply(ramda_1.pluck('attrType', selectedItems));
+            onApply(pluck('attrType', selectedItems));
         }
     };
-    var handleListItemClick = react_1.useCallback(function (item, checked) {
-        setSelectedItems(ramda_1.ifElse(ramda_1.always(checked), ramda_1.append(item), ramda_1.reject(ramda_1.propEq('id', item.id)))(selectedItems));
+    var handleListItemClick = useCallback(function (item, checked) {
+        setSelectedItems(ifElse(always(checked), append(item), reject(propEq('id', item.id)))(selectedItems));
     }, [selectedItems]);
-    var preparedGroupedItems = react_1.useMemo(function () {
-        return ramda_1.pipe(filterItems(filter), ramda_1.map(function (attrType) { return ({
+    var preparedGroupedItems = useMemo(function () {
+        return pipe(filterItems(filter), map(function (attrType) { return ({
             item: {
                 id: attrType.uri,
                 label: attrType.label,
@@ -72,40 +48,40 @@ var MoreAttributesButton = function (_a) {
             }
         }); }))(data);
     }, [data, filter]);
-    var items = react_1.useMemo(function () { return helpers_1.flattenGroupedItemsData(preparedGroupedItems); }, [preparedGroupedItems]);
-    var getItemSize = react_1.useCallback(function () { return ITEM_HEIGHT; }, []);
-    var handleSearchOnEnter = react_1.useCallback(function (_a) {
+    var items = useMemo(function () { return flattenGroupedItemsData(preparedGroupedItems); }, [preparedGroupedItems]);
+    var getItemSize = useCallback(function () { return ITEM_HEIGHT; }, []);
+    var handleSearchOnEnter = useCallback(function (_a) {
         var item = _a.item;
-        handleListItemClick(item, ramda_1.not(ramda_1.any(ramda_1.propEq('id', item.id))(selectedItems)));
+        handleListItemClick(item, not(any(propEq('id', item.id))(selectedItems)));
     }, [handleListItemClick, selectedItems]);
-    var _g = helpers_2.useKeyboardNavigation({
+    var _g = useKeyboardNavigation({
         items: items,
         open: isOpen,
         onSelectFocusedItem: handleSearchOnEnter,
         selectedItems: selectedItems
     }), focusIndex = _g.focusIndex, handleKeyDown = _g.handleKeyDown;
-    var focusIndexRef = react_1.useRef(null);
+    var focusIndexRef = useRef(null);
     focusIndexRef.current = focusIndex;
     var listHeight = Math.min(MAX_LIST_CONTAINER_HEIGHT, ITEM_HEIGHT * items.length);
     var containerHeight = Math.max(MIN_CONTAINER_HEIGHT, listHeight + CONTAINER_HEADER_HEIGHT);
-    var listItemRenderer = react_1.useCallback(function (style, _a, index) {
+    var listItemRenderer = useCallback(function (style, _a, index) {
         var item = _a.item, _b = _a.level, level = _b === void 0 ? 0 : _b;
-        var isChecked = ramda_1.any(ramda_1.propEq('id', item.id))(selectedItems);
+        var isChecked = any(propEq('id', item.id))(selectedItems);
         var isFocused = focusIndexRef.current === index;
-        return (react_1.default.createElement(AttributeListItem_1.default, { key: item.uri, onClick: handleListItemClick, checked: isChecked, level: level, data: item, label: react_1.default.createElement(Highlighter_1.default, { text: item.label, highlight: filter }), labelInText: item.label, style: style, isFocused: isFocused, isRequired: !!item.attrType.required, LogoIcon: item.LogoIcon }));
+        return (React.createElement(AttributeListItem, { key: item.uri, onClick: handleListItemClick, checked: isChecked, level: level, data: item, label: React.createElement(Highlighter, { text: item.label, highlight: filter }), labelInText: item.label, style: style, isFocused: isFocused, isRequired: !!item.attrType.required, LogoIcon: item.LogoIcon }));
     }, [filter, handleListItemClick, selectedItems]);
-    return (react_1.default.createElement("div", { className: classnames_1.default(styles.moreAttributes, (_b = {}, _b[styles.dense] = dense, _b)) },
-        react_1.default.createElement(Button_1.default, { color: "primary", onClick: togglePopupOpen, ref: inputRef, className: styles.moreButton },
-            react_1.default.createElement(Add_1.default, { classes: { root: styles.icon } }),
-            react_1.default.createElement("div", { className: styles.buttonLabel }, label)),
-        react_1.default.createElement(SelectionPopup_1.default, { open: isOpen, className: classnames_1.default(styles.moreAttributesPopup, styles.popupContainer), anchorEl: inputRef.current, onClose: ramda_1.pipe(addSelectedAttributes, closePopup, clearFilter, clearSelectedItems), onSearch: setFilter, containerHeight: containerHeight, title: popupTitle, containerWidth: LIST_CONTAINER_WIDTH, searchInputOnKeyDown: handleKeyDown },
-            react_1.default.createElement(VirtualGroupedList_1.default, { getItemSize: getItemSize, renderItem: listItemRenderer, items: items, height: listHeight, containerWidth: LIST_CONTAINER_WIDTH, focusIndex: focusIndex }))));
+    return (React.createElement("div", { className: classnames(styles.moreAttributes, (_b = {}, _b[styles.dense] = dense, _b)) },
+        React.createElement(Button, { color: "primary", onClick: togglePopupOpen, ref: inputRef, className: styles.moreButton },
+            React.createElement(AddIcon, { classes: { root: styles.icon } }),
+            React.createElement("div", { className: styles.buttonLabel }, label)),
+        React.createElement(SelectionPopup, { open: isOpen, className: classnames(styles.moreAttributesPopup, styles.popupContainer), anchorEl: inputRef.current, onClose: pipe(addSelectedAttributes, closePopup, clearFilter, clearSelectedItems), onSearch: setFilter, containerHeight: containerHeight, title: popupTitle, containerWidth: LIST_CONTAINER_WIDTH, searchInputOnKeyDown: handleKeyDown },
+            React.createElement(VirtualGroupedList, { getItemSize: getItemSize, renderItem: listItemRenderer, items: items, height: listHeight, containerWidth: LIST_CONTAINER_WIDTH, focusIndex: focusIndex }))));
 };
 MoreAttributesButton.propTypes = {
-    label: prop_types_1.default.string,
-    popupTitle: prop_types_1.default.string,
-    data: prop_types_1.default.array,
-    dense: prop_types_1.default.bool,
-    onApply: prop_types_1.default.func
+    label: PropTypes.string,
+    popupTitle: PropTypes.string,
+    data: PropTypes.array,
+    dense: PropTypes.bool,
+    onApply: PropTypes.func
 };
-exports.default = MoreAttributesButton;
+export default MoreAttributesButton;

package/components/attributes/editMode/MoreAttributesButton/index.js

@@ -1,8 +1 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var MoreAttributesButton_1 = require("./MoreAttributesButton");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(MoreAttributesButton_1).default; } });
+export { default } from './MoreAttributesButton';

package/components/attributes/editMode/MoreAttributesButton/styles.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.useStyles = styles_1.makeStyles({
+import { makeStyles } from '@material-ui/core/styles';
+export var useStyles = makeStyles({
     moreAttributes: {
         display: 'flex',
         paddingBottom: '6px',

package/components/attributes/editMode/NestedAttribute/NestedAttribute.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,36 +9,13 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var mdm_sdk_1 = require("@reltio/mdm-sdk");
-var ComplexAttribute_1 = __importDefault(require("../ComplexAttribute/ComplexAttribute"));
+import React, { memo } from 'react';
+import { evaluateDeepEntityLabel, getLabel, NestedAttributeType } from '@reltio/mdm-sdk';
+import ComplexAttribute from '../ComplexAttribute/ComplexAttribute';
 var NestedAttribute = function (props) {
     var attributeValue = props.attributeValue, attributeType = props.attributeType;
-    var label = mdm_sdk_1.evaluateDeepEntityLabel(attributeValue, attributeType.dataLabelPattern);
-    return (react_1.default.createElement(ComplexAttribute_1.default, __assign({ label: mdm_sdk_1.getLabel(label), attributeTypesList: attributeType.attributes || attributeType.analyticsAttributes }, props)));
+    var label = evaluateDeepEntityLabel(attributeValue, attributeType.dataLabelPattern);
+    return (React.createElement(ComplexAttribute, __assign({ label: getLabel(label), attributeTypesList: attributeType.attributes || attributeType.analyticsAttributes }, props)));
 };
-NestedAttribute.propTypes = mdm_sdk_1.NestedAttributeType;
-exports.default = react_1.memo(NestedAttribute);
+NestedAttribute.propTypes = NestedAttributeType;
+export default memo(NestedAttribute);