@reltio/components 1.4.1638 → 1.4.1640

package/esm/components/ConnectionEditor/ConnectionEditor.js

@@ -12,8 +12,6 @@ var __assign = (this && this.__assign) || function () {
 import { useStyles } from './styles';
 import { useDidUpdateEffect } from '../../hooks';
 import React, { useCallback, useEffect, useMemo } from 'react';
-import { useSelector } from 'react-redux';
-import mdmModule from '@reltio/mdm-module';
 import { Directions, getActivenessAttributes, getSuitableEntityTypeUrisForRelationTypes, getDefaultRelationTypeObject, getLabel, getRelationAttributesList, getRelationType, isAvailableRelationBetweenEntities, ModeTypes } from '@reltio/mdm-sdk';
 import AttributesList from '../attributes/editMode/AttributesList';
 import classnames from 'classnames';
@@ -21,6 +19,7 @@ import { uniq } from 'ramda';
 import ConnectionRelationTypeSelector from '../ConnectionRelationTypeSelector/ConnectionRelationTypeSelector';
 import ErrorWrapper from '../ErrorWrapper/ErrorWrapper';
 import EntitySelector from '../attributes/editMode/EntitySelector/EntitySelector';
+import { useMdmGlobalSearchRequestOptions, useMdmMetadata } from '../../contexts';
 export var ConnectionEditor = function (_a) {
     var _b;
     var connection = _a.connection, relatedEntity = _a.relatedEntity, _c = _a.inRelationTypes, inRelationTypes = _c === void 0 ? [] : _c, _d = _a.outRelationTypes, outRelationTypes = _d === void 0 ? [] : _d, showEmptyEditors = _a.showEmptyEditors, entityErrorMessage = _a.entityErrorMessage, onChangeAttribute = _a.onChangeAttribute, onRemoveAttribute = _a.onRemoveAttribute, onAddAttributes = _a.onAddAttributes, onChangeRelationType = _a.onChangeRelationType, onChangeEntity = _a.onChangeEntity;
@@ -28,7 +27,8 @@ export var ConnectionEditor = function (_a) {
     var relation = connection.relation, entity = connection.entity;
     var _e = relation || {}, attributes = _e.attributes, relationUri = _e.uri, _f = _e.type, relationTypeUri = _f === void 0 ? '' : _f, direction = _e.direction;
     var isRelationTypeSelected = Boolean(relationTypeUri);
-    var metadata = useSelector(mdmModule.selectors.getMetadata);
+    var metadata = useMdmMetadata();
+    var globalSearchRequestOptions = useMdmGlobalSearchRequestOptions(['ovOnly']);
     var attributeListEntity = useMemo(function () {
         return relation && __assign({ attributes: attributes }, getActivenessAttributes(relation));
     }, [relation, attributes]);
@@ -40,9 +40,6 @@ export var ConnectionEditor = function (_a) {
             ])
             : uniq(getSuitableEntityTypeUrisForRelationTypes(true, metadata, outRelationTypes).concat(getSuitableEntityTypeUrisForRelationTypes(false, metadata, inRelationTypes)));
     }, [isRelationTypeSelected, relationTypeUri, metadata, inRelationTypes, outRelationTypes]);
