@topconsultnpm/sdkui-react 6.22.0-t1 → 6.22.0-t3

package/lib/components/features/search/TMSignatureInfoContent.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { SDK_Globals, RetrieveFileOptions, DcmtOpers, GeneralRetrieveFormats } from "@topconsultnpm/sdk-ts";
 import { IconCopy, IconDownload, IconWarning, IconCheck, getExceptionMessage, SDKUI_Localizator, IconCircleInfo, IconRefresh } from "../../../helper";

package/lib/components/features/search/TMTreeSelector.js

@@ -1,5 +1,5 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from 'react';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { DcmtTypeListCacheService, LayoutModes, SDK_Localizator, TreeCacheService, TreeItemTypes } from '@topconsultnpm/sdk-ts';
 import { TreeList, Column, Scrolling, Selection } from 'devextreme-react/tree-list';
 import { DropDownBox } from 'devextreme-react';
@@ -13,89 +13,100 @@ import { TMColors } from '../../../utils/theme';
 import styled from 'styled-components';
 import { useOutsideClick } from '../../../hooks/useOutsideClick';
 import { DeviceType, useDeviceType } from '../../base/TMDeviceProvider';
+const TMTreeDcmtTypeCell = ({ tid, isMobile }) => {
+    const [dtd, setDtd] = useState();
+    const loadDTD = useCallback(async () => {
+        if (isMobile || dtd || !tid)
+            return;
+        setDtd(await DcmtTypeListCacheService.GetAsync(tid));
+    }, [isMobile, dtd, tid]);
+    return (_jsxs(StyledTreeDcmtTypeRow, { onMouseEnter: loadDTD, children: [_jsx("span", { style: { cursor: 'pointer', flex: 1, minWidth: 0 }, children: _jsx(TMTidViewer, { tid: tid, showIcon: false }) }), !isMobile && (_jsx("span", { className: 'info-icon', children: _jsx(TMDcmtTypeTooltip, { dtd: dtd, children: _jsx(IconInfo, { color: TMColors.info }) }) }))] }));
+};
+// La ricerca e l'archiviazione hanno ciascuna il proprio albero predefinito: il contesto lo decide il layoutMode
+const getDefaultTreeId = (layoutMode) => layoutMode == LayoutModes.Update
+    ? SDKUI_Globals.userSettings.searchSettings.defaultTree
+    : SDKUI_Globals.userSettings.archivingSettings.defaultTree;
 const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelectedTIDChanged, onClosePanel, allowMaximize = true, onMaximizePanel }) => {
     const [trees, setTrees] = useState([]);
-    const [treeItems, setTreeItems] = useState([]);
     const [selectedTreeId, setSelectedTreeId] = useState(0);
     const [infoDTD, setInfoDTD] = useState();
     // State to store selected row keys
     const [selectedRowKeys, setSelectedRowKeys] = useState([]);
     // State hook to store the currently focused row key, initially set to undefined
     const [focusedRowKey, setFocusedRowKey] = useState(undefined);
-    const [isGridBoxOpened, setIsGridBoxOpened] = useState(false);
-    const [defaultTreeId, setDefaultTreeId] = useState(-1);
+    // Elemento selezionato nell'albero: dopo un refresh va riproposto se esiste ancora
+    const [selectedTreeItemKey, setSelectedTreeItemKey] = useState(undefined);
+    const selectedTreeItemKeys = useMemo(() => selectedTreeItemKey !== undefined ? [selectedTreeItemKey] : [], [selectedTreeItemKey]);
+    // Finche' gli alberi non sono arrivati il pannello mostra il loader invece della lista vuota
+    const [isLoadingTrees, setIsLoadingTrees] = useState(true);
+    const [defaultTreeId, setDefaultTreeId] = useState(() => getDefaultTreeId(layoutMode));
+    const dropDownBoxRef = useRef(null);
+    const closeDropDown = useCallback(() => { dropDownBoxRef.current?.instance()?.option('opened', false); }, []);
     const deviceType = useDeviceType();
     const isMobile = deviceType === DeviceType.MOBILE;
     const panelRef = useOutsideClick(() => setInfoDTD(undefined));
-    // useEffect(() => {
-    //     if (treeItems.length > 0 && treeItems[0].id) {
-    //         setSelectedRowKeys([treeItems[0].id])
-    //     }
-    // }, [treeItems])
-    useEffect(() => {
-        const setResultCache = (result) => {
-            if (result && result.length > 0) {
-                setTrees(result);
-                let defaultTree = SDKUI_Globals.userSettings.searchSettings.defaultTree;
-                let initialTreeId;
-                let treeToSelect;
-                if (defaultTree > 0) {
-                    initialTreeId = defaultTree;
-                    treeToSelect = result.find(o => o.id == defaultTree);
-                }
-                else {
-                    initialTreeId = result[0]?.id ?? 0;
-                    treeToSelect = result[0];
-                }
-                setSelectedTreeId(initialTreeId);
-                if (treeToSelect?.id) {
-                    setSelectedRowKeys([treeToSelect.id]);
-                }
+    // Tiene traccia dell'albero selezionato senza far dipendere loadTreesAsync da selectedTreeId:
+    // così il refresh può riproporre la selezione corrente senza ricaricare a ogni cambio di albero
+    const selectedTreeIdRef = useRef(selectedTreeId);
+    useEffect(() => { selectedTreeIdRef.current = selectedTreeId; }, [selectedTreeId]);
+    // Carica tutti gli alberi del contesto corrente (ricerca o archiviazione).
+    // Con forceRefresh la cache viene invalidata, altrimenti GetAll* restituirebbe gli alberi già in memoria.
+    const loadTreesAsync = useCallback(async (forceRefresh = false) => {
+        const isSearchContext = layoutMode == LayoutModes.Update;
+        if (forceRefresh) {
+            // Gli alberi arrivano dal server filtrati sui tipi documento della sessione: senza rileggerli
+            // prima (RetrieveAll con refreshCache rigenera anche la cache lato server) un tipo documento
+            // appena creato da Designer non comparirebbe tra gli elementi dell'albero
+            DcmtTypeListCacheService.RemoveAllWithoutMetadata();
+            await DcmtTypeListCacheService.GetAllWithoutMetadataAsync();
+            if (isSearchContext)
+                TreeCacheService.RemoveAllSearch();
+            else
+                TreeCacheService.RemoveAllArchive();
+        }
+        const result = isSearchContext
+            ? await TreeCacheService.GetAllSearchAsync()
+            : await TreeCacheService.GetAllArchiveAsync();
+        if (!result || result.length === 0) {
+            // Sul refresh gli alberi possono essere spariti lato server: allinea anche lo stato vuoto
+            if (forceRefresh) {
+                setTrees([]);
+                setSelectedTreeId(0);
+                setSelectedRowKeys([]);
             }
-        };
-        if (layoutMode == LayoutModes.Update) {
-            TreeCacheService.GetAllSearchAsync().then((result) => { setResultCache(result); });
+            return;
+        }
+        setTrees(result);
+        // Dopo un refresh mantiene l'albero corrente, se ancora presente
+        const currentTreeId = selectedTreeIdRef.current;
+        if (forceRefresh && result.some(o => o.id == currentTreeId)) {
+            setSelectedTreeId(currentTreeId);
+            setSelectedRowKeys([currentTreeId]);
+            return;
         }
-        else {
-            TreeCacheService.GetAllArchiveAsync().then((result) => { setResultCache(result); });
+        // Il predefinito puo' non essere piu' tra gli alberi del contesto (cancellato, o permessi cambiati): si ripiega sul primo
+        const defaultTree = getDefaultTreeId(layoutMode);
+        const treeToSelect = (defaultTree > 0 ? result.find(o => o.id == defaultTree) : undefined) ?? result[0];
+        setSelectedTreeId(treeToSelect?.id ?? 0);
+        if (treeToSelect?.id) {
+            setSelectedRowKeys([treeToSelect.id]);
         }
     }, [layoutMode]);
     useEffect(() => {
-        let newTreeItems = trees.find(o => o.id == selectedTreeId)?.items ?? [];
-        setTreeItems(newTreeItems);
-    }, [selectedTreeId, trees]);
+        setIsLoadingTrees(true);
+        loadTreesAsync().finally(() => setIsLoadingTrees(false));
+    }, [loadTreesAsync]);
+    // Derivato nello stesso render degli alberi: con uno state la TreeList mostrerebbe "Nessun dato" per un frame
+    const treeItems = useMemo(() => trees.find(o => o.id == selectedTreeId)?.items ?? [], [trees, selectedTreeId]);
+    useEffect(() => {
+        // Mantiene la selezione dopo il refresh solo se l'elemento e' ancora presente (al cambio albero si azzera)
+        setSelectedTreeItemKey(prev => prev !== undefined && treeItems.some(o => o.id == prev) ? prev : undefined);
+    }, [treeItems]);
     const renderCell = useCallback((data) => {
         const treeItem = data.data;
-        const [showInfo, setShowInfo] = useState(false);
         // Documento (DcmtType)
         if (treeItem.type === TreeItemTypes.DcmtType) {
-            return (_jsxs(StyledDivHorizontal, { style: {
-                    alignItems: 'center',
-                    minWidth: 0,
-                    width: '100%',
-                    gap: 2,
-                    position: 'relative'
-                }, onMouseEnter: async () => {
-                    if (!isMobile) {
-                        setShowInfo(true);
-                        let dtd = await DcmtTypeListCacheService.GetAsync(treeItem.tid);
-                        setInfoDTD(dtd);
-                    }
-                }, onMouseLeave: () => {
-                    if (!isMobile) {
-                        setShowInfo(false);
-                        setInfoDTD(undefined);
-                    }
-                }, children: [_jsx("span", { style: { cursor: 'pointer', flex: 1, minWidth: 0 }, children: _jsx(TMTidViewer, { tid: treeItem.tid, showIcon: false }) }), !isMobile && (_jsx("span", { style: {
-                            opacity: showInfo ? 1 : 0,
-                            transition: 'opacity 0.2s',
-                            pointerEvents: showInfo ? 'auto' : 'none',
-                            cursor: 'pointer',
-                            display: 'flex',
-                            alignItems: 'center',
-                            marginLeft: 'auto',
-                            zIndex: 2
-                        }, children: _jsx(TMDcmtTypeTooltip, { dtd: infoDTD, children: _jsx(IconInfo, { color: TMColors.info }) }) }))] }));
+            return _jsx(TMTreeDcmtTypeCell, { tid: treeItem.tid, isMobile: isMobile });
         }
         // Folder (altri tipi)
         return (_jsxs(StyledDivHorizontal, { style: { gap: 5, alignItems: 'center', minWidth: 0 }, children: [_jsx("span", { style: {
@@ -113,7 +124,7 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
                         whiteSpace: 'nowrap',
                         flex: 1,
                     }, children: treeItem.nameLoc })] }));
-    }, [isMobile, infoDTD, setInfoDTD]);
+    }, [isMobile]);
     // Handles selection change in the data grid
     const onSelectionChanged = useCallback((e) => {
         const selectedKeys = e.component.getSelectedRowKeys() ?? [];
@@ -124,8 +135,18 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
         if (selectedKeys.length > 0)
             setSelectedTreeId(selectedKeys[0]);
         setSelectedRowKeys(selectedKeys);
-        setIsGridBoxOpened(false);
-    }, []);
+        closeDropDown();
+    }, [closeDropDown]);
+    // Handles click on a tree row in the trees data grid: clicking the already selected tree
+    // does not raise onSelectionChanged, so the drop down must be closed here as well
+    const onRowClickTrees = useCallback((e) => {
+        const tree = e.data;
+        if (tree?.id === undefined)
+            return;
+        setSelectedTreeId(tree.id);
+        setSelectedRowKeys([tree.id]);
+        closeDropDown();
+    }, [closeDropDown]);
     // Handles focus change in the data grid
     const onFocusedRowChanged = useCallback((e) => {
         setFocusedRowKey(e.row?.key);
@@ -135,12 +156,6 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
         if (treeItemDescriptor?.id)
             setSelectedRowKeys([treeItemDescriptor.id]);
     }, []);
