@reltio/components 1.4.2017 → 1.4.2019

package/cjs/BasicTable/IntegrationBasicTable.test.js

@@ -53,16 +53,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var react_2 = require("@testing-library/react");
 var user_event_1 = __importDefault(require("@testing-library/user-event"));
-var react_dnd_html5_backend_1 = __importDefault(require("react-dnd-html5-backend"));
-var react_dnd_1 = require("react-dnd");
+var dndKit_1 = require("../test-utils/dndKit");
+jest.mock('@dnd-kit/core', function () { return dndKit_1.mockDndKit; });
 var BasicTable_1 = require("./BasicTable");
 var CollapseRowButton_1 = require("../CollapseRowButton");
 var test_utils_1 = require("../test-utils");
 var FirstColumnRenderer = function (_a) {
-    var value = _a.value, rowValue = _a.rowValue, rowIndex = _a.rowIndex, dragRef = _a.dragRef;
+    var value = _a.value, rowValue = _a.rowValue, rowIndex = _a.rowIndex, draggableProps = _a.draggableProps;
     return (react_1.default.createElement("div", null,
         react_1.default.createElement(CollapseRowButton_1.CollapseRowButton, { rowIndex: rowIndex, rowValue: rowValue }),
-        react_1.default.createElement("div", { ref: dragRef }, "drag el"),
+        react_1.default.createElement("div", __assign({}, draggableProps), "drag el"),
         react_1.default.createElement("div", null, value.name)));
 };
 var SecondColumnRenderer = function (_a) {
@@ -122,11 +122,7 @@ var defaultProps = {
 };
 var setUp = function (props) {
     var user = user_event_1.default.setup();
-    var Providers = function (_a) {
-        var children = _a.children;
-        return react_1.default.createElement(react_dnd_1.DndProvider, { backend: react_dnd_html5_backend_1.default }, children);
-    };
-    return __assign(__assign({}, (0, react_2.render)(react_1.default.createElement(BasicTable_1.BasicTable, __assign({}, props)), { wrapper: Providers })), { user: user });
+    return __assign(__assign({}, (0, react_2.render)(react_1.default.createElement(BasicTable_1.BasicTable, __assign({}, props)))), { user: user });
 };
 describe('basic table tests', function () {
     it('should collapse all rows after start dragging', function () { return __awaiter(void 0, void 0, void 0, function () {
@@ -158,7 +154,7 @@ describe('basic table tests', function () {
                     dragIndicator = (0, react_2.within)(getCellByIndexes(1, 0)).queryByText('drag el');
                     return [4 /*yield*/, (0, react_2.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
-                                react_2.fireEvent.dragStart(dragIndicator);
+                                react_2.fireEvent.mouseDown(dragIndicator);
                                 return [2 /*return*/];
                             });
                         }); })];
@@ -169,14 +165,6 @@ describe('basic table tests', function () {
                     expect((0, react_2.within)(getCellByIndexes(0, 1)).queryByText('row 1 value 3')).not.toBeInTheDocument();
                     expect((0, react_2.within)(getCellByIndexes(1, 1)).queryByText('row 2 value 1')).toBeInTheDocument();
                     expect((0, react_2.within)(getCellByIndexes(1, 1)).queryByText('row 2 value 2')).not.toBeInTheDocument();
-                    return [4 /*yield*/, (0, react_2.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
-                            return __generator(this, function (_a) {
-                                react_2.fireEvent.dragEnd(getCellByIndexes(1, 0));
-                                return [2 /*return*/];
-                            });
-                        }); })];
-                case 4:
-                    _a.sent();
                     unmockTableSizing();
                     return [2 /*return*/];
             }

package/cjs/EditModeAttributesView/IntegrationEditModeAttributesView.test.js

@@ -53,8 +53,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var user_event_1 = __importDefault(require("@testing-library/user-event"));
 var react_2 = require("@testing-library/react");
-var react_dnd_1 = require("react-dnd");
-var react_dnd_html5_backend_1 = __importDefault(require("react-dnd-html5-backend"));
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var EditModeAttributesView_1 = require("./EditModeAttributesView");
 var MdmModuleContext_1 = require("../contexts/MdmModuleContext");
@@ -111,9 +109,8 @@ describe('EditModeAttributesView tests', function () {
         var user = user_event_1.default.setup(userOptions);
         var Providers = function (_a) {
             var children = _a.children;
-            return (react_1.default.createElement(react_dnd_1.DndProvider, { backend: react_dnd_html5_backend_1.default },
-                react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: mdmValues, actions: mdmActions },
-                    react_1.default.createElement(ScrollToElementContext_1.ScrollToElementProvider, null, children))));
+            return (react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: mdmValues, actions: mdmActions },
+                react_1.default.createElement(ScrollToElementContext_1.ScrollToElementProvider, null, children)));
         };
         return __assign({ user: user }, (0, react_2.render)(react_1.default.createElement(EditModeAttributesView_1.EditModeAttributesView, __assign({}, props)), { wrapper: Providers }));
     };

