@itcase/ui 1.1.23 → 1.1.25

package/dist/{Button-Vxs8zjSy.js → Button-CSzPxWyC.js}

@@ -84,7 +84,7 @@ var Button = React__default.forwardRef(function Button(props, ref) {
                 iconBefore ||
                 iconBeforeSrc ||
                 iconSrc) &&
-            'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntimeExports.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntimeExports.jsx(Loader, { className: "button__loader", fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsxRuntimeExports.jsx(Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntimeExports.jsx(Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntimeExports.jsx(Text, { className: "button__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textTruncate: labelTextTruncate, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textWrap: labelTextWrap, textWeight: labelTextWeight, width: labelTextWidth, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsxRuntimeExports.jsx(Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
+            'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntimeExports.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntimeExports.jsx(Loader, { className: "button__loader", fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsxRuntimeExports.jsx(Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntimeExports.jsx(Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntimeExports.jsx(Text, { className: "button__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, width: labelTextWidth, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsxRuntimeExports.jsx(Icon, { SvgImage: iconAfter, className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize })), Badge, after] }) }));
 });
 
 export { Button as B, buttonConfig as b };

package/dist/{Chips-uYPtUsLf.js → Chips-Bd3ZFosY.js}

@@ -11,8 +11,7 @@ var chipsConfig = {
     },
 };
 function Chips(props) {
-    var children = props.children, isActive = props.isActive, appearance = props.appearance, className = props.className, _a = props.label, label = _a === void 0 ? '' : _a, labelSize = props.labelSize, // labelTextSize,
-    labelTextActiveColor = props.labelTextActiveColor, labelTextColor = props.labelTextColor, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
+    var children = props.children, isActive = props.isActive, appearance = props.appearance, className = props.className, _a = props.label, label = _a === void 0 ? '' : _a, labelTextActiveColor = props.labelTextActiveColor, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
     var alignDirectionClass = useDeviceTargetClass(props, {
         prefix: 'align_',
         propsKey: 'alignDirection',
@@ -57,7 +56,7 @@ function Chips(props) {
     var chipsStyles = useStyles(props).styles;
     // prettier-ignore
     var appearanceConfig = (appearance && chipsConfig.appearance && chipsConfig.appearance[appearance]);
-    return (jsxRuntimeExports.jsx("div", { style: chipsStyles, className: clsx(className, 'chips', isActive && 'chips_state_active', isActive
+    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'chips', isActive && 'chips_state_active', isActive
             ? fillActiveClass ||
                 ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillActive) &&
                     "fill_".concat(appearanceConfig.fillActive).replace(/([A-Z])/g, '-$1').toLowerCase())
@@ -69,7 +68,7 @@ function Chips(props) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
                 "border-color_".concat(appearanceConfig.borderColor)
                     .replace(/([A-Z])/g, '-$1')
-                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass, onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntimeExports.jsx(Text, { className: "chips__label", size: labelSize, textWeight: labelTextWeight, textColor: isActive
+                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass, onClick && 'cursor_type_pointer'), style: chipsStyles, onClick: onClick, children: jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntimeExports.jsx(Text, { className: "chips__label", size: labelTextSize, textWeight: labelTextWeight, textColor: isActive
                         ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor)
                         : labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), children: label })) : (jsxRuntimeExports.jsx("div", { className: "chips__label", children: label })), children] }) }));
 }

package/dist/{CookiesWarning-Dc6YFhTn.js → CookiesWarning-B30eAOND.js}

@@ -3,7 +3,7 @@ import { useRef, useMemo, useCallback, useEffect } from 'react';
 import clsx from 'clsx';
 import Cookies from 'js-cookie';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
-import { B as Button } from './Button-Vxs8zjSy.js';
+import { B as Button } from './Button-CSzPxWyC.js';
 import { G as Group } from './Group-DLmtajo8.js';
 import { T as Text } from './Text-Dz-KPI5I.js';
 

package/dist/{DatePicker-l1a-OAls.js → DatePicker-Bf7t1yiM.js}

@@ -7,7 +7,7 @@ import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { findDOMNode } from 'react-dom';
 import { o as offset$1, f as flip$1, c as computePosition, b as arrow$2, g as getComputedStyle, i as isElement, a as autoUpdate } from './floating-ui.dom-BV5qw-HP.js';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
-import { B as Button } from './Button-Vxs8zjSy.js';
+import { B as Button } from './Button-CSzPxWyC.js';
 import { I as Icon } from './Icon-BLqnXYOO.js';
 import { I as Input } from './Input-CYDtAlO-.js';
 import { L as Label } from './Label-c3hONOHC.js';
@@ -14062,30 +14062,46 @@ function DatePickerInput(props) {
     }, [endValue]);
     var _a = useState(start), startDate = _a[0], setStartDate = _a[1];
     var _b = useState(end), endDate = _b[0], setEndDate = _b[1];
