@topconsultnpm/sdkui-react 6.19.0-test2 → 6.20.0-dev1.2

package/lib/components/features/assistant/ToppyDraggableHelpCenter.js

@@ -33,7 +33,7 @@ const ToppyButton = styled.div.attrs((props) => ({
   /* Posizionamento di default quando non è draggato (x e y non sono definiti) */
   ${(props) => props.$x === undefined || props.$y === undefined
     ? `
-        bottom: ${props.$isMobile ? '0px' : '-20px'};
+        bottom: ${props.$isMobile ? (props.$isCollapsed ? '-20px' : '-50px') : '-20px'};
         ${props.$align === 'left' ? 'left: 10px;' : 'right: 10px;'};
       `
     : ''}
@@ -48,15 +48,9 @@ const ToppyButton = styled.div.attrs((props) => ({
   /* Dimensioni dinamiche in base allo stato collassato e al tipo di dispositivo
      Usa min() per adattarsi su schermi piccoli */
   width: ${(props) => {
-    if (props.$isMobile) {
-        return props.$isCollapsed ? 'min(40px, 100%)' : '80px';
-    }
     return props.$isCollapsed ? 'min(60px, 100%)' : '120px';
 }};
   height: ${(props) => {
-    if (props.$isMobile) {
-        return props.$isCollapsed ? 'min(45px, 100%)' : '95px';
-    }
     return props.$isCollapsed ? 'min(70px, 100%)' : '140px';
 }};
   max-width: 100%;
@@ -66,18 +60,8 @@ const ToppyButton = styled.div.attrs((props) => ({
 
   img {
     /* Dimensioni dell'immagine in base allo stato collassato e al tipo di dispositivo */
-    width: ${(props) => {
-    if (props.$isMobile) {
-        return props.$isCollapsed ? '40px' : '80px';
-    }
-    return props.$isCollapsed ? '60px' : '120px';
-}};
-    height: ${(props) => {
-    if (props.$isMobile) {
-        return props.$isCollapsed ? '40px' : '95px';
-    }
-    return props.$isCollapsed ? '60px' : '140px';
-}};
+    width: ${(props) => props.$isCollapsed ? (props.$isMobile ? '40px' : '60px') : (props.$isMobile ? '80px' : '120px')};
+    height: ${(props) => props.$isCollapsed ? (props.$isMobile ? '40px' : '60px') : (props.$isMobile ? '100px' : '140px')};
     pointer-events: ${(props) => (props.$isMobile ? 'auto' : 'none')};
     border-radius: 50%; /* Rende l'immagine circolare */
     /* Rotazione leggera in base all'allineamento */
@@ -169,6 +153,16 @@ const DragOverlay = styled.div `
  * contenitore e può essere collassato/espanso con un doppio click.
  */
 const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onToppyImageClick, initialIsCollapsed, isVisible = true, usePortal = false, }) => {
+    // Configurazione del layout e dei limiti di posizionamento di Toppy
+    const LAYOUT_CONFIG = {
+        bottomOffsetDesktop: 20, // Quanto Toppy può uscire dal bordo inferiore su desktop
+        bottomOffsetMobileCollapsed: 20, // Quanto Toppy può uscire dal bordo inferiore su mobile quando è collassato
+        bottomOffsetMobileExpanded: 50, // Quanto Toppy può uscire dal bordo inferiore su mobile quando è espanso
+        buttonOffset: 8, // Spazio extra per i bottoni posizionati a -8px (ExpandButton, CloseButton)
+        closeButtonOffset: 8, // Offset dei bottoni che sporgono dalla bubble (CloseButton sulla bubble)
+        bubbleBuffer: 5, // Buffer di sicurezza per evitare sovrapposizioni con la bubble
+        minTopOffset: 8 // Limite minimo dall'alto per evitare che i bottoni superiori escano
+    };
     // Ref per il contenitore principale
     const buttonRef = useRef(null);
     // Stato per controllare se il componente è collassato o espanso
@@ -205,20 +199,16 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
             return;
         const rect = buttonRef.current.getBoundingClientRect();
         // Spazio extra occupato dalla bubble quando non è collassato
-        // Include anche l'offset dei bottoni che sporgono dalla bubble (8px)
-        const closeButtonOffset = 8;
-        const extraHeight = !isCollapsed ? bubbleSize.height + closeButtonOffset : 0;
-        const extraWidth = !isCollapsed ? bubbleSize.width + closeButtonOffset : 0;
+        const extraHeight = !isCollapsed ? bubbleSize.height + LAYOUT_CONFIG.closeButtonOffset : 0;
+        const extraWidth = !isCollapsed ? bubbleSize.width + LAYOUT_CONFIG.closeButtonOffset : 0;
         let minX = 0;
         let maxX;
         let maxY;
-        const bubbleBuffer = 5;
-        const buttonOffset = 8; // Spazio extra per i bottoni posizionati a -8px
-        const minY = buttonOffset; // Limite minimo per evitare che i bottoni superiori escano
+        const minY = LAYOUT_CONFIG.minTopOffset;
         if (usePortal) {
             // Calcola i limiti usando le dimensioni del viewport
-            maxX = window.innerWidth - rect.width - buttonOffset; // Restringo per evitare che i bottoni a destra escano
-            maxY = window.innerHeight - rect.height + 20;
+            maxX = window.innerWidth - rect.width - LAYOUT_CONFIG.buttonOffset;
+            maxY = window.innerHeight - rect.height + (isMobile ? (isCollapsed ? LAYOUT_CONFIG.bottomOffsetMobileCollapsed : LAYOUT_CONFIG.bottomOffsetMobileExpanded) : LAYOUT_CONFIG.bottomOffsetDesktop);
         }
         else {
             // Calcola i limiti usando le dimensioni del parent
@@ -226,8 +216,8 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
             if (!parent)
                 return;
             const parentRect = parent.getBoundingClientRect();
-            maxX = parentRect.width - rect.width - buttonOffset; // Restringo per evitare che i bottoni a destra escano
-            maxY = parentRect.height - rect.height + 20;
+            maxX = parentRect.width - rect.width - LAYOUT_CONFIG.buttonOffset;
+            maxY = parentRect.height - rect.height + (isMobile ? (isCollapsed ? LAYOUT_CONFIG.bottomOffsetMobileCollapsed : LAYOUT_CONFIG.bottomOffsetMobileExpanded) : LAYOUT_CONFIG.bottomOffsetDesktop);
         }
         if (!isCollapsed) {
             if (align === 'right') {
@@ -240,12 +230,12 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
         // Verifica se la posizione corrente è fuori dai limiti
         const isOutOfBounds = position.x < minX ||
             position.x > maxX ||
-            position.y < Math.max(minY, extraHeight + bubbleBuffer) ||
+            position.y < Math.max(minY, extraHeight + LAYOUT_CONFIG.bubbleBuffer) ||
             position.y > maxY;
         // Se è fuori dai limiti, aggiusta la posizione
         if (isOutOfBounds) {
             const adjustedX = Math.max(minX, Math.min(position.x, maxX));
-            const adjustedY = Math.max(Math.max(minY, extraHeight + bubbleBuffer), Math.min(position.y, maxY));
+            const adjustedY = Math.max(Math.max(minY, extraHeight + LAYOUT_CONFIG.bubbleBuffer), Math.min(position.y, maxY));
             setPosition({ x: adjustedX, y: adjustedY });
         }
     }, [isCollapsed, bubbleSize, usePortal, align]);
@@ -259,27 +249,24 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
             if (!buttonRef.current || !position)
                 return;
             const rect = buttonRef.current.getBoundingClientRect();
-            // Include anche l'offset dei bottoni che sporgono dalla bubble (8px)
-            const closeButtonOffset = 8;
-            const extraHeight = !isCollapsed ? bubbleSize.height + closeButtonOffset : 0;
-            const extraWidth = !isCollapsed ? bubbleSize.width + closeButtonOffset : 0;
+            // Spazio extra occupato dalla bubble quando non è collassato
+            const extraHeight = !isCollapsed ? bubbleSize.height + LAYOUT_CONFIG.closeButtonOffset : 0;
+            const extraWidth = !isCollapsed ? bubbleSize.width + LAYOUT_CONFIG.closeButtonOffset : 0;
             let minX = 0;
             let maxX;
             let maxY;
-            const bubbleBuffer = 5;
-            const buttonOffset = 8; // Spazio extra per i bottoni posizionati a -8px
-            const minY = buttonOffset; // Limite minimo per evitare che i bottoni superiori escano
+            const minY = LAYOUT_CONFIG.minTopOffset;
             if (usePortal) {
-                maxX = window.innerWidth - rect.width - buttonOffset; // Restringo per evitare che i bottoni a destra escano
-                maxY = window.innerHeight - rect.height + 20;
+                maxX = window.innerWidth - rect.width - LAYOUT_CONFIG.buttonOffset;
+                maxY = window.innerHeight - rect.height + (isMobile ? (isCollapsed ? LAYOUT_CONFIG.bottomOffsetMobileCollapsed : LAYOUT_CONFIG.bottomOffsetMobileExpanded) : LAYOUT_CONFIG.bottomOffsetDesktop);
             }
             else {
                 const parent = buttonRef.current.offsetParent;
                 if (!parent)
                     return;
                 const parentRect = parent.getBoundingClientRect();
-                maxX = parentRect.width - rect.width - buttonOffset; // Restringo per evitare che i bottoni a destra escano
-                maxY = parentRect.height - rect.height + 20;
+                maxX = parentRect.width - rect.width - LAYOUT_CONFIG.buttonOffset;
+                maxY = parentRect.height - rect.height + (isMobile ? (isCollapsed ? LAYOUT_CONFIG.bottomOffsetMobileCollapsed : LAYOUT_CONFIG.bottomOffsetMobileExpanded) : LAYOUT_CONFIG.bottomOffsetDesktop);
             }
             if (!isCollapsed) {
                 if (align === 'right') {
@@ -291,7 +278,7 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
             }
             const isOutOfBounds = position.x < minX ||
                 position.x > maxX ||
-                position.y < Math.max(minY, extraHeight + bubbleBuffer) ||
+                position.y < Math.max(minY, extraHeight + LAYOUT_CONFIG.bubbleBuffer) ||
                 position.y > maxY;
             if (isOutOfBounds) {
                 setPosition(null);
@@ -347,6 +334,22 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
         setIsDragging(true);
         e.preventDefault();
     };
+    /**
+     * Gestisce l'inizio del trascinamento per eventi touch
+     */
+    const handleTouchStart = (e) => {
+        if (!buttonRef.current)
+            return;
+        const touch = e.touches[0];
+        const rect = buttonRef.current.getBoundingClientRect();
+        // Calcola l'offset tra il punto di touch e l'angolo superiore sinistro del componente
+        dragOffset.current = {
+            x: touch.clientX - rect.left,
+            y: touch.clientY - rect.top,
+        };
+        setIsDragging(true);
+        e.preventDefault();
+    };
     /**
      * Gestisce il movimento durante il trascinamento
      * Calcola la nuova posizione rispettando i limiti del parent o viewport
@@ -355,24 +358,23 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
     const handleMouseMove = (e) => {
         if (!isDragging || !buttonRef.current)
             return;
+        // Estrae le coordinate dal tipo di evento appropriato
+        const clientX = 'touches' in e ? e.touches[0].clientX : e.clientX;
+        const clientY = 'touches' in e ? e.touches[0].clientY : e.clientY;
         const rect = buttonRef.current.getBoundingClientRect();
         // Spazio extra occupato dalla bubble quando non è collassato
-        // Include anche l'offset dei bottoni che sporgono dalla bubble (8px)
-        const closeButtonOffset = 8;
-        const extraHeight = !isCollapsed ? bubbleSize.height + closeButtonOffset : 0;
-        const extraWidth = !isCollapsed ? bubbleSize.width + closeButtonOffset : 0;
+        const extraHeight = !isCollapsed ? bubbleSize.height + LAYOUT_CONFIG.closeButtonOffset : 0;
+        const extraWidth = !isCollapsed ? bubbleSize.width + LAYOUT_CONFIG.closeButtonOffset : 0;
         let minX = 0;
         let maxX;
         let maxY;
         let newX;
         let newY;
-        const bubbleBuffer = 5;
-        const buttonOffset = 8; // Spazio extra per i bottoni posizionati a -8px
-        const minY = buttonOffset; // Limite minimo per evitare che i bottoni superiori escano
+        const minY = LAYOUT_CONFIG.minTopOffset;
         if (usePortal) {
             // Calcola i limiti usando il viewport
-            maxX = window.innerWidth - rect.width - buttonOffset; // Restringo per evitare che i bottoni a destra escano
-            maxY = window.innerHeight - rect.height + 20;
+            maxX = window.innerWidth - rect.width - LAYOUT_CONFIG.buttonOffset;
+            maxY = window.innerHeight - rect.height + (isMobile ? (isCollapsed ? LAYOUT_CONFIG.bottomOffsetMobileCollapsed : LAYOUT_CONFIG.bottomOffsetMobileExpanded) : LAYOUT_CONFIG.bottomOffsetDesktop);
             if (!isCollapsed) {
                 if (align === 'right') {
                     minX = Math.max(0, extraWidth - rect.width);
@@ -381,8 +383,8 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
                     maxX = Math.min(maxX, window.innerWidth - extraWidth);
                 }
             }
-            newX = Math.max(minX, Math.min(e.clientX - dragOffset.current.x, maxX));
-            newY = Math.max(Math.max(minY, extraHeight + bubbleBuffer), Math.min(e.clientY - dragOffset.current.y, maxY));
+            newX = Math.max(minX, Math.min(clientX - dragOffset.current.x, maxX));
+            newY = Math.max(Math.max(minY, extraHeight + LAYOUT_CONFIG.bubbleBuffer), Math.min(clientY - dragOffset.current.y, maxY));
         }
         else {
             // Calcola i limiti usando il parent
@@ -390,8 +392,8 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
             if (!parent)
                 return;
             const parentRect = parent.getBoundingClientRect();
-            maxX = parentRect.width - rect.width - buttonOffset; // Restringo per evitare che i bottoni a destra escano
-            maxY = parentRect.height - rect.height + 20;
+            maxX = parentRect.width - rect.width - LAYOUT_CONFIG.buttonOffset;
+            maxY = parentRect.height - rect.height + (isMobile ? (isCollapsed ? LAYOUT_CONFIG.bottomOffsetMobileCollapsed : LAYOUT_CONFIG.bottomOffsetMobileExpanded) : LAYOUT_CONFIG.bottomOffsetDesktop);
             if (!isCollapsed) {
                 if (align === 'right') {
                     minX = Math.max(0, extraWidth - rect.width);
@@ -400,8 +402,8 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
                     maxX = Math.min(maxX, parentRect.width - extraWidth);
                 }
             }
-            newX = Math.max(minX, Math.min(e.clientX - parentRect.left - dragOffset.current.x, maxX));
-            newY = Math.max(Math.max(minY, extraHeight + bubbleBuffer), Math.min(e.clientY - parentRect.top - dragOffset.current.y, maxY));
+            newX = Math.max(minX, Math.min(clientX - parentRect.left - dragOffset.current.x, maxX));
+            newY = Math.max(Math.max(minY, extraHeight + LAYOUT_CONFIG.bubbleBuffer), Math.min(clientY - parentRect.top - dragOffset.current.y, maxY));
         }
         setPosition({ x: newX, y: newY });
     };
@@ -413,10 +415,13 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
     const handleMouseUp = (e) => {
         if (isDragging) {
             setIsDragging(false);
+            // Estrae le coordinate dal tipo di evento appropriato
+            const clientX = 'changedTouches' in e ? e.changedTouches[0].clientX : e.clientX;
+            const clientY = 'changedTouches' in e ? e.changedTouches[0].clientY : e.clientY;
             const rect = buttonRef.current?.getBoundingClientRect();
             if (rect) {
                 // Calcola la distanza totale del movimento usando il teorema di Pitagora
-                const moveDistance = Math.hypot(e.clientX - (rect.left + dragOffset.current.x), e.clientY - (rect.top + dragOffset.current.y));
+                const moveDistance = Math.hypot(clientX - (rect.left + dragOffset.current.x), clientY - (rect.top + dragOffset.current.y));
                 // Se il movimento è stato minimo, trattalo come un click
                 if (moveDistance < 5 && onToppyImageClick) {
                     onToppyImageClick();
@@ -427,22 +432,28 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
     /**
      * Effect per gestire gli event listener durante il trascinamento
      * Gli eventi sono registrati sul document per catturare il movimento
-     * anche quando il mouse esce dal componente
+     * anche quando il mouse o il touch esce dal componente
      */
     useEffect(() => {
         if (isDragging) {
+            // Eventi mouse per desktop
             document.addEventListener('mousemove', handleMouseMove);
             document.addEventListener('mouseup', handleMouseUp);
+            // Eventi touch per mobile
+            document.addEventListener('touchmove', handleMouseMove);
+            document.addEventListener('touchend', handleMouseUp);
             return () => {
                 document.removeEventListener('mousemove', handleMouseMove);
                 document.removeEventListener('mouseup', handleMouseUp);
+                document.removeEventListener('touchmove', handleMouseMove);
+                document.removeEventListener('touchend', handleMouseUp);
             };
         }
         return undefined;
     }, [isDragging]);
     // Renderizza l'overlay solo durante il drag
     const renderDragOverlay = isDragging && _jsx(DragOverlay, {});
-    const toppyContent = (_jsxs(_Fragment, { children: [renderDragOverlay, _jsxs(ToppyButton, { ref: buttonRef, "$align": align, "$isDragging": isDragging, "$x": position?.x, "$y": position?.y, "$isVisible": isVisible, "$isCollapsed": isCollapsed, "$isMobile": isMobile, "$usePortal": usePortal, onMouseDown: !isMobile ? handleMouseDown : undefined, onContextMenu: (e) => e.preventDefault(), onDoubleClick: !isMobile ? toggleCollapse : undefined, children: [(content && !isCollapsed) && (_jsx(ToppySpeechBubble, { ref: bubbleRef, align: align, onClose: toggleCollapse, children: content })), (content && isCollapsed) && (_jsx(ExpandButton, { onMouseDown: (e) => {
+    const toppyContent = (_jsxs(_Fragment, { children: [renderDragOverlay, _jsxs(ToppyButton, { ref: buttonRef, "$align": align, "$isDragging": isDragging, "$x": position?.x, "$y": position?.y, "$isVisible": isVisible, "$isCollapsed": isCollapsed, "$isMobile": isMobile, "$usePortal": usePortal, onMouseDown: !isMobile ? handleMouseDown : undefined, onTouchStart: isMobile ? handleTouchStart : undefined, onContextMenu: (e) => e.preventDefault(), onDoubleClick: !isMobile ? toggleCollapse : undefined, children: [(content && !isCollapsed) && (_jsx(ToppySpeechBubble, { ref: bubbleRef, align: align, onClose: toggleCollapse, children: content })), (content && isCollapsed) && (_jsx(ExpandButton, { onMouseDown: (e) => {
                             isExpandButtonDraggingRef.current = false;
                             expandButtonMouseDownPosRef.current = { x: e.clientX, y: e.clientY };
                         }, onMouseMove: (e) => {
@@ -464,7 +475,7 @@ const ToppyDraggableHelpCenter = ({ content, deviceType, align = 'right', onTopp
                             }
                             e.stopPropagation();
                             toggleCollapse(e);
-                        }, onContextMenu: (e) => e.preventDefault(), "aria-label": SDKUI_Localizator.Maximize, title: SDKUI_Localizator.Maximize, type: "button", children: _jsx(IconWindowMaximize, {}) })), _jsx("img", { src: Toppy, alt: "Toppy Help", draggable: false, onClick: isMobile ? toggleCollapse : undefined })] })] }));
+                        }, onContextMenu: (e) => e.preventDefault(), "aria-label": SDKUI_Localizator.Maximize, title: SDKUI_Localizator.Maximize, type: "button", children: _jsx(IconWindowMaximize, {}) })), _jsx("img", { src: Toppy, alt: "Toppy Help", draggable: false })] })] }));
     // Renderizza nel document.body usando un Portal se usePortal è true, altrimenti renderizza normalmente
     return usePortal ? ReactDOM.createPortal(toppyContent, document.body) : toppyContent;
 };

package/lib/components/features/documents/TMDcmtForm.d.ts

@@ -46,6 +46,7 @@ interface ITMDcmtFormProps {
         mid: number;
         value: string;
     }>;
+    openS4TViewer?: boolean;
     onOpenS4TViewerRequest?: (dcmtInfo: Array<DcmtInfo>, onRefreshSearchAsync?: (() => Promise<void>)) => void;
     s4TViewerDialogComponent?: React.ReactNode;
     enableDragDropOverlay?: boolean;

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

@@ -44,7 +44,7 @@ import TMCustomButton from '../../base/TMCustomButton';
 import ToppyDraggableHelpCenter from '../assistant/ToppyDraggableHelpCenter';
 let abortControllerLocal = new AbortController();
 //#endregion
-const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, showHeader = true, onSaveRecents, layoutMode = LayoutModes.Update, showBackButton = true, onClose, onSavedAsyncCallback, TID, DID, formMode = FormModes.Update, canNext, canPrev, count, itemIndex, onNext, onPrev, allowNavigation = true, allowRelations = true, isClosable = false, isExpertMode = SDKUI_Globals.userSettings.advancedSettings.expertMode === 1, showDcmtFormSidebar = true, invokedByTodo = false, titleModal, isModal = false, widthModal = "100%", heightModal = "100%", groupId, onWFOperationCompleted, onTaskCompleted, onTaskCreateRequest, inputFile = null, taskFormDialogComponent, taskMoreInfo, connectorFileSave = undefined, inputMids = [], onOpenS4TViewerRequest, s4TViewerDialogComponent, enableDragDropOverlay = false, passToSearch, isSharedDcmt = false, sharedSourceTID, sharedSourceDID, allowButtonsRefs = false, onReferenceClick, }) => {
+const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, showHeader = true, onSaveRecents, layoutMode = LayoutModes.Update, showBackButton = true, onClose, onSavedAsyncCallback, TID, DID, formMode = FormModes.Update, canNext, canPrev, count, itemIndex, onNext, onPrev, allowNavigation = true, allowRelations = true, isClosable = false, isExpertMode = SDKUI_Globals.userSettings.advancedSettings.expertMode === 1, showDcmtFormSidebar = true, invokedByTodo = false, titleModal, isModal = false, widthModal = "100%", heightModal = "100%", groupId, onWFOperationCompleted, onTaskCompleted, onTaskCreateRequest, inputFile = null, taskFormDialogComponent, taskMoreInfo, connectorFileSave = undefined, inputMids = [], openS4TViewer = false, onOpenS4TViewerRequest, s4TViewerDialogComponent, enableDragDropOverlay = false, passToSearch, isSharedDcmt = false, sharedSourceTID, sharedSourceDID, allowButtonsRefs = false, onReferenceClick, }) => {
     const [id, setID] = useState('');
     const [showWaitPanelLocal, setShowWaitPanelLocal] = useState(false);
     const [waitPanelTitleLocal, setWaitPanelTitleLocal] = useState('');
@@ -408,9 +408,11 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
     }, [inputMids, layoutMode, formData, formDataOrig]);
     // Memoizza solo il valore WI_SetID per evitare re-render quando altri metadata cambiano
     const workItemSetIDValue = useMemo(() => formData.find(o => o.md?.name === WorkItemMetadataNames.WI_SetID)?.value, [formData]);
+    // Valore derivato: true se formData ha elementi validi
+    const hasFormData = useMemo(() => formData.length > 0 && formData.some(md => md.mid && md.mid > 99), [formData]);
     useEffect(() => {
         const loadAllWfData = async () => {
-            if (layoutMode !== LayoutModes.Update || !DID) {
+            if (layoutMode !== LayoutModes.Update || !DID || fromDTD?.templateTID !== TemplateTIDs.WF_WIApprView) {
                 setWorkItems([]);
                 setWorkflows([]);
                 return;
@@ -460,7 +462,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                 setWorkflows(validWorkflows);
             }
             catch (error) {
-                console.error("Errore durante il caricamento dei dati del workflow:", error);
+                TMExceptionBoxManager.show({ exception: error });
                 setWorkItems([]);
                 setWorkflows([]);
             }
@@ -468,9 +470,14 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                 setIsWFDataLoading(false);
             }
         };
+        // Usa hasFormData invece di formDataRef.current
+        if (!hasFormData || !fromDTD?.id) {
+            // console.log("formData is empty or fromDTD not loaded, skipping loadAllWfData");
+            return;
+        }
         if (workItemSetIDValue !== undefined || workflowApproveData.length > 0)
             loadAllWfData();
-    }, [workItemSetIDValue, workflowApproveData, DID, layoutMode]);
+    }, [hasFormData, workItemSetIDValue, workflowApproveData, DID, layoutMode, fromDTD?.templateTID, fromDTD?.id]);
     const getSelectionDcmtInfo = useCallback(() => {
         let dcmts = [];
         dcmts.push({ TID: TID ?? 0, DID: DID ?? 0 });
@@ -1356,7 +1363,7 @@ const TMDcmtForm = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTa
                                                 isEditable: true,
                                                 value: FormulaHelper.addFormulaTag(newFormula.expression)
                                             }));
-                                        } }), showApprovePopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 0, onClose: () => setShowApprovePopup(false) }), showRejectPopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 1, onClose: () => setShowRejectPopup(false) }), showReAssignPopup && _jsx(WorkFlowReAssignPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowReAssignPopup(false) }), showMoreInfoPopup && _jsx(WorkFlowMoreInfoPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowMoreInfoPopup(false) }), (isModal && onClose) && _jsx("div", { id: "TMDcmtFormShowConfirmForClose-" + id })] }), _jsx(ToppyDraggableHelpCenter, { initialIsCollapsed: false, deviceType: deviceType, isVisible: showToppyForApprove || showToppyForCompleteMoreInfo || showToppyForReferences, content: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '10px' }, children: [showToppyForApprove && (workItems.length === 1 ?
+                                        } }), showApprovePopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 0, onClose: () => setShowApprovePopup(false) }), showRejectPopup && _jsx(WorkFlowApproveRejectPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, isReject: 1, onClose: () => setShowRejectPopup(false) }), showReAssignPopup && _jsx(WorkFlowReAssignPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowReAssignPopup(false) }), showMoreInfoPopup && _jsx(WorkFlowMoreInfoPopUp, { deviceType: deviceType, onCompleted: handleWFOperationCompleted, TID: approvalVID, DID: DID, onClose: () => setShowMoreInfoPopup(false) }), (isModal && onClose) && _jsx("div", { id: "TMDcmtFormShowConfirmForClose-" + id })] }), _jsx(ToppyDraggableHelpCenter, { initialIsCollapsed: false, deviceType: deviceType, isVisible: (showToppyForApprove || showToppyForCompleteMoreInfo || showToppyForReferences) && !openS4TViewer, content: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '10px' }, children: [showToppyForApprove && (workItems.length === 1 ?
                                         _jsx(WorkFlowOperationButtons, { deviceType: deviceType, onApprove: () => setShowApprovePopup(true), onSignApprove: handleSignApprove, onReject: () => setShowRejectPopup(true), onReAssign: () => setShowReAssignPopup(true), onMoreInfo: () => setShowMoreInfoPopup(true), dtd: fromDTD })
                                         :
                                             _jsxs("div", { style: { padding: 10, color: 'white', maxWidth: '180px', borderRadius: 10, background: '#1B1464 0% 0% no-repeat padding-box', border: '1px solid #FFFFFF' }, children: [`Devi approvare ${workItems.length} workitem(s) per questo documento.`, `Vai alla sezione di approvazione.`] })), showToppyForCompleteMoreInfo && (_jsxs(_Fragment, { children: [_jsx("div", { style: { padding: 10, color: 'white', maxWidth: '180px', borderRadius: 10, background: '#1B1464 0% 0% no-repeat padding-box', border: '1px solid #FFFFFF' }, children: `${SDKUI_Localizator.MoreInfoCompleteRequestSentBy} ${taskMoreInfo?.fromName}!` }), _jsx(TMButton, { caption: SDKUI_Localizator.CommentAndComplete, color: 'success', showTooltip: false, onClick: () => {

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

@@ -222,43 +222,37 @@ export const TMFileViewer = ({ fileBlob, isResizingActive }) => {
     if (fileBlob.type.includes('image')) {
         return (_jsx(ImageViewer, { fileBlob: fileBlob, alt: '' }));
     }
-    // Check if device has limited PDF support (only for mobile/tablet devices)
-    const hasLimitedPDFSupport = () => {
-        const userAgent = navigator.userAgent || navigator.vendor || window.opera;
-        // Only check for actual mobile/tablet devices, NOT desktop browsers
-        const isAndroidMobile = /android/i.test(userAgent) && (/mobile|tablet/i.test(userAgent) || window.screen.width <= 1024);
-        const isIOSMobile = /iphone|ipad|ipod/i.test(userAgent);
-        const isOtherMobile = /webos|blackberry|iemobile|opera mini/i.test(userAgent);
-        // Return true only for actual mobile devices, not desktop browsers
-        return isMobile && (isAndroidMobile || isIOSMobile || isOtherMobile);
-    };
-    if (fileType === 'application/pdf' && hasLimitedPDFSupport()) {
-        return (_jsxs("div", { style: {
-                padding: '40px',
-                textAlign: 'center',
-                display: 'flex',
-                flexDirection: 'column',
-                alignItems: 'center',
-                justifyContent: 'center',
-                height: '100%',
-                gap: '20px'
-            }, children: [_jsx(IconPreview, { fontSize: 96 }), _jsxs("div", { children: [_jsx("h3", { children: SDKUI_Localizator.PDFDocument }), _jsx("p", { children: SDKUI_Localizator.PreviewNotAvailableOnDevice })] }), _jsxs("div", { style: { display: 'flex', gap: '10px', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center' }, children: [_jsx("a", { href: blobUrl, download: "document.pdf", style: {
-                                minWidth: '180px',
-                                padding: '12px 24px',
-                                backgroundColor: TMColors.primaryColor,
-                                color: 'white',
-                                textDecoration: 'none',
-                                borderRadius: '4px',
-                                display: 'inline-block'
-                            }, children: SDKUI_Localizator.DownloadFile }), _jsx("a", { href: blobUrl, target: "_blank", rel: "noopener noreferrer", style: {
-                                minWidth: '180px',
-                                padding: '12px 24px',
-                                backgroundColor: TMColors.primaryColor,
-                                color: 'white',
-                                textDecoration: 'none',
-                                borderRadius: '4px',
-                                display: 'inline-block'
-                            }, children: SDKUI_Localizator.OpenInNewTab })] })] }));
+    if (fileType === 'application/pdf' && isMobile) {
+        return (_jsx("object", { data: blobUrl, type: "application/pdf", width: "100%", height: "100%", style: {
+                border: 'none',
+                zIndex: 0,
+                pointerEvents: isResizingActive === true ? "none" : "auto"
+            }, children: _jsxs("div", { style: {
+                    padding: '40px',
+                    textAlign: 'center',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    height: '100%',
+                    gap: '20px'
+                }, children: [_jsx(IconPreview, { fontSize: 96 }), _jsxs("div", { children: [_jsx("h3", { children: SDKUI_Localizator.PDFDocument }), _jsx("p", { children: SDKUI_Localizator.PreviewNotAvailableOnDevice })] }), _jsxs("div", { style: { display: 'flex', gap: '10px', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center' }, children: [_jsx("a", { href: blobUrl, download: "document.pdf", style: {
+                                    minWidth: '180px',
+                                    padding: '12px 24px',
+                                    backgroundColor: TMColors.primaryColor,
+                                    color: 'white',
+                                    textDecoration: 'none',
+                                    borderRadius: '4px',
+                                    display: 'inline-block'
+                                }, children: SDKUI_Localizator.DownloadFile }), _jsx("a", { href: blobUrl, target: "_blank", rel: "noopener noreferrer", style: {
+                                    minWidth: '180px',
+                                    padding: '12px 24px',
+                                    backgroundColor: TMColors.primaryColor,
+                                    color: 'white',
+                                    textDecoration: 'none',
+                                    borderRadius: '4px',
+                                    display: 'inline-block'
+                                }, children: SDKUI_Localizator.OpenInNewTab })] })] }) }, blobUrl));
     }
     return (_jsx("iframe", { srcDoc: formattedXml ? `<html><body>${formattedXml}</body></html>` : undefined, src: !formattedXml
             ? (fileType === 'application/pdf' ? `${blobUrl}#view=FitH&scrollbar=1` : blobUrl)

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

@@ -176,7 +176,7 @@ const TMSavedQuerySelector = React.memo(({ items, selectedId, allowShowSearch =
             TMExceptionBoxManager.show({ exception: ex });
         }
     };
-    return (_jsxs("div", { style: { height: height ?? '100%', width: '100%', display: 'flex', flexDirection: 'column', gap: '5px', paddingTop: allowShowSearch ? '5px' : undefined }, children: [allowShowSearch &&
+    return (_jsxs("div", { onContextMenu: (e) => e.preventDefault(), style: { height: height ?? '100%', width: '100%', display: 'flex', flexDirection: 'column', gap: '5px', paddingTop: allowShowSearch ? '5px' : undefined }, children: [allowShowSearch &&
                 _jsx("div", { style: { width: '100%', display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '10px', paddingBottom: '10px', paddingTop: '10px' }, children: _jsx(TMSearchBar, { marginLeft: '0px', maxWidth: '300px', searchValue: searchText, onSearchValueChanged: (e) => setSearchText(e) }) }), _jsx("div", { style: {
                     display: 'flex',
                     flexDirection: 'column',

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

@@ -314,7 +314,7 @@ const TMSearchQueryPanel = ({ fromDTD, showBackToResultButton, isExpertMode = SD
                                 { icon: _jsx(IconMenuCAArchive, { viewBox: '11 11.5 26 27', fontSize: 16, strokeWidth: 2, color: 'black' }), beginGroup: true, text: SDKUI_Localizator.PassToArchive, onClick: handlePassToArchive }
                             ], onMenuShown: () => setIsQueryPanelActive(true) })
                         : _jsx(_Fragment, {}) }), children: [_jsx(ConfirmQueryParamsDialog, {}), SQD
-                        ? _jsxs("div", { style: { height: '100%', width: '100%', position: 'relative', display: 'flex', flexDirection: 'column', gap: 5 }, children: [showAdvancedSearch
+                        ? _jsxs("div", { onContextMenu: (e) => e.preventDefault(), style: { height: '100%', width: '100%', position: 'relative', display: 'flex', flexDirection: 'column', gap: 5 }, children: [showAdvancedSearch
                                     ? _jsx(TMQueryEditor, { formMode: FormModes.Update, showToolbar: false, inputData: qd, validateSelect: true, showApply: false, onQDChanged: handleQdChanged })
                                     : _jsx(TMSearchQueryEditor, { qd: qd, dcmtTypesList: dcmtTypesList, isExpertMode: isExpertMode, showAllMdWhere: showAllMdWhere, onQdChanged: handleQdChanged, onFocusedMetadataChanged: setFocusedTidMid, onAdvancedMenuClick: handleAdvancedMenuClick }), _jsxs("div", { style: {
                                         display: 'flex',