@reltio/components 1.4.876 → 1.4.880

package/components/editors/RangeDataTypeValueEditor/RangeDataTypeValueEditor.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,25 +9,6 @@ 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;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __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)
@@ -40,48 +20,44 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var prop_types_1 = __importDefault(require("prop-types"));
-var nanoid_1 = __importDefault(require("nanoid"));
-var FormControl_1 = __importDefault(require("@material-ui/core/FormControl"));
-var InputLabel_1 = __importDefault(require("@material-ui/core/InputLabel"));
-var DataTypeValueEditor_1 = __importDefault(require("../DataTypeValueEditor/DataTypeValueEditor"));
-var ramda_1 = require("ramda");
-var styles_1 = require("./styles");
-var ui_i18n_1 = __importDefault(require("ui-i18n"));
+import React, { useRef } from 'react';
+import PropTypes from 'prop-types';
+import nanoid from 'nanoid';
+import FormControl from '@material-ui/core/FormControl';
+import InputLabel from '@material-ui/core/InputLabel';
+import DataTypeValueEditor from '../DataTypeValueEditor/DataTypeValueEditor';
+import { __, pipe, update } from 'ramda';
+import { useStyles } from './styles';
+import i18n from 'ui-i18n';
 var RangeDataTypeValueEditor = function (_a) {
     var _b = _a.value, value = _b === void 0 ? new Array(2) : _b, onChange = _a.onChange, _c = _a.orientation, orientation = _c === void 0 ? 'vertical' : _c, otherProps = __rest(_a, ["value", "onChange", "orientation"]);
-    var styles = styles_1.useStyles();
-    var rangeEditorFromId = react_1.useRef(nanoid_1.default());
-    var rangeEditorToId = react_1.useRef(nanoid_1.default());
-    var fromEditor = (react_1.default.createElement(DataTypeValueEditor_1.default, __assign({ id: rangeEditorFromId.current, value: value[0], onChange: ramda_1.pipe(ramda_1.update(0, ramda_1.__, value), onChange) }, otherProps)));
-    var toEditor = (react_1.default.createElement(DataTypeValueEditor_1.default, __assign({ id: rangeEditorToId.current, value: value[1], onChange: ramda_1.pipe(ramda_1.update(1, ramda_1.__, value), onChange) }, otherProps)));
+    var styles = useStyles();
+    var rangeEditorFromId = useRef(nanoid());
+    var rangeEditorToId = useRef(nanoid());
+    var fromEditor = (React.createElement(DataTypeValueEditor, __assign({ id: rangeEditorFromId.current, value: value[0], onChange: pipe(update(0, __, value), onChange) }, otherProps)));
+    var toEditor = (React.createElement(DataTypeValueEditor, __assign({ id: rangeEditorToId.current, value: value[1], onChange: pipe(update(1, __, value), onChange) }, otherProps)));
     if (orientation === 'horizontal') {
-        return (react_1.default.createElement("div", { className: styles['range-inline-editor'] },
+        return (React.createElement("div", { className: styles['range-inline-editor'] },
             fromEditor,
-            react_1.default.createElement("div", { className: styles['range-editor__dash'] }, '—'),
+            React.createElement("div", { className: styles['range-editor__dash'] }, '—'),
             toEditor));
     }
     else {
-        return (react_1.default.createElement("div", { className: styles['range-editor'] },
-            react_1.default.createElement(FormControl_1.default, { fullWidth: true, className: styles['range-editor__control'] },
-                react_1.default.createElement(InputLabel_1.default, { htmlFor: rangeEditorFromId.current, shrink: true }, ui_i18n_1.default.text('From')),
+        return (React.createElement("div", { className: styles['range-editor'] },
+            React.createElement(FormControl, { fullWidth: true, className: styles['range-editor__control'] },
+                React.createElement(InputLabel, { htmlFor: rangeEditorFromId.current, shrink: true }, i18n.text('From')),
                 fromEditor),
-            react_1.default.createElement(FormControl_1.default, { fullWidth: true, className: styles['range-editor__control'] },
-                react_1.default.createElement(InputLabel_1.default, { htmlFor: rangeEditorToId.current, shrink: true }, ui_i18n_1.default.text('To')),
+            React.createElement(FormControl, { fullWidth: true, className: styles['range-editor__control'] },
+                React.createElement(InputLabel, { htmlFor: rangeEditorToId.current, shrink: true }, i18n.text('To')),
                 toEditor)));
     }
 };
 RangeDataTypeValueEditor.propTypes = {
-    value: prop_types_1.default.arrayOf(prop_types_1.default.any),
-    onChange: prop_types_1.default.func,
-    fieldName: prop_types_1.default.string,
-    orientation: prop_types_1.default.oneOf(['horizontal', 'vertical']),
-    dataTypeDefinition: prop_types_1.default.object,
-    classes: prop_types_1.default.object
+    value: PropTypes.arrayOf(PropTypes.any),
+    onChange: PropTypes.func,
+    fieldName: PropTypes.string,
+    orientation: PropTypes.oneOf(['horizontal', 'vertical']),
+    dataTypeDefinition: PropTypes.object,
+    classes: PropTypes.object
 };
-exports.default = RangeDataTypeValueEditor;
+export default RangeDataTypeValueEditor;

package/components/editors/RangeDataTypeValueEditor/styles.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.useStyles = styles_1.makeStyles({
+import { makeStyles } from '@material-ui/core/styles';
+export var useStyles = makeStyles({
     'range-editor': {
         width: '100%'
     },

package/components/editors/SelectEditor/SelectEditor.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -21,24 +20,20 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-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 prop_types_1 = __importDefault(require("prop-types"));
-var classnames_1 = __importDefault(require("classnames"));
-var ramda_1 = require("ramda");
-var DropDownEditor_1 = __importDefault(require("../DropDownEditor/DropDownEditor"));
-var constants_1 = require("../constants");
+import React from 'react';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
+import { prop } from 'ramda';
+import DropDownEditor from '../DropDownEditor/DropDownEditor';
+import { useSelectStyles } from '../constants';
 var SelectEditor = function (_a) {
     var classes = _a.classes, otherProps = __rest(_a, ["classes"]);
-    var styles = constants_1.useSelectStyles();
-    return (react_1.default.createElement(DropDownEditor_1.default, __assign({ MenuProps: {
+    var styles = useSelectStyles();
+    return (React.createElement(DropDownEditor, __assign({ MenuProps: {
             disableAutoFocusItem: true
-        }, classes: __assign(__assign({}, classes), { root: classnames_1.default(styles.root, ramda_1.prop('root', classes)), icon: classnames_1.default(styles.icon, ramda_1.prop('icon', classes)) }) }, otherProps)));
+        }, classes: __assign(__assign({}, classes), { root: classnames(styles.root, prop('root', classes)), icon: classnames(styles.icon, prop('icon', classes)) }) }, otherProps)));
 };
 SelectEditor.propTypes = {
-    classes: prop_types_1.default.object
+    classes: PropTypes.object
 };
-exports.default = SelectEditor;
+export default SelectEditor;

package/components/editors/TextEditor/TextEditor.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -21,27 +20,23 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var prop_types_1 = __importDefault(require("prop-types"));
-var react_1 = __importDefault(require("react"));
-var MultipleInput_1 = __importDefault(require("../../MultipleInput/MultipleInput"));
-var SimpleInput_1 = __importDefault(require("../../SimpleInput/SimpleInput"));
+import PropTypes from 'prop-types';
+import React from 'react';
+import MultipleInput from '../../MultipleInput/MultipleInput';
+import SimpleInput from '../../SimpleInput/SimpleInput';
 var TextEditor = function (_a) {
     var multiple = _a.multiple, value = _a.value, getValueLabel = _a.getValueLabel, multiline = _a.multiline, otherProps = __rest(_a, ["multiple", "value", "getValueLabel", "multiline"]);
-    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 })));
+    return multiple ? (React.createElement(MultipleInput, __assign({}, otherProps, { values: value, getValueLabel: getValueLabel }))) : (React.createElement(SimpleInput, __assign({}, otherProps, { value: value, multiline: multiline })));
 };
 TextEditor.propTypes = {
-    multiple: prop_types_1.default.bool,
-    multiline: prop_types_1.default.bool,
-    value: prop_types_1.default.oneOfType([
-        prop_types_1.default.string,
-        prop_types_1.default.arrayOf(prop_types_1.default.string),
-        prop_types_1.default.number,
-        prop_types_1.default.arrayOf(prop_types_1.default.number)
+    multiple: PropTypes.bool,
+    multiline: PropTypes.bool,
+    value: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.arrayOf(PropTypes.string),
+        PropTypes.number,
+        PropTypes.arrayOf(PropTypes.number)
     ]),
-    getValueLabel: prop_types_1.default.func
+    getValueLabel: PropTypes.func
 };
-exports.default = TextEditor;
+export default TextEditor;

package/components/editors/TimestampEditor/TimestampEditor.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,25 +9,6 @@ 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;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __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)
@@ -40,40 +20,36 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var prop_types_1 = __importDefault(require("prop-types"));
-var react_1 = __importStar(require("react"));
-var ui_i18n_1 = __importDefault(require("ui-i18n"));
-var moment_1 = __importDefault(require("moment"));
-var classnames_1 = __importDefault(require("classnames"));
-var ramda_1 = require("ramda");
-var text_field_helper_1 = require("@material-ui/pickers/_helpers/text-field-helper");
-var pickers_1 = require("@material-ui/pickers");
-var DateRange_1 = __importDefault(require("@material-ui/icons/DateRange"));
-var mdm_sdk_1 = require("@reltio/mdm-sdk");
-var prop_types_2 = require("../../../constants/prop-types");
-var styles_1 = require("./styles");
-var dateFormat = moment_1.default.localeData().longDateFormat('L');
-var timeFormat = moment_1.default.localeData().longDateFormat('LTS');
-var makeAmPmFormatter = function (format) { return text_field_helper_1.maskedDateFormatter(text_field_helper_1.makeMaskFromFormat(format, '_'), '_', /[^\dap]+/gi); };
+import PropTypes from 'prop-types';
+import React, { useState } from 'react';
+import i18n from 'ui-i18n';
+import moment from 'moment';
+import classnames from 'classnames';
+import { pipe, when, isNil, invoker } from 'ramda';
+import { makeMaskFromFormat, maskedDateFormatter } from '@material-ui/pickers/_helpers/text-field-helper';
+import { KeyboardDateTimePicker } from '@material-ui/pickers';
+import DateRangeIcon from '@material-ui/icons/DateRange';
+import { utils } from '@reltio/mdm-sdk';
+import { InputVariant } from '../../../constants/prop-types';
+import { useStyles } from './styles';
+var dateFormat = moment.localeData().longDateFormat('L');
+var timeFormat = moment.localeData().longDateFormat('LTS');
+var makeAmPmFormatter = function (format) { return maskedDateFormatter(makeMaskFromFormat(format, '_'), '_', /[^\dap]+/gi); };
 var TimestampEditor = function (_a) {
     var _b;
     var _c = _a.value, value = _c === void 0 ? null : _c, label = _a.label, _d = _a.variant, variant = _d === void 0 ? 'filled' : _d, onChange = _a.onChange, InputProps = _a.InputProps, format = _a.format, otherProps = __rest(_a, ["value", "label", "variant", "onChange", "InputProps", "format"]);
-    var styles = styles_1.useStyles();
-    var _e = react_1.useState(false), isCalendarOpen = _e[0], setIsCalendarOpen = _e[1];
+    var styles = useStyles();
+    var _e = useState(false), isCalendarOpen = _e[0], setIsCalendarOpen = _e[1];
     var timestampFormat = format || dateFormat + " " + timeFormat;
     var isAmPmFormat = timestampFormat && timestampFormat.toLowerCase().includes('a');
-    return (react_1.default.createElement(pickers_1.KeyboardDateTimePicker, __assign({ format: timestampFormat, rifmFormatter: isAmPmFormat ? makeAmPmFormatter(timestampFormat) : undefined, variant: "inline", invalidDateMessage: ui_i18n_1.default.text('Invalid Date Format'), maxDateMessage: ui_i18n_1.default.text('Date should not be after maximal date'), minDateMessage: ui_i18n_1.default.text('Date should not be before minimal date'), inputVariant: variant, views: ['year', 'date', 'hours', 'minutes', 'seconds'], autoOk: true, InputAdornmentProps: { position: 'end' }, KeyboardButtonProps: {
+    return (React.createElement(KeyboardDateTimePicker, __assign({ format: timestampFormat, rifmFormatter: isAmPmFormat ? makeAmPmFormatter(timestampFormat) : undefined, variant: "inline", invalidDateMessage: i18n.text('Invalid Date Format'), maxDateMessage: i18n.text('Date should not be after maximal date'), minDateMessage: i18n.text('Date should not be before minimal date'), inputVariant: variant, views: ['year', 'date', 'hours', 'minutes', 'seconds'], autoOk: true, InputAdornmentProps: { position: 'end' }, KeyboardButtonProps: {
             classes: { root: styles.iconButtonRoot },
-            onKeyPress: ramda_1.invoker(0, 'stopPropagation')
-        }, keyboardIcon: react_1.default.createElement(DateRange_1.default, null), onChange: ramda_1.when(mdm_sdk_1.utils.dates.isValidMomentDateOrNull, ramda_1.pipe(mdm_sdk_1.utils.dates.momentToDate, onChange)), label: label, "aria-label": label, value: value, placeholder: ui_i18n_1.default.text((dateFormat + " HH:MM").toUpperCase()), ampm: false, disableToolbar: true, onClose: function () { return setIsCalendarOpen(false); }, onOpen: function () { return setIsCalendarOpen(true); }, InputProps: __assign({ classes: {
+            onKeyPress: invoker(0, 'stopPropagation')
+        }, keyboardIcon: React.createElement(DateRangeIcon, null), onChange: when(utils.dates.isValidMomentDateOrNull, pipe(utils.dates.momentToDate, onChange)), label: label, "aria-label": label, value: value, placeholder: i18n.text((dateFormat + " HH:MM").toUpperCase()), ampm: false, disableToolbar: true, onClose: function () { return setIsCalendarOpen(false); }, onOpen: function () { return setIsCalendarOpen(true); }, InputProps: __assign({ classes: {
                 root: styles.inputRoot,
-                underline: classnames_1.default((_b = {}, _b[styles.underline] = isCalendarOpen, _b)),
+                underline: classnames((_b = {}, _b[styles.underline] = isCalendarOpen, _b)),
                 adornedEnd: styles.adornedEnd
-            }, disableUnderline: ramda_1.isNil(value) }, InputProps), PopoverProps: {
+            }, disableUnderline: isNil(value) }, InputProps), PopoverProps: {
             anchorOrigin: {
                 vertical: 'bottom',
                 horizontal: 'left'
@@ -86,15 +62,15 @@ var TimestampEditor = function (_a) {
             classes: {
                 root: isCalendarOpen ? styles.inputLabel : undefined
             },
-            shrink: !ramda_1.isNil(label)
+            shrink: !isNil(label)
         } }, otherProps)));
 };
 TimestampEditor.propTypes = {
-    value: prop_types_1.default.oneOfType([prop_types_1.default.number, prop_types_1.default.instanceOf(Date)]),
-    format: prop_types_1.default.string,
-    label: prop_types_1.default.string,
-    variant: prop_types_2.InputVariant,
-    InputProps: prop_types_1.default.object,
-    onChange: prop_types_1.default.func.isRequired
+    value: PropTypes.oneOfType([PropTypes.number, PropTypes.instanceOf(Date)]),
+    format: PropTypes.string,
+    label: PropTypes.string,
+    variant: InputVariant,
+    InputProps: PropTypes.object,
+    onChange: PropTypes.func.isRequired
 };
-exports.default = TimestampEditor;
+export default TimestampEditor;

package/components/editors/TimestampEditor/styles.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.useStyles = styles_1.makeStyles(function (theme) { return ({
+import { makeStyles } from '@material-ui/core/styles';
+export var useStyles = makeStyles(function (theme) { return ({
     iconButtonRoot: {
         padding: 8
     },

package/components/editors/TypeaheadEditor/TypeaheadEditor.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,25 +9,6 @@ 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;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __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)
@@ -45,40 +25,36 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from) {
         to[j] = from[i];
     return to;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_autosuggest_1 = __importDefault(require("react-autosuggest"));
-var classnames_1 = __importDefault(require("classnames"));
-var TextField_1 = __importDefault(require("@material-ui/core/TextField"));
-var MenuItem_1 = __importDefault(require("@material-ui/core/MenuItem"));
-var Paper_1 = __importDefault(require("@material-ui/core/Paper"));
-var Popper_1 = __importDefault(require("../../Popper/Popper"));
-var prop_types_1 = __importDefault(require("prop-types"));
-var react_1 = __importStar(require("react"));
-var EmptySearchResult_1 = require("../../../components/EmptySearchResult");
-var ramda_1 = require("ramda");
-var mdm_sdk_1 = require("@reltio/mdm-sdk");
-var utils_1 = require("../../../core/utils");
-var styles_1 = require("./styles");
-var ExpandedValueTooltip_1 = __importDefault(require("../../ExpandedValueTooltip/ExpandedValueTooltip"));
-var ValueChip_1 = __importDefault(require("../../ValueChip/ValueChip"));
+import Autosuggest from 'react-autosuggest';
+import classnames from 'classnames';
+import TextField from '@material-ui/core/TextField';
+import MenuItem from '@material-ui/core/MenuItem';
+import Paper from '@material-ui/core/Paper';
+import Popper from '../../Popper/Popper';
+import PropTypes from 'prop-types';
+import React, { useCallback, useRef, useState } from 'react';
+import { NoResults } from '../../../components/EmptySearchResult';
+import { always, andThen, both, defaultTo, F, identity, ifElse, isEmpty, nthArg, path, pipe, prop, propEq, remove, T, tap, trim, uniq } from 'ramda';
+import { debounce, isEmptyValue } from '@reltio/mdm-sdk';
+import { getValue } from '../../../core/utils';
+import { useStyles } from './styles';
+import ExpandedValueTooltip from '../../ExpandedValueTooltip/ExpandedValueTooltip';
+import ValueChip from '../../ValueChip/ValueChip';
 var FETCH_DEBOUNCE_INTERVAL = 300;
 var TypeaheadEditor = function (_a) {
     var value = _a.value, getSuggestions = _a.getSuggestions, onChange = _a.onChange, multiple = _a.multiple, fullWidth = _a.fullWidth, InputProps = _a.InputProps, inputProps = __rest(_a, ["value", "getSuggestions", "onChange", "multiple", "fullWidth", "InputProps"]);
-    var _b = react_1.useState([]), suggestions = _b[0], setSuggestions = _b[1];
-    var _c = react_1.useState(false), isPlaceholderVisible = _c[0], setPlaceholderVisibility = _c[1];
-    var inputRef = react_1.useRef();
-    var styles = styles_1.useStyles();
+    var _b = useState([]), suggestions = _b[0], setSuggestions = _b[1];
+    var _c = useState(false), isPlaceholderVisible = _c[0], setPlaceholderVisibility = _c[1];
+    var inputRef = useRef();
+    var styles = useStyles();
     var isFocused = function () { var _a; return ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('input')) === document.activeElement; };
-    var fetchSuggestions = ramda_1.pipe(ramda_1.prop('value'), ramda_1.trim, getSuggestions, ramda_1.andThen(ramda_1.pipe(ramda_1.tap(setSuggestions), ramda_1.both(ramda_1.isEmpty, isFocused), setPlaceholderVisibility)));
-    var debouncedFetchSuggestions = react_1.useCallback(mdm_sdk_1.debounce(fetchSuggestions, FETCH_DEBOUNCE_INTERVAL), [
+    var fetchSuggestions = pipe(prop('value'), trim, getSuggestions, andThen(pipe(tap(setSuggestions), both(isEmpty, isFocused), setPlaceholderVisibility)));
+    var debouncedFetchSuggestions = useCallback(debounce(fetchSuggestions, FETCH_DEBOUNCE_INTERVAL), [
         getSuggestions
     ]);
-    value = ramda_1.defaultTo(multiple ? [] : '', value);
-    var _d = react_1.useState(''), currentValue = _d[0], setCurrentValue = _d[1];
-    var _e = react_1.useState(false), hasHighlightedItem = _e[0], setHasHighlightedItem = _e[1];
+    value = defaultTo(multiple ? [] : '', value);
+    var _d = useState(''), currentValue = _d[0], setCurrentValue = _d[1];
+    var _e = useState(false), hasHighlightedItem = _e[0], setHasHighlightedItem = _e[1];
     var onInputChange = function (_a) {
         var newValue = _a.newValue, method = _a.method;
         switch (method) {
@@ -102,7 +78,7 @@ var TypeaheadEditor = function (_a) {
                 if (multiple) {
                     setCurrentValue('');
                     if (newValue) {
-                        onChange(ramda_1.uniq(__spreadArray(__spreadArray([], value), [newValue])));
+                        onChange(uniq(__spreadArray(__spreadArray([], value), [newValue])));
                     }
                 }
                 else {
@@ -112,40 +88,40 @@ var TypeaheadEditor = function (_a) {
             }
         }
     };
-    return (react_1.default.createElement(react_autosuggest_1.default, { suggestions: suggestions, shouldRenderSuggestions: ramda_1.T, inputProps: __assign(__assign({ value: multiple ? currentValue : value, onChange: ramda_1.pipe(ramda_1.nthArg(1), onInputChange), onKeyDown: function (event) {
+    return (React.createElement(Autosuggest, { suggestions: suggestions, shouldRenderSuggestions: T, inputProps: __assign(__assign({ value: multiple ? currentValue : value, onChange: pipe(nthArg(1), onInputChange), onKeyDown: function (event) {
                 if (event.keyCode === 13 && multiple && !hasHighlightedItem) {
                     onInputChange({ method: 'enter', newValue: currentValue });
                 }
-            }, fullWidth: fullWidth }, inputProps), { autoComplete: 'nope' }), getSuggestionValue: ramda_1.identity, onSuggestionsFetchRequested: ramda_1.ifElse(ramda_1.propEq('reason', 'input-changed'), debouncedFetchSuggestions, fetchSuggestions), onSuggestionsClearRequested: ramda_1.pipe(ramda_1.always([]), setSuggestions, ramda_1.F, setPlaceholderVisibility), renderInputComponent: function (_a) {
+            }, fullWidth: fullWidth }, inputProps), { autoComplete: 'nope' }), getSuggestionValue: identity, onSuggestionsFetchRequested: ifElse(propEq('reason', 'input-changed'), debouncedFetchSuggestions, fetchSuggestions), onSuggestionsClearRequested: pipe(always([]), setSuggestions, F, setPlaceholderVisibility), renderInputComponent: function (_a) {
             var _b;
             var ref = _a.ref, onInputChange = _a.onChange, otherProps = __rest(_a, ["ref", "onChange"]);
             var commonClasses = {
-                underline: classnames_1.default((_b = {}, _b[styles['input__underline']] = mdm_sdk_1.isEmptyValue(value), _b)),
-                input: classnames_1.default(styles['rawInput'], ramda_1.path(['classes', 'input'], InputProps))
+                underline: classnames((_b = {}, _b[styles['input__underline']] = isEmptyValue(value), _b)),
+                input: classnames(styles['rawInput'], path(['classes', 'input'], InputProps))
             };
-            return multiple ? (react_1.default.createElement(TextField_1.default, __assign({}, otherProps, { ref: inputRef, inputRef: ref, InputProps: __assign(__assign({}, InputProps), { startAdornment: value.map(function (item, index) { return (react_1.default.createElement(ValueChip_1.default, { key: item, label: item, onDelete: function () { return onChange(ramda_1.remove(index, 1, value)); } })); }), classes: __assign({ root: classnames_1.default(styles['multiple-input__input'], ramda_1.path(['classes', 'root'], InputProps)), adornedStart: styles['multiple-input__adornedStart'] }, commonClasses) }), value: currentValue, onChange: onInputChange, classes: { root: styles['multiple-input__root'] } }))) : (react_1.default.createElement(TextField_1.default, __assign({}, otherProps, { ref: inputRef, inputRef: ref, value: value, onChange: ramda_1.pipe(ramda_1.tap(onInputChange), utils_1.getValue, onChange), InputProps: __assign(__assign({}, InputProps), { classes: __assign({ root: classnames_1.default(styles['input__root'], ramda_1.path(['classes', 'root'], InputProps)) }, commonClasses) }) })));
+            return multiple ? (React.createElement(TextField, __assign({}, otherProps, { ref: inputRef, inputRef: ref, InputProps: __assign(__assign({}, InputProps), { startAdornment: value.map(function (item, index) { return (React.createElement(ValueChip, { key: item, label: item, onDelete: function () { return onChange(remove(index, 1, value)); } })); }), classes: __assign({ root: classnames(styles['multiple-input__input'], path(['classes', 'root'], InputProps)), adornedStart: styles['multiple-input__adornedStart'] }, commonClasses) }), value: currentValue, onChange: onInputChange, classes: { root: styles['multiple-input__root'] } }))) : (React.createElement(TextField, __assign({}, otherProps, { ref: inputRef, inputRef: ref, value: value, onChange: pipe(tap(onInputChange), getValue, onChange), InputProps: __assign(__assign({}, InputProps), { classes: __assign({ root: classnames(styles['input__root'], path(['classes', 'root'], InputProps)) }, commonClasses) }) })));
         }, renderSuggestionsContainer: function (_a) {
             var children = _a.children, _b = _a.containerProps, ref = _b.ref, restContainerProps = __rest(_b, ["ref"]);
-            return (react_1.default.createElement(Popper_1.default, { anchorEl: inputRef.current, open: Boolean(children) || isPlaceholderVisible },
-                react_1.default.createElement(Paper_1.default, __assign({ ref: ref, square: true }, restContainerProps, { style: { width: ramda_1.prop('clientWidth', inputRef.current) } }), children || react_1.default.createElement(EmptySearchResult_1.NoResults, { className: styles['typeahead__suggestions-placeholder'] }))));
+            return (React.createElement(Popper, { anchorEl: inputRef.current, open: Boolean(children) || isPlaceholderVisible },
+                React.createElement(Paper, __assign({ ref: ref, square: true }, restContainerProps, { style: { width: prop('clientWidth', inputRef.current) } }), children || React.createElement(NoResults, { className: styles['typeahead__suggestions-placeholder'] }))));
         }, renderSuggestion: function (suggestion, _a) {
             var isHighlighted = _a.isHighlighted;
-            return (react_1.default.createElement(MenuItem_1.default, { className: styles['typeahead__suggestions-menuItem'], selected: isHighlighted, component: "div" },
-                react_1.default.createElement(ExpandedValueTooltip_1.default, { value: suggestion },
-                    react_1.default.createElement("div", { className: styles['menuItem--item'] }, suggestion))));
+            return (React.createElement(MenuItem, { className: styles['typeahead__suggestions-menuItem'], selected: isHighlighted, component: "div" },
+                React.createElement(ExpandedValueTooltip, { value: suggestion },
+                    React.createElement("div", { className: styles['menuItem--item'] }, suggestion))));
         }, theme: {
             container: fullWidth ? styles['typeahead__suggestions-container'] : '',
             suggestionsList: styles['typeahead__suggestions-list'],
             suggestionsContainerOpen: styles['typeahead__suggestions-container--open']
-        }, onSuggestionHighlighted: ramda_1.pipe(ramda_1.prop('suggestion'), Boolean, setHasHighlightedItem) }));
+        }, onSuggestionHighlighted: pipe(prop('suggestion'), Boolean, setHasHighlightedItem) }));
 };
 TypeaheadEditor.propTypes = {
-    multiple: prop_types_1.default.bool,
-    fullWidth: prop_types_1.default.bool,
-    placeholder: prop_types_1.default.string,
-    value: prop_types_1.default.oneOfType([prop_types_1.default.string, prop_types_1.default.arrayOf(prop_types_1.default.string)]),
-    onChange: prop_types_1.default.func.isRequired,
-    getSuggestions: prop_types_1.default.func.isRequired,
-    InputProps: prop_types_1.default.object
+    multiple: PropTypes.bool,
+    fullWidth: PropTypes.bool,
+    placeholder: PropTypes.string,
+    value: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
+    onChange: PropTypes.func.isRequired,
+    getSuggestions: PropTypes.func.isRequired,
+    InputProps: PropTypes.object
 };
-exports.default = TypeaheadEditor;
+export default TypeaheadEditor;

package/components/editors/TypeaheadEditor/styles.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStyles = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.useStyles = styles_1.makeStyles({
+import { makeStyles } from '@material-ui/core/styles';
+export var useStyles = makeStyles({
     'typeahead__suggestions-placeholder': {
         padding: '8px 16px',
         textAlign: 'center'

package/components/editors/commonComponents/MultiValueChip/MultiValueChip.js

@@ -1,4 +1,3 @@
-"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,30 +9,26 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-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 prop_types_1 = __importDefault(require("prop-types"));
-var ramda_1 = require("ramda");
-var ValueChip_1 = __importDefault(require("../../../ValueChip/ValueChip"));
-var Cancel_1 = __importDefault(require("@material-ui/icons/Cancel"));
+import React from 'react';
+import PropTypes from 'prop-types';
+import { prop } from 'ramda';
+import ValueChip from '../../../ValueChip/ValueChip';
+import CancelIcon from '@material-ui/icons/Cancel';
 var MultiValueChip = function (props) {
     var children = props.children, data = props.data, removeProps = props.removeProps;
-    return (react_1.default.createElement(ValueChip_1.default, { tabIndex: -1, label: children, count: ramda_1.prop('formattedNumber', data), onDelete: removeProps.onClick, deleteIcon: react_1.default.createElement(Cancel_1.default, __assign({}, props.removeProps)) }));
+    return (React.createElement(ValueChip, { tabIndex: -1, label: children, count: prop('formattedNumber', data), onDelete: removeProps.onClick, deleteIcon: React.createElement(CancelIcon, __assign({}, props.removeProps)) }));
 };
 MultiValueChip.propTypes = {
-    children: prop_types_1.default.node,
-    data: prop_types_1.default.shape({
-        value: prop_types_1.default.string,
-        label: prop_types_1.default.string,
-        number: prop_types_1.default.number
+    children: PropTypes.node,
+    data: PropTypes.shape({
+        value: PropTypes.string,
+        label: PropTypes.string,
+        number: PropTypes.number
     }).isRequired,
-    removeProps: prop_types_1.default.shape({
-        onClick: prop_types_1.default.func.isRequired,
-        onMouseDown: prop_types_1.default.func.isRequired,
-        onTouchEnd: prop_types_1.default.func.isRequired
+    removeProps: PropTypes.shape({
+        onClick: PropTypes.func.isRequired,
+        onMouseDown: PropTypes.func.isRequired,
+        onTouchEnd: PropTypes.func.isRequired
     }).isRequired
 };
-exports.default = MultiValueChip;
+export default MultiValueChip;

package/components/editors/constants.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSelectStyles = exports.useInputStyles = exports.commonTextFieldProps = void 0;
-var styles_1 = require("@material-ui/core/styles");
-exports.commonTextFieldProps = {
+import { makeStyles } from '@material-ui/core/styles';
+export var commonTextFieldProps = {
     variant: 'filled',
     margin: 'dense',
     hiddenLabel: true
 };
-exports.useInputStyles = styles_1.makeStyles({
+export var useInputStyles = makeStyles({
     filledInputUnderline: {
         '&:before': {
             display: 'none'
@@ -17,7 +14,7 @@ exports.useInputStyles = styles_1.makeStyles({
         margin: 0
     }
 });
-exports.useSelectStyles = styles_1.makeStyles({
+export var useSelectStyles = makeStyles({
     root: {
         paddingRight: '48px !important'
     },