-    var handleChange = function (_a) {
+    var handleChange = useCallback(function (_a) {
         var newStartDate = _a[0], newEndDate = _a[1];
         onChange && onChange(newStartDate, newEndDate);
         setStartDate(newStartDate);
         setEndDate(newEndDate);
-    };
-    var renderDayContents = function (day, date) {
+    }, [onChange]);
+    var renderDayContents = useCallback(function (day, date) {
         return (jsxRuntimeExports.jsx(Button, { className: "react-datepicker__day-button", label: date.getDate().toString(), labelTextColor: datePickerProps.dayTextColor, labelTextSize: datePickerProps.dayTextSize, shape: datePickerProps.dayTextShape, size: datePickerProps.daySize }));
-    };
-    var renderCustomHeader = function (_a) {
+    }, [
+        datePickerProps.daySize,
+        datePickerProps.dayTextColor,
+        datePickerProps.dayTextShape,
+        datePickerProps.dayTextSize,
+    ]);
+    var renderCustomHeader = useCallback(function (_a) {
         var monthDate = _a.monthDate, decreaseMonth = _a.decreaseMonth, increaseMonth = _a.increaseMonth;
-        return (jsxRuntimeExports.jsxs("div", { className: "react-datepicker__header--div", children: [datePickerProps.iconLeft && (jsxRuntimeExports.jsx(Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconLeft, onClick: decreaseMonth })), jsxRuntimeExports.jsxs("div", { className: "react-datepicker__data", children: [jsxRuntimeExports.jsx(Text, { className: "react-datepicker__month", size: datePickerProps.monthTextSize, textColor: datePickerProps.monthTextColor, textWeight: datePickerProps.monthTextWeight, children: monthDate.toLocaleString('ru-RU', {
-                                month: 'long',
-                            }) }), jsxRuntimeExports.jsx(Text, { className: "react-datepicker__year", size: datePickerProps.yearTextSize, textColor: datePickerProps.yearTextColor, textWeight: datePickerProps.yearTextWeight, children: monthDate.toLocaleString('ru-RU', {
-                                year: 'numeric',
-                            }) })] }), datePickerProps.iconRight && (jsxRuntimeExports.jsx(Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconRight, onClick: increaseMonth }))] }));
-    };
+        return (jsxRuntimeExports.jsxs("div", { className: "react-datepicker__header--div", children: [datePickerProps.iconLeft && (jsxRuntimeExports.jsx(Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconLeft, onClick: decreaseMonth })), jsxRuntimeExports.jsxs("div", { className: "react-datepicker__data", children: [jsxRuntimeExports.jsx(Text, { className: "react-datepicker__month", size: datePickerProps.monthTextSize, textColor: datePickerProps.monthTextColor, textWeight: datePickerProps.monthTextWeight, children: monthDate.toLocaleString('ru-RU', { month: 'long' }) }), jsxRuntimeExports.jsx(Text, { className: "react-datepicker__year", size: datePickerProps.yearTextSize, textColor: datePickerProps.yearTextColor, textWeight: datePickerProps.yearTextWeight, children: monthDate.toLocaleString('ru-RU', { year: 'numeric' }) })] }), datePickerProps.iconRight && (jsxRuntimeExports.jsx(Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconRight, onClick: increaseMonth }))] }));
+    }, [
+        datePickerProps.iconFill,
+        datePickerProps.iconFillHover,
+        datePickerProps.iconFillSize,
+        datePickerProps.iconItemFill,
+        datePickerProps.iconLeft,
+        datePickerProps.iconRight,
+        datePickerProps.iconShape,
+        datePickerProps.iconSize,
+        datePickerProps.monthTextColor,
+        datePickerProps.monthTextSize,
+        datePickerProps.monthTextWeight,
+        datePickerProps.yearTextColor,
+        datePickerProps.yearTextSize,
+        datePickerProps.yearTextWeight,
+    ]);
     useEffect(function () {
         setStartDate(start);
     }, [start]);
     useEffect(function () {
         setEndDate(end);
     }, [end]);
-    return (jsxRuntimeExports.jsx("div", { className: clsx$1(className, 'datepicker', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.monthsShown) && 'datepicker_type_multiple-months', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.customTimeInput) && 'datepicker_type_button', widthClass), children: jsxRuntimeExports.jsx(DatePicker, __assign({ customInput: jsxRuntimeExports.jsx(DatePickerCustomInput, { clearIcon: clearIcon, inputIcon: datePickerProps.inputIcon, inputIconFill: datePickerProps.inputIconFill, inputIconFillHover: datePickerProps.inputIconFillHover, inputIconFillSize: datePickerProps.inputIconFillSize, inputIconShape: datePickerProps.inputIconShape, inputIconSize: datePickerProps.inputIconSize, inputIconSrc: datePickerProps.inputIconSrc, inputIconItemFill: datePickerProps.inputIconItemFill, clearIconFill: clearIconFill, clearIconFillHover: clearIconFillHover, clearIconFillSize: clearIconFillSize, clearIconItemFill: clearIconItemFill, clearIconItemFillHover: clearIconItemFillHover, clearIconShape: clearIconShape, clearIconSize: clearIconSize, clearIconSrc: clearIconSrc, clearLabel: clearLabel, clearLabelTextColor: clearLabelTextColor, clearLabelTextColorHover: clearLabelTextColorHover, clearLabelTextSize: clearLabelTextSize, datepickerRef: datepickerRef, inputProps: inputProps, isClearable: datePickerProps.isClearable, labelTextSize: labelTextSize }), endDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? endDate : undefined, locale: ru, minDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.disablePastDays) ? new Date() : undefined, ref: datepickerRef, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: startDate, startDate: startDate, onChange: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? handleChange : onChange }, datePickerProps, { 
+    return (jsxRuntimeExports.jsx("div", { className: clsx$1(className, 'datepicker', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.monthsShown) && 'datepicker_type_multiple-months', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.customTimeInput) && 'datepicker_type_button', widthClass), children: jsxRuntimeExports.jsx(DatePicker, __assign({ ref: datepickerRef, endDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? endDate : undefined, locale: ru, minDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.disablePastDays) ? new Date() : undefined, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: startDate, startDate: startDate, customInput: jsxRuntimeExports.jsx(DatePickerCustomInput, { labelTextSize: labelTextSize, clearIcon: clearIcon, clearIconFill: clearIconFill, clearIconFillHover: clearIconFillHover, clearIconFillSize: clearIconFillSize, clearIconItemFill: clearIconItemFill, clearIconItemFillHover: clearIconItemFillHover, clearIconShape: clearIconShape, clearIconSize: clearIconSize, clearIconSrc: clearIconSrc, clearLabel: clearLabel, clearLabelTextColor: clearLabelTextColor, clearLabelTextColorHover: clearLabelTextColorHover, clearLabelTextSize: clearLabelTextSize, datepickerRef: datepickerRef, inputIcon: datePickerProps.inputIcon, inputIconFill: datePickerProps.inputIconFill, inputIconFillHover: datePickerProps.inputIconFillHover, inputIconFillSize: datePickerProps.inputIconFillSize, inputIconItemFill: datePickerProps.inputIconItemFill, inputIconShape: datePickerProps.inputIconShape, inputIconSize: datePickerProps.inputIconSize, inputIconSrc: datePickerProps.inputIconSrc, inputProps: inputProps, isClearable: datePickerProps.isClearable }), onChange: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? handleChange : onChange }, datePickerProps, { 
             // Important for use custom clear button
             isClearable: false })) }));
 }

