@reltio/components 1.4.1067 → 1.4.1072

package/cjs/components/ConnectionEditor/styles.js

@@ -0,0 +1,12 @@
+"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({
+    item: {
+        marginBottom: '16px'
+    },
+    dense: {
+        marginBottom: 0
+    }
+});

package/cjs/components/ConnectionRelationTypeSelector/ConnectionRelationTypeSelector.js

@@ -64,11 +64,12 @@ var ConnectionRelationTypeSelector = function (_a) {
         outRelationTypes,
         onChange
     ]);
+    var hasValue = !!relation.relationType;
     react_1.useEffect(function () {
-        if (applyFirstByDefault && relationsTypesOptions.length) {
+        if (applyFirstByDefault && relationsTypesOptions.length && !hasValue) {
             handleChange(relationsTypesOptions[0]);
         }
-    }, [relationsTypesOptions, applyFirstByDefault, handleChange]);
+    }, [relationsTypesOptions, applyFirstByDefault, handleChange, hasValue]);
     return (react_1.default.createElement(RelationTypeSelector_1.default, __assign({ value: toEditorValue(relation, relationsTypesOptions), options: relationsTypesOptions, onChange: handleChange }, otherProps)));
 };
 ConnectionRelationTypeSelector.propTypes = {

package/cjs/components/Image/ImageActionsOverlay/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"button" | "overlay" | "selected" | "checkedIcon" | "actions" | "selectionMode" | "actionButton" | "dropDownMenuButton">;
+export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"button" | "overlay" | "selected" | "actions" | "checkedIcon" | "selectionMode" | "actionButton" | "dropDownMenuButton">;

package/cjs/components/ImageDetailsView/MetaInfoForm/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"form" | "root" | "divider" | "actions" | "cancelButton">;
+export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"form" | "root" | "actions" | "divider" | "cancelButton">;

package/cjs/components/QueryBuilderRow/QueryBuilderRow.d.ts

@@ -40,7 +40,7 @@ declare var _default: React.MemoExoticComponent<{
             actionsContainer: PropTypes.Requireable<string>;
         }>>;
         rowData: PropTypes.Requireable<PropTypes.InferProps<{
-            id: PropTypes.Requireable<string>;
+            id: PropTypes.Requireable<string | number>;
             values: PropTypes.Requireable<any[]>;
             data: PropTypes.Requireable<PropTypes.InferProps<{
                 title: PropTypes.Requireable<string>;
@@ -69,7 +69,7 @@ declare var _default: React.MemoExoticComponent<{
             operator: PropTypes.Requireable<string>;
         }>>;
         previousRowData: PropTypes.Requireable<PropTypes.InferProps<{
-            id: PropTypes.Requireable<string>;
+            id: PropTypes.Requireable<string | number>;
             values: PropTypes.Requireable<any[]>;
             data: PropTypes.Requireable<PropTypes.InferProps<{
                 title: PropTypes.Requireable<string>;

package/cjs/components/QueryBuilderRowsGroup/QueryBuilderRowsGroup.d.ts

@@ -1,7 +1,7 @@
 declare var _default: React.MemoExoticComponent<{
     ({ className, rowClasses, rowsData, lastRowAttributeSelectorProps, filterSelectorRef, filterSelectorRefIndex, ...rowProps }: {
         [x: string]: any;
-        className: any;
+        className?: any;
         rowClasses: any;
         rowsData: any;
         lastRowAttributeSelectorProps: any;
@@ -19,7 +19,7 @@ declare var _default: React.MemoExoticComponent<{
             actionsContainer: PropTypes.Requireable<string>;
         }>>;
         rowsData: PropTypes.Requireable<PropTypes.InferProps<{
-            id: PropTypes.Requireable<string>;
+            id: PropTypes.Requireable<string | number>;
             values: PropTypes.Requireable<any[]>;
             data: PropTypes.Requireable<PropTypes.InferProps<{
                 title: PropTypes.Requireable<string>;

package/cjs/components/QueryBuilderRowsGroup/QueryBuilderRowsGroup.js

@@ -50,7 +50,7 @@ var ramda_1 = require("ramda");
 var QueryBuilderRow_1 = __importDefault(require("../QueryBuilderRow/QueryBuilderRow"));
 var constants_1 = require("../../constants");
 var QueryBuilderRowsGroup = function (_a) {
-    var className = _a.className, rowClasses = _a.rowClasses, rowsData = _a.rowsData, lastRowAttributeSelectorProps = _a.lastRowAttributeSelectorProps, filterSelectorRef = _a.filterSelectorRef, filterSelectorRefIndex = _a.filterSelectorRefIndex, rowProps = __rest(_a, ["className", "rowClasses", "rowsData", "lastRowAttributeSelectorProps", "filterSelectorRef", "filterSelectorRefIndex"]);
+    var _b = _a.className, className = _b === void 0 ? undefined : _b, rowClasses = _a.rowClasses, rowsData = _a.rowsData, lastRowAttributeSelectorProps = _a.lastRowAttributeSelectorProps, filterSelectorRef = _a.filterSelectorRef, filterSelectorRefIndex = _a.filterSelectorRefIndex, rowProps = __rest(_a, ["className", "rowClasses", "rowsData", "lastRowAttributeSelectorProps", "filterSelectorRef", "filterSelectorRefIndex"]);
     var renderRow = function (rowData, index, rowsData) {
         var previousRow = index > 0 ? ramda_1.path([index - 1], rowsData) : null;
         var lastRowProps = index === rowsData.length

package/cjs/components/SelectAttributesList/SelectAttributesList.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { AttributeType } from '@reltio/mdm-sdk';
+import { AttributeSelectorItem } from '../../types';
+declare type Data = {
+    attrType?: AttributeType;
+};
+declare type Props = {
+    selectedAttributes: AttributeSelectorItem[];
+    focusIndex: number;
+    hideCheckBox: boolean;
+    onItemClick: (data: Data, checked: boolean, groupId: string) => void;
+} & Record<string, unknown>;
+declare const _default: React.MemoExoticComponent<({ selectedAttributes, onItemClick, focusIndex, hideCheckBox, ...otherProps }: Props) => JSX.Element>;
+export default _default;

package/cjs/components/SelectAttributesList/SelectAttributesList.js

@@ -0,0 +1,75 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+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 ListItem_1 = __importDefault(require("@material-ui/core/ListItem"));
+var mdm_module_1 = __importDefault(require("@reltio/mdm-module"));
+var AttributeListItem_1 = __importDefault(require("../AttributeListItem/AttributeListItem"));
+var VirtualGroupedList_1 = __importDefault(require("../VirtualGroupedList/VirtualGroupedList"));
+var Highlighter_1 = __importDefault(require("../Highlighter/Highlighter"));
+var AttributeGroupIcon_1 = __importDefault(require("../AttributeGroupIcon/AttributeGroupIcon"));
+var helpers_1 = require("../BasicAttributeSelector/helpers");
+var styles_1 = require("./styles");
+var ITEM_HEIGHT = 28;
+var ITEM_GROUP_TITLE_HEIGHT = 40;
+var SelectAttributesList = function (_a) {
+    var selectedAttributes = _a.selectedAttributes, onItemClick = _a.onItemClick, focusIndex = _a.focusIndex, hideCheckBox = _a.hideCheckBox, otherProps = __rest(_a, ["selectedAttributes", "onItemClick", "focusIndex", "hideCheckBox"]);
+    var styles = styles_1.useStyles();
+    var metadata = react_redux_1.useSelector(mdm_module_1.default.selectors.getMetadata);
+    var getItemSize = function (i, item) { return (item.items ? ITEM_GROUP_TITLE_HEIGHT : ITEM_HEIGHT); };
+    var renderGroupTitle = function (style, item) { return (react_1.default.createElement(ListItem_1.default, { component: 'div', className: styles.subHeader, style: style, key: "group-" + item.item.id },
+        item.item.needGroupIcon && react_1.default.createElement(AttributeGroupIcon_1.default, { group: item.item, metadata: metadata }),
+        item.item.title)); };
+    var renderItem = function (style, _a, index) {
+        var item = _a.item, level = _a.level, groupId = _a.groupId, groupName = _a.groupName;
+        var checked = helpers_1.checkAttributeIncludes(item, selectedAttributes);
+        var isFocused = index === focusIndex;
+        return (react_1.default.createElement(AttributeListItem_1.default, { key: "item-" + groupId + "-" + item.fieldName, onClick: onItemClick, checked: checked, data: __assign(__assign({}, item), { groupName: groupName }), notSelectable: item.notSelectable, hideCheckBox: hideCheckBox, label: react_1.default.createElement(Highlighter_1.default, { text: item.title, highlight: item.filterText }), labelInText: item.title, level: level, style: style, isFocused: isFocused, groupId: groupId, LogoIcon: item.LogoIcon }));
+    };
+    return (react_1.default.createElement(VirtualGroupedList_1.default, __assign({ getItemSize: getItemSize, renderItem: renderItem, renderGroupTitle: renderGroupTitle, focusIndex: focusIndex }, otherProps)));
+};
+exports.default = react_1.memo(SelectAttributesList);

package/cjs/components/SelectAttributesList/styles.d.ts

@@ -0,0 +1 @@
+export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"subHeader">;

package/cjs/components/SelectAttributesList/styles.js

@@ -0,0 +1,16 @@
+"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({
+    subHeader: {
+        backgroundColor: '#f5f5f5',
+        padding: '0 16px',
+        margin: 0,
+        display: 'flex',
+        alignItems: 'center',
+        color: 'rgba(0,0,0,0.84)',
+        fontSize: '14px',
+        fontWeight: 500
+    }
+});

package/cjs/components/SelectionPopup/SelectionPopup.d.ts

@@ -5,7 +5,7 @@ declare type Props = {
     containerWidth: number;
     containerHeight: number;
     children: React.ReactNode;
-    PaperProps: Record<string, unknown>;
+    PaperProps?: Record<string, unknown>;
     searchInputOnKeyDown: (event: React.KeyboardEvent) => void;
     onSearch: (value?: string) => void;
     className?: string;

package/cjs/components/SidePanel/SidePanelContentHeader/SidePanelContentHeader.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, VFC } from 'react';
+import { ReactNode } from 'react';
 declare type HeaderProps = {
     mainTitle?: string;
     secondTitle?: string;
@@ -8,5 +8,5 @@ declare type HeaderProps = {
 declare type Props = HeaderProps & {
     onClose: () => void;
 };
-export declare const SidePanelContentHeader: VFC<Props>;
+export declare const SidePanelContentHeader: ({ onClose, mainTitle, secondTitle, content, rightContent }: Props) => JSX.Element;
 export {};

package/cjs/components/Title/Title.d.ts

@@ -1,14 +1,8 @@
+/// <reference types="react" />
+declare type Props = {
+    label: string;
+    isRequired?: boolean;
+    className?: string;
+};
+declare const Title: ({ label, isRequired, className, ...otherProps }: Props) => JSX.Element;
 export default Title;
-declare function Title({ label, isRequired, className }: {
-    label: any;
-    isRequired: any;
-    className: any;
-}): JSX.Element;
-declare namespace Title {
-    namespace propTypes {
-        const label: PropTypes.Requireable<string>;
-        const isRequired: PropTypes.Requireable<boolean>;
-        const className: PropTypes.Requireable<string>;
-    }
-}
-import PropTypes from "prop-types";

package/cjs/components/Title/Title.js

@@ -1,24 +1,40 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var prop_types_1 = __importDefault(require("prop-types"));
 var react_1 = __importDefault(require("react"));
 var classnames_1 = __importDefault(require("classnames"));
 var RequiredMark_1 = __importDefault(require("../RequiredMark/RequiredMark"));
 var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
 var styles_1 = require("./styles");
 var Title = function (_a) {
-    var label = _a.label, isRequired = _a.isRequired, className = _a.className;
+    var label = _a.label, isRequired = _a.isRequired, className = _a.className, otherProps = __rest(_a, ["label", "isRequired", "className"]);
     var styles = styles_1.useStyles();
-    return (react_1.default.createElement(Typography_1.default, { className: classnames_1.default(styles.label, className), component: "span" },
+    return (react_1.default.createElement(Typography_1.default, __assign({ className: classnames_1.default(styles.label, className), component: "span" }, otherProps),
         label,
         isRequired && react_1.default.createElement(RequiredMark_1.default, null)));
 };
-Title.propTypes = {
-    label: prop_types_1.default.string,
-    isRequired: prop_types_1.default.bool,
-    className: prop_types_1.default.string
-};
 exports.default = Title;

package/cjs/components/Title/styles.d.ts

@@ -1 +1 @@
-export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"label">;
+export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"label">;

package/cjs/components/activityLog/activities/SearchActivity.js

@@ -28,7 +28,7 @@ var mdm_module_1 = require("@reltio/mdm-module");
 var ActivityTitle_1 = __importDefault(require("./ActivityTitle/ActivityTitle"));
 var ramda_1 = require("ramda");
 var core_1 = require("../../../core");
-var useReadableSearchState_1 = require("../hooks/useReadableSearchState");
+var hooks_1 = require("../../../hooks");
 var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var styles_1 = require("./styles");
 var SearchActivity = function (_a) {
@@ -40,7 +40,7 @@ var SearchActivity = function (_a) {
         return searchData.version === '2.0' ? searchData.activity.uiState : searchData;
     }, [data.description]);
     var openSearch = ramda_1.pipe(ramda_1.always(searchState), mdm_module_1.ui.actions.openSearch, dispatch);
-    var searchString = useReadableSearchState_1.useReadableSearchState(searchState);
+    var searchString = hooks_1.useReadableSearchState(searchState);
     return (react_1.default.createElement(ActivityTitle_1.default, { type: type },
         react_1.default.createElement("span", { className: styles.link, onClick: openSearch }, searchString || ui_i18n_1.default.text('all profiles'))));
 };

package/cjs/components/attributes/editMode/AttributesPager/AttributeRenderer.js

@@ -100,7 +100,7 @@ var AttributeRenderer = function (_a) {
     return (react_1.default.createElement(BranchDecorator_1.default, { enabled: drawLines },
         react_1.default.createElement("div", { className: styles.wrapper },
             react_1.default.createElement("div", { className: styles.titleWrapper },
-                react_1.default.createElement(Title_1.default, { label: label, isRequired: isRequired, className: styles.title }),
+                react_1.default.createElement(Title_1.default, { label: label, isRequired: isRequired, className: styles.title, "data-reltio-id": "reltio-attribute-label" }),
                 react_1.default.createElement(OvIcon_1.default, { nonOvValues: nonVisibleValues, attributeType: attributeType, className: styles.ovIcon, nonOvTotal: totalNonVisibleValues })),
             isEditableMode && react_1.default.createElement(CardinalityMessage_1.default, { cardinality: cardinality }),
             isEditableMode && react_1.default.createElement(ErrorMessage_1.default, { message: errorMessage, className: styles.typeError }),

package/cjs/components/attributes/editMode/AttributesPager/AttributesPager.js

@@ -81,7 +81,7 @@ var AttributesPager = function (_a) {
             case RENDERER_TYPES.imageLine:
                 return (react_1.default.createElement(BranchDecorator_1.default, { enabled: drawLines },
                     react_1.default.createElement("div", { className: styles.wrapper },
-                        react_1.default.createElement(Title_1.default, { label: attributeType === null || attributeType === void 0 ? void 0 : attributeType.label }),
+                        react_1.default.createElement(Title_1.default, { label: attributeType === null || attributeType === void 0 ? void 0 : attributeType.label, "data-reltio-id": "reltio-attribute-label" }),
                         react_1.default.createElement(ImageAttributesLine_1.default, { attributeValues: visibleValues, attributeType: attributeType, paging: paging, onDeleteAttribute: onDeleteAttribute, parentUri: parentUri, onChangeAttribute: onChangeAttribute, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, showNonOv: showNonOv }))));
             default:
                 return (react_1.default.createElement(AttributeRenderer_1.default, __assign({ values: visibleValues, attributeType: attributeType, max: max, paging: paging, crosswalks: crosswalks, drawLines: drawLines, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, showNonOv: showNonOv, nonVisibleValues: nonVisibleValues }, commonProps)));

package/cjs/components/attributes/editMode/AttributesPager/SpecialRenderer.js

@@ -86,7 +86,7 @@ var SpecialRenderer = function (_a) {
         return null;
     }
     return (react_1.default.createElement(Box_1.default, { className: styles.wrapper },
-        react_1.default.createElement(Title_1.default, { label: label, isRequired: isRequired, className: styles.title }),
+        react_1.default.createElement(Title_1.default, { label: label, isRequired: isRequired, className: styles.title, "data-reltio-id": "reltio-attribute-label" }),
         isEditableMode && react_1.default.createElement(CardinalityMessage_1.default, { cardinality: cardinality }),
         isEditableMode && react_1.default.createElement(ErrorMessage_1.default, { message: errorMessage }),
         react_1.default.createElement(Box_1.default, { className: styles.attributesWrapper }, renderValue())));

package/cjs/components/attributes/editMode/ComplexAttribute/ComplexAttribute.js

@@ -91,7 +91,7 @@ var ComplexAttribute = function (_a) {
             react_1.default.createElement("div", { className: styles.titleContainer },
                 react_1.default.createElement(ArrowExpandButton_1.default, { onClick: function () { return setExpanded(function (value) { return !value; }); }, expanded: expanded, className: styles.expandButton, disabled: deleted }),
                 react_1.default.createElement(ErrorWrapper_1.default, { errorMessage: errorMessage, classes: { helperText: styles.errorWrapperHelperText } },
-                    react_1.default.createElement("div", { className: classnames_1.default(styles.label, (_b = {}, _b[styles.deleted] = deleted, _b)) }, label))),
+                    react_1.default.createElement("div", { className: classnames_1.default(styles.label, (_b = {}, _b[styles.deleted] = deleted, _b)), "data-reltio-id": "reltio-attribute-complex-label" }, label))),
             react_1.default.createElement("div", { className: styles.actions },
                 edited && (react_1.default.createElement(Typography_1.default, { variant: "caption", className: styles.editedLabel },
                     "(",

package/cjs/components/attributes/editMode/EntitySelector/EntitySelector.d.ts

@@ -10,7 +10,7 @@ declare function EntitySelector({ entity, entityTypesUris, mode, max, onChange,
     metadata: any;
     globalSearchRequestOptions: any;
     attributeTypesSelectionStrategy: any;
-    disableLinkClick: any;
+    disableLinkClick?: boolean;
 }): JSX.Element;
 declare namespace EntitySelector {
     namespace propTypes {

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

@@ -57,7 +57,7 @@ var EntityCreator_1 = __importDefault(require("../EntityCreator"));
 var core_1 = require("../../../../core");
 var Group_1 = __importDefault(require("./components/Group"));
 var styles_1 = require("./styles");
-var buildEntityOptions = function (entityTypes) { return function (entities) {
+var buildEntityOptions = function (entityTypes, onCreate) { return function (entities) {
     var newOptions = entities.map(function (entity) { return (__assign(__assign({}, entity), { label: mdm_sdk_1.getLabel(entity.label), entityType: entityTypes.find(function (_a) {
             var uri = _a.uri;
             return uri === entity.type;
@@ -73,8 +73,13 @@ var buildEntityOptions = function (entityTypes) { return function (entities) {
             ]
             : options;
     };
-    return entityTypes.length > 1
-        ? entityTypes.map(function (type) {
+    var filteredEntityTypes = onCreate
+        ? entityTypes
+        : entityTypes.filter(function (type) {
+            return newOptions.some(function (option) { return option.type === type.uri; });
+        });
+    return filteredEntityTypes.length > 1
+        ? filteredEntityTypes.map(function (type) {
             return {
                 label: type.label,
                 entityType: type.uri,
@@ -84,9 +89,9 @@ var buildEntityOptions = function (entityTypes) { return function (entities) {
         : addDummyOptionToEmptyOptionList(newOptions);
 }; };
 var EntitySelector = function (_a) {
-    var _b = _a.entity, entity = _b === void 0 ? {} : _b, _c = _a.entityTypesUris, entityTypesUris = _c === void 0 ? [] : _c, mode = _a.mode, max = _a.max, onChange = _a.onChange, onCreate = _a.onCreate, metadata = _a.metadata, globalSearchRequestOptions = _a.globalSearchRequestOptions, attributeTypesSelectionStrategy = _a.attributeTypesSelectionStrategy, disableLinkClick = _a.disableLinkClick, otherProps = __rest(_a, ["entity", "entityTypesUris", "mode", "max", "onChange", "onCreate", "metadata", "globalSearchRequestOptions", "attributeTypesSelectionStrategy", "disableLinkClick"]);
+    var _b = _a.entity, entity = _b === void 0 ? {} : _b, _c = _a.entityTypesUris, entityTypesUris = _c === void 0 ? [] : _c, mode = _a.mode, max = _a.max, onChange = _a.onChange, onCreate = _a.onCreate, metadata = _a.metadata, globalSearchRequestOptions = _a.globalSearchRequestOptions, attributeTypesSelectionStrategy = _a.attributeTypesSelectionStrategy, _d = _a.disableLinkClick, disableLinkClick = _d === void 0 ? false : _d, otherProps = __rest(_a, ["entity", "entityTypesUris", "mode", "max", "onChange", "onCreate", "metadata", "globalSearchRequestOptions", "attributeTypesSelectionStrategy", "disableLinkClick"]);
     var styles = styles_1.useStyles();
-    var _d = react_1.useState(''), inputValue = _d[0], setInputValue = _d[1];
+    var _e = react_1.useState(''), inputValue = _e[0], setInputValue = _e[1];
     var entityTypes = react_1.useMemo(function () { return entityTypesUris.map(function (type) { return mdm_sdk_1.getEntityType(metadata, type); }); }, [
         entityTypesUris,
         metadata
@@ -118,7 +123,9 @@ var EntitySelector = function (_a) {
         handleChange({});
     };
     var groupMode = react_1.useMemo(function () { return entityTypes.length !== 1; }, [entityTypes]);
-    var getOptions = function (value) { return mdm_sdk_1.getFilteredEntities(filters, options, value).then(buildEntityOptions(entityTypes)); };
+    var getOptions = function (value) {
+        return mdm_sdk_1.getFilteredEntities(filters, options, value).then(buildEntityOptions(entityTypes, onCreate));
+    };
     var currentEntityType = (ramda_1.isEmpty(entity) ? entityTypes[0] : mdm_sdk_1.getEntityType(metadata, entity.entityType)) || {};
     var createLabel = onCreate && ui_i18n_1.default.text("Create " + (inputValue ? "\"" + inputValue + "\" as " : '') + "new " + currentEntityType.label);
     var label = ui_i18n_1.default.text("Select " + (entityTypes.length === 1 ? entityTypes[0].label + " " : '') + "profile");

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

@@ -94,7 +94,7 @@ var ImageAttributesLine = function (_a) {
             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); }, size: { imageWidth: imageSize.imageWidth, imageHeight: imageSize.imageHeight } })));
+                react_1.default.createElement(Image_1.default, { src: src, overlay: renderImageActionsOverlay(methods, attribute), onClick: function () { return onOpenImageGalleryDialog(uri); }, size: { imageWidth: imageSize.imageWidth, imageHeight: imageSize.imageHeight }, "data-reltio-id": "reltio-attribute-value" })));
         };
         return renderImage;
     };

package/cjs/components/attributes/editMode/Roles/Roles.js

@@ -63,7 +63,7 @@ var Roles = function (_a) {
     var handleDelete = react_1.useCallback(function () {
         onDelete({ uri: entityUri, attributeType: mdm_sdk_1.EntityAttrTypes.roles });
     }, [entityUri, onDelete]);
-    return (react_1.default.createElement("div", { className: styles.container },
+    return (react_1.default.createElement("div", { className: styles.container, "data-reltio-id": "reltio-attribute-value" },
         react_1.default.createElement(SimpleDropDownSelector_1.default, { label: '', height: 40, isMulti: true, options: options, value: formattedValues, onChange: handleChange, components: components, classes: styles, className: styles.roleContainer }),
         !!onDelete && (react_1.default.createElement(SmallIconButton_1.default, { className: styles.deleteButton, icon: Delete_1.default, onClick: handleDelete, size: "L" }))));
 };

package/cjs/components/attributes/editMode/SimpleAttributeEditor/SimpleAttributeEditor.js

@@ -102,7 +102,7 @@ var SimpleAttributeEditor = function (_a) {
     var deletedProps = deleted ? { disabled: true } : {};
     return (react_1.default.createElement("div", { className: classnames_1.default(styles.editor, className) },
         react_1.default.createElement(ErrorWrapper_1.default, { errorMessage: errorMessage, className: styles.errorWrapper },
-            react_1.default.createElement("div", { className: classnames_1.default(styles['editor-value'], (_b = {}, _b[styles.deleted] = deleted, _b), (_c = {}, _c[styles['editor-read-only-value']] = !showToEdit, _c)) }, showToEdit ? (react_1.default.createElement(DataTypeValueEditor_1.default, __assign({ fieldName: mdm_sdk_1.attributeUriToSearchUri(attributeType.uri), value: value, dataTypeDefinition: dataTypeDefinition, error: hasError, onChange: ramda_1.pipe(utils_1.prepareChangeData(attributeValue, attributeType), onChangeAttribute, deactivateError), fullWidth: true }, dependentLookupEditorContext, otherProps, deletedProps))) : (react_1.default.createElement(DataTypeValue_1.default, { value: mdm_sdk_1.getAttributeValue(attributeValue), dataTypeDefinition: dataTypeDefinition })))),
+            react_1.default.createElement("div", { className: classnames_1.default(styles['editor-value'], (_b = {}, _b[styles.deleted] = deleted, _b), (_c = {}, _c[styles['editor-read-only-value']] = !showToEdit, _c)), "data-reltio-id": "reltio-attribute-value" }, showToEdit ? (react_1.default.createElement(DataTypeValueEditor_1.default, __assign({ fieldName: mdm_sdk_1.attributeUriToSearchUri(attributeType.uri), value: value, dataTypeDefinition: dataTypeDefinition, error: hasError, onChange: ramda_1.pipe(utils_1.prepareChangeData(attributeValue, attributeType), onChangeAttribute, deactivateError), fullWidth: true }, dependentLookupEditorContext, otherProps, deletedProps))) : (react_1.default.createElement(DataTypeValue_1.default, { value: mdm_sdk_1.getAttributeValue(attributeValue), dataTypeDefinition: dataTypeDefinition })))),
         react_1.default.createElement("div", { className: styles['editor-actions'] },
             edited && (react_1.default.createElement(Typography_1.default, { variant: "caption", className: styles.editedLabel },
                 "(",

package/cjs/components/attributes/editMode/Tags/Tags.js

@@ -63,7 +63,7 @@ var Tags = function (_a) {
     var handleDelete = react_1.useCallback(function () {
         onDelete({ uri: entityUri, attributeType: mdm_sdk_1.EntityAttrTypes.tags });
     }, [entityUri, onDelete]);
-    return (react_1.default.createElement("div", { className: styles.container },
+    return (react_1.default.createElement("div", { className: styles.container, "data-reltio-id": "reltio-attribute-value" },
         react_1.default.createElement(TypeaheadEditor_1.default, { fullWidth: true, multiple: true, variant: "filled", className: className, value: values || [], onChange: handleChange, getSuggestions: getSuggestions }),
         !!onDelete && (react_1.default.createElement(SmallIconButton_1.default, { className: styles.deleteButton, icon: Delete_1.default, onClick: handleDelete, size: "L" }))));
 };

package/cjs/components/attributes/readMode/AttributesPager/AttributesPager.js

@@ -70,7 +70,7 @@ var AttributesPager = function (_a) {
                 return (react_1.default.createElement(MultiLineRenderer_1.default, { values: visibleValues, nonVisibleValues: nonVisibleValues, totalVisibleValues: totalVisibleValues, totalNonVisibleValues: totalNonVisibleValues, attributeType: attributeType, parentUri: parentUri, max: max, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, titleClassName: titleClassName, contentClassName: contentClassName, showNonOv: showNonOv }));
             case RENDERER_TYPES.imageLine:
                 return (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(Title_1.default, { label: attributeType === null || attributeType === void 0 ? void 0 : attributeType.label }),
+                    react_1.default.createElement(Title_1.default, { label: attributeType === null || attributeType === void 0 ? void 0 : attributeType.label, "data-reltio-id": "reltio-attribute-label" }),
                     react_1.default.createElement(ImageAttributesLine_1.default, { attributeValues: visibleValues, attributeType: attributeType, paging: paging, parentUri: parentUri, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, showNonOv: showNonOv })));
             case RENDERER_TYPES.special:
                 return react_1.default.createElement(SpecialRenderer_1.default, { values: visibleValues, attributeType: attributeType });

package/cjs/components/attributes/readMode/AttributesPager/MultiLineRenderer.js

@@ -58,7 +58,7 @@ var MultiLineRenderer = function (_a) {
     var hiddenValuesCount = totalVisibleValues - visibleValuesCount;
     return (react_1.default.createElement("div", { className: styles.wrapper },
         react_1.default.createElement("div", { className: styles.titleRow },
-            react_1.default.createElement(Title_1.default, { label: label, className: classnames_1.default(styles.title, titleClassName) }),
+            react_1.default.createElement(Title_1.default, { label: label, className: classnames_1.default(styles.title, titleClassName), "data-reltio-id": "reltio-attribute-label" }),
             react_1.default.createElement(OvIcon_1.default, { nonOvValues: nonVisibleValues, attributeType: attributeType, className: styles.ovIcon, nonOvTotal: totalNonVisibleValues })),
         react_1.default.createElement("div", { className: styles.attributes }, shownValues.map(function (value) { return (react_1.default.createElement(Attribute_1.default, { key: value.uri, className: classnames_1.default(styles.attribute, contentClassName), attributeValue: value, attributeType: attributeType, showNonOv: showNonOv })); })),
         showMore && (react_1.default.createElement(ShowMore_1.default, { moreNumber: ramda_1.min(max, hiddenValuesCount), valueNumber: hiddenValuesCount, onClick: onShowMore })),

package/cjs/components/attributes/readMode/AttributesPager/OneLineRenderer.js

@@ -18,7 +18,7 @@ var OneLineRenderer = function (_a) {
     var label = attributeType.label;
     return (react_1.default.createElement("div", { className: classnames_1.default(styles.collaborationWrapper, constants_1.COMMENTS_CONTAINER_VISIBILITY_AREA) },
         react_1.default.createElement("div", { className: classnames_1.default(styles.titleRow, styles.wrapper) },
-            react_1.default.createElement(Title_1.default, { label: label, className: classnames_1.default(styles.title, titleClassName) }),
+            react_1.default.createElement(Title_1.default, { label: label, className: classnames_1.default(styles.title, titleClassName), "data-reltio-id": "reltio-attribute-label" }),
             react_1.default.createElement(OvIcon_1.default, { nonOvValues: nonVisibleValues, attributeType: attributeType, className: styles.ovIcon, nonOvTotal: totalNonVisibleValues }),
             react_1.default.createElement(Attribute_1.default, { className: classnames_1.default(styles.attribute, contentClassName), attributeValue: value, attributeType: attributeType, showNonOv: showNonOv, inlined: true })),
         react_1.default.createElement(CommentsContainer_1.default, { uri: value.uri, relatedObjectUris: mdm_sdk_1.createRelatedObjectUris(mdm_sdk_1.CollaborationObjectTypes.ENTITY_ATTRIBUTE, {

package/cjs/components/attributes/readMode/AttributesPager/SpecialRenderer.js

@@ -34,7 +34,7 @@ var SpecialRenderer = function (_a) {
     };
     return (react_1.default.createElement("div", { className: classnames_1.default(styles.titleRow, styles.wrapper) },
         renderIcon(styles.titleIcon),
-        react_1.default.createElement(Title_1.default, { label: label, className: styles.title }),
+        react_1.default.createElement(Title_1.default, { label: label, className: styles.title, "data-reltio-id": "reltio-attribute-label" }),
         renderValue(styles.attribute)));
 };
 exports.default = SpecialRenderer;

package/cjs/components/attributes/readMode/ComplexAttribute/ComplexAttribute.js

@@ -48,7 +48,7 @@ var ComplexAttribute = function (_a) {
     return (react_1.default.createElement("div", { className: styles.complexContainer },
         react_1.default.createElement("div", { className: classnames_1.default(styles.labelContainer, classnames_2.COMMENTS_CONTAINER_VISIBILITY_AREA) },
             react_1.default.createElement(ArrowExpandButton_1.default, { onClick: function () { return setExpanded(function (value) { return !value; }); }, expanded: expanded }),
-            react_1.default.createElement(Typography_1.default, { component: "span", variant: "body2", classes: { body2: styles.label } }, label),
+            react_1.default.createElement(Typography_1.default, { component: "span", variant: "body2", classes: { body2: styles.label }, "data-reltio-id": "reltio-attribute-complex-label" }, label),
             react_1.default.createElement("div", { className: styles.spacer }),
             react_1.default.createElement(CommentsContainer_1.default, { uri: attributeValue.uri, relatedObjectUris: mdm_sdk_1.createRelatedObjectUris(mdm_sdk_1.CollaborationObjectTypes.ENTITY_ATTRIBUTE, {
                     uri: attributeValue.uri

package/cjs/components/attributes/readMode/ImageAttributesLine/ImageAttributesLine.js

@@ -45,7 +45,7 @@ var ImageAttributesLine = function (_a) {
             var historyAttributesClassName = historyAppearance_1.getHistoryAttributeClassName(imageAppearance);
             return (react_1.default.createElement("div", { className: classnames_1.default(styles.image, (_a = {},
                     _a[styles[historyAttributesClassName + 'Image']] = historyAttributesClassName,
-                    _a)), key: uri },
+                    _a)), key: uri, "data-reltio-id": "reltio-attribute-value" },
                 react_1.default.createElement(Image_1.default, { onClick: function () { return onOpenImageGalleryDialog(uri); }, className: styles[historyAttributesClassName], src: src, size: { imageWidth: imageSize.imageWidth, imageHeight: imageSize.imageHeight } })));
         };
         return renderImage;

package/cjs/components/attributes/readMode/SimpleAttribute/SimpleAttribute.js

@@ -42,9 +42,9 @@ var SimpleAttribute = function (_a) {
     var dataTypeValue = (react_1.default.createElement(DataTypeValue_1.default, { value: mdm_sdk_1.getAttributeValue(attributeValue), dataTypeDefinition: mdm_sdk_1.getAttrDataTypeDefinition(attributeType) }));
     return inlined || historyClassName ? (react_1.default.createElement("div", { className: className },
         react_1.default.createElement(PivotingTooltip_1.PivotingTooltip, { value: attributeValue, attributeType: attributeType, key: attributeValue.uri, className: classnames_1.default((_b = {}, _b[styles.multilineAttribute] = !inlined, _b)) },
-            react_1.default.createElement("span", { className: styles[historyClassName] }, dataTypeValue)))) : (react_1.default.createElement("div", { className: classnames_1.default(className, styles.root, classnames_2.COMMENTS_CONTAINER_VISIBILITY_AREA) },
+            react_1.default.createElement("span", { className: styles[historyClassName], "data-reltio-id": "reltio-attribute-value" }, dataTypeValue)))) : (react_1.default.createElement("div", { className: classnames_1.default(className, styles.root, classnames_2.COMMENTS_CONTAINER_VISIBILITY_AREA) },
         react_1.default.createElement(PivotingTooltip_1.PivotingTooltip, { value: attributeValue, attributeType: attributeType, key: attributeValue.uri },
-            react_1.default.createElement("span", { className: styles.attributeValue }, dataTypeValue)),
+            react_1.default.createElement("span", { className: styles.attributeValue, "data-reltio-id": "reltio-attribute-value" }, dataTypeValue)),
         react_1.default.createElement(CommentsContainer_1.default, { className: styles.commentsContainer, uri: attributeValue.uri, relatedObjectUris: mdm_sdk_1.createRelatedObjectUris(mdm_sdk_1.CollaborationObjectTypes.ENTITY_ATTRIBUTE, {
                 uri: attributeValue.uri
             }), objectType: mdm_sdk_1.CollaborationObjectTypes.ENTITY_ATTRIBUTE })));

package/cjs/components/attributes/readMode/SpecialAttributes/Roles/Roles.js

@@ -8,6 +8,6 @@ var SpecialAttributesArray_1 = __importDefault(require("../SpecialAttributesArra
 var Role_1 = __importDefault(require("./Role"));
 var Roles = function (_a) {
     var className = _a.className, values = _a.values;
-    return (react_1.default.createElement(SpecialAttributesArray_1.default, { values: values, className: className, Component: Role_1.default }));
+    return (react_1.default.createElement(SpecialAttributesArray_1.default, { values: values, className: className, dataReltioId: "reltio-attribute-value", Component: Role_1.default }));
 };
 exports.default = Roles;

package/cjs/components/attributes/readMode/SpecialAttributes/SpecialAttributesArray.d.ts

@@ -3,6 +3,7 @@ declare type Props = {
     className?: string;
     values: string[];
     Component: React.ElementType;
+    dataReltioId?: string;
 };
-declare const SpecialAttributesArray: ({ className, values, Component }: Props) => JSX.Element;
+declare const SpecialAttributesArray: ({ className, values, Component, dataReltioId }: Props) => JSX.Element;
 export default SpecialAttributesArray;

package/cjs/components/attributes/readMode/SpecialAttributes/SpecialAttributesArray.js

@@ -21,8 +21,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(require("react"));
 var SpecialAttributesArray = function (_a) {
-    var className = _a.className, values = _a.values, Component = _a.Component;
-    return (react_1.default.createElement("div", { className: className }, values.map(function (value, index) { return (react_1.default.createElement(react_1.Fragment, { key: value },
+    var className = _a.className, values = _a.values, Component = _a.Component, dataReltioId = _a.dataReltioId;
+    return (react_1.default.createElement("div", { className: className, "data-reltio-id": dataReltioId }, values.map(function (value, index) { return (react_1.default.createElement(react_1.Fragment, { key: value },
         react_1.default.createElement(Component, { value: value }),
         index < values.length - 1 && ', ')); })));
 };

package/cjs/components/attributes/readMode/SpecialAttributes/Tags/Tags.d.ts

@@ -2,6 +2,7 @@
 declare type Props = {
     className?: string;
     values: string[];
+    dataReltioId?: string;
 };
 declare const Tags: ({ className, values }: Props) => JSX.Element;
 export default Tags;

package/cjs/components/attributes/readMode/SpecialAttributes/Tags/Tags.js

@@ -8,6 +8,6 @@ var SpecialAttributesArray_1 = __importDefault(require("../SpecialAttributesArra
 var Tag_1 = __importDefault(require("./Tag"));
 var Tags = function (_a) {
     var className = _a.className, values = _a.values;
-    return (react_1.default.createElement(SpecialAttributesArray_1.default, { values: values, className: className, Component: Tag_1.default }));
+    return (react_1.default.createElement(SpecialAttributesArray_1.default, { values: values, className: className, dataReltioId: "reltio-attribute-value", Component: Tag_1.default }));
 };
 exports.default = Tags;