tycho-components 0.14.3 → 0.14.4

package/dist/AppModal/AppModal.d.ts

@@ -1,4 +1,4 @@
-import "./style.scss";
+import './style.scss';
 type Props = {
     children: React.ReactNode;
     title: string;
@@ -11,6 +11,7 @@ type Props = {
     hideFooter?: boolean;
     disableCancel?: boolean;
     disableClose?: boolean;
+    disableEscapeClose?: boolean;
     confirmLabel?: string;
     closeLabel?: string;
     onEntered?: () => void;
@@ -22,5 +23,5 @@ type Props = {
     hideBackdrop?: boolean;
     disableBackdropClose?: boolean;
 };
-export default function AppModal({ children, title, subtitle, className, close, confirm, disableConfirm, hideFooter, disableClose, disableCancel, confirmLabel, closeLabel, cancel, onEntered, alternativeButton, hideBackdrop, alternativeOptions, disableBackdropClose, }: Props): import("react/jsx-runtime").JSX.Element;
+export default function AppModal({ children, title, subtitle, className, close, confirm, disableConfirm, hideFooter, disableClose, disableEscapeClose, disableCancel, confirmLabel, closeLabel, cancel, onEntered, alternativeButton, hideBackdrop, alternativeOptions, disableBackdropClose, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/AppModal/AppModal.js

@@ -1,41 +1,42 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Fade, Modal } from "@mui/material";
-import cx from "classnames";
-import { useTranslation } from "react-i18next";
-import { Button, Icon } from "tycho-storybook";
-import "./style.scss";
-import { useEffect } from "react";
-import { attachCloseToEscape, stopEventPropagation } from "./AppModalUtils";
-export default function AppModal({ children, title, subtitle, className, close, confirm, disableConfirm, hideFooter, disableClose, disableCancel, confirmLabel, closeLabel, cancel, onEntered, alternativeButton, hideBackdrop, alternativeOptions, disableBackdropClose, }) {
-    const { t } = useTranslation("common");
-    const getClassNames = cx("modal-container", className);
+import { Box, Fade, Modal } from '@mui/material';
+import cx from 'classnames';
+import { useTranslation } from 'react-i18next';
+import { Button, Icon } from 'tycho-storybook';
+import './style.scss';
+import { useEffect } from 'react';
+import { attachCloseToEscape, stopEventPropagation } from './AppModalUtils';
+export default function AppModal({ children, title, subtitle, className, close, confirm, disableConfirm, hideFooter, disableClose, disableEscapeClose, disableCancel, confirmLabel, closeLabel, cancel, onEntered, alternativeButton, hideBackdrop, alternativeOptions, disableBackdropClose, }) {
+    const { t } = useTranslation('common');
+    const getClassNames = cx('modal-container', className);
     useEffect(() => {
-        if (disableClose)
+        if (disableEscapeClose)
             return;
         return attachCloseToEscape(close);
-    }, [close, disableClose]);
-    return (_jsx(Modal, { open: true, disableEnforceFocus: true, disableAutoFocus: true, disableRestoreFocus: true, hideBackdrop: hideBackdrop, disableEscapeKeyDown: !!disableClose, onClose: (event, reason) => {
+    }, [close, disableEscapeClose]);
+    return (_jsx(Modal, { open: true, disableEnforceFocus: true, disableAutoFocus: true, disableRestoreFocus: true, hideBackdrop: hideBackdrop, disableEscapeKeyDown: !!disableEscapeClose, onClose: (event, reason) => {
             stopEventPropagation(event);
-            if (disableBackdropClose && reason === "backdropClick")
+            if (disableBackdropClose && reason === 'backdropClick')
                 return;
-            if (!disableClose)
-                close();
+            if (disableClose)
+                return;
+            close();
         }, children: _jsx(Fade, { in: true, onEntered: () => onEntered && onEntered(), children: _jsxs(Box, { className: getClassNames, sx: style, children: [_jsxs("div", { className: "header", children: [_jsxs("div", { className: "titles", children: [_jsx("span", { className: "title", children: title }), subtitle && _jsx("span", { className: "subtitle", children: subtitle })] }), !disableClose && (_jsx(Icon, { name: "close", onClick: (e) => {
                                     stopEventPropagation(e);
                                     close();
                                 }, className: "pointer" }))] }), _jsx("div", { className: "body", children: children }), !hideFooter ? (_jsxs("div", { className: "footer", children: [alternativeOptions && alternativeOptions, alternativeButton && (_jsx(Button, { className: "alternative", color: "white", onClick: alternativeButton.action, text: alternativeButton.title })), !disableCancel && (_jsx(Button, { onClick: (e) => {
                                     stopEventPropagation(e);
                                     (cancel || close)();
-                                }, text: closeLabel || t("button.cancel"), color: "danger" })), confirm && (_jsx(Button, { onClick: confirm, disabled: disableConfirm, text: confirmLabel || t("button.confirm") }))] })) : null] }) }) }));
+                                }, text: closeLabel || t('button.cancel'), color: "danger" })), confirm && (_jsx(Button, { onClick: confirm, disabled: disableConfirm, text: confirmLabel || t('button.confirm') }))] })) : null] }) }) }));
 }
 const style = {
-    position: "absolute",
-    top: "40%",
-    left: "50%",
-    transform: "translate(-50%, -50%)",
-    width: "50%",
-    maxWidth: "1080px",
-    borderRadius: "var(--radius-200)",
+    position: 'absolute',
+    top: '40%',
+    left: '50%',
+    transform: 'translate(-50%, -50%)',
+    width: '50%',
+    maxWidth: '1080px',
+    borderRadius: 'var(--radius-200)',
     boxShadow: 24,
-    bgcolor: "var(--background-default)",
+    bgcolor: 'var(--background-default)',
 };