package/dist/{ModalLoader-Bk6l3vO9.js → ModalLoader-4OS81u94.js}

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import ReactDOM__default from 'react-dom';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
-import { O as Overlay } from './Overlay-C4gCb0sL.js';
+import { O as Overlay } from './Overlay-DNPslUfY.js';
 import { L as Loader } from './Loader-VCP1ZNcb.js';
 
 var getOrCreateModalElement = function (modalQuerySelector, className) {
@@ -29,12 +29,12 @@ var getOrCreateModalElement = function (modalQuerySelector, className) {
 };
 // Modal component that is an abstraction around the portal API.
 var Modal = React__default.forwardRef(function Modal(props, ref) {
-    var children = props.children, className = props.className, closeButton = props.closeButton, contentClassName = props.contentClassName, id = props.id, _a = props.isOverlay, isOverlay = _a === void 0 ? true : _a, overlayClassName = props.overlayClassName, overlayFill = props.overlayFill, overlayFillGradient = props.overlayFillGradient, overlayOpacity = props.overlayOpacity, _b = props.isOpen, initialIsOpen = _b === void 0 ? false : _b, _c = props.isScrollOnOpen, isScrollOnOpen = _c === void 0 ? true : _c, _d = props.isSetFocusOnOpen, isSetFocusOnOpen = _d === void 0 ? true : _d, _e = props.modalQuerySelector, modalQuerySelector = _e === void 0 ? '#modal-global' : _e, debug = props.debug, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal;
+    var id = props.id, children = props.children, _a = props.isCloseOnBlur, isCloseOnBlur = _a === void 0 ? true : _a, _b = props.isOpen, initialIsOpen = _b === void 0 ? false : _b, _c = props.isOverlay, isOverlay = _c === void 0 ? true : _c, _d = props.isScrollOnOpen, isScrollOnOpen = _d === void 0 ? true : _d, _e = props.isSetFocusOnOpen, isSetFocusOnOpen = _e === void 0 ? true : _e, className = props.className, closeButton = props.closeButton, contentClassName = props.contentClassName, _f = props.modalQuerySelector, modalQuerySelector = _f === void 0 ? '#modal-global' : _f, overlayClassName = props.overlayClassName, overlayFill = props.overlayFill, overlayFillGradient = props.overlayFillGradient, overlayOpacity = props.overlayOpacity, onClickOverlay = props.onClickOverlay, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal;
     // Query DOM element
-    var _f = useState(null), modalElement = _f[0], setModalElement = _f[1];
-    var _g = useState(initialIsOpen), isOpen = _g[0], setIsOpen = _g[1];
+    var _g = useState(null), modalElement = _g[0], setModalElement = _g[1];
+    var _h = useState(initialIsOpen), isOpen = _h[0], setIsOpen = _h[1];
     var modalContentRef = useRef(null);
-    var modalOverlayRef = useRef(null);
+    // const modalOverlayRef = useRef(null)
     var addModalProps = useCallback(function (element) {
         // Change class need in "useEffect"
         if (isOpen) {
@@ -83,18 +83,18 @@ var Modal = React__default.forwardRef(function Modal(props, ref) {
     }, [onOpenModal]);
     // Hide modal and unmount children content
     var closeModal = useCallback(function (event) {
-        var hasRelatedTarget = event.relatedTarget &&
-            modalElement &&
-            // @ts-expect-error
-            modalElement.contains(event.relatedTarget);
-        if (hasRelatedTarget) {
-            return event;
+        if (event) {
+            // prettier-ignore
+            var hasRelatedTarget = (event.relatedTarget &&
+                modalElement &&
+                modalElement.contains(event.relatedTarget));
+            if (hasRelatedTarget) {
+                return event;
+            }
         }
         setIsOpen(false);
         // Callback
-        if (typeof onCloseModal === 'function') {
-            onCloseModal();
-        }
+        onCloseModal && onCloseModal();
     }, [modalElement, onCloseModal]);
     useEffect(function () {
         if (!modalElement) {
@@ -147,19 +147,12 @@ var Modal = React__default.forwardRef(function Modal(props, ref) {
     return (modalElement &&
         ReactDOM__default.createPortal(
         // Any valid React child: JSX, strings, arrays, etc.
-        isOpen ? (jsxRuntimeExports.jsxs(React__default.Fragment, { children: [jsxRuntimeExports.jsxs("div", { className: clsx('modal-content', contentClassName, fillClass, shapeClass, borderColorClass, borderWidthClass, borderTypeClass, elevationClass), id: id, ref: modalContentRef, style: modalStyles, tabIndex: 0, onBlur: debug ? undefined : closeModal, children: [closeButton && (jsxRuntimeExports.jsx("div", { className: "modal-content__close", onClick: closeModal, children: closeButton })), jsxRuntimeExports.jsx("div", { className: "modal-content__wrapper", children: children })] }), jsxRuntimeExports.jsx(Overlay, { className: clsx('modal__overlay', 'overlay_type_modal', overlayClassName), fill: overlayFill, fillGradient: overlayFillGradient, isOverlay: isOverlay, opacity: overlayOpacity, 
-                    // @ts-expect-error
-                    ref: modalOverlayRef })] })) : null, 
+        isOpen ? (jsxRuntimeExports.jsxs(React__default.Fragment, { children: [jsxRuntimeExports.jsxs("div", { className: clsx('modal-content', contentClassName, fillClass, shapeClass, borderColorClass, borderWidthClass, borderTypeClass, elevationClass), ref: modalContentRef, id: id, style: modalStyles, tabIndex: 0, onBlur: isCloseOnBlur ? closeModal : undefined, children: [closeButton && (jsxRuntimeExports.jsx("div", { className: "modal-content__close", onClick: closeModal, children: closeButton })), jsxRuntimeExports.jsx("div", { className: "modal-content__wrapper", children: children })] }), jsxRuntimeExports.jsx(Overlay, { className: clsx('modal__overlay', 'overlay_type_modal', overlayClassName), 
+                    // ref={modalOverlayRef}
+                    fill: overlayFill, opacity: overlayOpacity, fillGradient: overlayFillGradient, isOverlay: isOverlay, onClick: onClickOverlay })] })) : null, 
         // A DOM element
         modalElement));
 });
-Modal.defaultProps = {
-    isOverlay: true,
-    isOpen: false,
-    isScrollOnOpen: true,
-    isSetFocusOnOpen: true,
-    modalQuerySelector: '#modal-global',
-};
 
 function ModalLoader(props) {
     return (jsxRuntimeExports.jsx("div", { className: "modal-loading", children: jsxRuntimeExports.jsx("div", { className: "modal-loading__inner", children: jsxRuntimeExports.jsx(Loader, {}) }) }));

package/dist/{Overlay-C4gCb0sL.js → Overlay-DNPslUfY.js}

@@ -4,7 +4,7 @@ import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
 
 function Overlay(props) {
-    var className = props.className, isOverlay = props.isOverlay, type = props.type;
+    var isOverlay = props.isOverlay, className = props.className, type = props.type, onClick = props.onClick;
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -19,7 +19,7 @@ function Overlay(props) {
     });
     // @ts-expect-error
     var overlayStyles = useStyles(props).styles;
-    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'overlay', opacityClass, isOverlay && 'overlay_state_visible', type && "".concat(className, "_type_").concat(type), fillClass, fillGradientClass), style: overlayStyles, children: "\u00A0" }));
+    return (jsxRuntimeExports.jsx("div", { className: clsx(className, 'overlay', opacityClass, isOverlay && 'overlay_state_visible', type && "".concat(className, "_type_").concat(type), fillClass, fillGradientClass), style: overlayStyles, onClick: onClick, children: "\u00A0" }));
 }
 
 export { Overlay as O };

package/dist/{Response-sCPsxYoM.js → Response-BMRzGa5t.js}

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import SVG from 'react-inlinesvg';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
-import { B as Button } from './Button-Vxs8zjSy.js';
+import { B as Button } from './Button-CSzPxWyC.js';
 import { G as Group } from './Group-DLmtajo8.js';
 import { T as Text } from './Text-Dz-KPI5I.js';
 import { T as Title } from './Title-zpOK2AxL.js';

package/dist/{SwitchField-BdrNzvfC.js → SwitchField-DCwEVCVg.js}

@@ -11,7 +11,7 @@ import { useStyles } from './hooks/useStyles.js';
 import { S as Switch } from './Switch-0BHqovLA.js';
 
 function FormField(props) {
-    var id = props.id, children = props.children, afterItem = props.afterItem, dataTestId = props.dataTestId, beforeItem = props.beforeItem, dividerWidth = props.dividerWidth, dividerDirection = props.dividerDirection, set = props.set, className = props.className, dividerSize = props.dividerSize, dividerFill = props.dividerFill, descSize = props.descSize, descTextWeight = props.descTextWeight, descTextColor = props.descTextColor, desc = props.desc, label = props.label, labelSize = props.labelSize, labelTextWeight = props.labelTextWeight, labelTextColor = props.labelTextColor, clearIconFill = props.clearIconFill, clearIcon = props.clearIcon, clearIconSize = props.clearIconSize, messageSize = props.messageSize, messageTextWeight = props.messageTextWeight, messageTextColor = props.messageTextColor, message = props.message;
+    var id = props.id, children = props.children, afterItem = props.afterItem, dataTestId = props.dataTestId, beforeItem = props.beforeItem, dividerWidth = props.dividerWidth, dividerDirection = props.dividerDirection, set = props.set, className = props.className, dividerSize = props.dividerSize, dividerFill = props.dividerFill, descSize = props.descSize, descTextWeight = props.descTextWeight, descTextColor = props.descTextColor, desc = props.desc, label = props.label, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, labelTextColor = props.labelTextColor, clearIconFill = props.clearIconFill, clearIcon = props.clearIcon, clearIconSize = props.clearIconSize, messageSize = props.messageSize, messageTextWeight = props.messageTextWeight, messageTextColor = props.messageTextColor, message = props.message;
     var sizeClass = useDeviceTargetClass(props, {
         prefix: 'form-field_size_',
         propsKey: 'size',
@@ -38,7 +38,7 @@ function FormField(props) {
     });
     // @ts-expect-error
     var formFieldStyles = useStyles(props).styles;
-    return (jsxRuntimeExports.jsxs("div", { className: clsx(className, 'form-field', set && "form-field_set_".concat(set), sizeClass, fillClass, shapeClass, directionClass), "data-test-id": dataTestId, style: formFieldStyles, children: [label && (jsxRuntimeExports.jsx("label", { htmlFor: id, className: "form-field__label", children: jsxRuntimeExports.jsx(Text, { size: labelSize, textWeight: labelTextWeight, textColor: labelTextColor, children: label }) })), desc && (jsxRuntimeExports.jsx("div", { className: "form-field__desc", children: jsxRuntimeExports.jsx(Text, { size: descSize, textWeight: descTextWeight, textColor: descTextColor, children: desc }) })), jsxRuntimeExports.jsxs("div", { className: clsx('form-field__item', inputFillClass, inputShapeClass), children: [jsxRuntimeExports.jsxs("div", { className: clsx('form-field__item-wrapper'), children: [beforeItem, children, clearIcon && jsxRuntimeExports.jsx(Icon, { fill: clearIconFill, SvgImage: clearIcon, size: clearIconSize }), afterItem] }), jsxRuntimeExports.jsx(Divider, { className: "form-field__item-divider", direction: dividerDirection, fill: dividerFill, size: dividerSize, width: dividerWidth })] }), message && (jsxRuntimeExports.jsx("div", { className: "form-field__message", children: jsxRuntimeExports.jsx(Text, { size: messageSize, textWeight: messageTextWeight, textColor: messageTextColor, children: message }) }))] }));
+    return (jsxRuntimeExports.jsxs("div", { className: clsx(className, 'form-field', set && "form-field_set_".concat(set), sizeClass, fillClass, shapeClass, directionClass), "data-test-id": dataTestId, style: formFieldStyles, children: [label && (jsxRuntimeExports.jsx("label", { htmlFor: id, className: "form-field__label", children: jsxRuntimeExports.jsx(Text, { size: labelTextSize, textWeight: labelTextWeight, textColor: labelTextColor, children: label }) })), desc && (jsxRuntimeExports.jsx("div", { className: "form-field__desc", children: jsxRuntimeExports.jsx(Text, { size: descSize, textWeight: descTextWeight, textColor: descTextColor, children: desc }) })), jsxRuntimeExports.jsxs("div", { className: clsx('form-field__item', inputFillClass, inputShapeClass), children: [jsxRuntimeExports.jsxs("div", { className: clsx('form-field__item-wrapper'), children: [beforeItem, children, clearIcon && jsxRuntimeExports.jsx(Icon, { fill: clearIconFill, SvgImage: clearIcon, size: clearIconSize }), afterItem] }), jsxRuntimeExports.jsx(Divider, { className: "form-field__item-divider", direction: dividerDirection, fill: dividerFill, size: dividerSize, width: dividerWidth })] }), message && (jsxRuntimeExports.jsx("div", { className: "form-field__message", children: jsxRuntimeExports.jsx(Text, { size: messageSize, textWeight: messageTextWeight, textColor: messageTextColor, children: message }) }))] }));
 }
 FormField.defaultProps = {
     dividerWidth: 'fill',

package/dist/cjs/{Button-xUrOQjVd.js → Button-DH5f_2bV.js}

@@ -91,7 +91,7 @@ var Button = React__default.default.forwardRef(function Button(props, ref) {
                 iconBefore ||
                 iconBeforeSrc ||
                 iconSrc) &&
-            'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntime.jsxRuntimeExports.jsx(Loader.Loader, { className: "button__loader", fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "button__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textTruncate: labelTextTruncate, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textWrap: labelTextWrap, textWeight: labelTextWeight, width: labelTextWidth, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
+            'button_type_with-icon', loading && 'button_state_loading button_type_loader'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntime.jsxRuntimeExports.jsx(Loader.Loader, { className: "button__loader", fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "button__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, width: labelTextWidth, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { SvgImage: iconAfter, className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize })), Badge, after] }) }));
 });
 
 exports.Button = Button;

package/dist/cjs/{Chips-D6tw75eZ.js → Chips-wl8WgeWZ.js}

@@ -17,8 +17,7 @@ var chipsConfig = {
     },
 };
 function Chips(props) {
-    var children = props.children, isActive = props.isActive, appearance = props.appearance, className = props.className, _a = props.label, label = _a === void 0 ? '' : _a, labelSize = props.labelSize, // labelTextSize,
-    labelTextActiveColor = props.labelTextActiveColor, labelTextColor = props.labelTextColor, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
+    var children = props.children, isActive = props.isActive, appearance = props.appearance, className = props.className, _a = props.label, label = _a === void 0 ? '' : _a, labelTextActiveColor = props.labelTextActiveColor, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, type = props.type, onClick = props.onClick;
     var alignDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'align_',
         propsKey: 'alignDirection',
@@ -63,7 +62,7 @@ function Chips(props) {
     var chipsStyles = useStyles.useStyles(props).styles;
     // prettier-ignore
     var appearanceConfig = (appearance && chipsConfig.appearance && chipsConfig.appearance[appearance]);
-    return (jsxRuntime.jsxRuntimeExports.jsx("div", { style: chipsStyles, className: clsx__default.default(className, 'chips', isActive && 'chips_state_active', isActive
+    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'chips', isActive && 'chips_state_active', isActive
             ? fillActiveClass ||
                 ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillActive) &&
                     "fill_".concat(appearanceConfig.fillActive).replace(/([A-Z])/g, '-$1').toLowerCase())
@@ -75,7 +74,7 @@ function Chips(props) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
                 "border-color_".concat(appearanceConfig.borderColor)
                     .replace(/([A-Z])/g, '-$1')
-                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass, onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "chips__label", size: labelSize, textWeight: labelTextWeight, textColor: isActive
+                    .toLowerCase()), borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "chips_type_".concat(type), cursorClass, onClick && 'cursor_type_pointer'), style: chipsStyles, onClick: onClick, children: jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "chips__inner", children: [typeof label === 'string' ? (jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "chips__label", size: labelTextSize, textWeight: labelTextWeight, textColor: isActive
                         ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor)
                         : labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), children: label })) : (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "chips__label", children: label })), children] }) }));
 }

