@reltio/components 1.4.883 → 1.4.887

package/cjs/components/DropDownSelector/DropDownSelector.d.ts

@@ -11,10 +11,11 @@ export namespace DropDownSelectorType {
     const textFieldInputRef: PropTypes.Requireable<object>;
     const TextFieldProps: PropTypes.Requireable<object>;
     const height: PropTypes.Requireable<number>;
+    const classes: PropTypes.Requireable<object>;
 }
 export default DropDownSelector;
 import PropTypes from "prop-types";
-declare function DropDownSelector({ value, label, createLabel, getOptions, options, height, onChange, onCreate, onClear, components, textFieldInputRef, TextFieldProps, ...otherProps }: {
+declare function DropDownSelector({ value, label, createLabel, getOptions, options, height, onChange, onCreate, onClear, components, textFieldInputRef, TextFieldProps, classes, ...otherProps }: {
     [x: string]: any;
     value: any;
     label: any;
@@ -28,6 +29,7 @@ declare function DropDownSelector({ value, label, createLabel, getOptions, optio
     components: any;
     textFieldInputRef: any;
     TextFieldProps: any;
+    classes: any;
 }): JSX.Element;
 declare namespace DropDownSelector {
     export { DropDownSelectorType as propTypes };

package/cjs/components/DropDownSelector/DropDownSelector.js

@@ -60,7 +60,7 @@ var SingleValue_1 = __importDefault(require("./components/SingleValue"));
 var styles_1 = require("./styles");
 var DropDownSelector = function (_a) {
     var _b;
-    var value = _a.value, label = _a.label, createLabel = _a.createLabel, getOptions = _a.getOptions, options = _a.options, _c = _a.height, height = _c === void 0 ? 46 : _c, _d = _a.onChange, onChange = _d === void 0 ? ramda_1.identity : _d, onCreate = _a.onCreate, _e = _a.onClear, onClear = _e === void 0 ? ramda_1.identity : _e, components = _a.components, textFieldInputRef = _a.textFieldInputRef, TextFieldProps = _a.TextFieldProps, otherProps = __rest(_a, ["value", "label", "createLabel", "getOptions", "options", "height", "onChange", "onCreate", "onClear", "components", "textFieldInputRef", "TextFieldProps"]);
+    var value = _a.value, label = _a.label, createLabel = _a.createLabel, getOptions = _a.getOptions, options = _a.options, _c = _a.height, height = _c === void 0 ? 46 : _c, _d = _a.onChange, onChange = _d === void 0 ? ramda_1.identity : _d, onCreate = _a.onCreate, _e = _a.onClear, onClear = _e === void 0 ? ramda_1.identity : _e, components = _a.components, textFieldInputRef = _a.textFieldInputRef, TextFieldProps = _a.TextFieldProps, classes = _a.classes, otherProps = __rest(_a, ["value", "label", "createLabel", "getOptions", "options", "height", "onChange", "onCreate", "onClear", "components", "textFieldInputRef", "TextFieldProps", "classes"]);
     var styles = styles_1.useStyles({ height: height });
     var underlineStyle = constants_1.useInputStyles();
     var _f = react_1.useState(false), open = _f[0], setOpen = _f[1];
@@ -78,7 +78,8 @@ var DropDownSelector = function (_a) {
     var overloadStylesIfGroup = ramda_1.prop('Group', components) ? styles_1.overloadMenuListStyle : {};
     var overloadStylesIfNoLabel = ramda_1.isEmpty(label) ? styles_1.withoutLabelInputStyle : {};
     var mergedStyles = __assign(__assign(__assign({}, styles_1.customStyles), overloadStylesIfGroup), overloadStylesIfNoLabel);
-    return (react_1.default.createElement(SelectComponent, __assign({ placeholder: "", defaultOptions: true }, otherProps, { value: ramda_1.defaultTo(null, value), loadOptions: getOptions, options: options, cacheOptions: true, onChange: onChange, onCreate: handleCreate, onClear: onClear, createLabel: createLabel, classes: styles, styles: mergedStyles, components: __assign(__assign({ DropdownIndicator: DropdownIndicator_1.default, LoadingIndicator: core_1.EmptyStub, SingleValue: SingleValue_1.default,
+    var mergedClasses = __assign(__assign({}, styles), classes);
+    return (react_1.default.createElement(SelectComponent, __assign({ placeholder: "", defaultOptions: true }, otherProps, { value: ramda_1.defaultTo(null, value), loadOptions: getOptions, options: options, cacheOptions: true, onChange: onChange, onCreate: handleCreate, onClear: onClear, createLabel: createLabel, classes: mergedClasses, styles: mergedStyles, components: __assign(__assign({ DropdownIndicator: DropdownIndicator_1.default, LoadingIndicator: core_1.EmptyStub, SingleValue: SingleValue_1.default,
             Menu: Menu_1.default }, showIndicatorSeparator), components), menuPlacement: "auto", TextFieldProps: __assign(__assign({}, TextFieldProps), { label: label, variant: 'filled', margin: 'dense', classes: __assign(__assign({}, ramda_1.prop('classes', TextFieldProps)), { root: classnames_1.default(styles.formControl, ramda_1.path(['classes', 'root'], TextFieldProps)) }), inputProps: __assign({}, ramda_1.prop('inputProps', TextFieldProps)), InputProps: __assign(__assign({}, ramda_1.prop('InputProps', TextFieldProps)), { classes: __assign(__assign({}, ramda_1.path(['InputProps', 'classes'], TextFieldProps)), { root: classnames_1.default(styles.filledInputRoot, ramda_1.path(['InputProps', 'classes', 'root'], TextFieldProps)), underline: classnames_1.default((_b = {}, _b[underlineStyle.filledInputUnderline] = mdm_sdk_1.isEmptyValue(value), _b), ramda_1.path(['InputProps', 'classes', 'underline'], TextFieldProps)), focused: classnames_1.default('focused', ramda_1.path(['InputProps', 'classes', 'focused'], TextFieldProps)) }) }), InputLabelProps: __assign(__assign({}, ramda_1.prop('InputLabelProps', TextFieldProps)), { classes: __assign(__assign({}, ramda_1.path(['InputLabelProps', 'classes'], TextFieldProps)), { root: classnames_1.default(styles.inputLabel, ramda_1.path(['InputLabelProps', 'classes', 'root'], TextFieldProps)), shrink: classnames_1.default('shrink', ramda_1.path(['InputLabelProps', 'classes', 'shrink'], TextFieldProps)) }), shrink: !mdm_sdk_1.isEmptyValue(value) ? true : undefined }), ref: textFieldInputRef || inputRef }), inputRef: textFieldInputRef || inputRef, menuIsOpen: open, onMenuOpen: function () { return setOpen(true); }, onMenuClose: function () { return setOpen(false); } })));
 };
 exports.DropDownSelectorType = {
@@ -93,7 +94,8 @@ exports.DropDownSelectorType = {
     components: prop_types_1.default.object,
     textFieldInputRef: prop_types_1.default.object,
     TextFieldProps: prop_types_1.default.object,
-    height: prop_types_1.default.number
+    height: prop_types_1.default.number,
+    classes: prop_types_1.default.object
 };
 DropDownSelector.propTypes = exports.DropDownSelectorType;
 exports.default = DropDownSelector;

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

@@ -51,8 +51,8 @@ var Title_1 = __importDefault(require("../../../Title/Title"));
 var CardinalityMessage_1 = __importDefault(require("./CardinalityMessage"));
 var ErrorMessage_1 = __importDefault(require("../../../ErrorWrapper/ErrorMessage"));
 var Attribute_1 = __importDefault(require("../AttributesFactory/Attribute"));
-var Tags_1 = __importDefault(require("../../readMode/SpecialAttributes/Tags")); //TODO: should be edit mode
-var Roles_1 = __importDefault(require("../../readMode/SpecialAttributes/Roles")); //TODO: should be edit mode
+var Roles_1 = require("../Roles/Roles");
+var Tags_1 = __importDefault(require("../Tags"));
 var styles_1 = require("./styles");
 var SpecialRenderer = function (_a) {
     var values = _a.values, attributeType = _a.attributeType, parentUri = _a.parentUri, mode = _a.mode, errorMessage = _a.errorMessage, otherProps = __rest(_a, ["values", "attributeType", "parentUri", "mode", "errorMessage"]);
@@ -68,7 +68,7 @@ var SpecialRenderer = function (_a) {
             case mdm_sdk_1.EntityAttrTypes.tags.uri:
                 return react_1.default.createElement(Tags_1.default, { values: values });
             case mdm_sdk_1.EntityAttrTypes.roles.uri: {
-                return react_1.default.createElement(Roles_1.default, { values: values });
+                return react_1.default.createElement(Roles_1.Roles, { values: values });
             }
             default: {
                 //startDate, endDate

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

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare type Props = {
+    values: string[];
+};
+export declare const Roles: ({ values }: Props) => JSX.Element;
+export {};

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

@@ -0,0 +1,64 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Roles = void 0;
+var react_1 = __importDefault(require("react"));
+var ramda_1 = require("ramda");
+var react_redux_1 = require("react-redux");
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
+var SimpleDropDownSelector_1 = __importDefault(require("../../../SimpleDropDownSelector/SimpleDropDownSelector"));
+var __1 = require("../../..");
+var styles_1 = require("./styles");
+var components = { MultiValue: __1.MultiValueChip };
+var Roles = function (_a) {
+    var values = _a.values;
+    var styles = styles_1.useStyles();
+    var dispatch = react_redux_1.useDispatch();
+    var metadata = react_redux_1.useSelector(mdm_module_1.default.selectors.getMetadata);
+    var entity = react_redux_1.useSelector(mdm_module_1.default.selectors.getEntity);
+    var entityUri = entity.uri;
+    var options = mdm_sdk_1.getRolesForEntityType(metadata, entity.type).map(function (role) { return ({
+        value: role.uri,
+        label: role.label
+    }); });
+    var formattedValues = values.map(function (value) {
+        var _a;
+        var label = (_a = options.find(ramda_1.propEq('value', value))) === null || _a === void 0 ? void 0 : _a.label;
+        return {
+            value: value,
+            label: label || mdm_sdk_1.getLastUriPart(value)
+        };
+    });
+    var handleChange = function (values) {
+        var roles = (values === null || values === void 0 ? void 0 : values.map(ramda_1.prop('value'))) || [];
+        dispatch(mdm_module_1.profile.actions.modifyAttribute({
+            value: roles,
+            attributeType: mdm_sdk_1.EntityAttrTypes.roles,
+            uri: entityUri
+        }));
+    };
+    return (react_1.default.createElement(SimpleDropDownSelector_1.default, { label: '', height: 40, isMulti: true, options: options, value: formattedValues, onChange: handleChange, components: components, classes: styles }));
+};
+exports.Roles = Roles;

package/cjs/components/attributes/editMode/Roles/styles.d.ts

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

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

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStyles = void 0;
+var styles_1 = require("@material-ui/core/styles");
+exports.useStyles = styles_1.makeStyles({
+    valueContainer: {
+        marginLeft: '8px',
+        width: 0
+    }
+});

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare type Props = {
+    className?: string;
+    values: string[];
+};
+declare const Tags: ({ className, values }: Props) => JSX.Element;
+export default Tags;

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

@@ -0,0 +1,62 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var react_redux_1 = require("react-redux");
+var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var TypeaheadEditor_1 = __importDefault(require("../../../editors/TypeaheadEditor/TypeaheadEditor"));
+var filtersWithSearch = function (searchQuery) { return [
+    {
+        filter: 'containsWordStartingWith',
+        fieldName: 'tags',
+        values: [searchQuery]
+    }
+]; };
+var getQuery = function (searchQuery) {
+    return searchQuery ? "?filter=" + mdm_sdk_1.buildFilterQueryString()(filtersWithSearch(searchQuery)) : '';
+};
+var body = [
+    {
+        fieldName: 'tags',
+        orderType: 'reversedCount'
+    }
+];
+var getSuggestions = function (searchQuery) {
+    return mdm_sdk_1.getFacets({ query: getQuery(searchQuery), body: body }).then(function (response) { return Object.keys(response.tags); });
+};
+var Tags = function (_a) {
+    var className = _a.className, values = _a.values;
+    var dispatch = react_redux_1.useDispatch();
+    var entityUri = react_redux_1.useSelector(mdm_module_1.default.selectors.getEntityUri);
+    var onChange = react_1.useCallback(function (tags) {
+        return dispatch(mdm_module_1.profile.actions.modifyAttribute({
+            value: tags,
+            attributeType: mdm_sdk_1.EntityAttrTypes.tags,
+            uri: entityUri
+        }));
+    }, [dispatch, entityUri]);
+    return (react_1.default.createElement(TypeaheadEditor_1.default, { fullWidth: true, multiple: true, variant: "filled", className: className, value: values, onChange: onChange, getSuggestions: getSuggestions }));
+};
+exports.default = Tags;

package/cjs/components/attributes/editMode/Tags/index.d.ts

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

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

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

package/cjs/components/editors/TypeaheadEditor/TypeaheadEditor.d.ts

@@ -6,7 +6,7 @@ declare function TypeaheadEditor({ value, getSuggestions, onChange, multiple, fu
     onChange: any;
     multiple: any;
     fullWidth: any;
-    InputProps: any;
+    InputProps?: {};
 }): JSX.Element;
 declare namespace TypeaheadEditor {
     namespace propTypes {

package/cjs/components/editors/TypeaheadEditor/TypeaheadEditor.js

@@ -50,6 +50,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_autosuggest_1 = __importDefault(require("react-autosuggest"));
+var react_input_autosize_1 = __importDefault(require("react-input-autosize"));
 var classnames_1 = __importDefault(require("classnames"));
 var TextField_1 = __importDefault(require("@material-ui/core/TextField"));
 var MenuItem_1 = __importDefault(require("@material-ui/core/MenuItem"));
@@ -66,9 +67,9 @@ var ExpandedValueTooltip_1 = __importDefault(require("../../ExpandedValueTooltip
 var ValueChip_1 = __importDefault(require("../../ValueChip/ValueChip"));
 var FETCH_DEBOUNCE_INTERVAL = 300;
 var TypeaheadEditor = function (_a) {
-    var value = _a.value, getSuggestions = _a.getSuggestions, onChange = _a.onChange, multiple = _a.multiple, fullWidth = _a.fullWidth, InputProps = _a.InputProps, inputProps = __rest(_a, ["value", "getSuggestions", "onChange", "multiple", "fullWidth", "InputProps"]);
-    var _b = react_1.useState([]), suggestions = _b[0], setSuggestions = _b[1];
-    var _c = react_1.useState(false), isPlaceholderVisible = _c[0], setPlaceholderVisibility = _c[1];
+    var value = _a.value, getSuggestions = _a.getSuggestions, onChange = _a.onChange, multiple = _a.multiple, fullWidth = _a.fullWidth, _b = _a.InputProps, InputProps = _b === void 0 ? {} : _b, inputProps = __rest(_a, ["value", "getSuggestions", "onChange", "multiple", "fullWidth", "InputProps"]);
+    var _c = react_1.useState([]), suggestions = _c[0], setSuggestions = _c[1];
+    var _d = react_1.useState(false), isPlaceholderVisible = _d[0], setPlaceholderVisibility = _d[1];
     var inputRef = react_1.useRef();
     var styles = styles_1.useStyles();
     var isFocused = function () { var _a; return ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('input')) === document.activeElement; };
@@ -77,8 +78,8 @@ var TypeaheadEditor = function (_a) {
         getSuggestions
     ]);
     value = ramda_1.defaultTo(multiple ? [] : '', value);
-    var _d = react_1.useState(''), currentValue = _d[0], setCurrentValue = _d[1];
-    var _e = react_1.useState(false), hasHighlightedItem = _e[0], setHasHighlightedItem = _e[1];
+    var _e = react_1.useState(''), currentValue = _e[0], setCurrentValue = _e[1];
+    var _f = react_1.useState(false), hasHighlightedItem = _f[0], setHasHighlightedItem = _f[1];
     var onInputChange = function (_a) {
         var newValue = _a.newValue, method = _a.method;
         switch (method) {
@@ -123,7 +124,7 @@ var TypeaheadEditor = function (_a) {
                 underline: classnames_1.default((_b = {}, _b[styles['input__underline']] = mdm_sdk_1.isEmptyValue(value), _b)),
                 input: classnames_1.default(styles['rawInput'], ramda_1.path(['classes', 'input'], InputProps))
             };
-            return multiple ? (react_1.default.createElement(TextField_1.default, __assign({}, otherProps, { ref: inputRef, inputRef: ref, InputProps: __assign(__assign({}, InputProps), { startAdornment: value.map(function (item, index) { return (react_1.default.createElement(ValueChip_1.default, { key: item, label: item, onDelete: function () { return onChange(ramda_1.remove(index, 1, value)); } })); }), classes: __assign({ root: classnames_1.default(styles['multiple-input__input'], ramda_1.path(['classes', 'root'], InputProps)), adornedStart: styles['multiple-input__adornedStart'] }, commonClasses) }), value: currentValue, onChange: onInputChange, classes: { root: styles['multiple-input__root'] } }))) : (react_1.default.createElement(TextField_1.default, __assign({}, otherProps, { ref: inputRef, inputRef: ref, value: value, onChange: ramda_1.pipe(ramda_1.tap(onInputChange), utils_1.getValue, onChange), InputProps: __assign(__assign({}, InputProps), { classes: __assign({ root: classnames_1.default(styles['input__root'], ramda_1.path(['classes', 'root'], InputProps)) }, commonClasses) }) })));
+            return multiple ? (react_1.default.createElement(TextField_1.default, __assign({}, otherProps, { ref: inputRef, inputRef: ref, InputProps: __assign(__assign({}, InputProps), { startAdornment: value.map(function (item, index) { return (react_1.default.createElement(ValueChip_1.default, { key: item, label: item, onDelete: function () { return onChange(ramda_1.remove(index, 1, value)); } })); }), inputComponent: react_input_autosize_1.default, classes: __assign(__assign({ root: classnames_1.default(styles['multiple-input__input'], ramda_1.path(['classes', 'root'], InputProps)) }, commonClasses), { input: classnames_1.default(styles.autosizeInput, commonClasses.input), adornedStart: styles['multiple-input__adornedStart'] }) }), value: currentValue, onChange: onInputChange, classes: { root: styles['multiple-input__root'] } }))) : (react_1.default.createElement(TextField_1.default, __assign({}, otherProps, { ref: inputRef, inputRef: ref, value: value, onChange: ramda_1.pipe(ramda_1.tap(onInputChange), utils_1.getValue, onChange), InputProps: __assign(__assign({}, InputProps), { classes: __assign({ root: classnames_1.default(styles['input__root'], ramda_1.path(['classes', 'root'], InputProps)) }, commonClasses) }) })));
         }, renderSuggestionsContainer: function (_a) {
             var children = _a.children, _b = _a.containerProps, ref = _b.ref, restContainerProps = __rest(_b, ["ref"]);
             return (react_1.default.createElement(Popper_1.default, { anchorEl: inputRef.current, open: Boolean(children) || isPlaceholderVisible },

package/cjs/components/editors/TypeaheadEditor/styles.d.ts

@@ -1 +1 @@
-export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"typeahead__suggestions-placeholder" | "typeahead__suggestions-container--open" | "typeahead__suggestions-list" | "typeahead__suggestions-menuItem" | "input__root" | "rawInput" | "multiple-input__root" | "multiple-input__input" | "multiple-input__adornedStart" | "input__underline" | "typeahead__suggestions-container" | "menuItem--item">;
+export const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"autosizeInput" | "typeahead__suggestions-placeholder" | "typeahead__suggestions-container--open" | "typeahead__suggestions-list" | "typeahead__suggestions-menuItem" | "input__root" | "rawInput" | "multiple-input__root" | "multiple-input__input" | "multiple-input__adornedStart" | "input__underline" | "typeahead__suggestions-container" | "menuItem--item">;

package/cjs/components/editors/TypeaheadEditor/styles.js

@@ -24,6 +24,21 @@ exports.useStyles = styles_1.makeStyles({
         color: 'rgba(0,0,0,0.87)',
         fontSize: '14px'
     },
+    autosizeInput: {
+        width: 'auto',
+        paddingTop: '10px',
+        paddingBottom: '11px',
+        marginLeft: '5px',
+        overflow: 'hidden',
+        '& input': {
+            background: '0px center',
+            border: 0,
+            fontSize: 'inherit',
+            outline: 0,
+            padding: 0,
+            color: 'inherit'
+        }
+    },
     rawInput: {
         height: '19px'
     },

package/cjs/components/workflow/cards/GenericWorkflowTaskCard/GenericWorkflowTaskCard.js

@@ -42,7 +42,7 @@ var CollaborationIcon_1 = __importDefault(require("../../../../icons/Collaborati
 var GenericWorkflowTaskCard = function (_a) {
     var _b;
     var task = _a.task, children = _a.children, actions = _a.actions, Icon = _a.Icon;
-    var taskId = task.taskId, dueDate = task.dueDate, priority = task.priority, assignee = task.assignee, createdBy = task.createdBy, createTime = task.createTime, step = task.displayName, processDefinitionDisplayName = task.processDefinitionDisplayName, objectURIs = task.objectURIs, processInstanceComments = task.processInstanceComments, possibleActions = task.possibleActions;
+    var taskId = task.taskId, dueDate = task.dueDate, priority = task.priority, assignee = task.assignee, createdBy = task.createdBy, createTime = task.createTime, step = task.displayName, processDefinitionDisplayName = task.processDefinitionDisplayName, objectURIs = task.objectURIs, processInstanceComments = task.processInstanceComments, possibleActions = task.possibleActions, isTaskOpen = task.isOpen;
     var dcrId = helpers_1.getDCRId(objectURIs);
     var color = useWorkflowColor_1.useWorkflowColor({ processDefinitionDisplayName: processDefinitionDisplayName });
     var styles = styles_1.useStyles({ color: color });
@@ -85,16 +85,16 @@ var GenericWorkflowTaskCard = function (_a) {
                                 canViewComments && (processInstanceComments === null || processInstanceComments === void 0 ? void 0 : processInstanceComments.length) > 0 && (react_1.default.createElement("div", { className: styles.commentsInfo },
                                     react_1.default.createElement(CollaborationIcon_1.default, { className: styles.commentsIcon }),
                                     react_1.default.createElement("div", { className: styles.infoValue }, processInstanceComments.length)))),
-                            actions || (react_1.default.createElement(TaskActions_1.default, { taskId: taskId, possibleActions: possibleActions, assignee: assignee })))))),
+                            actions || (react_1.default.createElement(TaskActions_1.default, { taskId: taskId, possibleActions: possibleActions, assignee: assignee, isTaskOpen: isTaskOpen })))))),
             isExpanded && (react_1.default.createElement(LineDecorator_1.default, { plain: true },
                 react_1.default.createElement("div", { className: styles.controlsBox },
                     react_1.default.createElement("div", { className: styles.controlsInRow },
-                        react_1.default.createElement(DueDateField_1.default, { taskId: taskId, dueDate: dueDate }),
-                        react_1.default.createElement(PrioritySelector_1.default, { taskId: taskId, priority: priority, className: styles.priority })),
-                    react_1.default.createElement(AssigneeSelector_1.default, { taskId: taskId, assignee: assignee }))))),
+                        react_1.default.createElement(DueDateField_1.default, { taskId: taskId, dueDate: dueDate, isTaskOpen: isTaskOpen }),
+                        react_1.default.createElement(PrioritySelector_1.default, { taskId: taskId, priority: priority, className: styles.priority, isTaskOpen: isTaskOpen })),
+                    react_1.default.createElement(AssigneeSelector_1.default, { taskId: taskId, assignee: assignee, isTaskOpen: isTaskOpen }))))),
         isExpanded && (react_1.default.createElement(react_1.default.Fragment, null,
             children,
             canViewComments && (react_1.default.createElement("div", { className: styles.comments },
-                react_1.default.createElement(WorkflowComments_1.default, { taskId: taskId, processInstanceComments: processInstanceComments })))))));
+                react_1.default.createElement(WorkflowComments_1.default, { taskId: taskId, processInstanceComments: processInstanceComments, isTaskOpen: isTaskOpen })))))));
 };
 exports.default = GenericWorkflowTaskCard;

package/cjs/components/workflow/components/AssigneeSelector/AssigneeSelector.d.ts

@@ -1,5 +1,7 @@
 /// <reference types="react" />
 import { WorkflowTaskData } from '@reltio/mdm-sdk';
-declare type Props = Pick<WorkflowTaskData, 'taskId' | 'assignee'>;
-declare const AssigneeSelector: ({ taskId, assignee }: Props) => JSX.Element;
+declare type Props = Pick<WorkflowTaskData, 'taskId' | 'assignee'> & {
+    isTaskOpen?: WorkflowTaskData['isOpen'];
+};
+declare const AssigneeSelector: ({ taskId, assignee, isTaskOpen }: Props) => JSX.Element;
 export default AssigneeSelector;

package/cjs/components/workflow/components/AssigneeSelector/AssigneeSelector.js

@@ -8,10 +8,11 @@ var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var DropDownSelector_1 = __importDefault(require("../../../DropDownSelector/DropDownSelector"));
 var useWorkflowAssignee_1 = require("../../hooks/useWorkflowAssignee");
 var AssigneeSelector = function (_a) {
-    var taskId = _a.taskId, assignee = _a.assignee;
+    var taskId = _a.taskId, assignee = _a.assignee, isTaskOpen = _a.isTaskOpen;
     var _b = useWorkflowAssignee_1.useWorkflowAssignee({
         taskId: taskId,
-        assignee: assignee
+        assignee: assignee,
+        isOpen: isTaskOpen
     }), currentAssignee = _b.assignee, getAssignees = _b.getAssignees, updateAssignee = _b.updateAssignee, updateRequestIsInProgress = _b.updateRequestIsInProgress, readOnly = _b.readOnly;
     var disabled = updateRequestIsInProgress || readOnly;
     return (react_1.default.createElement(DropDownSelector_1.default, { isDisabled: disabled, getOptions: getAssignees, onChange: updateAssignee, hideSelectedOptions: false, label: ui_i18n_1.default.text('Assigned to'), value: currentAssignee, defaultOptions: true, TextFieldProps: { disabled: disabled }, height: 40 }));

package/cjs/components/workflow/components/DueDateField/DueDateField.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import { WorkflowTaskData } from '@reltio/mdm-sdk';
 declare type Props = Pick<WorkflowTaskData, 'taskId' | 'dueDate'> & {
+    isTaskOpen?: WorkflowTaskData['isOpen'];
     className?: string;
 };
-declare const DueDateField: ({ taskId, dueDate, className }: Props) => JSX.Element;
+declare const DueDateField: ({ taskId, dueDate, isTaskOpen, className }: Props) => JSX.Element;
 export default DueDateField;

package/cjs/components/workflow/components/DueDateField/DueDateField.js

@@ -11,9 +11,13 @@ var styles_1 = require("./styles");
 var editors_1 = require("../../../editors");
 var useWorkflowDueDate_1 = require("../../hooks/useWorkflowDueDate");
 var DueDateField = function (_a) {
-    var taskId = _a.taskId, dueDate = _a.dueDate, className = _a.className;
+    var taskId = _a.taskId, dueDate = _a.dueDate, isTaskOpen = _a.isTaskOpen, className = _a.className;
     var styles = styles_1.useStyles();
-    var _b = useWorkflowDueDate_1.useWorkflowDueDate({ dueDate: dueDate, taskId: taskId }), updateDueDate = _b.updateDueDate, updateRequestIsInProgress = _b.updateRequestIsInProgress, readOnly = _b.readOnly;
+    var _b = useWorkflowDueDate_1.useWorkflowDueDate({
+        dueDate: dueDate,
+        taskId: taskId,
+        isOpen: isTaskOpen
+    }), updateDueDate = _b.updateDueDate, updateRequestIsInProgress = _b.updateRequestIsInProgress, readOnly = _b.readOnly;
     return (react_1.default.createElement(editors_1.DateEditor, { className: classnames_1.default(styles.dueDate, className), disabled: updateRequestIsInProgress || readOnly, value: dueDate, label: ui_i18n_1.default.text('Due date'), onChange: ramda_1.pipe(function (date) { return date && date.getTime(); }, updateDueDate), margin: "dense", InputProps: { className: styles.dueDateInput }, InputLabelProps: { classes: { root: styles.inputLabel } } }));
 };
 exports.default = DueDateField;

package/cjs/components/workflow/components/PrioritySelector/PrioritySelector.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import { WorkflowTaskData } from '@reltio/mdm-sdk';
 declare type Props = Pick<WorkflowTaskData, 'taskId' | 'priority'> & {
+    isTaskOpen?: WorkflowTaskData['isOpen'];
     className?: string;
 };
-declare const PrioritySelector: ({ taskId, priority, className }: Props) => JSX.Element;
+declare const PrioritySelector: ({ taskId, priority, isTaskOpen, className }: Props) => JSX.Element;
 export default PrioritySelector;

package/cjs/components/workflow/components/PrioritySelector/PrioritySelector.js

@@ -9,8 +9,12 @@ var ramda_1 = require("ramda");
 var DropDownSelector_1 = __importDefault(require("../../../DropDownSelector/DropDownSelector"));
 var useWorkflowPriority_1 = require("../../hooks/useWorkflowPriority");
 var PrioritySelector = function (_a) {
-    var taskId = _a.taskId, priority = _a.priority, className = _a.className;
-    var _b = useWorkflowPriority_1.useWorkflowPriority({ taskId: taskId, priority: priority }), priorities = _b.priorities, updatePriority = _b.updatePriority, updateRequestIsInProgress = _b.updateRequestIsInProgress, readOnly = _b.readOnly;
+    var taskId = _a.taskId, priority = _a.priority, isTaskOpen = _a.isTaskOpen, className = _a.className;
+    var _b = useWorkflowPriority_1.useWorkflowPriority({
+        taskId: taskId,
+        priority: priority,
+        isOpen: isTaskOpen
+    }), priorities = _b.priorities, updatePriority = _b.updatePriority, updateRequestIsInProgress = _b.updateRequestIsInProgress, readOnly = _b.readOnly;
     var disabled = updateRequestIsInProgress || readOnly;
     return (react_1.default.createElement(DropDownSelector_1.default, { className: className, isDisabled: disabled, options: priorities, onChange: updatePriority, hideSelectedOptions: false, label: ui_i18n_1.default.text('Priority'), value: priorities.find(ramda_1.propEq('value', priority)), TextFieldProps: { disabled: disabled }, height: 40 }));
 };

package/cjs/components/workflow/components/TaskActions/TaskActions.d.ts

@@ -1,5 +1,7 @@
 /// <reference types="react" />
 import { WorkflowTaskData } from '@reltio/mdm-sdk';
-declare type Props = Pick<WorkflowTaskData, 'taskId' | 'possibleActions' | 'assignee'>;
-declare const TaskActions: ({ taskId, possibleActions, assignee }: Props) => JSX.Element;
+declare type Props = Pick<WorkflowTaskData, 'taskId' | 'possibleActions' | 'assignee'> & {
+    isTaskOpen?: WorkflowTaskData['isOpen'];
+};
+declare const TaskActions: ({ taskId, possibleActions, assignee, isTaskOpen }: Props) => JSX.Element;
 export default TaskActions;

package/cjs/components/workflow/components/TaskActions/TaskActions.js

@@ -9,8 +9,13 @@ var useWorkflowActions_1 = require("../../hooks/useWorkflowActions");
 var DropDownMenuButton_1 = __importDefault(require("../../../DropDownMenuButton/DropDownMenuButton"));
 var SmallIconButton_1 = __importDefault(require("../../../SmallIconButton/SmallIconButton"));
 var TaskActions = function (_a) {
-    var taskId = _a.taskId, possibleActions = _a.possibleActions, assignee = _a.assignee;
-    var _b = useWorkflowActions_1.useWorkflowActions({ taskId: taskId, possibleActions: possibleActions, assignee: assignee }), actions = _b.actions, disabled = _b.actionRequestIsInProgress;
+    var taskId = _a.taskId, possibleActions = _a.possibleActions, assignee = _a.assignee, isTaskOpen = _a.isTaskOpen;
+    var _b = useWorkflowActions_1.useWorkflowActions({
+        taskId: taskId,
+        possibleActions: possibleActions,
+        assignee: assignee,
+        isOpen: isTaskOpen
+    }), actions = _b.actions, disabled = _b.actionRequestIsInProgress;
     return actions.length > 0 ? (react_1.default.createElement(DropDownMenuButton_1.default, { buttonComponent: SmallIconButton_1.default, buttonProps: {
             icon: MoreVert_1.default,
             size: 'L',

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

@@ -1,6 +1,7 @@
-export function WorkflowComments({ processInstanceComments, taskId }: {
+export function WorkflowComments({ processInstanceComments, taskId, isTaskOpen }: {
     processInstanceComments: any;
     taskId: any;
+    isTaskOpen: any;
 }): JSX.Element;
 export namespace WorkflowComments {
     namespace propTypes {

package/cjs/components/workflow/components/WorkflowComments/WorkflowComments.js

@@ -37,11 +37,15 @@ var useWorkflowComments_1 = require("../../hooks/useWorkflowComments");
 var SmallIconButton_1 = require("../../../SmallIconButton");
 var getValue = function (e) { return e.target.value; };
 var WorkflowComments = function (_a) {
-    var processInstanceComments = _a.processInstanceComments, taskId = _a.taskId;
+    var processInstanceComments = _a.processInstanceComments, taskId = _a.taskId, isTaskOpen = _a.isTaskOpen;
     var styles = styles_1.useWorkflowStyles();
     var _b = react_1.useState(false), expanded = _b[0], setExpanded = _b[1];
     var _c = react_1.useState(''), comment = _c[0], setComment = _c[1];
-    var _d = useWorkflowComments_1.useWorkflowComments({ processInstanceComments: processInstanceComments, taskId: taskId }), comments = _d.comments, writeComment = _d.writeComment, readOnly = _d.readOnly;
+    var _d = useWorkflowComments_1.useWorkflowComments({
+        processInstanceComments: processInstanceComments,
+        taskId: taskId,
+        isOpen: isTaskOpen
+    }), comments = _d.comments, writeComment = _d.writeComment, readOnly = _d.readOnly;
     var sendComment = react_1.useCallback(function () {
         writeComment(comment);
         setComment('');

package/cjs/components/workflow/helpers/index.d.ts

@@ -1,3 +1,5 @@
+import { WorkflowTaskData } from '@reltio/mdm-sdk';
 declare const getDCRUri: (objectUris?: string[]) => string;
 declare const getDCRId: (objectUris?: string[]) => string;
-export { getDCRUri, getDCRId };
+declare const isOpenTask: (isOpen: WorkflowTaskData['isOpen']) => boolean;
+export { getDCRUri, getDCRId, isOpenTask };

package/cjs/components/workflow/helpers/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getDCRId = exports.getDCRUri = void 0;
+exports.isOpenTask = exports.getDCRId = exports.getDCRUri = void 0;
 var ramda_1 = require("ramda");
 var getDCRUri = function (objectUris) {
     if (objectUris === void 0) { objectUris = []; }
@@ -12,3 +12,5 @@ var getDCRId = function (objectUris) {
     return ramda_1.pipe(getDCRUri, ramda_1.unless(ramda_1.isNil, ramda_1.pipe(ramda_1.split('/'), ramda_1.nth(1))))(objectUris);
 };
 exports.getDCRId = getDCRId;
+var isOpenTask = function (isOpen) { return isOpen === undefined || isOpen === true; };
+exports.isOpenTask = isOpenTask;

package/cjs/components/workflow/hooks/useWorkflowActions.d.ts

@@ -3,7 +3,7 @@ declare type TaskAction = {
     text: string;
     onClick: () => void;
 };
-export declare const useWorkflowActions: ({ possibleActions, assignee, taskId }: Pick<WorkflowTaskData, 'taskId' | 'possibleActions' | 'assignee'>) => {
+export declare const useWorkflowActions: ({ possibleActions, assignee, taskId, isOpen }: Pick<WorkflowTaskData, 'taskId' | 'possibleActions' | 'assignee' | 'isOpen'>) => {
     actions: TaskAction[];
     actionRequestIsInProgress: boolean;
 };

package/cjs/components/workflow/hooks/useWorkflowActions.js

@@ -27,8 +27,9 @@ var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
 var ViewIdContext_1 = require("../../../contexts/ViewIdContext");
 var errors_1 = require("../helpers/errors");
 var WorkflowTasksContext_1 = require("../../../contexts/WorkflowTasksContext");
+var helpers_1 = require("../helpers");
 var useWorkflowActions = function (_a) {
-    var possibleActions = _a.possibleActions, assignee = _a.assignee, taskId = _a.taskId;
+    var possibleActions = _a.possibleActions, assignee = _a.assignee, taskId = _a.taskId, isOpen = _a.isOpen;
     var loadWorkflowTasks = (react_1.useContext(WorkflowTasksContext_1.WorkflowTasksContext) || {}).loadWorkflowTasks;
     var workflowPath = react_redux_1.useSelector(mdm_module_1.default.selectors.getWorkflowPath);
     var environment = react_redux_1.useSelector(mdm_module_1.default.selectors.getWorkflowEnvironmentUrl);
@@ -65,7 +66,7 @@ var useWorkflowActions = function (_a) {
         }
     }; }, [workflowPath, taskId, environment, tenant, dispatch, entityUri, viewId, loadWorkflowTasks]);
     var actions = react_1.useMemo(function () {
-        return username === assignee
+        return username === assignee && helpers_1.isOpenTask(isOpen)
             ? (possibleActions || []).map(function (_a) {
                 var action = _a.action, label = _a.label;
                 return ({
@@ -74,7 +75,7 @@ var useWorkflowActions = function (_a) {
                 });
             })
             : [];
-    }, [possibleActions, performTaskAction, username, assignee]);
+    }, [possibleActions, performTaskAction, username, assignee, isOpen]);
     return { actions: actions, actionRequestIsInProgress: actionRequestIsInProgress };
 };
 exports.useWorkflowActions = useWorkflowActions;

package/cjs/components/workflow/hooks/useWorkflowAssignee.d.ts

@@ -3,7 +3,7 @@ declare type AssigneeOption = {
     label: string;
     value: string;
 };
-export declare const useWorkflowAssignee: ({ assignee, taskId }: Pick<WorkflowTaskData, 'taskId' | 'assignee'>) => {
+export declare const useWorkflowAssignee: ({ assignee, taskId, isOpen }: Pick<WorkflowTaskData, 'taskId' | 'assignee' | 'isOpen'>) => {
     assignee: AssigneeOption;
     getAssignees: (text: any) => Promise<void | unknown[]>;
     updateAssignee: (newValue: AssigneeOption) => void;

package/cjs/components/workflow/hooks/useWorkflowAssignee.js

@@ -13,12 +13,13 @@ var hooks_1 = require("../../../hooks");
 var WorkflowTasksContext_1 = require("../../../contexts/WorkflowTasksContext");
 var errors_1 = require("../helpers/errors");
 var useWorkflowCheckPermission_1 = require("./useWorkflowCheckPermission");
+var helpers_1 = require("../helpers");
 var assigneeToValue = function (assignee) { return ({
     label: assignee,
     value: assignee
 }); };
 var useWorkflowAssignee = function (_a) {
-    var assignee = _a.assignee, taskId = _a.taskId;
+    var assignee = _a.assignee, taskId = _a.taskId, isOpen = _a.isOpen;
     var updateTaskState = (react_1.useContext(WorkflowTasksContext_1.WorkflowTasksContext) || {}).updateTaskState;
     var workflowPath = react_redux_1.useSelector(mdm_module_1.default.selectors.getWorkflowPath);
     var environment = react_redux_1.useSelector(mdm_module_1.default.selectors.getWorkflowEnvironmentUrl);
@@ -29,7 +30,7 @@ var useWorkflowAssignee = function (_a) {
     var _c = react_1.useState(), assignees = _c[0], setAssignees = _c[1];
     var _d = react_1.useState(false), updateRequestIsInProgress = _d[0], setUpdateRequestIsInProgress = _d[1];
     var checkWorkflowPermission = useWorkflowCheckPermission_1.useWorkflowCheckPermission();
-    var canUpdateTask = checkWorkflowPermission('UPDATE_TASK');
+    var canUpdateTask = checkWorkflowPermission('UPDATE_TASK') && helpers_1.isOpenTask(isOpen);
     react_1.useEffect(function () {
         setCurrentAssignee(assigneeToValue(assignee));
     }, [assignee]);

package/cjs/components/workflow/hooks/useWorkflowComments.d.ts

@@ -1,5 +1,5 @@
 import { WorkflowTaskData } from '@reltio/mdm-sdk';
-export declare const useWorkflowComments: ({ processInstanceComments, taskId }: WorkflowTaskData) => {
+export declare const useWorkflowComments: ({ processInstanceComments, taskId, isOpen }: WorkflowTaskData) => {
     comments: any[];
     requestIsInProgress: boolean;
     writeComment: (comment: any) => void;