@reltio/components 1.4.1912 → 1.4.1913

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -36,7 +36,7 @@ var EntityRecord = function (_a) {
36
36
  })
37
37
  .catch(function (err) { return console.warn(err); });
38
38
  };
39
- return (react_1.default.createElement(Record_1.Record, null,
39
+ return (react_1.default.createElement(Record_1.Record, { className: styles.record },
40
40
  react_1.default.createElement(RecordLabel_1.RecordLabel, { description: deltaArray ? '' : ui_i18n_1.default.text('Profile changed') },
41
41
  react_1.default.createElement(EntityObject_1.EntityObject, { item: item })),
42
42
  isEntityChanged && (react_1.default.createElement(Restore_1.default, { "data-reltio-id": "reltio-entity-record-restore-icon", className: styles.restoreIcon, onClick: handleOpenHistoryEvent })),
@@ -54,10 +54,12 @@ var react_1 = __importDefault(require("react"));
54
54
  var react_2 = require("@testing-library/react");
55
55
  var user_event_1 = __importDefault(require("@testing-library/user-event"));
56
56
  var mdm_sdk_1 = require("@reltio/mdm-sdk");
57
- var EntityRecord_1 = require("./EntityRecord");
58
57
  var types_1 = require("../types");
59
58
  var MdmModuleContext_1 = require("../../../contexts/MdmModuleContext");
60
59
  var CollapsibleItemsContext_1 = require("../contexts/CollapsibleItemsContext");
60
+ var TestStylesProvider_1 = require("../../../test-utils/TestStylesProvider");
61
+ var EntityRecord_1 = require("./EntityRecord");
62
+ jest.unmock('@mui/styles');
61
63
  jest.mock('@reltio/mdm-sdk', function () { return (__assign(__assign({}, jest.requireActual('@reltio/mdm-sdk')), { getEntityPreviousChange: jest.fn() })); });
62
64
  var defaultDeltaCollection = {
63
65
  ovChanged: true,
@@ -153,7 +155,8 @@ var setUp = function (_a) {
153
155
  var Providers = function (_a) {
154
156
  var children = _a.children;
155
157
  return (react_1.default.createElement(CollapsibleItemsContext_1.CollapsibleItemsProvider, null,
156
- react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { actions: mdmActions, values: mdmValues }, children)));
158
+ react_1.default.createElement(TestStylesProvider_1.TestStylesProvider, null,
159
+ react_1.default.createElement(MdmModuleContext_1.MdmModuleProvider, { actions: mdmActions, values: mdmValues }, children))));
157
160
  };
158
161
  return __assign(__assign({}, (0, react_2.render)(react_1.default.createElement(EntityRecord_1.EntityRecord, __assign({}, props)), { wrapper: Providers })), { user: user });
159
162
  };
@@ -244,4 +247,13 @@ describe('Entity record tests', function () {
244
247
  setUp({ props: { item: item } });
245
248
  expect(react_2.screen.queryByTestId('reltio-entity-record-restore-icon')).not.toBeInTheDocument();
246
249
  });
250
+ it('should hide RestoreIcon if record is not hovered', function () { return __awaiter(void 0, void 0, void 0, function () {
251
+ var icon;
252
+ return __generator(this, function (_a) {
253
+ setUp();
254
+ icon = react_2.screen.getByTestId('reltio-entity-record-restore-icon');
255
+ expect(icon).not.toBeVisible();
256
+ return [2 /*return*/];
257
+ });
258
+ }); });
247
259
  });
@@ -1 +1 @@
1
- export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"restoreIcon">;
1
+ export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"record" | "restoreIcon">;
@@ -3,6 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useStyles = void 0;
4
4
  var styles_1 = require("@mui/styles");
5
5
  exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
6
+ record: {
7
+ '&:hover $restoreIcon': {
8
+ visibility: 'visible'
9
+ }
10
+ },
6
11
  restoreIcon: {
7
12
  visibility: 'hidden',
8
13
  color: theme.palette.text.secondary,
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  type Props = {
3
3
  children: React.ReactNode;
4
+ className?: string;
4
5
  };
5
- export declare const Record: ({ children }: Props) => JSX.Element;
6
+ export declare const Record: ({ children, className }: Props) => JSX.Element;
6
7
  export {};
@@ -5,10 +5,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.Record = void 0;
7
7
  var react_1 = __importDefault(require("react"));
8
+ var classnames_1 = __importDefault(require("classnames"));
8
9
  var styles_1 = require("./styles");
9
10
  var Record = function (_a) {
10
- var children = _a.children;
11
+ var children = _a.children, className = _a.className;
11
12
  var styles = (0, styles_1.useStyles)();
12
- return react_1.default.createElement("div", { className: styles.record }, children);
13
+ return (react_1.default.createElement("div", { "data-reltio-id": "reltio-activity-log-record", className: (0, classnames_1.default)(styles.record, className) }, children));
13
14
  };
14
15
  exports.Record = Record;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var react_2 = require("@testing-library/react");
8
+ var Record_1 = require("./Record");
9
+ describe('Record tests', function () {
10
+ it('should render children', function () {
11
+ (0, react_2.render)(react_1.default.createElement(Record_1.Record, null, "children"));
12
+ expect(react_2.screen.getByText('children')).toBeInTheDocument();
13
+ });
14
+ it('should use className', function () {
15
+ (0, react_2.render)(react_1.default.createElement(Record_1.Record, { className: "test-class" }, "children"));
16
+ expect(react_2.screen.getByTestId('reltio-activity-log-record')).toHaveClass('test-class');
17
+ });
18
+ });
@@ -10,9 +10,6 @@ exports.useStyles = (0, styles_1.makeStyles)({
10
10
  borderRadius: '3px',
11
11
  padding: '7px 14px',
12
12
  marginBottom: 8,
13
- position: 'relative',
14
- '&:hover $restoreIcon': {
15
- visibility: 'visible'
16
- }
13
+ position: 'relative'
17
14
  }
18
15
  });