package/cjs/ImageAttributesLineEditor/ImageAttributesLineEditor.test.js

@@ -18,8 +18,6 @@ var react_1 = __importDefault(require("react"));
 var test_utils_1 = require("react-dom/test-utils");
 var react_resize_detector_1 = __importDefault(require("react-resize-detector"));
 var enzyme_1 = require("enzyme");
-var react_dnd_1 = require("react-dnd");
-var react_dnd_html5_backend_1 = __importDefault(require("react-dnd-html5-backend"));
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var Image_1 = require("../Image");
 var EmptyStub_1 = require("../EmptyStub");
@@ -96,9 +94,8 @@ var defaultProps = {
 };
 var setUp = function (_a) {
     var _b = _a === void 0 ? {} : _a, _c = _b.props, props = _c === void 0 ? defaultProps : _c, _d = _b.mdmValues, mdmValues = _d === void 0 ? defaultMdmValues : _d, _e = _b.mdmActions, mdmActions = _e === void 0 ? defaultMdmActions : _e;
-    return (0, enzyme_1.mount)(react_1.default.createElement(react_dnd_1.DndProvider, { backend: react_dnd_html5_backend_1.default },
-        react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: mdmValues, actions: mdmActions },
-            react_1.default.createElement(ImageAttributesLineEditor_1.ImageAttributesLineEditor, __assign({}, props)))));
+    return (0, enzyme_1.mount)(react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: mdmValues, actions: mdmActions },
+        react_1.default.createElement(ImageAttributesLineEditor_1.ImageAttributesLineEditor, __assign({}, props))));
 };
 describe('ImageAttributesLineEditor edit tests', function () {
     beforeAll(function () {

package/cjs/InlineAttributesPager/components/InlineSimpleAttributesBlock/InlineSimpleAttributesBlock.js

@@ -10,6 +10,29 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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 __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -26,37 +49,48 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InlineSimpleAttributesBlock = void 0;
-var react_1 = __importDefault(require("react"));
+var react_1 = __importStar(require("react"));
 var ui_i18n_1 = __importDefault(require("ui-i18n"));
-var react_dnd_1 = require("react-dnd");
+var core_1 = require("@dnd-kit/core");
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var InlineSimpleAttribute_1 = require("../../../InlineSimpleAttribute");
 var styles_1 = require("./styles");
 var InlineSimpleAttributesBlock = function (_a) {
     var attributeValues = _a.attributeValues, attributeType = _a.attributeType, parentUri = _a.parentUri, disableEdit = _a.disableEdit, crosswalksMap = _a.crosswalksMap, onAdd = _a.onAdd, emptyTempAttributeUris = _a.emptyTempAttributeUris, props = __rest(_a, ["attributeValues", "attributeType", "parentUri", "disableEdit", "crosswalksMap", "onAdd", "emptyTempAttributeUris"]);
     var styles = (0, styles_1.useStyles)();
-    var _b = (0, react_dnd_1.useDrop)({
-        accept: 'Crosswalk',
-        canDrop: function (_a) {
-            var crosswalk = _a.crosswalk;
-            var isRelationCrosswalk = (0, mdm_sdk_1.isRelationUri)(crosswalk.uri) || crosswalk.ownerType === 'relation';
-            var isEntityCrosswalk = (0, mdm_sdk_1.isEntityUri)(crosswalk.uri) && crosswalk.ownerType === 'entity';
-            return ((0, mdm_sdk_1.checkMetadataForCreate)(mdm_sdk_1.Mode.Editing, attributeType) &&
-                !disableEdit &&
-                ((isRelationCrosswalk && (0, mdm_sdk_1.isRelationTypeUri)(attributeType.uri)) ||
-                    (isEntityCrosswalk && (0, mdm_sdk_1.isEntityTypeUri)(attributeType.uri))));
+    var _b = (0, react_1.useState)(false), isDragItemOver = _b[0], setIsDragItemOver = _b[1];
+    var checkCanAddCrosswalk = (0, react_1.useCallback)(function (event) {
+        var _a;
+        var draggingData = event.active.data.current;
+        var crosswalk = draggingData === null || draggingData === void 0 ? void 0 : draggingData.crosswalk;
+        return (!disableEdit &&
+            (draggingData === null || draggingData === void 0 ? void 0 : draggingData.type) === 'Crosswalk' &&
+            attributeType.uri === ((_a = event.over) === null || _a === void 0 ? void 0 : _a.id) &&
+            crosswalk &&
+            (0, mdm_sdk_1.canAddCrosswalk)(crosswalk, attributeType));
+    }, [disableEdit, attributeType]);
+    (0, core_1.useDndMonitor)({
+        onDragOver: function (event) {
+            setIsDragItemOver(checkCanAddCrosswalk(event));
         },
-        collect: function (monitor) { return ({
-            isDragItemOver: monitor.isOver() && monitor.canDrop()
-        }); },
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-        drop: function (_a, monitor) {
-            var crosswalk = _a.crosswalk;
-            onAdd({ attributeType: attributeType, crosswalk: crosswalk, parentUri: parentUri, index: attributeValues.length });
+        onDragEnd: function (event) {
+            var draggingData = event.active.data.current;
+            var crosswalk = draggingData === null || draggingData === void 0 ? void 0 : draggingData.crosswalk;
+            if (checkCanAddCrosswalk(event)) {
+                onAdd({ attributeType: attributeType, crosswalk: crosswalk, parentUri: parentUri, index: attributeValues.length });
+            }
+            setIsDragItemOver(false);
+        }
+    });
+    var setNodeRef = (0, core_1.useDroppable)({
+        id: attributeType.uri,
+        data: {
+            type: 'Crosswalk',
+            attributeType: attributeType
         }
-    }), isDragItemOver = _b[0].isDragItemOver, drop = _b[1];
+    }).setNodeRef;
     var attributeIndex = 0;
-    return (react_1.default.createElement("div", { ref: drop, className: styles.simpleAttributesWrapper, "data-reltio-id": 'simple-attributes-wrapper' },
+    return (react_1.default.createElement("div", { ref: setNodeRef, className: styles.simpleAttributesWrapper, "data-reltio-id": 'simple-attributes-wrapper' },
         attributeValues.map(function (value) {
             var _a;
             return (_a = crosswalksMap[value.uri]) === null || _a === void 0 ? void 0 : _a.map(function (crosswalk) { return (react_1.default.createElement(InlineSimpleAttribute_1.InlineSimpleAttribute, __assign({ key: value.uri + crosswalk.uri, attributeType: attributeType, attributeValue: value, crosswalk: crosswalk, disableEdit: disableEdit, isEmpty: emptyTempAttributeUris.includes(value.uri), dataReltioId: "value-index-".concat(attributeIndex++) }, props))); });

package/cjs/InlineAttributesPager/components/InlineSimpleAttributesBlock/InlineSimpleAttributesBlock.test.js

@@ -10,38 +10,15 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-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 });
 var react_1 = __importDefault(require("react"));
-var enzyme_1 = require("enzyme");
 var InlineSimpleAttributesBlock_1 = require("./InlineSimpleAttributesBlock");
-var reactDnd = __importStar(require("react-dnd"));
-jest.mock('react-dnd', function () { return (__assign(__assign({}, jest.requireActual('react-dnd')), { useDrop: jest.fn() })); });
+var core_1 = require("@dnd-kit/core");
+var react_2 = require("@testing-library/react");
+jest.mock('@dnd-kit/core', function () { return (__assign(__assign({}, jest.requireActual('@dnd-kit/core')), { useDndMonitor: jest.fn() })); });
 describe('InlineSimpleAttributesBlock tests', function () {
     var attributeType = {
         uri: 'configuration/entityTypes/HCP/attributes/Simple',
@@ -101,43 +78,52 @@ describe('InlineSimpleAttributesBlock tests', function () {
         onEdit: jest.fn(),
         onDelete: jest.fn()
     };
-    var props = __assign({ attributeValues: attributeValues, crosswalksMap: crosswalksMap, parentUri: 'entities/1', onAdd: jest.fn(), emptyTempAttributeUris: [] }, commonProps);
-    var useDropMock = jest.spyOn(reactDnd, 'useDrop').mockReturnValue([{}, function () { return null; }]);
+    var defaultProps = __assign({ attributeValues: attributeValues, crosswalksMap: crosswalksMap, parentUri: 'entities/1', onAdd: jest.fn(), emptyTempAttributeUris: [] }, commonProps);
+    var getDragEvent = function (draggingData, attributeType) { return ({
+        active: {
+            data: {
+                current: __assign({}, draggingData)
+            }
+        },
+        over: {
+            id: attributeType.uri
+        }
+    }); };
+    var setUp = function (props) {
+        if (props === void 0) { props = defaultProps; }
+        var Providers = function (_a) {
+            var children = _a.children;
+            return react_1.default.createElement(core_1.DndContext, null, children);
+        };
+        return (0, react_2.render)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props)), { wrapper: Providers });
+    };
     it('should render values for each crosswalk', function () {
-        var wrapper = (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props)));
-        var attributes = wrapper.find('InlineSimpleAttribute');
-        expect(attributes.length).toBe(3);
-        attributes.forEach(function (attribute) {
-            expect(attribute.props()).toMatchObject(commonProps);
-        });
-        expect(attributes.at(0).prop('attributeValue')).toBe(attributeValues[0]);
-        expect(attributes.at(0).prop('crosswalk')).toBe(crosswalks[0]);
-        expect(attributes.at(1).prop('attributeValue')).toBe(attributeValues[1]);
-        expect(attributes.at(1).prop('crosswalk')).toBe(crosswalks[0]);
-        expect(attributes.at(2).prop('attributeValue')).toBe(attributeValues[1]);
-        expect(attributes.at(2).prop('crosswalk')).toBe(crosswalks[1]);
+        setUp();
+        expect(react_2.screen.getByText(attributeValues[0].value)).toBeInTheDocument();
+        expect(react_2.screen.getAllByText(attributeValues[1].value)).toHaveLength(2);
     });
-    describe('dnd', function () {
-        afterEach(function () {
-            useDropMock.mockClear();
-        });
-        it('should accept Crosswalk drag items', function () {
-            (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props)));
-            var accept = useDropMock.mock.calls[0][0].accept;
-            expect(accept).toEqual('Crosswalk');
+    describe('dnd behavior', function () {
+        var onDragOver, onDragEnd;
+        beforeAll(function () {
+            core_1.useDndMonitor.mockImplementation(function (listeners) {
+                onDragOver = listeners.onDragOver;
+                onDragEnd = listeners.onDragEnd;
+            });
         });
         it('should not allow drop relation crosswalk on entity attribute', function () {
-            (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props)));
-            var canDrop = useDropMock.mock.calls[0][0].canDrop;
-            expect(canDrop({
-                type: 'Crosswalk',
-                crosswalk: {
-                    uri: 'entities/1/crosswalks/1',
-                    ownerType: 'relation',
-                    type: 'configuration/sources/FB',
-                    value: '123'
-                }
-            }, {})).toBe(false);
+            setUp();
+            (0, react_2.act)(function () {
+                onDragOver(getDragEvent({
+                    type: 'Crosswalk',
+                    crosswalk: {
+                        uri: 'entities/1/crosswalks/1',
+                        ownerType: 'relation',
+                        type: 'configuration/sources/FB',
+                        value: '123'
+                    }
+                }, defaultProps.attributeType));
+            });
+            expect(react_2.screen.queryByText('Drop here')).not.toBeInTheDocument();
         });
         it('should allow drop relation crosswalk on relation attribute', function () {
             var attributeType = {
@@ -160,26 +146,31 @@ describe('InlineSimpleAttributesBlock tests', function () {
                     ov: false
                 }
             ];
-            (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props, { attributeType: attributeType, attributeValues: attributeValues })));
-            var canDrop = useDropMock.mock.calls[0][0].canDrop;
-            expect(canDrop({
-                type: 'Crosswalk',
-                crosswalk: {
-                    uri: 'relations/1/crosswalks/1',
-                    ownerType: 'entity',
-                    type: 'configuration/sources/FB',
-                    value: '123'
-                }
-            }, {})).toBe(true);
-            expect(canDrop({
-                type: 'Crosswalk',
-                crosswalk: {
-                    uri: 'entities/1/crosswalks/1',
-                    ownerType: 'relation',
-                    type: 'configuration/sources/FB',
-                    value: '123'
-                }
-            }, {})).toBe(true);
+            setUp(__assign(__assign({}, defaultProps), { attributeType: attributeType, attributeValues: attributeValues }));
+            (0, react_2.act)(function () {
+                onDragOver(getDragEvent({
+                    type: 'Crosswalk',
+                    crosswalk: {
+                        uri: 'relations/1/crosswalks/1',
+                        ownerType: 'entity',
+                        type: 'configuration/sources/FB',
+                        value: '123'
+                    }
+                }, attributeType));
+            });
+            expect(react_2.screen.getByText('Drop here')).toBeInTheDocument();
+            (0, react_2.act)(function () {
+                onDragOver(getDragEvent({
+                    type: 'Crosswalk',
+                    crosswalk: {
+                        uri: 'entities/1/crosswalks/1',
+                        ownerType: 'relation',
+                        type: 'configuration/sources/FB',
+                        value: '123'
+                    }
+                }, attributeType));
+            });
+            expect(react_2.screen.getByText('Drop here')).toBeInTheDocument();
         });
         it('should not allow drop entity crosswalk on relation attribute', function () {
             var attributeType = {
@@ -202,76 +193,70 @@ describe('InlineSimpleAttributesBlock tests', function () {
                     ov: false
                 }
             ];
-            (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props, { attributeType: attributeType, attributeValues: attributeValues })));
-            var canDrop = useDropMock.mock.calls[0][0].canDrop;
-            expect(canDrop({
-                type: 'Crosswalk',
-                crosswalk: {
-                    uri: 'entities/1/crosswalks/1',
-                    ownerType: 'entity',
-                    type: 'configuration/sources/FB',
-                    value: '123'
-                }
-            }, {})).toBe(false);
+            setUp(__assign(__assign({}, defaultProps), { attributeType: attributeType, attributeValues: attributeValues }));
+            (0, react_2.act)(function () {
+                onDragOver(getDragEvent({
+                    type: 'Crosswalk',
+                    crosswalk: {
+                        uri: 'entities/1/crosswalks/1',
+                        ownerType: 'entity',
+                        type: 'configuration/sources/FB',
+                        value: '123'
+                    }
+                }, attributeType));
+            });
+            expect(react_2.screen.queryByText('Drop here')).not.toBeInTheDocument();
         });
         it('should not allow drop crosswalk on entity attribute without permission to create', function () {
             var readOnlyAttrType = __assign(__assign({}, attributeType), { access: ['READ'] });
-            (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props, { attributeType: readOnlyAttrType })));
-            var canDrop = useDropMock.mock.calls[0][0].canDrop;
-            expect(canDrop({
-                type: 'Crosswalk',
-                crosswalk: {
-                    uri: 'entities/1/crosswalks/1',
-                    ownerType: 'entity',
-                    type: 'configuration/sources/FB',
-                    value: '123'
-                }
-            }, {})).toBe(false);
+            setUp(__assign(__assign({}, defaultProps), { attributeType: readOnlyAttrType, attributeValues: attributeValues }));
+            (0, react_2.act)(function () {
+                onDragOver(getDragEvent({
+                    type: 'Crosswalk',
+                    crosswalk: {
+                        uri: 'entities/1/crosswalks/1',
+                        ownerType: 'entity',
+                        type: 'configuration/sources/FB',
+                        value: '123'
+                    }
+                }, readOnlyAttrType));
+            });
+            expect(react_2.screen.queryByText('Drop here')).not.toBeInTheDocument();
         });
         it('should not allow drop crosswalk on attribute if parent attribute can not be edited', function () {
-            (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props, { disableEdit: true })));
-            var canDrop = useDropMock.mock.calls[0][0].canDrop;
-            expect(canDrop({
-                type: 'Crosswalk',
-                crosswalk: {
-                    uri: 'entities/1/crosswalks/1',
-                    ownerType: 'entity',
-                    type: 'configuration/sources/FB',
-                    value: '123'
-                }
-            }, {})).toBe(false);
-        });
-        it('should render drop indicator if crosswalks is over and can be dropped', function () {
-            var wrapper = (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props)));
-            var _a = useDropMock.mock.calls[0][0], canDrop = _a.canDrop, collect = _a.collect;
-            expect(canDrop({
-                type: 'Crosswalk',
-                crosswalk: {
-                    uri: 'entities/1/crosswalks/1',
-                    ownerType: 'entity',
-                    type: 'configuration/sources/FB',
-                    value: '123'
-                }
-            }, {})).toBe(true);
-            expect(wrapper.find('.dropIndicator')).toHaveLength(0);
-            collect({ isOver: function () { return true; }, canDrop: function () { return true; } });
-            expect(wrapper.find('.dropIndicator')).toHaveLength(0);
+            setUp(__assign(__assign({}, defaultProps), { disableEdit: true }));
+            (0, react_2.act)(function () {
+                onDragOver(getDragEvent({
+                    type: 'Crosswalk',
+                    crosswalk: {
+                        uri: 'entities/1/crosswalks/1',
+                        ownerType: 'entity',
+                        type: 'configuration/sources/FB',
+                        value: '123'
+                    }
+                }, defaultProps.attributeType));
+            });
+            expect(react_2.screen.queryByText('Drop here')).not.toBeInTheDocument();
         });
         it('should call props.onAdd on crosswalk drop', function () {
-            (0, enzyme_1.shallow)(react_1.default.createElement(InlineSimpleAttributesBlock_1.InlineSimpleAttributesBlock, __assign({}, props)));
-            var drop = useDropMock.mock.calls[0][0].drop;
+            setUp();
             var crosswalk = {
                 uri: 'entities/1/crosswalks/1',
                 ownerType: 'entity',
                 type: 'configuration/sources/FB',
                 value: '123'
             };
-            drop({ crosswalk: crosswalk, type: 'Crosswalk' }, {});
-            expect(props.onAdd).toHaveBeenCalledWith({
-                parentUri: props.parentUri,
-                attributeType: props.attributeType,
+            (0, react_2.act)(function () {
+                onDragEnd(getDragEvent({
+                    type: 'Crosswalk',
+                    crosswalk: crosswalk
+                }, defaultProps.attributeType));
+            });
+            expect(defaultProps.onAdd).toHaveBeenCalledWith({
+                parentUri: defaultProps.parentUri,
+                attributeType: defaultProps.attributeType,
                 crosswalk: crosswalk,
-                index: props.attributeValues.length
+                index: defaultProps.attributeValues.length
             });
         });
     });

package/cjs/InlineSimpleAttribute/InlineSimpleAttribute.js

@@ -65,7 +65,7 @@ var InlineSimpleAttribute = function (_a) {
     var showIgnore = !isTemporary && ((!isReadingMode && hasBasicPermission) || attributeValue.ignored);
     var showMaskingSwitcher = (isUnmaskingNeeded && !isTemporary && !isReadingMode) || isUnmasking;
     (0, react_1.useEffect)(function () {
-        if (isTemporary && !isEmpty) {
+        if (isTemporary && isEmpty) {
             setEditingMode();
         }
     }, [isEmpty]);

package/cjs/LineChart/helpers.d.ts

@@ -3,8 +3,8 @@ import { LineChartOptions } from '@reltio/mdm-sdk';
 import { CartesianGridProps, LineChart, LineProps, TooltipProps, XAxisProps, YAxisProps } from 'recharts';
 type LineChartSettings = {
     lineChart: React.ComponentProps<typeof LineChart>;
-    xAxis: XAxisProps;
-    yAxis: YAxisProps;
+    xAxis: Omit<XAxisProps, 'ref'>;
+    yAxis: Omit<YAxisProps, 'ref'>;
     cartesianGrid: Omit<CartesianGridProps, 'ref'>;
     tooltip: TooltipProps<number, string>;
     line: Omit<LineProps, 'ref'>;

package/cjs/PieChart/PieChart.test.js

@@ -114,11 +114,15 @@ describe('PieChart', function () {
         expect(wrapper.find(recharts_1.Pie).prop('innerRadius')).toBe('50%');
     });
     it('should call props.onItemClick on sector click', function () {
+        jest.useFakeTimers();
         var onItemClick = jest.fn();
         var wrapper = (0, enzyme_1.mount)(react_1.default.createElement(PieChart_1.PieChart, { width: 600, height: 300, data: data, onItemClick: onItemClick }));
+        jest.runAllTimers();
+        wrapper.update();
         var sector = wrapper.find('.recharts-pie-sector').first();
         sector.simulate('click');
         expect(onItemClick).toHaveBeenCalledWith('1');
+        jest.useRealTimers();
     });
     it('should render chart legend with percents correctly', function () {
         var legendPayload = [

package/cjs/SimpleAttribute/IntegrationSimpleAttribute.test.js

@@ -68,21 +68,25 @@ describe('masking/unmasking behaviour', function () {
     });
     var defaultAttributeType = { type: 'String', name: 'Name', uri: 'URI', masking: { regexPattern: '.*' } };
     var defaultAttributeValue = { value: 'Masked value', uri: 'entities/16U21B8f/attributes/Name/2sAfjGOIh' };
-    var setUp = function (isMaskingNeeded) {
-        if (isMaskingNeeded === void 0) { isMaskingNeeded = true; }
-        var attributeType = isMaskingNeeded ? defaultAttributeType : (0, ramda_1.dissoc)('masking', defaultAttributeType);
+    var defaultProps = {
+        attributeType: defaultAttributeType,
+        attributeValue: defaultAttributeValue
+    };
+    var setUp = function (props) {
+        if (props === void 0) { props = defaultProps; }
         var Providers = function (_a) {
             var children = _a.children;
             return (react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: { mode: mdm_sdk_1.Mode.Viewing } },
                 react_1.default.createElement(MaskedAttributesContext_1.MaskedAttributesProvider, null, children)));
         };
         var user = user_event_1.default.setup();
-        return __assign({ user: user }, (0, react_2.render)(react_1.default.createElement(SimpleAttribute_1.SimpleAttribute, { attributeType: attributeType, attributeValue: defaultAttributeValue }), {
+        return __assign({ user: user }, (0, react_2.render)(react_1.default.createElement(SimpleAttribute_1.SimpleAttribute, __assign({}, props)), {
             wrapper: Providers
         }));
     };
     it('should not render MaskingSwitcher if attribute should not be masked', function () {
-        var container = setUp(false).container;
+        var attributeType = (0, ramda_1.dissoc)('masking', defaultAttributeType);
+        var container = setUp(__assign(__assign({}, defaultProps), { attributeType: attributeType })).container;
         expect(container.querySelector('.switcherWrapper')).not.toBeInTheDocument();
     });
     it('should render MaskingSwitcher if attribute should be masked', function () {
@@ -173,4 +177,16 @@ describe('masking/unmasking behaviour', function () {
             }
         });
     }); });
+    it('should not format date attribute if it is masked', function () {
+        var attributeType = { type: 'Date', name: 'lastUpdateTime', uri: 'URI', masking: { regexPattern: '.*' } };
+        var attributeValue = { value: '******0-16', uri: 'entities/16U21B8f/attributes/lastUpdateTime/1qWvQglW' };
+        setUp({ attributeType: attributeType, attributeValue: attributeValue });
+        expect(react_2.screen.getByText('******0-16')).toBeInTheDocument();
+    });
+    it('should not format timestamp attribute if it is masked', function () {
+        var attributeType = { type: 'Timestamp', name: 'Timestamp', uri: 'URI', masking: { regexPattern: '.*' } };
+        var attributeValue = { value: '**********0000', uri: 'entities/16U21B8f/attributes/Timestamp/1qWvQglW' };
+        setUp({ attributeType: attributeType, attributeValue: attributeValue });
+        expect(react_2.screen.getByText('**********0000')).toBeInTheDocument();
+    });
 });

package/cjs/UploadImageDialog/UploadImageDialog.specs.js

@@ -53,8 +53,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var react_2 = require("@testing-library/react");
 var user_event_1 = __importDefault(require("@testing-library/user-event"));
-var react_dnd_test_backend_1 = __importDefault(require("react-dnd-test-backend"));
-var react_dnd_1 = require("react-dnd");
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var constants_1 = require("./constants");
 var UploadImageDialog_1 = require("./UploadImageDialog");
@@ -73,8 +71,7 @@ describe('UploadImageDialog tests', function () {
         var props = { onClose: onClose, onUpload: onUpload, open: true };
         var Providers = function (_a) {
             var children = _a.children;
-            return (react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: { imageServicePath: imageServicePath, environment: environment, tenant: tenant } },
-                react_1.default.createElement(react_dnd_1.DndProvider, { backend: react_dnd_test_backend_1.default }, children)));
+            return (react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { values: { imageServicePath: imageServicePath, environment: environment, tenant: tenant } }, children));
         };
         return __assign({ user: user }, (0, react_2.render)(react_1.default.createElement(UploadImageDialog_1.UploadImageDialog, __assign({}, props)), { wrapper: Providers }));
     };