@astral/ui 4.113.0 → 4.113.1

package/components/DatePicker/DatePickerPopover/DatePickerPopover.d.ts

@@ -1,10 +1,11 @@
 import { type PopperProps } from '@mui/material/Popper';
 import { type PropsWithChildren } from 'react';
+import { type CloseEventReason } from '../../types/CloseEventReason';
 import { type WithoutEmotionSpecific } from '../../types/WithoutEmotionSpecific';
 export type DatePickerPopperProps = PropsWithChildren<Omit<WithoutEmotionSpecific<PopperProps>, 'children' | 'disablePortal' | 'transition'> & {
     /**
      * Обработчик закрытия Popper
      */
-    onClose: () => void;
+    onClose: (event?: Event, reason?: CloseEventReason) => void;
 }>;
 export declare const DatePickerPopover: ({ children, onMouseEnter, onMouseLeave, onClose, anchorEl, title, open, ...props }: DatePickerPopperProps) => import("react/jsx-runtime").JSX.Element;

package/components/DatePicker/DatePickerPopover/DatePickerPopover.js

@@ -5,13 +5,15 @@ import { usePopoverAnimation } from '../../usePopoverAnimation';
 import { useViewportType } from '../../useViewportType';
 import { datePickerClassnames } from '../constants';
 import { AnimatedWrapper, InnerContainer, StyledPopper } from './styles';
