@topconsultnpm/sdkui-react-beta 6.12.87 → 6.12.89

package/lib/components/base/TMPopUp.d.ts

@@ -13,6 +13,7 @@ interface ITMMessageBox extends ITMPopup {
     buttons?: ButtonNames[];
     message?: string | React.ReactNode;
     onButtonClick?: (e: ButtonNames) => void;
+    parentId?: string;
 }
 interface ITMExceptionBox extends ITMPopup {
     exception?: any;
@@ -21,6 +22,6 @@ declare class TMExceptionBoxManager {
     static show({ title, exception }: ITMExceptionBox): void;
 }
 declare class TMMessageBoxManager {
-    static show({ title, buttons, onButtonClick, message }: ITMMessageBox): void;
+    static show({ title, buttons, onButtonClick, message, parentId }: ITMMessageBox): void;
 }
 export { TMExceptionBoxManager, TMMessageBoxManager };

package/lib/components/base/TMPopUp.js

@@ -126,11 +126,22 @@ class TMExceptionBoxManager {
     }
 }
 class TMMessageBoxManager {
-    static show({ title, buttons, onButtonClick, message }) {
+    static show({ title, buttons, onButtonClick, message, parentId }) {
         let container = document.createElement('div');
-        document.body.appendChild(container);
+        if (parentId) {
+            const parent = document.getElementById(parentId);
+            if (parent) {
+                parent.appendChild(container);
+            }
+            else {
+                document.body.appendChild(container);
+            }
+        }
+        else {
+            document.body.appendChild(container);
+        }
         const root = ReactDOM.createRoot(container);
-        root.render(_jsx(TMDeviceProvider, { children: React.createElement(TMMessageBox, { title: title, buttons: buttons, onButtonClick: onButtonClick, message: message }) }));
+        root.render(_jsx(TMDeviceProvider, { children: React.createElement(TMMessageBox, { title, buttons, onButtonClick, message }) }));
     }
 }
 export { TMExceptionBoxManager, TMMessageBoxManager };

package/lib/components/features/documents/TMDcmtForm.js

@@ -9,13 +9,13 @@ import { DownloadTypes, FormModes } from '../../../ts';
 import { DeviceType, useDeviceType } from '../../base/TMDeviceProvider';
 import { useDcmtOperations } from '../../../hooks/useDcmtOperations';
 import { handleArchiveVisibility, searchResultToMetadataValues } from '../../../helper/queryHelper';
-import { genUniqueId, IconCloseCircle, IconShow, SDKUI_Localizator, IconBoard, IconDcmtTypeSys, IconDataList, IconDetailDcmts, svgToString, IconDownload, IconHide, calcIsModified, IconMenuVertical, Globalization, getListMaxItems, getSystemMetadata, IconBoxArchiveIn, IconClear, IconUndo, calcResponsiveSizes } from '../../../helper';
+import { genUniqueId, IconCloseCircle, IconShow, SDKUI_Localizator, IconBoard, IconDcmtTypeSys, IconDataList, IconDetailDcmts, svgToString, IconDownload, IconHide, calcIsModified, IconMenuVertical, Globalization, getListMaxItems, getSystemMetadata, IconBoxArchiveIn, IconClear, IconUndo } from '../../../helper';
 import { hasDetailRelations, hasMasterRelations, isXMLFileExt } from '../../../helper/dcmtsHelper';
 import { TMColors } from '../../../utils/theme';
 import { StyledFormButtonsContainer, StyledModalContainer, StyledToolbarCardContainer } from '../../base/Styled';
 import ShowAlert from '../../base/TMAlert';
 import TMButton from '../../base/TMButton';
-import TMLayoutContainer, { TMSplitterLayout, TMLayoutItem, TMCard } from '../../base/TMLayout';
+import { TMSplitterLayout, TMLayoutItem } from '../../base/TMLayout';
 import { TMExceptionBoxManager, TMMessageBoxManager, ButtonNames } from '../../base/TMPopUp';
 import TMSpinner from '../../base/TMSpinner';
 import TMToolbarCard from '../../base/TMToolbarCard';
@@ -30,7 +30,6 @@ import TMMasterDetailDcmts from './TMMasterDetailDcmts';
 import TMDcmtBlog from './TMDcmtBlog';
 import { useInputAttachmentsDialog } from '../../../hooks/useInputDialog';
 import TMModal from '../../base/TMModal';
-import toppy from '../../../assets/Toppy-generico.png';
 let abortControllerLocal = new AbortController();
 //#endregion
 const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes.Update, onClose, onSavedAsyncCallback, TID, DID, formMode = FormModes.Update, canNext, canPrev, count, itemIndex, onNext, onPrev, customRightSidebarItems = [], allowNavigation = true, allowRelations = true, isClosable = false, showDcmtForm = true, showDcmtFormSidebar = true, showPreview = false, showBoard = false, showSysMetadata = false, onClosePreview, titleModal, isModal = false, widthModal = "100%", heightModal = "100%" }) => {
@@ -72,7 +71,6 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
     const [dcmtFile, setDcmtFile] = useState(null);
     const [focusedMetadataValue, setFocusedMetadataValue] = useState();
     const [showAll, setShowAll] = useState(false);
-    const [showConfirmForClose, setShowConfirmForClose] = useState(false);
     const { openConfirmAttachmentsDialog, ConfirmAttachmentsDialog } = useInputAttachmentsDialog();
     const { abortController, showWaitPanel, waitPanelTitle, showPrimary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, showSecondary, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, downloadDcmtsAsync } = useDcmtOperations();
     const deviceType = useDeviceType();
@@ -287,6 +285,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
     };
     const confirmActionPopup = async () => {
         TMMessageBoxManager.show({
+            parentId: isModal ? "TMDcmtFormShowConfirmForClose-" + id : undefined,
             buttons: [ButtonNames.YES, ButtonNames.NO],
             message: layoutMode === LayoutModes.Update ? SDKUI_Localizator.SaveQuestion : 'Sei sicuro di voler archiviare questo documento?',
             onButtonClick(e) {
@@ -491,7 +490,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
                     _jsx(StyledModalContainer, { style: { backgroundColor: 'white' }, children: _jsx(TMMasterDetailDcmts, { deviceType: deviceType, isForMaster: false, inputDcmts: getSelectionDcmtInfo(), allowNavigation: allowNavigation, canNext: canNext, canPrev: canPrev, onNext: onNext, onPrev: onPrev, onBack: () => setIsOpenDetails(false) }) }), isOpenMaster &&
                     _jsxs(StyledModalContainer, { style: { backgroundColor: 'white' }, children: [_jsx(TMMasterDetailDcmts, { deviceType: deviceType, inputDcmts: getSelectionDcmtInfo(), isForMaster: true, allowNavigation: allowNavigation, canNext: canNext, canPrev: canPrev, onNext: onNext, onPrev: onPrev, onBack: () => setIsOpenMaster(false), appendMasterDcmts: handleAddItem }), secondaryMasterDcmts.length > 0 && secondaryMasterDcmts.map((dcmt, index) => {
                                 return (_jsx(StyledModalContainer, { style: { backgroundColor: 'white' }, children: _jsx(TMMasterDetailDcmts, { deviceType: deviceType, inputDcmts: [dcmt], isForMaster: true, allowNavigation: false, onBack: () => handleRemoveItem(dcmt.TID, dcmt.DID), appendMasterDcmts: handleAddItem }) }, `${index}-${dcmt.DID}`));
-                            })] })] }));
+                            })] }), (isModal && onClose) && _jsx("div", { id: "TMDcmtFormShowConfirmForClose-" + id })] }));
     };
     const handleClose = () => {
         if (!isModified) {
@@ -499,6 +498,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
             return;
         }
         TMMessageBoxManager.show({
+            parentId: isModal ? "TMDcmtFormShowConfirmForClose-" + id : undefined,
             message: SDKUI_Localizator.SaveQuestion, buttons: [ButtonNames.YES, ButtonNames.NO, ButtonNames.CANCEL],
             onButtonClick: async (e) => {
                 try {
@@ -514,31 +514,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
             }
         });
     };
-    const closeModal = () => {
-        if (!isModified) {
-            onClose?.();
-            return;
-        }
-        // If confirmation for closing is not yet required, prompt the user by setting showConfirmForClose to true
-        if (showConfirmForClose === false) {
-            setShowConfirmForClose(true);
-        }
-        else {
-            // If confirmation is already shown, reset it and proceed with closing the modal
-            setShowConfirmForClose(false);
-            onClose?.();
-        }
-    };
-    return (_jsx(_Fragment, { children: (isModal && onClose) ? _jsx(_Fragment, { children: _jsxs(TMModal, { title: titleModal, onClose: closeModal, width: widthModal ?? '100%', height: heightModal ?? '100%', hidePopup: false, children: [_jsx("div", { style: { width: "100%", height: "100%", display: 'block', padding: "4px" }, children: renderDcmtForm() }), showConfirmForClose && _jsx(TMModal, { title: titleModal, onClose: () => { setShowConfirmForClose(false); }, width: calcResponsiveSizes(deviceType, '400px', '300px', '250px'), height: '180px', hidePopup: false, children: _jsxs(TMLayoutContainer, { children: [_jsx(TMLayoutItem, { height: 'calc(100% - 40px)', children: _jsx(TMCard, { showBorder: false, scrollY: true, children: _jsxs(TMLayoutContainer, { direction: 'horizontal', alignItems: 'center', justifyContent: 'center', gap: 10, children: [_jsx(TMLayoutItem, { width: 'fit-content', children: _jsx("img", { style: { transform: 'translateY(8px)' }, src: toppy, width: 60, height: 75, alt: "" }) }), _jsx(TMLayoutItem, { height: 'fit-content', children: _jsxs("div", { children: [" ", SDKUI_Localizator.SaveQuestion, " "] }) })] }) }) }), _jsx(TMLayoutItem, { height: '40px', children: _jsxs("div", { style: { position: "relative", display: "flex", flexDirection: "row", justifyContent: "flex-end", alignItems: "center", gap: "5px", padding: "5px", userSelect: "none", borderTop: "1px solid #f3f3f3", backgroundColor: "#ffffff", zIndex: 100, }, children: [_jsx(TMButton, { caption: SDKUI_Localizator.Yes, fontSize: '1.1rem', color: 'primaryOutline', btnStyle: 'text', onClick: async () => {
-                                                    await onSavedAsync?.();
-                                                    setShowConfirmForClose(false);
-                                                    onClose?.();
-                                                }, showTooltip: false }), _jsx(TMButton, { caption: SDKUI_Localizator.No, fontSize: '1.1rem', btnStyle: 'text', onClick: () => {
-                                                    setShowConfirmForClose(false);
-                                                    onClose?.();
-                                                }, showTooltip: false, color: 'error' }), _jsx(TMButton, { caption: SDKUI_Localizator.Cancel, fontSize: '1.1rem', btnStyle: 'text', onClick: () => {
-                                                    setShowConfirmForClose(false);
-                                                }, showTooltip: false, color: 'error' })] }) })] }) })] }) })
+    return (_jsx(_Fragment, { children: (isModal && onClose) ? _jsx(_Fragment, { children: _jsx(TMModal, { title: titleModal, onClose: handleClose, width: widthModal ?? '100%', height: heightModal ?? '100%', hidePopup: false, children: _jsx("div", { style: { width: "100%", height: "100%", display: 'block', padding: "4px" }, children: renderDcmtForm() }) }) })
             : renderDcmtForm() }));
 };
 export default TMDcmtForm;

package/lib/components/forms/TMSaveForm.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useState } from 'react';
 import { ResultTypes } from '@topconsultnpm/sdk-ts-beta';
 import { FormModes } from '../../ts/types';
-import { IconArrowDown, IconArrowLeft, IconArrowUp, IconCloseCircle, IconHide, IconSave, IconShow, IconUndo, IconWarning, LocalizeFormModes, SDKUI_Localizator, calcResponsiveSizes, getColor } from '../../helper';
+import { IconArrowDown, IconArrowLeft, IconArrowUp, IconCloseCircle, IconHide, IconSave, IconShow, IconUndo, IconWarning, LocalizeFormModes, SDKUI_Localizator, getColor } from '../../helper';
 import { ButtonNames, TMExceptionBoxManager, TMMessageBoxManager } from '../base/TMPopUp';
 import TMLayoutContainer, { TMCard, TMLayoutItem, TMSplitterLayout } from '../base/TMLayout';
 import { StyledResultTypeContainer, StyledToolbarForm } from '../base/Styled';
@@ -11,11 +11,9 @@ import { TMColors } from '../../utils/theme';
 import TMValidationItemsList from '../grids/TMValidationItemsList';
 import TMModal from '../base/TMModal';
 import { DeviceType, useDeviceType } from '../base/TMDeviceProvider';
-import toppy from '../../assets/Toppy-generico.png';
 const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipIsModifiedCheck = false, title, children, isModal, exception, customToolbarElements, hasNavigation, showSaveButton = true, showBackButton, showWarningsCount = true, showErrorCount = true, showUndoButton = true, onClose, onSaveAsync, onNext, onPrev, canNext, canPrev, isModified, onShowList, validationItems = [], onUndo, onCancel, width, height }) => {
     const [showList, setShowList] = useState(true);
     const [showErrorGrid, setShowErrorGrid] = useState(false);
-    const [showConfirmForClose, setShowConfirmForClose] = useState(false);
     const deviceType = useDeviceType();
     const doSaveAsync = async () => { try {
         await onSaveAsync?.();
@@ -29,6 +27,7 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipI
             return;
         }
         TMMessageBoxManager.show({
+            parentId: isModal ? "TMSaveFormShowConfirmForClose-" + id : undefined,
             message: SDKUI_Localizator.SaveQuestion, buttons: [ButtonNames.YES, ButtonNames.NO, ButtonNames.CANCEL],
             onButtonClick: async (e) => {
                 try {
@@ -50,6 +49,7 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipI
             return;
         }
         TMMessageBoxManager.show({
+            parentId: isModal ? "TMSaveFormShowConfirmForClose-" + id : undefined,
             message: SDKUI_Localizator.SaveQuestion, buttons: [ButtonNames.YES, ButtonNames.NO, ButtonNames.CANCEL],
             onButtonClick: async (e) => {
                 try {
@@ -72,6 +72,7 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipI
             return;
         }
         TMMessageBoxManager.show({
+            parentId: isModal ? "TMSaveFormShowConfirmForClose-" + id : undefined,
             message: SDKUI_Localizator.SaveQuestion, buttons: [ButtonNames.YES, ButtonNames.NO, ButtonNames.CANCEL],
             onButtonClick: async (e) => {
                 try {
@@ -89,25 +90,6 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipI
             }
         });
     };
-    const closeModal = () => {
-        // If there are no unsaved modifications or we are skipping the modification check, close the modal immediately
-        if (!isModified || skipIsModifiedCheck) {
-            onClose?.();
-            deviceType === DeviceType.MOBILE && setShowList(true), onShowList?.(true);
-            return;
-        }
-        // If confirmation for closing is not yet required, prompt the user by setting showConfirmForClose to true
-        if (showConfirmForClose === false) {
-            setShowConfirmForClose(true);
-        }
-        else {
-            // If confirmation is already shown, reset it and proceed with closing the modal
-            setShowConfirmForClose(false);
-            onClose?.();
-            deviceType === DeviceType.MOBILE && setShowList(true), onShowList?.(true);
-            return;
-        }
-    };
     const warningsCount = validationItems.filter(o => o.ResultType == ResultTypes.WARNING).length;
     const errorsCount = validationItems.filter(o => o.ResultType == ResultTypes.ERROR).length;
     const renderSaveForm = () => {
@@ -118,19 +100,9 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, showToolbar = true, skipI
                                 _jsx("div", { style: { right: '50px', position: 'absolute' }, children: deviceType !== DeviceType.MOBILE && onCancel && _jsx(TMButton, { icon: _jsx(IconCloseCircle, {}), onClick: onCancel, btnStyle: 'toolbar', caption: SDKUI_Localizator.Cancel, color: 'tertiary' }) })] }) }), _jsx(TMLayoutItem, { height: showToolbar ? 'calc(100% - 35px)' : '100%', children: _jsxs(TMSplitterLayout, { separatorSize: 4, direction: 'vertical', start: showErrorGrid && validationItems.length > 0 ? ['80%', '20%'] : ['100%', '0'], min: ['0', '0'], children: [_jsx(TMCard, { showBorder: false, children: exception
                                     ?
                                         _jsx("div", { style: { width: '100%', height: '100%', marginTop: '50px', display: 'flex', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', color: getColor('error') }, children: 'Si è verificato un errore' })
-                                    : _jsx(_Fragment, { children: children }) }), showErrorGrid && validationItems.length > 0 ? _jsx(TMCard, { scrollY: true, padding: false, showBorder: false, children: _jsx(TMValidationItemsList, { validationItems: validationItems }) }) : _jsx(_Fragment, {})] }) })] }));
+                                    : _jsx(_Fragment, { children: children }) }), showErrorGrid && validationItems.length > 0 ? _jsx(TMCard, { scrollY: true, padding: false, showBorder: false, children: _jsx(TMValidationItemsList, { validationItems: validationItems }) }) : _jsx(_Fragment, {})] }) }), (isModal && onClose) && _jsx("div", { id: "TMSaveFormShowConfirmForClose-" + id })] }));
     };