package/dist/cjs/{CookiesWarning-DaEYrVWy.js → CookiesWarning-C-6cEf16.js}

@@ -5,7 +5,7 @@ var React = require('react');
 var clsx = require('clsx');
 var Cookies = require('js-cookie');
 var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
-var Button = require('./Button-xUrOQjVd.js');
+var Button = require('./Button-DH5f_2bV.js');
 var Group = require('./Group-EFTg84wP.js');
 var Text = require('./Text-B0SULA92.js');
 

package/dist/cjs/{DatePicker-CBdRlgIa.js → DatePicker-4tMTL9Nx.js}

@@ -7,7 +7,7 @@ var clsx = require('clsx');
 var ReactDOM = require('react-dom');
 var floatingUi_dom = require('./floating-ui.dom-ma2MDAMT.js');
 var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
-var Button = require('./Button-xUrOQjVd.js');
+var Button = require('./Button-DH5f_2bV.js');
 var Icon = require('./Icon-C7ZJyN5o.js');
 var Input = require('./Input-vwyG3XF0.js');
 var Label = require('./Label-C2uLpNrU.js');
@@ -14086,30 +14086,46 @@ function DatePickerInput(props) {
     }, [endValue]);
     var _a = React.useState(start), startDate = _a[0], setStartDate = _a[1];
     var _b = React.useState(end), endDate = _b[0], setEndDate = _b[1];
