@reltio/components 1.4.1598 → 1.4.1600

package/esm/components/editors/TimestampEditor/TimestampEditor.js

@@ -22,18 +22,19 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React, { useMemo } from 'react';
 import i18n from 'ui-i18n';
-import { mergeDeepLeft } from 'ramda';
+import classnames from 'classnames';
+import { mergeDeepLeft, isNil, pipe, when, both } from 'ramda';
 import moment from 'moment';
 import { getLocaleFormat, utils } from '@reltio/mdm-sdk';
-import { both, isNil, pipe, when } from 'ramda';
 import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
 import { renderTimeViewClock } from '@mui/x-date-pickers/timeViewRenderers';
 import { DEFAULT_MAX_DATE, DEFAULT_MIN_DATE } from '../constants';
 import { useStyles } from './styles';
 var TimestampEditor = function (_a) {
-    var value = _a.value, _b = _a.minDate, minDate = _b === void 0 ? DEFAULT_MIN_DATE : _b, _c = _a.maxDate, maxDate = _c === void 0 ? DEFAULT_MAX_DATE : _c, label = _a.label, slotProps = _a.slotProps, onChange = _a.onChange, format = _a.format, otherProps = __rest(_a, ["value", "minDate", "maxDate", "label", "slotProps", "onChange", "format"]);
+    var _b;
+    var value = _a.value, _c = _a.minDate, minDate = _c === void 0 ? DEFAULT_MIN_DATE : _c, _d = _a.maxDate, maxDate = _d === void 0 ? DEFAULT_MAX_DATE : _d, label = _a.label, slotProps = _a.slotProps, onChange = _a.onChange, format = _a.format, isCrossedOut = _a.isCrossedOut, otherProps = __rest(_a, ["value", "minDate", "maxDate", "label", "slotProps", "onChange", "format", "isCrossedOut"]);
     var styles = useStyles();
-    var _d = React.useState(null), error = _d[0], setError = _d[1];
+    var _e = React.useState(null), error = _e[0], setError = _e[1];
     var errorMessage = useMemo(function () {
         switch (error) {
             case 'maxDate':
@@ -58,7 +59,7 @@ var TimestampEditor = function (_a) {
             helperText: errorMessage,
             InputProps: {
                 classes: {
-                    root: styles.inputRoot
+                    root: classnames(styles.inputRoot, (_b = {}, _b[styles.isCrossedOut] = isCrossedOut, _b))
                 },
                 disableUnderline: isNil(editorValue)
             },

package/esm/components/editors/TimestampEditor/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"underline" | "inputRoot" | "adornedEnd" | "iconButtonRoot" | "inputLabel">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"underline" | "isCrossedOut" | "inputRoot" | "adornedEnd" | "iconButtonRoot" | "inputLabel">;

package/esm/components/editors/TimestampEditor/styles.js

@@ -21,5 +21,8 @@ export var useStyles = makeStyles(function (theme) { return ({
         fontSize: '14px',
         letterSpacing: 0,
         lineHeight: '16px'
+    },
+    isCrossedOut: {
+        textDecoration: 'line-through'
     }
 }); });

package/esm/components/editors/TypeaheadEditor/TypeaheadEditor.d.ts

@@ -1,5 +1,5 @@
 export default TypeaheadEditor;
-declare function TypeaheadEditor({ value, max, getSuggestions, onChange, multiple, fullWidth, InputProps, ...inputProps }: {
+declare function TypeaheadEditor({ value, max, getSuggestions, onChange, multiple, fullWidth, InputProps, isCrossedOut, ...inputProps }: {
     [x: string]: any;
     value: any;
     max?: number;
@@ -8,6 +8,7 @@ declare function TypeaheadEditor({ value, max, getSuggestions, onChange, multipl
     multiple: any;
     fullWidth: any;
     InputProps?: {};
+    isCrossedOut?: boolean;
 }): JSX.Element;
 declare namespace TypeaheadEditor {
     namespace propTypes {
@@ -19,6 +20,7 @@ declare namespace TypeaheadEditor {
         const getSuggestions: PropTypes.Validator<(...args: any[]) => any>;
         const InputProps: PropTypes.Requireable<object>;
         const max: PropTypes.Requireable<number>;
+        const isCrossedOut: PropTypes.Requireable<boolean>;
     }
 }
 import PropTypes from 'prop-types';

package/esm/components/editors/TypeaheadEditor/TypeaheadEditor.js

@@ -50,13 +50,13 @@ import { useDidUpdateEffect } from '../../../hooks';
 var FETCH_DEBOUNCE_INTERVAL = 300;
 var PAGE_SIZE = 50;
 var TypeaheadEditor = function (_a) {
-    var value = _a.value, _b = _a.max, max = _b === void 0 ? PAGE_SIZE : _b, getSuggestions = _a.getSuggestions, onChange = _a.onChange, multiple = _a.multiple, fullWidth = _a.fullWidth, _c = _a.InputProps, InputProps = _c === void 0 ? {} : _c, inputProps = __rest(_a, ["value", "max", "getSuggestions", "onChange", "multiple", "fullWidth", "InputProps"]);
-    var _d = useState([]), suggestions = _d[0], setSuggestions = _d[1];
-    var _e = useState(false), isPlaceholderVisible = _e[0], setPlaceholderVisibility = _e[1];
-    var _f = useState(1), pageNumber = _f[0], setPageNumber = _f[1];
-    var _g = useState(false), nextPageIsLoading = _g[0], setNextPageIsLoading = _g[1];
+    var value = _a.value, _b = _a.max, max = _b === void 0 ? PAGE_SIZE : _b, getSuggestions = _a.getSuggestions, onChange = _a.onChange, multiple = _a.multiple, fullWidth = _a.fullWidth, _c = _a.InputProps, InputProps = _c === void 0 ? {} : _c, _d = _a.isCrossedOut, isCrossedOut = _d === void 0 ? false : _d, inputProps = __rest(_a, ["value", "max", "getSuggestions", "onChange", "multiple", "fullWidth", "InputProps", "isCrossedOut"]);
+    var _e = useState([]), suggestions = _e[0], setSuggestions = _e[1];
+    var _f = useState(false), isPlaceholderVisible = _f[0], setPlaceholderVisibility = _f[1];
+    var _g = useState(1), pageNumber = _g[0], setPageNumber = _g[1];
+    var _h = useState(false), nextPageIsLoading = _h[0], setNextPageIsLoading = _h[1];
     var pageSizeForRequest = max + 1;
-    var _h = useState(''), currentValue = _h[0], setCurrentValue = _h[1];
+    var _j = useState(''), currentValue = _j[0], setCurrentValue = _j[1];
     value = defaultTo(multiple ? [] : '', value);
     var inputValue = multiple ? currentValue : value;
     useDidUpdateEffect(function () {
@@ -82,7 +82,7 @@ var TypeaheadEditor = function (_a) {
     ]);
     var displayedSuggestions = useMemo(function () { return suggestions.slice(0, pageNumber * max); }, [suggestions, pageNumber, max]);
     var showMoreButton = suggestions.length > displayedSuggestions.length;
-    var _j = useState(false), hasHighlightedItem = _j[0], setHasHighlightedItem = _j[1];
+    var _k = useState(false), hasHighlightedItem = _k[0], setHasHighlightedItem = _k[1];
     var onInputChange = function (_a) {
         var newValue = _a.newValue, method = _a.method;
         switch (method) {
@@ -121,13 +121,15 @@ var TypeaheadEditor = function (_a) {
                     onInputChange({ method: 'enter', newValue: currentValue });
                 }
             }, fullWidth: fullWidth }, inputProps), { autoComplete: 'nope' }), getSuggestionValue: identity, onSuggestionsFetchRequested: ifElse(propEq('reason', 'input-changed'), debouncedFetchSuggestions, fetchSuggestions), onSuggestionsClearRequested: pipe(always([]), setSuggestions, F, setPlaceholderVisibility, always(1), setPageNumber), renderInputComponent: function (_a) {
-            var _b;
+            var _b, _c;
             var ref = _a.ref, onInputChange = _a.onChange, otherProps = __rest(_a, ["ref", "onChange"]);
             var commonClasses = {
                 underline: classnames((_b = {}, _b[styles['input__underline']] = isEmptyValue(value), _b)),
                 input: classnames(styles['rawInput'], path(['classes', 'input'], InputProps))
             };
-            return multiple ? (React.createElement(TextField, __assign({ variant: "standard" }, 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)); } })); }), inputComponent: AutosizeInput, classes: __assign(__assign({ root: classnames(styles['multiple-input__input'], path(['classes', 'root'], InputProps)) }, commonClasses), { input: classnames(styles.autosizeInput, commonClasses.input), adornedStart: styles['multiple-input__adornedStart'] }) }), value: currentValue, onChange: onInputChange, classes: { root: styles['multiple-input__root'] } }))) : (React.createElement(TextField, __assign({ variant: "standard" }, 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) }) })));
+            return multiple ? (React.createElement(TextField, __assign({ variant: "standard" }, 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)); } })); }), inputComponent: AutosizeInput, classes: __assign(__assign({ root: classnames(styles['multiple-input__input'], path(['classes', 'root'], InputProps)) }, commonClasses), { input: classnames(styles.autosizeInput, commonClasses.input), adornedStart: styles['multiple-input__adornedStart'] }) }), value: currentValue, onChange: onInputChange, classes: { root: styles['multiple-input__root'] } }))) : (React.createElement(TextField, __assign({ variant: "standard" }, 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), (_c = {},
+                            _c[styles.isCrossedOut] = isCrossedOut,
+                            _c)) }, commonClasses) }) })));
         }, renderSuggestionsContainer: function (_a) {
             var children = _a.children, _b = _a.containerProps, ref = _b.ref, restContainerProps = __rest(_b, ["ref"]);
             return (React.createElement(Popper, { anchorEl: inputRef.current, open: Boolean(children) || isPlaceholderVisible },
@@ -153,6 +155,7 @@ TypeaheadEditor.propTypes = {
     onChange: PropTypes.func.isRequired,
     getSuggestions: PropTypes.func.isRequired,
     InputProps: PropTypes.object,
-    max: PropTypes.number
+    max: PropTypes.number,
+    isCrossedOut: PropTypes.bool
 };
 export default TypeaheadEditor;

package/esm/components/editors/TypeaheadEditor/styles.d.ts

@@ -1 +1 @@
-export const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"autosizeInput" | "typeahead__suggestions-placeholder" | "typeahead__suggestions-container--open" | "typeahead__suggestions-list" | "typeahead__suggestions-menuItem" | "input__root" | "rawInput" | "multiple-input__root" | "multiple-input__input" | "multiple-input__adornedStart" | "input__underline" | "typeahead__suggestions-container" | "menuItem--item">;
+export const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"isCrossedOut" | "autosizeInput" | "typeahead__suggestions-placeholder" | "typeahead__suggestions-container--open" | "typeahead__suggestions-list" | "typeahead__suggestions-menuItem" | "input__root" | "rawInput" | "multiple-input__root" | "multiple-input__input" | "multiple-input__adornedStart" | "input__underline" | "typeahead__suggestions-container" | "menuItem--item">;

package/esm/components/editors/TypeaheadEditor/styles.js

@@ -42,6 +42,9 @@ export var useStyles = makeStyles({
         paddingTop: '10px',
         paddingBottom: '11px'
     },
+    isCrossedOut: {
+        textDecoration: 'line-through'
+    },
     'multiple-input__root': {
         flexWrap: 'wrap',
         color: 'rgba(0,0,0,0.87)',

package/esm/hooks/useLayoutResetter.js

@@ -10,8 +10,7 @@ export var useLayoutResetter = function (_a) {
         onDismissClick: onResetUndo,
         showDismiss: true,
         autoHideDuration: 5000,
-        dismissTitle: i18n.text('Undo'),
-        anchorOrigin: { vertical: 'bottom', horizontal: 'center' }
+        dismissTitle: i18n.text('Undo')
     }), SnackbarRenderer = _b.SnackbarRenderer, showSnackbarMessage = _b.showSnackbarMessage;
     return { SnackbarRenderer: SnackbarRenderer, resetLayout: resetLayout };
 };

package/esm/hooks/useSnackbar.js

@@ -7,9 +7,9 @@ import Snackbar from '@mui/material/Snackbar';
 import { noop } from '../core';
 var FIVE_MINUTES = 5 * 60 * 1000;
 export var useSnackbar = function (_a) {
-    var _b = _a === void 0 ? {} : _a, anchorOrigin = _b.anchorOrigin, showDismiss = _b.showDismiss, _c = _b.dismissTitle, dismissTitle = _c === void 0 ? i18n.text('Dismiss') : _c, _d = _b.autoHideDuration, autoHideDuration = _d === void 0 ? FIVE_MINUTES : _d, _e = _b.onDismissClick, onDismissClick = _e === void 0 ? noop : _e;
-    var _f = useState(false), isOpenSnackbar = _f[0], setIsOpenSnackbar = _f[1];
-    var _g = useState(''), snackbarMessage = _g[0], setSnackbarMessage = _g[1];
+    var _b = _a === void 0 ? {} : _a, _c = _b.anchorOrigin, anchorOrigin = _c === void 0 ? { vertical: 'bottom', horizontal: 'center' } : _c, showDismiss = _b.showDismiss, _d = _b.dismissTitle, dismissTitle = _d === void 0 ? i18n.text('Dismiss') : _d, _e = _b.autoHideDuration, autoHideDuration = _e === void 0 ? FIVE_MINUTES : _e, _f = _b.onDismissClick, onDismissClick = _f === void 0 ? noop : _f;
+    var _g = useState(false), isOpenSnackbar = _g[0], setIsOpenSnackbar = _g[1];
+    var _h = useState(''), snackbarMessage = _h[0], setSnackbarMessage = _h[1];
     var closeSnackbar = useCallback(function () {
         setIsOpenSnackbar(false);
         setSnackbarMessage('');

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.1598",
+  "version": "1.4.1600",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "./cjs/index.js",
   "module": "./esm/index.js",
   "dependencies": {
     "@date-io/moment": "^1.3.5",
     "@react-google-maps/api": "2.7.0",
-    "@reltio/mdm-module": "^1.4.1598",
-    "@reltio/mdm-sdk": "^1.4.1598",
+    "@reltio/mdm-module": "^1.4.1600",
+    "@reltio/mdm-sdk": "^1.4.1600",
     "classnames": "^2.2.5",
     "d3-cloud": "^1.2.5",
     "d3-geo": "^2.0.1",