@finam/web-ui-kit-components 3.30.1 → 3.32.0

package/dist/MessageDialog/MessageDialog.js

@@ -0,0 +1,76 @@
+import { _ } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props__ } from "@swc/helpers/_/_object_spread_props";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { memo, useMemo } from "react";
+import Dialog from "../Dialog/index.js";
+import DialogTitle from "../DialogTitle/index.js";
+import DialogActions from "../DialogActions/index.js";
+import Typography from "../Typography/index.js";
+import ButtonAsync from "../ButtonAsync/index.js";
+import useMessageDialog from "./useMessageDialog.js";
+import { DialogContent } from "./MessageDialog.styles.js";
+const MessageDialog = ({ open, title, text, children, buttonConfirmLabel, buttonCancelLabel, size, width = size ? void 0 : 360, showConfirm, showCancel, disabled, confirmOnEnter, showCloseButton, confirmTestId = 'confirm', cancelTestId = 'cancel', TransitionProps, onConfirm, onCancel, onClose, onClosed })=>{
+    const { confirmButtonRef, handleConfirm, handleExited } = useMessageDialog({
+        open,
+        confirmOnEnter,
+        onConfirm,
+        onClose,
+        onClosed,
+        onExited: null == TransitionProps ? void 0 : TransitionProps.onExited
+    });
+    const dialogTransitionProps = useMemo(()=>_object_spread_props__(_({}, TransitionProps), {
+            onExited: handleExited
+        }), [
+        TransitionProps,
+        handleExited
+    ]);
+    const isConfirmVisible = null != showConfirm ? showConfirm : Boolean(onConfirm || onClose);
+    const isCancelVisible = (null != showCancel ? showCancel : Boolean(onCancel)) && Boolean(buttonCancelLabel);
+    return /*#__PURE__*/ jsxs(Dialog, {
+        open: open,
+        onClose: onClose,
+        width: width,
+        size: size,
+        scroll: "body",
+        TransitionProps: dialogTransitionProps,
+        children: [
+            /*#__PURE__*/ jsx(DialogTitle, {
+                size: size,
+                onClose: showCloseButton ? onClose : void 0,
+                children: title
+            }),
+            /*#__PURE__*/ jsx(DialogContent, {
+                size: size,
+                children: null != children ? children : /*#__PURE__*/ jsx(Typography, {
+                    variant: "body14",
+                    children: text
+                })
+            }),
+            /*#__PURE__*/ jsxs(DialogActions, {
+                size: size,
+                children: [
+                    isCancelVisible && /*#__PURE__*/ jsx(ButtonAsync, {
+                        size: "s",
+                        variant: "secondary",
+                        onClick: onCancel,
+                        "data-testid": cancelTestId,
+                        children: buttonCancelLabel
+                    }),
+                    isConfirmVisible && /*#__PURE__*/ jsx(ButtonAsync, {
+                        ref: confirmButtonRef,
+                        size: "s",
+                        variant: "primary",
+                        disabled: disabled,
+                        onClick: handleConfirm,
+                        "data-testid": confirmTestId,
+                        children: buttonConfirmLabel
+                    })
+                ]
+            })
+        ]
+    });
+};
+const MessageDialog_MessageDialog = /*#__PURE__*/ memo(MessageDialog);
+export default MessageDialog_MessageDialog;
+
+//# sourceMappingURL=MessageDialog.js.map