-    var globalSearchRequestOptions = useSelector(function (state) {
-        return mdmModule.selectors.getGlobalSearchRequestOptions(state, ['ovOnly']);
-    });
     var selectorCompatibleRelation = useMemo(function () {
         return relation && {
             relationType: relation.type,

package/esm/components/DataTenantBadge/DataTenantBadge.js

@@ -1,20 +1,22 @@
 import React from 'react';
 import classnames from 'classnames';
-import { useSelector } from 'react-redux';
 import { propEq, toUpper, slice, pipe, defaultTo, find, propOr, startsWith, ifElse } from 'ramda';
-import mdmModule from '@reltio/mdm-module';
 import Typography from '@mui/material/Typography';
 import Tooltip from '@mui/material/Tooltip';
+import { useMdmDataTenants } from '../../contexts';
 import { useStyles } from './styles';
 var addDataTenantPrefix = function (label) { return "DT:".concat(slice(0, 1, label)); };
 export var DataTenantBadge = function (_a) {
     var dataTenantId = _a.dataTenantId, className = _a.className;
     var styles = useStyles({ dataTenantId: dataTenantId });
-    var dataTenants = useSelector(mdmModule.selectors.getDataTenants);
+    var dataTenants = useMdmDataTenants();
     var dataTenant = pipe(defaultTo([]), find(propEq('id', dataTenantId)))(dataTenants);
     var label = pipe(propOr('', 'label'), toUpper, ifElse(startsWith('DT:'), slice(0, 4), addDataTenantPrefix))(dataTenant);
     var content = (React.createElement("div", { className: classnames(styles.root, className) },
         React.createElement(Typography, { variant: "body2" }, label)));
     var showTooltip = !!(dataTenant === null || dataTenant === void 0 ? void 0 : dataTenant.label);
-    return showTooltip ? React.createElement(Tooltip, { title: dataTenant.label }, content) : content;
+    if (!showTooltip) {
+        return content;
+    }
+    return (React.createElement(Tooltip, { "data-reltio-id": "reltio-data-tenant-bage-tooltip", title: dataTenant.label }, content));
 };

package/esm/components/DataTypeValue/DataTypeValue.js

@@ -1,18 +1,17 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import moment from 'moment';
-import mdm from '@reltio/mdm-module';
 import { formatDataTypeValue, isAttributeValueLink, addProtocolToLink } from '@reltio/mdm-sdk';
-import { useSelector } from 'react-redux';
 import Link from '@mui/material/Link';
 import SearchHighlighter from '../SearchHighlighter/SearchHighlighter';
+import { useMdmAttributePresentations, useMdmDateMask, useMdmDateTimeMask } from '../../contexts';
 var DataTypeValue = function (_a) {
     var _b = _a.value, value = _b === void 0 ? null : _b, dataTypeDefinition = _a.dataTypeDefinition, _c = _a.rich, rich = _c === void 0 ? true : _c;
-    var attributePresentations = useSelector(mdm.selectors.getAttributePresentations);
     var localeDateFormat = moment.localeData().longDateFormat('L');
     var localeTimeFormat = moment.localeData().longDateFormat('LTS');
-    var dateMask = useSelector(mdm.selectors.getDateMask) || localeDateFormat;
-    var dateTimeMask = useSelector(mdm.selectors.getDateTimeMask) || localeDateFormat + ' ' + localeTimeFormat;
+    var attributePresentations = useMdmAttributePresentations();
+    var dateMask = useMdmDateMask() || localeDateFormat;
+    var dateTimeMask = useMdmDateTimeMask() || localeDateFormat + ' ' + localeTimeFormat;
     var formattedValue = formatDataTypeValue({ attributePresentations: attributePresentations, dataTypeDefinition: dataTypeDefinition, dateMask: dateMask, dateTimeMask: dateTimeMask }, value);
     return rich && isAttributeValueLink(dataTypeDefinition, value) ? (React.createElement(Link, { target: "_blank", href: addProtocolToLink(formattedValue), underline: "none" },
         React.createElement(SearchHighlighter, { text: formattedValue }))) : (React.createElement(SearchHighlighter, { text: formattedValue }));

package/esm/components/EntityAvatar/EntityAvatar.js

@@ -1,14 +1,13 @@
 import React from 'react';
-import { useSelector } from 'react-redux';
 import classnames from 'classnames';
+import { getEntityImage, getEntityTypeImage, getAbsoluteImageUrl, svg2Url } from '@reltio/mdm-sdk';
 import Avatar from '@mui/material/Avatar';
 import { DEFAULT_PROFILE_IMAGE } from './no-photo.svg';
-import { getEntityImage, getEntityTypeImage, getAbsoluteImageUrl, svg2Url } from '@reltio/mdm-sdk';
-import mdmModule from '@reltio/mdm-module';
+import { useMdmAbsoluteImagePath, useMdmMetadata } from '../../contexts';
 var EntityAvatar = function (_a) {
     var entity = _a.entity, avatarClassName = _a.avatarClassName, imageClassName = _a.imageClassName;
-    var metadata = useSelector(mdmModule.selectors.getMetadata);
-    var absoluteImagePath = useSelector(mdmModule.selectors.getAbsoluteImagePath) || '';
+    var metadata = useMdmMetadata();
+    var absoluteImagePath = useMdmAbsoluteImagePath() || '';
     var entityImageSource = getEntityImage(metadata, absoluteImagePath, entity);
     var fallbackImage = getAbsoluteImageUrl(absoluteImagePath, getEntityTypeImage(metadata, entity.type));
     var onImageLoadFail = function (e) {

package/esm/components/EntityTypeBadge/EntityTypeBadge.js

@@ -1,17 +1,15 @@
 import React from 'react';
-import { useSelector } from 'react-redux';
 import classnames from 'classnames';
-import Typography from '@mui/material/Typography';
 import { getEntityType, getEntityTypeLabel, getPropWithInheritance, theme, utils } from '@reltio/mdm-sdk';
-import mdmModule from '@reltio/mdm-module';
+import Typography from '@mui/material/Typography';
 import ExpandedValueTooltip from '../ExpandedValueTooltip/ExpandedValueTooltip';
+import { useMdmMetadata } from '../../contexts';
 import useStyles from './styles';
 var EntityTypeBadge = function (_a) {
     var entity = _a.entity, className = _a.className, _b = _a.size, size = _b === void 0 ? 'small' : _b;
     var styles = useStyles();
-    var metadata = useSelector(mdmModule.selectors.getMetadata);
-    var entityTypeUri = entity.type;
-    var entityType = getEntityType(metadata, entityTypeUri);
+    var metadata = useMdmMetadata();
+    var entityType = getEntityType(metadata, entity.type);
     var color = entityType ? getPropWithInheritance(metadata, entityType, 'typeColor') : null;
     var entityTypeColor = color || theme.palette.primary.main;
     var entityTypeLabel = getEntityTypeLabel(metadata, entity);

package/esm/components/EntityTypeIcon/EntityTypeIcon.js

@@ -10,12 +10,11 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import React from 'react';
-import { useSelector } from 'react-redux';
-import mdmModule from '@reltio/mdm-module';
 import RC_EntityTypeIcon from 'react-components/dist/EntityTypeIcon/EntityTypeIcon';
+import { useMdmAbsoluteImagePath } from '../../contexts';
 var ensureSlashEnding = function (str) { return (str.endsWith('/') ? str : str + '/'); };
 var EntityTypeIcon = function (props) {
-    var absoluteImagePath = useSelector(mdmModule.selectors.getAbsoluteImagePath) || '';
+    var absoluteImagePath = useMdmAbsoluteImagePath() || '';
     return React.createElement(RC_EntityTypeIcon, __assign({}, props, { storagePath: ensureSlashEnding(absoluteImagePath) }));
 };
 export default EntityTypeIcon;

package/esm/components/EntityUriLink/EntityUriLink.js

@@ -21,19 +21,17 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef, useCallback, useContext } from 'react';
-import { useSelector, useDispatch } from 'react-redux';
-import { UrlGeneratorsContext, ViewIdContext } from '../../contexts';
-import mdmModule, { ui } from '@reltio/mdm-module';
+import { ViewIdContext, UrlGeneratorsContext, useMdmUiPath, useMdmAction } from '../../contexts';
 var EntityUriLink = forwardRef(function (_a, ref) {
     var value = _a.value, children = _a.children, screen = _a.screen, className = _a.className, otherProps = __rest(_a, ["value", "children", "screen", "className"]);
-    var dispatch = useDispatch();
     var viewId = useContext(ViewIdContext);
     var generateEntityUrl = useContext(UrlGeneratorsContext).generateEntityUrl;
-    var uiPath = useSelector(mdmModule.selectors.getUIPath);
+    var openEntity = useMdmAction('openEntity');
+    var uiPath = useMdmUiPath();
     var generateEntityUrlByUri = function (uri) { return generateEntityUrl({ uiPath: uiPath, uri: uri, screen: screen }); };
     var onClick = useCallback(function () {
-        dispatch(ui.actions.openEntity({ uri: value, viewId: viewId, screen: screen }));
-    }, [viewId, value, dispatch, screen]);
+        openEntity({ uri: value, viewId: viewId, screen: screen });
+    }, [viewId, value, openEntity, screen]);
     return (React.createElement("a", __assign({ ref: ref, href: generateEntityUrlByUri(value), onClick: function (e) {
             onClick();
             e.stopPropagation();

package/esm/components/ErrorPopup/ErrorPopup.d.ts

@@ -1,9 +1,14 @@
+/// <reference types="react" />
+type AddError = (error: {
+    title: string;
+    message: string;
+}) => void;
+type Props = {
+    showErrorFromStore?: boolean;
+    [key: string]: unknown;
+};
+declare const ErrorPopup: {
+    ({ showErrorFromStore, ...props }: Props): JSX.Element;
+    addError: AddError;
+};
 export default ErrorPopup;
-declare function ErrorPopup(props: any): JSX.Element;
-declare namespace ErrorPopup {
-    namespace propTypes {
-        const showErrorFromStore: PropTypes.Requireable<boolean>;
-    }
-    const addError: any;
-}
-import PropTypes from 'prop-types';

package/esm/components/ErrorPopup/ErrorPopup.js

@@ -9,35 +9,40 @@ var __assign = (this && this.__assign) || function () {
     };
     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;
+};
 import React, { useEffect } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
-import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { path } from 'ramda';
 import i18n from 'ui-i18n';
 import Portal from '@mui/material/Portal';
 import RCErrorPopup from 'react-components/dist/ErrorPopup/ErrorPopup';
-import mdmModule, { ui } from '@reltio/mdm-module';
+import { useMdmAction, useMdmAutoCloseInterval, useMdmUiError } from '../../contexts';
 import { useStyles } from './styles';
-var ErrorPopup = function (props) {
+var addError = RCErrorPopup.addError;
+var ErrorPopup = function (_a) {
+    var showErrorFromStore = _a.showErrorFromStore, props = __rest(_a, ["showErrorFromStore"]);
     var styles = useStyles();
-    var autoCloseInterval = useSelector(mdmModule.selectors.getAutoCloseInterval);
-    var uiError = useSelector(mdmModule.selectors.getUiError);
-    var dispatch = useDispatch();
+    var errorSet = useMdmAction('errorSet');
+    var autoCloseInterval = useMdmAutoCloseInterval();
+    var uiError = useMdmUiError();
     useEffect(function () {
-        if (uiError && props.showErrorFromStore) {
-            ErrorPopup.addError({
-                title: i18n.text('Error'),
-                message: uiError
-            });
-            dispatch(ui.actions.errorSet(null));
+        if (uiError && showErrorFromStore) {
+            ErrorPopup.addError({ title: i18n.text('Error'), message: uiError });
+            errorSet(null);
         }
-    }, [dispatch, uiError, props.showErrorFromStore]);
+    }, [errorSet, uiError, showErrorFromStore]);
     return (React.createElement(Portal, { container: document.body },
         React.createElement(RCErrorPopup, __assign({ classes: { errorBlock: classnames(styles.errorBlock, path(['classes', 'errorBlock'], props)) }, autoCloseInterval: autoCloseInterval }, props))));
 };
-ErrorPopup.propTypes = {
-    showErrorFromStore: PropTypes.bool
-};
-ErrorPopup.addError = RCErrorPopup.addError;
+ErrorPopup.addError = addError;
 export default ErrorPopup;

package/esm/components/ErrorPopup/styles.d.ts

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

package/esm/components/HierarchyNodeTitle/HierarchyNodeTitle.js

@@ -1,26 +1,24 @@
 import React, { useCallback, useContext } from 'react';
 import classnames from 'classnames';
-import { useSelector, useDispatch } from 'react-redux';
-import mdm, { ui } from '@reltio/mdm-module';
 import Link from '../Link/Link';
 import Popper from '../Popper/Popper';
 import ProfileCard from '../ProfileCard/ProfileCard';
-import { UrlGeneratorsContext } from '../../contexts';
+import { UrlGeneratorsContext, useMdmAction, useMdmUiPath } from '../../contexts';
 import { useEntityDetails } from './hooks/useEntityDetails';
 import { useStyles } from './styles';
 export var HierarchyNodeTitle = function (_a) {
     var _b;
     var title = _a.title, isSelected = _a.isSelected, entityUri = _a.entityUri, viewId = _a.viewId, anchorEl = _a.anchorEl, _c = _a.withEntityDetails, withEntityDetails = _c === void 0 ? true : _c;
     var styles = useStyles();
-    var dispatch = useDispatch();
-    var uiPath = useSelector(mdm.selectors.getUIPath);
     var generateEntityUrl = useContext(UrlGeneratorsContext).generateEntityUrl;
+    var openEntity = useMdmAction('openEntity');
+    var uiPath = useMdmUiPath();
     var _d = useEntityDetails(entityUri), isLoading = _d.isLoading, entityDetails = _d.entityDetails, showEntityDetails = _d.showEntityDetails, hideEntityDetails = _d.hideEntityDetails;
     var link = generateEntityUrl({ uiPath: uiPath, uri: entityUri });
     var showPopper = Boolean(anchorEl) && (Boolean(entityDetails) || isLoading);
     var handleClick = useCallback(function () {
-        dispatch(ui.actions.openEntity({ uri: entityUri, viewId: viewId }));
-    }, [dispatch, entityUri, viewId]);
+        openEntity({ uri: entityUri, viewId: viewId });
+    }, [openEntity, entityUri, viewId]);
     return (React.createElement(React.Fragment, null,
         React.createElement("span", { "data-reltio-id": "reltio-hierarchy-node-title", className: classnames(styles.link, (_b = {}, _b[styles.selected] = isSelected, _b)), onMouseEnter: withEntityDetails ? showEntityDetails : undefined, onMouseLeave: withEntityDetails ? hideEntityDetails : undefined },
             React.createElement(Link, { to: link, onClick: handleClick }, title)),

package/esm/components/ImageAttributesGallery/ImageAttributesGallery.js

@@ -9,8 +9,6 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 /* eslint-disable indent */
 import React, { useEffect, useState } from 'react';
-import { useSelector } from 'react-redux';
-import mdm from '@reltio/mdm-module';
 import { filter, pipe, pluck, propEq } from 'ramda';
 import { getImageAttributeOvThumbnailUrl, getImageAttributeOvUrl } from '@reltio/mdm-sdk';
 import { ImageDetailsView } from '../ImageDetailsView/ImageDetailsView';
@@ -18,11 +16,12 @@ import { ImageGalleryDialog, Mode } from '../ImageGalleryDialog/ImageGalleryDial
 import { GalleryView } from './GalleryView/GalleryView';
 import { HeaderLeft } from './HeaderLeft/HeaderLeft';
 import { HeaderRight } from './HeaderRight/HeaderRight';
+import { 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];
     var _c = useState(Mode.GALLERY_MODE), mode = _c[0], setMode = _c[1];
-    var isViewMode = useSelector(mdm.selectors.getIsViewMode);
+    var isViewMode = useMdmIsViewMode();
     useEffect(function () {
         setMode(currentAttributeValueUri ? Mode.DETAILS_MODE : Mode.GALLERY_MODE);
     }, [currentAttributeValueUri]);

package/esm/components/ImageDetailsView/ImageDetailsViewSidebar/ImageDetailsViewSidebar.d.ts

@@ -1,10 +1,5 @@
 /// <reference types="react" />
 import { AttributeType, ImageAttributeValue } from '@reltio/mdm-sdk';
-export type ImageAttributeFieldsOrder = {
-    order?: string[];
-    excludeNames?: string[];
-    includeNames?: string[];
-};
 type Props = {
     className?: string;
     attributeValue: ImageAttributeValue;

package/esm/components/ImageDetailsView/ImageDetailsViewSidebar/ImageDetailsViewSidebar.js

@@ -1,24 +1,23 @@
 import React, { useCallback, useEffect, useState } from 'react';
-import { useSelector } from 'react-redux';
 import i18n from 'ui-i18n';
 import Box from '@mui/material/Box';
 import Checkbox from '@mui/material/Checkbox';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import Typography from '@mui/material/Typography';
-import mdm from '@reltio/mdm-module';
 import classnames from 'classnames';
 import { MetaInfo } from '../MetaInfo/MetaInfo';
+import { useMdmEntity, useMdmImageAttributesFieldsOrder, useMdmIsViewMode, useMdmModifiedEntity } from '../../../contexts';
 import { useStyles } from './styles';
 export var ImageDetailsViewSidebar = function (_a) {
     var className = _a.className, attributeValue = _a.attributeValue, handleSetAsDefault = _a.handleSetAsDefault, attributeType = _a.attributeType;
     var styles = useStyles();
-    var entity = useSelector(mdm.selectors.getEntity) || {};
-    var modifiedEntity = useSelector(function (state) { return mdm.selectors.getModifiedEntity(state, entity === null || entity === void 0 ? void 0 : entity.uri); }) || {};
-    var isViewMode = useSelector(mdm.selectors.getIsViewMode);
+    var _b = useState(false), isDefault = _b[0], setIsDefault = _b[1];
+    var entity = useMdmEntity() || {};
+    var modifiedEntity = useMdmModifiedEntity(entity === null || entity === void 0 ? void 0 : entity.uri) || {};
+    var isViewMode = useMdmIsViewMode();
+    var imageAttributeConfig = useMdmImageAttributesFieldsOrder() || {};
     var entityToShow = isViewMode ? entity : modifiedEntity;
-    var imageAttributeConfig = useSelector(mdm.selectors.getImageAttributesFieldsOrder) || {};
     var imageAttributeFieldsOrder = imageAttributeConfig[entity === null || entity === void 0 ? void 0 : entity.type] || (imageAttributeConfig === null || imageAttributeConfig === void 0 ? void 0 : imageAttributeConfig.default) || {};
-    var _b = useState(false), isDefault = _b[0], setIsDefault = _b[1];
     useEffect(function () {
         setIsDefault((entityToShow === null || entityToShow === void 0 ? void 0 : entityToShow.defaultProfilePic) === (attributeValue === null || attributeValue === void 0 ? void 0 : attributeValue.uri));
     }, [attributeValue === null || attributeValue === void 0 ? void 0 : attributeValue.uri, entityToShow]);

package/esm/components/ImageDetailsView/MetaInfo/MetaInfo.js

@@ -1,6 +1,4 @@
 import React from 'react';
-import { useSelector } from 'react-redux';
-import mdm from '@reltio/mdm-module';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import Box from '@mui/material/Box';
 import { MetaInfoHeader } from '../MetaInfoHeader/MetaInfoHeader';
@@ -8,12 +6,13 @@ import { MetaInfoList } from '../MetaInfoList/MetaInfoList';
 import { MetaInfoForm } from '../MetaInfoForm/MetaInfoForm';
 import { useEditMetaInfo } from '../hooks/useEditMetaInfo';
 import { darkTheme } from '../theme';
+import { useMdmIsEditableMode, useMdmMode } from '../../../contexts';
 var darkMuiTheme = createTheme(darkTheme);
 export var MetaInfo = function (_a) {
     var imageAttributeFieldsOrder = _a.imageAttributeFieldsOrder, attributeType = _a.attributeType, initialAttributeValue = _a.attributeValue;
+    var mode = useMdmMode();
+    var isEditableMode = useMdmIsEditableMode();
     var _b = useEditMetaInfo({ attributeType: attributeType, initialAttributeValue: initialAttributeValue }), addAttributes = _b.addAttributes, changeAttribute = _b.changeAttribute, deleteAttribute = _b.deleteAttribute, clearLocalChanges = _b.clearLocalChanges, applyLocalChanges = _b.applyLocalChanges, attributeValue = _b.attributeValue, hasChanges = _b.hasChanges;
-    var mode = useSelector(mdm.selectors.getMode);
-    var isEditableMode = useSelector(mdm.selectors.getIsEditableMode);
     return (React.createElement(ThemeProvider, { theme: darkMuiTheme },
         React.createElement(Box, null,
             React.createElement(MetaInfoHeader, { attributeType: attributeType, uri: attributeValue === null || attributeValue === void 0 ? void 0 : attributeValue.uri, onAddAttributes: isEditableMode ? addAttributes : undefined }),

package/esm/components/ImageDetailsView/MetaInfoList/MetaInfoItem/styles.d.ts

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

package/esm/components/ImageDetailsView/MetaInfoList/MetaInfoList.js

@@ -1,15 +1,14 @@
 import React from 'react';
-import { useSelector } from 'react-redux';
-import mdm from '@reltio/mdm-module';
 import Box from '@mui/material/Box';
-import AttributesPager from '../../attributes/readMode/AttributesPager';
+import AttributesPager from '../../attributes/readMode/AttributesPager/AttributesPager';
 import { MetaInfoItem } from './MetaInfoItem/MetaInfoItem';
 import { getNotSystemAttributesList, getSystemAttributesList } from '../helpers';
+import { useMdmIsViewMode } from '../../../contexts';
 import { useStyles } from './styles';
 export var MetaInfoList = function (_a) {
     var attributeValue = _a.attributeValue, attributeType = _a.attributeType, imageAttributeFieldsOrder = _a.imageAttributeFieldsOrder;
     var styles = useStyles();
-    var isViewMode = useSelector(mdm.selectors.getIsViewMode);
+    var isViewMode = useMdmIsViewMode();
     var systemAttributesList = getSystemAttributesList(attributeValue, imageAttributeFieldsOrder);
     var notSystemAttributesList = getNotSystemAttributesList(attributeValue, attributeType, imageAttributeFieldsOrder);
     return (React.createElement(Box, { className: styles.root },

package/esm/components/ImageDetailsView/hooks/useEditMetaInfo.js

@@ -1,13 +1,11 @@
 import { useEffect, useState, useContext, useCallback } from 'react';
 import { equals } from 'ramda';
-import { useDispatch } from 'react-redux';
-import { profile } from '@reltio/mdm-module';
 import { addAttribute, editAttribute, removeAttribute } from '@reltio/mdm-sdk';
-import { ViewIdContext } from '../../../contexts';
+import { ViewIdContext, useMdmAction } from '../../../contexts';
 export var useEditMetaInfo = function (_a) {
     var initialAttributeValue = _a.initialAttributeValue, attributeType = _a.attributeType;
-    var dispatch = useDispatch();
     var viewId = useContext(ViewIdContext);
+    var modifyAttribute = useMdmAction('modifyAttribute');
     var _b = useState(initialAttributeValue), attributeValue = _b[0], setAttributeValue = _b[1];
     useEffect(function () {
         setAttributeValue(initialAttributeValue);
@@ -50,13 +48,8 @@ export var useEditMetaInfo = function (_a) {
         setAttributeValue(initialAttributeValue);
     }, [initialAttributeValue]);
     var applyLocalChanges = useCallback(function () {
-        dispatch(profile.actions.modifyAttribute({
-            value: attributeValue,
-            attributeType: attributeType,
-            uri: attributeValue.uri,
-            viewId: viewId
-        }));
-    }, [attributeValue, attributeType, viewId, dispatch]);
+        modifyAttribute({ value: attributeValue, attributeType: attributeType, uri: attributeValue.uri, viewId: viewId });
+    }, [attributeValue, attributeType, viewId, modifyAttribute]);
     return {
         addAttributes: addAttributes,
         changeAttribute: changeAttribute,

package/esm/components/MatchRulesBlock/SimpleMatchRules/styles.d.ts

@@ -1,2 +1,2 @@
-declare const styles: (props?: any) => import("@mui/styles").ClassNameMap<"title" | "relevanceScore" | "container" | "negativeRuleIcon" | "labelsContainer" | "matchRuleInfo" | "matchRuleLabel">;
+declare const styles: (props?: any) => import("@mui/styles").ClassNameMap<"relevanceScore" | "title" | "container" | "negativeRuleIcon" | "labelsContainer" | "matchRuleInfo" | "matchRuleLabel">;
 export default styles;

package/esm/components/MatchRulesSelector/MatchRulesSelector.d.ts

@@ -9,8 +9,5 @@ type Props = {
     fullWidth?: boolean;
     entityType: TEntityType;
 };
-declare const MatchRulesSelector: {
-    ({ name, values, onChange, entityType, TextFieldProps, fullWidth }: Props): JSX.Element;
-    displayName: string;
-};
+declare const MatchRulesSelector: ({ name, values, onChange, entityType, TextFieldProps, fullWidth }: Props) => JSX.Element;
 export default MatchRulesSelector;

package/esm/components/MatchRulesSelector/MatchRulesSelector.js

@@ -1,8 +1,7 @@
 import React, { useMemo } from 'react';
-import { useSelector } from 'react-redux';
-import mdmModule from '@reltio/mdm-module';
 import { getMatchGroups, partitionByMlMatch, MatchRulesAttrNames } from '@reltio/mdm-sdk';
 import MultiValueSelector from '../MultiValueSelector/MultiValueSelector';
+import { useMdmMetadata } from '../../contexts';
 var prepareOptions = function (options) {
     if (options === void 0) { options = []; }
     return options.map(function (_a) {
@@ -12,10 +11,9 @@ var prepareOptions = function (options) {
 };
 var MatchRulesSelector = function (_a) {
     var name = _a.name, values = _a.values, onChange = _a.onChange, entityType = _a.entityType, TextFieldProps = _a.TextFieldProps, fullWidth = _a.fullWidth;
-    var metadata = useSelector(mdmModule.selectors.getMetadata);
+    var metadata = useMdmMetadata();
     var _b = useMemo(function () { return partitionByMlMatch(getMatchGroups(metadata, entityType === null || entityType === void 0 ? void 0 : entityType.uri)); }, [entityType === null || entityType === void 0 ? void 0 : entityType.uri, metadata]), mlMatchRules = _b[0], matchRules = _b[1];
     var options = useMemo(function () { return prepareOptions(name === MatchRulesAttrNames.matchRules ? matchRules : mlMatchRules); }, [name, matchRules, mlMatchRules]);
     return (React.createElement(MultiValueSelector, { values: values, onChange: onChange, options: options, TextFieldProps: TextFieldProps, fullWidth: fullWidth }));
 };
-MatchRulesSelector.displayName = 'MatchRulesSelector';
 export default MatchRulesSelector;

package/esm/components/ModeSwitcher/styles.d.ts

@@ -1,2 +1,2 @@
-declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"title" | "icon" | "button" | "current">;
+declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"icon" | "title" | "button" | "current">;
 export default useStyles;

package/esm/components/PivotingUriLink/PivotingUriLink.js

@@ -1,14 +1,12 @@
 import React, { forwardRef, useContext } from 'react';
-import { useSelector } from 'react-redux';
 import classnames from 'classnames';
-import mdmModule from '@reltio/mdm-module';
-import { UrlGeneratorsContext } from '../../contexts';
+import { UrlGeneratorsContext, useMdmUiPath } from '../../contexts';
 import { useStyles } from './styles';
 var PivotingUriLink = forwardRef(function (_a, ref) {
     var value = _a.value, attributeType = _a.attributeType, children = _a.children, className = _a.className, onClick = _a.onClick;
     var styles = useStyles();
-    var uiPath = useSelector(mdmModule.selectors.getUIPath);
     var generatePivotingUrl = useContext(UrlGeneratorsContext).generatePivotingUrl;
+    var uiPath = useMdmUiPath();
     var url = generatePivotingUrl({ uiPath: uiPath, uri: attributeType.uri, value: JSON.stringify(value) });
     return (React.createElement("a", { ref: ref, href: url, onClick: function (e) {
             onClick();

package/esm/components/Popper/Popper.d.ts

@@ -13,5 +13,5 @@ declare const Popper: React.ForwardRefExoticComponent<Pick<Omit<import("@mui/bas
     anchorEl?: HTMLElement | null;
     excludeAnchorFromBackdrop?: boolean;
     onClose?: () => void;
-}, "open" | "title" | "id" | "hidden" | "key" | "children" | "defaultValue" | "prefix" | "results" | "slot" | "style" | "color" | "translate" | "container" | "transition" | "className" | "sx" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "security" | "unselectable" | "inputMode" | "is" | "components" | "componentsProps" | "slotProps" | "slots" | "onClose" | "component" | "disablePortal" | "keepMounted" | "anchorEl" | "placement" | "modifiers" | "popperOptions" | "popperRef" | "modal" | "excludeAnchorFromBackdrop"> & React.RefAttributes<HTMLDivElement>>;
+}, "id" | "hidden" | "open" | "title" | "key" | "children" | "defaultValue" | "prefix" | "results" | "slot" | "style" | "color" | "translate" | "container" | "transition" | "className" | "sx" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "security" | "unselectable" | "inputMode" | "is" | "components" | "componentsProps" | "slotProps" | "slots" | "onClose" | "component" | "disablePortal" | "keepMounted" | "anchorEl" | "placement" | "modifiers" | "popperOptions" | "popperRef" | "modal" | "excludeAnchorFromBackdrop"> & React.RefAttributes<HTMLDivElement>>;
 export default Popper;

package/esm/components/PotentialMatchReviewCard/styles.d.ts

@@ -1 +1 @@
-export const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"date" | "title" | "icon" | "caption" | "flex" | "header" | "expanded" | "info" | "infoBlock" | "flag" | "mainInfo" | "pmReviewCard">;
+export const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"date" | "icon" | "caption" | "title" | "flex" | "header" | "expanded" | "info" | "infoBlock" | "flag" | "mainInfo" | "pmReviewCard">;

package/esm/components/ProfileBand/ProfileBand.js

@@ -1,21 +1,20 @@
 import React, { useCallback } from 'react';
 import classnames from 'classnames';
-import { useSelector } from 'react-redux';
 import { isNil, identity } from 'ramda';
 import Typography from '@mui/material/Typography';
 import Tooltip from '@mui/material/Tooltip';
 import i18n from 'ui-i18n';
 import { getLabel, isActiveObject, getBusinessCardAttributesText, getEntityId, isTempUri } from '@reltio/mdm-sdk';
-import mdmModule from '@reltio/mdm-module';
 import EntityAvatar from '../EntityAvatar/EntityAvatar';
 import EntityTypeBadge from '../EntityTypeBadge/EntityTypeBadge';
+import { useMdmMetadata, useMdmShowEntityId } from '../../contexts';
 import useStyles from './styles';
 var ProfileBand = function (_a) {
     var _b;
     var className = _a.className, entity = _a.entity, children = _a.children, classes = _a.classes, _c = _a.renderLabel, renderLabel = _c === void 0 ? identity : _c;
     var styles = useStyles({ classes: classes });
-    var metadata = useSelector(mdmModule.selectors.getMetadata);
-    var showEntityId = useSelector(mdmModule.selectors.getShowEntityId);
+    var metadata = useMdmMetadata();
+    var showEntityId = useMdmShowEntityId();
     var handleCopyEntityIdToClipboard = useCallback(function () {
         navigator.clipboard.writeText(getEntityId(entity));
     }, [entity]);