@astral/ui 1.50.1 → 1.51.1

package/BackdropStack/hooks/useBackdropStackToggle/useBackdropStackToggle.d.ts

@@ -1,5 +1,5 @@
 import { SyntheticEvent } from 'react';
-import { Reason } from '../../../types';
+import { CloseEventReason } from '../../../types';
 /**
  * @description необязательные настройки для использоввания хука
  */
@@ -23,7 +23,7 @@ type ReturnElements = {
     /**
      * @description метод вызываемый при закрытии элемента, внутри него определяется состояние isOpened
      */
-    handleClose: (event?: SyntheticEvent<Element, Event> | Event | {}, reason?: Reason) => void;
+    handleClose: (event?: SyntheticEvent<Element, Event> | Event | {}, reason?: CloseEventReason) => void;
 };
 type UseBackdropStackToggleFunc = (options?: Options) => ReturnElements;
 /**

package/BackdropStack/services/BackdropStackManager/BackdropStackManager.d.ts

@@ -1,15 +1,43 @@
-import { Reason } from '../../../types';
+import { CloseEventReason } from '../../../types';
+/**
+ * @description айдишка модалки/поппера/тултипа
+ */
 type PopId = string;
 declare class BackdropStackManager {
     private stack;
+    /**
+     * @description сохраняем информацию о том какой был предыдущий вызов pop,
+     * нужен для предотвращения синхронного закрытия при последовательности 'blur' и 'backdropClick' в рамках одного клика
+     */
     private previousPopInfo;
+    /**
+     * @description крайняя айдишка клика по странице
+     */
     private currentPointerId;
     constructor();
+    /**
+     * @description  метод проверки на конфликт причины закрытия с предыдущим
+     */
     private checkOn;
+    /**
+     * @description  метод генерации случайной айдишки
+     */
     generateID: () => string;
+    /**
+     * @description форс метод для удалении подписанного компонента из очереди,
+     * может быть полезно при массовом анмаунте компонентов
+     */
     remove: (id: PopId) => void;
+    /**
+     * @description метод добавления в стек
+     */
     push: (id: PopId) => void;
-    pop: (id: PopId, reason?: Reason) => boolean;
+    /**
+     * @description метод для запроса на выход из очереди,
+     * если все ок, то вернется true, что означает разрешение на выход и компонент будет вычеркнут из очереди,
+     * соответственно возврат false означает запрет, и компонент остается в очереди
+     */
+    pop: (id: PopId, reason?: CloseEventReason) => boolean;
 }
 export declare const backdropStackManager: BackdropStackManager;
 export {};

package/BackdropStack/services/BackdropStackManager/BackdropStackManager.js