package/dist/AppModal/AppModalConfirm.d.ts

@@ -7,6 +7,7 @@ type Props = {
     closeLabel?: string;
     confirmLabel?: string;
     disableClose?: boolean;
+    disableEscapeClose?: boolean;
 };
-export default function AppModalConfirm({ title, subtitle, onClose, onConfirm, closeLabel, confirmLabel, disableClose, }: Props): import("react/jsx-runtime").JSX.Element;
+export default function AppModalConfirm({ title, subtitle, onClose, onConfirm, closeLabel, confirmLabel, disableClose, disableEscapeClose, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/AppModal/AppModalConfirm.js

@@ -5,17 +5,18 @@ import { useTranslation } from 'react-i18next';
 import { Button, Icon } from 'tycho-storybook';
 import './style.scss';
 import { attachCloseToEscape, stopEventPropagation } from './AppModalUtils';
-export default function AppModalConfirm({ title, subtitle, onClose, onConfirm, closeLabel, confirmLabel, disableClose, }) {
+export default function AppModalConfirm({ title, subtitle, onClose, onConfirm, closeLabel, confirmLabel, disableClose, disableEscapeClose, }) {
     const { t } = useTranslation('common');
     useEffect(() => {
-        if (disableClose)
+        if (disableEscapeClose)
             return;
         return attachCloseToEscape(onClose);
-    }, [onClose, disableClose]);
-    return (_jsx(Modal, { open: true, disableEscapeKeyDown: !!disableClose, onClose: (event) => {
+    }, [onClose, disableEscapeClose]);
+    return (_jsx(Modal, { open: true, disableEscapeKeyDown: !!disableEscapeClose, onClose: (event) => {
             stopEventPropagation(event);
-            if (!disableClose)
-                onClose();
+            if (disableClose)
+                return;
+            onClose();
         }, children: _jsxs(Box, { className: "modal-container modal-confirm", sx: style, children: [_jsxs("div", { className: "body", children: [_jsx(Icon, { name: "warning", size: "large", filled: true }), _jsxs("div", { className: "texts", children: [_jsx("span", { className: "title", children: title }), _jsx("span", { className: "subtitle", children: subtitle })] })] }), _jsxs("div", { className: "footer", children: [_jsx(Button, { onClick: (e) => {
                                 stopEventPropagation(e);
                                 onClose();

package/dist/AppModal/AppModalRemove.d.ts

@@ -5,8 +5,9 @@ type Props = {
     onClose: () => void;
     onConfirm: () => void;
     disableClose?: boolean;
+    disableEscapeClose?: boolean;
 };
-export default function AppModalRemove({ title, subtitle, onClose, onConfirm, disableClose, }: Props): import("react/jsx-runtime").JSX.Element;
+export default function AppModalRemove({ title, subtitle, onClose, onConfirm, disableClose, disableEscapeClose, }: Props): import("react/jsx-runtime").JSX.Element;
 export declare const modalRemoveStyle: {
     position: string;
     top: string;

package/dist/AppModal/AppModalRemove.js

@@ -5,17 +5,18 @@ import { useTranslation } from 'react-i18next';
 import { Button, Icon } from 'tycho-storybook';
 import './style.scss';
 import { attachCloseToEscape, stopEventPropagation } from './AppModalUtils';
-export default function AppModalRemove({ title, subtitle, onClose, onConfirm, disableClose, }) {
+export default function AppModalRemove({ title, subtitle, onClose, onConfirm, disableClose, disableEscapeClose, }) {
     const { t } = useTranslation('common');
     useEffect(() => {
-        if (disableClose)
+        if (disableEscapeClose)
             return;
         return attachCloseToEscape(onClose);
-    }, [onClose, disableClose]);
-    return (_jsx(Modal, { open: true, disableEscapeKeyDown: !!disableClose, onClose: (event) => {
+    }, [onClose, disableEscapeClose]);
+    return (_jsx(Modal, { open: true, disableEscapeKeyDown: !!disableEscapeClose, onClose: (event) => {
             stopEventPropagation(event);
-            if (!disableClose)
-                onClose();
+            if (disableClose)
+                return;
+            onClose();
         }, children: _jsxs(Box, { className: "modal-container modal-remove", sx: modalRemoveStyle, children: [_jsxs("div", { className: "body", children: [_jsx(Icon, { name: "warning", size: "large", filled: true }), _jsxs("div", { className: "texts", children: [_jsx("span", { className: "title", children: title }), _jsx("span", { className: "subtitle", children: subtitle })] })] }), _jsxs("div", { className: "footer", children: [_jsx(Button, { onClick: (e) => {
                                 stopEventPropagation(e);
                                 onClose();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tycho-components",
   "private": false,
-  "version": "0.14.3",
+  "version": "0.14.4",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {