kui-complex 0.0.145 → 0.0.147

package/index.d.ts

@@ -189,7 +189,7 @@ declare const InputWithDatePicker: React.ForwardRefExoticComponent<Pick<{
     } | undefined;
     defaultValue?: Date | undefined;
     name?: string | undefined;
-    datePickerProps?: react_datepicker.ReactDatePickerProps<never, undefined> | undefined;
+    datePickerProps?: Partial<react_datepicker.ReactDatePickerProps<never, undefined>> | undefined;
     form: any;
     onChange?: ((date: DateTime | null) => void) | undefined;
     footerLabel?: string | undefined;

package/index.js

@@ -12,7 +12,7 @@ import classNames from 'classnames';
 import { HalfArrowIcon, PrevArrowIcon, NextArrowIcon, CalendarIcon, ArrowBackIcon, ArrowNextIcon, ClosedEyeIcon, OpenEyeIcon, CheckIcon, PlusIcon, FileIcon, EditIcon, TrashIcon } from 'kui-icon';
 import _ from 'lodash';
 import DatePicker from 'react-datepicker';
-import { Controller, useController, useWatch } from 'react-hook-form';
+import { useController, Controller, useWatch } from 'react-hook-form';
 import { scroller, Events, Link as Link$1, animateScroll, Element } from 'react-scroll';
 import { DateTime } from 'luxon';
 import ru from 'date-fns/locale/ru';
@@ -332,7 +332,7 @@ var InputSelect = forwardRef(function (_a, ref) {
     var _b;
     var options = _a.options, name = _a.name, handleChange = _a.handleChange; _a.form; var valueProp = _a.value, inputProps = __rest(_a, ["options", "name", "handleChange", "form", "value"]);
     var _c = useState(valueProp), value = _c[0], setValue = _c[1];
-    var selectedLabel = (_b = options.find(function (option) { return String(option.value) === String(value); })) === null || _b === void 0 ? void 0 : _b.label;
+    var selectedLabel = ((_b = options.find(function (option) { return String(option.value) === String(value); })) === null || _b === void 0 ? void 0 : _b.label) || "";
     var handleSelect = function (option) {
         setValue(option.value);
         if (handleChange) {
@@ -441,19 +441,22 @@ var StyledHeader = styled(Grid)(templateObject_2$i || (templateObject_2$i = __ma
 var templateObject_1$u, templateObject_2$i;
 
 var DesktopInputWithMonthPicker = forwardRef(function (_a, ref) {
+    var _b;
     var name = _a.name, form = _a.form, disabled = _a.disabled, datePickerProps = _a.datePickerProps, onChange = _a.onChange, otherProps = __rest(_a, ["name", "form", "disabled", "datePickerProps", "onChange"]);
-    var _b = useState(), changedValue = _b[0], setChangedValue = _b[1];
-    var handleChange = function (date, field) {
+    var _c = useState(), changedValue = _c[0], setChangedValue = _c[1];
+    var _d = useController({
+        name: name,
+        control: form.control,
+    }), field = _d.field, fieldState = _d.fieldState;
+    var handleChange = function (date) {
         field.onChange(date);
-        setChangedValue(date);
         if (onChange)
             onChange(date);
     };
-    return (jsx(Wrapper$4, __assign({ ref: ref }, { children: jsx(Controller, { name: name, control: form.control, render: function (_a) {
-                var _b;
-                var field = _a.field, fieldState = _a.fieldState;
-                return (jsx(DatePicker, __assign({ selected: field.value, onChange: function (e) { return handleChange(e, field); }, disabled: disabled, customInput: jsx(InputForDatepicker, __assign({ mask: "00.0000", name: name, disabled: disabled, message: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message }, otherProps), changedValue), showMonthYearPicker: true, dateFormat: "MM.yyyy", popperPlacement: "bottom-end", calendarContainer: MonthPickerContainer, renderCustomHeader: function (props) { return (jsx(MonthPickerHeader, __assign({}, props))); } }, datePickerProps)));
-            } }) })));
+    useEffect(function () {
+        setChangedValue(field.value);
+    }, [field.value]);
+    return (jsx(Wrapper$4, __assign({ ref: ref }, { children: jsx(DatePicker, __assign({ selected: field.value, onChange: handleChange, disabled: disabled, customInput: jsx(InputForDatepicker, __assign({ mask: "00.0000", name: name, disabled: disabled, message: (_b = fieldState.error) === null || _b === void 0 ? void 0 : _b.message }, otherProps), changedValue), showMonthYearPicker: true, dateFormat: "MM.yyyy", popperPlacement: "bottom-end", calendarContainer: MonthPickerContainer, renderCustomHeader: function (props) { return (jsx(MonthPickerHeader, __assign({}, props))); } }, datePickerProps)) })));
 });
 var Wrapper$4 = styled.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n  @media (max-width: 600px) {\n    display: none;\n  }\n"], ["\n  @media (max-width: 600px) {\n    display: none;\n  }\n"])));
 var templateObject_1$t;