-    const onGridBoxOpened = useCallback((e) => {
-        if (e.name === 'opened') {
-            setIsGridBoxOpened(e.value);
-        }
-        ;
-    }, []);
     // Callback function to handle double-click events on a tree view cell
     const onCellDblClickTreeView = useCallback((e) => {
         // Extract the data from the clicked cell and cast it to the TreeItemDescriptor type
@@ -161,7 +176,18 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
             }
         }
     }, []);
-    return (_jsx(TMPanel, { title: SDK_Localizator.Trees, isVisible: isVisible, totalItems: trees.length, onClose: onClosePanel, allowMaximize: allowMaximize, onMaximize: onMaximizePanel, onHeaderDoubleClick: onMaximizePanel, toolbar: _jsx(TMButton, { btnStyle: 'icon', caption: defaultTreeId == selectedTreeId ? SDKUI_Localizator.TreeRemoveDefault : SDKUI_Localizator.SetAsDefault, icon: defaultTreeId == selectedTreeId ? _jsx(IconStarRemove, { color: 'rgb(243, 114, 92)' }) : _jsx(IconStar, { color: 'rgb(248, 215, 117)' }), onClick: () => {
+    // Callback function to handle click events on a tree view row.
+    const onRowClickTreeView = useCallback((e) => {
+        const treeItem = e.data;
+        if (treeItem?.type === TreeItemTypes.DcmtType) {
+            onSelectedTIDChanged?.(treeItem.tid, selectedTreeId);
+        }
+    }, [onSelectedTIDChanged, selectedTreeId]);
+    // La selezione la decide il widget (click, ctrl+click che deseleziona, barra spaziatrice): qui si allinea solo lo stato
+    const onSelectionChangedTreeView = useCallback((e) => {
+        setSelectedTreeItemKey(e.selectedRowKeys?.[0]);
+    }, []);
+    return (_jsx(TMPanel, { title: SDK_Localizator.Trees, isVisible: isVisible, totalItems: trees.length, onClose: onClosePanel, allowMaximize: allowMaximize, onMaximize: onMaximizePanel, onHeaderDoubleClick: onMaximizePanel, onRefresh: () => loadTreesAsync(true), isRefreshing: isLoadingTrees, toolbar: _jsx(TMButton, { btnStyle: 'icon', caption: defaultTreeId == selectedTreeId ? SDKUI_Localizator.TreeRemoveDefault : SDKUI_Localizator.SetAsDefault, icon: defaultTreeId == selectedTreeId ? _jsx(IconStarRemove, { color: 'rgb(243, 114, 92)' }) : _jsx(IconStar, { color: 'rgb(248, 215, 117)' }), onClick: () => {
                 if (defaultTreeId == selectedTreeId) {
                     if (layoutMode == LayoutModes.Update)
                         SDKUI_Globals.userSettings.searchSettings.defaultTree = -1;
@@ -185,22 +211,43 @@ const TMTreeSelector = ({ layoutMode = LayoutModes.Update, isVisible, onSelected
                         width: '100%',
                         boxSizing: 'border-box',
                         minHeight: 0,
-                    }, children: [_jsx("div", { style: { padding: '10px' }, children: _jsx(DropDownBox, { dropDownOptions: {
+                    }, children: [_jsx("div", { style: { padding: '10px' }, children: _jsx(DropDownBox, { ref: dropDownBoxRef, dropDownOptions: {
                                     resizeEnabled: true,
                                     minWidth: "100%",
                                     height: trees.length <= 10 ? 300 : 500,
                                     maxWidth: "100%"
-                                }, value: selectedTreeId, opened: isGridBoxOpened, valueExpr: "id", displayExpr: "nameLoc", deferRendering: false, dataSource: trees, onValueChanged: syncDataGridSelection, onOptionChanged: onGridBoxOpened, style: { height: 30, padding: '5px' }, children: _jsx(TMDataGrid, { height: "100%", width: "100%", dataSource: trees, dataColumns: [
+                                }, value: selectedTreeId, valueExpr: "id", displayExpr: "nameLoc", deferRendering: false, dataSource: trees, onValueChanged: syncDataGridSelection, style: { height: 30 }, children: _jsx(TMDataGrid, { height: "100%", width: "100%", dataSource: trees, dataColumns: [
                                         { dataField: 'nameLoc', caption: SDKUI_Localizator.Name, width: 'auto' },
                                         { dataField: 'description', caption: SDKUI_Localizator.Description, width: 'auto' },
-                                    ], selection: { mode: 'single', showCheckBoxesMode: "none" }, showHeaderFilter: false, selectedRowKeys: selectedRowKeys, onSelectionChanged: onSelectionChanged, focusedRowKey: focusedRowKey, onFocusedRowChanged: onFocusedRowChanged }) }) }), _jsxs(StyledTreeListWrapper, { children: [_jsxs(TreeList, { height: "100%", dataSource: treeItems, showRowLines: false, showColumnLines: false, showBorders: false, columnAutoWidth: false, keyExpr: "id", parentIdExpr: "parentID", dataStructure: "plain", showColumnHeaders: false, onContentReady: (e) => e.component.clearSelection(), onCellDblClick: onCellDblClickTreeView, onSelectionChanged: (e) => {
-                                        if (e.selectedRowsData[0] && e.selectedRowsData[0].type == TreeItemTypes.DcmtType) {
-                                            onSelectedTIDChanged?.(e.selectedRowsData[0].tid, selectedTreeId);
-                                        }
-                                    }, children: [_jsx(Column, { dataField: "nameLoc", caption: SDKUI_Localizator.Name, cellRender: renderCell, width: "100%" }), _jsx(Scrolling, { mode: "virtual", useNative: Number(SDKUI_Globals.userSettings?.themeSettings.gridSettings.useNativeScrollbar) === 1 }), _jsx(Selection, { mode: "single" })] }), _jsxs(StyledOffCanvasPanel, { ref: panelRef, "$isOpen": isMobile && infoDTD !== undefined, children: [_jsxs(StyledDivHorizontal, { style: { gap: 10, padding: '10px 8px', width: '100%', alignItems: 'center' }, children: [_jsx("p", { style: { fontSize: '1.1rem', fontWeight: 'bold' }, children: `${SDKUI_Localizator.DcmtType} - ${SDKUI_Localizator.About}` }), _jsx(IconCloseOutline, { style: { marginLeft: 'auto', cursor: 'pointer' }, onClick: () => setInfoDTD(undefined) })] }), renderDTDTooltipContent(infoDTD)] })] })] })
-            : _jsx("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', height: '100%', width: '100%', fontSize: '1.5rem' }, children: SDKUI_Localizator.TreesNoAvailable }) }));
+                                    ], selection: { mode: 'single', showCheckBoxesMode: "none" }, showHeaderFilter: false, selectedRowKeys: selectedRowKeys, onSelectionChanged: onSelectionChanged, onRowClick: onRowClickTrees, focusedRowKey: focusedRowKey, onFocusedRowChanged: onFocusedRowChanged }) }) }), _jsxs(StyledTreeListWrapper, { children: [_jsxs(TreeList, { height: "100%", dataSource: treeItems, showRowLines: false, showColumnLines: false, showBorders: false, columnAutoWidth: false, keyExpr: "id", parentIdExpr: "parentID", dataStructure: "plain", showColumnHeaders: false, selectedRowKeys: selectedTreeItemKeys, onSelectionChanged: onSelectionChangedTreeView, onCellDblClick: onCellDblClickTreeView, onRowClick: onRowClickTreeView, children: [_jsx(Column, { dataField: "nameLoc", caption: SDKUI_Localizator.Name, cellRender: renderCell, width: "100%" }), _jsx(Scrolling, { mode: "standard", useNative: Number(SDKUI_Globals.userSettings?.themeSettings.gridSettings.useNativeScrollbar) === 1 }), _jsx(Selection, { mode: "single" })] }), _jsxs(StyledOffCanvasPanel, { ref: panelRef, $isOpen: isMobile && infoDTD !== undefined, children: [_jsxs(StyledDivHorizontal, { style: { gap: 10, padding: '10px 8px', width: '100%', alignItems: 'center' }, children: [_jsx("p", { style: { fontSize: '1.1rem', fontWeight: 'bold' }, children: `${SDKUI_Localizator.DcmtType} - ${SDKUI_Localizator.About}` }), _jsx(IconCloseOutline, { style: { marginLeft: 'auto', cursor: 'pointer' }, onClick: () => setInfoDTD(undefined) })] }), renderDTDTooltipContent(infoDTD)] })] })] })
+            : isLoadingTrees
+                ? _jsx(_Fragment, {})
+                : _jsx("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', height: '100%', width: '100%', fontSize: '1.5rem' }, children: SDKUI_Localizator.TreesNoAvailable }) }));
 };
 export default TMTreeSelector;
+const StyledTreeDcmtTypeRow = styled(StyledDivHorizontal) `
+    align-items: center;
+    min-width: 0;
+    width: 100%;
+    gap: 2px;
+    position: relative;
+
+    .info-icon {
+        display: flex;
+        align-items: center;
+        margin-left: auto;
+        z-index: 2;
+        cursor: pointer;
+        opacity: 0;
+        pointer-events: none;
+        transition: opacity 0.2s;
+    }
+
+    &:hover .info-icon {
+        opacity: 1;
+        pointer-events: auto;
+    }
+`;
 const StyledTreeListWrapper = styled.div `
     width: 100%;
     height: 100%;

package/lib/components/features/search/TMViewHistoryDcmt.js

@@ -10,12 +10,13 @@ import TMDcmtIcon from "../documents/TMDcmtIcon";
 import TMDataGrid from "../../base/TMDataGrid";
 import TMDcmtForm from "../documents/TMDcmtForm";
 import { useDcmtOperations } from "../../../hooks/useDcmtOperations";
-import { TMLayoutWaitingContainer } from "../../base/TMWaitPanel";
+import TMLayoutContainer from "../../base/TMLayout";
+import TMWaitPanelManager from "../../base/waitPanel/TMWaitPanelManager";
 import { TMResultManager } from "../../forms/TMResultDialog";
 let abortLocalController = new AbortController();
 const TMViewHistoryDcmt = (props) => {
     const { deviceType, inputDcmt, onClose, fromDTD, allTasks, getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers } = props;
-    const { abortController, showWaitPanel, waitPanelTitle, showPrimary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, showSecondary, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, downloadDcmtsAsync } = useDcmtOperations();
+    const { downloadDcmtsAsync } = useDcmtOperations();
     const [dcmtHistory, setDcmtHistory] = useState([]);
     // showId is a state variable that determines whether an ID-related component or feature should be displayed
     const [showId, setShowId] = useState(false);
@@ -33,18 +34,6 @@ const TMViewHistoryDcmt = (props) => {
     const [showDcmtForm, setShowDcmtForm] = useState(false);
     // Memoized value to get the selected draft based on the focused row key
     const selectedDcmt = useMemo(() => dcmtHistory.find(dcmt => dcmt.id === focusedRowKey), [focusedRowKey, dcmtHistory]);
-    // State variable to control the visibility of the wait panel.
-    const [showLocalWaitPanel, setShowLocalWaitPanel] = useState(false);
-    // State variable to store the title of the wait panel.
-    const [waitLocalPanelTitle, setWaitLocalPanelTitle] = useState('');
-    // State variable to control the visibility of the primary section of the wait panel.
-    const [showLocalPrimary, setShowLocalPrimary] = useState(false);
-    // State variable to store the primary text of the wait panel.
-    const [waitLocalPanelTextPrimary, setWaitLocalPanelTextPrimary] = useState('');
-    // State variable to track the current value of the primary progress indicator in the wait panel.
-    const [waitLocalPanelValuePrimary, setWaitLocalPanelValuePrimary] = useState(0);
-    // State variable to define the maximum value for the primary progress indicator in the wait panel.
-    const [waitLocalPanelMaxValuePrimary, setWaitLocalPanelMaxValuePrimary] = useState(0);
     const getParticipantById = (id, users) => {
         if (users.length === 0)
             return null;
@@ -155,18 +144,21 @@ const TMViewHistoryDcmt = (props) => {
                 onButtonClick: async (e) => {
                     if (e !== ButtonNames.YES)
                         return;
-                    setWaitLocalPanelTitle(SDKUI_Localizator.Delete);
-                    setShowLocalWaitPanel(true);
-                    setShowLocalPrimary(true);
                     abortLocalController = new AbortController();
+                    const panel = TMWaitPanelManager.show({
+                        title: SDKUI_Localizator.Delete,
+                        max: 1,
+                        showCounters: false,
+                        cancelable: true,
+                        onAbort: () => abortLocalController.abort(),
+                    });
                     let result = [];
                     let i = 0;
-                    setWaitLocalPanelMaxValuePrimary(1);
                     if (abortLocalController.signal.aborted) {
                         result.push({ rowIndex: i, id1: currentDcmt.id, id2: currentDcmt.id, resultType: ResultTypes.WARNING, description: `Operazione interrotta. Elaborate ${i}` });
                     }
                     else {
-                        setWaitLocalPanelTextPrimary(SDKUI_Localizator.Delete);
+                        panel.setSubtitle(SDKUI_Localizator.Delete);
                         const deleteEngine = new DeleteEngine(SDK_Globals.tmSession);
                         await deleteEngine.PhysDeleteByIDAsync(Number(currentDcmt.TID), Number(currentDcmt.DID), false)
                             .then(async () => {
@@ -178,10 +170,7 @@ const TMViewHistoryDcmt = (props) => {
                         });
                     }
                     setFocusedRowKey(undefined);
-                    setWaitLocalPanelTextPrimary('');
-                    setWaitLocalPanelMaxValuePrimary(0);
-                    setWaitLocalPanelValuePrimary(0);
-                    setShowLocalWaitPanel(false);
+                    panel.close();
                     TMResultManager.show(result, SDKUI_Localizator.Delete, "ID", undefined);
                 }
             });
@@ -279,7 +268,7 @@ const TMViewHistoryDcmt = (props) => {
             { dataField: "LastUpdateTime", caption: SDKUI_Localizator.LastUpdateTime, dataType: 'datetime', format: 'dd/MM/yyyy HH:mm:ss', },
         ]);
     }, [showId]);
-    return _jsx(TMModal, { title: `${SDKUI_Localizator.SearchResult} \u2014 ${SDKUI_Localizator.History + ": " + (fromDTD.nameLoc ?? SDKUI_Localizator.Document) + " (DID:" + inputDcmt.DID})`, width: calcResponsiveSizes(deviceType, '700px', '700px', '95%'), height: calcResponsiveSizes(deviceType, '80%', '80%', '95%'), onClose: onClose, children: _jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, showWaitPanelSecondary: showSecondary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, waitPanelTextSecondary: waitPanelTextSecondary, waitPanelValueSecondary: waitPanelValueSecondary, waitPanelMaxValueSecondary: waitPanelMaxValueSecondary, isCancelable: true, abortController: abortController, children: _jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showLocalWaitPanel, showWaitPanelPrimary: showLocalPrimary, waitPanelTitle: waitLocalPanelTitle, waitPanelTextPrimary: waitLocalPanelTextPrimary, waitPanelValuePrimary: waitLocalPanelValuePrimary, waitPanelMaxValuePrimary: waitLocalPanelMaxValuePrimary, isCancelable: true, abortController: abortLocalController, children: [_jsx(TMDataGrid, { dataSource: dcmtHistory, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selection: selection, customContextMenuItems: customContextMenuItems, onFocusedRowChanged: onFocusedRowChanged, onCellDblClick: onCellDblClick, noDataText: SDKUI_Localizator.NoDataToDisplay, showSearchPanel: showSearch }), (showDcmtForm && selectedDcmt !== undefined) &&
-                        _jsx(TMDcmtForm, { TID: Number(selectedDcmt.TID), DID: Number(selectedDcmt.DID), formMode: FormModes.ReadOnly, isModal: true, widthModal: "95%", heightModal: "95%", titleModal: fromDTD.name ?? SDKUI_Localizator.SearchResult, allowNavigation: dcmtHistory.length > 0, itemIndex: selectedIndex + 1, count: dcmtHistory.length, onClose: () => { setShowDcmtForm(false); }, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, moreInfoTasks: getMoreInfoTasksForDocument(allTasks ?? [], Number(selectedDcmt.TID), Number(selectedDcmt.DID)) })] }) }) });
+    return _jsx(TMModal, { title: `${SDKUI_Localizator.SearchResult} \u2014 ${SDKUI_Localizator.History + ": " + (fromDTD.nameLoc ?? SDKUI_Localizator.Document) + " (DID:" + inputDcmt.DID})`, width: calcResponsiveSizes(deviceType, '700px', '700px', '95%'), height: calcResponsiveSizes(deviceType, '80%', '80%', '95%'), onClose: onClose, children: _jsxs(TMLayoutContainer, { direction: 'vertical', children: [_jsx(TMDataGrid, { dataSource: dcmtHistory, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selection: selection, customContextMenuItems: customContextMenuItems, onFocusedRowChanged: onFocusedRowChanged, onCellDblClick: onCellDblClick, noDataText: SDKUI_Localizator.NoDataToDisplay, showSearchPanel: showSearch }), (showDcmtForm && selectedDcmt !== undefined) &&
+                    _jsx(TMDcmtForm, { TID: Number(selectedDcmt.TID), DID: Number(selectedDcmt.DID), formMode: FormModes.ReadOnly, isModal: true, widthModal: "95%", heightModal: "95%", titleModal: fromDTD.name ?? SDKUI_Localizator.SearchResult, allowNavigation: dcmtHistory.length > 0, itemIndex: selectedIndex + 1, count: dcmtHistory.length, onClose: () => { setShowDcmtForm(false); }, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, moreInfoTasks: getMoreInfoTasksForDocument(allTasks ?? [], Number(selectedDcmt.TID), Number(selectedDcmt.DID)) })] }) });
 };
 export default TMViewHistoryDcmt;

package/lib/components/features/tasks/TMTaskForm.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from 'react';
 import { ObjectClasses, TaskDescriptor, PdGs, UserListCacheService, SDK_Localizator } from '@topconsultnpm/sdk-ts';
 import { gotoPDGExtendedLabel, taskValidatorAsync } from './TMTasksUtils';

package/lib/components/features/tasks/TMTaskFormUtils.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { PdGs, Priorities, SDK_Globals, Task_States } from "@topconsultnpm/sdk-ts";
 import { FormModes } from "../../../ts";
@@ -358,7 +358,7 @@ const TaskFormResponseComment = (props) => {
                             }, children: currentResponse && currentResponse.length > 0
                                 ? _jsx(TMHtmlContentDisplay, { markup: currentResponse ?? '-', isSelected: false })
                                 : _jsx("span", { style: { color: '#6c757d', fontStyle: 'italic' }, children: SDKUI_Localizator.NoAnswerProvided }) }) }))] })
-            : (_jsxs(ResponseCommentWrapper, { children: [_jsx(ResponseCommentTextArea, { id: "responseId", name: "response", "$isValid": true, value: currentResponse ?? '', onChange: onAnswerChange ? onAnswerChange : undefined }), _jsx(ResponseCommentLabel, { htmlFor: "responseId", children: SDKUI_Localizator.Answer }), _jsx(ResponseCommentCharacterCounter, { children: `${500 - (currentResponse ?? '').length} ${SDKUI_Localizator.CharactersRemaining}` })] })) }));
+            : (_jsxs(ResponseCommentWrapper, { children: [_jsx(ResponseCommentTextArea, { id: "responseId", name: "response", $isValid: true, value: currentResponse ?? '', onChange: onAnswerChange ? onAnswerChange : undefined }), _jsx(ResponseCommentLabel, { htmlFor: "responseId", children: SDKUI_Localizator.Answer }), _jsx(ResponseCommentCharacterCounter, { children: `${500 - (currentResponse ?? '').length} ${SDKUI_Localizator.CharactersRemaining}` })] })) }));
 };
 // Stile comune per i container dei campi
 const fieldContainerStyle = { width: '100%' };
@@ -423,7 +423,7 @@ export const RenderTaskFormStateField = (props) => {
     // Non renderizzare nulla finché i dati non sono pronti
     if (!formDataOrig)
         return null;
-    return (_jsx("div", { style: { width: '100%', marginTop: 15 }, children: _jsxs(FloatingLabelFieldCard, { "$isModifiedWhen": formDataOrig?.state !== formData?.state, style: { display: 'flex', flexDirection: 'column', gap: 10 }, children: [_jsx(FloatingFieldLabel, { "$isModifiedWhen": formDataOrig?.state !== formData?.state, children: SDKUI_Localizator.StatusAndAnswer }), _jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', width: '100%' }, children: [_jsx(StatusFieldLabel, { children: _jsxs(StatusValue, { "$isModifiedWhen": formDataOrig?.state !== formData?.state, children: [_jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: taskStateIconMap(20).get(formData?.state ?? Task_States.None) }), getStatusLocalizatorValue(formData?.state ?? Task_States.None)] }) }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' }, children: [showModifyButton && (_jsxs("div", { onClick: () => handleShowChangeStateForm(true), style: {
+    return (_jsx("div", { style: { width: '100%', marginTop: 15 }, children: _jsxs(FloatingLabelFieldCard, { $isModifiedWhen: formDataOrig?.state !== formData?.state, style: { display: 'flex', flexDirection: 'column', gap: 10 }, children: [_jsx(FloatingFieldLabel, { $isModifiedWhen: formDataOrig?.state !== formData?.state, children: SDKUI_Localizator.StatusAndAnswer }), _jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', width: '100%' }, children: [_jsx(StatusFieldLabel, { children: _jsxs(StatusValue, { $isModifiedWhen: formDataOrig?.state !== formData?.state, children: [_jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: taskStateIconMap(20).get(formData?.state ?? Task_States.None) }), getStatusLocalizatorValue(formData?.state ?? Task_States.None)] }) }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' }, children: [showModifyButton && (_jsxs("div", { onClick: () => handleShowChangeStateForm(true), style: {
                                         backgroundColor: "#d17800",
                                         color: "#fff",
                                         padding: "10px 16px",

package/lib/components/features/tasks/TMTasksAgenda.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import ArrayStore from "devextreme/data/array_store";
 import Scheduler from "devextreme-react/scheduler";

package/lib/components/features/tasks/TMTasksCalendar.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import ArrayStore from 'devextreme/data/array_store';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { Priorities, Task_States } from "@topconsultnpm/sdk-ts";

package/lib/components/features/tasks/TMTasksHeader.js

@@ -28,7 +28,7 @@ const TMTasksHeader = (props) => {
     const isValidKey = (key) => {
         return key !== FilterCategoryId.AllStates && key !== FilterCategoryId.AllPriorities;
     };
-    return (_jsx(StyledListHeader, { ref: containerRef, "$color": color ?? 'black', "$height": height ?? '100%', onContextMenu: handleContextMenu, children: _jsx(ScrollView, { width: "100%", height: "100%", direction: "horizontal", useNative: true, children: _jsxs(StyledViewChangerContainer, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.SelectViewMode, showEvent: "mouseenter", hideEvent: "mouseleave", position: "top", children: _jsx(TMDropDown, { elementStyle: { minWidth: "120px", width: "120px", height: "29px" }, dataSource: [
+    return (_jsx(StyledListHeader, { ref: containerRef, $color: color ?? 'black', $height: height ?? '100%', onContextMenu: handleContextMenu, children: _jsx(ScrollView, { width: "100%", height: "100%", direction: "horizontal", useNative: true, children: _jsxs(StyledViewChangerContainer, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.SelectViewMode, showEvent: "mouseenter", hideEvent: "mouseleave", position: "top", children: _jsx(TMDropDown, { elementStyle: { minWidth: "120px", width: "120px", height: "29px" }, dataSource: [
                                 { value: TaskView.AGENDA_TASK, display: "Agenda", icon: 'clock' },
                                 { value: TaskView.CALENDAR_TASK, display: SDKUI_Localizator.Calendar, icon: 'event' },
                                 { value: TaskView.LIST_TASK, display: SDKUI_Localizator.List, icon: 'fields' },

package/lib/components/features/tasks/TMTasksUtilsView.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { PdGs, Priorities, SDK_Globals, Task_States } from '@topconsultnpm/sdk-ts';
 import { Extended_Task_States, FilterCategoryId, filterTreeTask, gotoPDGExtendedLabel, prioritiesResourceData, taskIsExpiringSoon } from "./TMTasksUtils";