-    var handleChange = function (_a) {
+    var handleChange = React.useCallback(function (_a) {
         var newStartDate = _a[0], newEndDate = _a[1];
         onChange && onChange(newStartDate, newEndDate);
         setStartDate(newStartDate);
         setEndDate(newEndDate);
-    };
-    var renderDayContents = function (day, date) {
+    }, [onChange]);
+    var renderDayContents = React.useCallback(function (day, date) {
         return (jsxRuntime.jsxRuntimeExports.jsx(Button.Button, { className: "react-datepicker__day-button", label: date.getDate().toString(), labelTextColor: datePickerProps.dayTextColor, labelTextSize: datePickerProps.dayTextSize, shape: datePickerProps.dayTextShape, size: datePickerProps.daySize }));
-    };
-    var renderCustomHeader = function (_a) {
+    }, [
+        datePickerProps.daySize,
+        datePickerProps.dayTextColor,
+        datePickerProps.dayTextShape,
+        datePickerProps.dayTextSize,
+    ]);
+    var renderCustomHeader = React.useCallback(function (_a) {
         var monthDate = _a.monthDate, decreaseMonth = _a.decreaseMonth, increaseMonth = _a.increaseMonth;
-        return (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "react-datepicker__header--div", children: [datePickerProps.iconLeft && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconLeft, onClick: decreaseMonth })), jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "react-datepicker__data", children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "react-datepicker__month", size: datePickerProps.monthTextSize, textColor: datePickerProps.monthTextColor, textWeight: datePickerProps.monthTextWeight, children: monthDate.toLocaleString('ru-RU', {
-                                month: 'long',
-                            }) }), jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "react-datepicker__year", size: datePickerProps.yearTextSize, textColor: datePickerProps.yearTextColor, textWeight: datePickerProps.yearTextWeight, children: monthDate.toLocaleString('ru-RU', {
-                                year: 'numeric',
-                            }) })] }), datePickerProps.iconRight && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconRight, onClick: increaseMonth }))] }));
-    };
+        return (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "react-datepicker__header--div", children: [datePickerProps.iconLeft && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconLeft, onClick: decreaseMonth })), jsxRuntime.jsxRuntimeExports.jsxs("div", { className: "react-datepicker__data", children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "react-datepicker__month", size: datePickerProps.monthTextSize, textColor: datePickerProps.monthTextColor, textWeight: datePickerProps.monthTextWeight, children: monthDate.toLocaleString('ru-RU', { month: 'long' }) }), jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { className: "react-datepicker__year", size: datePickerProps.yearTextSize, textColor: datePickerProps.yearTextColor, textWeight: datePickerProps.yearTextWeight, children: monthDate.toLocaleString('ru-RU', { year: 'numeric' }) })] }), datePickerProps.iconRight && (jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { className: "react-datepicker__icon", fill: datePickerProps.iconFill, fillHover: datePickerProps.iconFillHover, fillSize: datePickerProps.iconFillSize, iconFill: datePickerProps.iconItemFill, shape: datePickerProps.iconShape, size: datePickerProps.iconSize, SvgImage: datePickerProps.iconRight, onClick: increaseMonth }))] }));
+    }, [
+        datePickerProps.iconFill,
+        datePickerProps.iconFillHover,
+        datePickerProps.iconFillSize,
+        datePickerProps.iconItemFill,
+        datePickerProps.iconLeft,
+        datePickerProps.iconRight,
+        datePickerProps.iconShape,
+        datePickerProps.iconSize,
+        datePickerProps.monthTextColor,
+        datePickerProps.monthTextSize,
+        datePickerProps.monthTextWeight,
+        datePickerProps.yearTextColor,
+        datePickerProps.yearTextSize,
+        datePickerProps.yearTextWeight,
+    ]);
     React.useEffect(function () {
         setStartDate(start);
     }, [start]);
     React.useEffect(function () {
         setEndDate(end);
     }, [end]);