+import { useLogic } from './useLogic';
 export const DatePickerPopover = ({ children, onMouseEnter, onMouseLeave, onClose, anchorEl, title, open, ...props }) => {
     const { isMobile } = useViewportType();
     const { shouldRender, handleAnimationEnd } = usePopoverAnimation(open);
+    const { handleClickAway, handleDrawerClose } = useLogic({ onClose });
     if (isMobile) {
-        return (_jsx(BottomDrawer, { className: datePickerClassnames.popover, title: title, open: open, onClose: onClose, 
+        return (_jsx(BottomDrawer, { className: datePickerClassnames.popover, title: title, open: open, onClose: handleDrawerClose, 
             // Отключает простановку фокуса в инпут при закрытии Drawer
             disableRestoreFocus: true, children: children }));
     }
-    return (_jsx(StyledPopper, { className: datePickerClassnames.popover, open: shouldRender, anchorEl: anchorEl, ...props, children: _jsx(AnimatedWrapper, { "$isOpen": open, onAnimationEnd: handleAnimationEnd, children: _jsx(ClickAwayListener, { onClickAway: onClose, children: _jsx(InnerContainer, { onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, className: datePickerClassnames.popoverContainer, children: children }) }) }) }));
+    return (_jsx(StyledPopper, { className: datePickerClassnames.popover, open: shouldRender, anchorEl: anchorEl, ...props, children: _jsx(AnimatedWrapper, { "$isOpen": open, onAnimationEnd: handleAnimationEnd, children: _jsx(ClickAwayListener, { isActive: open, onClickAway: handleClickAway, children: _jsx(InnerContainer, { onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, className: datePickerClassnames.popoverContainer, children: children }) }) }) }));
 };

package/components/DatePicker/DatePickerPopover/useLogic/index.d.ts

@@ -0,0 +1 @@
+export * from './useLogic';

package/components/DatePicker/DatePickerPopover/useLogic/index.js

@@ -0,0 +1 @@
+export * from './useLogic';

package/components/DatePicker/DatePickerPopover/useLogic/useLogic.d.ts

@@ -0,0 +1,9 @@
+import { type CloseEventReason } from '../../../types/CloseEventReason';
+type UseLogicParams = {
+    onClose: (event?: Event, reason?: CloseEventReason) => void;
+};
+export declare const useLogic: ({ onClose }: UseLogicParams) => {
+    handleClickAway: (event: PointerEvent, reason: CloseEventReason) => void;
+    handleDrawerClose: () => void;
+};
+export {};

package/components/DatePicker/DatePickerPopover/useLogic/useLogic.js

@@ -0,0 +1,9 @@
+import { stopNextMouseDownPropagation } from './utils';
+export const useLogic = ({ onClose }) => {
+    const handleClickAway = (event, reason) => {
+        stopNextMouseDownPropagation();
+        onClose(event, reason);
+    };
+    const handleDrawerClose = () => onClose();
+    return { handleClickAway, handleDrawerClose };
+};

package/components/DatePicker/DatePickerPopover/useLogic/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './stopNextMouseDownPropagation';

package/components/DatePicker/DatePickerPopover/useLogic/utils/index.js

@@ -0,0 +1 @@
+export * from './stopNextMouseDownPropagation';

package/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/index.d.ts

@@ -0,0 +1 @@
+export * from './stopNextMouseDownPropagation';

package/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/index.js

@@ -0,0 +1 @@
+export * from './stopNextMouseDownPropagation';

package/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/stopNextMouseDownPropagation.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Останавливает всплытие следующего mousedown.
+ */
+export declare const stopNextMouseDownPropagation: () => void;

package/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/stopNextMouseDownPropagation.js

@@ -0,0 +1,15 @@
+/**
+ * Останавливает всплытие следующего mousedown.
+ */
+export const stopNextMouseDownPropagation = () => {
+    const stopMouseDown = (event) => {
+        event.stopPropagation();
+        removeListeners();
+    };
+    const removeListeners = () => {
+        window.removeEventListener('mousedown', stopMouseDown, true);
+        window.removeEventListener('pointerdown', removeListeners, true);
+    };
+    window.addEventListener('mousedown', stopMouseDown, true);
+    window.addEventListener('pointerdown', removeListeners, true);
+};

package/components/DatePicker/useLogic/useLogic.d.ts

@@ -1,11 +1,12 @@
 import { type Ref, type SyntheticEvent } from 'react';
+import { type CloseEventReason } from '../../types/CloseEventReason';
 import { type DatePickerProps } from '../types/props';
 type UseLogicParams = DatePickerProps & {
     forwardedRef: Ref<HTMLDivElement>;
 };
 export declare const useLogic: ({ label, value, maxDate, minDate, mask, onOpen, onClose, onBlur, onChange, forwardedRef, }: UseLogicParams) => {
     handleOpen: (event: SyntheticEvent) => void;
-    handleClose: () => void;
+    handleClose: (event?: Event, reason?: CloseEventReason) => void;
     confirmButtonProps: {
         onClick: () => void;
         disabled: boolean;
@@ -22,7 +23,7 @@ export declare const useLogic: ({ label, value, maxDate, minDate, mask, onOpen,
     datePickerProps: {
         open: boolean;
         anchorEl: HTMLDivElement | null;
-        onClose: () => void;
+        onClose: (event?: Event, reason?: CloseEventReason) => void;
         title: string | undefined;
     };
 };

package/components/DatePicker/useLogic/useLogic.js

@@ -41,11 +41,11 @@ export const useLogic = ({ label, value, maxDate = DEFAULT_MAX_DATE, minDate = D
         onMaskedValueBlur();
         onBlur?.();
     };
-    function handleClose() {
+    const handleClose = (event, reason) => {
         flushMaskedValueAndCallOnBlur();
-        onClose?.();
+        onClose?.(event, reason);
         close();
-    }
+    };
     const handleInputBlur = () => {
         if (isOpen) {
             return;

package/components/DateRangePicker/useLogic/useLogic.d.ts

@@ -1,4 +1,5 @@
 import { type ForwardedRef, type SyntheticEvent } from 'react';
+import { type CloseEventReason } from '../../types/CloseEventReason';
 import { type DateRangePickerProps } from '../types';
 type UseLogicParams = DateRangePickerProps;
 export declare const useLogic: ({ value, minDate, maxDate, mask, onChange, onOpen, onClose, onBlur, }: UseLogicParams, forwardedRef: ForwardedRef<HTMLDivElement>) => {
@@ -25,7 +26,7 @@ export declare const useLogic: ({ value, minDate, maxDate, mask, onChange, onOpe
         anchorEl: HTMLDivElement | null;
         onMouseEnter: () => void;
         onMouseLeave: () => void;
-        onClose: () => void;
+        onClose: (event?: Event, reason?: CloseEventReason) => void;
     };
     minMaxDateContextProviderProps: {
         minDate: Date;

package/components/DateRangePicker/useLogic/useLogic.js

@@ -88,10 +88,10 @@ export const useLogic = ({ value, minDate = DEFAULT_MIN_DATE, maxDate = DEFAULT_
             onMaskedEndValueBlur();
         }
     };
-    const handleClose = () => {
+    const handleClose = (event, reason) => {
         flushActiveMaskedValueOnClose();
         onBlur?.();
-        onClose?.();
+        onClose?.(event, reason);
         close();
     };
     const handleStartInputBlur = () => {

package/node/components/DatePicker/DatePickerPopover/DatePickerPopover.d.ts

@@ -1,10 +1,11 @@
 import { type PopperProps } from '@mui/material/Popper';
 import { type PropsWithChildren } from 'react';
+import { type CloseEventReason } from '../../types/CloseEventReason';
 import { type WithoutEmotionSpecific } from '../../types/WithoutEmotionSpecific';
 export type DatePickerPopperProps = PropsWithChildren<Omit<WithoutEmotionSpecific<PopperProps>, 'children' | 'disablePortal' | 'transition'> & {
     /**
      * Обработчик закрытия Popper
      */
-    onClose: () => void;
+    onClose: (event?: Event, reason?: CloseEventReason) => void;
 }>;
 export declare const DatePickerPopover: ({ children, onMouseEnter, onMouseLeave, onClose, anchorEl, title, open, ...props }: DatePickerPopperProps) => import("react/jsx-runtime").JSX.Element;

package/node/components/DatePicker/DatePickerPopover/DatePickerPopover.js

@@ -8,14 +8,16 @@ const usePopoverAnimation_1 = require("../../usePopoverAnimation");
 const useViewportType_1 = require("../../useViewportType");
 const constants_1 = require("../constants");
 const styles_1 = require("./styles");
+const useLogic_1 = require("./useLogic");
 const DatePickerPopover = ({ children, onMouseEnter, onMouseLeave, onClose, anchorEl, title, open, ...props }) => {
     const { isMobile } = (0, useViewportType_1.useViewportType)();
     const { shouldRender, handleAnimationEnd } = (0, usePopoverAnimation_1.usePopoverAnimation)(open);
+    const { handleClickAway, handleDrawerClose } = (0, useLogic_1.useLogic)({ onClose });
     if (isMobile) {
-        return ((0, jsx_runtime_1.jsx)(BottomDrawer_1.BottomDrawer, { className: constants_1.datePickerClassnames.popover, title: title, open: open, onClose: onClose, 
+        return ((0, jsx_runtime_1.jsx)(BottomDrawer_1.BottomDrawer, { className: constants_1.datePickerClassnames.popover, title: title, open: open, onClose: handleDrawerClose, 
             // Отключает простановку фокуса в инпут при закрытии Drawer
             disableRestoreFocus: true, children: children }));
     }
-    return ((0, jsx_runtime_1.jsx)(styles_1.StyledPopper, { className: constants_1.datePickerClassnames.popover, open: shouldRender, anchorEl: anchorEl, ...props, children: (0, jsx_runtime_1.jsx)(styles_1.AnimatedWrapper, { "$isOpen": open, onAnimationEnd: handleAnimationEnd, children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.ClickAwayListener, { onClickAway: onClose, children: (0, jsx_runtime_1.jsx)(styles_1.InnerContainer, { onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, className: constants_1.datePickerClassnames.popoverContainer, children: children }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(styles_1.StyledPopper, { className: constants_1.datePickerClassnames.popover, open: shouldRender, anchorEl: anchorEl, ...props, children: (0, jsx_runtime_1.jsx)(styles_1.AnimatedWrapper, { "$isOpen": open, onAnimationEnd: handleAnimationEnd, children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.ClickAwayListener, { isActive: open, onClickAway: handleClickAway, children: (0, jsx_runtime_1.jsx)(styles_1.InnerContainer, { onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, className: constants_1.datePickerClassnames.popoverContainer, children: children }) }) }) }));
 };
 exports.DatePickerPopover = DatePickerPopover;

package/node/components/DatePicker/DatePickerPopover/useLogic/index.d.ts

@@ -0,0 +1 @@
+export * from './useLogic';

package/node/components/DatePicker/DatePickerPopover/useLogic/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useLogic"), exports);

package/node/components/DatePicker/DatePickerPopover/useLogic/useLogic.d.ts

@@ -0,0 +1,9 @@
+import { type CloseEventReason } from '../../../types/CloseEventReason';
+type UseLogicParams = {
+    onClose: (event?: Event, reason?: CloseEventReason) => void;
+};
+export declare const useLogic: ({ onClose }: UseLogicParams) => {
+    handleClickAway: (event: PointerEvent, reason: CloseEventReason) => void;
+    handleDrawerClose: () => void;
+};
+export {};

package/node/components/DatePicker/DatePickerPopover/useLogic/useLogic.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLogic = void 0;
+const utils_1 = require("./utils");
+const useLogic = ({ onClose }) => {
+    const handleClickAway = (event, reason) => {
+        (0, utils_1.stopNextMouseDownPropagation)();
+        onClose(event, reason);
+    };
+    const handleDrawerClose = () => onClose();
+    return { handleClickAway, handleDrawerClose };
+};
+exports.useLogic = useLogic;

package/node/components/DatePicker/DatePickerPopover/useLogic/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './stopNextMouseDownPropagation';

package/node/components/DatePicker/DatePickerPopover/useLogic/utils/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./stopNextMouseDownPropagation"), exports);

package/node/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/index.d.ts

@@ -0,0 +1 @@
+export * from './stopNextMouseDownPropagation';

package/node/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./stopNextMouseDownPropagation"), exports);

package/node/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/stopNextMouseDownPropagation.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Останавливает всплытие следующего mousedown.
+ */
+export declare const stopNextMouseDownPropagation: () => void;

package/node/components/DatePicker/DatePickerPopover/useLogic/utils/stopNextMouseDownPropagation/stopNextMouseDownPropagation.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.stopNextMouseDownPropagation = void 0;
+/**
+ * Останавливает всплытие следующего mousedown.
+ */
+const stopNextMouseDownPropagation = () => {
+    const stopMouseDown = (event) => {
+        event.stopPropagation();
+        removeListeners();
+    };
+    const removeListeners = () => {
+        window.removeEventListener('mousedown', stopMouseDown, true);
+        window.removeEventListener('pointerdown', removeListeners, true);
+    };
+    window.addEventListener('mousedown', stopMouseDown, true);
+    window.addEventListener('pointerdown', removeListeners, true);
+};
+exports.stopNextMouseDownPropagation = stopNextMouseDownPropagation;

package/node/components/DatePicker/useLogic/useLogic.d.ts

@@ -1,11 +1,12 @@
 import { type Ref, type SyntheticEvent } from 'react';
+import { type CloseEventReason } from '../../types/CloseEventReason';
 import { type DatePickerProps } from '../types/props';
 type UseLogicParams = DatePickerProps & {
     forwardedRef: Ref<HTMLDivElement>;
 };
 export declare const useLogic: ({ label, value, maxDate, minDate, mask, onOpen, onClose, onBlur, onChange, forwardedRef, }: UseLogicParams) => {
     handleOpen: (event: SyntheticEvent) => void;
-    handleClose: () => void;
+    handleClose: (event?: Event, reason?: CloseEventReason) => void;
     confirmButtonProps: {
         onClick: () => void;
         disabled: boolean;
@@ -22,7 +23,7 @@ export declare const useLogic: ({ label, value, maxDate, minDate, mask, onOpen,
     datePickerProps: {
         open: boolean;
         anchorEl: HTMLDivElement | null;
-        onClose: () => void;
+        onClose: (event?: Event, reason?: CloseEventReason) => void;
         title: string | undefined;
     };
 };

package/node/components/DatePicker/useLogic/useLogic.js

@@ -44,11 +44,11 @@ const useLogic = ({ label, value, maxDate = MinMaxDateContext_1.DEFAULT_MAX_DATE
         onMaskedValueBlur();
         onBlur?.();
     };
-    function handleClose() {
+    const handleClose = (event, reason) => {
         flushMaskedValueAndCallOnBlur();
-        onClose?.();
+        onClose?.(event, reason);
         close();
-    }
+    };
     const handleInputBlur = () => {
         if (isOpen) {
             return;

package/node/components/DateRangePicker/useLogic/useLogic.d.ts

@@ -1,4 +1,5 @@
 import { type ForwardedRef, type SyntheticEvent } from 'react';
+import { type CloseEventReason } from '../../types/CloseEventReason';
 import { type DateRangePickerProps } from '../types';
 type UseLogicParams = DateRangePickerProps;
 export declare const useLogic: ({ value, minDate, maxDate, mask, onChange, onOpen, onClose, onBlur, }: UseLogicParams, forwardedRef: ForwardedRef<HTMLDivElement>) => {
@@ -25,7 +26,7 @@ export declare const useLogic: ({ value, minDate, maxDate, mask, onChange, onOpe
         anchorEl: HTMLDivElement | null;
         onMouseEnter: () => void;
         onMouseLeave: () => void;
-        onClose: () => void;
+        onClose: (event?: Event, reason?: CloseEventReason) => void;
     };
     minMaxDateContextProviderProps: {
         minDate: Date;

package/node/components/DateRangePicker/useLogic/useLogic.js

@@ -91,10 +91,10 @@ const useLogic = ({ value, minDate = DatePicker_1.DEFAULT_MIN_DATE, maxDate = Da
             onMaskedEndValueBlur();
         }
     };
-    const handleClose = () => {
+    const handleClose = (event, reason) => {
         flushActiveMaskedValueOnClose();
         onBlur?.();
-        onClose?.();
+        onClose?.(event, reason);
         close();
     };
     const handleStartInputBlur = () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astral/ui",
-  "version": "4.113.0",
+  "version": "4.113.1",
   "browser": "./index.js",
   "main": "./node/index.js",
   "dependencies": {