@@ -30,7 +30,7 @@ export var EntityRecord = function (_a) {
30
30
  })
31
31
  .catch(function (err) { return console.warn(err); });
32
32
  };
33
- return (React.createElement(Record, null,
33
+ return (React.createElement(Record, { className: styles.record },
34
34
  React.createElement(RecordLabel, { description: deltaArray ? '' : i18n.text('Profile changed') },
35
35
  React.createElement(EntityObject, { item: item })),
36
36
  isEntityChanged && (React.createElement(RestoreIcon, { "data-reltio-id": "reltio-entity-record-restore-icon", className: styles.restoreIcon, onClick: handleOpenHistoryEvent })),
@@ -49,10 +49,12 @@ import React from 'react';
49
49
  import { render, screen } from '@testing-library/react';
50
50
  import userEvent from '@testing-library/user-event';
51
51
  import { getEntityPreviousChange } from '@reltio/mdm-sdk';
52
- import { EntityRecord } from './EntityRecord';
53
52
  import { ActivityTypes } from '../types';
54
53
  import { MdmModuleProvider } from '../../../contexts/MdmModuleContext';
55
54
  import { CollapsibleItemsProvider } from '../contexts/CollapsibleItemsContext';
55
+ import { TestStylesProvider } from '../../../test-utils/TestStylesProvider';
56
+ import { EntityRecord } from './EntityRecord';
57
+ jest.unmock('@mui/styles');
56
58
  jest.mock('@reltio/mdm-sdk', function () { return (__assign(__assign({}, jest.requireActual('@reltio/mdm-sdk')), { getEntityPreviousChange: jest.fn() })); });
57
59
  var defaultDeltaCollection = {
58
60
  ovChanged: true,
@@ -148,7 +150,8 @@ var setUp = function (_a) {
148
150
  var Providers = function (_a) {
149
151
  var children = _a.children;
150
152
  return (React.createElement(CollapsibleItemsProvider, null,
151
- React.createElement(MdmModuleProvider, { actions: mdmActions, values: mdmValues }, children)));
153
+ React.createElement(TestStylesProvider, null,
154
+ React.createElement(MdmModuleProvider, { actions: mdmActions, values: mdmValues }, children))));
152
155
  };
153
156
  return __assign(__assign({}, render(React.createElement(EntityRecord, __assign({}, props)), { wrapper: Providers })), { user: user });
154
157
  };
@@ -239,4 +242,13 @@ describe('Entity record tests', function () {
239
242
  setUp({ props: { item: item } });
240
243
  expect(screen.queryByTestId('reltio-entity-record-restore-icon')).not.toBeInTheDocument();
241
244
  });
245
+ it('should hide RestoreIcon if record is not hovered', function () { return __awaiter(void 0, void 0, void 0, function () {
246
+ var icon;
247
+ return __generator(this, function (_a) {
248
+ setUp();
249
+ icon = screen.getByTestId('reltio-entity-record-restore-icon');
250
+ expect(icon).not.toBeVisible();
251
+ return [2 /*return*/];
252
+ });
253
+ }); });
242
254
  });
@@ -1 +1 @@
1
- export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"restoreIcon">;
1
+ export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"record" | "restoreIcon">;
@@ -1,5 +1,10 @@
1
1
  import { makeStyles } from '@mui/styles';
2
2
  export var useStyles = makeStyles(function (theme) { return ({
3
+ record: {
4
+ '&:hover $restoreIcon': {
5
+ visibility: 'visible'
6
+ }
7
+ },
3
8
  restoreIcon: {
4
9
  visibility: 'hidden',
5
10
  color: theme.palette.text.secondary,
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  type Props = {
3
3
  children: React.ReactNode;
4
+ className?: string;
4
5
  };
5
- export declare const Record: ({ children }: Props) => JSX.Element;
6
+ export declare const Record: ({ children, className }: Props) => JSX.Element;
6
7
  export {};
@@ -1,7 +1,8 @@
1
1
  import React from 'react';
2
+ import classnames from 'classnames';
2
3
  import { useStyles } from './styles';
3
4
  export var Record = function (_a) {
4
- var children = _a.children;
5
+ var children = _a.children, className = _a.className;
5
6
  var styles = useStyles();
6
- return React.createElement("div", { className: styles.record }, children);
7
+ return (React.createElement("div", { "data-reltio-id": "reltio-activity-log-record", className: classnames(styles.record, className) }, children));
7
8
  };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ import { render, screen } from '@testing-library/react';
3
+ import { Record } from './Record';
4
+ describe('Record tests', function () {
5
+ it('should render children', function () {
6
+ render(React.createElement(Record, null, "children"));
7
+ expect(screen.getByText('children')).toBeInTheDocument();
8
+ });
9
+ it('should use className', function () {
10
+ render(React.createElement(Record, { className: "test-class" }, "children"));
11
+ expect(screen.getByTestId('reltio-activity-log-record')).toHaveClass('test-class');
12
+ });
13
+ });
@@ -7,9 +7,6 @@ export var useStyles = makeStyles({
7
7
  borderRadius: '3px',
8
8
  padding: '7px 14px',
9
9
  marginBottom: 8,
10
- position: 'relative',
11
- '&:hover $restoreIcon': {
12
- visibility: 'visible'
13
- }
10
+ position: 'relative'
14
11
  }
15
12
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.1912",
3
+ "version": "1.4.1913",
4
4
  "license": "SEE LICENSE IN LICENSE FILE",
5
5
  "main": "./cjs/index.js",
6
6
  "module": "./esm/index.js",