@topconsultnpm/sdkui-react-beta 6.15.92 → 6.15.94

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

@@ -51,6 +51,8 @@ export declare const StyledBtnLoadChart: import("styled-components/dist/types").
 }>> & string;
 export declare const StyledFormButtonsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledToolbarCardContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledSpinner: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledLoadingContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledAnimatedComponentScaleColor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $delay?: string;
     $scale?: number;

package/lib/components/base/Styled.js

@@ -252,6 +252,30 @@ export const StyledToolbarCardContainer = styled.div `
     flex-direction: column; 
     gap: 10px; 
 `;
+const spinAnimation = keyframes `
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+`;
+export const StyledSpinner = styled.div `
+  border: 4px solid #f3f3f3; /* Light grey */
+  border-top: 4px solid #C2388B; /* Colore primario della toolbar */
+  border-radius: 50%;
+  width: 40px;
+  height: 40px;
+  animation: ${spinAnimation} 1s linear infinite;
+`;
+export const StyledLoadingContainer = styled.div `
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 15px;
+  font-size: 1rem;
+  color: #555;
+`;
 //#region  Animations
 const scaleAndColorChange = (scaleValue) => keyframes `
   0% { transform: scale(1); color: white; }

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

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from 'react';
 import TMDcmtPreview from './TMDcmtPreview';
-import { AccessLevels, ArchiveConstraints, ArchiveEngineByID, DcmtTypeListCacheService, LayoutModes, MetadataDataTypes, ResultTypes, SDK_Globals, SDK_Localizator, SystemMIDsAsNumber, SystemTIDs, Task_States, TemplateTIDs, TID_DID, UpdateEngineByID, ValidationItem, WorkflowCacheService, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts-beta';
+import { AccessLevels, ArchiveConstraints, ArchiveEngineByID, DcmtTypeListCacheService, LayoutModes, MetadataDataTypes, ResultTypes, SDK_Globals, SDK_Localizator, SystemMIDsAsNumber, SystemTIDs, Task_States, TemplateTIDs, UpdateEngineByID, ValidationItem, WorkflowCacheService, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts-beta';
 import { ContextMenu } from 'devextreme-react';
 import { WorkFlowApproveRejectPopUp, WorkFlowMoreInfoPopUp, WorkFlowOperationButtons, WorkFlowReAssignPopUp } from '../workflow/TMWorkflowPopup';
 import { DownloadTypes, FormModes } from '../../../ts';
@@ -11,7 +11,7 @@ import { handleArchiveVisibility, searchResultToMetadataValues } from '../../../
 import { genUniqueId, IconShow, SDKUI_Localizator, updateMruTids, IconBoard, IconDcmtTypeSys, IconDetailDcmts, svgToString, IconDownload, calcIsModified, IconMenuVertical, Globalization, getListMaxItems, getSystemMetadata, IconBoxArchiveIn, IconClear, IconUndo, SDKUI_Globals, IconPreview, isTaskMoreInfo, IconWorkflow, IconZoomIn, IconZoomOut } from '../../../helper';
 import { hasDetailRelations, hasMasterRelations, isXMLFileExt } from '../../../helper/dcmtsHelper';
 import { Gutters, TMColors } from '../../../utils/theme';
-import { StyledClickableIconWrapper, StyledFormButtonsContainer, StyledModalContainer, StyledToolbarCardContainer } from '../../base/Styled';
+import { StyledClickableIconWrapper, StyledFormButtonsContainer, StyledLoadingContainer, StyledModalContainer, StyledSpinner, StyledToolbarCardContainer } from '../../base/Styled';
 import ShowAlert from '../../base/TMAlert';
 import TMButton from '../../base/TMButton';
 import { TMExceptionBoxManager, TMMessageBoxManager, ButtonNames } from '../../base/TMPopUp';
@@ -70,6 +70,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
     const [focusedMetadataValue, setFocusedMetadataValue] = useState();
     const [showAll, setShowAll] = useState(layoutMode === LayoutModes.Ark);
     const [fetchError, setFetchError] = useState(false);
+    const [isWFDataLoading, setIsWFDataLoading] = useState(false);
     const [workItems, setWorkItems] = useState([]);
     const [workflows, setWorkflows] = useState([]);
     const [showCommentForm, setShowCommentForm] = useState(false);
@@ -210,27 +211,32 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
             return;
         if (!DID) {
             setWorkItems([]);
+            setWorkflows([]); // Assicurati di pulire anche i workflows
             return;
         }
+        setIsWFDataLoading(true);
         let items = [];
-        // Cerchiamo tutti i workitem(S) associati al DID corrente (potrebbero esserci più istanze di workflow)
+        // Cerchiamo tutti i workitem(S) associati al DID corrente...
         for (const workflow of workflowApproveData) {
             for (const dataRow of workflow.dtdResult?.rows ?? []) {
                 let did = Number(dataRow?.[1]);
                 if (did === Number(DID)) {
-                    let w = new TID_DID();
-                    w.tid = Number(dataRow?.[0]);
-                    w.did = did;
+                    const index = workflow.dtdResult?.columns?.findIndex(o => o.caption === WorkItemMetadataNames.WI_SetID);
+                    const setID = (index && index >= 0) ? dataRow[index] : undefined;
+                    let w = { tid: Number(dataRow?.[0]), did: did, setID: setID };
                     items.push(w);
                 }
             }
         }
-        setWorkItems(items);
-        // Attendi tutte le chiamate async e aggiorna lo stato solo quando tutte sono terminate
+        // Attendi tutte le chiamate async...
         Promise.all(items.map(item => WorkflowCacheService.GetWFInfoAsync(item.tid)))
             .then(results => {
             // Filtra solo i workflow validi
             setWorkflows(results.filter(Boolean));
+        })
+            .finally(() => {
+            setWorkItems(items);
+            setIsWFDataLoading(false);
         });
     }, [workflowApproveData, DID, layoutMode]);
     const getSelectionDcmtInfo = () => {
@@ -480,6 +486,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
     };
     const isMobile = deviceType === DeviceType.MOBILE;
     const isApprView = fromDTD?.templateTID === TemplateTIDs.WF_WIApprView;
+    const WIsetIdValue = workItems.find(o => o.did === Number(DID))?.setID || formData.find(o => o.md?.name === WorkItemMetadataNames.WI_SetID)?.value;
     useEffect(() => {
         if ((isApprView || TID === SystemTIDs.Drafts) && !showAll)
             setShowAll(true);
@@ -507,10 +514,30 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
             setDcmtFile(setFile);
         } }), [currentDcmt, dcmtFile, deviceType, fromDTD, layoutMode, inputFile]);
     const tmWF = useMemo(() => {
-        return (_jsxs("div", { style: { position: 'relative', width: '100%', height: '100%' }, children: [_jsx(WFDiagram, { xmlDiagramString: workflows?.[0]?.diagram || '', currentSetID: formData.find(o => o.md?.name === WorkItemMetadataNames.WI_SetID)?.value, readOnly: true, zoomLevel: zoomLevel, translateX: 0, translateY: 0 }), _jsxs("div", { style: {
+        if (isWFDataLoading) {
+            return (_jsx("div", { style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    width: '100%',
+                    height: '100%',
+                    minHeight: '200px' // Evita salti nel layout
+                }, children: _jsxs(StyledLoadingContainer, { children: [_jsx(StyledSpinner, {}), _jsx("span", { children: `${'Caricamento dati workflow'}...` })] }) }));
+        }
+        return (_jsxs("div", { style: { position: 'relative', width: '100%', height: '100%', display: 'flex', flexDirection: 'column', gap: 3 }, children: [workItems.length > 0
+                    ? _jsx(WFDiagram, { xmlDiagramString: workflows?.[0]?.diagram || '', currentSetID: WIsetIdValue, readOnly: true, zoomLevel: zoomLevel, translateX: 0, translateY: 0 })
+                    : _jsx("div", { style: {
+                            position: 'absolute',
+                            top: '50%',
+                            left: '50%',
+                            transform: 'translate(-50%, -50%)',
+                            fontSize: '1.1rem',
+                            color: TMColors.primaryColor,
+                            textAlign: 'center',
+                        }, children: SDKUI_Localizator.WorkflowNoInstances }), workItems.length > 0 && _jsxs("div", { style: {
                         position: 'absolute',
                         left: 16,
-                        bottom: 16,
+                        bottom: WIsetIdValue || workItems.length <= 0 ? 16 : 64,
                         display: 'flex',
                         flexDirection: 'row',
                         background: 'transparent linear-gradient(180deg, #E03A8B 9%, #C2388B 34%, #A63B8D 60%, #943C8D 83%, #8F3C8D 100%) 0% 0% no-repeat padding-box',
@@ -529,8 +556,13 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
                                 alignItems: 'center',
                                 padding: '0 8px',
                                 borderRadius: 4
-                            }, children: formattedZoomLevel })] })] }));
-    }, [workflows, formData, zoomLevel, handleZoomIn, handleZoomOut]);
+                            }, children: formattedZoomLevel })] }), !WIsetIdValue && workItems.length > 0 &&
+                    _jsx("div", { style: {
+                            padding: 5,
+                            backgroundColor: 'khaki',
+                            borderRadius: 8
+                        }, children: SDKUI_Localizator.WorkItemTechnicalNote_SetID })] }));
+    }, [workflows, formData, WIsetIdValue, workItems, zoomLevel, handleZoomIn, handleZoomOut]);
     const normalizedTID = TID !== undefined ? Number(TID) : undefined;
     const defaultPanelDimensions = {
         'tmDcmtForm': { width: '20%', height: '100%' },

package/lib/components/features/workflow/diagram/WFDiagram.js

@@ -8,9 +8,10 @@ import ConnectionComponent from './ConnectionComponent';
 import DiagramItemComponent from './DiagramItemComponent';
 import DiagramItemSvgContent from './DiagramItemSvgContent';
 import { calculateArrowAngle, getConnectionPoint, isConnectionNonLinear, validateDiagram } from './workflowHelpers';
-import { IconFlowChart, IconUndo, IconRestore, IconAdjust, IconCopy, IconCut, IconPaste, IconPin, IconUnpin, IconChevronRight, IconCloseOutline, IconNew } from '../../../../helper';
+import { IconFlowChart, IconUndo, IconRestore, IconAdjust, IconCopy, IconCut, IconPaste, IconPin, IconUnpin, IconChevronRight, IconCloseOutline, IconNew, SDKUI_Localizator } from '../../../../helper';
 import TMModal from '../../../base/TMModal';
 import { TMExceptionBoxManager } from '../../../base/TMPopUp';
+import { StyledLoadingContainer, StyledSpinner } from '../../../base/Styled';
 const CanvasContainer = styled.div `
   position: relative;
   width: 100%;
