@reltio/components 1.4.719 → 1.4.723

package/components/attributes/inline/ComplexAttribute/ComplexAttribute.js

@@ -23,6 +23,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(require("react"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var useAttributeState_1 = require("../hooks/useAttributeState");
 var index_1 = require("../../../index");
@@ -58,8 +59,8 @@ var ComplexAttribute = function (_a) {
                 crosswalks.map(function (crosswalk) { return (react_1.default.createElement(CrosswalkIcon_1.default, { key: crosswalk.value, crosswalk: crosswalk, className: styles.crosswalkIcon })); })),
             react_1.default.createElement(index_1.Spacer, null),
             react_1.default.createElement("div", { className: styles.actions },
-                showPin && react_1.default.createElement(PinButton_1.default, { isPinned: attributeValue.pin, onClick: function () { return onPin({ attributeValue: attributeValue }); } }),
-                showIgnore && (react_1.default.createElement(IgnoreButton_1.default, { isIgnored: attributeValue.ignored, onClick: function () { return onIgnore({ attributeValue: attributeValue }); } })),
+                showPin && (react_1.default.createElement(PinButton_1.default, { isPinned: attributeValue.pin, tooltipTitle: ui_i18n_1.default.text('Pin'), onClick: function () { return onPin({ attributeValue: attributeValue }); } })),
+                showIgnore && (react_1.default.createElement(IgnoreButton_1.default, { isIgnored: attributeValue.ignored, tooltipTitle: ui_i18n_1.default.text('Ignore'), onClick: function () { return onIgnore({ attributeValue: attributeValue }); } })),
                 showDelete && (react_1.default.createElement(DeleteButton_1.default, { onClick: function () {
                         return onDelete({
                             attributeType: attributeType,

package/components/attributes/inline/SimpleAttribute/SimpleAttribute.js

@@ -88,11 +88,12 @@ var SimpleAttribute = function (_a) {
         react_1.default.createElement("div", { className: styles.attributeValue },
             react_1.default.createElement(DataTypeValue_1.default, { value: mdm_sdk_1.getAttributeValue(attributeValue), dataTypeDefinition: mdm_sdk_1.getAttrDataTypeDefinition(attributeType) })),
         react_1.default.createElement("div", { className: styles.actions },
-            showPin && react_1.default.createElement(PinButton_1.default, { isPinned: attributeValue.pin, onClick: function () { return onPin({ attributeValue: attributeValue }); } }),
-            showIgnore && (react_1.default.createElement(IgnoreButton_1.default, { isIgnored: attributeValue.ignored, onClick: function () { return onIgnore({ attributeValue: attributeValue }); } })),
-            isHovered && (react_1.default.createElement(DropDownMenuButton_1.default, { MenuItemRenderer: CrosswalkMenuItem_1.default, menuId: "simple-attribute-additional-actions-" + id, buttonComponent: SmallIconButton_1.SmallIconButton, buttonProps: {
+            showPin && (react_1.default.createElement(PinButton_1.default, { isPinned: attributeValue.pin, tooltipTitle: ui_i18n_1.default.text('Pin'), onClick: function () { return onPin({ attributeValue: attributeValue }); } })),
+            showIgnore && (react_1.default.createElement(IgnoreButton_1.default, { isIgnored: attributeValue.ignored, tooltipTitle: ui_i18n_1.default.text('Ignore'), onClick: function () { return onIgnore({ attributeValue: attributeValue }); } })),
+            isHovered && (react_1.default.createElement(DropDownMenuButton_1.default, { MenuItemRenderer: CrosswalkMenuItem_1.default, menuId: "simple-attribute-additional-actions-" + id, buttonComponent: SmallIconButton_1.SmallIconButtonWithTooltip, buttonProps: {
                     icon: MoreVert_1.default,
-                    size: 'XS'
+                    size: 'XS',
+                    tooltipTitle: ui_i18n_1.default.text('More actions')
                 }, onMenuClose: onClose, menuItems: actions }))),
         isEditingMode && (react_1.default.createElement(SimpleAttributeEditor_1.SimpleAttributeEditor, { attributeType: attributeType, attributeValue: attributeValue, color: color, onClose: onClose, onEdit: function (value) { return onEdit({ attributeType: attributeType, attributeValue: value, crosswalk: crosswalk }); }, containerRef: containerRef }))));
 };

package/components/attributes/inline/common/IgnoreButton.js

@@ -8,7 +8,7 @@ var SmallIconButton_1 = require("../../../SmallIconButton");
 var Ignored_1 = __importDefault(require("../../../../icons/Ignored"));
 var IgnoredOutlined_1 = __importDefault(require("../../../../icons/IgnoredOutlined"));
 var IgnoreButton = function (_a) {
-    var isIgnored = _a.isIgnored, onClick = _a.onClick;
-    return (react_1.default.createElement(SmallIconButton_1.SmallIconButton, { icon: isIgnored ? Ignored_1.default : IgnoredOutlined_1.default, onClick: onClick, size: "XS", disableRipple: true }));
+    var isIgnored = _a.isIgnored, tooltipTitle = _a.tooltipTitle, onClick = _a.onClick;
+    return (react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, { icon: isIgnored ? Ignored_1.default : IgnoredOutlined_1.default, tooltipTitle: tooltipTitle, onClick: onClick, size: "XS", disableRipple: true }));
 };
 exports.default = IgnoreButton;

package/components/attributes/inline/common/PinButton.js

@@ -8,7 +8,7 @@ var SmallIconButton_1 = require("../../../SmallIconButton");
 var Pin_1 = __importDefault(require("../../../../icons/Pin"));
 var PinOutlined_1 = __importDefault(require("../../../../icons/PinOutlined"));
 var PinButton = function (_a) {
-    var isPinned = _a.isPinned, onClick = _a.onClick;
-    return react_1.default.createElement(SmallIconButton_1.SmallIconButton, { onClick: onClick, icon: isPinned ? Pin_1.default : PinOutlined_1.default, size: "XS", disableRipple: true });
+    var isPinned = _a.isPinned, tooltipTitle = _a.tooltipTitle, onClick = _a.onClick;
+    return (react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, { onClick: onClick, icon: isPinned ? Pin_1.default : PinOutlined_1.default, tooltipTitle: tooltipTitle, size: "XS", disableRipple: true }));
 };
 exports.default = PinButton;

package/components/attributes/inline/common/SourceItem.js

@@ -4,15 +4,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
 var mdm_module_1 = __importDefault(require("@reltio/mdm-module"));
 var mdm_sdk_1 = require("@reltio/mdm-sdk");
 var react_redux_1 = require("react-redux");
 var Visibility_1 = __importDefault(require("@material-ui/icons/Visibility"));
 var SourceIcon_1 = __importDefault(require("../../../SourceIcon/SourceIcon"));
 var classnames_1 = __importDefault(require("classnames"));
-var styles_1 = require("./styles");
 var contexts_1 = require("../../../../contexts");
 var SmallIconButton_1 = require("../../../SmallIconButton");
+var styles_1 = require("./styles");
 var SourceItem = function (_a) {
     var crosswalk = _a.crosswalk, color = _a.color, className = _a.className, _b = _a.focusable, focusable = _b === void 0 ? false : _b;
     var _c = contexts_1.useCrosswalkFocus(crosswalk), toggleCrosswalkFocus = _c.toggleCrosswalkFocus, isFocused = _c.isFocused;
@@ -24,7 +25,7 @@ var SourceItem = function (_a) {
         react_1.default.createElement("div", { className: styles.sourceInfo },
             react_1.default.createElement("div", null,
                 react_1.default.createElement("span", { className: styles.label }, label),
-                focusable && (react_1.default.createElement(SmallIconButton_1.SmallIconButton, { icon: Visibility_1.default, className: styles.eyeIcon, size: 'XXS', onClick: function () { return toggleCrosswalkFocus(); } }))),
+                focusable && (react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, { icon: Visibility_1.default, className: styles.eyeIcon, size: 'XXS', tooltipTitle: ui_i18n_1.default.text('Focus'), onClick: function () { return toggleCrosswalkFocus(); } }))),
             react_1.default.createElement("div", { className: styles.crosswalkValue }, crosswalk.value))));
 };
 exports.default = SourceItem;

package/components/attributes/inline/common/__test__/IgnoreButton.spec.js

@@ -11,18 +11,20 @@ var IgnoredOutlined_1 = __importDefault(require("../../../../../icons/IgnoredOut
 var IgnoreButton_1 = __importDefault(require("../IgnoreButton"));
 describe('Ignore button test', function () {
     var component, onClickFn;
-    var getButton = function (component) { return component.find(SmallIconButton_1.SmallIconButton); };
+    var getButton = function (component) { return component.find(SmallIconButton_1.SmallIconButtonWithTooltip); };
     beforeEach(function () {
         onClickFn = jest.fn();
-        component = enzyme_1.mount(react_1.default.createElement(IgnoreButton_1.default, { isIgnored: false, onClick: onClickFn }));
+        component = enzyme_1.mount(react_1.default.createElement(IgnoreButton_1.default, { isIgnored: false, tooltipTitle: 'some tooltip', onClick: onClickFn }));
+    });
+    it('should render correctly', function () {
+        expect(getButton(component).props()).toMatchObject({
+            tooltipTitle: 'some tooltip',
+            onClick: onClickFn
+        });
     });
     it('should show correct icon', function () {
         expect(getButton(component).prop('icon')).toBe(IgnoredOutlined_1.default);
         component.setProps({ isIgnored: true });
         expect(getButton(component).prop('icon')).toBe(Ignored_1.default);
     });
-    it('should call onClick', function () {
-        component.simulate('click');
-        expect(onClickFn).toHaveBeenCalled();
-    });
 });

package/components/attributes/inline/common/__test__/PinButton.spec.js

@@ -11,18 +11,20 @@ var PinOutlined_1 = __importDefault(require("../../../../../icons/PinOutlined"))
 var PinButton_1 = __importDefault(require("../PinButton"));
 describe('Pin button test', function () {
     var component, onClickFn;
-    var getButton = function (component) { return component.find(SmallIconButton_1.SmallIconButton); };
+    var getButton = function (component) { return component.find(SmallIconButton_1.SmallIconButtonWithTooltip); };
     beforeEach(function () {
         onClickFn = jest.fn();
-        component = enzyme_1.mount(react_1.default.createElement(PinButton_1.default, { isPinned: false, onClick: onClickFn }));
+        component = enzyme_1.mount(react_1.default.createElement(PinButton_1.default, { isPinned: false, tooltipTitle: 'some tooltip', onClick: onClickFn }));
+    });
+    it('should render correctly', function () {
+        expect(getButton(component).props()).toMatchObject({
+            tooltipTitle: 'some tooltip',
+            onClick: onClickFn
+        });
     });
     it('should show correct icon', function () {
         expect(getButton(component).prop('icon')).toBe(PinOutlined_1.default);
         component.setProps({ isPinned: true });
         expect(getButton(component).prop('icon')).toBe(Pin_1.default);
     });
-    it('should call onClick', function () {
-        component.simulate('click');
-        expect(onClickFn).toHaveBeenCalled();
-    });
 });

package/components/attributes/inline/common/__test__/SourceItem.spec.js

@@ -25,8 +25,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var enzyme_1 = require("enzyme");
 var react_1 = __importDefault(require("react"));
 var reactRedux = __importStar(require("react-redux"));
+var Visibility_1 = __importDefault(require("@material-ui/icons/Visibility"));
 var crosswalksDisplay = __importStar(require("../../../../../contexts/CrosswalksDisplayContext"));
-var SmallIconButton_1 = __importDefault(require("../../../../SmallIconButton/SmallIconButton"));
+var SmallIconButton_1 = require("../../../../SmallIconButton");
 var SourceIcon_1 = __importDefault(require("../../../../SourceIcon/SourceIcon"));
 var SourceItem_1 = __importDefault(require("../SourceItem"));
 var createStore = function () {
@@ -75,12 +76,15 @@ describe('Source item tests', function () {
         expect(wrapper.find(SourceIcon_1.default).prop('sourceType')).toBe('configuration/sources/Reltio');
         expect(wrapper.find('.label').text()).toBe('Reltio');
         expect(wrapper.find('.crosswalkValue').text()).toBe('1PPwRPuk');
-        expect(wrapper.find(SmallIconButton_1.default).length).toBe(0);
+        expect(wrapper.find(SmallIconButton_1.SmallIconButtonWithTooltip).length).toBe(0);
     });
     it('should show focus button when focusable === true', function () {
         var wrapper = enzyme_1.shallow(react_1.default.createElement(SourceItem_1.default, { color: "color", crosswalk: crosswalk, focusable: true }));
-        var button = wrapper.find(SmallIconButton_1.default);
-        expect(button.length).toBe(1);
+        var button = wrapper.find(SmallIconButton_1.SmallIconButtonWithTooltip);
+        expect(button.props()).toMatchObject({
+            icon: Visibility_1.default,
+            tooltipTitle: 'Focus'
+        });
         button.simulate('click');
         expect(toggleCrosswalkFocus).toBeCalledTimes(1);
     });

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.719",
+  "version": "1.4.723",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "index.js",
   "dependencies": {
     "@date-io/moment": "^1.3.5",
-    "@reltio/mdm-module": "^1.4.719",
-    "@reltio/mdm-sdk": "^1.4.719",
+    "@reltio/mdm-module": "^1.4.723",
+    "@reltio/mdm-sdk": "^1.4.723",
     "classnames": "^2.2.5",
     "frontend-collective-react-dnd-scrollzone": "^1.0.2",
     "nanoid": "^2.0.0",