tycho-components 0.14.3 → 0.14.5

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

@@ -1,4 +1,4 @@
-import './style.scss';
+import "./style.scss";
 type Props = {
     title: string;
     subtitle: string | React.ReactNode;
@@ -7,6 +7,8 @@ type Props = {
     closeLabel?: string;
     confirmLabel?: string;
     disableClose?: boolean;
+    disableEscapeClose?: boolean;
+    confirmDisabled?: 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, confirmDisabled, disableClose, disableEscapeClose, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/AppModal/AppModalConfirm.js

@@ -1,34 +1,35 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Modal } from '@mui/material';
-import { useEffect } from 'react';
-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, }) {
-    const { t } = useTranslation('common');
+import { Box, Modal } from "@mui/material";
+import { useEffect } from "react";
+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, confirmDisabled, 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();
-                            }, text: closeLabel || t('button.cancel'), mode: "tonal" }), _jsx(Button, { onClick: onConfirm, text: confirmLabel || t('button.confirm') })] })] }) }));
+                            }, text: closeLabel || t("button.cancel"), mode: "tonal" }), _jsx(Button, { onClick: onConfirm, text: confirmLabel || t("button.confirm"), disabled: confirmDisabled })] })] }) }));
 }
 const style = {
-    position: 'absolute',
-    top: '40%',
-    left: '50%',
-    transform: 'translate(-50%, -50%)',
-    width: '30%',
-    maxWidth: '580px',
-    borderRadius: 'var(--radius-200)',
+    position: "absolute",
+    top: "40%",
+    left: "50%",
+    transform: "translate(-50%, -50%)",
+    width: "30%",
+    maxWidth: "580px",
+    borderRadius: "var(--radius-200)",
     boxShadow: 24,
-    bgcolor: 'var(--background-default)',
+    bgcolor: "var(--background-default)",
 };

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/dist/AppPlaceholder/AppPlaceholder.d.ts

@@ -1,10 +1,11 @@
-import './style.scss';
+import "./style.scss";
 type Props = {
     icon?: string;
     text?: string;
     desc?: string;
     children?: React.ReactNode;
+    useMarginTop?: boolean;
     onClick?: () => void;
 };
-export default function AppPlaceholder({ text, desc, children, icon, onClick, }: Props): import("react/jsx-runtime").JSX.Element;
+export default function AppPlaceholder({ text, desc, children, icon, useMarginTop, onClick, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/AppPlaceholder/AppPlaceholder.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon } from 'tycho-storybook';
-import './style.scss';
-export default function AppPlaceholder({ text, desc, children, icon = 'contract_delete', onClick, }) {
-    return (_jsxs("div", { className: "ds-placeholder", onClick: () => onClick && onClick(), onKeyDown: () => onClick && onClick(), children: [_jsx(Icon, { name: icon, weight: "heavy", size: "x-large", filled: true }), text && _jsx("span", { className: "title", children: text }), desc && _jsx("span", { className: "desc", children: desc }), children && children] }));
+import { Icon } from "tycho-storybook";
+import "./style.scss";
+export default function AppPlaceholder({ text, desc, children, icon = "contract_delete", useMarginTop = false, onClick, }) {
+    return (_jsxs("div", { className: `ds-placeholder ${useMarginTop ? "with-margin-top" : ""}`, onClick: () => onClick && onClick(), onKeyDown: () => onClick && onClick(), children: [_jsx(Icon, { name: icon, weight: "heavy", size: "x-large", filled: true }), text && _jsx("span", { className: "title", children: text }), desc && _jsx("span", { className: "desc", children: desc }), children && children] }));
 }

package/dist/AppPlaceholder/style.scss

@@ -3,6 +3,10 @@
   flex-direction: column;
   text-align: center;
 
+  &.use-margin-top {
+    margin-top: 5%;
+  }
+
   > .ds-icon {
     color: var(--icon-on-disabled);
     margin-bottom: 8px;

package/dist/AppTable/types/AppPage.d.ts

@@ -8,6 +8,7 @@ export type AppPage<Type> = {
     executionTime?: number;
     totalHits?: number;
     uid?: string;
+    empty?: boolean;
 };
 export declare const EMPTY_PAGE: {
     content: never[];

package/dist/AppTable/types/AppPage.js

@@ -1,4 +1,4 @@
-import { EMPTY_GRID_PAGEABLE, EMPTY_PAGEABLE } from './AppPageable';
+import { EMPTY_GRID_PAGEABLE, EMPTY_PAGEABLE } from "./AppPageable";
 export const EMPTY_PAGE = {
     content: [],
     totalElements: 0,

package/package.json

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