-    return (_jsx(_Fragment, { children: (isModal && onClose) ? _jsx(_Fragment, { children: _jsxs(TMModal, { title: `${title} - ${LocalizeFormModes(formMode)}`, onClose: closeModal, width: width ?? '100%', height: height ?? '100%', hidePopup: false, children: [_jsx("div", { style: { width: "100%", height: "100%", display: 'block' }, children: renderSaveForm() }), showConfirmForClose && _jsx(TMModal, { title: `${title} - ${LocalizeFormModes(formMode)}`, onClose: () => { setShowConfirmForClose(false); }, width: calcResponsiveSizes(deviceType, '400px', '300px', '250px'), height: '180px', hidePopup: false, children: _jsxs(TMLayoutContainer, { children: [_jsx(TMLayoutItem, { height: 'calc(100% - 40px)', children: _jsx(TMCard, { showBorder: false, scrollY: true, children: _jsxs(TMLayoutContainer, { direction: 'horizontal', alignItems: 'center', justifyContent: 'center', gap: 10, children: [_jsx(TMLayoutItem, { width: 'fit-content', children: _jsx("img", { style: { transform: 'translateY(8px)' }, src: toppy, width: 60, height: 75, alt: "" }) }), _jsx(TMLayoutItem, { height: 'fit-content', children: _jsxs("div", { children: [" ", SDKUI_Localizator.SaveQuestion, " "] }) })] }) }) }), _jsx(TMLayoutItem, { height: '40px', children: _jsxs("div", { style: { position: "relative", display: "flex", flexDirection: "row", justifyContent: "flex-end", alignItems: "center", gap: "5px", padding: "5px", userSelect: "none", borderTop: "1px solid #f3f3f3", backgroundColor: "#ffffff", zIndex: 100, }, children: [_jsx(TMButton, { caption: SDKUI_Localizator.Yes, fontSize: '1.1rem', color: 'primaryOutline', btnStyle: 'text', onClick: async () => {
-                                                    deviceType === DeviceType.MOBILE ? (await onSaveAsync?.(), setShowList(true), onShowList?.(true)) : await onSaveAsync?.();
-                                                    setShowConfirmForClose(false);
-                                                    onClose?.();
-                                                }, showTooltip: false }), _jsx(TMButton, { caption: SDKUI_Localizator.No, fontSize: '1.1rem', btnStyle: 'text', onClick: () => {
-                                                    deviceType === DeviceType.MOBILE && (onUndo(), setShowList(true), onShowList?.(true));
-                                                    setShowConfirmForClose(false);
-                                                    onClose?.();
-                                                }, showTooltip: false, color: 'error' }), _jsx(TMButton, { caption: SDKUI_Localizator.Cancel, fontSize: '1.1rem', btnStyle: 'text', onClick: () => {
-                                                    setShowConfirmForClose(false);
-                                                }, showTooltip: false, color: 'error' })] }) })] }) })] }) })
+    return (_jsx(_Fragment, { children: (isModal && onClose) ? _jsx(_Fragment, { children: _jsx(TMModal, { title: `${title} - ${LocalizeFormModes(formMode)}`, onClose: doClose, width: width ?? '100%', height: height ?? '100%', hidePopup: false, children: _jsx("div", { style: { width: "100%", height: "100%", display: 'block' }, children: renderSaveForm() }) }) })
             : renderSaveForm() }));
 };
 export default TMSaveForm;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@topconsultnpm/sdkui-react-beta",
-  "version": "6.12.87",
+  "version": "6.12.89",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",