@@ -1,29 +1,61 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.backdropStackManager = void 0;
+/**
+ * @description расширяемый набор конфликтующих причин закрытия с кликом по бэкдропу модалки,
+ * т.к. некоторые способы закрытия вызываются раньше, чем вызов backdropClick,
+ * а при несоблюдении последовательности возникают конфликты
+ */
+const backdropConflictsReasons = new Set([
+    'blur',
+    'clickAway',
+]);
 class BackdropStackManager {
     constructor() {
         var _a;
         this.stack = [];
-        // сохраняем информацию о том какой был предыдущий вызов pop,
-        // нужен для предотвращения синхронного закрытия при последовательности 'blur' и 'backdropClick' в рамках одного клика
+        /**
+         * @description сохраняем информацию о том какой был предыдущий вызов pop,
+         * нужен для предотвращения синхронного закрытия при последовательности 'blur' и 'backdropClick' в рамках одного клика
+         */
         this.previousPopInfo = [null, null];
+        /**
+         * @description крайняя айдишка клика по странице
+         */
         this.currentPointerId = null;
+        /**
+         * @description  метод проверки на конфликт причины закрытия с предыдущим
+         */
         this.checkOn = (reason) => {
             const [previousReason, previousPointerId] = this.previousPopInfo;
             return (reason === 'backdropClick' &&
-                previousReason === 'blur' &&
+                backdropConflictsReasons.has(previousReason) &&
                 previousPointerId === this.currentPointerId);
         };
+        /**
+         * @description  метод генерации случайной айдишки
+         */
         this.generateID = () => {
             return String(Math.random());
         };
+        /**
+         * @description форс метод для удалении подписанного компонента из очереди,
+         * может быть полезно при массовом анмаунте компонентов
+         */
         this.remove = (id) => {
             this.stack = this.stack.filter((item) => item !== id);
         };
+        /**
+         * @description метод добавления в стек
+         */
         this.push = (id) => {
             this.stack.push(id);
         };
+        /**
+         * @description метод для запроса на выход из очереди,
+         * если все ок, то вернется true, что означает разрешение на выход и компонент будет вычеркнут из очереди,
+         * соответственно возврат false означает запрет, и компонент остается в очереди
+         */
         this.pop = (id, reason) => {
             if (this.checkOn(reason)) {
                 return false;

package/Button/styles.d.ts

@@ -64,7 +64,7 @@ export declare const LoadingButtonWrapper: import("@emotion/styled").StyledCompo
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
 }, "disabled" | "action" | "color" | "sx" | "href" | "onFocusVisible" | "tabIndex" | "children" | "variant" | "size" | keyof import("@mui/material/OverridableComponent").CommonProps | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon" | "loading" | "loadingIndicator" | "loadingPosition"> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & Omit<import("../types").WithoutEmotionSpecific<import("@mui/lab").LoadingButtonProps<"button", {}>>, "color" | "variant"> & {
+} & Omit<import("..").WithoutEmotionSpecific<import("@mui/lab").LoadingButtonProps<"button", {}>>, "color" | "variant"> & {
     variant?: "link" | "light" | "text" | "contained" | undefined;
     color?: "primary" | "error" | "warning" | "success" | undefined;
     component?: import("react").ElementType<any> | undefined;

package/ClickAwayListener/ClickAwayListener.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { UseClickAwayListenerOptions } from '../hooks';
+export type ClickAwayListenerProps = Omit<UseClickAwayListenerOptions, 'ref'> & {
+    children: JSX.Element;
+};
+/**
+ * @description компонент предоставляющий обертку для работы с хуком useClickAwayEffect
+ */
+export declare const ClickAwayListener: ({ onClickAway, preventBubbling, isActive, children, }: ClickAwayListenerProps) => import("react").FunctionComponentElement<any>;

package/ClickAwayListener/ClickAwayListener.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ClickAwayListener = void 0;
+const react_1 = require("react");
+const hooks_1 = require("../hooks");
+/**
+ * @description компонент предоставляющий обертку для работы с хуком useClickAwayEffect
+ */
+const ClickAwayListener = ({ onClickAway, preventBubbling, isActive, children, }) => {
+    const ref = (0, react_1.useRef)(null);
+    (0, hooks_1.useClickAwayEffect)({ ref, onClickAway, preventBubbling, isActive });
+    return react_1.Children.only((0, react_1.cloneElement)(children, { ref }));
+};
+exports.ClickAwayListener = ClickAwayListener;

package/ClickAwayListener/ClickAwayListener.test.d.ts

@@ -0,0 +1 @@
+export {};

package/ClickAwayListener/ClickAwayListener.test.js

@@ -0,0 +1,37 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const tests_1 = require("@astral/tests");
+const vitest_1 = require("vitest");
+const ClickAwayListener_1 = require("./ClickAwayListener");
+describe('ClickAwayListener', () => {
+    it('Props:isActive=true: при клике внутри onClickAway не вызывается', () => __awaiter(void 0, void 0, void 0, function* () {
+        const onClickAway = vitest_1.vi.fn();
+        (0, tests_1.renderWithTheme)((0, jsx_runtime_1.jsx)(ClickAwayListener_1.ClickAwayListener, Object.assign({ onClickAway: onClickAway, isActive: true }, { children: (0, jsx_runtime_1.jsx)("div", { children: "Lorem" }) })));
+        const div = tests_1.screen.getByText('Lorem');
+        yield tests_1.userEvents.click(div);
+        expect(onClickAway).toBeCalledTimes(0);
+    }));
+    it('Props:isActive=false: при клике внутри onClickAway не вызывается', () => __awaiter(void 0, void 0, void 0, function* () {
+        const onClickAway = vitest_1.vi.fn();
+        (0, tests_1.renderWithTheme)((0, jsx_runtime_1.jsx)(ClickAwayListener_1.ClickAwayListener, Object.assign({ onClickAway: onClickAway, isActive: false }, { children: (0, jsx_runtime_1.jsx)("div", { children: "Lorem" }) })));
+        const div = tests_1.screen.getByText('Lorem');
+        yield tests_1.userEvents.click(div);
+        expect(onClickAway).toBeCalledTimes(0);
+    }));
+    it('Props:isActive=true: при клике снаружи, onClickAway вызывается', () => __awaiter(void 0, void 0, void 0, function* () {
+        const onClickAway = vitest_1.vi.fn();
+        (0, tests_1.renderWithTheme)((0, jsx_runtime_1.jsx)(ClickAwayListener_1.ClickAwayListener, Object.assign({ onClickAway: onClickAway, isActive: true }, { children: (0, jsx_runtime_1.jsx)("div", { children: "Lorem" }) })));
+        yield tests_1.userEvents.click(document.body);
+        expect(onClickAway).toBeCalledTimes(1);
+    }));
+});

package/ClickAwayListener/index.d.ts

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

package/{DatePicker/DatePickerClickAwayListener → ClickAwayListener}/index.js

@@ -14,4 +14,4 @@ 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("./DatePickerClickAwayListener"), exports);
+__exportStar(require("./ClickAwayListener"), exports);

package/DataGrid/DataGridNoData/styles.d.ts

@@ -16,7 +16,7 @@ export declare const DataGridNoDataIcon: import("@emotion/styled").StyledCompone
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const DataGridNoDataFigcaption: import("@emotion/styled").StyledComponent<Pick<import("react").PropsWithChildren<TypographyProps>, string | number | symbol> & import("react").RefAttributes<HTMLElement> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & Omit<import("@mui/material/OverridableComponent").OverrideProps<import("../../types").WithoutEmotionSpecific<import("@mui/material").TypographyTypeMap<{}, "span">>, import("react").ElementType<any>>, "color" | "variant"> & {
+} & Omit<import("@mui/material/OverridableComponent").OverrideProps<import("../..").WithoutEmotionSpecific<import("@mui/material").TypographyTypeMap<{}, "span">>, import("react").ElementType<any>>, "color" | "variant"> & {
     variant?: import("@mui/material").TypographyVariant | keyof import("@mui/material").TypographyPropsVariantOverrides | undefined;
     component?: import("react").ElementType<any> | undefined;
     color?: "primary" | "secondary" | "red" | "green" | "yellow" | "grey" | "error" | "warning" | "info" | "success" | "text" | "textSecondary" | ((theme: import("@mui/material").Theme) => string) | undefined;

package/DatePicker/DatePicker.d.ts

@@ -1,7 +1,7 @@
 import { SyntheticEvent } from 'react';
 import { TextFieldProps } from '../TextField';
 import { DateMask } from '../utils/date';
-import { Reason } from '../types';
+import { CloseEventReason } from '../types';
 import { MinMaxDate } from './types';
 import { MondayFirst } from './DayPicker';
 export type DatePickerProps = MondayFirst & Partial<MinMaxDate> & {
@@ -16,13 +16,14 @@ export type DatePickerProps = MondayFirst & Partial<MinMaxDate> & {
     onChange?: (date?: Date) => void;
     onBlur?: () => void;
     onOpen?: () => void;
-    onClose?: (event?: SyntheticEvent<Element, Event> | Event, reason?: Reason) => void;
+    onClose?: (event?: SyntheticEvent<Element, Event> | Event, reason?: CloseEventReason) => void;
     inputProps?: Omit<TextFieldProps, 'ref' | 'value' | 'onChange'>;
     disabled?: boolean;
     /**
      * @description Принимает только Date object, включая невалидную дату Invalid date
      * */
     value?: Date;
+    className?: string;
 };
 export declare const DatePicker: import("react").ForwardRefExoticComponent<MondayFirst & Partial<MinMaxDate> & {
     /**
@@ -36,11 +37,12 @@ export declare const DatePicker: import("react").ForwardRefExoticComponent<Monda
     onChange?: ((date?: Date) => void) | undefined;
     onBlur?: (() => void) | undefined;
     onOpen?: (() => void) | undefined;
-    onClose?: ((event?: SyntheticEvent<Element, Event> | Event, reason?: Reason) => void) | undefined;
+    onClose?: ((event?: SyntheticEvent<Element, Event> | Event, reason?: CloseEventReason) => void) | undefined;
     inputProps?: Omit<TextFieldProps, "ref" | "value" | "onChange"> | undefined;
     disabled?: boolean | undefined;
     /**
      * @description Принимает только Date object, включая невалидную дату Invalid date
      * */
     value?: Date | undefined;
+    className?: string | undefined;
 } & import("react").RefAttributes<HTMLInputElement>>;

package/DatePicker/DatePicker.js

@@ -15,13 +15,13 @@ exports.DatePicker = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const hooks_1 = require("../hooks");
-const DatePickerClickAwayListener_1 = require("./DatePickerClickAwayListener");
+const ClickAwayListener_1 = require("../ClickAwayListener");
 const DatePickerInput_1 = require("./DatePickerInput");
 const DatePickerPopper_1 = require("./DatePickerPopper");
 const MinMaxDateContext_1 = require("./MinMaxDateContext");
 const YearMonthDayPicker_1 = require("./YearMonthDayPicker");
 const hooks_2 = require("./hooks");
-const DatePickerInner = (0, react_1.forwardRef)(({ onChange, onOpen, onBlur, onClose, mask = 'DD.MM.YYYY', isMondayFirst, inputProps, disabled, value, }, forwardedRef) => {
+const DatePickerInner = (0, react_1.forwardRef)(({ onChange, onOpen, onBlur, onClose, mask = 'DD.MM.YYYY', isMondayFirst, inputProps, disabled, value, className, }, forwardedRef) => {
     const { maxDate, minDate } = (0, react_1.useContext)(MinMaxDateContext_1.MinMaxDateContext);
     const ref = (0, hooks_1.useForwardedRef)(forwardedRef);
     const [isOpenPopper, openPopper, closePopper] = (0, hooks_1.useToggle)({
@@ -47,7 +47,7 @@ const DatePickerInner = (0, react_1.forwardRef)(({ onChange, onOpen, onBlur, onC
     const handleChangeMaskInput = (e) => {
         onChangeMaskedValue(e.target.value);
     };
-    return ((0, jsx_runtime_1.jsxs)(DatePickerClickAwayListener_1.DatePickerClickAwayListener, Object.assign({ onClickAway: handleClosePopper }, { children: [(0, jsx_runtime_1.jsx)(DatePickerInput_1.DatePickerInput, Object.assign({}, inputProps, { mask: mask, onNativeChange: handleChangeMaskInput, disabled: disabled, value: maskedValue, ref: ref, onFocus: openPopper })), (0, jsx_runtime_1.jsx)(DatePickerPopper_1.DatePickerPopper, Object.assign({ open: isOpenPopper, onClose: handleClosePopper, anchorEl: ref === null || ref === void 0 ? void 0 : ref.current }, { children: (0, jsx_runtime_1.jsx)(YearMonthDayPicker_1.YearMonthDayPicker, { isMondayFirst: isMondayFirst, selectedDate: selectedBaseDate, onChange: handleDayPick, date: selectedBaseDate || baseDate }) }))] })));
+    return ((0, jsx_runtime_1.jsx)(ClickAwayListener_1.ClickAwayListener, Object.assign({ isActive: isOpenPopper, onClickAway: handleClosePopper }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: className }, { children: [(0, jsx_runtime_1.jsx)(DatePickerInput_1.DatePickerInput, Object.assign({}, inputProps, { mask: mask, onNativeChange: handleChangeMaskInput, disabled: disabled, value: maskedValue, ref: ref, onFocus: openPopper })), (0, jsx_runtime_1.jsx)(DatePickerPopper_1.DatePickerPopper, Object.assign({ open: isOpenPopper, onClose: handleClosePopper, anchorEl: ref === null || ref === void 0 ? void 0 : ref.current }, { children: (0, jsx_runtime_1.jsx)(YearMonthDayPicker_1.YearMonthDayPicker, { isMondayFirst: isMondayFirst, selectedDate: selectedBaseDate, onChange: handleDayPick, date: selectedBaseDate || baseDate }) }))] })) })));
 });
 exports.DatePicker = (0, react_1.forwardRef)((_a, forwardedRef) => {
     var { minDate, maxDate } = _a, props = __rest(_a, ["minDate", "maxDate"]);

package/DatePicker/DatePicker.test.js

@@ -89,4 +89,10 @@ describe('DatePicker', () => {
         yield tests_1.userEvents.tab();
         expect(onBlur).not.toBeCalled();
     }));
+    it('Props:onBlur: не вызывается при клике мимо инпута, если поповер закрыт', () => __awaiter(void 0, void 0, void 0, function* () {
+        const onBlur = vitest_1.vi.fn();
+        (0, tests_1.renderWithTheme)((0, jsx_runtime_1.jsx)(DatePicker_1.DatePicker, { onBlur: onBlur }));
+        yield tests_1.userEvents.click(document.body);
+        expect(onBlur).not.toBeCalled();
+    }));
 });

package/DatePicker/DatePickerPopper/DatePickerPopper.d.ts

@@ -1,7 +1,7 @@
 import { PropsWithChildren, SyntheticEvent } from 'react';
 import { PopperProps } from '@mui/material';
-import { Reason, WithoutEmotionSpecific } from '../../types';
+import { CloseEventReason, WithoutEmotionSpecific } from '../../types';
 export type DatePickerProps = PropsWithChildren<Omit<WithoutEmotionSpecific<PopperProps>, 'children'>> & {
-    onClose?: (_?: SyntheticEvent<Element, Event> | Event, reason?: Reason) => void;
+    onClose?: (_?: SyntheticEvent<Element, Event> | Event, reason?: CloseEventReason) => void;
 };
 export declare const DatePickerPopper: ({ children, onClose, ...props }: DatePickerProps) => JSX.Element;

package/Fab/styles.d.ts

@@ -30,7 +30,7 @@ export declare const StyledFab: import("@emotion/styled").StyledComponent<{
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
 }, "disabled" | "action" | "color" | "sx" | "href" | "onFocusVisible" | "tabIndex" | "children" | "variant" | "size" | keyof import("@mui/material/OverridableComponent").CommonProps | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple"> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & Omit<import("../types").WithoutEmotionSpecific<import("@mui/material").FabProps<"button", {}>>, "color" | "variant"> & {
+} & Omit<import("..").WithoutEmotionSpecific<import("@mui/material").FabProps<"button", {}>>, "color" | "variant"> & {
     color?: "primary" | "default" | "error" | "warning" | "success" | undefined;
     variant?: "square" | "circular" | "extended" | undefined;
 } & {

package/IconButton/styles.d.ts

@@ -8,7 +8,7 @@ export declare const getButtonSize: ({ size, }: IconButtonWrapperThemeProps) =>
 export declare const getButtonSizeMobile: ({ size, }: IconButtonWrapperThemeProps) => string;
 export declare const IconButtonWrapper: import("@emotion/styled").StyledComponent<Pick<import("../ButtonBase").BaseButtonProps, "color" | "translate" | keyof import("@mui/base").ButtonUnstyledOwnProps | "form" | "slot" | "style" | "title" | "key" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "component" | "variant" | "size" | "selected"> & import("react").RefAttributes<HTMLButtonElement> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & Omit<import("../types").WithoutEmotionSpecific<import("@mui/lab").LoadingButtonProps<"button", {}>>, "color" | "variant"> & {
+} & Omit<import("..").WithoutEmotionSpecific<import("@mui/lab").LoadingButtonProps<"button", {}>>, "color" | "variant"> & {
     variant?: "link" | "light" | "text" | "contained" | undefined;
     color?: "primary" | "error" | "warning" | "success" | undefined;
     component?: import("react").ElementType<any> | undefined;

package/SwipeableDrawer/styles.d.ts

@@ -40,7 +40,7 @@ export declare const SwipeableDrawerTitle: import("@emotion/styled").StyledCompo
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
 }, "sx" | "children" | "variant" | keyof import("@mui/material/OverridableComponent").CommonProps | ("fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "p" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & Omit<import("@mui/material/OverridableComponent").OverrideProps<import("../types").WithoutEmotionSpecific<import("@mui/material").TypographyTypeMap<{}, "span">>, import("react").ElementType<any>>, "color" | "variant"> & {
+} & Omit<import("@mui/material/OverridableComponent").OverrideProps<import("..").WithoutEmotionSpecific<import("@mui/material").TypographyTypeMap<{}, "span">>, import("react").ElementType<any>>, "color" | "variant"> & {
     variant?: import("@mui/material").TypographyVariant | keyof import("@mui/material").TypographyPropsVariantOverrides | undefined;
     component?: import("react").ElementType<any> | undefined;
     color?: "primary" | "secondary" | "red" | "green" | "yellow" | "grey" | "error" | "warning" | "info" | "success" | "text" | "textSecondary" | ((theme: import("@mui/material").Theme) => string) | undefined;

package/Tooltip/styled.d.ts

@@ -1,4 +1,4 @@
-export declare const StyledTooltip: import("@emotion/styled").StyledComponent<import("../types").WithoutEmotionSpecific<import("@mui/material").TooltipProps> & {
+export declare const StyledTooltip: import("@emotion/styled").StyledComponent<import("..").WithoutEmotionSpecific<import("@mui/material").TooltipProps> & {
     size?: "medium" | "small" | undefined;
 } & {
     theme?: import("@emotion/react").Theme | undefined;

package/esm/BackdropStack/hooks/useBackdropStackToggle/useBackdropStackToggle.d.ts

@@ -1,5 +1,5 @@
 import { SyntheticEvent } from 'react';
-import { Reason } from '../../../types';
+import { CloseEventReason } from '../../../types';
 /**
  * @description необязательные настройки для использоввания хука
  */
@@ -23,7 +23,7 @@ type ReturnElements = {
     /**
      * @description метод вызываемый при закрытии элемента, внутри него определяется состояние isOpened
      */
-    handleClose: (event?: SyntheticEvent<Element, Event> | Event | {}, reason?: Reason) => void;
+    handleClose: (event?: SyntheticEvent<Element, Event> | Event | {}, reason?: CloseEventReason) => void;
 };
 type UseBackdropStackToggleFunc = (options?: Options) => ReturnElements;
 /**

package/esm/BackdropStack/services/BackdropStackManager/BackdropStackManager.d.ts

@@ -1,15 +1,43 @@
-import { Reason } from '../../../types';
+import { CloseEventReason } from '../../../types';
+/**
+ * @description айдишка модалки/поппера/тултипа
+ */
 type PopId = string;
 declare class BackdropStackManager {
     private stack;
+    /**
+     * @description сохраняем информацию о том какой был предыдущий вызов pop,
+     * нужен для предотвращения синхронного закрытия при последовательности 'blur' и 'backdropClick' в рамках одного клика
+     */
     private previousPopInfo;
+    /**
+     * @description крайняя айдишка клика по странице
+     */
     private currentPointerId;
     constructor();
+    /**
+     * @description  метод проверки на конфликт причины закрытия с предыдущим
+     */
     private checkOn;
+    /**
+     * @description  метод генерации случайной айдишки
+     */
     generateID: () => string;
+    /**
+     * @description форс метод для удалении подписанного компонента из очереди,
+     * может быть полезно при массовом анмаунте компонентов
+     */
     remove: (id: PopId) => void;
+    /**
+     * @description метод добавления в стек
+     */
     push: (id: PopId) => void;
-    pop: (id: PopId, reason?: Reason) => boolean;
+    /**
+     * @description метод для запроса на выход из очереди,
+     * если все ок, то вернется true, что означает разрешение на выход и компонент будет вычеркнут из очереди,
+     * соответственно возврат false означает запрет, и компонент остается в очереди
+     */
+    pop: (id: PopId, reason?: CloseEventReason) => boolean;
 }
 export declare const backdropStackManager: BackdropStackManager;
 export {};

package/esm/BackdropStack/services/BackdropStackManager/BackdropStackManager.js

@@ -1,26 +1,58 @@
+/**
+ * @description расширяемый набор конфликтующих причин закрытия с кликом по бэкдропу модалки,
+ * т.к. некоторые способы закрытия вызываются раньше, чем вызов backdropClick,
+ * а при несоблюдении последовательности возникают конфликты
+ */
+const backdropConflictsReasons = new Set([
+    'blur',
+    'clickAway',
+]);
 class BackdropStackManager {
     constructor() {
         var _a;
         this.stack = [];
-        // сохраняем информацию о том какой был предыдущий вызов pop,
-        // нужен для предотвращения синхронного закрытия при последовательности 'blur' и 'backdropClick' в рамках одного клика
+        /**
+         * @description сохраняем информацию о том какой был предыдущий вызов pop,
+         * нужен для предотвращения синхронного закрытия при последовательности 'blur' и 'backdropClick' в рамках одного клика
+         */
         this.previousPopInfo = [null, null];
+        /**
+         * @description крайняя айдишка клика по странице
+         */
         this.currentPointerId = null;
+        /**
+         * @description  метод проверки на конфликт причины закрытия с предыдущим
+         */
         this.checkOn = (reason) => {
             const [previousReason, previousPointerId] = this.previousPopInfo;
             return (reason === 'backdropClick' &&
-                previousReason === 'blur' &&
+                backdropConflictsReasons.has(previousReason) &&
                 previousPointerId === this.currentPointerId);
         };
+        /**
+         * @description  метод генерации случайной айдишки
+         */
         this.generateID = () => {
             return String(Math.random());
         };
+        /**
+         * @description форс метод для удалении подписанного компонента из очереди,
+         * может быть полезно при массовом анмаунте компонентов
+         */
         this.remove = (id) => {
             this.stack = this.stack.filter((item) => item !== id);
         };
+        /**
+         * @description метод добавления в стек
+         */
         this.push = (id) => {
             this.stack.push(id);
         };
+        /**
+         * @description метод для запроса на выход из очереди,
+         * если все ок, то вернется true, что означает разрешение на выход и компонент будет вычеркнут из очереди,
+         * соответственно возврат false означает запрет, и компонент остается в очереди
+         */
         this.pop = (id, reason) => {
             if (this.checkOn(reason)) {
                 return false;

package/esm/Button/styles.d.ts

@@ -64,7 +64,7 @@ export declare const LoadingButtonWrapper: import("@emotion/styled").StyledCompo
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
 }, "disabled" | "action" | "color" | "sx" | "href" | "onFocusVisible" | "tabIndex" | "children" | "variant" | "size" | keyof import("@mui/material/OverridableComponent").CommonProps | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon" | "loading" | "loadingIndicator" | "loadingPosition"> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & Omit<import("../types").WithoutEmotionSpecific<import("@mui/lab").LoadingButtonProps<"button", {}>>, "color" | "variant"> & {
+} & Omit<import("..").WithoutEmotionSpecific<import("@mui/lab").LoadingButtonProps<"button", {}>>, "color" | "variant"> & {
     variant?: "link" | "light" | "text" | "contained" | undefined;
     color?: "primary" | "error" | "warning" | "success" | undefined;
     component?: import("react").ElementType<any> | undefined;

package/esm/ClickAwayListener/ClickAwayListener.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { UseClickAwayListenerOptions } from '../hooks';
+export type ClickAwayListenerProps = Omit<UseClickAwayListenerOptions, 'ref'> & {
+    children: JSX.Element;
+};
+/**
+ * @description компонент предоставляющий обертку для работы с хуком useClickAwayEffect
+ */
+export declare const ClickAwayListener: ({ onClickAway, preventBubbling, isActive, children, }: ClickAwayListenerProps) => import("react").FunctionComponentElement<any>;

package/esm/ClickAwayListener/ClickAwayListener.js

@@ -0,0 +1,10 @@
+import { Children, cloneElement, useRef } from 'react';
+import { useClickAwayEffect } from '../hooks';
+/**
+ * @description компонент предоставляющий обертку для работы с хуком useClickAwayEffect
+ */
+export const ClickAwayListener = ({ onClickAway, preventBubbling, isActive, children, }) => {
+    const ref = useRef(null);
+    useClickAwayEffect({ ref, onClickAway, preventBubbling, isActive });
+    return Children.only(cloneElement(children, { ref }));
+};

package/esm/ClickAwayListener/ClickAwayListener.test.d.ts

@@ -0,0 +1 @@
+export {};

package/esm/ClickAwayListener/ClickAwayListener.test.js

@@ -0,0 +1,35 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { renderWithTheme, screen, userEvents } from '@astral/tests';
+import { vi } from 'vitest';
+import { ClickAwayListener } from './ClickAwayListener';
+describe('ClickAwayListener', () => {
+    it('Props:isActive=true: при клике внутри onClickAway не вызывается', () => __awaiter(void 0, void 0, void 0, function* () {
+        const onClickAway = vi.fn();
+        renderWithTheme(_jsx(ClickAwayListener, Object.assign({ onClickAway: onClickAway, isActive: true }, { children: _jsx("div", { children: "Lorem" }) })));
+        const div = screen.getByText('Lorem');
+        yield userEvents.click(div);
+        expect(onClickAway).toBeCalledTimes(0);
+    }));
+    it('Props:isActive=false: при клике внутри onClickAway не вызывается', () => __awaiter(void 0, void 0, void 0, function* () {
+        const onClickAway = vi.fn();
+        renderWithTheme(_jsx(ClickAwayListener, Object.assign({ onClickAway: onClickAway, isActive: false }, { children: _jsx("div", { children: "Lorem" }) })));
+        const div = screen.getByText('Lorem');
+        yield userEvents.click(div);
+        expect(onClickAway).toBeCalledTimes(0);
+    }));
+    it('Props:isActive=true: при клике снаружи, onClickAway вызывается', () => __awaiter(void 0, void 0, void 0, function* () {
+        const onClickAway = vi.fn();
+        renderWithTheme(_jsx(ClickAwayListener, Object.assign({ onClickAway: onClickAway, isActive: true }, { children: _jsx("div", { children: "Lorem" }) })));
+        yield userEvents.click(document.body);
+        expect(onClickAway).toBeCalledTimes(1);
+    }));
+});

package/esm/ClickAwayListener/index.d.ts

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

package/esm/ClickAwayListener/index.js

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

package/esm/DataGrid/DataGridNoData/styles.d.ts

@@ -16,7 +16,7 @@ export declare const DataGridNoDataIcon: import("@emotion/styled").StyledCompone
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const DataGridNoDataFigcaption: import("@emotion/styled").StyledComponent<Pick<import("react").PropsWithChildren<TypographyProps>, string | number | symbol> & import("react").RefAttributes<HTMLElement> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & Omit<import("@mui/material/OverridableComponent").OverrideProps<import("../../types").WithoutEmotionSpecific<import("@mui/material").TypographyTypeMap<{}, "span">>, import("react").ElementType<any>>, "color" | "variant"> & {
+} & Omit<import("@mui/material/OverridableComponent").OverrideProps<import("../..").WithoutEmotionSpecific<import("@mui/material").TypographyTypeMap<{}, "span">>, import("react").ElementType<any>>, "color" | "variant"> & {
     variant?: import("@mui/material").TypographyVariant | keyof import("@mui/material").TypographyPropsVariantOverrides | undefined;
     component?: import("react").ElementType<any> | undefined;
     color?: "primary" | "secondary" | "red" | "green" | "yellow" | "grey" | "error" | "warning" | "info" | "success" | "text" | "textSecondary" | ((theme: import("@mui/material").Theme) => string) | undefined;