-    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'datepicker', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.monthsShown) && 'datepicker_type_multiple-months', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.customTimeInput) && 'datepicker_type_button', widthClass), children: jsxRuntime.jsxRuntimeExports.jsx(DatePicker, _tslib.__assign({ customInput: jsxRuntime.jsxRuntimeExports.jsx(DatePickerCustomInput, { clearIcon: clearIcon, inputIcon: datePickerProps.inputIcon, inputIconFill: datePickerProps.inputIconFill, inputIconFillHover: datePickerProps.inputIconFillHover, inputIconFillSize: datePickerProps.inputIconFillSize, inputIconShape: datePickerProps.inputIconShape, inputIconSize: datePickerProps.inputIconSize, inputIconSrc: datePickerProps.inputIconSrc, inputIconItemFill: datePickerProps.inputIconItemFill, clearIconFill: clearIconFill, clearIconFillHover: clearIconFillHover, clearIconFillSize: clearIconFillSize, clearIconItemFill: clearIconItemFill, clearIconItemFillHover: clearIconItemFillHover, clearIconShape: clearIconShape, clearIconSize: clearIconSize, clearIconSrc: clearIconSrc, clearLabel: clearLabel, clearLabelTextColor: clearLabelTextColor, clearLabelTextColorHover: clearLabelTextColorHover, clearLabelTextSize: clearLabelTextSize, datepickerRef: datepickerRef, inputProps: inputProps, isClearable: datePickerProps.isClearable, labelTextSize: labelTextSize }), endDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? endDate : undefined, locale: ru, minDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.disablePastDays) ? new Date() : undefined, ref: datepickerRef, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: startDate, startDate: startDate, onChange: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? handleChange : onChange }, datePickerProps, { 
+    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'datepicker', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.monthsShown) && 'datepicker_type_multiple-months', (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.customTimeInput) && 'datepicker_type_button', widthClass), children: jsxRuntime.jsxRuntimeExports.jsx(DatePicker, _tslib.__assign({ ref: datepickerRef, endDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? endDate : undefined, locale: ru, minDate: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.disablePastDays) ? new Date() : undefined, renderCustomHeader: renderCustomHeader, renderDayContents: renderDayContents, selected: startDate, startDate: startDate, customInput: jsxRuntime.jsxRuntimeExports.jsx(DatePickerCustomInput, { labelTextSize: labelTextSize, clearIcon: clearIcon, clearIconFill: clearIconFill, clearIconFillHover: clearIconFillHover, clearIconFillSize: clearIconFillSize, clearIconItemFill: clearIconItemFill, clearIconItemFillHover: clearIconItemFillHover, clearIconShape: clearIconShape, clearIconSize: clearIconSize, clearIconSrc: clearIconSrc, clearLabel: clearLabel, clearLabelTextColor: clearLabelTextColor, clearLabelTextColorHover: clearLabelTextColorHover, clearLabelTextSize: clearLabelTextSize, datepickerRef: datepickerRef, inputIcon: datePickerProps.inputIcon, inputIconFill: datePickerProps.inputIconFill, inputIconFillHover: datePickerProps.inputIconFillHover, inputIconFillSize: datePickerProps.inputIconFillSize, inputIconItemFill: datePickerProps.inputIconItemFill, inputIconShape: datePickerProps.inputIconShape, inputIconSize: datePickerProps.inputIconSize, inputIconSrc: datePickerProps.inputIconSrc, inputProps: inputProps, isClearable: datePickerProps.isClearable }), onChange: (datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectsRange) ? handleChange : onChange }, datePickerProps, { 
             // Important for use custom clear button
             isClearable: false })) }));
 }

package/dist/cjs/{ModalLoader-QyRlFIR4.js → ModalLoader-DRt-18Tr.js}

@@ -6,7 +6,7 @@ var clsx = require('clsx');
 var ReactDOM = require('react-dom');
 var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
 var useStyles = require('./hooks/useStyles.js');