package/dist/MessageDialog/MessageDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageDialog/MessageDialog.js","sources":["../../src/MessageDialog/MessageDialog.tsx"],"sourcesContent":["import { memo, useMemo, type ReactNode } from 'react';\nimport Dialog, { type DialogProps } from '../Dialog/index.js';\nimport DialogTitle from '../DialogTitle/index.js';\nimport DialogActions from '../DialogActions/index.js';\nimport Typography from '../Typography/index.js';\nimport ButtonAsync from '../ButtonAsync/index.js';\nimport useMessageDialog from './useMessageDialog.js';\nimport type { BaseProps } from './types.js';\nimport { DialogContent } from './MessageDialog.styles.js';\n\nexport interface Props extends BaseProps {\n  /** Содержимое диалога вместо `text` - рендерится как есть */\n  children?: ReactNode;\n  /** Ширина диалога. По умолчанию 360, если не задан `size` */\n  width?: number | string;\n  /** Размер диалога */\n  size?: DialogProps['size'];\n  /** Показывать крестик закрытия в заголовке */\n  showCloseButton?: boolean;\n  /** from Dialog */\n  TransitionProps?: DialogProps['TransitionProps'];\n}\n\nconst MessageDialog = ({\n  open,\n  title,\n  text,\n  children,\n  buttonConfirmLabel,\n  buttonCancelLabel,\n  size,\n  width = size ? undefined : 360,\n  showConfirm,\n  showCancel,\n  disabled,\n  confirmOnEnter,\n  showCloseButton,\n  confirmTestId = 'confirm',\n  cancelTestId = 'cancel',\n  TransitionProps,\n  onConfirm,\n  onCancel,\n  onClose,\n  onClosed,\n}: Props) => {\n  const { confirmButtonRef, handleConfirm, handleExited } = useMessageDialog({\n    open,\n    confirmOnEnter,\n    onConfirm,\n    onClose,\n    onClosed,\n    onExited: TransitionProps?.onExited,\n  });\n\n  const dialogTransitionProps = useMemo(() => ({\n    ...TransitionProps,\n    onExited: handleExited,\n  }), [TransitionProps, handleExited]);\n\n  const isConfirmVisible = showConfirm ?? Boolean(onConfirm || onClose);\n  const isCancelVisible = (showCancel ?? Boolean(onCancel)) && Boolean(buttonCancelLabel);\n\n  return (\n    <Dialog\n      open={open}\n      onClose={onClose}\n      width={width}\n      size={size}\n      scroll=\"body\"\n      TransitionProps={dialogTransitionProps}\n    >\n      <DialogTitle\n        size={size}\n        onClose={showCloseButton ? onClose : undefined}\n      >\n        {title}\n      </DialogTitle>\n      <DialogContent size={size}>\n        {children ?? <Typography variant=\"body14\">{text}</Typography>}\n      </DialogContent>\n      <DialogActions size={size}>\n        {isCancelVisible && (\n          <ButtonAsync\n            size=\"s\"\n            variant=\"secondary\"\n            onClick={onCancel}\n            data-testid={cancelTestId}\n          >\n            {buttonCancelLabel}\n          </ButtonAsync>\n        )}\n        {isConfirmVisible && (\n          <ButtonAsync\n            ref={confirmButtonRef}\n            size=\"s\"\n            variant=\"primary\"\n            disabled={disabled}\n            onClick={handleConfirm}\n            data-testid={confirmTestId}\n          >\n            {buttonConfirmLabel}\n          </ButtonAsync>\n        )}\n      </DialogActions>\n    </Dialog>\n  );\n};\n\nexport default memo(MessageDialog);\n"],"names":["MessageDialog","open","title","text","children","buttonConfirmLabel","buttonCancelLabel","size","width","undefined","showConfirm","showCancel","disabled","confirmOnEnter","showCloseButton","confirmTestId","cancelTestId","TransitionProps","onConfirm","onCancel","onClose","onClosed","confirmButtonRef","handleConfirm","handleExited","useMessageDialog","dialogTransitionProps","useMemo","isConfirmVisible","Boolean","isCancelVisible","Dialog","DialogTitle","DialogContent","Typography","DialogActions","ButtonAsync","memo"],"mappings":";;;;;;;;;;;AAuBA,MAAMA,gBAAgB,CAAC,EACrBC,IAAI,EACJC,KAAK,EACLC,IAAI,EACJC,QAAQ,EACRC,kBAAkB,EAClBC,iBAAiB,EACjBC,IAAI,EACJC,QAAQD,OAAOE,SAAY,GAAG,EAC9BC,WAAW,EACXC,UAAU,EACVC,QAAQ,EACRC,cAAc,EACdC,eAAe,EACfC,gBAAgB,SAAS,EACzBC,eAAe,QAAQ,EACvBC,eAAe,EACfC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACF;IACN,MAAM,EAAEC,gBAAgB,EAAEC,aAAa,EAAEC,YAAY,EAAE,GAAGC,iBAAiB;QACzExB;QACAY;QACAK;QACAE;QACAC;QACA,UAAUJ,QAAAA,kBAAAA,KAAAA,IAAAA,gBAAiB,QAAQ;IACrC;IAEA,MAAMS,wBAAwBC,QAAQ,IAAO,6BACxCV,kBAAAA;YACH,UAAUO;YACR;QAACP;QAAiBO;KAAa;IAEnC,MAAMI,mBAAmBlB,QAAAA,cAAAA,cAAemB,QAAQX,aAAaE;IAC7D,MAAMU,kBAAkB,AAACnB,CAAAA,QAAAA,aAAAA,aAAckB,QAAQV,SAAQ,KAAMU,QAAQvB;IAErE,OAAO,WAAP,GACE,KAACyB,QAAMA;QACL,MAAM9B;QACN,SAASmB;QACT,OAAOZ;QACP,MAAMD;QACN,QAAO;QACP,iBAAiBmB;;0BAEjB,IAACM,aAAWA;gBACV,MAAMzB;gBACN,SAASO,kBAAkBM,UAAUX;0BAEpCP;;0BAEH,IAAC+B,eAAaA;gBAAC,MAAM1B;0BAClBH,QAAAA,WAAAA,WAAAA,WAAAA,GAAY,IAAC8B,YAAUA;oBAAC,SAAQ;8BAAU/B;;;0BAE7C,KAACgC,eAAaA;gBAAC,MAAM5B;;oBAClBuB,mBAAmB,WAAnBA,GACC,IAACM,aAAWA;wBACV,MAAK;wBACL,SAAQ;wBACR,SAASjB;wBACT,eAAaH;kCAEZV;;oBAGJsB,oBAAoB,WAApBA,GACC,IAACQ,aAAWA;wBACV,KAAKd;wBACL,MAAK;wBACL,SAAQ;wBACR,UAAUV;wBACV,SAASW;wBACT,eAAaR;kCAEZV;;;;;;AAMb;AAEA,kDAAegC,KAAKrC"}

package/dist/MessageDialog/MessageDialog.styles.css

@@ -0,0 +1 @@
+.ui_components_m3zu90d{white-space:pre-line;}

package/dist/MessageDialog/MessageDialog.styles.d.ts

@@ -0,0 +1,4 @@
+export declare const DialogContent: {
+    __wyw_meta: unknown;
+} & import("react").NamedExoticComponent<import("../DialogContent/DialogContent.js").Props & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=MessageDialog.styles.d.ts.map

