@reltio/components 1.4.2189 → 1.4.2191

package/ProfileBand/ProfileBand.d.ts

@@ -1,12 +1,13 @@
 import React, { ReactNode } from 'react';
 import { Entity } from '@reltio/mdm-sdk';
-import { useStyles } from './styles';
 type Props = {
-    className?: string;
     entity?: Entity;
     children?: ReactNode;
-    classes?: Partial<ReturnType<typeof useStyles>>;
+    className?: string;
+    classes?: {
+        profileBand?: string;
+    };
     renderLabel?: (label: string) => React.ReactNode;
 };
-export declare const ProfileBand: ({ className, entity, children, classes, renderLabel }: Props) => React.JSX.Element;
+export declare const ProfileBand: ({ entity, children, className, classes, renderLabel }: Props) => React.JSX.Element;
 export {};

package/ProfileBand/ProfileBand.js

@@ -8,11 +8,10 @@ import { getLabel, isActiveObject, getBusinessCardAttributesText, getEntityId, i
 import { EntityAvatar } from '../EntityAvatar';
 import { EntityTypeBadge } from '../EntityTypeBadge';
 import { useMdmMetadata, useMdmShowEntityId } from '../contexts/MdmModuleContext';
-import { useStyles } from './styles';
+import styles from './ProfileBand.module.css';
 export 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 entity = _a.entity, children = _a.children, className = _a.className, classes = _a.classes, _c = _a.renderLabel, renderLabel = _c === void 0 ? identity : _c;
     var metadata = useMdmMetadata();
     var showEntityId = useMdmShowEntityId();
     var handleCopyEntityIdToClipboard = useCallback(function () {
@@ -28,7 +27,7 @@ export var ProfileBand = function (_a) {
     var entityUri = entity.uri;
     var entityId = getEntityId(entity);
     return (React.createElement("div", { className: classnames(styles.profileBandWrapper, className), "data-reltio-id": "reltio-profile-band" },
-        React.createElement("div", { className: classnames(styles.profileBand, (_b = {},
+        React.createElement("div", { className: classnames(styles.profileBand, classes === null || classes === void 0 ? void 0 : classes.profileBand, (_b = {},
                 _b[styles.inactive] = !isActive,
                 _b)), "data-entity-uri": entityUri },
             React.createElement(EntityAvatar, { key: entity.uri, entity: entity, avatarClassName: styles.profileIcon, imageClassName: styles.imageProfileIcon }),
@@ -39,7 +38,7 @@ export var ProfileBand = function (_a) {
                     businessCardText && (React.createElement(Typography, { variant: "subtitle1", className: styles.businessCard }, businessCardText))),
                 React.createElement("div", { className: styles.specialInfo },
                     React.createElement("div", { className: styles.entityType },
-                        React.createElement(EntityTypeBadge, { entity: entity, size: "medium", className: styles.badge }),
+                        React.createElement(EntityTypeBadge, { entity: entity, size: "medium" }),
                         !isTempUri(entityUri) && showEntityId && (React.createElement(Tooltip, { title: i18n.text('Copy to clipboard') },
                             React.createElement(Typography, { display: "inline", variant: "body2", className: styles.entityId, onClick: handleCopyEntityIdToClipboard },
                                 i18n.text('Entity ID'),

package/ProfileBand/ProfileBand.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"profileBandWrapper":"ProfileBand-profileBandWrapper--2qT6n","profileBand":"ProfileBand-profileBand--1t6Tw","inactive":"ProfileBand-inactive--5cmGK","profileIcon":"ProfileBand-profileIcon--Qw2fJ","imageProfileIcon":"ProfileBand-imageProfileIcon--btkGT","profileInfo":"ProfileBand-profileInfo--6KvVU","label":"ProfileBand-label--6rq8C","specialInfo":"ProfileBand-specialInfo--SJoYt","secondaryLabel":"ProfileBand-secondaryLabel--8hq1t","businessCard":"ProfileBand-businessCard--vk3x5","entityType":"ProfileBand-entityType--OitFz","entityId":"ProfileBand-entityId--ALqzc"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.ProfileBand-profileBandWrapper--2qT6n{box-shadow:0 1px 0 rgba(0,0,0,.12);flex-shrink:0;margin-bottom:1px}.ProfileBand-profileBand--1t6Tw{align-items:flex-start;background-color:#fff;display:flex;padding:16px 12px 16px 16px}.ProfileBand-profileBand--1t6Tw:after{content:"";font-size:0;min-height:inherit}.ProfileBand-inactive--5cmGK{background:var(--mui-inactiveBackground)}.ProfileBand-profileIcon--Qw2fJ{margin-right:12px}.ProfileBand-imageProfileIcon--btkGT{height:48px;width:48px}.ProfileBand-profileInfo--6KvVU{display:flex;flex:1 1 50%;flex-direction:column}.ProfileBand-label--6rq8C{color:var(--mui-palette-text-primary);letter-spacing:.25px;line-height:1.2;white-space:break-spaces;word-break:break-word}.ProfileBand-label--6rq8C+.ProfileBand-specialInfo--SJoYt{margin-top:4px}.ProfileBand-secondaryLabel--8hq1t{color:var(--mui-palette-text-primary);display:inline-flex;font-size:14px;font-weight:400;line-height:16px;margin-top:2px;white-space:break-spaces}.ProfileBand-secondaryLabel--8hq1t+.ProfileBand-businessCard--vk3x5{margin-left:12px}.ProfileBand-businessCard--vk3x5{color:var(--mui-palette-text-secondary);display:inline-flex;font-size:14px;line-height:1.2;margin-top:4px;white-space:break-spaces}.ProfileBand-specialInfo--SJoYt{display:flex;flex-wrap:wrap;justify-content:space-between;margin-top:8px;width:100%}.ProfileBand-entityType--OitFz{display:flex;flex-wrap:wrap}.ProfileBand-entityId--ALqzc{color:var(--mui-palette-text-secondary);cursor:pointer;font-size:13px;white-space:nowrap}.ProfileBand-entityId--ALqzc:hover{text-decoration:underline}`;
+    head.appendChild(style);
+}
+export default styles;

package/cjs/ProfileBand/ProfileBand.d.ts

@@ -1,12 +1,13 @@
 import React, { ReactNode } from 'react';
 import { Entity } from '@reltio/mdm-sdk';
-import { useStyles } from './styles';
 type Props = {
-    className?: string;
     entity?: Entity;
     children?: ReactNode;
-    classes?: Partial<ReturnType<typeof useStyles>>;
+    className?: string;
+    classes?: {
+        profileBand?: string;
+    };
     renderLabel?: (label: string) => React.ReactNode;
 };
-export declare const ProfileBand: ({ className, entity, children, classes, renderLabel }: Props) => React.JSX.Element;
+export declare const ProfileBand: ({ entity, children, className, classes, renderLabel }: Props) => React.JSX.Element;
 export {};

package/cjs/ProfileBand/ProfileBand.js

@@ -37,11 +37,10 @@ var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var EntityAvatar_1 = require("../EntityAvatar");
 var EntityTypeBadge_1 = require("../EntityTypeBadge");
 var MdmModuleContext_1 = require("../contexts/MdmModuleContext");
-var styles_1 = require("./styles");
+var ProfileBand_module_css_1 = __importDefault(require("./ProfileBand.module.css"));
 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 ? ramda_1.identity : _c;
-    var styles = (0, styles_1.useStyles)({ classes: classes });
+    var entity = _a.entity, children = _a.children, className = _a.className, classes = _a.classes, _c = _a.renderLabel, renderLabel = _c === void 0 ? ramda_1.identity : _c;
     var metadata = (0, MdmModuleContext_1.useMdmMetadata)();
     var showEntityId = (0, MdmModuleContext_1.useMdmShowEntityId)();
     var handleCopyEntityIdToClipboard = (0, react_1.useCallback)(function () {
@@ -56,21 +55,21 @@ var ProfileBand = function (_a) {
     var isActive = (0, mdm_sdk_1.isActiveObject)(entity);
     var entityUri = entity.uri;
     var entityId = (0, mdm_sdk_1.getEntityId)(entity);
-    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(styles.profileBandWrapper, className), "data-reltio-id": "reltio-profile-band" },
-        react_1.default.createElement("div", { className: (0, classnames_1.default)(styles.profileBand, (_b = {},
-                _b[styles.inactive] = !isActive,
+    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(ProfileBand_module_css_1.default.profileBandWrapper, className), "data-reltio-id": "reltio-profile-band" },
+        react_1.default.createElement("div", { className: (0, classnames_1.default)(ProfileBand_module_css_1.default.profileBand, classes === null || classes === void 0 ? void 0 : classes.profileBand, (_b = {},
+                _b[ProfileBand_module_css_1.default.inactive] = !isActive,
                 _b)), "data-entity-uri": entityUri },
-            react_1.default.createElement(EntityAvatar_1.EntityAvatar, { key: entity.uri, entity: entity, avatarClassName: styles.profileIcon, imageClassName: styles.imageProfileIcon }),
-            react_1.default.createElement("div", { className: styles.profileInfo },
+            react_1.default.createElement(EntityAvatar_1.EntityAvatar, { key: entity.uri, entity: entity, avatarClassName: ProfileBand_module_css_1.default.profileIcon, imageClassName: ProfileBand_module_css_1.default.imageProfileIcon }),
+            react_1.default.createElement("div", { className: ProfileBand_module_css_1.default.profileInfo },
                 react_1.default.createElement("div", null,
-                    react_1.default.createElement(Typography_1.default, { variant: "h6", className: styles.label }, renderLabel(label)),
-                    secondaryLabel && (react_1.default.createElement(Typography_1.default, { variant: "subtitle2", className: styles.secondaryLabel }, secondaryLabel)),
-                    businessCardText && (react_1.default.createElement(Typography_1.default, { variant: "subtitle1", className: styles.businessCard }, businessCardText))),
-                react_1.default.createElement("div", { className: styles.specialInfo },
-                    react_1.default.createElement("div", { className: styles.entityType },
-                        react_1.default.createElement(EntityTypeBadge_1.EntityTypeBadge, { entity: entity, size: "medium", className: styles.badge }),
+                    react_1.default.createElement(Typography_1.default, { variant: "h6", className: ProfileBand_module_css_1.default.label }, renderLabel(label)),
+                    secondaryLabel && (react_1.default.createElement(Typography_1.default, { variant: "subtitle2", className: ProfileBand_module_css_1.default.secondaryLabel }, secondaryLabel)),
+                    businessCardText && (react_1.default.createElement(Typography_1.default, { variant: "subtitle1", className: ProfileBand_module_css_1.default.businessCard }, businessCardText))),
+                react_1.default.createElement("div", { className: ProfileBand_module_css_1.default.specialInfo },
+                    react_1.default.createElement("div", { className: ProfileBand_module_css_1.default.entityType },
+                        react_1.default.createElement(EntityTypeBadge_1.EntityTypeBadge, { entity: entity, size: "medium" }),
                         !(0, mdm_sdk_1.isTempUri)(entityUri) && showEntityId && (react_1.default.createElement(Tooltip_1.default, { title: ui_i18n_1.default.text('Copy to clipboard') },
-                            react_1.default.createElement(Typography_1.default, { display: "inline", variant: "body2", className: styles.entityId, onClick: handleCopyEntityIdToClipboard },
+                            react_1.default.createElement(Typography_1.default, { display: "inline", variant: "body2", className: ProfileBand_module_css_1.default.entityId, onClick: handleCopyEntityIdToClipboard },
                                 ui_i18n_1.default.text('Entity ID'),
                                 ": ",
                                 entityId)))))),

package/cjs/ProfileBand/ProfileBand.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"profileBandWrapper":"ProfileBand-profileBandWrapper--2qT6n","profileBand":"ProfileBand-profileBand--1t6Tw","inactive":"ProfileBand-inactive--5cmGK","profileIcon":"ProfileBand-profileIcon--Qw2fJ","imageProfileIcon":"ProfileBand-imageProfileIcon--btkGT","profileInfo":"ProfileBand-profileInfo--6KvVU","label":"ProfileBand-label--6rq8C","specialInfo":"ProfileBand-specialInfo--SJoYt","secondaryLabel":"ProfileBand-secondaryLabel--8hq1t","businessCard":"ProfileBand-businessCard--vk3x5","entityType":"ProfileBand-entityType--OitFz","entityId":"ProfileBand-entityId--ALqzc"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.ProfileBand-profileBandWrapper--2qT6n{box-shadow:0 1px 0 rgba(0,0,0,.12);flex-shrink:0;margin-bottom:1px}.ProfileBand-profileBand--1t6Tw{align-items:flex-start;background-color:#fff;display:flex;padding:16px 12px 16px 16px}.ProfileBand-profileBand--1t6Tw:after{content:"";font-size:0;min-height:inherit}.ProfileBand-inactive--5cmGK{background:var(--mui-inactiveBackground)}.ProfileBand-profileIcon--Qw2fJ{margin-right:12px}.ProfileBand-imageProfileIcon--btkGT{height:48px;width:48px}.ProfileBand-profileInfo--6KvVU{display:flex;flex:1 1 50%;flex-direction:column}.ProfileBand-label--6rq8C{color:var(--mui-palette-text-primary);letter-spacing:.25px;line-height:1.2;white-space:break-spaces;word-break:break-word}.ProfileBand-label--6rq8C+.ProfileBand-specialInfo--SJoYt{margin-top:4px}.ProfileBand-secondaryLabel--8hq1t{color:var(--mui-palette-text-primary);display:inline-flex;font-size:14px;font-weight:400;line-height:16px;margin-top:2px;white-space:break-spaces}.ProfileBand-secondaryLabel--8hq1t+.ProfileBand-businessCard--vk3x5{margin-left:12px}.ProfileBand-businessCard--vk3x5{color:var(--mui-palette-text-secondary);display:inline-flex;font-size:14px;line-height:1.2;margin-top:4px;white-space:break-spaces}.ProfileBand-specialInfo--SJoYt{display:flex;flex-wrap:wrap;justify-content:space-between;margin-top:8px;width:100%}.ProfileBand-entityType--OitFz{display:flex;flex-wrap:wrap}.ProfileBand-entityId--ALqzc{color:var(--mui-palette-text-secondary);cursor:pointer;font-size:13px;white-space:nowrap}.ProfileBand-entityId--ALqzc:hover{text-decoration:underline}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/contexts/MdmModuleContext/context.d.ts

@@ -56,6 +56,7 @@ export type MdmModuleValuesContextProps = Partial<{
     uiConfigLayout: Layout;
     uiConfigProfile: Profile;
     showMasking: boolean;
+    reviewDCREnabled: boolean;
 }>;
 export type MdmModuleActionsContextProps = Partial<{
     openSearch: (payload: SearchState) => void;
@@ -260,6 +261,7 @@ export declare const MdmModuleValuesContext: import("@fluentui/react-context-sel
     uiConfigLayout: Layout;
     uiConfigProfile: Profile;
     showMasking: boolean;
+    reviewDCREnabled: boolean;
 }>>;
 export declare const MdmModuleListenersContext: import("@fluentui/react-context-selector").Context<Partial<{
     expandInvalidRelatonsListener: (callback: () => void) => (action: any) => void;

package/cjs/contexts/MdmModuleContext/hooks.d.ts

@@ -151,3 +151,4 @@ export declare const useMdmListener: <T extends keyof MdmModuleListenersContextP
 export declare const useMdmHiddenAttributes: () => Record<string, string[]>;
 export declare const useMdmControlAttributes: () => string[];
 export declare const useMdmShowMasking: () => boolean;
+export declare const useMdmReviewDCREnabled: () => boolean;

package/cjs/contexts/MdmModuleContext/hooks.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useMdmIsWorkflowEnabled = exports.useMdmIsCollaborationEnabled = exports.useMdmSearchProviderData = exports.useMdmSearchNavigationData = exports.useMdmDataTenants = exports.useMdmEnvironment = exports.useMdmTenantName = exports.useMdmTenant = exports.useMdmTenantObject = exports.useMdmUserRoles = exports.useMdmUsername = exports.useMdmUser = exports.useMdmMetadata = exports.useMdmDependentLookups = exports.useMdmLookups = exports.useMdmProfileLastLoadedTime = exports.useMdmHistoryEvent = exports.useMdmHistorySlice = exports.useMdmHistoryMode = exports.useMdmHistoryDiff = exports.useMdmIsEditableMode = exports.useMdmIsViewMode = exports.useMdmMode = exports.useMdmEntityUriWithDataTenant = exports.useMdmEntityWithDiff = exports.useMdmEntityUri = exports.useMdmEntity = exports.useMdmModifiedEntities = exports.useMdmLookupAutocomplete = exports.useMdmAttributesSortingStrategy = exports.useMdmMaxValuesInResponse = exports.useMdmAttributesPresentation = exports.useMdmDateTimeMask = exports.useMdmDateMask = exports.useMdmPivotingAttributes = exports.useMdmShowEntityId = exports.useMdmImageAttributesFieldsOrder = exports.useMdmCollaborationPath = exports.useMdmApiPath = exports.useMdmReltioPath = exports.useMdmImageServicePath = exports.useMdmWorkflowPath = exports.useMdmServicesPath = exports.useMdmDtssPath = exports.useMdmUiPath = exports.useMdmAbsoluteImagePath = exports.useMdmExportPath = exports.useMdmWorkflowEnvironmentUrl = exports.useMdmUiError = exports.useMdmAutoCloseInterval = void 0;
-exports.useMdmShowMasking = exports.useMdmControlAttributes = exports.useMdmHiddenAttributes = exports.useMdmListener = exports.useMdmAction = exports.useMdmAuthoringItemsByEntityType = exports.useMdmGlobalSearchRequestOptions = exports.useMdmDependentLookupEditorContext = exports.useMdmRelationsDrafts = exports.useMdmAllRelationsToAddAndEdit = exports.useMdmDependentLookupsStructureNode = exports.useMdmActiveErrorsForAttributesPager = exports.useMdmDependentLookupEditorState = exports.useMdmInitialConnection = exports.useMdmInitialConnectionTempEntity = exports.useMdmModifiedEntity = exports.useMdmModifiedEntityDefaultProfilePic = exports.useMdmIsSourcesScreenEnabled = exports.useMdmProfileErrors = void 0;
+exports.useMdmReviewDCREnabled = exports.useMdmShowMasking = exports.useMdmControlAttributes = exports.useMdmHiddenAttributes = exports.useMdmListener = exports.useMdmAction = exports.useMdmAuthoringItemsByEntityType = exports.useMdmGlobalSearchRequestOptions = exports.useMdmDependentLookupEditorContext = exports.useMdmRelationsDrafts = exports.useMdmAllRelationsToAddAndEdit = exports.useMdmDependentLookupsStructureNode = exports.useMdmActiveErrorsForAttributesPager = exports.useMdmDependentLookupEditorState = exports.useMdmInitialConnection = exports.useMdmInitialConnectionTempEntity = exports.useMdmModifiedEntity = exports.useMdmModifiedEntityDefaultProfilePic = exports.useMdmIsSourcesScreenEnabled = exports.useMdmProfileErrors = void 0;
 var react_context_selector_1 = require("@fluentui/react-context-selector");
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var context_1 = require("./context");
@@ -233,3 +233,5 @@ var useMdmControlAttributes = function () {
 exports.useMdmControlAttributes = useMdmControlAttributes;
 var useMdmShowMasking = function () { return useMdmModuleValuesContext(function (context) { return context.showMasking; }); };
 exports.useMdmShowMasking = useMdmShowMasking;
+var useMdmReviewDCREnabled = function () { return useMdmModuleValuesContext(function (context) { return context.reviewDCREnabled; }); };
+exports.useMdmReviewDCREnabled = useMdmReviewDCREnabled;

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

@@ -1,3 +1,3 @@
 export { MdmModuleProvider } from './provider';
-export { useMdmAutoCloseInterval, useMdmUiError, useMdmWorkflowEnvironmentUrl, useMdmExportPath, useMdmAbsoluteImagePath, useMdmUiPath, useMdmDtssPath, useMdmServicesPath, useMdmWorkflowPath, useMdmImageServicePath, useMdmReltioPath, useMdmApiPath, useMdmCollaborationPath, useMdmImageAttributesFieldsOrder, useMdmShowEntityId, useMdmPivotingAttributes, useMdmDateMask, useMdmDateTimeMask, useMdmAttributesPresentation, useMdmMaxValuesInResponse, useMdmAttributesSortingStrategy, useMdmLookupAutocomplete, useMdmModifiedEntities, useMdmEntity, useMdmEntityUri, useMdmEntityWithDiff, useMdmEntityUriWithDataTenant, useMdmMode, useMdmIsViewMode, useMdmIsEditableMode, useMdmHistoryDiff, useMdmHistoryMode, useMdmHistorySlice, useMdmHistoryEvent, useMdmProfileLastLoadedTime, useMdmLookups, useMdmDependentLookups, useMdmMetadata, useMdmUser, useMdmUsername, useMdmUserRoles, useMdmTenantObject, useMdmTenant, useMdmTenantName, useMdmEnvironment, useMdmDataTenants, useMdmSearchNavigationData, useMdmSearchProviderData, useMdmIsCollaborationEnabled, useMdmIsWorkflowEnabled, useMdmProfileErrors, useMdmRelationsDrafts, useMdmModifiedEntityDefaultProfilePic, useMdmModifiedEntity, useMdmInitialConnectionTempEntity, useMdmInitialConnection, useMdmDependentLookupEditorState, useMdmActiveErrorsForAttributesPager, useMdmDependentLookupsStructureNode, useMdmAllRelationsToAddAndEdit, useMdmDependentLookupEditorContext, useMdmGlobalSearchRequestOptions, useMdmAuthoringItemsByEntityType, useMdmAction, useMdmListener, useMdmIsSourcesScreenEnabled, useMdmHiddenAttributes, useMdmControlAttributes, useMdmShowMasking } from './hooks';
+export { useMdmAutoCloseInterval, useMdmUiError, useMdmWorkflowEnvironmentUrl, useMdmExportPath, useMdmAbsoluteImagePath, useMdmUiPath, useMdmDtssPath, useMdmServicesPath, useMdmWorkflowPath, useMdmImageServicePath, useMdmReltioPath, useMdmApiPath, useMdmCollaborationPath, useMdmImageAttributesFieldsOrder, useMdmShowEntityId, useMdmPivotingAttributes, useMdmDateMask, useMdmDateTimeMask, useMdmAttributesPresentation, useMdmMaxValuesInResponse, useMdmAttributesSortingStrategy, useMdmLookupAutocomplete, useMdmModifiedEntities, useMdmEntity, useMdmEntityUri, useMdmEntityWithDiff, useMdmEntityUriWithDataTenant, useMdmMode, useMdmIsViewMode, useMdmIsEditableMode, useMdmHistoryDiff, useMdmHistoryMode, useMdmHistorySlice, useMdmHistoryEvent, useMdmProfileLastLoadedTime, useMdmLookups, useMdmDependentLookups, useMdmMetadata, useMdmUser, useMdmUsername, useMdmUserRoles, useMdmTenantObject, useMdmTenant, useMdmTenantName, useMdmEnvironment, useMdmDataTenants, useMdmSearchNavigationData, useMdmSearchProviderData, useMdmIsCollaborationEnabled, useMdmIsWorkflowEnabled, useMdmProfileErrors, useMdmRelationsDrafts, useMdmModifiedEntityDefaultProfilePic, useMdmModifiedEntity, useMdmInitialConnectionTempEntity, useMdmInitialConnection, useMdmDependentLookupEditorState, useMdmActiveErrorsForAttributesPager, useMdmDependentLookupsStructureNode, useMdmAllRelationsToAddAndEdit, useMdmDependentLookupEditorContext, useMdmGlobalSearchRequestOptions, useMdmAuthoringItemsByEntityType, useMdmAction, useMdmListener, useMdmIsSourcesScreenEnabled, useMdmHiddenAttributes, useMdmControlAttributes, useMdmShowMasking, useMdmReviewDCREnabled } from './hooks';
 export type { MdmModuleActionsContextProps, MdmModuleValuesContextProps, MdmModuleListenersContextProps } from './context';

package/cjs/contexts/MdmModuleContext/index.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useMdmIsCollaborationEnabled = exports.useMdmSearchProviderData = exports.useMdmSearchNavigationData = exports.useMdmDataTenants = exports.useMdmEnvironment = exports.useMdmTenantName = exports.useMdmTenant = exports.useMdmTenantObject = exports.useMdmUserRoles = exports.useMdmUsername = exports.useMdmUser = exports.useMdmMetadata = exports.useMdmDependentLookups = exports.useMdmLookups = exports.useMdmProfileLastLoadedTime = exports.useMdmHistoryEvent = exports.useMdmHistorySlice = exports.useMdmHistoryMode = exports.useMdmHistoryDiff = exports.useMdmIsEditableMode = exports.useMdmIsViewMode = exports.useMdmMode = exports.useMdmEntityUriWithDataTenant = exports.useMdmEntityWithDiff = exports.useMdmEntityUri = exports.useMdmEntity = exports.useMdmModifiedEntities = exports.useMdmLookupAutocomplete = exports.useMdmAttributesSortingStrategy = exports.useMdmMaxValuesInResponse = exports.useMdmAttributesPresentation = exports.useMdmDateTimeMask = exports.useMdmDateMask = exports.useMdmPivotingAttributes = exports.useMdmShowEntityId = exports.useMdmImageAttributesFieldsOrder = exports.useMdmCollaborationPath = exports.useMdmApiPath = exports.useMdmReltioPath = exports.useMdmImageServicePath = exports.useMdmWorkflowPath = exports.useMdmServicesPath = exports.useMdmDtssPath = exports.useMdmUiPath = exports.useMdmAbsoluteImagePath = exports.useMdmExportPath = exports.useMdmWorkflowEnvironmentUrl = exports.useMdmUiError = exports.useMdmAutoCloseInterval = exports.MdmModuleProvider = void 0;
-exports.useMdmShowMasking = exports.useMdmControlAttributes = exports.useMdmHiddenAttributes = exports.useMdmIsSourcesScreenEnabled = exports.useMdmListener = exports.useMdmAction = exports.useMdmAuthoringItemsByEntityType = exports.useMdmGlobalSearchRequestOptions = exports.useMdmDependentLookupEditorContext = exports.useMdmAllRelationsToAddAndEdit = exports.useMdmDependentLookupsStructureNode = exports.useMdmActiveErrorsForAttributesPager = exports.useMdmDependentLookupEditorState = exports.useMdmInitialConnection = exports.useMdmInitialConnectionTempEntity = exports.useMdmModifiedEntity = exports.useMdmModifiedEntityDefaultProfilePic = exports.useMdmRelationsDrafts = exports.useMdmProfileErrors = exports.useMdmIsWorkflowEnabled = void 0;
+exports.useMdmReviewDCREnabled = exports.useMdmShowMasking = exports.useMdmControlAttributes = exports.useMdmHiddenAttributes = exports.useMdmIsSourcesScreenEnabled = exports.useMdmListener = exports.useMdmAction = exports.useMdmAuthoringItemsByEntityType = exports.useMdmGlobalSearchRequestOptions = exports.useMdmDependentLookupEditorContext = exports.useMdmAllRelationsToAddAndEdit = exports.useMdmDependentLookupsStructureNode = exports.useMdmActiveErrorsForAttributesPager = exports.useMdmDependentLookupEditorState = exports.useMdmInitialConnection = exports.useMdmInitialConnectionTempEntity = exports.useMdmModifiedEntity = exports.useMdmModifiedEntityDefaultProfilePic = exports.useMdmRelationsDrafts = exports.useMdmProfileErrors = exports.useMdmIsWorkflowEnabled = void 0;
 var provider_1 = require("./provider");
 Object.defineProperty(exports, "MdmModuleProvider", { enumerable: true, get: function () { return provider_1.MdmModuleProvider; } });
 var hooks_1 = require("./hooks");
@@ -74,3 +74,4 @@ Object.defineProperty(exports, "useMdmIsSourcesScreenEnabled", { enumerable: tru
 Object.defineProperty(exports, "useMdmHiddenAttributes", { enumerable: true, get: function () { return hooks_1.useMdmHiddenAttributes; } });
 Object.defineProperty(exports, "useMdmControlAttributes", { enumerable: true, get: function () { return hooks_1.useMdmControlAttributes; } });
 Object.defineProperty(exports, "useMdmShowMasking", { enumerable: true, get: function () { return hooks_1.useMdmShowMasking; } });
+Object.defineProperty(exports, "useMdmReviewDCREnabled", { enumerable: true, get: function () { return hooks_1.useMdmReviewDCREnabled; } });

package/cjs/features/history/HistoryRow/styles.d.ts

@@ -1,5 +1,5 @@
 type Type = {
     color?: string;
 };
-export declare const useStyles: (props: Type) => import("@mui/styles").ClassNameMap<"title" | "date" | "selected" | "user" | "badge" | "historyRow" | "rowHeader">;
+export declare const useStyles: (props: Type) => import("@mui/styles").ClassNameMap<"title" | "date" | "selected" | "user" | "historyRow" | "rowHeader" | "badge">;
 export {};

package/cjs/features/workflow/AddWorkflowDialog/AddWorkflowDialog.spec.js

@@ -46,6 +46,15 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -265,4 +274,62 @@ describe('AddWorkflowDialog tests', function () {
             }
         });
     }); });
+    describe('Required comments', function () {
+        it('should not allow to start workflow if comment is required with empty comment', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var definitionsWithRequiredComment, mockAnchorEl, props, user, commentField, startButton, comment;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        mdm_sdk_1.startProcessInstance.mockResolvedValue(null);
+                        definitionsWithRequiredComment = __spreadArray(__spreadArray([], definitions, true), [
+                            {
+                                type: 'workflowWithRequiredComment',
+                                displayName: 'Workflow With Required Comment',
+                                manualStart: true,
+                                requiresCommentOnStart: true,
+                                objectTypes: ['configuration/entityTypes/HCO']
+                            }
+                        ], false);
+                        mdm_sdk_1.processDefinitions.mockReturnValue(Promise.resolve({
+                            data: definitionsWithRequiredComment
+                        }));
+                        mockAnchorEl = document.createElement('div');
+                        props = {
+                            onClose: jest.fn(),
+                            anchorEl: mockAnchorEl
+                        };
+                        user = setUp(props).user;
+                        expect(react_2.screen.getByText('Add new workflow')).toBeInTheDocument();
+                        return [4 /*yield*/, user.click(react_2.screen.getByRole('combobox'))];
+                    case 1:
+                        _a.sent();
+                        return [4 /*yield*/, user.click(react_2.screen.getByText('Workflow With Required Comment'))];
+                    case 2:
+                        _a.sent();
+                        commentField = react_2.screen.getByRole('textbox', { name: /type a comment/i });
+                        expect(commentField).toBeRequired();
+                        startButton = react_2.screen.getByText('Start');
+                        expect(startButton).toBeDisabled();
+                        comment = 'Some comment';
+                        return [4 /*yield*/, user.type(commentField, comment)];
+                    case 3:
+                        _a.sent();
+                        expect(startButton).not.toBeDisabled();
+                        return [4 /*yield*/, user.click(startButton)];
+                    case 4:
+                        _a.sent();
+                        expect(mdm_sdk_1.startProcessInstance).toHaveBeenCalledWith({
+                            workflowPath: workflowPath,
+                            environment: workflowEnvironmentUrl,
+                            tenant: tenant.id,
+                            processType: 'workflowWithRequiredComment',
+                            comment: comment,
+                            objectURIs: ['entities/uri1']
+                        });
+                        expect(react_2.screen.getByText('A new workflow has started')).toBeInTheDocument();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+    });
 });

package/cjs/features/workflow/ChangeRequestEditor/ChangeRequestEditor.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ChangeRequest, WorkflowTaskData } from '@reltio/mdm-sdk';
+type Props = {
+    dcr: ChangeRequest;
+    task: WorkflowTaskData;
+};
+export declare const ChangeRequestEditor: ({ dcr, task: _task }: Props) => React.JSX.Element;
+export {};

package/cjs/features/workflow/ChangeRequestEditor/ChangeRequestEditor.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChangeRequestEditor = void 0;
+var react_1 = __importDefault(require("react"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var ChangeRequestEditor_module_css_1 = __importDefault(require("./ChangeRequestEditor.module.css"));
+var ChangeRequestEditor = function (_a) {
+    var dcr = _a.dcr, _task = _a.task;
+    var dcrLoaded = !!dcr;
+    if (!dcrLoaded) {
+        return null;
+    }
+    return react_1.default.createElement("div", { className: ChangeRequestEditor_module_css_1.default.container }, ui_i18n_1.default.text('DCR changes'));
+};
+exports.ChangeRequestEditor = ChangeRequestEditor;

package/cjs/features/workflow/ChangeRequestEditor/ChangeRequestEditor.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"container":"ChangeRequestEditor-container--pOvfN"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.ChangeRequestEditor-container--pOvfN{border:1px solid rgba(0,0,0,.03);border-radius:8px;padding:16px}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/features/workflow/ChangeRequestEditor/index.d.ts

@@ -0,0 +1 @@
+export { ChangeRequestEditor } from './ChangeRequestEditor';

package/cjs/features/workflow/ChangeRequestEditor/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChangeRequestEditor = void 0;
+var ChangeRequestEditor_1 = require("./ChangeRequestEditor");
+Object.defineProperty(exports, "ChangeRequestEditor", { enumerable: true, get: function () { return ChangeRequestEditor_1.ChangeRequestEditor; } });

package/cjs/features/workflow/ReviewDCRButton/ReviewDCRButton.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type Props = {
+    onClick: () => void;
+};
+export declare const ReviewDCRButton: ({ onClick }: Props) => React.JSX.Element;
+export {};

package/cjs/features/workflow/ReviewDCRButton/ReviewDCRButton.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReviewDCRButton = void 0;
+var react_1 = __importDefault(require("react"));
+var classnames_1 = __importDefault(require("classnames"));
+var Button_1 = __importDefault(require("@mui/material/Button"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var ReviewDCR_1 = __importDefault(require("../../../icons/ReviewDCR"));
+var ReviewDCRButton_module_css_1 = __importDefault(require("./ReviewDCRButton.module.css"));
+var ReviewDCRButton = function (_a) {
+    var onClick = _a.onClick;
+    return (react_1.default.createElement(Button_1.default, { onClick: onClick, color: "primary", className: (0, classnames_1.default)(ReviewDCRButton_module_css_1.default.button), "data-reltio-id": "review-dcr-button" },
+        react_1.default.createElement(ReviewDCR_1.default, { className: ReviewDCRButton_module_css_1.default.icon }),
+        ui_i18n_1.default.text('Review DCR')));
+};
+exports.ReviewDCRButton = ReviewDCRButton;

package/cjs/features/workflow/ReviewDCRButton/ReviewDCRButton.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"button":"ReviewDCRButton-button--LIwmx","icon":"ReviewDCRButton-icon--b1gNO"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.ReviewDCRButton-button--LIwmx{min-width:100px}.ReviewDCRButton-icon--b1gNO{margin-right:8px}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/features/workflow/ReviewDCRButton/index.d.ts

@@ -0,0 +1 @@
+export { ReviewDCRButton } from './ReviewDCRButton';

package/cjs/features/workflow/ReviewDCRButton/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReviewDCRButton = void 0;
+var ReviewDCRButton_1 = require("./ReviewDCRButton");
+Object.defineProperty(exports, "ReviewDCRButton", { enumerable: true, get: function () { return ReviewDCRButton_1.ReviewDCRButton; } });

package/cjs/features/workflow/ReviewDCRDialog/ReviewDCRDialog.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ChangeRequest, GroupedObjectsInfo, WorkflowTaskData } from '@reltio/mdm-sdk';
+type Props = {
+    open: boolean;
+    onClose: () => void;
+    dcr: ChangeRequest;
+    task: WorkflowTaskData;
+    groupedObjects: GroupedObjectsInfo[];
+};
+export declare const ReviewDCRDialog: ({ open, onClose, dcr, task, groupedObjects }: Props) => React.JSX.Element;
+export {};

package/cjs/features/workflow/ReviewDCRDialog/ReviewDCRDialog.js

@@ -0,0 +1,63 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReviewDCRDialog = void 0;
+var react_1 = __importDefault(require("react"));
+var Dialog_1 = __importDefault(require("@mui/material/Dialog"));
+var DialogTitle_1 = __importDefault(require("@mui/material/DialogTitle"));
+var DialogContent_1 = __importDefault(require("@mui/material/DialogContent"));
+var Typography_1 = __importDefault(require("@mui/material/Typography"));
+var SmallIconButton_1 = require("../../../SmallIconButton");
+var Close_1 = __importDefault(require("@mui/icons-material/Close"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var useWorkflowCheckPermission_1 = require("../hooks/useWorkflowCheckPermission");
+var useWorkflowActions_1 = require("../hooks/useWorkflowActions");
+var MdmModuleContext_1 = require("../../../contexts/MdmModuleContext");
+var ProfileBand_1 = require("../../../ProfileBand");
+var DueDateField_1 = require("../DueDateField");
+var PrioritySelector_1 = require("../PrioritySelector");
+var AssigneeSelector_1 = require("../AssigneeSelector");
+var WorkflowComments_1 = require("../WorkflowComments");
+var WorkflowActionButtons_1 = require("../WorkflowActionButtons");
+var DCRSummaryInfo_1 = require("./components/DCRSummaryInfo/DCRSummaryInfo");
+var ChangeRequestEditor_1 = require("../ChangeRequestEditor");
+var ReviewDCRDialog_module_css_1 = __importDefault(require("./ReviewDCRDialog.module.css"));
+var ReviewDCRDialog = function (_a) {
+    var open = _a.open, onClose = _a.onClose, dcr = _a.dcr, task = _a.task, groupedObjects = _a.groupedObjects;
+    var entity = (0, MdmModuleContext_1.useMdmEntity)();
+    var checkWorkflowPermission = (0, useWorkflowCheckPermission_1.useWorkflowCheckPermission)();
+    var canViewComments = checkWorkflowPermission('VIEW_PROCESS_INSTANCE_COMMENTS');
+    var _b = (0, useWorkflowActions_1.useWorkflowActions)({
+        taskId: task.taskId,
+        possibleActions: task.possibleActions,
+        assignee: task.assignee,
+        isOpen: task.isOpen
+    }), workflowActions = _b.actions, actionRequestIsInProgress = _b.actionRequestIsInProgress;
+    return (react_1.default.createElement(Dialog_1.default, { open: open, onClose: onClose, fullScreen: true },
+        react_1.default.createElement(DialogTitle_1.default, { className: ReviewDCRDialog_module_css_1.default.dialogTitle },
+            react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.titleContent },
+                react_1.default.createElement(Typography_1.default, { variant: "h6", className: ReviewDCRDialog_module_css_1.default.titleText }, ui_i18n_1.default.text('Review DCR')),
+                react_1.default.createElement(WorkflowActionButtons_1.WorkflowActionButtons, { workflowActions: workflowActions, actionRequestIsInProgress: actionRequestIsInProgress, preferredAction: task.preferredAction })),
+            react_1.default.createElement(SmallIconButton_1.SmallIconButton, { onClick: onClose, className: ReviewDCRDialog_module_css_1.default.closeButton, "aria-label": "close", icon: Close_1.default })),
+        react_1.default.createElement(DialogContent_1.default, { classes: { root: ReviewDCRDialog_module_css_1.default.content } },
+            react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.leftSection },
+                react_1.default.createElement(ProfileBand_1.ProfileBand, { entity: entity, className: ReviewDCRDialog_module_css_1.default.profileBandRoot, classes: { profileBand: ReviewDCRDialog_module_css_1.default.profileBand } }),
+                react_1.default.createElement(DCRSummaryInfo_1.DCRSummaryInfo, { dcr: dcr, task: task, groupedObjects: groupedObjects }),
+                react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.editableSection },
+                    react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.editableGrid },
+                        react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.editableItem },
+                            react_1.default.createElement(DueDateField_1.DueDateField, { taskId: task.taskId, dueDate: task.dueDate, isTaskOpen: task.isOpen })),
+                        react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.editableItem },
+                            react_1.default.createElement(PrioritySelector_1.PrioritySelector, { taskId: task.taskId, priority: task.priority || 50, isTaskOpen: task.isOpen, className: ReviewDCRDialog_module_css_1.default.priorityField })),
+                        react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.editableItem },
+                            react_1.default.createElement(AssigneeSelector_1.AssigneeSelector, { taskId: task.taskId, assignee: task.assignee, isTaskOpen: task.isOpen })))),
+                react_1.default.createElement("div", { className: ReviewDCRDialog_module_css_1.default.changesSection },
+                    react_1.default.createElement(ChangeRequestEditor_1.ChangeRequestEditor, { dcr: dcr, task: task }))),
+            canViewComments && (react_1.default.createElement(WorkflowComments_1.WorkflowComments, { workflowActions: workflowActions, actionRequestIsInProgress: actionRequestIsInProgress, preferredAction: task.preferredAction, taskId: task.taskId, processInstanceComments: task.processInstanceComments, isTaskOpen: task.isOpen, showActionButtons: false, alwaysExpanded: true, classes: {
+                    container: ReviewDCRDialog_module_css_1.default.commentsRootContainer,
+                    commentsContainer: ReviewDCRDialog_module_css_1.default.commentsContainer
+                } })))));
+};
+exports.ReviewDCRDialog = ReviewDCRDialog;

package/cjs/features/workflow/ReviewDCRDialog/ReviewDCRDialog.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"dialogTitle":"ReviewDCRDialog-dialogTitle--xCXtj","titleContent":"ReviewDCRDialog-titleContent--Hh2KH","titleText":"ReviewDCRDialog-titleText--ME8s4","closeButton":"ReviewDCRDialog-closeButton--YMAEf","content":"ReviewDCRDialog-content--qvUva","leftSection":"ReviewDCRDialog-leftSection--5MELW","profileBand":"ReviewDCRDialog-profileBand--7r6Xy","profileBandRoot":"ReviewDCRDialog-profileBandRoot--G7p1m","editableSection":"ReviewDCRDialog-editableSection--v-D7a","editableGrid":"ReviewDCRDialog-editableGrid--auc-d","editableItem":"ReviewDCRDialog-editableItem--isGwv","priorityField":"ReviewDCRDialog-priorityField--LQ1n3","changesSection":"ReviewDCRDialog-changesSection--qj2OK","commentsRootContainer":"ReviewDCRDialog-commentsRootContainer--g2f7m","commentsContainer":"ReviewDCRDialog-commentsContainer--OApOx"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.ReviewDCRDialog-dialogTitle--xCXtj{align-items:center;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;padding:12px 16px 8px}.ReviewDCRDialog-titleContent--Hh2KH{align-items:center;display:flex;flex:1;justify-content:space-between;position:relative}.ReviewDCRDialog-titleText--ME8s4{flex:1;margin:0;padding-left:48px}.ReviewDCRDialog-closeButton--YMAEf{color:#666;left:15px;position:absolute}.ReviewDCRDialog-closeButton--YMAEf:hover{background-color:rgba(0,0,0,.04);color:#333}.ReviewDCRDialog-content--qvUva{display:flex;min-height:400px;padding:0!important;width:100%}.ReviewDCRDialog-leftSection--5MELW{border-right:1px solid #e0e0e0;padding:0 16px;width:100%}.ReviewDCRDialog-profileBand--7r6Xy{margin-left:-16px}.ReviewDCRDialog-profileBandRoot--G7p1m{box-shadow:none;margin-bottom:0}.ReviewDCRDialog-editableSection--v-D7a{border:1px solid #d9d9d9;border-radius:0 0 8px 8px;margin-bottom:32px;padding:8px 16px 14px}.ReviewDCRDialog-editableGrid--auc-d{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:12px}.ReviewDCRDialog-editableItem--isGwv{display:flex;flex-direction:column}.ReviewDCRDialog-priorityField--LQ1n3{min-width:200px}.ReviewDCRDialog-changesSection--qj2OK{margin-bottom:24px}.ReviewDCRDialog-commentsRootContainer--g2f7m{margin:10px 0 16px 10px;min-width:323px;width:323px}.ReviewDCRDialog-commentsContainer--OApOx{flex-grow:1;max-height:100%}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/features/workflow/ReviewDCRDialog/components/DCRChangesSummary/DCRChangesSummary.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { DCRChanges, GroupedObjectsInfo } from '@reltio/mdm-sdk';
+type Props = {
+    changes?: DCRChanges;
+    groupedObjects: GroupedObjectsInfo[];
+};
+export declare const DCRChangesSummary: ({ changes, groupedObjects }: Props) => React.JSX.Element;
+export {};

package/cjs/features/workflow/ReviewDCRDialog/components/DCRChangesSummary/DCRChangesSummary.js

@@ -0,0 +1,73 @@
+"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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DCRChangesSummary = void 0;
+var react_1 = __importStar(require("react"));
+var classnames_1 = __importDefault(require("classnames"));
+var Skeleton_1 = __importDefault(require("@mui/material/Skeleton"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var MdmModuleContext_1 = require("../../../../../contexts/MdmModuleContext");
+var helpers_1 = require("../../helpers");
+var DCRChangesSummary_module_css_1 = __importDefault(require("./DCRChangesSummary.module.css"));
+var getOperationLabel = function (operation) {
+    var _a;
+    var labels = (_a = {},
+        _a[mdm_sdk_1.DCROperationTypes.ADDED] = ui_i18n_1.default.text('Added'),
+        _a[mdm_sdk_1.DCROperationTypes.EDITED] = ui_i18n_1.default.text('Edited'),
+        _a[mdm_sdk_1.DCROperationTypes.DELETED] = ui_i18n_1.default.text('Deleted'),
+        _a[mdm_sdk_1.DCROperationTypes.PINNED] = ui_i18n_1.default.text('Pinned'),
+        _a[mdm_sdk_1.DCROperationTypes.PIN_DELETED] = ui_i18n_1.default.text('Pin deleted'),
+        _a[mdm_sdk_1.DCROperationTypes.IGNORED] = ui_i18n_1.default.text('Ignored'),
+        _a[mdm_sdk_1.DCROperationTypes.IGNORE_DELETED] = ui_i18n_1.default.text('Ignore deleted'),
+        _a);
+    return labels[operation] || operation || '';
+};
+var ChangeItem = function (_a) {
+    var count = _a.count, operation = _a.operation;
+    return count > 0 && (react_1.default.createElement("div", { className: DCRChangesSummary_module_css_1.default.changeItem },
+        react_1.default.createElement("div", { className: (0, classnames_1.default)(DCRChangesSummary_module_css_1.default.changeNumber, DCRChangesSummary_module_css_1.default[operation]) }, count),
+        react_1.default.createElement("div", { className: DCRChangesSummary_module_css_1.default.changeLabel }, getOperationLabel(operation))));
+};
+var LoadingSkeleton = function () { return (react_1.default.createElement(react_1.default.Fragment, null, Array.from({ length: 4 }).map(function (_, index) { return (react_1.default.createElement("div", { key: "summary-changes-skeleton-".concat(index), className: DCRChangesSummary_module_css_1.default.changeItem },
+    react_1.default.createElement(Skeleton_1.default, { variant: "text", width: 24, height: 16, className: DCRChangesSummary_module_css_1.default.changeNumber }),
+    react_1.default.createElement(Skeleton_1.default, { variant: "text", width: 60, height: 13, className: DCRChangesSummary_module_css_1.default.changeLabel }))); }))); };
+var DCRChangesSummary = function (_a) {
+    var changes = _a.changes, groupedObjects = _a.groupedObjects;
+    var metadata = (0, MdmModuleContext_1.useMdmMetadata)();
+    var dcrChanges = (0, react_1.useMemo)(function () { return (changes ? (0, helpers_1.calculateDCRChanges)(metadata, changes, groupedObjects) : null); }, [metadata, changes, groupedObjects]);
+    var changesLoaded = !!dcrChanges;
+    return (react_1.default.createElement("div", { className: DCRChangesSummary_module_css_1.default.changesSummary, "data-reltio-id": "dcr-changes-summary" },
+        !changesLoaded && react_1.default.createElement(LoadingSkeleton, null),
+        changesLoaded &&
+            Object.entries(dcrChanges).map(function (_a) {
+                var operation = _a[0], count = _a[1];
+                return (react_1.default.createElement(ChangeItem, { key: operation, count: count, operation: operation }));
+            })));
+};
+exports.DCRChangesSummary = DCRChangesSummary;

package/cjs/features/workflow/ReviewDCRDialog/components/DCRChangesSummary/DCRChangesSummary.module.css.js

@@ -0,0 +1,9 @@
+const styles = {"changesSummary":"DCRChangesSummary-changesSummary--31gR-","changeItem":"DCRChangesSummary-changeItem---XfYP","changeNumber":"DCRChangesSummary-changeNumber--vZxc4","changeLabel":"DCRChangesSummary-changeLabel--tDXS6","edited":"DCRChangesSummary-edited--KFivZ","added":"DCRChangesSummary-added--KGdGw","deleted":"DCRChangesSummary-deleted--TWgS5","ignored":"DCRChangesSummary-ignored--Q2Q8R"};
+if (typeof document !== 'undefined') {
+    const head = document.head || document.getElementsByTagName('head')[0]
+    const style = document.createElement('style');
+    style.type = 'text/css'
+    style.innerHTML = `.DCRChangesSummary-changesSummary--31gR-{align-items:center;display:flex;gap:22px}.DCRChangesSummary-changeItem---XfYP{align-items:center;display:flex;flex-direction:column;gap:4px;position:relative}.DCRChangesSummary-changeItem---XfYP:not(:last-child):after{background-color:#d9d9d9;bottom:2px;content:"";height:20px;position:absolute;right:-12px;top:2px;width:1px}.DCRChangesSummary-changeNumber--vZxc4{font-size:16px;font-weight:500;line-height:1}.DCRChangesSummary-changeLabel--tDXS6{color:var(--mui-palette-text-primary);font-size:13px}.DCRChangesSummary-edited--KFivZ{color:#eb9d08}.DCRChangesSummary-added--KGdGw{color:#599e0e}.DCRChangesSummary-deleted--TWgS5{color:#eb5757}.DCRChangesSummary-ignored--Q2Q8R{color:var(--mui-palette-primary-light)}`;
+    head.appendChild(style);
+}
+module.exports = styles;

package/cjs/features/workflow/ReviewDCRDialog/components/DCRChangesSummary/index.d.ts

@@ -0,0 +1 @@
+export { DCRChangesSummary } from './DCRChangesSummary';