-var Overlay = require('./Overlay-18bnPZPd.js');
+var Overlay = require('./Overlay-CkN2X1BM.js');
 var Loader = require('./Loader-C2D6fJk1.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -37,12 +37,12 @@ var getOrCreateModalElement = function (modalQuerySelector, className) {
 };
 // Modal component that is an abstraction around the portal API.
 var Modal = React__default.default.forwardRef(function Modal(props, ref) {
-    var children = props.children, className = props.className, closeButton = props.closeButton, contentClassName = props.contentClassName, id = props.id, _a = props.isOverlay, isOverlay = _a === void 0 ? true : _a, overlayClassName = props.overlayClassName, overlayFill = props.overlayFill, overlayFillGradient = props.overlayFillGradient, overlayOpacity = props.overlayOpacity, _b = props.isOpen, initialIsOpen = _b === void 0 ? false : _b, _c = props.isScrollOnOpen, isScrollOnOpen = _c === void 0 ? true : _c, _d = props.isSetFocusOnOpen, isSetFocusOnOpen = _d === void 0 ? true : _d, _e = props.modalQuerySelector, modalQuerySelector = _e === void 0 ? '#modal-global' : _e, debug = props.debug, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal;
+    var id = props.id, children = props.children, _a = props.isCloseOnBlur, isCloseOnBlur = _a === void 0 ? true : _a, _b = props.isOpen, initialIsOpen = _b === void 0 ? false : _b, _c = props.isOverlay, isOverlay = _c === void 0 ? true : _c, _d = props.isScrollOnOpen, isScrollOnOpen = _d === void 0 ? true : _d, _e = props.isSetFocusOnOpen, isSetFocusOnOpen = _e === void 0 ? true : _e, className = props.className, closeButton = props.closeButton, contentClassName = props.contentClassName, _f = props.modalQuerySelector, modalQuerySelector = _f === void 0 ? '#modal-global' : _f, overlayClassName = props.overlayClassName, overlayFill = props.overlayFill, overlayFillGradient = props.overlayFillGradient, overlayOpacity = props.overlayOpacity, onClickOverlay = props.onClickOverlay, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal;
     // Query DOM element
-    var _f = React.useState(null), modalElement = _f[0], setModalElement = _f[1];
-    var _g = React.useState(initialIsOpen), isOpen = _g[0], setIsOpen = _g[1];
+    var _g = React.useState(null), modalElement = _g[0], setModalElement = _g[1];
+    var _h = React.useState(initialIsOpen), isOpen = _h[0], setIsOpen = _h[1];
     var modalContentRef = React.useRef(null);
-    var modalOverlayRef = React.useRef(null);
+    // const modalOverlayRef = useRef(null)
     var addModalProps = React.useCallback(function (element) {
         // Change class need in "useEffect"
         if (isOpen) {
@@ -91,18 +91,18 @@ var Modal = React__default.default.forwardRef(function Modal(props, ref) {
     }, [onOpenModal]);
     // Hide modal and unmount children content
     var closeModal = React.useCallback(function (event) {
-        var hasRelatedTarget = event.relatedTarget &&
-            modalElement &&
-            // @ts-expect-error
-            modalElement.contains(event.relatedTarget);
-        if (hasRelatedTarget) {
-            return event;
+        if (event) {
+            // prettier-ignore
+            var hasRelatedTarget = (event.relatedTarget &&
+                modalElement &&
+                modalElement.contains(event.relatedTarget));
+            if (hasRelatedTarget) {
+                return event;
+            }
         }
         setIsOpen(false);
         // Callback
-        if (typeof onCloseModal === 'function') {
-            onCloseModal();
-        }
+        onCloseModal && onCloseModal();
     }, [modalElement, onCloseModal]);
     React.useEffect(function () {
         if (!modalElement) {
@@ -155,19 +155,12 @@ var Modal = React__default.default.forwardRef(function Modal(props, ref) {
     return (modalElement &&
         ReactDOM__default.default.createPortal(
         // Any valid React child: JSX, strings, arrays, etc.
-        isOpen ? (jsxRuntime.jsxRuntimeExports.jsxs(React__default.default.Fragment, { children: [jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('modal-content', contentClassName, fillClass, shapeClass, borderColorClass, borderWidthClass, borderTypeClass, elevationClass), id: id, ref: modalContentRef, style: modalStyles, tabIndex: 0, onBlur: debug ? undefined : closeModal, children: [closeButton && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "modal-content__close", onClick: closeModal, children: closeButton })), jsxRuntime.jsxRuntimeExports.jsx("div", { className: "modal-content__wrapper", children: children })] }), jsxRuntime.jsxRuntimeExports.jsx(Overlay.Overlay, { className: clsx__default.default('modal__overlay', 'overlay_type_modal', overlayClassName), fill: overlayFill, fillGradient: overlayFillGradient, isOverlay: isOverlay, opacity: overlayOpacity, 
-                    // @ts-expect-error
-                    ref: modalOverlayRef })] })) : null, 
+        isOpen ? (jsxRuntime.jsxRuntimeExports.jsxs(React__default.default.Fragment, { children: [jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('modal-content', contentClassName, fillClass, shapeClass, borderColorClass, borderWidthClass, borderTypeClass, elevationClass), ref: modalContentRef, id: id, style: modalStyles, tabIndex: 0, onBlur: isCloseOnBlur ? closeModal : undefined, children: [closeButton && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "modal-content__close", onClick: closeModal, children: closeButton })), jsxRuntime.jsxRuntimeExports.jsx("div", { className: "modal-content__wrapper", children: children })] }), jsxRuntime.jsxRuntimeExports.jsx(Overlay.Overlay, { className: clsx__default.default('modal__overlay', 'overlay_type_modal', overlayClassName), 
+                    // ref={modalOverlayRef}
+                    fill: overlayFill, opacity: overlayOpacity, fillGradient: overlayFillGradient, isOverlay: isOverlay, onClick: onClickOverlay })] })) : null, 
         // A DOM element
         modalElement));
 });
-Modal.defaultProps = {
-    isOverlay: true,
-    isOpen: false,
-    isScrollOnOpen: true,
-    isSetFocusOnOpen: true,
-    modalQuerySelector: '#modal-global',
-};
 
 function ModalLoader(props) {
     return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "modal-loading", children: jsxRuntime.jsxRuntimeExports.jsx("div", { className: "modal-loading__inner", children: jsxRuntime.jsxRuntimeExports.jsx(Loader.Loader, {}) }) }));

package/dist/cjs/{Overlay-18bnPZPd.js → Overlay-CkN2X1BM.js}

@@ -10,7 +10,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 
 function Overlay(props) {
-    var className = props.className, isOverlay = props.isOverlay, type = props.type;
+    var isOverlay = props.isOverlay, className = props.className, type = props.type, onClick = props.onClick;
     var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -25,7 +25,7 @@ function Overlay(props) {
     });
     // @ts-expect-error
     var overlayStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'overlay', opacityClass, isOverlay && 'overlay_state_visible', type && "".concat(className, "_type_").concat(type), fillClass, fillGradientClass), style: overlayStyles, children: "\u00A0" }));