package/dist/MessageDialog/MessageDialog.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageDialog.styles.d.ts","sourceRoot":"","sources":["../../src/MessageDialog/MessageDialog.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa;;2IAEzB,CAAC"}

package/dist/MessageDialog/MessageDialog.styles.js

@@ -0,0 +1,12 @@
+import { styled } from "@linaria/react";
+import DialogContent from "../DialogContent/index.js";
+const _exp = () => (DialogContent);
+const MessageDialog_styles_DialogContent = /*#__PURE__*/styled(_exp())({
+  name: "MessageDialog_styles_DialogContent",
+  class: "ui_components_m3zu90d",
+  propsAsIs: true
+});
+export { MessageDialog_styles_DialogContent as DialogContent };
+//# sourceMappingURL=MessageDialog.styles.js.map
+
+import "./MessageDialog.styles.css";

package/dist/MessageDialog/MessageDialog.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageDialog/MessageDialog.styles.js","sources":["../../src/MessageDialog/MessageDialog.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\nimport DialogContentKit from '../DialogContent/index.js';\n\nexport const DialogContent = styled(DialogContentKit)`\n  white-space: pre-line;\n`;\n"],"names":["DialogContent","styled","DialogContentKit"],"mappings":";;AAGO,MAAMA,qCAAgBC,OAAOC,cAAiB,CAAC;;AAEtD,CAAC"}

package/dist/MessageDialog/index.d.ts

@@ -0,0 +1,4 @@
+export { default, type Props as MessageDialogProps, } from './MessageDialog.js';
+export { default as useMessageDialog, type Options as UseMessageDialogOptions, } from './useMessageDialog.js';
+export type { BaseProps as MessageDialogBaseProps } from './types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/MessageDialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/MessageDialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,EACP,KAAK,KAAK,IAAI,kBAAkB,GACjC,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,OAAO,IAAI,gBAAgB,EAC3B,KAAK,OAAO,IAAI,uBAAuB,GACxC,MAAM,uBAAuB,CAAC;AAC/B,YAAY,EAAE,SAAS,IAAI,sBAAsB,EAAE,MAAM,YAAY,CAAC"}

package/dist/MessageDialog/index.js

@@ -0,0 +1,2 @@
+export { default } from "./MessageDialog.js";
+export { default as useMessageDialog } from "./useMessageDialog.js";

package/dist/MessageDialog/types.d.ts