@@ -201,6 +202,7 @@ const DiagramMessage = styled.div `
   text-align: center;
 `;
 const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel = 1, translateX = 0, translateY = 0 }) => {
+    const [isLoading, setIsLoading] = useState(true);
     const [wfDiagram, setWfDiagram] = useState(null);
     const [selectedItems, setSelectedItems] = useState(new Set());
     const [selectedConnections, setSelectedConnections] = useState(new Set());
@@ -265,18 +267,33 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel
         return { svgWidth: Math.max(0, totalWidth * zoomLevel), svgHeight: Math.max(0, totalHeight * zoomLevel) };
     }, [wfDiagram, zoomLevel]);
     useEffect(() => {
-        let newDiagram = null;
-        if (xmlDiagramString) {
-            newDiagram = parseWfDiagramXml(xmlDiagramString);
-            if (newDiagram) {
-                // Applica l'auto-aggiustamento subito dopo il parsing
-                newDiagram = autoAdjustDiagram(newDiagram);
+        setIsLoading(true); // Imposta il caricamento all'avvio dell'effetto
+        const processDiagram = () => {
+            try {
+                let newDiagram = null;
+                if (xmlDiagramString) {
+                    newDiagram = parseWfDiagramXml(xmlDiagramString);
+                    if (newDiagram) {
+                        newDiagram = autoAdjustDiagram(newDiagram);
+                    }
+                }
+                setWfDiagram(newDiagram);
+                initialDiagramRef.current = newDiagram;
+                setWfDiagramHistory(newDiagram ? [newDiagram] : []);
+                setHistoryIndex(newDiagram ? 0 : -1);
             }
-        }
-        setWfDiagram(newDiagram);
-        initialDiagramRef.current = newDiagram;
-        setWfDiagramHistory(newDiagram ? [newDiagram] : []);
-        setHistoryIndex(newDiagram ? 0 : -1);
+            catch (error) {
+                console.error("Errore durante l'elaborazione del diagramma:", error);
+                setWfDiagram(null); // Assicurati che il diagramma sia nullo in caso di errore
+            }
+            finally {
+                setIsLoading(false); // Termina il caricamento, sia in caso di successo che di errore
+            }
+        };
+        // Utilizziamo un timeout di 0ms per consentire a React di renderizzare lo stato di caricamento
+        // prima di eseguire il calcolo potenzialmente pesante, evitando che il browser si blocchi.
+        const timerId = setTimeout(processDiagram, 0);
+        return () => clearTimeout(timerId); // Pulisce il timeout se il componente viene smontato
     }, [xmlDiagramString]);
     useEffect(() => {
         if (isUndoingRedoing.current) {
@@ -1322,7 +1339,7 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel
             // DiagramItemTypes.SignAndTimeStamp
         ];
     }, []);
-    return (_jsxs(CanvasContainer, { children: [!readOnly && (_jsxs(ToolbarContainer, { "$isCollapsed": isToolbarCollapsed, "$isFloating": isToolbarFloating, "$isToolboxVisible": isToolboxVisible, children: [_jsx(ButtonGroup, { "$isFloating": isToolbarFloating, children: _jsxs("button", { onClick: handleToggleToolboxVisibility, title: "Show toolbox", children: [_jsx(IconFlowChart, {}), !isToolbarCollapsed && _jsx("span", { children: "Mostra/nascondi toolbox" })] }) }), _jsxs(ButtonGroup, { "$isFloating": isToolbarFloating, children: [_jsxs("button", { onClick: handleUndo, disabled: historyIndex === 0, title: "Undo", children: [_jsx(IconUndo, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Undo" })] }), _jsxs("button", { onClick: handleRedo, disabled: historyIndex === wfDiagramHistory.length - 1, title: "Redo", children: [_jsx(IconUndo, { style: { transform: 'scaleX(-1)' } }), " ", !isToolbarCollapsed && _jsx("span", { children: "Redo" })] }), _jsxs("button", { onClick: handleRestore, title: "Restore", children: [_jsx(IconRestore, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Restore" })] }), _jsxs("button", { onClick: handleNew, title: "New diagram", disabled: readOnly, children: [_jsx(IconNew, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "New" })] })] }), _jsx(ButtonGroup, { "$isFloating": isToolbarFloating, children: _jsxs("button", { onClick: handleAutoAdjust, title: "Auto adjust", children: [_jsx(IconAdjust, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Auto Adjust" })] }) }), _jsxs(ButtonGroup, { "$isFloating": isToolbarFloating, children: [_jsxs("button", { onClick: handleCopy, disabled: selectedItems.size === 0, title: "Copy", children: [_jsx(IconCopy, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Copy" })] }), _jsxs("button", { onClick: handleCut, disabled: selectedItems.size === 0, title: "Cut", children: [_jsx(IconCut, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Cut" })] }), _jsxs("button", { onClick: handlePaste, disabled: copiedItems.length === 0 && copiedConnections.length === 0, title: "Paste", children: [_jsx(IconPaste, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Paste" })] })] }), _jsxs("button", { onClick: handleToggleToolbarMode, title: isToolbarFloating ? "Dock Toolbar" : "Float Toolbar", children: [isToolbarFloating ? _jsx(IconPin, {}) : _jsx(IconUnpin, {}), !isToolbarCollapsed && !isToolbarFloating && _jsx("span", { children: "Toggle Mode" })] }), !isToolbarFloating && _jsx(ToolbarToggle, { onClick: () => setIsToolbarCollapsed(!isToolbarCollapsed), title: isToolbarCollapsed ? "Expand Toolbar" : "Collapse Toolbar", children: isToolbarCollapsed ? _jsx(IconChevronRight, {}) : _jsx(IconCloseOutline, {}) })] })), !readOnly && (_jsx(ToolboxContainer, { "$isVisible": isToolboxVisible, children: isToolboxVisible && availableItemTypes.map(type => (_jsxs(ToolboxItem, { draggable: true, onDragStart: (e) => handleToolboxDragStart(e, type), onDragEnd: handleToolboxDragEnd, children: [_jsx(DiagramItemSvgContent, { itemType: type, width: 40, height: 40, isToolboxPreview: true }), _jsx("span", { children: DiagramItemTypes[type] })] }, type))) })), _jsx(SvgScrollContainer, { children: wfDiagram ? (_jsx(StyledSvg, { ref: svgRef, onMouseMove: handleMouseMove, onMouseUp: handleMouseUp, onMouseDown: handleMouseDown, onDrop: handleDropOnCanvas, onDragOver: handleDragOver, width: svgWidth, height: svgHeight, children: _jsxs(ScalableGroup, { "$scale": zoomLevel, "$translateX": translateX, "$translateY": translateY, children: [wfDiagram?.DiagramItems.map(item => (_jsx(DiagramItemComponent, { readOnly: readOnly, item: item, isSelected: selectedItems.has(item.ID), isCurrent: item.ID === currentSetID, onClick: handleDiagramItemClick, onDrag: handleDrag, onDragEnd: handleDragEnd, onConnectorMouseDown: handleConnectorMouseDown, onConnectorMouseUp: handleConnectorMouseUp, onDimensionsChange: handleItemDimensionsChange, onDoubleClick: handleDoubleClickItem }, item.ID))), calculatedConnections.map(connection => {
+    return (_jsxs(CanvasContainer, { children: [!readOnly && (_jsxs(ToolbarContainer, { "$isCollapsed": isToolbarCollapsed, "$isFloating": isToolbarFloating, "$isToolboxVisible": isToolboxVisible, children: [_jsx(ButtonGroup, { "$isFloating": isToolbarFloating, children: _jsxs("button", { onClick: handleToggleToolboxVisibility, title: "Show toolbox", children: [_jsx(IconFlowChart, {}), !isToolbarCollapsed && _jsx("span", { children: "Mostra/nascondi toolbox" })] }) }), _jsxs(ButtonGroup, { "$isFloating": isToolbarFloating, children: [_jsxs("button", { onClick: handleUndo, disabled: historyIndex === 0, title: "Undo", children: [_jsx(IconUndo, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Undo" })] }), _jsxs("button", { onClick: handleRedo, disabled: historyIndex === wfDiagramHistory.length - 1, title: "Redo", children: [_jsx(IconUndo, { style: { transform: 'scaleX(-1)' } }), " ", !isToolbarCollapsed && _jsx("span", { children: "Redo" })] }), _jsxs("button", { onClick: handleRestore, title: "Restore", children: [_jsx(IconRestore, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Restore" })] }), _jsxs("button", { onClick: handleNew, title: "New diagram", disabled: readOnly, children: [_jsx(IconNew, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "New" })] })] }), _jsx(ButtonGroup, { "$isFloating": isToolbarFloating, children: _jsxs("button", { onClick: handleAutoAdjust, title: "Auto adjust", children: [_jsx(IconAdjust, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Auto Adjust" })] }) }), _jsxs(ButtonGroup, { "$isFloating": isToolbarFloating, children: [_jsxs("button", { onClick: handleCopy, disabled: selectedItems.size === 0, title: "Copy", children: [_jsx(IconCopy, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Copy" })] }), _jsxs("button", { onClick: handleCut, disabled: selectedItems.size === 0, title: "Cut", children: [_jsx(IconCut, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Cut" })] }), _jsxs("button", { onClick: handlePaste, disabled: copiedItems.length === 0 && copiedConnections.length === 0, title: "Paste", children: [_jsx(IconPaste, {}), " ", !isToolbarCollapsed && _jsx("span", { children: "Paste" })] })] }), _jsxs("button", { onClick: handleToggleToolbarMode, title: isToolbarFloating ? "Dock Toolbar" : "Float Toolbar", children: [isToolbarFloating ? _jsx(IconPin, {}) : _jsx(IconUnpin, {}), !isToolbarCollapsed && !isToolbarFloating && _jsx("span", { children: "Toggle Mode" })] }), !isToolbarFloating && _jsx(ToolbarToggle, { onClick: () => setIsToolbarCollapsed(!isToolbarCollapsed), title: isToolbarCollapsed ? "Expand Toolbar" : "Collapse Toolbar", children: isToolbarCollapsed ? _jsx(IconChevronRight, {}) : _jsx(IconCloseOutline, {}) })] })), !readOnly && (_jsx(ToolboxContainer, { "$isVisible": isToolboxVisible, children: isToolboxVisible && availableItemTypes.map(type => (_jsxs(ToolboxItem, { draggable: true, onDragStart: (e) => handleToolboxDragStart(e, type), onDragEnd: handleToolboxDragEnd, children: [_jsx(DiagramItemSvgContent, { itemType: type, width: 40, height: 40, isToolboxPreview: true }), _jsx("span", { children: DiagramItemTypes[type] })] }, type))) })), _jsx(SvgScrollContainer, { children: isLoading ? (_jsxs(StyledLoadingContainer, { children: [_jsx(StyledSpinner, {}), _jsx("span", { children: `${'Caricamento diagramma'}...` })] })) : wfDiagram ? (_jsx(StyledSvg, { ref: svgRef, onMouseMove: handleMouseMove, onMouseUp: handleMouseUp, onMouseDown: handleMouseDown, onDrop: handleDropOnCanvas, onDragOver: handleDragOver, width: svgWidth, height: svgHeight, children: _jsxs(ScalableGroup, { "$scale": zoomLevel, "$translateX": translateX, "$translateY": translateY, children: [wfDiagram?.DiagramItems.map(item => (_jsx(DiagramItemComponent, { readOnly: readOnly, item: item, isSelected: selectedItems.has(item.ID), isCurrent: item.ID === currentSetID, onClick: handleDiagramItemClick, onDrag: handleDrag, onDragEnd: handleDragEnd, onConnectorMouseDown: handleConnectorMouseDown, onConnectorMouseUp: handleConnectorMouseUp, onDimensionsChange: handleItemDimensionsChange, onDoubleClick: handleDoubleClickItem }, item.ID))), calculatedConnections.map(connection => {
                                 const sourceItem = wfDiagram?.DiagramItems.find(item => item.ID === connection.Source.ParentDiagramItem.ID);
                                 const sinkItem = wfDiagram?.DiagramItems.find(item => item.ID === connection.Sink.ParentDiagramItem.ID);
                                 if (!sourceItem || !sinkItem)
@@ -1334,6 +1351,6 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel
                                 const isThisConnectionBeingDragged = isDraggingExistingConnectionEndpoint && draggingConnectionId === connection.ID;
                                 return (_jsx(ConnectionComponent, { connection: connection, isSelected: selectedConnections.has(connection.ID), sourcePoint: sourcePoint, sinkPoint: sinkPoint, isTemporary: isThisConnectionBeingDragged, onClick: handleConnectionClick, onConnectionEndpointMouseDown: handleConnectionEndpointMouseDown }, connection.ID));
                             }), isDrawingConnection && tempConnectionPathData && (_jsx(TempConnectionPath, { d: tempConnectionPathData })), isDraggingExistingConnectionEndpoint && tempConnectionPathData && (_jsx(TempConnectionPath, { d: tempConnectionPathData })), isDrawingSelectionRect && currentSelectionRect && (_jsx(SelectionRect, { x: currentSelectionRect.x, y: currentSelectionRect.y, width: currentSelectionRect.width, height: currentSelectionRect.height }))] }) }))
-                    : (_jsx(DiagramMessage, { children: "Diagramma non presente o non valido..." })) }), isModalOpen && itemToEdit && (_jsx(TMModal, { title: DiagramItemTypes[itemToEdit.Type].toString(), onClose: handleCloseModal, isModal: true, width: '50%', height: '50%', children: _jsx("div", { children: itemToEdit.ItemName }) }))] }));
+                    : (_jsx(DiagramMessage, { children: `${SDKUI_Localizator.WorkflowDiagramMissingOrInvalid} ...` })) }), isModalOpen && itemToEdit && (_jsx(TMModal, { title: DiagramItemTypes[itemToEdit.Type].toString(), onClose: handleCloseModal, isModal: true, width: '50%', height: '50%', children: _jsx("div", { children: itemToEdit.ItemName }) }))] }));
 };
 export default WFDiagram;

