@reltio/components 1.4.1732 → 1.4.1734

package/cjs/components/Image/ImageActionsOverlay/ImageActionsOverlay.js

@@ -37,12 +37,14 @@ var DropDownMenuButton_1 = __importDefault(require("../../DropDownMenuButton/Dro
 var CheckedIcon_1 = require("../CheckedIcon/CheckedIcon");
 var Download_1 = __importDefault(require("../../../icons/Download"));
 var core_1 = require("../../../core");
+var contexts_1 = require("../../../contexts");
 var styles_1 = require("./styles");
 var ImageActionsOverlay = function (props) {
     var _a;
     var id = props.id, _b = props.canBeSelected, canBeSelected = _b === void 0 ? false : _b, _c = props.selected, selected = _c === void 0 ? false : _c, _d = props.selectionMode, selectionMode = _d === void 0 ? false : _d, _e = props.onDeselect, onDeselect = _e === void 0 ? core_1.noop : _e, _f = props.onSelect, onSelect = _f === void 0 ? core_1.noop : _f, onShareLink = props.onShareLink, onSetAsDefault = props.onSetAsDefault, onDelete = props.onDelete, _g = props.onDownload, onDownload = _g === void 0 ? core_1.noop : _g, onClick = props.onClick;
     var styles = (0, styles_1.useStyles)();
     var _h = (0, react_1.useState)(false), hovered = _h[0], setHovered = _h[1];
+    var canDelete = (0, contexts_1.useAttributeValueConfigPermissions)(id).canDelete;
     var menuItems = (0, react_1.useMemo)(function () {
         return [
             {
@@ -55,10 +57,10 @@ var ImageActionsOverlay = function (props) {
             },
             {
                 text: ui_i18n_1.default.text('Delete'),
-                onClick: onDelete
+                onClick: canDelete && onDelete
             }
         ].filter((0, ramda_1.prop)('onClick'));
-    }, [onShareLink, onSetAsDefault, onDelete]);
+    }, [onShareLink, onSetAsDefault, onDelete, canDelete]);
     var handleMouseEnter = function () { return setHovered(true); };
     var handleMouseLeave = function () { return setHovered(false); };
     var toggleSelected = function (selected) { return function () { return (0, ramda_1.ifElse)((0, ramda_1.equals)(true), onDeselect, onSelect)(selected); }; };
@@ -72,7 +74,7 @@ var ImageActionsOverlay = function (props) {
     return (react_1.default.createElement("div", { className: (0, classnames_1.default)(styles.overlay, (_a = {},
             _a[styles.selected] = selected,
             _a[styles.selectionMode] = selectionMode,
-            _a)), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onClick: selectionMode ? toggleSelected(selected) : handleClick },
+            _a)), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onClick: selectionMode ? toggleSelected(selected) : handleClick, "data-reltio-id": "image-actions-overlay" },
         showCheckBox && (react_1.default.createElement(CheckedIcon_1.CheckedIcon, { className: styles.checkedIcon, checked: selected, onClick: toggleSelected(selected) })),
         showActions && (react_1.default.createElement("div", { className: styles.actions },
             react_1.default.createElement(SmallIconButton_1.SmallIconButton, { onClick: onDownload, className: styles.actionButton, icon: Download_1.default }),

package/cjs/components/ImageAttributesGallery/ImageAttributesGallery.js

@@ -96,19 +96,22 @@ var ImageAttributesGallery = function (_a) {
         onDeleteAttribute({ uri: id, attributeType: attributeType });
     };
     var handleDeleteSelectedItems = function () {
-        var deleteUris = isGalleryMode ? selectedItems : [currentAttributeValueUri];
+        var deleteUris = getUrisForDelete();
         deleteUris.forEach(function (uri) {
             handleDelete(uri);
         });
         if (selectedItems.length)
             setSelectedItems([]);
     };
+    var _d = (0, react_1.useContext)(contexts_1.ConfigPermissionsContext), canCreate = _d.canCreate, canDelete = _d.canDelete;
     var isGalleryMode = mode === ImageGalleryDialog_1.Mode.GALLERY_MODE;
     var isDetailsMode = mode === ImageGalleryDialog_1.Mode.DETAILS_MODE;
     var hasSelectedItems = selectedItems.length > 0;
     var isHasSelectedItemsOrDetailsMode = isDetailsMode || (isGalleryMode && hasSelectedItems);
-    var isShowDeleteButton = !isViewMode && isHasSelectedItemsOrDetailsMode;
-    var isShowUploadButton = !isViewMode && (isDetailsMode || (isGalleryMode && !hasSelectedItems));
+    var getUrisForDelete = function () { return (isGalleryMode ? selectedItems : [currentAttributeValueUri]); };
+    var areAllItemsDeletable = getUrisForDelete().every(function (uri) { return (0, mdm_sdk_1.isTempUri)(uri) || canDelete; });
+    var isShowDeleteButton = !isViewMode && isHasSelectedItemsOrDetailsMode && areAllItemsDeletable;
+    var isShowUploadButton = !isViewMode && canCreate && (isDetailsMode || (isGalleryMode && !hasSelectedItems));
     var headerLeft = isGalleryMode && hasSelectedItems && (react_1.default.createElement(HeaderLeft_1.HeaderLeft, { items: imageItems, selectedItems: selectedItems, onClearAll: handleClearAll, onSelectAll: handleSelectAll }));
     var headerRight = (react_1.default.createElement(HeaderRight_1.HeaderRight, { onDelete: isShowDeleteButton ? handleDeleteSelectedItems : undefined, onDownload: isHasSelectedItemsOrDetailsMode ? handleDownloadSelectedItems : undefined, onShare: isDetailsMode ? handleSharedCurrentItem : undefined, onUpload: isShowUploadButton ? onUpload : undefined }));
     var handleClickByImage = function (id) {

package/cjs/components/ImageDetailsView/MetaInfoHeader/MetaInfoHeader.js

@@ -36,12 +36,14 @@ var Divider_1 = __importDefault(require("@mui/material/Divider"));
 var MoreAttributesButton_1 = __importDefault(require("../../attributes/editMode/MoreAttributesButton"));
 var helpers_1 = require("../helpers");
 var styles_1 = require("./styles");
+var contexts_1 = require("../../../contexts");
 var MetaInfoHeader = function (_a) {
     var _b;
     var attributeType = _a.attributeType, onAddAttributes = _a.onAddAttributes, uri = _a.uri;
     var styles = (0, styles_1.useStyles)();
     var moreAttrTypes = (0, helpers_1.getMoreAttrTypes)(attributeType);
-    var canAdd = Boolean(onAddAttributes);
+    var canCreate = (0, react_1.useContext)(contexts_1.ConfigPermissionsContext).canCreate;
+    var canAdd = canCreate && Boolean(onAddAttributes);
     var handleApply = function (attrTypes) {
         if (onAddAttributes) {
             onAddAttributes(attrTypes.map(function (attributeType) { return ({ attributeType: attributeType, parentUri: uri }); }));

package/cjs/components/RelationEditor/RelationEditor.js

@@ -197,7 +197,7 @@ var RelationEditor = function (_a) {
         react_1.default.createElement("div", { className: styles.editor },
             react_1.default.createElement(Typography_1.default, { className: styles.title }, isNew ? ui_i18n_1.default.text('Add new item') : ui_i18n_1.default.text('Edit item')),
             defaultRelationType === null && (react_1.default.createElement(ConnectionRelationTypeSelector_1.default, { className: styles.item, relation: connection.relation, inRelationTypes: inRelationTypes, outRelationTypes: outRelationTypes, onChange: onRelationTypeChange })),
-            Boolean(relationType) && (react_1.default.createElement(react_1.default.Fragment, null,
+            Boolean(relationType) && (react_1.default.createElement(contexts_1.ConfigPermissionsContextProvider, null,
                 react_1.default.createElement("div", { ref: ref, className: errorClassName },
                     react_1.default.createElement(ErrorWrapper_1.default, { errorMessage: errorMessage },
                         react_1.default.createElement(EntitySelector_1.default, { className: (0, classnames_1.default)(styles.item, (_b = {},

package/cjs/components/ReltioGridLayout/ReltioGridLayout.d.ts

@@ -1,5 +1,5 @@
 import React, { ElementType } from 'react';
-import { DragOverEvent } from 'react-grid-layout';
+import { ReactGridLayoutProps } from 'react-grid-layout';
 import { ReltioGridLayoutItem } from '@reltio/mdm-sdk';
 import { ReactGridLayoutItem, ReltioGridLayoutOptions } from '../../types';
 type Props<ViewConfig = Record<string, unknown>> = {
@@ -8,10 +8,7 @@ type Props<ViewConfig = Record<string, unknown>> = {
     layoutOptions?: ReltioGridLayoutOptions;
     onLayoutChanged?: (layout: ReltioGridLayoutItem[]) => void;
     onDrop?: (layout: ReltioGridLayoutItem[], layoutItem: ReltioGridLayoutItem, e: Event) => void;
-    onDropDragOver?: (e: DragOverEvent) => {
-        w?: number;
-        h?: number;
-    } | false | undefined;
+    onDropDragOver?: ReactGridLayoutProps['onDropDragOver'];
     onRemove?: (id: string) => void;
     LayoutItem: ElementType;
     draggableHandle?: string;
@@ -22,7 +19,7 @@ type Props<ViewConfig = Record<string, unknown>> = {
         root?: string;
         item?: string;
     };
-    onResize?: (layout: ReactGridLayoutItem[], oldLayoutItem: ReactGridLayoutItem, layoutItem: ReactGridLayoutItem, placeholder: ReactGridLayoutItem) => void;
+    onResize?: ReactGridLayoutProps['onResize'];
 };
 declare const _default: React.MemoExoticComponent<{
     ({ views, layout, layoutOptions, onLayoutChanged, draggableHandle, LayoutItem, onRemove, onDrop, droppingItem, isDroppable, onDropDragOver, isStatic, classes, onResize }: Props<Record<string, unknown>>): JSX.Element;

package/cjs/components/ReltioGridLayout/ReltioGridLayout.js

@@ -54,6 +54,7 @@ var ReltioGridLayout = function (_a) {
     var _b;
     var views = _a.views, layout = _a.layout, _c = _a.layoutOptions, layoutOptions = _c === void 0 ? DEFAULT_LAYOUT_OPTIONS : _c, _d = _a.onLayoutChanged, onLayoutChanged = _d === void 0 ? core_1.noop : _d, draggableHandle = _a.draggableHandle, LayoutItem = _a.LayoutItem, onRemove = _a.onRemove, onDrop = _a.onDrop, droppingItem = _a.droppingItem, isDroppable = _a.isDroppable, onDropDragOver = _a.onDropDragOver, isStatic = _a.isStatic, classes = _a.classes, _e = _a.onResize, onResize = _e === void 0 ? core_1.noop : _e;
     var ref = (0, react_1.useRef)();
+    var shouldCompareLayout = (0, react_1.useRef)(false);
     var heightsMap = (0, react_1.useRef)({});
     var styles = (0, styles_1.useStyles)();
     var _f = (0, react_1.useState)(null), resizingItemId = _f[0], setResizingItemId = _f[1];
@@ -61,7 +62,8 @@ var ReltioGridLayout = function (_a) {
     var _h = (0, react_1.useState)(0), width = _h[0], setWidth = _h[1];
     var cols = layoutOptions.cols, rowHeight = layoutOptions.rowHeight, margin = layoutOptions.margin;
     var processedLayout = (0, react_1.useMemo)(function () { return (0, helpers_1.reltioLayoutToReactGridLayout)(layout); }, [layout]);
-    var onReltioLayoutChanged = (0, ramda_1.pipe)(helpers_1.reactGridLayoutToReltioLayout, (0, helpers_1.copyPropsFromPreviousLayout)(['autosizing'], layout), (0, ramda_1.ifElse)((0, ramda_1.always)(isStatic), (0, helpers_1.alignGroupedItemsHeights)(heightsMap.current), (0, helpers_1.calcLayoutItemsHeight)(heightsMap.current)), onLayoutChanged);
+    var convertReactLayoutToReltioLayout = (0, ramda_1.pipe)(helpers_1.reactGridLayoutToReltioLayout, (0, helpers_1.copyPropsFromPreviousLayout)(['autosizing'], layout), (0, ramda_1.ifElse)((0, ramda_1.always)(isStatic), (0, helpers_1.alignGroupedItemsHeights)(heightsMap.current), (0, helpers_1.calcLayoutItemsHeight)(heightsMap.current)));
+    var onReltioLayoutChanged = (0, ramda_1.pipe)(convertReactLayoutToReltioLayout, onLayoutChanged);
     var handleDrop = function (layout, layoutItem, e) {
         if (onDrop && layoutItem) {
             onDrop((0, helpers_1.reactGridLayoutToReltioLayout)(layout), (0, helpers_1.reactGridLayoutItemToReltioLayoutItem)(layoutItem), e);
@@ -74,10 +76,26 @@ var ReltioGridLayout = function (_a) {
                 var newHeight = (0, helpers_1.calcHeight)(height, layoutOptions);
                 if (newHeight !== heightsMap.current[layoutItemId]) {
                     heightsMap.current[layoutItemId] = newHeight;
+                    shouldCompareLayout.current = false;
                     onReltioLayoutChanged(processedLayout);
                 }
             }
         } })); };
+    (0, react_1.useEffect)(function () {
+        if (isStatic) {
+            if (shouldCompareLayout.current) {
+                var expectedLayout = convertReactLayoutToReltioLayout(processedLayout);
+                var isSameLayout = (0, ramda_1.equals)((0, helpers_1.reltioLayoutToReactGridLayout)(expectedLayout), processedLayout);
+                if (!isSameLayout) {
+                    shouldCompareLayout.current = false;
+                    onLayoutChanged(expectedLayout);
+                }
+            }
+            else {
+                shouldCompareLayout.current = true;
+            }
+        }
+    }, [processedLayout, isStatic]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(react_resize_detector_1.default, { refreshMode: "debounce", refreshRate: 50, handleWidth: true, onResize: function (width) { return setWidth(width); } }),
         !!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: isStatic ? undefined : onReltioLayoutChanged, isResizable: !isStatic && !isFullscreenEnabled, isDraggable: !isStatic && !isFullscreenEnabled, className: (0, classnames_1.default)(classes === null || classes === void 0 ? void 0 : classes.root, styles.gridLayout, (_b = {},

package/cjs/components/activityLog/activities/RelationObject/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"link" | "relationship" | "delimiter">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"link" | "delimiter" | "relationship">;

package/cjs/components/attributes/OvIcon/OvIcon.d.ts

@@ -26,7 +26,7 @@ export declare const ChipWithTooltip: React.ForwardRefExoticComponent<import("pr
     variant?: import("@mui/types").OverridableStringUnion<"filled" | "outlined", import("@mui/material/Chip").ChipPropsVariantOverrides>;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
-}, "label" | "icon" | "children" | "size" | "color" | "disabled" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | "tabIndex" | "variant" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled">>;
+}, "label" | "icon" | "children" | "size" | "color" | "disabled" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | "tabIndex" | "variant" | "deleteIcon" | "avatar" | "clickable" | "onDelete" | "skipFocusWhenDisabled">>;
 type ComplexWithLabel = NestedAttributeValue | ReferenceAttributeValue;
 type Props = {
     className?: string;

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

@@ -65,11 +65,14 @@ var AttributesList = function (_a) {
     (0, react_1.useEffect)(function () {
         setHasDeletionsMap({});
     }, [parentUri]);
-    var canCreateParentAttrType = (0, react_1.useMemo)(function () { return parentAttributeType && (0, mdm_sdk_1.checkCanCreateAttribute)({ attributeType: parentAttributeType, mode: mode }); }, [parentAttributeType, mode]);
-    var creatableAttrTypes = (0, react_1.useMemo)(function () { return (0, mdm_sdk_1.getCreatableAttributeTypes)(mode, attrTypes); }, [attrTypes, mode]);
+    var canCreate = (0, react_1.useContext)(contexts_1.ConfigPermissionsContext).canCreate;
+    var canCreateParentAttrType = (0, react_1.useMemo)(function () { return canCreate && parentAttributeType && (0, mdm_sdk_1.checkCanCreateAttribute)({ attributeType: parentAttributeType, mode: mode }); }, [parentAttributeType, mode, canCreate]);
+    var creatableAttrTypes = (0, react_1.useMemo)(function () { return (canCreate ? (0, mdm_sdk_1.getCreatableAttributeTypes)(mode, attrTypes) : []); }, [attrTypes, mode, canCreate]);
     var moreAttrTypes = (0, helpers_1.getMoreAttrTypes)(creatableAttrTypes, entity, showEmptyEditors, hasDeletionsMap);
     var pinnedAttributes = (0, react_1.useContext)(PinnedAttributesContext_1.PinnedAttributesContext);
-    var pagersData = (0, react_1.useMemo)(function () { return (0, mdm_sdk_1.getAttributesListForEditMode)(attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes); }, [attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes]);
+    var pagersData = (0, react_1.useMemo)(function () {
+        return (0, mdm_sdk_1.getAttributesListForEditMode)(attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes, canCreate);
+    }, [attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes, canCreate]);
     var _e = (0, react_1.useMemo)(function () { return (0, attributesView_1.splitPagersData)(alwaysVisibleTypeUris, pagersData); }, [pagersData, alwaysVisibleTypeUris]), alwaysVisiblePagersData = _e[0], regularPagersData = _e[1];
     var onAddMoreAttributes = (0, react_1.useCallback)(function (attributeTypes) {
         onAddAttributes(attributeTypes.map(function (attributeType) { return ({

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

@@ -73,15 +73,17 @@ var ComplexAttribute = function (_a) {
     (0, react_1.useEffect)(function () {
         setExpanded(defaultExpand);
     }, [defaultExpand]);
+    var configCanDelete = (0, contexts_1.useAttributeValueConfigPermissions)(attributeValue.uri).canDelete;
     var canDelete = (0, react_1.useMemo)(function () {
-        return (0, mdm_sdk_1.checkCanDeleteAttribute)({
-            attributeType: attributeType,
-            attributeValue: attributeValue,
-            mode: mode,
-            metadata: metadata,
-            isReltioCrosswalk: (0, mdm_sdk_1.isReltioCrosswalk)(crosswalks, attributeValue)
-        });
-    }, [attributeType, attributeValue, mode, metadata, crosswalks]);
+        return configCanDelete &&
+            (0, mdm_sdk_1.checkCanDeleteAttribute)({
+                attributeType: attributeType,
+                attributeValue: attributeValue,
+                mode: mode,
+                metadata: metadata,
+                isReltioCrosswalk: (0, mdm_sdk_1.isReltioCrosswalk)(crosswalks, attributeValue)
+            });
+    }, [attributeType, attributeValue, mode, metadata, crosswalks, configCanDelete]);
     var showDeleteButton = !deleted && !hideDeleteButton && !!onDeleteAttribute && canDelete;
     var onDeleteThis = function () { return onDeleteAttribute({ uri: uri, attributeType: attributeType, attributeValue: attributeValue }); };
     var hasDescendantsWithErrors = (0, react_1.useMemo)(function () { return (0, mdm_sdk_1.hasAttributeDescendantsWithErrors)(attributeValue, errors); }, [errors, attributeValue]);

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

@@ -45,6 +45,7 @@ var ImageAttributesLine = function (_a) {
     var setDefaultProfilePic = (0, contexts_1.useMdmAction)('setDefaultProfilePicForModifiedEntity');
     var entity = (0, contexts_1.useMdmEntity)() || defaultEntity;
     var defaultProfilePic = (0, contexts_1.useMdmModifiedEntityDefaultProfilePic)(entity.uri);
+    var canCreate = (0, react_1.useContext)(contexts_1.ConfigPermissionsContext).canCreate;
     var toggleVisibilityUploadDialog = (0, react_1.useCallback)(function () {
         setIsVisibleUploadDialog(function (visible) { return !visible; });
     }, []);
@@ -100,10 +101,9 @@ var ImageAttributesLine = function (_a) {
         };
         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, imageSize: imageSize, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, paging: paging, parentUri: parentUri, showNonOv: showNonOv },
-            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, "data-reltio-id": "reltio-upload-image-button" }))),
+    return (react_1.default.createElement("div", { className: styles.root, "data-reltio-id": "image-line-edit-mode" },
+        react_1.default.createElement(ImageAttributesLine_1.default, { attributeValues: attributeValues, attributeType: attributeType, renderImage: renderImage, overlay: true, countFixedItems: canCreate ? 1 : 0, onUpload: toggleVisibilityUploadDialog, onDeleteAttribute: handleDeleteAttribute, imageSize: imageSize, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, paging: paging, parentUri: parentUri, showNonOv: showNonOv }, canCreate && (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, "data-reltio-id": "reltio-upload-image-button" })))),
         react_1.default.createElement(UploadImageDialog_1.UploadImageDialog, { open: isVisibleUploadDialog, onUpload: handleAddAttributes, onClose: toggleVisibilityUploadDialog })));
 };
 exports.default = ImageAttributesLine;

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

@@ -132,15 +132,17 @@ var ReferenceAttribute = function (props) {
         onChangeEntity(newEntity);
         entityCreated(newEntity);
     }, [newEntityAttrTypesSelectionStrategy, mode, referencedEntityType, metadata, onChangeEntity, entityCreated]);
+    var _c = (0, contexts_1.useAttributeValueConfigPermissions)(attributeValue.uri), configCanCreate = _c.canCreate, configCanUpdate = _c.canUpdate;
     var canChangeReferencedEntity = (0, react_1.useMemo)(function () {
-        return (0, mdm_sdk_1.checkCanEditAttribute)({
-            attributeType: attributeType,
-            attributeValue: attributeValue,
-            mode: mode,
-            isReltioCrosswalk: (0, mdm_sdk_1.isReltioCrosswalk)(crosswalks, attributeValue)
-        });
-    }, [attributeType, attributeValue, mode, crosswalks]);
-    var canCreateReferencedEntity = (0, react_1.useMemo)(function () { return (0, mdm_sdk_1.checkMetadataForCreate)(mode, referencedEntityType); }, [mode, referencedEntityType]);
+        return configCanUpdate &&
+            (0, mdm_sdk_1.checkCanEditAttribute)({
+                attributeType: attributeType,
+                attributeValue: attributeValue,
+                mode: mode,
+                isReltioCrosswalk: (0, mdm_sdk_1.isReltioCrosswalk)(crosswalks, attributeValue)
+            });
+    }, [attributeType, attributeValue, mode, crosswalks, configCanUpdate]);
+    var canCreateReferencedEntity = (0, react_1.useMemo)(function () { return configCanCreate && (0, mdm_sdk_1.checkMetadataForCreate)(mode, referencedEntityType); }, [mode, referencedEntityType, configCanCreate]);
     var errorMessage = (0, mdm_sdk_1.getErrorMessage)(referencedEntityMissedError);
     return (react_1.default.createElement(ComplexAttribute_1.default, __assign({}, ownProps, { label: (0, mdm_sdk_1.getLabel)(label), attributeTypesList: editableAttrTypes, crosswalks: allCrosswalks, metadata: metadata }),
         react_1.default.createElement("div", { ref: ref, className: errorClassName },

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

@@ -67,6 +67,7 @@ var HOCs_1 = require("../../../../HOCs");
 var contexts_1 = require("../../../../contexts");
 var hooks_1 = require("../../../../hooks");
 var useAutopopulationContextValue_1 = require("./useAutopopulationContextValue");
+var useAttributeValuePermissions_1 = require("./useAttributeValuePermissions");
 var styles_1 = require("./styles");
 var AsyncMountPlaceholder = function () {
     var styles = (0, styles_1.useStyles)();
@@ -79,13 +80,16 @@ var SimpleAttributeEditor = function (_a) {
     var deleted = state === 'deleted';
     var edited = state === 'edited';
     var isEditableMode = (0, mdm_sdk_1.isEditableMode)(mode);
-    var canCreate = (0, mdm_sdk_1.checkCanCreateAttribute)({ attributeType: attributeType, mode: mode });
-    var canEdit = (0, mdm_sdk_1.checkCanEditAttribute)({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
-    var canDelete = (0, mdm_sdk_1.checkCanDeleteAttribute)({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
+    var _e = (0, useAttributeValuePermissions_1.useAttributeValuePermissions)({
+        attributeValue: attributeValue,
+        attributeType: attributeType,
+        mode: mode,
+        isReltioCrosswalk: isReltioCrosswalk
+    }), canCreate = _e.canCreate, canEdit = _e.canEdit, canDelete = _e.canDelete;
     var showToEdit = canEdit && isEditableMode;
     var errorMessage = (0, mdm_sdk_1.getErrorMessage)(ownError);
     var dependentLookupEditorContext = (0, contexts_1.useMdmDependentLookupEditorContext)(attributeValue, attributeType);
-    var _e = (0, hooks_1.useScrollToAttributeError)({ highlightedError: highlightedError, isSimple: true }), ref = _e.ref, errorClassName = _e.errorClassName;
+    var _f = (0, hooks_1.useScrollToAttributeError)({ highlightedError: highlightedError, isSimple: true }), ref = _f.ref, errorClassName = _f.errorClassName;
     (0, react_1.useEffect)(function () {
         // when editor is empty but has default lookup code, onChangeAttribute will be called by useLookupsResolver
         if (isEmptyEditor && (0, mdm_sdk_1.isDependentLookupAttrType)(attributeType) && !(0, ramda_1.has)('lookupCode', attributeValue)) {
@@ -130,7 +134,7 @@ var SimpleAttributeEditor = function (_a) {
                 "(",
                 ui_i18n_1.default.text('edited'),
                 ")")),
-            showAddButton && (react_1.default.createElement(SmallIconButton_1.default, { icon: Add_1.default, onClick: onAddOneMore, size: "L", className: (0, classnames_1.default)(styles.addButton, styles.button) })),
+            showAddButton && (react_1.default.createElement(SmallIconButton_1.default, { icon: Add_1.default, onClick: onAddOneMore, size: "L", className: (0, classnames_1.default)(styles.addButton, styles.button), "data-reltio-id": "reltio-add-one-more-simple-attribute-button" })),
             additionalControlsRenderer && additionalControlsRenderer({ attributeType: attributeType, attributeValue: attributeValue }),
             showDeleteButton && (react_1.default.createElement(SmallIconButton_1.default, { className: styles.button, icon: Delete_1.default, onClick: onDelete, size: "L", "data-reltio-id": "reltio-delete-simple-attribute-button" })))));
 };

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

@@ -23,7 +23,8 @@ exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
     'editor-read-only-value': {
         marginLeft: '12px',
         display: 'flex',
-        alignItems: 'center'
+        alignItems: 'center',
+        color: theme.palette.text.primary
     },
     'editor-actions': {
         display: 'flex',

package/cjs/components/attributes/editMode/SimpleAttributeEditor/useAttributeValuePermissions.d.ts

@@ -0,0 +1,13 @@
+import { AttributeType, Mode, SimpleAttributeValue } from '@reltio/mdm-sdk';
+type Props = {
+    attributeType: AttributeType;
+    attributeValue: SimpleAttributeValue;
+    isReltioCrosswalk: boolean;
+    mode: Mode;
+};
+export declare const useAttributeValuePermissions: ({ attributeType, attributeValue, isReltioCrosswalk, mode }: Props) => {
+    canCreate: boolean;
+    canEdit: any;
+    canDelete: any;
+};
+export {};

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

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAttributeValuePermissions = void 0;
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var contexts_1 = require("../../../../contexts");
+var useAttributeValuePermissions = function (_a) {
+    var attributeType = _a.attributeType, attributeValue = _a.attributeValue, isReltioCrosswalk = _a.isReltioCrosswalk, mode = _a.mode;
+    var _b = (0, contexts_1.useAttributeValueConfigPermissions)(attributeValue.uri), configCanCreate = _b.canCreate, configCanUpdate = _b.canUpdate, configCanDelete = _b.canDelete;
+    var canCreate = configCanCreate && (0, mdm_sdk_1.checkCanCreateAttribute)({ attributeType: attributeType, mode: mode });
+    var canEdit = configCanUpdate && (0, mdm_sdk_1.checkCanEditAttribute)({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
+    var canDelete = configCanDelete && (0, mdm_sdk_1.checkCanDeleteAttribute)({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
+    return { canCreate: canCreate, canEdit: canEdit, canDelete: canDelete };
+};
+exports.useAttributeValuePermissions = useAttributeValuePermissions;

package/cjs/components/workflow/components/WorkflowComments/styles.d.ts

@@ -1,4 +1,4 @@
 export declare const useCommentStyles: (props?: any) => import("@mui/styles").ClassNameMap<"date" | "icon" | "comment" | "text" | "info" | "avatar" | "firstLine" | "author">;
-export declare const useCollapsedCommentsStyles: (props?: any) => import("@mui/styles").ClassNameMap<"delimiter" | "circleButton">;
+export declare const useCollapsedCommentsStyles: (props?: any) => import("@mui/styles").ClassNameMap<"circleButton" | "delimiter">;
 export declare const useWorkflowStyles: (props?: any) => import("@mui/styles").ClassNameMap<"title" | "container" | "commentsContainer" | "filledInputRoot" | "modeSwitcherWrapper" | "sendButton">;
 export declare const useExpandedComments: (props?: any) => import("@mui/styles").ClassNameMap<"messageContainer">;

package/cjs/contexts/ConfigPermissionsContext/index.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { ViewExtension } from '@reltio/mdm-sdk';
+type ConfigPermissionsContextValue = {
+    canCreate: boolean;
+    canUpdate: boolean;
+    canDelete: boolean;
+};
+declare const ConfigPermissionsContext: React.Context<ConfigPermissionsContextValue>;
+type Props = {
+    children: React.ReactNode;
+    view?: ViewExtension;
+};
+declare const ConfigPermissionsContextProvider: ({ children, view }: Props) => JSX.Element;
+declare const useAttributeValueConfigPermissions: (attributeValueUri: string) => {
+    canCreate: boolean;
+    canUpdate: any;
+    canDelete: any;
+};
+export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttributeValueConfigPermissions };

package/cjs/contexts/ConfigPermissionsContext/index.js

@@ -0,0 +1,62 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAttributeValueConfigPermissions = exports.ConfigPermissionsContextProvider = exports.ConfigPermissionsContext = void 0;
+var react_1 = __importStar(require("react"));
+var hooks_1 = require("../../hooks");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var defaultValue = {
+    canCreate: true,
+    canUpdate: true,
+    canDelete: true
+};
+var ConfigPermissionsContext = react_1.default.createContext(defaultValue);
+exports.ConfigPermissionsContext = ConfigPermissionsContext;
+ConfigPermissionsContext.displayName = 'ConfigPermissionsContext';
+var ConfigPermissionsContextProvider = function (_a) {
+    var children = _a.children, view = _a.view;
+    var _b = (0, hooks_1.useConfigPermissions)(), canCreate = _b.canCreate, canDelete = _b.canDelete, canUpdate = _b.canUpdate;
+    var value = (0, react_1.useMemo)(function () {
+        return view
+            ? {
+                canCreate: canCreate(view),
+                canUpdate: canUpdate(view),
+                canDelete: canDelete(view)
+            }
+            : defaultValue;
+    }, [view, canCreate, canUpdate, canDelete]);
+    return react_1.default.createElement(ConfigPermissionsContext.Provider, { value: value }, children);
+};
+exports.ConfigPermissionsContextProvider = ConfigPermissionsContextProvider;
+var useAttributeValueConfigPermissions = function (attributeValueUri) {
+    var _a = (0, react_1.useContext)(ConfigPermissionsContext), canCreate = _a.canCreate, canUpdate = _a.canUpdate, canDelete = _a.canDelete;
+    var isNew = (0, mdm_sdk_1.isTempUri)(attributeValueUri);
+    return (0, react_1.useMemo)(function () { return ({
+        canCreate: canCreate,
+        canUpdate: isNew || canUpdate,
+        canDelete: isNew || canDelete
+    }); }, [isNew, canCreate, canUpdate, canDelete]);
+};
+exports.useAttributeValueConfigPermissions = useAttributeValueConfigPermissions;

package/cjs/contexts/index.d.ts

@@ -31,4 +31,5 @@ export { FeaturesContext } from './FeaturesContext';
 export { DependentLookupAutopopulationContext } from './DependentLookupAutopopulationContext';
 export { PageRequestsAbortingContext } from './PageRequestsAbortingContext';
 export { ActionsHookProvider, useActionsHook } from './ActionsHookContext';
+export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttributeValueConfigPermissions } from './ConfigPermissionsContext';
 export * from './MdmModuleContext';

package/cjs/contexts/index.js

@@ -14,7 +14,8 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useActionsHook = exports.ActionsHookProvider = exports.PageRequestsAbortingContext = exports.DependentLookupAutopopulationContext = exports.FeaturesContext = exports.LabelsContext = exports.UrlGeneratorsContext = exports.isHighlightedAttributeType = exports.isHighlightedErrorType = exports.ScrollType = exports.ScrollToElementProvider = exports.ScrollToElementContext = exports.SearchValueContext = exports.InterceptHandlersContext = exports.HighlightedValuesContext = exports.SnackbarContext = exports.SearchFiltersContext = exports.useReloadFacet = exports.ReloadFacetProvider = exports.useReloadAllFacets = exports.SandboxAPIContext = exports.EntityContext = exports.RelatedObjectUrisContext = exports.WorkflowTasksContext = exports.useEntityLoadingIndication = exports.EntityLoadingIndicationProvider = exports.EntityMarkerContext = exports.useAttributeExpanded = exports.ExpandedAttributesProvider = exports.useHighlightedCrosswalks = exports.useCrosswalkHighlight = exports.useCrosswalkFocus = exports.useCrosswalkColor = exports.CrosswalksDisplayProvider = exports.EntitiesMapContext = exports.IdContext = exports.ProfilePerspectiveViewContext = exports.usePerspectivesSettings = exports.PerspectivesSettingsContext = exports.PivotingAttributeContext = exports.UsersContext = exports.CollaborationContextProvider = exports.CollaborationContext = exports.BlockImageGalleryDialogContext = exports.ViewIdContext = exports.PopupBoundariesContext = exports.HistoryDiffContext = exports.AsyncMountContext = void 0;
+exports.ConfigPermissionsContextProvider = exports.ConfigPermissionsContext = exports.useActionsHook = exports.ActionsHookProvider = exports.PageRequestsAbortingContext = exports.DependentLookupAutopopulationContext = exports.FeaturesContext = exports.LabelsContext = exports.UrlGeneratorsContext = exports.isHighlightedAttributeType = exports.isHighlightedErrorType = exports.ScrollType = exports.ScrollToElementProvider = exports.ScrollToElementContext = exports.SearchValueContext = exports.InterceptHandlersContext = exports.HighlightedValuesContext = exports.SnackbarContext = exports.SearchFiltersContext = exports.useReloadFacet = exports.ReloadFacetProvider = exports.useReloadAllFacets = exports.SandboxAPIContext = exports.EntityContext = exports.RelatedObjectUrisContext = exports.WorkflowTasksContext = exports.useEntityLoadingIndication = exports.EntityLoadingIndicationProvider = exports.EntityMarkerContext = exports.useAttributeExpanded = exports.ExpandedAttributesProvider = exports.useHighlightedCrosswalks = exports.useCrosswalkHighlight = exports.useCrosswalkFocus = exports.useCrosswalkColor = exports.CrosswalksDisplayProvider = exports.EntitiesMapContext = exports.IdContext = exports.ProfilePerspectiveViewContext = exports.usePerspectivesSettings = exports.PerspectivesSettingsContext = exports.PivotingAttributeContext = exports.UsersContext = exports.CollaborationContextProvider = exports.CollaborationContext = exports.BlockImageGalleryDialogContext = exports.ViewIdContext = exports.PopupBoundariesContext = exports.HistoryDiffContext = exports.AsyncMountContext = void 0;
+exports.useAttributeValueConfigPermissions = void 0;
 var AsyncMountContext_1 = require("./AsyncMountContext");
 Object.defineProperty(exports, "AsyncMountContext", { enumerable: true, get: function () { return AsyncMountContext_1.AsyncMountContext; } });
 var HistoryAppearanceContext_1 = require("./HistoryAppearanceContext");
@@ -96,4 +97,8 @@ Object.defineProperty(exports, "PageRequestsAbortingContext", { enumerable: true
 var ActionsHookContext_1 = require("./ActionsHookContext");
 Object.defineProperty(exports, "ActionsHookProvider", { enumerable: true, get: function () { return ActionsHookContext_1.ActionsHookProvider; } });
 Object.defineProperty(exports, "useActionsHook", { enumerable: true, get: function () { return ActionsHookContext_1.useActionsHook; } });
+var ConfigPermissionsContext_1 = require("./ConfigPermissionsContext");
+Object.defineProperty(exports, "ConfigPermissionsContext", { enumerable: true, get: function () { return ConfigPermissionsContext_1.ConfigPermissionsContext; } });
+Object.defineProperty(exports, "ConfigPermissionsContextProvider", { enumerable: true, get: function () { return ConfigPermissionsContext_1.ConfigPermissionsContextProvider; } });
+Object.defineProperty(exports, "useAttributeValueConfigPermissions", { enumerable: true, get: function () { return ConfigPermissionsContext_1.useAttributeValueConfigPermissions; } });
 __exportStar(require("./MdmModuleContext"), exports);

package/cjs/types/index.d.ts

@@ -1,17 +1,7 @@
 import React from 'react';
 import { AttributeType, SearchFilter, SearchOperator } from '@reltio/mdm-sdk';
-export type ReactGridLayoutItem = {
-    i: string;
-    x: number;
-    y: number;
-    w: number;
-    h: number;
-    minW?: number;
-    minH?: number;
-    maxW?: number;
-    maxH?: number;
-    static?: boolean;
-};
+import { Layout as LayoutItem } from 'react-grid-layout';
+export type ReactGridLayoutItem = LayoutItem;
 export type ReltioGridLayoutOptions = {
     cols: number;
     rowHeight: number;

package/esm/components/Image/ImageActionsOverlay/ImageActionsOverlay.js

@@ -9,12 +9,14 @@ import DropDownMenuButton from '../../DropDownMenuButton/DropDownMenuButton';
 import { CheckedIcon } from '../CheckedIcon/CheckedIcon';
 import DownloadIcon from '../../../icons/Download';
 import { noop } from '../../../core';
+import { useAttributeValueConfigPermissions } from '../../../contexts';
 import { useStyles } from './styles';
 var ImageActionsOverlay = function (props) {
     var _a;
     var id = props.id, _b = props.canBeSelected, canBeSelected = _b === void 0 ? false : _b, _c = props.selected, selected = _c === void 0 ? false : _c, _d = props.selectionMode, selectionMode = _d === void 0 ? false : _d, _e = props.onDeselect, onDeselect = _e === void 0 ? noop : _e, _f = props.onSelect, onSelect = _f === void 0 ? noop : _f, onShareLink = props.onShareLink, onSetAsDefault = props.onSetAsDefault, onDelete = props.onDelete, _g = props.onDownload, onDownload = _g === void 0 ? noop : _g, onClick = props.onClick;
     var styles = useStyles();
     var _h = useState(false), hovered = _h[0], setHovered = _h[1];
+    var canDelete = useAttributeValueConfigPermissions(id).canDelete;
     var menuItems = useMemo(function () {
         return [
             {
@@ -27,10 +29,10 @@ var ImageActionsOverlay = function (props) {
             },
             {
                 text: i18n.text('Delete'),
-                onClick: onDelete
+                onClick: canDelete && onDelete
             }
         ].filter(prop('onClick'));
-    }, [onShareLink, onSetAsDefault, onDelete]);
+    }, [onShareLink, onSetAsDefault, onDelete, canDelete]);
     var handleMouseEnter = function () { return setHovered(true); };
     var handleMouseLeave = function () { return setHovered(false); };
     var toggleSelected = function (selected) { return function () { return ifElse(equals(true), onDeselect, onSelect)(selected); }; };
@@ -44,7 +46,7 @@ var ImageActionsOverlay = function (props) {
     return (React.createElement("div", { className: classnames(styles.overlay, (_a = {},
             _a[styles.selected] = selected,
             _a[styles.selectionMode] = selectionMode,
-            _a)), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onClick: selectionMode ? toggleSelected(selected) : handleClick },
+            _a)), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onClick: selectionMode ? toggleSelected(selected) : handleClick, "data-reltio-id": "image-actions-overlay" },
         showCheckBox && (React.createElement(CheckedIcon, { className: styles.checkedIcon, checked: selected, onClick: toggleSelected(selected) })),
         showActions && (React.createElement("div", { className: styles.actions },
             React.createElement(SmallIconButton, { onClick: onDownload, className: styles.actionButton, icon: DownloadIcon }),

package/esm/components/ImageAttributesGallery/ImageAttributesGallery.js

@@ -8,15 +8,15 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 /* eslint-disable indent */
-import React, { useEffect, useState } from 'react';
+import React, { useContext, useEffect, useState } from 'react';
 import { filter, pipe, pluck, propEq } from 'ramda';
-import { getImageAttributeOvThumbnailUrl, getImageAttributeOvUrl } from '@reltio/mdm-sdk';
+import { getImageAttributeOvThumbnailUrl, getImageAttributeOvUrl, isTempUri } from '@reltio/mdm-sdk';
 import { ImageDetailsView } from '../ImageDetailsView/ImageDetailsView';
 import { ImageGalleryDialog, Mode } from '../ImageGalleryDialog/ImageGalleryDialog';
 import { GalleryView } from './GalleryView/GalleryView';
 import { HeaderLeft } from './HeaderLeft/HeaderLeft';
 import { HeaderRight } from './HeaderRight/HeaderRight';
-import { useMdmIsViewMode } from '../../contexts';
+import { ConfigPermissionsContext, useMdmIsViewMode } from '../../contexts';
 var ImageAttributesGallery = function (_a) {
     var attributeValues = _a.attributeValues, open = _a.open, onClose = _a.onClose, currentAttributeValueUri = _a.currentAttributeValueUri, setCurrentAttributeValueUri = _a.setCurrentAttributeValueUri, attributeType = _a.attributeType, onDownload = _a.onDownload, onShareLink = _a.onShareLink, onSetAsDefault = _a.onSetAsDefault, onUpload = _a.onUpload, onDeleteAttribute = _a.onDeleteAttribute;
     var _b = useState([]), selectedItems = _b[0], setSelectedItems = _b[1];
@@ -71,19 +71,22 @@ var ImageAttributesGallery = function (_a) {
         onDeleteAttribute({ uri: id, attributeType: attributeType });
     };
     var handleDeleteSelectedItems = function () {
-        var deleteUris = isGalleryMode ? selectedItems : [currentAttributeValueUri];
+        var deleteUris = getUrisForDelete();
         deleteUris.forEach(function (uri) {
             handleDelete(uri);
         });
         if (selectedItems.length)
             setSelectedItems([]);
     };
+    var _d = useContext(ConfigPermissionsContext), canCreate = _d.canCreate, canDelete = _d.canDelete;
     var isGalleryMode = mode === Mode.GALLERY_MODE;
     var isDetailsMode = mode === Mode.DETAILS_MODE;
     var hasSelectedItems = selectedItems.length > 0;
     var isHasSelectedItemsOrDetailsMode = isDetailsMode || (isGalleryMode && hasSelectedItems);
-    var isShowDeleteButton = !isViewMode && isHasSelectedItemsOrDetailsMode;
-    var isShowUploadButton = !isViewMode && (isDetailsMode || (isGalleryMode && !hasSelectedItems));
+    var getUrisForDelete = function () { return (isGalleryMode ? selectedItems : [currentAttributeValueUri]); };
+    var areAllItemsDeletable = getUrisForDelete().every(function (uri) { return isTempUri(uri) || canDelete; });
+    var isShowDeleteButton = !isViewMode && isHasSelectedItemsOrDetailsMode && areAllItemsDeletable;
+    var isShowUploadButton = !isViewMode && canCreate && (isDetailsMode || (isGalleryMode && !hasSelectedItems));
     var headerLeft = isGalleryMode && hasSelectedItems && (React.createElement(HeaderLeft, { items: imageItems, selectedItems: selectedItems, onClearAll: handleClearAll, onSelectAll: handleSelectAll }));
     var headerRight = (React.createElement(HeaderRight, { onDelete: isShowDeleteButton ? handleDeleteSelectedItems : undefined, onDownload: isHasSelectedItemsOrDetailsMode ? handleDownloadSelectedItems : undefined, onShare: isDetailsMode ? handleSharedCurrentItem : undefined, onUpload: isShowUploadButton ? onUpload : undefined }));
     var handleClickByImage = function (id) {

package/esm/components/ImageDetailsView/MetaInfoHeader/MetaInfoHeader.js

@@ -1,4 +1,4 @@
-import React, { Fragment } from 'react';
+import React, { Fragment, useContext } from 'react';
 import i18n from 'ui-i18n';
 import classnames from 'classnames';
 import Typography from '@mui/material/Typography';
@@ -7,12 +7,14 @@ import Divider from '@mui/material/Divider';
 import MoreAttributesButton from '../../attributes/editMode/MoreAttributesButton';
 import { getMoreAttrTypes } from '../helpers';
 import { useStyles } from './styles';
+import { ConfigPermissionsContext } from '../../../contexts';
 export var MetaInfoHeader = function (_a) {
     var _b;
     var attributeType = _a.attributeType, onAddAttributes = _a.onAddAttributes, uri = _a.uri;
     var styles = useStyles();
     var moreAttrTypes = getMoreAttrTypes(attributeType);
-    var canAdd = Boolean(onAddAttributes);
+    var canCreate = useContext(ConfigPermissionsContext).canCreate;
+    var canAdd = canCreate && Boolean(onAddAttributes);
     var handleApply = function (attrTypes) {
         if (onAddAttributes) {
             onAddAttributes(attrTypes.map(function (attributeType) { return ({ attributeType: attributeType, parentUri: uri }); }));

package/esm/components/RelationEditor/RelationEditor.js

@@ -21,7 +21,7 @@ import ErrorWrapper from '../ErrorWrapper/ErrorWrapper';
 import EntitySelector from '../attributes/editMode/EntitySelector/EntitySelector';
 import AttributesList from '../attributes/editMode/AttributesList';
 import { withContext } from '../../HOCs';
-import { isHighlightedErrorType, ScrollToElementContext, useMdmAction, useMdmAuthoringItemsByEntityType, useMdmEntity, useMdmGlobalSearchRequestOptions, useMdmInitialConnection, useMdmInitialConnectionTempEntity, useMdmModifiedEntities, useMdmModifiedEntity, useMdmProfileErrors } from '../../contexts';
+import { ConfigPermissionsContextProvider, isHighlightedErrorType, ScrollToElementContext, useMdmAction, useMdmAuthoringItemsByEntityType, useMdmEntity, useMdmGlobalSearchRequestOptions, useMdmInitialConnection, useMdmInitialConnectionTempEntity, useMdmModifiedEntities, useMdmModifiedEntity, useMdmProfileErrors } from '../../contexts';
 import { useScrollToAttributeError } from '../../hooks';
 import { useStyles } from './styles';
 var areRelatedEntitiesChanged = function (initial, actual) {
@@ -169,7 +169,7 @@ var RelationEditor = function (_a) {
         React.createElement("div", { className: styles.editor },
             React.createElement(Typography, { className: styles.title }, isNew ? i18n.text('Add new item') : i18n.text('Edit item')),
             defaultRelationType === null && (React.createElement(ConnectionRelationTypeSelector, { className: styles.item, relation: connection.relation, inRelationTypes: inRelationTypes, outRelationTypes: outRelationTypes, onChange: onRelationTypeChange })),
-            Boolean(relationType) && (React.createElement(React.Fragment, null,
+            Boolean(relationType) && (React.createElement(ConfigPermissionsContextProvider, null,
                 React.createElement("div", { ref: ref, className: errorClassName },
                     React.createElement(ErrorWrapper, { errorMessage: errorMessage },
                         React.createElement(EntitySelector, { className: classnames(styles.item, (_b = {},

package/esm/components/ReltioGridLayout/ReltioGridLayout.d.ts

@@ -1,5 +1,5 @@
 import React, { ElementType } from 'react';
-import { DragOverEvent } from 'react-grid-layout';
+import { ReactGridLayoutProps } from 'react-grid-layout';
 import { ReltioGridLayoutItem } from '@reltio/mdm-sdk';
 import { ReactGridLayoutItem, ReltioGridLayoutOptions } from '../../types';
 type Props<ViewConfig = Record<string, unknown>> = {
@@ -8,10 +8,7 @@ type Props<ViewConfig = Record<string, unknown>> = {
     layoutOptions?: ReltioGridLayoutOptions;
     onLayoutChanged?: (layout: ReltioGridLayoutItem[]) => void;
     onDrop?: (layout: ReltioGridLayoutItem[], layoutItem: ReltioGridLayoutItem, e: Event) => void;
-    onDropDragOver?: (e: DragOverEvent) => {
-        w?: number;
-        h?: number;
-    } | false | undefined;
+    onDropDragOver?: ReactGridLayoutProps['onDropDragOver'];
     onRemove?: (id: string) => void;
     LayoutItem: ElementType;
     draggableHandle?: string;
@@ -22,7 +19,7 @@ type Props<ViewConfig = Record<string, unknown>> = {
         root?: string;
         item?: string;
     };
-    onResize?: (layout: ReactGridLayoutItem[], oldLayoutItem: ReactGridLayoutItem, layoutItem: ReactGridLayoutItem, placeholder: ReactGridLayoutItem) => void;
+    onResize?: ReactGridLayoutProps['onResize'];
 };
 declare const _default: React.MemoExoticComponent<{
     ({ views, layout, layoutOptions, onLayoutChanged, draggableHandle, LayoutItem, onRemove, onDrop, droppingItem, isDroppable, onDropDragOver, isStatic, classes, onResize }: Props<Record<string, unknown>>): JSX.Element;

package/esm/components/ReltioGridLayout/ReltioGridLayout.js

@@ -9,10 +9,10 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import React, { useCallback, useMemo, useRef, useState, memo } from 'react';
+import React, { useEffect, useCallback, useMemo, useRef, useState, memo } from 'react';
 import GridLayout from 'react-grid-layout';
 import ReactResizeDetector from 'react-resize-detector';
-import { pipe, ifElse, always } from 'ramda';
+import { pipe, ifElse, always, equals } from 'ramda';
 import classnames from 'classnames';
 import { alignGroupedItemsHeights, calcLayoutItemsHeight, reltioLayoutToReactGridLayout, reactGridLayoutToReltioLayout, reactGridLayoutItemToReltioLayoutItem, copyPropsFromPreviousLayout, calcHeight, getReltioLayoutItemById } from './helpers';
 import { noop } from '../../core';
@@ -26,6 +26,7 @@ var ReltioGridLayout = function (_a) {
     var _b;
     var views = _a.views, layout = _a.layout, _c = _a.layoutOptions, layoutOptions = _c === void 0 ? DEFAULT_LAYOUT_OPTIONS : _c, _d = _a.onLayoutChanged, onLayoutChanged = _d === void 0 ? noop : _d, draggableHandle = _a.draggableHandle, LayoutItem = _a.LayoutItem, onRemove = _a.onRemove, onDrop = _a.onDrop, droppingItem = _a.droppingItem, isDroppable = _a.isDroppable, onDropDragOver = _a.onDropDragOver, isStatic = _a.isStatic, classes = _a.classes, _e = _a.onResize, onResize = _e === void 0 ? noop : _e;
     var ref = useRef();
+    var shouldCompareLayout = useRef(false);
     var heightsMap = useRef({});
     var styles = useStyles();
     var _f = useState(null), resizingItemId = _f[0], setResizingItemId = _f[1];
@@ -33,7 +34,8 @@ var ReltioGridLayout = function (_a) {
     var _h = useState(0), width = _h[0], setWidth = _h[1];
     var cols = layoutOptions.cols, rowHeight = layoutOptions.rowHeight, margin = layoutOptions.margin;
     var processedLayout = useMemo(function () { return reltioLayoutToReactGridLayout(layout); }, [layout]);
-    var onReltioLayoutChanged = pipe(reactGridLayoutToReltioLayout, copyPropsFromPreviousLayout(['autosizing'], layout), ifElse(always(isStatic), alignGroupedItemsHeights(heightsMap.current), calcLayoutItemsHeight(heightsMap.current)), onLayoutChanged);
+    var convertReactLayoutToReltioLayout = pipe(reactGridLayoutToReltioLayout, copyPropsFromPreviousLayout(['autosizing'], layout), ifElse(always(isStatic), alignGroupedItemsHeights(heightsMap.current), calcLayoutItemsHeight(heightsMap.current)));
+    var onReltioLayoutChanged = pipe(convertReactLayoutToReltioLayout, onLayoutChanged);
     var handleDrop = function (layout, layoutItem, e) {
         if (onDrop && layoutItem) {
             onDrop(reactGridLayoutToReltioLayout(layout), reactGridLayoutItemToReltioLayoutItem(layoutItem), e);
@@ -46,10 +48,26 @@ var ReltioGridLayout = function (_a) {
                 var newHeight = calcHeight(height, layoutOptions);
                 if (newHeight !== heightsMap.current[layoutItemId]) {
                     heightsMap.current[layoutItemId] = newHeight;
+                    shouldCompareLayout.current = false;
                     onReltioLayoutChanged(processedLayout);
                 }
             }
         } })); };
+    useEffect(function () {
+        if (isStatic) {
+            if (shouldCompareLayout.current) {
+                var expectedLayout = convertReactLayoutToReltioLayout(processedLayout);
+                var isSameLayout = equals(reltioLayoutToReactGridLayout(expectedLayout), processedLayout);
+                if (!isSameLayout) {
+                    shouldCompareLayout.current = false;
+                    onLayoutChanged(expectedLayout);
+                }
+            }
+            else {
+                shouldCompareLayout.current = true;
+            }
+        }
+    }, [processedLayout, isStatic]);
     return (React.createElement(React.Fragment, null,
         React.createElement(ReactResizeDetector, { refreshMode: "debounce", refreshRate: 50, handleWidth: true, onResize: function (width) { return setWidth(width); } }),
         !!width && (React.createElement(GridLayout, { innerRef: ref, layout: processedLayout, cols: cols, draggableHandle: draggableHandle, autoSize: true, rowHeight: rowHeight, width: width, margin: margin, onLayoutChange: isStatic ? undefined : onReltioLayoutChanged, isResizable: !isStatic && !isFullscreenEnabled, isDraggable: !isStatic && !isFullscreenEnabled, className: classnames(classes === null || classes === void 0 ? void 0 : classes.root, styles.gridLayout, (_b = {},

package/esm/components/activityLog/activities/RelationObject/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"link" | "relationship" | "delimiter">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"link" | "delimiter" | "relationship">;

package/esm/components/attributes/OvIcon/OvIcon.d.ts

@@ -26,7 +26,7 @@ export declare const ChipWithTooltip: React.ForwardRefExoticComponent<import("pr
     variant?: import("@mui/types").OverridableStringUnion<"filled" | "outlined", import("@mui/material/Chip").ChipPropsVariantOverrides>;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
-}, "label" | "icon" | "children" | "size" | "color" | "disabled" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | "tabIndex" | "variant" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "skipFocusWhenDisabled">>;
+}, "label" | "icon" | "children" | "size" | "color" | "disabled" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | "tabIndex" | "variant" | "deleteIcon" | "avatar" | "clickable" | "onDelete" | "skipFocusWhenDisabled">>;
 type ComplexWithLabel = NestedAttributeValue | ReferenceAttributeValue;
 type Props = {
     className?: string;

package/esm/components/attributes/editMode/AttributesList/AttributesList.js

@@ -23,7 +23,7 @@ import { getMoreAttrTypes } from './helpers';
 import { PinnedAttributesContext } from '../contexts/PinnedAttributesContext';
 import { HasDeletionsContext } from '../contexts/HasDeletionsContext';
 import { withContext } from '../../../../HOCs';
-import { ScrollType, ScrollToElementContext } from '../../../../contexts';
+import { ScrollType, ScrollToElementContext, ConfigPermissionsContext } from '../../../../contexts';
 var AttributesList = function (_a) {
     var parentAttributeType = _a.parentAttributeType, attrTypes = _a.attrTypes, entity = _a.entity, parentUri = _a.parentUri, showEmptyEditors = _a.showEmptyEditors, mode = _a.mode, crosswalks = _a.crosswalks, drawLines = _a.drawLines, children = _a.children, className = _a.className, _b = _a.alwaysVisibleTypeUris, alwaysVisibleTypeUris = _b === void 0 ? ALWAYS_VISIBLE_TYPE_URIS : _b, onAddAttributes = _a.onAddAttributes, onChangeAttribute = _a.onChangeAttribute, onDeleteAttribute = _a.onDeleteAttribute, additionalControlsRenderer = _a.additionalControlsRenderer, showNonOv = _a.showNonOv, highlightAttribute = _a.highlightAttribute;
     var _c = entity.attributes, attributes = _c === void 0 ? {} : _c;
@@ -37,11 +37,14 @@ var AttributesList = function (_a) {
     useEffect(function () {
         setHasDeletionsMap({});
     }, [parentUri]);
-    var canCreateParentAttrType = useMemo(function () { return parentAttributeType && checkCanCreateAttribute({ attributeType: parentAttributeType, mode: mode }); }, [parentAttributeType, mode]);
-    var creatableAttrTypes = useMemo(function () { return getCreatableAttributeTypes(mode, attrTypes); }, [attrTypes, mode]);
+    var canCreate = useContext(ConfigPermissionsContext).canCreate;
+    var canCreateParentAttrType = useMemo(function () { return canCreate && parentAttributeType && checkCanCreateAttribute({ attributeType: parentAttributeType, mode: mode }); }, [parentAttributeType, mode, canCreate]);
+    var creatableAttrTypes = useMemo(function () { return (canCreate ? getCreatableAttributeTypes(mode, attrTypes) : []); }, [attrTypes, mode, canCreate]);
     var moreAttrTypes = getMoreAttrTypes(creatableAttrTypes, entity, showEmptyEditors, hasDeletionsMap);
     var pinnedAttributes = useContext(PinnedAttributesContext);
-    var pagersData = useMemo(function () { return getAttributesListForEditMode(attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes); }, [attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes]);
+    var pagersData = useMemo(function () {
+        return getAttributesListForEditMode(attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes, canCreate);
+    }, [attrTypes, mode, entity, showEmptyEditors, showNonOv, pinnedAttributes, canCreate]);
     var _e = useMemo(function () { return splitPagersData(alwaysVisibleTypeUris, pagersData); }, [pagersData, alwaysVisibleTypeUris]), alwaysVisiblePagersData = _e[0], regularPagersData = _e[1];
     var onAddMoreAttributes = useCallback(function (attributeTypes) {
         onAddAttributes(attributeTypes.map(function (attributeType) { return ({

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

@@ -23,7 +23,7 @@ import ArrowExpandButton from '../../../ArrowExpandButton/ArrowExpandButton';
 import ErrorWrapper from '../../../ErrorWrapper/ErrorWrapper';
 import AttributesList from '../AttributesList/AttributesList';
 import { withContext } from '../../../../HOCs';
-import { isHighlightedErrorType, ScrollToElementContext } from '../../../../contexts';
+import { isHighlightedErrorType, ScrollToElementContext, useAttributeValueConfigPermissions } from '../../../../contexts';
 import { useScrollToAttributeError } from '../../../../hooks';
 import { useStyles } from './styles';
 var ComplexAttribute = function (_a) {
@@ -45,15 +45,17 @@ var ComplexAttribute = function (_a) {
     useEffect(function () {
         setExpanded(defaultExpand);
     }, [defaultExpand]);
+    var configCanDelete = useAttributeValueConfigPermissions(attributeValue.uri).canDelete;
     var canDelete = useMemo(function () {
-        return checkCanDeleteAttribute({
-            attributeType: attributeType,
-            attributeValue: attributeValue,
-            mode: mode,
-            metadata: metadata,
-            isReltioCrosswalk: isReltioCrosswalk(crosswalks, attributeValue)
-        });
-    }, [attributeType, attributeValue, mode, metadata, crosswalks]);
+        return configCanDelete &&
+            checkCanDeleteAttribute({
+                attributeType: attributeType,
+                attributeValue: attributeValue,
+                mode: mode,
+                metadata: metadata,
+                isReltioCrosswalk: isReltioCrosswalk(crosswalks, attributeValue)
+            });
+    }, [attributeType, attributeValue, mode, metadata, crosswalks, configCanDelete]);
     var showDeleteButton = !deleted && !hideDeleteButton && !!onDeleteAttribute && canDelete;
     var onDeleteThis = function () { return onDeleteAttribute({ uri: uri, attributeType: attributeType, attributeValue: attributeValue }); };
     var hasDescendantsWithErrors = useMemo(function () { return hasAttributeDescendantsWithErrors(attributeValue, errors); }, [errors, attributeValue]);

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

@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useContext, useState } from 'react';
 import CloudUploadIcon from '@mui/icons-material/CloudUpload';
 import { generateUri, getImageAttributeOvThumbnailUrl, getImageAttributeOvUrl } from '@reltio/mdm-sdk';
 import Image from '../../../Image/Image';
@@ -7,7 +7,7 @@ import { SmallIconButton } from '../../../SmallIconButton';
 import { UploadImageDialog } from '../../../UploadImageDialog/UploadImageDialog';
 import ImageAttributesLineCommon from '../../ImageAttributesLine';
 import { DEFAULT_IMAGE_SIZE } from '../../ImageAttributesLine/constants';
-import { useMdmAction, useMdmEntity, useMdmModifiedEntityDefaultProfilePic } from '../../../../contexts';
+import { ConfigPermissionsContext, useMdmAction, useMdmEntity, useMdmModifiedEntityDefaultProfilePic } from '../../../../contexts';
 import { useStyles } from './styles';
 var defaultEntity = {};
 var ImageAttributesLine = function (_a) {
@@ -17,6 +17,7 @@ var ImageAttributesLine = function (_a) {
     var setDefaultProfilePic = useMdmAction('setDefaultProfilePicForModifiedEntity');
     var entity = useMdmEntity() || defaultEntity;
     var defaultProfilePic = useMdmModifiedEntityDefaultProfilePic(entity.uri);
+    var canCreate = useContext(ConfigPermissionsContext).canCreate;
     var toggleVisibilityUploadDialog = useCallback(function () {
         setIsVisibleUploadDialog(function (visible) { return !visible; });
     }, []);
@@ -72,10 +73,9 @@ var ImageAttributesLine = function (_a) {
         };
         return renderImage;
     };
-    return (React.createElement("div", { className: styles.root },
-        React.createElement(ImageAttributesLineCommon, { attributeValues: attributeValues, attributeType: attributeType, renderImage: renderImage, overlay: true, countFixedItems: 1, onUpload: toggleVisibilityUploadDialog, onDeleteAttribute: handleDeleteAttribute, imageSize: imageSize, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, paging: paging, parentUri: parentUri, showNonOv: showNonOv },
-            React.createElement("div", { className: styles.uploadContainer, onClick: toggleVisibilityUploadDialog },
-                React.createElement(SmallIconButton, { className: styles.uploadButton, iconClassName: styles.uploadIcon, icon: CloudUploadIcon, "data-reltio-id": "reltio-upload-image-button" }))),
+    return (React.createElement("div", { className: styles.root, "data-reltio-id": "image-line-edit-mode" },
+        React.createElement(ImageAttributesLineCommon, { attributeValues: attributeValues, attributeType: attributeType, renderImage: renderImage, overlay: true, countFixedItems: canCreate ? 1 : 0, onUpload: toggleVisibilityUploadDialog, onDeleteAttribute: handleDeleteAttribute, imageSize: imageSize, requestNextPageOfAttributeValues: requestNextPageOfAttributeValues, paging: paging, parentUri: parentUri, showNonOv: showNonOv }, canCreate && (React.createElement("div", { className: styles.uploadContainer, onClick: toggleVisibilityUploadDialog },
+            React.createElement(SmallIconButton, { className: styles.uploadButton, iconClassName: styles.uploadIcon, icon: CloudUploadIcon, "data-reltio-id": "reltio-upload-image-button" })))),
         React.createElement(UploadImageDialog, { open: isVisibleUploadDialog, onUpload: handleAddAttributes, onClose: toggleVisibilityUploadDialog })));
 };
 export default ImageAttributesLine;

package/esm/components/attributes/editMode/ReferenceAttribute/ReferenceAttribute.js

@@ -29,7 +29,7 @@ import ComplexAttribute from '../ComplexAttribute/ComplexAttribute';
 import EntitySelector from '../EntitySelector/EntitySelector';
 import { ErrorWrapper } from '../../../index';
 import { withContext } from '../../../../HOCs';
-import { isHighlightedErrorType, ScrollToElementContext, useMdmAction, useMdmGlobalSearchRequestOptions, useMdmMetadata, useMdmModifiedEntity } from '../../../../contexts';
+import { isHighlightedErrorType, ScrollToElementContext, useAttributeValueConfigPermissions, useMdmAction, useMdmGlobalSearchRequestOptions, useMdmMetadata, useMdmModifiedEntity } from '../../../../contexts';
 import { useScrollToAttributeError } from '../../../../hooks';
 import { useStyles } from './styles';
 var ReferenceAttribute = function (props) {
@@ -104,15 +104,17 @@ var ReferenceAttribute = function (props) {
         onChangeEntity(newEntity);
         entityCreated(newEntity);
     }, [newEntityAttrTypesSelectionStrategy, mode, referencedEntityType, metadata, onChangeEntity, entityCreated]);
+    var _c = useAttributeValueConfigPermissions(attributeValue.uri), configCanCreate = _c.canCreate, configCanUpdate = _c.canUpdate;
     var canChangeReferencedEntity = useMemo(function () {
-        return checkCanEditAttribute({
-            attributeType: attributeType,
-            attributeValue: attributeValue,
-            mode: mode,
-            isReltioCrosswalk: isReltioCrosswalk(crosswalks, attributeValue)
-        });
-    }, [attributeType, attributeValue, mode, crosswalks]);
-    var canCreateReferencedEntity = useMemo(function () { return checkMetadataForCreate(mode, referencedEntityType); }, [mode, referencedEntityType]);
+        return configCanUpdate &&
+            checkCanEditAttribute({
+                attributeType: attributeType,
+                attributeValue: attributeValue,
+                mode: mode,
+                isReltioCrosswalk: isReltioCrosswalk(crosswalks, attributeValue)
+            });
+    }, [attributeType, attributeValue, mode, crosswalks, configCanUpdate]);
+    var canCreateReferencedEntity = useMemo(function () { return configCanCreate && checkMetadataForCreate(mode, referencedEntityType); }, [mode, referencedEntityType, configCanCreate]);
     var errorMessage = getErrorMessage(referencedEntityMissedError);
     return (React.createElement(ComplexAttribute, __assign({}, ownProps, { label: getLabel(label), attributeTypesList: editableAttrTypes, crosswalks: allCrosswalks, metadata: metadata }),
         React.createElement("div", { ref: ref, className: errorClassName },

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

@@ -28,7 +28,7 @@ import AddIcon from '@mui/icons-material/Add';
 import DeleteIcon from '@mui/icons-material/Delete';
 import Typography from '@mui/material/Typography';
 import i18n from 'ui-i18n';
-import { AttributeErrorType, AttributeTypeType, attributeUriToSearchUri, checkCanCreateAttribute, checkCanDeleteAttribute, checkCanEditAttribute, ErrorType, getAttributeValue, getAttrDataTypeDefinition, getErrorId, getErrorMessage, getErrorType, isDependentLookupAttrType, isEditableMode as checkIsEditableMode, ModeType, SimpleAttributeValueType } from '@reltio/mdm-sdk';
+import { AttributeErrorType, AttributeTypeType, attributeUriToSearchUri, ErrorType, getAttributeValue, getAttrDataTypeDefinition, getErrorId, getErrorMessage, getErrorType, isDependentLookupAttrType, isEditableMode as checkIsEditableMode, ModeType, SimpleAttributeValueType } from '@reltio/mdm-sdk';
 import DataTypeValue from '../../../DataTypeValue/DataTypeValue';
 import DataTypeValueEditor from '../../../editors/DataTypeValueEditor/DataTypeValueEditor';
 import ErrorWrapper from '../../../ErrorWrapper/ErrorWrapper';
@@ -39,6 +39,7 @@ import { withContext } from '../../../../HOCs';
 import { isHighlightedErrorType, ScrollToElementContext, DependentLookupAutopopulationContext, ProfilePerspectiveViewContext, useMdmDependentLookupEditorContext } from '../../../../contexts';
 import { useScrollToAttributeError } from '../../../../hooks';
 import { useAutopopulationContextValue } from './useAutopopulationContextValue';
+import { useAttributeValuePermissions } from './useAttributeValuePermissions';
 import { useStyles } from './styles';
 var AsyncMountPlaceholder = function () {
     var styles = useStyles();
@@ -51,13 +52,16 @@ var SimpleAttributeEditor = function (_a) {
     var deleted = state === 'deleted';
     var edited = state === 'edited';
     var isEditableMode = checkIsEditableMode(mode);
-    var canCreate = checkCanCreateAttribute({ attributeType: attributeType, mode: mode });
-    var canEdit = checkCanEditAttribute({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
-    var canDelete = checkCanDeleteAttribute({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
+    var _e = useAttributeValuePermissions({
+        attributeValue: attributeValue,
+        attributeType: attributeType,
+        mode: mode,
+        isReltioCrosswalk: isReltioCrosswalk
+    }), canCreate = _e.canCreate, canEdit = _e.canEdit, canDelete = _e.canDelete;
     var showToEdit = canEdit && isEditableMode;
     var errorMessage = getErrorMessage(ownError);
     var dependentLookupEditorContext = useMdmDependentLookupEditorContext(attributeValue, attributeType);
-    var _e = useScrollToAttributeError({ highlightedError: highlightedError, isSimple: true }), ref = _e.ref, errorClassName = _e.errorClassName;
+    var _f = useScrollToAttributeError({ highlightedError: highlightedError, isSimple: true }), ref = _f.ref, errorClassName = _f.errorClassName;
     useEffect(function () {
         // when editor is empty but has default lookup code, onChangeAttribute will be called by useLookupsResolver
         if (isEmptyEditor && isDependentLookupAttrType(attributeType) && !has('lookupCode', attributeValue)) {
@@ -102,7 +106,7 @@ var SimpleAttributeEditor = function (_a) {
                 "(",
                 i18n.text('edited'),
                 ")")),
-            showAddButton && (React.createElement(SmallIconButton, { icon: AddIcon, onClick: onAddOneMore, size: "L", className: classnames(styles.addButton, styles.button) })),
+            showAddButton && (React.createElement(SmallIconButton, { icon: AddIcon, onClick: onAddOneMore, size: "L", className: classnames(styles.addButton, styles.button), "data-reltio-id": "reltio-add-one-more-simple-attribute-button" })),
             additionalControlsRenderer && additionalControlsRenderer({ attributeType: attributeType, attributeValue: attributeValue }),
             showDeleteButton && (React.createElement(SmallIconButton, { className: styles.button, icon: DeleteIcon, onClick: onDelete, size: "L", "data-reltio-id": "reltio-delete-simple-attribute-button" })))));
 };

package/esm/components/attributes/editMode/SimpleAttributeEditor/styles.js

@@ -20,7 +20,8 @@ export var useStyles = makeStyles(function (theme) { return ({
     'editor-read-only-value': {
         marginLeft: '12px',
         display: 'flex',
-        alignItems: 'center'
+        alignItems: 'center',
+        color: theme.palette.text.primary
     },
     'editor-actions': {
         display: 'flex',

package/esm/components/attributes/editMode/SimpleAttributeEditor/useAttributeValuePermissions.d.ts

@@ -0,0 +1,13 @@
+import { AttributeType, Mode, SimpleAttributeValue } from '@reltio/mdm-sdk';
+type Props = {
+    attributeType: AttributeType;
+    attributeValue: SimpleAttributeValue;
+    isReltioCrosswalk: boolean;
+    mode: Mode;
+};
+export declare const useAttributeValuePermissions: ({ attributeType, attributeValue, isReltioCrosswalk, mode }: Props) => {
+    canCreate: boolean;
+    canEdit: any;
+    canDelete: any;
+};
+export {};

package/esm/components/attributes/editMode/SimpleAttributeEditor/useAttributeValuePermissions.js

@@ -0,0 +1,10 @@
+import { checkCanCreateAttribute, checkCanDeleteAttribute, checkCanEditAttribute } from '@reltio/mdm-sdk';
+import { useAttributeValueConfigPermissions } from '../../../../contexts';
+export var useAttributeValuePermissions = function (_a) {
+    var attributeType = _a.attributeType, attributeValue = _a.attributeValue, isReltioCrosswalk = _a.isReltioCrosswalk, mode = _a.mode;
+    var _b = useAttributeValueConfigPermissions(attributeValue.uri), configCanCreate = _b.canCreate, configCanUpdate = _b.canUpdate, configCanDelete = _b.canDelete;
+    var canCreate = configCanCreate && checkCanCreateAttribute({ attributeType: attributeType, mode: mode });
+    var canEdit = configCanUpdate && checkCanEditAttribute({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
+    var canDelete = configCanDelete && checkCanDeleteAttribute({ attributeType: attributeType, attributeValue: attributeValue, mode: mode, isReltioCrosswalk: isReltioCrosswalk });
+    return { canCreate: canCreate, canEdit: canEdit, canDelete: canDelete };
+};

package/esm/components/workflow/components/WorkflowComments/styles.d.ts

@@ -1,4 +1,4 @@
 export declare const useCommentStyles: (props?: any) => import("@mui/styles").ClassNameMap<"date" | "icon" | "comment" | "text" | "info" | "avatar" | "firstLine" | "author">;
-export declare const useCollapsedCommentsStyles: (props?: any) => import("@mui/styles").ClassNameMap<"delimiter" | "circleButton">;
+export declare const useCollapsedCommentsStyles: (props?: any) => import("@mui/styles").ClassNameMap<"circleButton" | "delimiter">;
 export declare const useWorkflowStyles: (props?: any) => import("@mui/styles").ClassNameMap<"title" | "container" | "commentsContainer" | "filledInputRoot" | "modeSwitcherWrapper" | "sendButton">;
 export declare const useExpandedComments: (props?: any) => import("@mui/styles").ClassNameMap<"messageContainer">;

package/esm/contexts/ConfigPermissionsContext/index.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { ViewExtension } from '@reltio/mdm-sdk';
+type ConfigPermissionsContextValue = {
+    canCreate: boolean;
+    canUpdate: boolean;
+    canDelete: boolean;
+};
+declare const ConfigPermissionsContext: React.Context<ConfigPermissionsContextValue>;
+type Props = {
+    children: React.ReactNode;
+    view?: ViewExtension;
+};
+declare const ConfigPermissionsContextProvider: ({ children, view }: Props) => JSX.Element;
+declare const useAttributeValueConfigPermissions: (attributeValueUri: string) => {
+    canCreate: boolean;
+    canUpdate: any;
+    canDelete: any;
+};
+export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttributeValueConfigPermissions };

package/esm/contexts/ConfigPermissionsContext/index.js

@@ -0,0 +1,34 @@
+import React, { useContext, useMemo } from 'react';
+import { useConfigPermissions } from '../../hooks';
+import { isTempUri } from '@reltio/mdm-sdk';
+var defaultValue = {
+    canCreate: true,
+    canUpdate: true,
+    canDelete: true
+};
+var ConfigPermissionsContext = React.createContext(defaultValue);
+ConfigPermissionsContext.displayName = 'ConfigPermissionsContext';
+var ConfigPermissionsContextProvider = function (_a) {
+    var children = _a.children, view = _a.view;
+    var _b = useConfigPermissions(), canCreate = _b.canCreate, canDelete = _b.canDelete, canUpdate = _b.canUpdate;
+    var value = useMemo(function () {
+        return view
+            ? {
+                canCreate: canCreate(view),
+                canUpdate: canUpdate(view),
+                canDelete: canDelete(view)
+            }
+            : defaultValue;
+    }, [view, canCreate, canUpdate, canDelete]);
+    return React.createElement(ConfigPermissionsContext.Provider, { value: value }, children);
+};
+var useAttributeValueConfigPermissions = function (attributeValueUri) {
+    var _a = useContext(ConfigPermissionsContext), canCreate = _a.canCreate, canUpdate = _a.canUpdate, canDelete = _a.canDelete;
+    var isNew = isTempUri(attributeValueUri);
+    return useMemo(function () { return ({
+        canCreate: canCreate,
+        canUpdate: isNew || canUpdate,
+        canDelete: isNew || canDelete
+    }); }, [isNew, canCreate, canUpdate, canDelete]);
+};
+export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttributeValueConfigPermissions };

package/esm/contexts/index.d.ts

@@ -31,4 +31,5 @@ export { FeaturesContext } from './FeaturesContext';
 export { DependentLookupAutopopulationContext } from './DependentLookupAutopopulationContext';
 export { PageRequestsAbortingContext } from './PageRequestsAbortingContext';
 export { ActionsHookProvider, useActionsHook } from './ActionsHookContext';
+export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttributeValueConfigPermissions } from './ConfigPermissionsContext';
 export * from './MdmModuleContext';

package/esm/contexts/index.js

@@ -31,4 +31,5 @@ export { FeaturesContext } from './FeaturesContext';
 export { DependentLookupAutopopulationContext } from './DependentLookupAutopopulationContext';
 export { PageRequestsAbortingContext } from './PageRequestsAbortingContext';
 export { ActionsHookProvider, useActionsHook } from './ActionsHookContext';
+export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttributeValueConfigPermissions } from './ConfigPermissionsContext';
 export * from './MdmModuleContext';

package/esm/types/index.d.ts

@@ -1,17 +1,7 @@
 import React from 'react';
 import { AttributeType, SearchFilter, SearchOperator } from '@reltio/mdm-sdk';
-export type ReactGridLayoutItem = {
-    i: string;
-    x: number;
-    y: number;
-    w: number;
-    h: number;
-    minW?: number;
-    minH?: number;
-    maxW?: number;
-    maxH?: number;
-    static?: boolean;
-};
+import { Layout as LayoutItem } from 'react-grid-layout';
+export type ReactGridLayoutItem = LayoutItem;
 export type ReltioGridLayoutOptions = {
     cols: number;
     rowHeight: number;

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.1732",
+  "version": "1.4.1734",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "./cjs/index.js",
   "module": "./esm/index.js",
   "dependencies": {
     "@fluentui/react-context-selector": "^9.1.26",
     "@react-google-maps/api": "2.7.0",
-    "@reltio/mdm-sdk": "^1.4.1717",
+    "@reltio/mdm-sdk": "^1.4.1718",
     "classnames": "^2.2.5",
     "d3-cloud": "^1.2.5",
     "d3-geo": "^2.0.1",