@@ -0,0 +1,38 @@
+import type { MouseEvent } from 'react';
+/** Пропсы, общие для десктопного и мобильного `MessageDialog` */
+export interface BaseProps {
+    /** Флаг отображения диалога */
+    open: boolean;
+    /** Заголовок */
+    title?: string;
+    /** Текст сообщения */
+    text?: string;
+    /** Подпись кнопки подтверждения */
+    buttonConfirmLabel: string;
+    /** Подпись кнопки отмены. Без неё кнопка отмены не отображается */
+    buttonCancelLabel?: string;
+    /**
+     * Показывать кнопку подтверждения. По умолчанию показывается,
+     * если задан `onConfirm` или `onClose`
+     */
+    showConfirm?: boolean;
+    /** Показывать кнопку отмены. По умолчанию показывается, если задан `onCancel` */
+    showCancel?: boolean;
+    /** Блокирует кнопку подтверждения */
+    disabled?: boolean;
+    /** Подтверждение по нажатию Enter */
+    confirmOnEnter?: boolean;
+    /** `data-testid` кнопки подтверждения */
+    confirmTestId?: string;
+    /** `data-testid` кнопки отмены */
+    cancelTestId?: string;
+    /** Обработчик подтверждения. Если не задан, по кнопке подтверждения вызывается `onClose` */
+    onConfirm?(event: MouseEvent<HTMLElement>): void | Promise<void>;
+    /** Обработчик отмены. Управляет отображением кнопки отмены */
+    onCancel?(event: MouseEvent<HTMLElement>): void | Promise<void>;
+    /** Обработчик закрытия диалога */
+    onClose?(): void;
+    /** Вызывается после завершения анимации закрытия */
+    onClosed?(): void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/MessageDialog/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/MessageDialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAExC,iEAAiE;AACjE,MAAM,WAAW,SAAS;IACxB,+BAA+B;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,gBAAgB;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sBAAsB;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,kBAAkB,EAAE,MAAM,CAAC;IAC3B,mEAAmE;IACnE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iFAAiF;IACjF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qCAAqC;IACrC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,yCAAyC;IACzC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kCAAkC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4FAA4F;IAC5F,SAAS,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACjE,8DAA8D;IAC9D,QAAQ,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAChE,kCAAkC;IAClC,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,oDAAoD;IACpD,QAAQ,CAAC,IAAI,IAAI,CAAC;CACnB"}

package/dist/MessageDialog/useMessageDialog.d.ts

@@ -0,0 +1,18 @@
+import { type MouseEvent } from 'react';
+export interface Options {
+    /** Флаг отображения диалога */
+    open: boolean;
+    /** Подтверждение по нажатию Enter */
+    confirmOnEnter?: boolean;
+    onConfirm?(event: MouseEvent<HTMLElement>): void | Promise<void>;
+    onClose?(): void;
+    onClosed?(): void;
+    onExited?(): void;
+}
+declare const useMessageDialog: ({ open, confirmOnEnter, onConfirm, onClose, onClosed, onExited, }: Options) => {
+    confirmButtonRef: import("react").RefObject<HTMLButtonElement | null>;
+    handleConfirm: (event: MouseEvent<HTMLElement>) => Promise<void>;
+    handleExited: () => void;
+};
+export default useMessageDialog;
+//# sourceMappingURL=useMessageDialog.d.ts.map

package/dist/MessageDialog/useMessageDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMessageDialog.d.ts","sourceRoot":"","sources":["../../src/MessageDialog/useMessageDialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,UAAU,EAAE,MAAM,OAAO,CAAC;AAGxE,MAAM,WAAW,OAAO;IACtB,+BAA+B;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,qCAAqC;IACrC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACjE,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,QAAQ,CAAC,IAAI,IAAI,CAAC;IAClB,QAAQ,CAAC,IAAI,IAAI,CAAC;CACnB;AAED,QAAA,MAAM,gBAAgB,GAAI,mEAOvB,OAAO;;2BA4BwC,UAAU,CAAC,WAAW,CAAC;;CAsBxE,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/MessageDialog/useMessageDialog.js

@@ -0,0 +1,51 @@
+import { _ } from "@swc/helpers/_/_async_to_generator";
+import { useCallback, useEffect, useRef } from "react";
+import { KeyboardEventKey } from "../types.js";
+const useMessageDialog = ({ open, confirmOnEnter = true, onConfirm, onClose, onClosed, onExited })=>{
+    const confirmButtonRef = useRef(null);
+    const loadingRef = useRef(false);
+    useEffect(()=>{
+        if (!open || !confirmOnEnter) return;
+        const handleKeyDown = (event)=>{
+            var _confirmButtonRef_current;
+            if (event.key !== KeyboardEventKey.ENTER || event.defaultPrevented || loadingRef.current) return;
+            null == (_confirmButtonRef_current = confirmButtonRef.current) || _confirmButtonRef_current.click();
+        };
+        document.addEventListener('keydown', handleKeyDown);
+        return ()=>{
+            document.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [
+        open,
+        confirmOnEnter
+    ]);
+    const handleConfirm = useCallback((event)=>_(function*() {
+            const handler = onConfirm || onClose;
+            if (!handler) return;
+            loadingRef.current = true;
+            try {
+                yield handler(event);
+            } finally{
+                loadingRef.current = false;
+            }
+        })(), [
+        onConfirm,
+        onClose
+    ]);
+    const handleExited = useCallback(()=>{
+        null == onExited || onExited();
+        null == onClosed || onClosed();
+    }, [
+        onExited,
+        onClosed
+    ]);
+    return {
+        confirmButtonRef,
+        handleConfirm,
+        handleExited
+    };
+};
+const MessageDialog_useMessageDialog = useMessageDialog;
+export default MessageDialog_useMessageDialog;
+
+//# sourceMappingURL=useMessageDialog.js.map

package/dist/MessageDialog/useMessageDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageDialog/useMessageDialog.js","sources":["../../src/MessageDialog/useMessageDialog.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, type MouseEvent } from 'react';\nimport { KeyboardEventKey } from '../types.js';\n\nexport interface Options {\n  /** Флаг отображения диалога */\n  open: boolean;\n  /** Подтверждение по нажатию Enter */\n  confirmOnEnter?: boolean;\n  onConfirm?(event: MouseEvent<HTMLElement>): void | Promise<void>;\n  onClose?(): void;\n  onClosed?(): void;\n  onExited?(): void;\n}\n\nconst useMessageDialog = ({\n  open,\n  confirmOnEnter = true,\n  onConfirm,\n  onClose,\n  onClosed,\n  onExited,\n}: Options) => {\n  const confirmButtonRef = useRef<HTMLButtonElement | null>(null);\n  const loadingRef = useRef(false);\n\n  useEffect(() => {\n    if (!open || !confirmOnEnter) {\n      return undefined;\n    }\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (\n        event.key !== KeyboardEventKey.ENTER ||\n        event.defaultPrevented ||\n        loadingRef.current\n      ) {\n        return;\n      }\n\n      confirmButtonRef.current?.click();\n    };\n\n    document.addEventListener('keydown', handleKeyDown);\n\n    return () => {\n      document.removeEventListener('keydown', handleKeyDown);\n    };\n  }, [open, confirmOnEnter]);\n\n  const handleConfirm = useCallback(async (event: MouseEvent<HTMLElement>) => {\n    const handler = onConfirm || onClose;\n\n    if (!handler) {\n      return;\n    }\n\n    loadingRef.current = true;\n\n    try {\n      await handler(event);\n    } finally {\n      loadingRef.current = false;\n    }\n  }, [onConfirm, onClose]);\n\n  const handleExited = useCallback(() => {\n    onExited?.();\n    onClosed?.();\n  }, [onExited, onClosed]);\n\n  return { confirmButtonRef, handleConfirm, handleExited };\n};\n\nexport default useMessageDialog;\n"],"names":["useMessageDialog","open","confirmOnEnter","onConfirm","onClose","onClosed","onExited","confirmButtonRef","useRef","loadingRef","useEffect","handleKeyDown","event","_confirmButtonRef_current","KeyboardEventKey","document","handleConfirm","useCallback","handler","handleExited"],"mappings":";;;AAcA,MAAMA,mBAAmB,CAAC,EACxBC,IAAI,EACJC,iBAAiB,IAAI,EACrBC,SAAS,EACTC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACA;IACR,MAAMC,mBAAmBC,OAAiC;IAC1D,MAAMC,aAAaD,OAAO;IAE1BE,UAAU;QACR,IAAI,CAACT,QAAQ,CAACC,gBACZ;QAGF,MAAMS,gBAAgB,CAACC;gBASrBC;YARA,IACED,MAAM,GAAG,KAAKE,iBAAiB,KAAK,IACpCF,MAAM,gBAAgB,IACtBH,WAAW,OAAO,EAElB;oBAGFI,CAAAA,4BAAAA,iBAAiB,OAAO,AAAD,KAAvBA,0BAA0B,KAAK;QACjC;QAEAE,SAAS,gBAAgB,CAAC,WAAWJ;QAErC,OAAO;YACLI,SAAS,mBAAmB,CAAC,WAAWJ;QAC1C;IACF,GAAG;QAACV;QAAMC;KAAe;IAEzB,MAAMc,gBAAgBC,YAAY,CAAOL,QAAAA,EAAAA;YACvC,MAAMM,UAAUf,aAAaC;YAE7B,IAAI,CAACc,SACH;YAGFT,WAAW,OAAO,GAAG;YAErB,IAAI;gBACF,MAAMS,QAAQN;YAChB,SAAU;gBACRH,WAAW,OAAO,GAAG;YACvB;QACF,MAAG;QAACN;QAAWC;KAAQ;IAEvB,MAAMe,eAAeF,YAAY;QAC/BX,QAAAA,YAAAA;QACAD,QAAAA,YAAAA;IACF,GAAG;QAACC;QAAUD;KAAS;IAEvB,OAAO;QAAEE;QAAkBS;QAAeG;IAAa;AACzD;AAEA,uCAAenB"}

package/dist/Modal/Backdrop.js

@@ -1,33 +1,47 @@
-import { __rest } from "tslib";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useRef, forwardRef, memo } from 'react';
-import classnames from 'clsx';
-import { CSSTransition } from 'react-transition-group';
-import { styled } from '@linaria/react';
-import { transitionFadeParent, transitionFade } from '@finam/web-ui-kit-core/styles/transition';
-import { useForkRef } from '../utils/withForwardedRef.js';
+import { _ } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props__ } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties__ } from "@swc/helpers/_/_object_without_properties";
+import { jsx } from "react/jsx-runtime";
+import { forwardRef, memo, useRef } from "react";
+import clsx from "clsx";
+import { CSSTransition } from "react-transition-group";
+import { styled } from "@linaria/react";
+import { transitionFade, transitionFadeParent } from "@finam/web-ui-kit-core/styles/transition";
+import { useForkRef } from "../utils/withForwardedRef.js";
 const Root = /*#__PURE__*/styled('div')({
   name: "Root",
   class: "ui_components_r1t029fx",
   propsAsIs: false
 });
