@reltio/components 1.4.874 → 1.4.878

package/components/editors/DataTypeValueEditor/useEditorContext.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,39 +9,19 @@ 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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
-var mdm_sdk_1 = require("@reltio/mdm-sdk");
-var react_redux_1 = require("react-redux");
-var react_1 = require("react");
-var ramda_1 = require("ramda");
+import mdm, { profile } from '@reltio/mdm-module';
+import { DataTypes, getDependentLookups, getFacetedAttributeData, getLookups, resolveLookupsList } from '@reltio/mdm-sdk';
+import { useDispatch, useSelector } from 'react-redux';
+import { useCallback } from 'react';
+import { propOr } from 'ramda';
 var useEditorContext = function (fieldName, dataTypeDefinition) {
-    var tenant = react_redux_1.useSelector(mdm_module_1.default.selectors.getTenant);
-    var lookups = react_redux_1.useSelector(mdm_module_1.default.selectors.getLookups);
-    var attributePresentations = react_redux_1.useSelector(mdm_module_1.default.selectors.getAttributePresentations);
-    var globalSearchRequestOptions = react_redux_1.useSelector(mdm_module_1.default.selectors.getGlobalSearchRequestOptions);
-    var dispatch = react_redux_1.useDispatch();
-    var typeaheadGetSuggestion = react_1.useCallback(function (searchValue) {
-        return mdm_sdk_1.getFacetedAttributeData({
+    var tenant = useSelector(mdm.selectors.getTenant);
+    var lookups = useSelector(mdm.selectors.getLookups);
+    var attributePresentations = useSelector(mdm.selectors.getAttributePresentations);
+    var globalSearchRequestOptions = useSelector(mdm.selectors.getGlobalSearchRequestOptions);
+    var dispatch = useDispatch();
+    var typeaheadGetSuggestion = useCallback(function (searchValue) {
+        return getFacetedAttributeData({
             fieldName: fieldName,
             searchValue: searchValue,
             options: __assign({}, globalSearchRequestOptions)
@@ -50,34 +29,34 @@ var useEditorContext = function (fieldName, dataTypeDefinition) {
     }, [fieldName, globalSearchRequestOptions]);
     var type = dataTypeDefinition.type, values = dataTypeDefinition.values, lookupCode = dataTypeDefinition.lookupCode, uri = dataTypeDefinition.uri, dependentLookupCode = dataTypeDefinition.dependentLookupCode, options = dataTypeDefinition.options;
     switch (type) {
-        case mdm_sdk_1.DataTypes.TYPE_ENUM:
+        case DataTypes.TYPE_ENUM:
             return { entries: values.map(function (value) { return ({ value: value }); }) };
-        case mdm_sdk_1.DataTypes.TYPE_LOOKUP:
+        case DataTypes.TYPE_LOOKUP:
             return {
                 lookups: lookups,
                 lookupCode: lookupCode,
                 getLookups: function () {
-                    return mdm_sdk_1.getLookups().then(function (lookups) {
-                        dispatch(mdm_module_1.profile.lookups.actions.lookupsLoaded(lookups));
+                    return getLookups().then(function (lookups) {
+                        dispatch(profile.lookups.actions.lookupsLoaded(lookups));
                     });
                 }
             };
-        case mdm_sdk_1.DataTypes.TYPE_DEPENDENT_LOOKUP:
+        case DataTypes.TYPE_DEPENDENT_LOOKUP:
             return {
                 lookups: lookups,
                 lookupCode: dependentLookupCode,
                 getLookups: function (type, parents, displayNamePrefix) {
-                    return mdm_sdk_1.getDependentLookups({ type: type, parents: parents, displayNamePrefix: displayNamePrefix }).then(function (_a) {
+                    return getDependentLookups({ type: type, parents: parents, displayNamePrefix: displayNamePrefix }).then(function (_a) {
                         var codeValues = _a.codeValues;
-                        return ramda_1.propOr({}, type, codeValues);
+                        return propOr({}, type, codeValues);
                     });
                 },
                 resolveLookups: function (type, codeValues) {
                     var lookupsList = codeValues.map(function (codeValue) { return ({ type: type, codeValue: codeValue }); });
-                    return mdm_sdk_1.resolveLookupsList(lookupsList).then(function (response) {
+                    return resolveLookupsList(lookupsList).then(function (response) {
                         if (Array.isArray(response)) {
                             var lookups_1 = response.reduce(function (acc, lookupData) { return (__assign(__assign({}, acc), lookupData[type])); }, {});
-                            dispatch(mdm_module_1.profile.lookups.actions.lookupsForTypeResolved({
+                            dispatch(profile.lookups.actions.lookupsForTypeResolved({
                                 type: type,
                                 values: lookups_1
                             }));
@@ -85,24 +64,24 @@ var useEditorContext = function (fieldName, dataTypeDefinition) {
                     });
                 }
             };
-        case mdm_sdk_1.DataTypes.TYPE_TYPEAHEAD:
+        case DataTypes.TYPE_TYPEAHEAD:
             return {
                 getSuggestions: typeaheadGetSuggestion
             };
-        case mdm_sdk_1.DataTypes.TYPE_NUMBER:
-        case mdm_sdk_1.DataTypes.TYPE_FLOAT:
-        case mdm_sdk_1.DataTypes.TYPE_DOUBLE:
-        case mdm_sdk_1.DataTypes.TYPE_LONG:
-        case mdm_sdk_1.DataTypes.TYPE_INT:
+        case DataTypes.TYPE_NUMBER:
+        case DataTypes.TYPE_FLOAT:
+        case DataTypes.TYPE_DOUBLE:
+        case DataTypes.TYPE_LONG:
+        case DataTypes.TYPE_INT:
             return {
                 format: attributePresentations[uri]
             };
-        case mdm_sdk_1.DataTypes.TYPE_FILE:
+        case DataTypes.TYPE_FILE:
             return { tenant: tenant };
-        case mdm_sdk_1.DataTypes.TYPE_SELECT:
+        case DataTypes.TYPE_SELECT:
             return { entries: options };
         default:
             return {};
     }
 };
-exports.default = useEditorContext;
+export default useEditorContext;

package/components/editors/DateEditor/DateEditor.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,35 +20,31 @@ 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 mdm_sdk_1 = require("@reltio/mdm-sdk");
-var pickers_1 = require("@material-ui/pickers");
-var prop_types_2 = require("../../../constants/prop-types");
-var Calendar_1 = __importDefault(require("../../../icons/Calendar"));
-var styles_1 = require("./styles");
-var format = moment_1.default.localeData().longDateFormat('L');
+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 { utils, debounce } from '@reltio/mdm-sdk';
+import { KeyboardDatePicker } from '@material-ui/pickers';
+import { InputVariant } from '../../../constants/prop-types';
+import CalendarIcon from '../../../icons/Calendar';
+import { useStyles } from './styles';
+var format = moment.localeData().longDateFormat('L');
 var DateEditor = 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, otherProps = __rest(_a, ["value", "label", "variant", "onChange", "InputProps"]);
-    var styles = styles_1.useStyles();
-    var _e = react_1.useState(false), isCalendarOpen = _e[0], setIsCalendarOpen = _e[1];
-    return (react_1.default.createElement(pickers_1.KeyboardDatePicker, __assign({ format: format, 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, autoOk: true, InputAdornmentProps: { position: 'end', classes: { positionEnd: styles.adornmentPositionEnd } }, KeyboardButtonProps: {
+    var styles = useStyles();
+    var _e = useState(false), isCalendarOpen = _e[0], setIsCalendarOpen = _e[1];
+    return (React.createElement(KeyboardDatePicker, __assign({ format: format, 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, autoOk: true, InputAdornmentProps: { position: 'end', classes: { positionEnd: styles.adornmentPositionEnd } }, KeyboardButtonProps: {
             classes: { root: styles.iconButtonRoot },
-            onKeyPress: ramda_1.invoker(0, 'stopPropagation')
-        }, keyboardIcon: react_1.default.createElement(Calendar_1.default, { className: styles.icon }), onChange: mdm_sdk_1.debounce(ramda_1.when(mdm_sdk_1.utils.dates.isValidMomentDateOrNull, ramda_1.pipe(mdm_sdk_1.utils.dates.momentToDate, mdm_sdk_1.utils.dates.clearDateTime, onChange)), 0), label: label, "aria-label": label, value: value, placeholder: ui_i18n_1.default.text(format), disableToolbar: true, onClose: function () { return setIsCalendarOpen(false); }, onOpen: function () { return setIsCalendarOpen(true); }, InputProps: __assign({ classes: {
+            onKeyPress: invoker(0, 'stopPropagation')
+        }, keyboardIcon: React.createElement(CalendarIcon, { className: styles.icon }), onChange: debounce(when(utils.dates.isValidMomentDateOrNull, pipe(utils.dates.momentToDate, utils.dates.clearDateTime, onChange)), 0), label: label, "aria-label": label, value: value, placeholder: i18n.text(format), 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'
@@ -81,14 +57,14 @@ var DateEditor = function (_a) {
             classes: {
                 root: isCalendarOpen ? styles.inputLabel : undefined
             },
-            shrink: !ramda_1.isNil(label)
+            shrink: !isNil(label)
         } }, otherProps)));
 };
 DateEditor.propTypes = {
-    value: prop_types_1.default.oneOfType([prop_types_1.default.number, prop_types_1.default.instanceOf(Date)]),
-    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)]),
+    label: PropTypes.string,
+    variant: InputVariant,
+    InputProps: PropTypes.object,
+    onChange: PropTypes.func.isRequired
 };
-exports.default = DateEditor;
+export default DateEditor;

package/components/editors/DateEditor/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 ({
     icon: {
         color: theme.palette.text.secondary
     },

package/components/editors/DateRangeEditor/DateRangeEditor.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,56 +20,52 @@ 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 classnames_1 = __importDefault(require("classnames"));
-var moment_1 = __importDefault(require("moment"));
-var ui_i18n_1 = __importDefault(require("ui-i18n"));
-var ramda_1 = require("ramda");
-var mdm_sdk_1 = require("@reltio/mdm-sdk");
-var TextField_1 = __importDefault(require("@material-ui/core/TextField"));
-var MenuItem_1 = __importDefault(require("@material-ui/core/MenuItem"));
-var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
-var styles_1 = require("./styles");
-var Menu_1 = __importDefault(require("@material-ui/core/Menu"));
-var DropdownIndicatorWithIconButton_1 = __importDefault(require("../../commonReactSelectComponents/DropdownIndicatorWithIconButton"));
-var DateRangePicker_1 = __importDefault(require("../../DateRangePicker/DateRangePicker"));
-var localeFormat = moment_1.default.localeData().longDateFormat('L');
+import React, { useCallback, useMemo, useRef, useState } from 'react';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
+import moment from 'moment';
+import i18n from 'ui-i18n';
+import { always, cond, curry, defaultTo, identity, is, isNil, map, pipe, prop, propEq } from 'ramda';
+import { DataTypes, DateRangeValues, formatDataTypeValue, getDateRangeByValue, getRangeOptionLabel, isEmptyValue } from '@reltio/mdm-sdk';
+import TextField from '@material-ui/core/TextField';
+import MenuItem from '@material-ui/core/MenuItem';
+import Typography from '@material-ui/core/Typography';
+import { useStyles } from './styles';
+import Menu from '@material-ui/core/Menu';
+import DropdownIndicatorWithIconButton from '../../commonReactSelectComponents/DropdownIndicatorWithIconButton';
+import DateRangePicker from '../../DateRangePicker/DateRangePicker';
+var localeFormat = moment.localeData().longDateFormat('L');
 var formatValue = function (value, dataTypeDefinition, placeholder) {
-    return ramda_1.isNil(value) ? "" + placeholder : "" + mdm_sdk_1.formatDataTypeValue({ dataTypeDefinition: dataTypeDefinition }, value);
+    return isNil(value) ? "" + placeholder : "" + formatDataTypeValue({ dataTypeDefinition: dataTypeDefinition }, value);
 };
-var getEditorValue = ramda_1.curry(function (placeholder, dataTypeDefinition, value, options) {
-    return ramda_1.cond([
-        [mdm_sdk_1.isEmptyValue, ramda_1.always({ value: '', label: '' })],
+var getEditorValue = curry(function (placeholder, dataTypeDefinition, value, options) {
+    return cond([
+        [isEmptyValue, always({ value: '', label: '' })],
         [
-            ramda_1.is(Array),
+            is(Array),
             function (value) { return ({
                 value: value,
                 label: value.map(function (value) { return formatValue(value, dataTypeDefinition, placeholder); }).join(' \u2014 ')
             }); }
         ],
-        [ramda_1.is(String), function (value) { return options.find(ramda_1.propEq('value', value)); }]
+        [is(String), function (value) { return options.find(propEq('value', value)); }]
     ])(value);
 });
-var convertValuesToDate = ramda_1.pipe(mdm_sdk_1.getDateRangeByValue, ramda_1.defaultTo([]), ramda_1.map(function (value) { return value && new Date(value); }));
+var convertValuesToDate = pipe(getDateRangeByValue, defaultTo([]), map(function (value) { return value && new Date(value); }));
 var DateRangeEditor = function (_a) {
     var _b;
-    var label = _a.label, values = _a.values, options = _a.options, _c = _a.getValuesDateRange, getValuesDateRange = _c === void 0 ? convertValuesToDate : _c, _d = _a.onChange, onChange = _d === void 0 ? ramda_1.identity : _d, _e = _a.dataTypeDefinition, dataTypeDefinition = _e === void 0 ? {} : _e, _f = _a.TextFieldProps, TextFieldProps = _f === void 0 ? {} : _f, otherProps = __rest(_a, ["label", "values", "options", "getValuesDateRange", "onChange", "dataTypeDefinition", "TextFieldProps"]);
-    var placeholder = localeFormat + (dataTypeDefinition.type === mdm_sdk_1.DataTypes.TYPE_TIMESTAMP ? ' HH:MM' : '');
-    var rangeOptions = react_1.useMemo(function () {
+    var label = _a.label, values = _a.values, options = _a.options, _c = _a.getValuesDateRange, getValuesDateRange = _c === void 0 ? convertValuesToDate : _c, _d = _a.onChange, onChange = _d === void 0 ? identity : _d, _e = _a.dataTypeDefinition, dataTypeDefinition = _e === void 0 ? {} : _e, _f = _a.TextFieldProps, TextFieldProps = _f === void 0 ? {} : _f, otherProps = __rest(_a, ["label", "values", "options", "getValuesDateRange", "onChange", "dataTypeDefinition", "TextFieldProps"]);
+    var placeholder = localeFormat + (dataTypeDefinition.type === DataTypes.TYPE_TIMESTAMP ? ' HH:MM' : '');
+    var rangeOptions = useMemo(function () {
         return options ||
-            Object.values(mdm_sdk_1.DateRangeValues).map(function (option) { return ({ value: option, label: mdm_sdk_1.getRangeOptionLabel(option) }); });
+            Object.values(DateRangeValues).map(function (option) { return ({ value: option, label: getRangeOptionLabel(option) }); });
     }, [options]);
-    var inputRef = react_1.useRef(null);
-    var _g = react_1.useState(false), open = _g[0], setOpen = _g[1];
-    var _h = react_1.useState(), customValue = _h[0], setCustomValue = _h[1];
-    var styles = styles_1.useStyles();
+    var inputRef = useRef(null);
+    var _g = useState(false), open = _g[0], setOpen = _g[1];
+    var _h = useState(), customValue = _h[0], setCustomValue = _h[1];
+    var styles = useStyles();
     var onItemClick = function (value) {
-        if (value === mdm_sdk_1.DateRangeValues.PICK_DATE) {
+        if (value === DateRangeValues.PICK_DATE) {
             setCustomValue(value);
         }
         else {
@@ -98,28 +74,28 @@ var DateRangeEditor = function (_a) {
             onChange(value);
         }
     };
-    var handleToggle = react_1.useCallback(function () { return setOpen(function (open) { return !open; }); }, []);
+    var handleToggle = useCallback(function () { return setOpen(function (open) { return !open; }); }, []);
     var onCancel = function () {
         setCustomValue();
         setOpen(false);
     };
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(TextField_1.default, __assign({}, TextFieldProps, otherProps, { label: label, value: getEditorValue(placeholder, dataTypeDefinition, customValue || values, rangeOptions).label, onClick: handleToggle, variant: "filled", margin: "dense", ref: inputRef, InputProps: {
-                endAdornment: (react_1.default.createElement(DropdownIndicatorWithIconButton_1.default, { selectProps: { classes: styles, menuIsOpen: open }, innerProps: {} })),
+    return (React.createElement(React.Fragment, null,
+        React.createElement(TextField, __assign({}, TextFieldProps, otherProps, { label: label, value: getEditorValue(placeholder, dataTypeDefinition, customValue || values, rangeOptions).label, onClick: handleToggle, variant: "filled", margin: "dense", ref: inputRef, InputProps: {
+                endAdornment: (React.createElement(DropdownIndicatorWithIconButton, { selectProps: { classes: styles, menuIsOpen: open }, innerProps: {} })),
                 classes: {
                     root: styles.inputRoot,
-                    underline: classnames_1.default((_b = {}, _b[styles.underline] = open, _b)),
+                    underline: classnames((_b = {}, _b[styles.underline] = open, _b)),
                     adornedEnd: styles.adornedEnd
                 },
-                disableUnderline: ramda_1.isNil(values),
+                disableUnderline: isNil(values),
                 readOnly: true
             }, InputLabelProps: {
                 classes: {
                     root: open ? styles.inputLabel : undefined
                 },
-                shrink: !ramda_1.isNil(label)
-            }, placeholder: ui_i18n_1.default.text(placeholder + " \u2014 " + placeholder) })),
-        react_1.default.createElement(Menu_1.default, { variant: "menu", open: open, autoFocus: false, classes: { paper: styles.paper }, anchorEl: inputRef.current, onClose: onCancel, anchorOrigin: {
+                shrink: !isNil(label)
+            }, placeholder: i18n.text(placeholder + " \u2014 " + placeholder) })),
+        React.createElement(Menu, { variant: "menu", open: open, autoFocus: false, classes: { paper: styles.paper }, anchorEl: inputRef.current, onClose: onCancel, anchorOrigin: {
                 vertical: 'bottom',
                 horizontal: 'left'
             }, transformOrigin: {
@@ -127,20 +103,20 @@ var DateRangeEditor = function (_a) {
                 horizontal: 'left'
             }, elevation: 2, getContentAnchorEl: null, MenuListProps: {
                 autoFocusItem: open,
-                style: { width: customValue ? '100%' : ramda_1.prop('clientWidth', inputRef.current) }
-            } }, customValue ? (react_1.default.createElement(DateRangePicker_1.default, { values: getValuesDateRange(values), onCancel: onCancel, onApply: onItemClick, type: dataTypeDefinition.type })) : (rangeOptions.map(function (option) { return (react_1.default.createElement(MenuItem_1.default, { key: option.value, value: option.value, onClick: function () { return onItemClick(option.value); }, className: styles.menuItem },
-            react_1.default.createElement(Typography_1.default, { classes: { root: styles.menuText } }, option.label))); })))));
+                style: { width: customValue ? '100%' : prop('clientWidth', inputRef.current) }
+            } }, customValue ? (React.createElement(DateRangePicker, { values: getValuesDateRange(values), onCancel: onCancel, onApply: onItemClick, type: dataTypeDefinition.type })) : (rangeOptions.map(function (option) { return (React.createElement(MenuItem, { key: option.value, value: option.value, onClick: function () { return onItemClick(option.value); }, className: styles.menuItem },
+            React.createElement(Typography, { classes: { root: styles.menuText } }, option.label))); })))));
 };
 DateRangeEditor.propTypes = {
-    label: prop_types_1.default.string,
-    values: prop_types_1.default.oneOfType([prop_types_1.default.string, prop_types_1.default.array]),
-    options: prop_types_1.default.arrayOf(prop_types_1.default.shape({
-        value: prop_types_1.default.string,
-        label: prop_types_1.default.string
+    label: PropTypes.string,
+    values: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
+    options: PropTypes.arrayOf(PropTypes.shape({
+        value: PropTypes.string,
+        label: PropTypes.string
     })),
-    getValuesDateRange: prop_types_1.default.func,
-    onChange: prop_types_1.default.func,
-    dataTypeDefinition: prop_types_1.default.object,
-    TextFieldProps: prop_types_1.default.object
+    getValuesDateRange: PropTypes.func,
+    onChange: PropTypes.func,
+    dataTypeDefinition: PropTypes.object,
+    TextFieldProps: PropTypes.object
 };
-exports.default = DateRangeEditor;
+export default DateRangeEditor;

package/components/editors/DateRangeEditor/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 ({
     dropdownIndicator: {
         transition: 'transform .15s ease',
         cursor: 'pointer',