package/lib/components/forms/TMChooserForm.js

@@ -86,8 +86,8 @@ const TMChooserForm = ({ children, title, allowMultipleSelection = false, allowA
             ...summaryItems ?? {}
         });
     }, [manageUseLocalizedName, summaryItems]);
-    return (_jsx(TMModal, { title: renderTitle(), width: width ?? '550px', height: height ?? '600px', toolbar: _jsx(ToolbarButtons, {}), onClose: onClose, children: (children ??
-            filteredItems.length > 0)
+    return (_jsx(TMModal, { title: renderTitle(), width: width ?? '550px', height: height ?? '600px', toolbar: _jsx(ToolbarButtons, {}), onClose: onClose, children: children ??
+            filteredItems.length > 0
             ? _jsx(TMDataGrid, { dataSource: filteredItems, keyExpr: keyName, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selectedRowKeys: selectedRowKeys, headerFilter: { visible: true }, selection: { mode: allowMultipleSelection ? 'multiple' : 'single', showCheckBoxesMode: 'always', selectAllMode: 'allPages' }, grouping: allowGrouping ? { autoExpandAll: false, expandMode: 'rowClick' } : undefined, summary: customSummary, onFocusedRowChanged: handleFocusedRowChange, onSelectionChanged: handleSelectionChanged, onRowDblClick: handleRowDoubleClick })
             : _jsx(TMLayoutContainer, { gap: 30, alignItems: 'center', justifyContent: 'center', children: _jsx(TMLayoutItem, { children: _jsx("p", { style: { height: "100%", color: TMColors.primaryColor, fontSize: "1.5rem", display: 'flex', alignItems: 'center', justifyContent: 'center' }, children: SDKUI_Localizator.NoDataToDisplay }) }) }) }));
 };

package/lib/helper/SDKUI_Localizator.d.ts

@@ -518,11 +518,14 @@ export declare class SDKUI_Localizator {
     static get Warning(): "Warnung" | "Warning" | "advertencia" | "avertissement" | "aviso" | "Avviso";
     static get WelcomeTo(): "Willkommen bei {{0}}" | "Welcome to {{0}}" | "Bienvenido a {{0}}" | "Bienvenue sur {{0}}" | "Bem-vindo à {{0}}" | "Benvenuto su {{0}}";
     static get WorkflowApproval(): "Workflow-Genehmigung" | "Workflow approval" | "Aprobación de flujo de trabajo" | "Approbation de workflow" | "Aprovação de fluxo de trabalho" | "Approvazione workflow";
+    static get WorkflowDiagramMissingOrInvalid(): "Diagramm fehlt oder ist ungültig" | "Diagram missing or invalid" | "Diagrama no presente o no válido" | "Schéma manquant ou invalide" | "Diagrama ausente ou inválido" | "Diagramma non presente o non valido";
+    static get WorkflowNoInstances(): "Keine Instanzen aktiv" | "No running instances" | "Ninguna instancia en curso" | "Aucune instance en cours" | "Nenhuma instância em execução" | "Nessuna istanza in corso";
     static get WorkGroup(): "Arbeitsgruppe" | "Work Group" | "Grupo de Trabajo" | "Groupe de travail" | "Grupo de Trabalho" | "Gruppo di lavoro";
     static get WorkgroupOperations(): string;
     static get WorkingGroups(): "Arbeitsgruppen" | "Work groups" | "Grupos de trabajo" | "Groupes de travail" | "Grupos de trabalho" | "Gruppi di lavoro";
     static get WorkItemData(): string;
     static get WorkItemTechnicalData(): string;
+    static get WorkItemTechnicalNote_SetID(): "Um den Standort des Prozesses zu erfahren, fügen Sie das technische Metadatum \"SetID\" zur Freigabeansicht hinzu." | "To find the location of the process, add the technical metadata \"SetID\" to the approval view." | "Para conocer la ubicación del proceso, añada el metadato técnico \"SetID\" a la vista de aprobación." | "Pour connaître l'emplacement du processus, ajoutez la métadonnée technique \"SetID\" à la vue d'approbation." | "Para saber a localização do processo, adicione o metadado técnico \"SetID\" à vista de aprovação." | "Per conoscere il punto in cui si trova il processo, aggiungere il metadato tecnico \"SetID\" alla vista approvativa.";
     static get WorkitemApprove(): string;
     static get WorkitemReject(): string;
     static get WorkitemReassign(): string;

package/lib/helper/SDKUI_Localizator.js

@@ -5145,6 +5145,26 @@ export class SDKUI_Localizator {
             default: return "Approvazione workflow";
         }
     }
+    static get WorkflowDiagramMissingOrInvalid() {
+        switch (this._cultureID) {
+            case CultureIDs.De_DE: return "Diagramm fehlt oder ist ungültig";
+            case CultureIDs.En_US: return "Diagram missing or invalid";
+            case CultureIDs.Es_ES: return "Diagrama no presente o no válido";
+            case CultureIDs.Fr_FR: return "Schéma manquant ou invalide";
+            case CultureIDs.Pt_PT: return "Diagrama ausente ou inválido";
+            default: return "Diagramma non presente o non valido";
+        }
+    }
+    static get WorkflowNoInstances() {
+        switch (this._cultureID) {
+            case CultureIDs.De_DE: return "Keine Instanzen aktiv";
+            case CultureIDs.En_US: return "No running instances";
+            case CultureIDs.Es_ES: return "Ninguna instancia en curso";
+            case CultureIDs.Fr_FR: return "Aucune instance en cours";
+            case CultureIDs.Pt_PT: return "Nenhuma instância em execução";
+            default: return "Nessuna istanza in corso";
+        }
+    }
     static get WorkGroup() {
         switch (this._cultureID) {
             case CultureIDs.De_DE: return "Arbeitsgruppe";
@@ -5195,6 +5215,16 @@ export class SDKUI_Localizator {
             default: return "Dati tecnici del WorkItem"; // Italian (default)
         }
     }
+    static get WorkItemTechnicalNote_SetID() {
+        switch (this._cultureID) {
+            case CultureIDs.De_DE: return "Um den Standort des Prozesses zu erfahren, fügen Sie das technische Metadatum \"SetID\" zur Freigabeansicht hinzu.";
+            case CultureIDs.En_US: return "To find the location of the process, add the technical metadata \"SetID\" to the approval view.";
+            case CultureIDs.Es_ES: return "Para conocer la ubicación del proceso, añada el metadato técnico \"SetID\" a la vista de aprobación.";
+            case CultureIDs.Fr_FR: return "Pour connaître l'emplacement du processus, ajoutez la métadonnée technique \"SetID\" à la vue d'approbation.";
+            case CultureIDs.Pt_PT: return "Para saber a localização do processo, adicione o metadado técnico \"SetID\" à vista de aprovação.";
+            default: return "Per conoscere il punto in cui si trova il processo, aggiungere il metadato tecnico \"SetID\" alla vista approvativa.";
+        }
+    }
     static get WorkitemApprove() {
         switch (this._cultureID) {
             case CultureIDs.De_DE: return "Arbeitselement genehmigen";

package/package.json

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