@ballistix.digital/react-components 0.4.89 → 0.4.91

package/dist/index.esm.js

@@ -5539,8 +5539,8 @@ const Select = ({ options = [], value = null, onChange, onSearchInputChange, pla
 var SelectMenuForm = function (props) {
     var _a;
     var _b = props.name, name = _b === void 0 ? 'select-menu-form' : _b, label = props.label, description = props.description, placeholder = props.placeholder, options = props.options, required = props.required, value = props.value, error = props.error, _c = props.type, type = _c === void 0 ? 'normal' : _c, _d = props.isRequired, isRequired = _d === void 0 ? false : _d, isLoading = props.isLoading, _e = props.isTouched, isTouched = _e === void 0 ? false : _e, isDisabled = props.isDisabled, _f = props.isClearable, isClearable = _f === void 0 ? true : _f, _g = props.isMultiple, isMultiple = _g === void 0 ? false : _g, _h = props.isSearchable, isSearchable = _h === void 0 ? true : _h, _j = props.isSolo, isSolo = _j === void 0 ? false : _j, onChange = props.onChange, onSearchInputChange = props.onSearchInputChange, onClear = props.onClear, onBlur = props.onBlur, stylesOverrides = props.styles;
-    var _k = useState(value !== null && value !== void 0 ? value : null), state = _k[0], setState = _k[1];
-    var _l = useState(true), isFocus = _l[0], setIsFocus = _l[1];
+    var _k = useState(true), isFocus = _k[0], setIsFocus = _k[1];
+    var _l = useState(value !== null && value !== void 0 ? value : null), state = _l[0], setState = _l[1];
     var isValid = error === undefined;
     var handleGenerateStyle = function () {
         var result = deepCopyObject(styles$1.base);
@@ -9172,17 +9172,17 @@ var zh$1 = _mergeNamespaces({
 }, [zhExports]);
 
 var DateMenuForm = function (props) {
-    var _a = props.name, name = _a === void 0 ? 'date-menu-form' : _a, _b = props.size, size = _b === void 0 ? 'compact' : _b, label = props.label, _c = props.i18n, i18n = _c === void 0 ? 'en' : _c, description = props.description, placeholder = props.placeholder, separator = props.separator, startFrom = props.startFrom, _d = props.displayFormat, displayFormat = _d === void 0 ? 'DD.MM.YYYY' : _d, _e = props.direction, direction = _e === void 0 ? 'down' : _e, minDate = props.minDate, maxDate = props.maxDate, _f = props.startWeekOn, startWeekOn = _f === void 0 ? 'mon' : _f, required = props.required, defaultValue = props.value, error = props.error, _g = props.type, type = _g === void 0 ? 'normal' : _g, _h = props.isRequired, isRequired = _h === void 0 ? false : _h, _j = props.isTouched, isTouched = _j === void 0 ? false : _j, isDisabled = props.isDisabled, _k = props.isSolo, isSolo = _k === void 0 ? false : _k, _l = props.isRanged, isRanged = _l === void 0 ? false : _l, onChange = props.onChange, 
-    // onBlur,
-    stylesOverrides = props.styles;
+    var _a = props.name, name = _a === void 0 ? 'date-menu-form' : _a, _b = props.size, size = _b === void 0 ? 'compact' : _b, label = props.label, _c = props.i18n, i18n = _c === void 0 ? 'en' : _c, description = props.description, placeholder = props.placeholder, separator = props.separator, startFrom = props.startFrom, _d = props.displayFormat, displayFormat = _d === void 0 ? 'DD.MM.YYYY' : _d, _e = props.direction, direction = _e === void 0 ? 'down' : _e, minDate = props.minDate, maxDate = props.maxDate, _f = props.startWeekOn, startWeekOn = _f === void 0 ? 'mon' : _f, required = props.required, defaultValue = props.value, error = props.error, _g = props.type, type = _g === void 0 ? 'normal' : _g, _h = props.isRequired, isRequired = _h === void 0 ? false : _h, _j = props.isTouched, isTouched = _j === void 0 ? false : _j, isDisabled = props.isDisabled, _k = props.isSolo, isSolo = _k === void 0 ? false : _k, _l = props.isRanged, isRanged = _l === void 0 ? false : _l, onChange = props.onChange, onClear = props.onClear, onBlur = props.onBlur, stylesOverrides = props.styles;
     var isValid = error === undefined;
-    var _m = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : {
+    var _m = useState(true), isFocus = _m[0], setIsFocus = _m[1];
+    var _o = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : {
         startDate: null,
         endDate: null,
-    }), value = _m[0], setValue = _m[1];
+    }), state = _o[0], setState = _o[1];
     var handleValueChange = function (newValue) {
-        setValue(newValue);
+        setState(newValue);
         onChange && onChange(newValue);
+        setIsFocus(false);
     };
     var handleGenerateStyle = function () {
         var result = deepCopyObject(styles.base);
@@ -9193,9 +9193,24 @@ var DateMenuForm = function (props) {
         return result;
     };
     var styles$1 = handleGenerateStyle();
+    // Simulate onClear event.
+    useEffect(function () {
+        if (state.startDate === null && state.endDate === null) {
+            console.log('clear');
+            onClear && onClear(name);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [state]);
+    // Simulate onBlur event.
+    useEffect(function () {
+        if (!isFocus) {
+            onBlur && onBlur();
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [isFocus]);
     return (jsxs("div", __assign({ className: styles$1.container }, { children: [jsxs("div", __assign({ className: styles$1.head }, { children: [label && (jsx("label", __assign({ htmlFor: name, className: styles$1.label }, { children: label }))), !required && !isRequired && typeof label === 'string' && (jsx("span", __assign({ className: styles$1.hint }, { children: "Optional" }))), required && required({ isRequired: isRequired })] })), jsxs("div", __assign({ className: styles$1.container }, { children: [jsx(Datepicker, { i18n: i18n, useRange: size === 'expanded', placeholder: placeholder, asSingle: !isRanged, separator: separator, startFrom: startFrom, displayFormat: displayFormat, disabled: isDisabled, popoverDirection: direction, minDate: minDate, maxDate: maxDate, 
                         //
-                        value: value, 
+                        value: state, 
                         //
                         onChange: handleValueChange, 
                         //