+    return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: clsx__default.default(className, 'overlay', opacityClass, isOverlay && 'overlay_state_visible', type && "".concat(className, "_type_").concat(type), fillClass, fillGradientClass), style: overlayStyles, onClick: onClick, children: "\u00A0" }));
 }
 
 exports.Overlay = Overlay;

package/dist/cjs/{Response-DDEFfCC4.js → Response-CTawELy2.js}

@@ -6,7 +6,7 @@ var clsx = require('clsx');
 var SVG = require('react-inlinesvg');
 var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
 var useStyles = require('./hooks/useStyles.js');
-var Button = require('./Button-xUrOQjVd.js');
+var Button = require('./Button-DH5f_2bV.js');
 var Group = require('./Group-EFTg84wP.js');
 var Text = require('./Text-B0SULA92.js');
 var Title = require('./Title-Ckp30YSI.js');

package/dist/cjs/{SwitchField-D2V-28Fy.js → SwitchField-C31Nbyyn.js}

@@ -17,7 +17,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 
 function FormField(props) {
-    var id = props.id, children = props.children, afterItem = props.afterItem, dataTestId = props.dataTestId, beforeItem = props.beforeItem, dividerWidth = props.dividerWidth, dividerDirection = props.dividerDirection, set = props.set, className = props.className, dividerSize = props.dividerSize, dividerFill = props.dividerFill, descSize = props.descSize, descTextWeight = props.descTextWeight, descTextColor = props.descTextColor, desc = props.desc, label = props.label, labelSize = props.labelSize, labelTextWeight = props.labelTextWeight, labelTextColor = props.labelTextColor, clearIconFill = props.clearIconFill, clearIcon = props.clearIcon, clearIconSize = props.clearIconSize, messageSize = props.messageSize, messageTextWeight = props.messageTextWeight, messageTextColor = props.messageTextColor, message = props.message;
+    var id = props.id, children = props.children, afterItem = props.afterItem, dataTestId = props.dataTestId, beforeItem = props.beforeItem, dividerWidth = props.dividerWidth, dividerDirection = props.dividerDirection, set = props.set, className = props.className, dividerSize = props.dividerSize, dividerFill = props.dividerFill, descSize = props.descSize, descTextWeight = props.descTextWeight, descTextColor = props.descTextColor, desc = props.desc, label = props.label, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, labelTextColor = props.labelTextColor, clearIconFill = props.clearIconFill, clearIcon = props.clearIcon, clearIconSize = props.clearIconSize, messageSize = props.messageSize, messageTextWeight = props.messageTextWeight, messageTextColor = props.messageTextColor, message = props.message;
     var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'form-field_size_',
         propsKey: 'size',
@@ -44,7 +44,7 @@ function FormField(props) {
     });
     // @ts-expect-error
     var formFieldStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default(className, 'form-field', set && "form-field_set_".concat(set), sizeClass, fillClass, shapeClass, directionClass), "data-test-id": dataTestId, style: formFieldStyles, children: [label && (jsxRuntime.jsxRuntimeExports.jsx("label", { htmlFor: id, className: "form-field__label", children: jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: labelSize, textWeight: labelTextWeight, textColor: labelTextColor, children: label }) })), desc && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "form-field__desc", children: jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: descSize, textWeight: descTextWeight, textColor: descTextColor, children: desc }) })), jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('form-field__item', inputFillClass, inputShapeClass), children: [jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('form-field__item-wrapper'), children: [beforeItem, children, clearIcon && jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { fill: clearIconFill, SvgImage: clearIcon, size: clearIconSize }), afterItem] }), jsxRuntime.jsxRuntimeExports.jsx(Divider.Divider, { className: "form-field__item-divider", direction: dividerDirection, fill: dividerFill, size: dividerSize, width: dividerWidth })] }), message && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "form-field__message", children: jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: messageSize, textWeight: messageTextWeight, textColor: messageTextColor, children: message }) }))] }));
+    return (jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default(className, 'form-field', set && "form-field_set_".concat(set), sizeClass, fillClass, shapeClass, directionClass), "data-test-id": dataTestId, style: formFieldStyles, children: [label && (jsxRuntime.jsxRuntimeExports.jsx("label", { htmlFor: id, className: "form-field__label", children: jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: labelTextSize, textWeight: labelTextWeight, textColor: labelTextColor, children: label }) })), desc && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "form-field__desc", children: jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: descSize, textWeight: descTextWeight, textColor: descTextColor, children: desc }) })), jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('form-field__item', inputFillClass, inputShapeClass), children: [jsxRuntime.jsxRuntimeExports.jsxs("div", { className: clsx__default.default('form-field__item-wrapper'), children: [beforeItem, children, clearIcon && jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, { fill: clearIconFill, SvgImage: clearIcon, size: clearIconSize }), afterItem] }), jsxRuntime.jsxRuntimeExports.jsx(Divider.Divider, { className: "form-field__item-divider", direction: dividerDirection, fill: dividerFill, size: dividerSize, width: dividerWidth })] }), message && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: "form-field__message", children: jsxRuntime.jsxRuntimeExports.jsx(Text.Text, { size: messageSize, textWeight: messageTextWeight, textColor: messageTextColor, children: message }) }))] }));
 }
 FormField.defaultProps = {
     dividerWidth: 'fill',

package/dist/cjs/components/Button.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Button = require('../Button-xUrOQjVd.js');
+var Button = require('../Button-DH5f_2bV.js');
 require('../jsx-runtime-BBxmckJR.js');
 require('react');
 require('clsx');

package/dist/cjs/components/Caption/Caption.interface.d.ts

@@ -1,15 +1,15 @@
 import { ReactNode } from 'react';
 import { iStyleAttributes } from '../../hooks/styleAttributes.interface';
-import { captionPositionPropsType, fillGradientPropsType, tFillProps } from '../../types';
+import { captionPositionPropsType, tFillGradientProps, tFillProps } from '../../types';
 export interface ICaptionThemeColor {
     fill: tFillProps;
     fillMobile: tFillProps;
     fillTablet: tFillProps;
     fillDesktop: tFillProps;
-    fillGradient: fillGradientPropsType;
-    fillGradientMobile: fillGradientPropsType;
-    fillGradientTablet: fillGradientPropsType;
-    fillGradientDesktop: fillGradientPropsType;
+    fillGradient: tFillGradientProps;
+    fillGradientMobile: tFillGradientProps;
+    fillGradientTablet: tFillGradientProps;
+    fillGradientDesktop: tFillGradientProps;
     position: captionPositionPropsType;
     positionMobile: captionPositionPropsType;
     positionTablet: captionPositionPropsType;