@reltio/components 1.4.1834 → 1.4.1835
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.
- package/cjs/NumberEditor/components/NumberFormat/NumberFormat.d.ts +2 -6
- package/cjs/TextEditor/TextEditor.d.ts +12 -15
- package/cjs/TextEditor/TextEditor.js +0 -12
- package/cjs/TextEditor/TextEditor.test.js +100 -22
- package/cjs/components/MultipleInput/MultipleInput.d.ts +3 -3
- package/cjs/components/SimpleInput/SimpleInput.d.ts +8 -19
- package/cjs/components/SimpleInput/SimpleInput.js +4 -13
- package/cjs/contexts/SegmentationContext/index.d.ts +1 -1
- package/cjs/contexts/SegmentationContext/index.js +1 -1
- package/cjs/features/crosswalks/CrosswalkAttributes/CrosswalkAttributes.js +6 -2
- package/cjs/features/crosswalks/CrosswalkAttributes/CrosswalkAttributes.test.js +6 -2
- package/esm/NumberEditor/components/NumberFormat/NumberFormat.d.ts +2 -6
- package/esm/TextEditor/TextEditor.d.ts +12 -15
- package/esm/TextEditor/TextEditor.js +0 -12
- package/esm/TextEditor/TextEditor.test.js +100 -22
- package/esm/components/MultipleInput/MultipleInput.d.ts +3 -3
- package/esm/components/SimpleInput/SimpleInput.d.ts +8 -19
- package/esm/components/SimpleInput/SimpleInput.js +4 -13
- package/esm/contexts/SegmentationContext/index.d.ts +1 -1
- package/esm/contexts/SegmentationContext/index.js +1 -1
- package/esm/features/crosswalks/CrosswalkAttributes/CrosswalkAttributes.js +6 -2
- package/esm/features/crosswalks/CrosswalkAttributes/CrosswalkAttributes.test.js +6 -2
- package/package.json +1 -1
|
@@ -1,11 +1,7 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { ChangeEvent } from 'react';
|
|
2
2
|
import { NumberFormat as TNumberFormat } from '@reltio/mdm-sdk';
|
|
3
3
|
type Props = {
|
|
4
|
-
onChange: (e:
|
|
5
|
-
target: {
|
|
6
|
-
value: string;
|
|
7
|
-
};
|
|
8
|
-
}) => void;
|
|
4
|
+
onChange: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
9
5
|
value?: string | number;
|
|
10
6
|
integer?: boolean;
|
|
11
7
|
customInput?: React.ComponentType;
|
|
@@ -1,16 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
import MultipleInput from '../components/MultipleInput/MultipleInput';
|
|
3
|
+
import SimpleInput from '../components/SimpleInput/SimpleInput';
|
|
4
|
+
type SimpleInputProps = ComponentProps<typeof SimpleInput>;
|
|
5
|
+
type MultipleInputProps = ComponentProps<typeof MultipleInput>;
|
|
6
|
+
type Props = {
|
|
3
7
|
multiple?: boolean;
|
|
4
|
-
value
|
|
5
|
-
getValueLabel
|
|
6
|
-
multiline?:
|
|
7
|
-
})
|
|
8
|
-
export
|
|
9
|
-
|
|
10
|
-
let multiple: PropTypes.Requireable<boolean>;
|
|
11
|
-
let multiline: PropTypes.Requireable<boolean>;
|
|
12
|
-
let value: PropTypes.Requireable<NonNullable<string | number | string[] | number[]>>;
|
|
13
|
-
let getValueLabel: PropTypes.Requireable<(...args: any[]) => any>;
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
import PropTypes from 'prop-types';
|
|
8
|
+
value?: SimpleInputProps['value'] | MultipleInputProps['values'];
|
|
9
|
+
getValueLabel?: MultipleInputProps['getValueLabel'];
|
|
10
|
+
multiline?: SimpleInputProps['multiline'];
|
|
11
|
+
} & (SimpleInputProps | MultipleInputProps);
|
|
12
|
+
export declare const TextEditor: ({ multiple, value, getValueLabel, multiline, ...otherProps }: Props) => JSX.Element;
|
|
13
|
+
export {};
|
|
@@ -26,7 +26,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
26
26
|
};
|
|
27
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
28
|
exports.TextEditor = void 0;
|
|
29
|
-
var prop_types_1 = __importDefault(require("prop-types"));
|
|
30
29
|
var react_1 = __importDefault(require("react"));
|
|
31
30
|
var MultipleInput_1 = __importDefault(require("../components/MultipleInput/MultipleInput"));
|
|
32
31
|
var SimpleInput_1 = __importDefault(require("../components/SimpleInput/SimpleInput"));
|
|
@@ -35,14 +34,3 @@ var TextEditor = function (_a) {
|
|
|
35
34
|
return multiple ? (react_1.default.createElement(MultipleInput_1.default, __assign({}, otherProps, { values: value, getValueLabel: getValueLabel }))) : (react_1.default.createElement(SimpleInput_1.default, __assign({}, otherProps, { value: value, multiline: multiline })));
|
|
36
35
|
};
|
|
37
36
|
exports.TextEditor = TextEditor;
|
|
38
|
-
exports.TextEditor.propTypes = {
|
|
39
|
-
multiple: prop_types_1.default.bool,
|
|
40
|
-
multiline: prop_types_1.default.bool,
|
|
41
|
-
value: prop_types_1.default.oneOfType([
|
|
42
|
-
prop_types_1.default.string,
|
|
43
|
-
prop_types_1.default.arrayOf(prop_types_1.default.string),
|
|
44
|
-
prop_types_1.default.number,
|
|
45
|
-
prop_types_1.default.arrayOf(prop_types_1.default.number)
|
|
46
|
-
]),
|
|
47
|
-
getValueLabel: prop_types_1.default.func
|
|
48
|
-
};
|
|
@@ -1,36 +1,114 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
14
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
15
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
16
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
17
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
18
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
19
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
20
|
+
});
|
|
21
|
+
};
|
|
22
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
23
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
24
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
25
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
26
|
+
function step(op) {
|
|
27
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
28
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
29
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
30
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
31
|
+
switch (op[0]) {
|
|
32
|
+
case 0: case 1: t = op; break;
|
|
33
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
34
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
35
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
36
|
+
default:
|
|
37
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
38
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
39
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
40
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
41
|
+
if (t[2]) _.ops.pop();
|
|
42
|
+
_.trys.pop(); continue;
|
|
43
|
+
}
|
|
44
|
+
op = body.call(thisArg, _);
|
|
45
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
46
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
47
|
+
}
|
|
48
|
+
};
|
|
2
49
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
50
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
51
|
};
|
|
5
52
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
53
|
var react_1 = __importDefault(require("react"));
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
var SimpleInput_1 = __importDefault(require("../components/SimpleInput/SimpleInput"));
|
|
54
|
+
var react_2 = require("@testing-library/react");
|
|
55
|
+
var user_event_1 = __importDefault(require("@testing-library/user-event"));
|
|
10
56
|
var TextEditor_1 = require("./TextEditor");
|
|
11
|
-
describe('TextEditor', function () {
|
|
57
|
+
describe('TextEditor tests', function () {
|
|
58
|
+
var defaultProps = {
|
|
59
|
+
onChange: jest.fn()
|
|
60
|
+
};
|
|
61
|
+
var setUp = function (props) {
|
|
62
|
+
if (props === void 0) { props = {}; }
|
|
63
|
+
var user = user_event_1.default.setup();
|
|
64
|
+
return __assign({ user: user }, (0, react_2.render)(react_1.default.createElement(TextEditor_1.TextEditor, __assign({}, defaultProps, props))));
|
|
65
|
+
};
|
|
66
|
+
beforeEach(function () {
|
|
67
|
+
jest.clearAllMocks();
|
|
68
|
+
});
|
|
12
69
|
describe('single mode', function () {
|
|
13
|
-
it('should render SimpleInput', function () {
|
|
14
|
-
var
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
70
|
+
it('should render SimpleInput', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
71
|
+
var user, textbox;
|
|
72
|
+
return __generator(this, function (_a) {
|
|
73
|
+
switch (_a.label) {
|
|
74
|
+
case 0:
|
|
75
|
+
user = setUp().user;
|
|
76
|
+
textbox = react_2.screen.getByRole('textbox');
|
|
77
|
+
expect(textbox).toBeInTheDocument();
|
|
78
|
+
return [4 /*yield*/, user.type(textbox, '123{enter}')];
|
|
79
|
+
case 1:
|
|
80
|
+
_a.sent();
|
|
81
|
+
expect(defaultProps.onChange).toHaveBeenCalledWith('123');
|
|
82
|
+
return [2 /*return*/];
|
|
83
|
+
}
|
|
84
|
+
});
|
|
85
|
+
}); });
|
|
86
|
+
it('should render with value correctly', function () {
|
|
87
|
+
setUp({ value: '123' });
|
|
88
|
+
expect(react_2.screen.getByRole('textbox')).toHaveValue('123');
|
|
22
89
|
});
|
|
23
90
|
});
|
|
24
91
|
describe('multiple mode', function () {
|
|
25
|
-
it('should render MultipleInput', function () {
|
|
26
|
-
var
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
92
|
+
it('should render MultipleInput', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
93
|
+
var user, textbox;
|
|
94
|
+
return __generator(this, function (_a) {
|
|
95
|
+
switch (_a.label) {
|
|
96
|
+
case 0:
|
|
97
|
+
user = setUp({ multiple: true }).user;
|
|
98
|
+
textbox = react_2.screen.getByRole('textbox');
|
|
99
|
+
expect(textbox).toBeInTheDocument();
|
|
100
|
+
return [4 /*yield*/, user.type(textbox, '123{enter}')];
|
|
101
|
+
case 1:
|
|
102
|
+
_a.sent();
|
|
103
|
+
expect(defaultProps.onChange).toHaveBeenCalledWith(['123']);
|
|
104
|
+
return [2 /*return*/];
|
|
105
|
+
}
|
|
106
|
+
});
|
|
107
|
+
}); });
|
|
108
|
+
it('should render with value correctly', function () {
|
|
109
|
+
setUp({ multiple: true, value: ['123', '324'] });
|
|
110
|
+
expect(react_2.screen.getByText('123')).toBeInTheDocument();
|
|
111
|
+
expect(react_2.screen.getByText('324')).toBeInTheDocument();
|
|
34
112
|
});
|
|
35
113
|
});
|
|
36
114
|
});
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { TextFieldProps } from '@mui/material/TextField';
|
|
2
2
|
type MultipleInputProps = Omit<TextFieldProps, 'classes' | 'value' | 'onChange' | 'onKeyPress' | 'onKeyDown' | 'onFocus' | 'onBlur'> & {
|
|
3
|
-
values?: string | string[];
|
|
3
|
+
values?: string | number | string[] | number[];
|
|
4
4
|
InputProps?: Omit<TextFieldProps['InputProps'], 'startAdornment' | 'inputComponent'>;
|
|
5
5
|
classes?: {
|
|
6
6
|
root?: string;
|
|
7
7
|
};
|
|
8
8
|
isCrossedOut?: boolean;
|
|
9
|
-
onChange?: (values: string[]) => void;
|
|
10
|
-
getValueLabel?: (value: string) => string;
|
|
9
|
+
onChange?: (values: string[] | number[]) => void;
|
|
10
|
+
getValueLabel?: (value: string | number) => string;
|
|
11
11
|
};
|
|
12
12
|
declare const MultipleInput: ({ values: valuesProp, InputProps, inputProps, classes, isCrossedOut, onChange, getValueLabel, ...otherProps }: MultipleInputProps) => JSX.Element;
|
|
13
13
|
export default MultipleInput;
|
|
@@ -1,20 +1,9 @@
|
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
import TextField from '@mui/material/TextField';
|
|
3
|
+
type Props = Omit<ComponentProps<typeof TextField>, 'value' | 'onChange'> & {
|
|
4
|
+
value?: string | number;
|
|
5
|
+
onChange?: (value: string | number) => void;
|
|
6
|
+
isCrossedOut?: boolean;
|
|
7
|
+
};
|
|
8
|
+
declare const SimpleInput: ({ value, onChange, multiline, InputProps, isCrossedOut, ...otherProps }: Props) => JSX.Element;
|
|
1
9
|
export default SimpleInput;
|
|
2
|
-
declare function SimpleInput({ value, onChange, multiline, InputProps, isCrossedOut, ...otherProps }: {
|
|
3
|
-
[x: string]: any;
|
|
4
|
-
value: any;
|
|
5
|
-
onChange?: () => void;
|
|
6
|
-
multiline: any;
|
|
7
|
-
InputProps?: {};
|
|
8
|
-
isCrossedOut: any;
|
|
9
|
-
}): JSX.Element;
|
|
10
|
-
declare namespace SimpleInput {
|
|
11
|
-
namespace propTypes {
|
|
12
|
-
let value: PropTypes.Requireable<NonNullable<string | number>>;
|
|
13
|
-
let onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
14
|
-
let multiline: PropTypes.Requireable<boolean>;
|
|
15
|
-
let InputProps: PropTypes.Requireable<object>;
|
|
16
|
-
let className: PropTypes.Requireable<string>;
|
|
17
|
-
let isCrossedOut: PropTypes.Requireable<boolean>;
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
import PropTypes from 'prop-types';
|
|
@@ -49,7 +49,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
49
49
|
};
|
|
50
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
51
51
|
var react_1 = __importStar(require("react"));
|
|
52
|
-
var prop_types_1 = __importDefault(require("prop-types"));
|
|
53
52
|
var classnames_1 = __importDefault(require("classnames"));
|
|
54
53
|
var ramda_1 = require("ramda");
|
|
55
54
|
var TextField_1 = __importDefault(require("@mui/material/TextField"));
|
|
@@ -57,10 +56,10 @@ var core_1 = require("../../core");
|
|
|
57
56
|
var styles_1 = require("./styles");
|
|
58
57
|
var SimpleInput = function (_a) {
|
|
59
58
|
var _b;
|
|
60
|
-
var
|
|
59
|
+
var _c;
|
|
60
|
+
var value = _a.value, _d = _a.onChange, onChange = _d === void 0 ? core_1.noop : _d, multiline = _a.multiline, InputProps = _a.InputProps, isCrossedOut = _a.isCrossedOut, otherProps = __rest(_a, ["value", "onChange", "multiline", "InputProps", "isCrossedOut"]);
|
|
61
61
|
var styles = (0, styles_1.useStyles)();
|
|
62
|
-
var _e =
|
|
63
|
-
var _f = (0, react_1.useState)(''), currentValue = _f[0], setCurrentValue = _f[1];
|
|
62
|
+
var _e = (0, react_1.useState)(''), currentValue = _e[0], setCurrentValue = _e[1];
|
|
64
63
|
(0, react_1.useEffect)(function () {
|
|
65
64
|
setCurrentValue((0, ramda_1.isNil)(value) ? '' : value);
|
|
66
65
|
}, [value]);
|
|
@@ -74,14 +73,6 @@ var SimpleInput = function (_a) {
|
|
|
74
73
|
applyCurrentValueChange();
|
|
75
74
|
}
|
|
76
75
|
};
|
|
77
|
-
return (react_1.default.createElement(TextField_1.default, __assign({ variant: "standard" }, otherProps, { InputProps: __assign(__assign({}, InputProps), { classes: __assign({ root: (0, classnames_1.default)(root, (_b = {}, _b[styles.isCrossedOut] = isCrossedOut, _b)) }
|
|
78
|
-
};
|
|
79
|
-
SimpleInput.propTypes = {
|
|
80
|
-
value: prop_types_1.default.oneOfType([prop_types_1.default.string, prop_types_1.default.number]),
|
|
81
|
-
onChange: prop_types_1.default.func,
|
|
82
|
-
multiline: prop_types_1.default.bool,
|
|
83
|
-
InputProps: prop_types_1.default.object,
|
|
84
|
-
className: prop_types_1.default.string,
|
|
85
|
-
isCrossedOut: prop_types_1.default.bool
|
|
76
|
+
return (react_1.default.createElement(TextField_1.default, __assign({ variant: "standard" }, otherProps, { InputProps: __assign(__assign({}, InputProps), { classes: __assign(__assign({}, InputProps === null || InputProps === void 0 ? void 0 : InputProps.classes), { root: (0, classnames_1.default)((_c = InputProps === null || InputProps === void 0 ? void 0 : InputProps.classes) === null || _c === void 0 ? void 0 : _c.root, (_b = {}, _b[styles.isCrossedOut] = isCrossedOut, _b)) }) }), multiline: multiline, value: currentValue, onKeyPress: (0, ramda_1.when)((0, ramda_1.propEq)('key', 'Enter'), onEnterPress), onBlur: applyCurrentValueChange, onChange: (0, ramda_1.pipe)(core_1.getValue, setCurrentValue) })));
|
|
86
77
|
};
|
|
87
78
|
exports.default = SimpleInput;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
export declare const SegmentationContext: React.Context<
|
|
2
|
+
export declare const SegmentationContext: React.Context<any>;
|
|
@@ -5,5 +5,5 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.SegmentationContext = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
|
-
exports.SegmentationContext = react_1.default.createContext(
|
|
8
|
+
exports.SegmentationContext = react_1.default.createContext(null);
|
|
9
9
|
exports.SegmentationContext.displayName = 'SegmentationContext';
|
|
@@ -125,12 +125,16 @@ var CrosswalkAttributes = function (_a) {
|
|
|
125
125
|
react_1.default.createElement(Typography_1.default, { className: styles.text, variant: 'body2' }, sourceSystemLabel)));
|
|
126
126
|
}
|
|
127
127
|
case 'sourceTable':
|
|
128
|
-
return isTempCrosswalk ? (react_1.default.createElement(TextEditor_1.TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
128
|
+
return isTempCrosswalk ? (react_1.default.createElement(TextEditor_1.TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
129
|
+
return onEditAttribute(attributeName, e.target.value);
|
|
130
|
+
}, size: "small", InputProps: {
|
|
129
131
|
disableUnderline: true,
|
|
130
132
|
classes: { input: styles.input }
|
|
131
133
|
} })) : (react_1.default.createElement(Typography_1.default, { className: styles.text, variant: 'body2' }, attributeValue));
|
|
132
134
|
case 'value':
|
|
133
|
-
return isTempCrosswalk ? (react_1.default.createElement(TextEditor_1.TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
135
|
+
return isTempCrosswalk ? (react_1.default.createElement(TextEditor_1.TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
136
|
+
return onEditAttribute(attributeName, e.target.value);
|
|
137
|
+
}, size: "small", InputProps: {
|
|
134
138
|
disableUnderline: true,
|
|
135
139
|
classes: { input: styles.input }
|
|
136
140
|
} })) : (react_1.default.createElement(CopyableValueField_1.CopyableValueField, { value: attributeValue }));
|
|
@@ -192,7 +192,9 @@ describe('CrosswalkAttributes tests', function () {
|
|
|
192
192
|
});
|
|
193
193
|
wrapper.update();
|
|
194
194
|
(0, test_utils_1.act)(function () {
|
|
195
|
-
wrapper.find(TextEditor_1.TextEditor).at(1).prop('onInput')({
|
|
195
|
+
wrapper.find(TextEditor_1.TextEditor).at(1).prop('onInput')({
|
|
196
|
+
target: { value: 'new sourceTable' }
|
|
197
|
+
});
|
|
196
198
|
});
|
|
197
199
|
expect(defaultProps.onEditAttribute).toHaveBeenCalledWith('sourceTable', 'new sourceTable');
|
|
198
200
|
});
|
|
@@ -209,7 +211,9 @@ describe('CrosswalkAttributes tests', function () {
|
|
|
209
211
|
it('should provide correct value to value editor and call props.onEditAttribute on editing', function () {
|
|
210
212
|
var wrapper = setUp(__assign(__assign({}, defaultProps), { crosswalk: newCrosswalk }));
|
|
211
213
|
(0, test_utils_1.act)(function () {
|
|
212
|
-
wrapper.find(TextEditor_1.TextEditor).prop('onInput')({
|
|
214
|
+
wrapper.find(TextEditor_1.TextEditor).prop('onInput')({
|
|
215
|
+
target: { value: 'new id value' }
|
|
216
|
+
});
|
|
213
217
|
});
|
|
214
218
|
expect(defaultProps.onEditAttribute).toHaveBeenCalledWith('value', 'new id value');
|
|
215
219
|
});
|
|
@@ -1,11 +1,7 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { ChangeEvent } from 'react';
|
|
2
2
|
import { NumberFormat as TNumberFormat } from '@reltio/mdm-sdk';
|
|
3
3
|
type Props = {
|
|
4
|
-
onChange: (e:
|
|
5
|
-
target: {
|
|
6
|
-
value: string;
|
|
7
|
-
};
|
|
8
|
-
}) => void;
|
|
4
|
+
onChange: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
9
5
|
value?: string | number;
|
|
10
6
|
integer?: boolean;
|
|
11
7
|
customInput?: React.ComponentType;
|
|
@@ -1,16 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
import MultipleInput from '../components/MultipleInput/MultipleInput';
|
|
3
|
+
import SimpleInput from '../components/SimpleInput/SimpleInput';
|
|
4
|
+
type SimpleInputProps = ComponentProps<typeof SimpleInput>;
|
|
5
|
+
type MultipleInputProps = ComponentProps<typeof MultipleInput>;
|
|
6
|
+
type Props = {
|
|
3
7
|
multiple?: boolean;
|
|
4
|
-
value
|
|
5
|
-
getValueLabel
|
|
6
|
-
multiline?:
|
|
7
|
-
})
|
|
8
|
-
export
|
|
9
|
-
|
|
10
|
-
let multiple: PropTypes.Requireable<boolean>;
|
|
11
|
-
let multiline: PropTypes.Requireable<boolean>;
|
|
12
|
-
let value: PropTypes.Requireable<NonNullable<string | number | string[] | number[]>>;
|
|
13
|
-
let getValueLabel: PropTypes.Requireable<(...args: any[]) => any>;
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
import PropTypes from 'prop-types';
|
|
8
|
+
value?: SimpleInputProps['value'] | MultipleInputProps['values'];
|
|
9
|
+
getValueLabel?: MultipleInputProps['getValueLabel'];
|
|
10
|
+
multiline?: SimpleInputProps['multiline'];
|
|
11
|
+
} & (SimpleInputProps | MultipleInputProps);
|
|
12
|
+
export declare const TextEditor: ({ multiple, value, getValueLabel, multiline, ...otherProps }: Props) => JSX.Element;
|
|
13
|
+
export {};
|
|
@@ -20,7 +20,6 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
20
20
|
}
|
|
21
21
|
return t;
|
|
22
22
|
};
|
|
23
|
-
import PropTypes from 'prop-types';
|
|
24
23
|
import React from 'react';
|
|
25
24
|
import MultipleInput from '../components/MultipleInput/MultipleInput';
|
|
26
25
|
import SimpleInput from '../components/SimpleInput/SimpleInput';
|
|
@@ -28,14 +27,3 @@ export var TextEditor = function (_a) {
|
|
|
28
27
|
var _b = _a.multiple, multiple = _b === void 0 ? false : _b, value = _a.value, getValueLabel = _a.getValueLabel, _c = _a.multiline, multiline = _c === void 0 ? false : _c, otherProps = __rest(_a, ["multiple", "value", "getValueLabel", "multiline"]);
|
|
29
28
|
return multiple ? (React.createElement(MultipleInput, __assign({}, otherProps, { values: value, getValueLabel: getValueLabel }))) : (React.createElement(SimpleInput, __assign({}, otherProps, { value: value, multiline: multiline })));
|
|
30
29
|
};
|
|
31
|
-
TextEditor.propTypes = {
|
|
32
|
-
multiple: PropTypes.bool,
|
|
33
|
-
multiline: PropTypes.bool,
|
|
34
|
-
value: PropTypes.oneOfType([
|
|
35
|
-
PropTypes.string,
|
|
36
|
-
PropTypes.arrayOf(PropTypes.string),
|
|
37
|
-
PropTypes.number,
|
|
38
|
-
PropTypes.arrayOf(PropTypes.number)
|
|
39
|
-
]),
|
|
40
|
-
getValueLabel: PropTypes.func
|
|
41
|
-
};
|
|
@@ -1,31 +1,109 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
13
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
14
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
15
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
16
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
17
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
18
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
22
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
23
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
24
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
25
|
+
function step(op) {
|
|
26
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
27
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
28
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
29
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
30
|
+
switch (op[0]) {
|
|
31
|
+
case 0: case 1: t = op; break;
|
|
32
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
33
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
34
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
35
|
+
default:
|
|
36
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
37
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
38
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
39
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
40
|
+
if (t[2]) _.ops.pop();
|
|
41
|
+
_.trys.pop(); continue;
|
|
42
|
+
}
|
|
43
|
+
op = body.call(thisArg, _);
|
|
44
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
45
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
46
|
+
}
|
|
47
|
+
};
|
|
1
48
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
import SimpleInput from '../components/SimpleInput/SimpleInput';
|
|
49
|
+
import { render, screen } from '@testing-library/react';
|
|
50
|
+
import userEvent from '@testing-library/user-event';
|
|
5
51
|
import { TextEditor } from './TextEditor';
|
|
6
|
-
describe('TextEditor', function () {
|
|
52
|
+
describe('TextEditor tests', function () {
|
|
53
|
+
var defaultProps = {
|
|
54
|
+
onChange: jest.fn()
|
|
55
|
+
};
|
|
56
|
+
var setUp = function (props) {
|
|
57
|
+
if (props === void 0) { props = {}; }
|
|
58
|
+
var user = userEvent.setup();
|
|
59
|
+
return __assign({ user: user }, render(React.createElement(TextEditor, __assign({}, defaultProps, props))));
|
|
60
|
+
};
|
|
61
|
+
beforeEach(function () {
|
|
62
|
+
jest.clearAllMocks();
|
|
63
|
+
});
|
|
7
64
|
describe('single mode', function () {
|
|
8
|
-
it('should render SimpleInput', function () {
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
65
|
+
it('should render SimpleInput', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
66
|
+
var user, textbox;
|
|
67
|
+
return __generator(this, function (_a) {
|
|
68
|
+
switch (_a.label) {
|
|
69
|
+
case 0:
|
|
70
|
+
user = setUp().user;
|
|
71
|
+
textbox = screen.getByRole('textbox');
|
|
72
|
+
expect(textbox).toBeInTheDocument();
|
|
73
|
+
return [4 /*yield*/, user.type(textbox, '123{enter}')];
|
|
74
|
+
case 1:
|
|
75
|
+
_a.sent();
|
|
76
|
+
expect(defaultProps.onChange).toHaveBeenCalledWith('123');
|
|
77
|
+
return [2 /*return*/];
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
}); });
|
|
81
|
+
it('should render with value correctly', function () {
|
|
82
|
+
setUp({ value: '123' });
|
|
83
|
+
expect(screen.getByRole('textbox')).toHaveValue('123');
|
|
17
84
|
});
|
|
18
85
|
});
|
|
19
86
|
describe('multiple mode', function () {
|
|
20
|
-
it('should render MultipleInput', function () {
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
87
|
+
it('should render MultipleInput', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
88
|
+
var user, textbox;
|
|
89
|
+
return __generator(this, function (_a) {
|
|
90
|
+
switch (_a.label) {
|
|
91
|
+
case 0:
|
|
92
|
+
user = setUp({ multiple: true }).user;
|
|
93
|
+
textbox = screen.getByRole('textbox');
|
|
94
|
+
expect(textbox).toBeInTheDocument();
|
|
95
|
+
return [4 /*yield*/, user.type(textbox, '123{enter}')];
|
|
96
|
+
case 1:
|
|
97
|
+
_a.sent();
|
|
98
|
+
expect(defaultProps.onChange).toHaveBeenCalledWith(['123']);
|
|
99
|
+
return [2 /*return*/];
|
|
100
|
+
}
|
|
101
|
+
});
|
|
102
|
+
}); });
|
|
103
|
+
it('should render with value correctly', function () {
|
|
104
|
+
setUp({ multiple: true, value: ['123', '324'] });
|
|
105
|
+
expect(screen.getByText('123')).toBeInTheDocument();
|
|
106
|
+
expect(screen.getByText('324')).toBeInTheDocument();
|
|
29
107
|
});
|
|
30
108
|
});
|
|
31
109
|
});
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { TextFieldProps } from '@mui/material/TextField';
|
|
2
2
|
type MultipleInputProps = Omit<TextFieldProps, 'classes' | 'value' | 'onChange' | 'onKeyPress' | 'onKeyDown' | 'onFocus' | 'onBlur'> & {
|
|
3
|
-
values?: string | string[];
|
|
3
|
+
values?: string | number | string[] | number[];
|
|
4
4
|
InputProps?: Omit<TextFieldProps['InputProps'], 'startAdornment' | 'inputComponent'>;
|
|
5
5
|
classes?: {
|
|
6
6
|
root?: string;
|
|
7
7
|
};
|
|
8
8
|
isCrossedOut?: boolean;
|
|
9
|
-
onChange?: (values: string[]) => void;
|
|
10
|
-
getValueLabel?: (value: string) => string;
|
|
9
|
+
onChange?: (values: string[] | number[]) => void;
|
|
10
|
+
getValueLabel?: (value: string | number) => string;
|
|
11
11
|
};
|
|
12
12
|
declare const MultipleInput: ({ values: valuesProp, InputProps, inputProps, classes, isCrossedOut, onChange, getValueLabel, ...otherProps }: MultipleInputProps) => JSX.Element;
|
|
13
13
|
export default MultipleInput;
|
|
@@ -1,20 +1,9 @@
|
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
import TextField from '@mui/material/TextField';
|
|
3
|
+
type Props = Omit<ComponentProps<typeof TextField>, 'value' | 'onChange'> & {
|
|
4
|
+
value?: string | number;
|
|
5
|
+
onChange?: (value: string | number) => void;
|
|
6
|
+
isCrossedOut?: boolean;
|
|
7
|
+
};
|
|
8
|
+
declare const SimpleInput: ({ value, onChange, multiline, InputProps, isCrossedOut, ...otherProps }: Props) => JSX.Element;
|
|
1
9
|
export default SimpleInput;
|
|
2
|
-
declare function SimpleInput({ value, onChange, multiline, InputProps, isCrossedOut, ...otherProps }: {
|
|
3
|
-
[x: string]: any;
|
|
4
|
-
value: any;
|
|
5
|
-
onChange?: () => void;
|
|
6
|
-
multiline: any;
|
|
7
|
-
InputProps?: {};
|
|
8
|
-
isCrossedOut: any;
|
|
9
|
-
}): JSX.Element;
|
|
10
|
-
declare namespace SimpleInput {
|
|
11
|
-
namespace propTypes {
|
|
12
|
-
let value: PropTypes.Requireable<NonNullable<string | number>>;
|
|
13
|
-
let onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
14
|
-
let multiline: PropTypes.Requireable<boolean>;
|
|
15
|
-
let InputProps: PropTypes.Requireable<object>;
|
|
16
|
-
let className: PropTypes.Requireable<string>;
|
|
17
|
-
let isCrossedOut: PropTypes.Requireable<boolean>;
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
import PropTypes from 'prop-types';
|
|
@@ -21,7 +21,6 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
21
21
|
return t;
|
|
22
22
|
};
|
|
23
23
|
import React, { useEffect, useState } from 'react';
|
|
24
|
-
import PropTypes from 'prop-types';
|
|
25
24
|
import classnames from 'classnames';
|
|
26
25
|
import { isNil, pipe, propEq, when } from 'ramda';
|
|
27
26
|
import TextField from '@mui/material/TextField';
|
|
@@ -29,10 +28,10 @@ import { getValue, noop } from '../../core';
|
|
|
29
28
|
import { useStyles } from './styles';
|
|
30
29
|
var SimpleInput = function (_a) {
|
|
31
30
|
var _b;
|
|
32
|
-
var
|
|
31
|
+
var _c;
|
|
32
|
+
var value = _a.value, _d = _a.onChange, onChange = _d === void 0 ? noop : _d, multiline = _a.multiline, InputProps = _a.InputProps, isCrossedOut = _a.isCrossedOut, otherProps = __rest(_a, ["value", "onChange", "multiline", "InputProps", "isCrossedOut"]);
|
|
33
33
|
var styles = useStyles();
|
|
34
|
-
var _e =
|
|
35
|
-
var _f = useState(''), currentValue = _f[0], setCurrentValue = _f[1];
|
|
34
|
+
var _e = useState(''), currentValue = _e[0], setCurrentValue = _e[1];
|
|
36
35
|
useEffect(function () {
|
|
37
36
|
setCurrentValue(isNil(value) ? '' : value);
|
|
38
37
|
}, [value]);
|
|
@@ -46,14 +45,6 @@ var SimpleInput = function (_a) {
|
|
|
46
45
|
applyCurrentValueChange();
|
|
47
46
|
}
|
|
48
47
|
};
|
|
49
|
-
return (React.createElement(TextField, __assign({ variant: "standard" }, otherProps, { InputProps: __assign(__assign({}, InputProps), { classes: __assign({ root: classnames(root, (_b = {}, _b[styles.isCrossedOut] = isCrossedOut, _b)) }
|
|
50
|
-
};
|
|
51
|
-
SimpleInput.propTypes = {
|
|
52
|
-
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
53
|
-
onChange: PropTypes.func,
|
|
54
|
-
multiline: PropTypes.bool,
|
|
55
|
-
InputProps: PropTypes.object,
|
|
56
|
-
className: PropTypes.string,
|
|
57
|
-
isCrossedOut: PropTypes.bool
|
|
48
|
+
return (React.createElement(TextField, __assign({ variant: "standard" }, otherProps, { InputProps: __assign(__assign({}, InputProps), { classes: __assign(__assign({}, InputProps === null || InputProps === void 0 ? void 0 : InputProps.classes), { root: classnames((_c = InputProps === null || InputProps === void 0 ? void 0 : InputProps.classes) === null || _c === void 0 ? void 0 : _c.root, (_b = {}, _b[styles.isCrossedOut] = isCrossedOut, _b)) }) }), multiline: multiline, value: currentValue, onKeyPress: when(propEq('key', 'Enter'), onEnterPress), onBlur: applyCurrentValueChange, onChange: pipe(getValue, setCurrentValue) })));
|
|
58
49
|
};
|
|
59
50
|
export default SimpleInput;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
export declare const SegmentationContext: React.Context<
|
|
2
|
+
export declare const SegmentationContext: React.Context<any>;
|
|
@@ -96,12 +96,16 @@ export var CrosswalkAttributes = function (_a) {
|
|
|
96
96
|
React.createElement(Typography, { className: styles.text, variant: 'body2' }, sourceSystemLabel)));
|
|
97
97
|
}
|
|
98
98
|
case 'sourceTable':
|
|
99
|
-
return isTempCrosswalk ? (React.createElement(TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
99
|
+
return isTempCrosswalk ? (React.createElement(TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
100
|
+
return onEditAttribute(attributeName, e.target.value);
|
|
101
|
+
}, size: "small", InputProps: {
|
|
100
102
|
disableUnderline: true,
|
|
101
103
|
classes: { input: styles.input }
|
|
102
104
|
} })) : (React.createElement(Typography, { className: styles.text, variant: 'body2' }, attributeValue));
|
|
103
105
|
case 'value':
|
|
104
|
-
return isTempCrosswalk ? (React.createElement(TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
106
|
+
return isTempCrosswalk ? (React.createElement(TextEditor, { multiple: false, multiline: false, getValueLabel: undefined, classes: { root: styles.editor }, required: true, variant: "filled", value: attributeValue, onInput: function (e) {
|
|
107
|
+
return onEditAttribute(attributeName, e.target.value);
|
|
108
|
+
}, size: "small", InputProps: {
|
|
105
109
|
disableUnderline: true,
|
|
106
110
|
classes: { input: styles.input }
|
|
107
111
|
} })) : (React.createElement(CopyableValueField, { value: attributeValue }));
|
|
@@ -187,7 +187,9 @@ describe('CrosswalkAttributes tests', function () {
|
|
|
187
187
|
});
|
|
188
188
|
wrapper.update();
|
|
189
189
|
act(function () {
|
|
190
|
-
wrapper.find(TextEditor).at(1).prop('onInput')({
|
|
190
|
+
wrapper.find(TextEditor).at(1).prop('onInput')({
|
|
191
|
+
target: { value: 'new sourceTable' }
|
|
192
|
+
});
|
|
191
193
|
});
|
|
192
194
|
expect(defaultProps.onEditAttribute).toHaveBeenCalledWith('sourceTable', 'new sourceTable');
|
|
193
195
|
});
|
|
@@ -204,7 +206,9 @@ describe('CrosswalkAttributes tests', function () {
|
|
|
204
206
|
it('should provide correct value to value editor and call props.onEditAttribute on editing', function () {
|
|
205
207
|
var wrapper = setUp(__assign(__assign({}, defaultProps), { crosswalk: newCrosswalk }));
|
|
206
208
|
act(function () {
|
|
207
|
-
wrapper.find(TextEditor).prop('onInput')({
|
|
209
|
+
wrapper.find(TextEditor).prop('onInput')({
|
|
210
|
+
target: { value: 'new id value' }
|
|
211
|
+
});
|
|
208
212
|
});
|
|
209
213
|
expect(defaultProps.onEditAttribute).toHaveBeenCalledWith('value', 'new id value');
|
|
210
214
|
});
|