-const Backdrop = forwardRef((_a, ref) => {
-    var { open, TransitionProps, invisible, className } = _a, otherProps = __rest(_a, ["open", "TransitionProps", "invisible", "className"]);
-    const rootClassName = classnames(transitionFade(), className, {
+const Backdrop = /*#__PURE__*/ forwardRef((_0, _1)=>{
+    let _ref = [
+        _0,
+        _1
+    ], [_ref1, ..._rest] = _ref, { open, TransitionProps, invisible, className } = _ref1, otherProps = _object_without_properties__(_ref1, [
+        "open",
+        "TransitionProps",
+        "invisible",
+        "className"
+    ]), [ref] = _rest;
+    const rootClassName = clsx(transitionFade(), className, {
       transparent: invisible
     });
     const nodeRef = useRef(null);
     const handleRef = useForkRef(ref, nodeRef);
-    return (_jsx(CSSTransition, Object.assign({
+    return /*#__PURE__*/ jsx(CSSTransition, _object_spread_props__(_({
       in: open,
       classNames: transitionFadeParent,
       timeout: 300
-    }, TransitionProps, {
+    }, TransitionProps), {
       nodeRef: nodeRef,
-      children: _jsx(Root, Object.assign({}, otherProps, { className: rootClassName, ref: handleRef }))
-    })));
+      children: jsx(Root, _object_spread_props__(_({}, otherProps), {
+            className: rootClassName,
+            ref: handleRef
+        }))
+    }));
 });
-export default memo(Backdrop);
+const Modal_Backdrop = /*#__PURE__*/ memo(Backdrop);
+export default Modal_Backdrop;
 //# sourceMappingURL=Backdrop.js.map
 
 import "./Backdrop.css";

package/dist/Modal/Backdrop.js.map

@@ -1 +1 @@
-{"version":3,"file":"Backdrop.js","sourceRoot":"","sources":["../../src/Modal/Backdrop.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAA4B,MAAM,OAAO,CAAC;AAC3E,OAAO,UAAU,MAAM,MAAM,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,uCAAuC,CAAC;AAC/D,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAEhG,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAE1D,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;sBAOD,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,OAAO;;;;;;;CAO7D,CAAC;AASF,MAAM,QAAQ,GAAG,UAAU,CAAwB,CAAC,EAMnD,EAAE,GAAG,EAAE,EAAE;QAN0C,EAClD,IAAI,EACJ,eAAe,EACf,SAAS,EACT,SAAS,OAEV,EADI,UAAU,cALqC,qDAMnD,CADc;IAEb,MAAM,aAAa,GAAG,UAAU,CAAC,cAAc,EAAE,EAAE,SAAS,EAAE;QAC5D,WAAW,EAAE,SAAS;KACvB,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE7C,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;IAE3C,OAAO,CACL,KAAC,aAAa,kBACZ,EAAE,EAAE,IAAI,EACR,UAAU,EAAE,oBAAoB,EAChC,OAAO,EAAE,GAAG,IACR,eAAe,IACnB,OAAO,EAAE,OAAO,YAEhB,KAAC,IAAI,oBACC,UAAU,IACd,SAAS,EAAE,aAAa,EACxB,GAAG,EAAE,SAAS,IACd,IACY,CACjB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,IAAI,CAAC,QAAQ,CAAC,CAAC"}
+{"version":3,"file":"Modal/Backdrop.js","sources":["../../src/Modal/Backdrop.tsx"],"sourcesContent":["import { useRef, forwardRef, memo, ComponentPropsWithoutRef } from 'react';\nimport classnames from 'clsx';\nimport { CSSTransition } from 'react-transition-group';\nimport { styled } from '@linaria/react';\nimport { tokens } from '@finam/web-ui-kit-core/theme/contract';\nimport { transitionFadeParent, transitionFade } from '@finam/web-ui-kit-core/styles/transition';\nimport type { CSSTransitionProps } from '../types.js';\nimport { useForkRef } from '../utils/withForwardedRef.js';\n\nconst Root = styled.div`\n  position: fixed;\n  z-index: -1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  background-color: ${tokens.colors.bg.overlay.default.default};\n  -webkit-tap-highlight-color: transparent;\n  touch-action: none;\n\n  &.transparent {\n    background-color: transparent;\n  }\n`;\n\nexport interface Props extends ComponentPropsWithoutRef<typeof Root> {\n  open: boolean;\n  invisible?: boolean;\n  className?: string;\n  TransitionProps?: Partial<CSSTransitionProps<HTMLElement>>;\n}\n\nconst Backdrop = forwardRef<HTMLDivElement, Props>(({\n  open,\n  TransitionProps,\n  invisible,\n  className,\n  ...otherProps\n}, ref) => {\n  const rootClassName = classnames(transitionFade(), className, {\n    transparent: invisible,\n  });\n\n  const nodeRef = useRef<HTMLDivElement>(null);\n\n  const handleRef = useForkRef(ref, nodeRef);\n\n  return (\n    <CSSTransition\n      in={open}\n      classNames={transitionFadeParent}\n      timeout={300}\n      {...TransitionProps}\n      nodeRef={nodeRef}\n    >\n      <Root\n        {...otherProps}\n        className={rootClassName}\n        ref={handleRef}\n      />\n    </CSSTransition>\n  );\n});\n\nexport default memo(Backdrop);\n"],"names":["Root","styled","tokens","Backdrop","forwardRef","open","TransitionProps","invisible","className","otherProps","ref","rootClassName","classnames","transitionFade","nodeRef","useRef","handleRef","useForkRef","CSSTransition","transitionFadeParent","memo"],"mappings":";;;;;;;;;;;AASA,MAAMA,OAAOC,OAAO,GAAG,CAAC;;;;;;;oBAOJ,EAAEC,OAAO,MAAM,CAAC,EAAE,CAAC,OAAO,CAAxBA,UAAAA,CAAAA,UAAwC,CAAC;;;;;;;AAO/D,CAAC;AASD,MAAMC,WAAW,WAAHA,GAAGC,WAAkC,CAAC,IAAD;;;;iCAAC,EAClDC,IAAI,EACJC,eAAe,EACfC,SAAS,EACTC,SAAS,EAEV,UADIC,aAAAA,6BAAAA,OAAAA;;;;;SACFC,IAAAA,GAAAA;IACD,MAAMC,gBAAgBC,KAAWC,kBAAkBL,WAAW;QAC5D,aAAaD;IACf;IAEA,MAAMO,UAAUC,OAAuB;IAEvC,MAAMC,YAAYC,WAAWP,KAAKI;IAElC,OAAO,WAAP,GACE,IAACI,eAAaA,uBAAAA,EAAAA;QACZ,IAAIb;QACJ,YAAYc;QACZ,SAAS;OACLb,kBAAAA;QACJ,SAASQ;kBAET,kBAACd,MAAAA,uBAAAA,EAAAA,CAAAA,GACKS,aAAAA;YACJ,WAAWE;YACX,KAAKK;;;AAIb;AAEA,qCAAeI,KAAKjB"}

package/dist/Modal/Modal.js

@@ -1,118 +1,176 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef, useState, forwardRef, memo } from 'react';
-import classnames from 'clsx';
-import { CSSTransition } from 'react-transition-group';
-import { setRef } from '../utils/withForwardedRef.js';
-import { KeyboardEventKey } from '../types.js';
-import useModal from './useModal.js';
-import ModalManager from './ModalManager.js';
-import Portal from './Portal.js';
-import Backdrop from './Backdrop.js';
-import { Root } from './Modal.styles.js';
-export const defaultModalManager = new ModalManager();
-const Modal = forwardRef((_a, ref) => {
-    var { open: openProp, id, children, container, disablePortal = false, onRendered, BackdropComponent = Backdrop, disableBackdropClick = false, disableCloseOnEscape = false, onEscapeKeyDown, onBackdropClick, hideBackdrop = false, BackdropProps: backdropProps, onClose, keepMounted = false, manager = defaultModalManager, TransitionProps, ContainerComponent, onKeyDown, className, absolute, closeGlobal } = _a, otherProps = __rest(_a, ["open", "id", "children", "container", "disablePortal", "onRendered", "BackdropComponent", "disableBackdropClick", "disableCloseOnEscape", "onEscapeKeyDown", "onBackdropClick", "hideBackdrop", "BackdropProps", "onClose", "keepMounted", "manager", "TransitionProps", "ContainerComponent", "onKeyDown", "className", "absolute", "closeGlobal"]);
-    const { open, className: classNameGlobal, } = useModal({ id, open: openProp, closeGlobal, onClose });
-    const transitionDuration = TransitionProps === null || TransitionProps === void 0 ? void 0 : TransitionProps.timeout;
+import { _ } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props__ } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties__ } from "@swc/helpers/_/_object_without_properties";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, memo, useCallback, useEffect, useRef, useState } from "react";
+import clsx from "clsx";
+import { CSSTransition } from "react-transition-group";
+import { setRef } from "../utils/withForwardedRef.js";
+import { KeyboardEventKey } from "../types.js";
+import useModal from "./useModal.js";
+import ModalManager from "./ModalManager.js";
+import Portal from "./Portal.js";
+import Backdrop from "./Backdrop.js";
+import { Root } from "./Modal.styles.js";
+const defaultModalManager = new ModalManager();
+const Modal = /*#__PURE__*/ forwardRef((_0, _1)=>{
+    let _ref = [
+        _0,
+        _1
+    ], [_ref1, ..._rest] = _ref, { open: openProp, id, children, container, disablePortal = false, onRendered, BackdropComponent = Backdrop, disableBackdropClick = false, disableCloseOnEscape = false, onEscapeKeyDown, onBackdropClick, hideBackdrop = false, BackdropProps: backdropProps, onClose, keepMounted = false, manager = defaultModalManager, TransitionProps, ContainerComponent, onKeyDown, className, absolute, closeGlobal } = _ref1, otherProps = _object_without_properties__(_ref1, [
+        "open",
+        "id",
+        "children",
+        "container",
+        "disablePortal",
+        "onRendered",
+        "BackdropComponent",
+        "disableBackdropClick",
+        "disableCloseOnEscape",
+        "onEscapeKeyDown",
+        "onBackdropClick",
+        "hideBackdrop",
+        "BackdropProps",
+        "onClose",
+        "keepMounted",
+        "manager",
+        "TransitionProps",
+        "ContainerComponent",
+        "onKeyDown",
+        "className",
+        "absolute",
+        "closeGlobal"
+    ]), [ref] = _rest;
+    const { open, className: classNameGlobal } = useModal({
+        id,
+        open: openProp,
+        closeGlobal,
+        onClose
+    });
+    const transitionDuration = null == TransitionProps ? void 0 : TransitionProps.timeout;
     const [exited, setExited] = useState(transitionDuration ? !open : true);
-    if (!exited && !transitionDuration) {
-        setExited(true);
-    }
-    if (exited && transitionDuration && open) {
-        setExited(false);
-    }
+    if (!exited && !transitionDuration) setExited(true);
+    if (exited && transitionDuration && open) setExited(false);
     const modalRef = useRef(null);
-    const isModalOnTop = useCallback(() => (modalRef.current && (manager === null || manager === void 0 ? void 0 : manager.isTop(modalRef.current))), [manager]);
-    const handleKeyDown = useCallback((event) => {
-        if (event.key !== KeyboardEventKey.ESCAPE && event.key !== KeyboardEventKey.ESC ||
-            event.defaultPrevented ||
-            !isModalOnTop()) {
-            return;
-        }
+    const isModalOnTop = useCallback(()=>modalRef.current && (null == manager ? void 0 : manager.isTop(modalRef.current)), [
+        manager
+    ]);
+    const handleKeyDown = useCallback((event)=>{
+        if (event.key !== KeyboardEventKey.ESCAPE && event.key !== KeyboardEventKey.ESC || event.defaultPrevented || !isModalOnTop()) return;
         event.stopPropagation();
-        if (onEscapeKeyDown) {
-            onEscapeKeyDown(event);
-        }
-        if (!disableCloseOnEscape && onClose) {
-            onClose();
-        }
-    }, [isModalOnTop, onEscapeKeyDown, disableCloseOnEscape, onClose]);
-    useEffect(() => {
+        if (onEscapeKeyDown) onEscapeKeyDown(event);
+        if (!disableCloseOnEscape && onClose) onClose();
+    }, [
+        isModalOnTop,
+        onEscapeKeyDown,
+        disableCloseOnEscape,
+        onClose
+    ]);
+    useEffect(()=>{
         if (open) {
             if (modalRef.current) {
                 modalRef.current.scrollTop = 0;
-                manager === null || manager === void 0 ? void 0 : manager.add(modalRef.current);
+                null == manager || manager.add(modalRef.current);
             }
-            return () => {
-                if (modalRef.current) {
-                    manager === null || manager === void 0 ? void 0 : manager.remove(modalRef.current);
-                }
+            return ()=>{
+                if (modalRef.current) null == manager || manager.remove(modalRef.current);
             };
         }
-        return undefined;
-    }, [open, manager]);
-    useEffect(() => {
+    }, [
+        open,
+        manager
+    ]);
+    useEffect(()=>{
         if (open) {
             document.addEventListener('keydown', handleKeyDown);
-            return () => {
+            return ()=>{
                 document.removeEventListener('keydown', handleKeyDown);
             };
         }
-        return undefined;
-    }, [open, handleKeyDown]);
-    const handleRef = useCallback((node) => {
-        if (node && !modalRef.current && open) {
-            manager === null || manager === void 0 ? void 0 : manager.add(node);
-        }
-        if (!node && modalRef.current) {
-            manager === null || manager === void 0 ? void 0 : manager.remove(modalRef.current);
-        }
+    }, [
+        open,
+        handleKeyDown
+    ]);
+    const handleRef = useCallback((node)=>{
+        if (node && !modalRef.current && open) null == manager || manager.add(node);
+        if (!node && modalRef.current) null == manager || manager.remove(modalRef.current);
         modalRef.current = node;
-        if (ref) {
-            setRef(ref, node);
-        }
-    }, [manager, open, modalRef, ref]);
-    const handleExited = useCallback(() => {
-        var _a;
+        if (ref) setRef(ref, node);
+    }, [
+        manager,
+        open,
+        modalRef,
+        ref
+    ]);
+    const handleExited = useCallback(()=>{
+        var _TransitionProps_onExited;
         setExited(true);
-        (_a = TransitionProps === null || TransitionProps === void 0 ? void 0 : TransitionProps.onExited) === null || _a === void 0 ? void 0 : _a.call(TransitionProps);
-    }, [TransitionProps]);
-    const handleBackdropClick = useCallback((event) => {
-        if (event.target !== event.currentTarget) {
-            return;
-        }
-        onBackdropClick === null || onBackdropClick === void 0 ? void 0 : onBackdropClick(event);
-        if (!disableBackdropClick) {
-            onClose === null || onClose === void 0 ? void 0 : onClose();
-        }
-    }, [onBackdropClick, disableBackdropClick, onClose]);
-    const handleRootKeyDown = useCallback((event) => {
+        null == TransitionProps || null == (_TransitionProps_onExited = TransitionProps.onExited) || _TransitionProps_onExited.call(TransitionProps);
+    }, [
+        TransitionProps
+    ]);
+    const handleBackdropClick = useCallback((event)=>{
+        if (event.target !== event.currentTarget) return;
+        null == onBackdropClick || onBackdropClick(event);
+        if (!disableBackdropClick) null == onClose || onClose();
+    }, [
+        onBackdropClick,
+        disableBackdropClick,
+        onClose
+    ]);
+    const handleRootKeyDown = useCallback((event)=>{
         handleKeyDown(event);
-        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
-    }, [handleKeyDown, onKeyDown]);
+        null == onKeyDown || onKeyDown(event);
+    }, [
+        handleKeyDown,
+        onKeyDown
+    ]);
     const isHidden = !keepMounted && !open && (!transitionDuration || exited);
-    if (isHidden && disablePortal) {
-        return null;
-    }
+    if (isHidden && disablePortal) return null;
     let content = children;
-    if (transitionDuration) {
-        content = (_jsx(CSSTransition, Object.assign({ appear: !keepMounted, in: open }, TransitionProps, { onExited: handleExited, children: content })));
-    }
-    if (ContainerComponent) {
-        content = (_jsx(ContainerComponent, { onClick: BackdropComponent && !hideBackdrop ? handleBackdropClick : undefined, children: content }));
-    }
-    const root = (_jsxs(Root, Object.assign({ role: "presentation", id: id }, otherProps, { className: classnames(classNameGlobal, className, {
+    if (transitionDuration) content = /*#__PURE__*/ jsx(CSSTransition, _object_spread_props__(_({
+        appear: !keepMounted,
+        in: open
+    }, TransitionProps), {
+        onExited: handleExited,
+        children: content
+    }));
+    if (ContainerComponent) content = /*#__PURE__*/ jsx(ContainerComponent, {
+        onClick: BackdropComponent && !hideBackdrop ? handleBackdropClick : void 0,
+        children: content
+    });
+    const root = /*#__PURE__*/ jsxs(Root, _object_spread_props__(_({
+        role: "presentation",
+        id: id
+    }, otherProps), {
+        className: clsx(classNameGlobal, className, {
             hidden: exited && keepMounted,
-            absolute,
-        }), ref: handleRef, onKeyDown: handleRootKeyDown, children: [BackdropComponent && !hideBackdrop && (_jsx(BackdropComponent, Object.assign({ open: open, onClick: handleBackdropClick, TransitionProps: {
+            absolute
+        }),
+        ref: handleRef,
+        onKeyDown: handleRootKeyDown,
+        children: [
+            BackdropComponent && !hideBackdrop && /*#__PURE__*/ jsx(BackdropComponent, _({
+                open: open,
+                onClick: handleBackdropClick,
+                TransitionProps: {
                     timeout: transitionDuration,
-                    appear: !keepMounted,
-                } }, backdropProps))), content] })));
-    if (disablePortal) {
-        return root;
-    }
-    return (_jsx(Portal, { container: container, onRendered: onRendered, show: !isHidden, children: root }));
+                    appear: !keepMounted
+                }
+            }, backdropProps)),
+            content
+        ]
+    }));
+    if (disablePortal) return root;
+    return /*#__PURE__*/ jsx(Portal, {
+        container: container,
+        onRendered: onRendered,
+        show: !isHidden,
+        children: root
+    });
 });
-export default memo(Modal);
+const Modal_Modal = /*#__PURE__*/ memo(Modal);
+export default Modal_Modal;
+export { defaultModalManager };
+
 //# sourceMappingURL=Modal.js.map