@mailstep/design-system 0.6.9 → 0.6.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mailstep/design-system",
-  "version": "0.6.9",
+  "version": "0.6.10",
   "license": "ISC",
   "type": "module",
   "main": "./ui/index.js",

package/ui/Blocks/CommonGrid/components/NumberRange/NumberRange.js

@@ -26,6 +26,7 @@ import { useClickOutside } from '../../../Modal/hooks/useClickOutside';
 import { Input } from '../../../../Forms/Input/Input';
 import IconList from '../IconList';
 import { i18n } from '@lingui/core';
+import { useEvent } from '../../hooks/useEvent';
 var OverlayComponentDefault = function (_a) {
     var children = _a.children;
     return _jsx("div", { children: children });
@@ -60,17 +61,15 @@ var NumberRange = function (props) {
     var onClose = useCallback(function () { return setOpen(false); }, []);
     var pickerRef = useClickOutside({ onClose: onClose });
     var togglePicker = useCallback(function () { return setOpen(!isOpen); }, [isOpen, setOpen]);
-    var onChangeTextInput = useCallback(function (event) {
+    var onChangeTextInput = useEvent(function (event) {
         var fieldValue = event.target.value.replace(',', '.');
-        var number = !decimals
-            ? parseInt(fieldValue)
-            : (parseFloat(fieldValue) || 0).toFixed(decimals).substr(0, fieldValue.length);
+        var number = !decimals ? parseInt(fieldValue) : (parseFloat(fieldValue) || 0).toFixed(decimals).substr(0, fieldValue.length);
         var isValid = number || number === 0;
         onChange({ comparator: comparator, value: isValid ? number : '' });
-    }, [onChange, comparator, decimals, value]);
-    var onChangeComparator = useCallback(function (option) {
+    });
+    var onChangeComparator = useEvent(function (option) {
         onChange({ comparator: option.value, value: fieldValue });
-    }, []);
+    });
     return (_jsxs("div", { ref: pickerRef, children: [_jsx(Input, __assign({ name: name, value: fieldValue, label: label, "data-cy": "".concat(name, "Inp"), onChange: onChangeTextInput, iconOnClick: togglePicker, appearance: "grid", icon: "ellipsisVertical", iconPlacement: "right", type: "text", className: className, autoComplete: "off" }, rest)), isOpen && (_jsx(OverlayComponent, { children: _jsx(IconList, { list: renderedComparator, selected: comparator, onClick: onChangeComparator }) }))] }));
 };
 export default NumberRange;

package/ui/Blocks/CommonGrid/components/TextRange/TextRange.js

@@ -27,6 +27,7 @@ import { useClickOutside } from '../../../Modal/hooks/useClickOutside';
 import { Input } from '../../../../Forms/Input/Input';
 import IconList from '../IconList/IconList';
 import { i18n } from '@lingui/core';
+import { useEvent } from '../../hooks/useEvent';
 var OverlayComponentDefault = function (_a) {
     var children = _a.children;
     return _jsx("div", { children: children });
@@ -72,7 +73,7 @@ var TextRange = function (props) {
     var togglePicker = useCallback(function () { return setOpen(!isOpen); }, [isOpen, setOpen]);
     var validation = !!validationKey && validations[validationKey];
     var isInvalid = validation && Boolean(fieldValue && !validation.check(String(fieldValue)));
-    var onChangeTextInput = useCallback(function (event) {
+    var onChangeTextInput = useEvent(function (event) {
         var txtValue = event.target.value;
         if (txtValue) {
             onChange({ comparator: comparator, value: txtValue, isInvalid: validation && !validation.check(txtValue) });
@@ -80,10 +81,10 @@ var TextRange = function (props) {
         else {
             onChange(null);
         }
-    }, [onChange, comparator, validation]);
-    var onChangeComparator = useCallback(function (option) {
+    });
+    var onChangeComparator = useEvent(function (option) {
         onChange({ comparator: option.value, value: fieldValue, isInvalid: isInvalid });
-    }, []);
+    });
     return (_jsxs("div", { ref: pickerRef, children: [_jsx(Input, __assign({ name: name, "data-test": name, "data-cy": "".concat(name, "Inp"), value: fieldValue, label: label, onChange: onChangeTextInput, iconOnClick: !eqOnly ? togglePicker : undefined, appearance: "grid", icon: !eqOnly ? 'ellipsisVertical' : 'warning', iconPlacement: "right", iconTooltip: eqOnly ? eqOnlyTxt : undefined, type: "text", className: className, error: (!!validation && isInvalid && validation.errorMsg) || '', errorAppearance: 'tooltip', autoComplete: "off" }, rest)), isOpen && (_jsx(OverlayComponent, { children: _jsx(IconList, { list: renderedComparator, selected: comparator, onClick: onChangeComparator }) }))] }));
 };
 export default TextRange;

package/ui/Blocks/CommonGrid/hooks/useEvent.d.ts

@@ -0,0 +1,3 @@
+type AnyFunction = (...args: any[]) => any;
+export declare const useEvent: <T extends AnyFunction>(callback?: T | undefined) => T;
+export {};

package/ui/Blocks/CommonGrid/hooks/useEvent.js

@@ -0,0 +1,17 @@
+import { useCallback, useLayoutEffect, useRef } from 'react';
+export var useEvent = function (callback) {
+    var ref = useRef(function () {
+        throw new Error('Cannot call an event handler while rendering.');
+    });
+    useLayoutEffect(function () {
+        ref.current = callback;
+    });
+    return useCallback(function () {
+        var _a;
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i] = arguments[_i];
+        }
+        return (_a = ref.current) === null || _a === void 0 ? void 0 : _a.apply(null, args);
+    }, []);
+};

package/ui/Blocks/CommonGrid/index.d.ts

@@ -6,5 +6,6 @@ import * as Types from './types';
 export * from './StandardButtons';
 export * from './components/gridCells';
 import { useAddFilter } from './hooks/useAddFilter';
+import { useEvent } from './hooks/useEvent';
 export default CommonGrid;
-export { withReduxActions, reducer, actionPrefix, actionTypes, createActions, createSelectors, createFullSelector, Types, useFloatingButton, useAddFilter, };
+export { withReduxActions, reducer, actionPrefix, actionTypes, createActions, createSelectors, createFullSelector, Types, useFloatingButton, useAddFilter, useEvent, };

package/ui/Blocks/CommonGrid/index.js

@@ -6,5 +6,6 @@ import * as Types from './types';
 export * from './StandardButtons';
 export * from './components/gridCells';
 import { useAddFilter } from './hooks/useAddFilter';
+import { useEvent } from './hooks/useEvent';
 export default CommonGrid;
-export { withReduxActions, reducer, actionPrefix, actionTypes, createActions, createSelectors, createFullSelector, Types, useFloatingButton, useAddFilter, };
+export { withReduxActions, reducer, actionPrefix, actionTypes, createActions, createSelectors, createFullSelector, Types, useFloatingButton, useAddFilter, useEvent, };