@topconsultnpm/sdkui-react 6.20.0-dev1.6 → 6.20.0-dev1.60

package/lib/components/features/workflow/TMWorkflowPopup.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
-import { Priorities, ResultTypes, SDK_Globals, SDK_Localizator, TaskEngine, UserListCacheService, ValidationItem, WorkflowCacheService } from '@topconsultnpm/sdk-ts';
+import { Priorities, ResultTypes, SDK_Globals, SDK_Localizator, TaskEngine, UserListCacheService, ValidationItem, WFEvents, WorkflowCacheService } from '@topconsultnpm/sdk-ts';
 import styled from "styled-components";
-import { SDKUI_Localizator, IconApply, IconCloseOutline, IconUser, IconInfo, DateDisplayTypes, TASK_MORE_INFO_PREFIX_NAME, IconSignaturePencil, isSign4TopEnabled } from "../../../helper";
+import { SDKUI_Localizator, IconApply, IconCloseOutline, IconUser, IconInfo, DateDisplayTypes, TASK_MORE_INFO_PREFIX_NAME, IconSignaturePencil, isSign4TopEnabled, IconCheck, IconCloseCircle, IconStop } from "../../../helper";
 import { TMColors } from "../../../utils/theme";
 import TMButton from "../../base/TMButton";
 import { DeviceType } from "../../base/TMDeviceProvider";
@@ -21,17 +21,15 @@ const StyledWorkFlowOperationButtonsContainer = styled.div `
     gap: 10px;
     flex-direction: column;
 `;
-const StyledTextArea = styled.textarea.attrs({
-    maxLength: 200
-}) `
+const StyledTextArea = styled.textarea `
     width: 100%; 
     height: 100%; 
-    border: 1px solid ${props => props.$isValid ? '#b4b4b4' : TMColors.error}; 
+    border: 1px solid ${(props) => (props.$isValid ? '#b4b4b4' : TMColors.error)}; 
     border-radius: 10px; 
     padding: 10px;
-    &:focus{
+    &:focus {
         outline: none;
-        border-bottom: 4px solid ${props => props.$isValid ? TMColors.primaryColor : TMColors.error};
+        border-bottom: 4px solid ${(props) => (props.$isValid ? TMColors.primaryColor : TMColors.error)};
     }
 `;
 const CharacterCounter = styled.div `
@@ -111,11 +109,11 @@ export const WorkFlowApproveRejectPopUp = ({ TID = 0, DID = 0, deviceType = Devi
     const workflowAction = isReject === 0 ? SDKUI_Localizator.Approve : SDKUI_Localizator.Reject;
     const itemCount = selectedItems.length > 0 ? `(${selectedItems.length} workitem)` : '';
     const title = `${workflowAction} ${itemCount}`;
-    return (_jsx(TMModal, { title: title, onClose: onClose, width: '600px', height: '270px', isModal: true, children: _jsxs(StyledModalBodyWrapper, { children: [_jsxs(StyledModalContentContainer, { children: [_jsxs("p", { style: { color: (isReject === 1 && disable) ? TMColors.error : 'black' }, children: [SDKUI_Localizator.CommentText, " ", isReject === 1 && disable && _jsx("span", { children: ` (${SDKUI_Localizator.RequiredField})` }), " "] }), _jsx(StyledTextArea, { "$isValid": isReject === 0 ? true : !disable, value: commentValue, onChange: (e) => setCommentValue(e.target.value) }), _jsx(CharacterCounter, { children: `${200 - commentValue.length} ${SDKUI_Localizator.CharactersRemaining}` })] }), _jsx(StyledModalFooter, { children: isReject === 0
+    return (_jsx(TMModal, { title: title, onClose: onClose, width: '600px', height: '270px', isModal: true, children: _jsxs(StyledModalBodyWrapper, { children: [_jsxs(StyledModalContentContainer, { children: [_jsxs("p", { style: { color: (isReject === 1 && disable) ? TMColors.error : 'black' }, children: [SDKUI_Localizator.CommentText, " ", isReject === 1 && disable && _jsx("span", { children: ` (${SDKUI_Localizator.RequiredField})` }), " "] }), _jsx(StyledTextArea, { maxLength: 200, "$isValid": isReject === 0 ? true : !disable, value: commentValue, onChange: (e) => setCommentValue(e.target.value) }), _jsx(CharacterCounter, { children: `${200 - commentValue.length} ${SDKUI_Localizator.CharactersRemaining}` })] }), _jsx(StyledModalFooter, { children: isReject === 0
                         ? _jsx(TMButton, { btnStyle: 'advanced', showTooltip: false, icon: _jsx(IconApply, {}), caption: SDKUI_Localizator.Approve, disabled: false, onClick: () => completeOrRejectAsync(isReject), advancedColor: TMColors.success })
                         : _jsx(TMButton, { btnStyle: 'advanced', showTooltip: false, icon: _jsx(IconCloseOutline, {}), caption: SDKUI_Localizator.Reject, disabled: disable, onClick: () => { !disable && completeOrRejectAsync(isReject); }, advancedColor: TMColors.error }) })] }) }));
 };
-export const WorkFlowReAssignPopUp = ({ DID = 0, TID = 0, deviceType = DeviceType.DESKTOP, onClose, selectedItems = [], onCompleted }) => {
+export const WorkFlowReAssignPopUp = ({ DID = 0, TID = 0, deviceType = DeviceType.DESKTOP, onClose, selectedItems = [], onCompleted, wf }) => {
     const [commentValue, setCommentValue] = useState('');
     const [selectedUserID, setSelectedUserID] = useState([]);
     const [participants, setParticipants] = useState([]);
@@ -153,11 +151,11 @@ export const WorkFlowReAssignPopUp = ({ DID = 0, TID = 0, deviceType = DeviceTyp
                 if (!tidToUse)
                     return;
                 // Recupera info workflow
-                const wf = await WorkflowCacheService.GetWFInfoAsync(tidToUse);
+                const workflowInfo = wf ?? await WorkflowCacheService.GetWFInfoAsync(tidToUse);
                 // Recupera tutti gli utenti
                 const allUsers = await UserListCacheService.GetAllAsync();
                 // Filtra utenti partecipanti
-                const participantIds = wf?.participants?.map(p => p.userID);
+                const participantIds = workflowInfo?.participants?.map(p => p.userID);
                 const participantUsers = allUsers.filter(u => participantIds?.includes(u.id) && u.id !== SDK_Globals.tmSession?.SessionDescr?.userID);
                 if (isMounted)
                     setParticipants(participantUsers);
@@ -171,10 +169,110 @@ export const WorkFlowReAssignPopUp = ({ DID = 0, TID = 0, deviceType = DeviceTyp
         };
         fetchData();
         return () => { isMounted = false; };
-    }, [tidToUse]);
+    }, [tidToUse, wf]);
     return (_jsx(TMModal, { onClose: onClose, width: '600px', height: '270px', isModal: true, title: SDKUI_Localizator.Reassign + (selectedItems.length > 0 ? ' (' + selectedItems.length + ' workitem)' : ''), children: _jsxs(StyledModalBodyWrapper, { children: [_jsxs(StyledModalContentContainer, { children: [_jsx(TMUserChooser, { dataSource: participants, values: selectedUserID, onValueChanged: (IDs) => {
                                 setSelectedUserID(IDs ?? []);
-                            } }), _jsxs("p", { style: { color: commentValue.length === 0 ? TMColors.error : 'black' }, children: [SDKUI_Localizator.CommentText, " ", commentValue.length === 0 && _jsx("span", { children: ` (${SDKUI_Localizator.RequiredField})` }), " "] }), _jsx(StyledTextArea, { "$isValid": commentValue.length !== 0, value: commentValue, onChange: (e) => setCommentValue(e.target.value) }), _jsx(CharacterCounter, { children: `${200 - commentValue.length} ${SDKUI_Localizator.CharactersRemaining}` })] }), _jsx(StyledModalFooter, { children: _jsx(TMButton, { btnStyle: 'advanced', showTooltip: false, icon: _jsx(IconUser, { fontSize: 16 }), caption: SDKUI_Localizator.Reassign, disabled: disable, onClick: () => !disable && reAssignWorkFlowAsync(), advancedColor: TMColors.tertiary }) })] }) }));
+                            } }), _jsxs("p", { style: { color: commentValue.length === 0 ? TMColors.error : 'black' }, children: [SDKUI_Localizator.CommentText, " ", commentValue.length === 0 && _jsx("span", { children: ` (${SDKUI_Localizator.RequiredField})` }), " "] }), _jsx(StyledTextArea, { maxLength: 200, "$isValid": commentValue.length !== 0, value: commentValue, onChange: (e) => setCommentValue(e.target.value) }), _jsx(CharacterCounter, { children: `${200 - commentValue.length} ${SDKUI_Localizator.CharactersRemaining}` })] }), _jsx(StyledModalFooter, { children: _jsx(TMButton, { btnStyle: 'advanced', showTooltip: false, icon: _jsx(IconUser, { fontSize: 16 }), caption: SDKUI_Localizator.Reassign, disabled: disable, onClick: () => !disable && reAssignWorkFlowAsync(), advancedColor: TMColors.tertiary }) })] }) }));
+};
+/**
+ * Modal per forzare l'approvazione di un work item
+ */
+export const WorkflowForceApproveModal = ({ detail, onClose, onCompleted }) => {
+    const [commentValue, setCommentValue] = useState('');
+    const disable = commentValue.length === 0;
+    const forceApproveAsync = async () => {
+        try {
+            TMSpinner.show({ description: 'Forza approvazione in corso...' });
+            await SDK_Globals.tmSession?.NewWorkflowEngine().WFCtrl_ForceWIAsync(detail.tid, detail.did, WFEvents.AfterBtnApprove01, commentValue);
+            ShowAlert({
+                mode: 'success',
+                position: 'TOP_RIGHT',
+                title: 'Forza completamento',
+                message: 'Work item approvato con successo',
+                duration: 3000
+            });
+            await onCompleted?.();
+        }
+        catch (e) {
+            TMExceptionBoxManager.show({ exception: e });
+        }
+        finally {
+            onClose?.();
+            TMSpinner.hide();
+        }
+    };
+    const userName = detail.toUser?.name ?? detail.to;
+    const title = `Forza completamento - ${userName}`;
+    return (_jsx(TMModal, { title: title, onClose: onClose, width: '600px', height: '270px', isModal: true, children: _jsxs(StyledModalBodyWrapper, { children: [_jsxs(StyledModalContentContainer, { children: [_jsx("div", { style: { fontWeight: 600, marginBottom: '8px' }, children: "Motivazione (obbligatorio):" }), _jsx(StyledTextArea, { "$isValid": !disable, value: commentValue, onChange: (e) => setCommentValue(e.target.value), placeholder: "Inserisci il motivo della forzatura...", maxLength: 200 }), _jsxs(CharacterCounter, { children: [commentValue.length, "/200"] })] }), _jsx(StyledModalFooter, { children: _jsx(TMButton, { btnStyle: 'advanced', showTooltip: false, icon: _jsx(IconCheck, {}), caption: "Forza approvazione", width: '180px', disabled: disable, onClick: () => !disable && forceApproveAsync(), advancedColor: TMColors.success }) })] }) }));
+};
+/**
+ * Modal per forzare il rifiuto di un work item
+ */
+export const WorkflowForceRejectModal = ({ detail, onClose, onCompleted }) => {
+    const [commentValue, setCommentValue] = useState('');
+    const disable = commentValue.length === 0;
+    const forceRejectAsync = async () => {
+        try {
+            TMSpinner.show({ description: 'Forza rifiuto in corso...' });
+            await SDK_Globals.tmSession?.NewWorkflowEngine().WFCtrl_ForceWIAsync(detail.tid, detail.did, WFEvents.AfterBtnReject01, commentValue);
+            ShowAlert({
+                mode: 'success',
+                position: 'TOP_RIGHT',
+                title: 'Forza rifiuto',
+                message: 'Work item rifiutato con successo',
+                duration: 3000
+            });
+            await onCompleted?.();
+        }
+        catch (e) {
+            TMExceptionBoxManager.show({ exception: e });
+        }
+        finally {
+            onClose?.();
+            TMSpinner.hide();
+        }
+    };
+    const userName = detail.toUser?.name ?? detail.to;
+    const title = `Forza rifiuto - ${userName}`;
+    return (_jsx(TMModal, { title: title, onClose: onClose, width: '600px', height: '270px', isModal: true, children: _jsxs(StyledModalBodyWrapper, { children: [_jsxs(StyledModalContentContainer, { children: [_jsx("div", { style: { fontWeight: 600, marginBottom: '8px' }, children: "Motivazione (obbligatorio):" }), _jsx(StyledTextArea, { "$isValid": !disable, value: commentValue, onChange: (e) => setCommentValue(e.target.value), placeholder: "Inserisci il motivo del rifiuto...", maxLength: 200 }), _jsxs(CharacterCounter, { children: [commentValue.length, "/200"] })] }), _jsx(StyledModalFooter, { children: _jsx(TMButton, { btnStyle: 'advanced', showTooltip: false, icon: _jsx(IconCloseCircle, {}), caption: "Forza rifiuto", width: '150px', disabled: disable, onClick: () => !disable && forceRejectAsync(), advancedColor: TMColors.error }) })] }) }));
+};
+/**
+ * Modal per terminare le istanze workflow selezionate
+ */
+export const WorkflowEndInstanceModal = ({ selectedInstances, onClose, onCompleted }) => {
+    const [commentValue, setCommentValue] = useState('');
+    const disable = commentValue.length === 0;
+    const endInstancesAsync = async () => {
+        try {
+            TMSpinner.show({ description: 'Terminazione istanze in corso...' });
+            const workflowEngine = SDK_Globals.tmSession?.NewWorkflowEngine();
+            if (!workflowEngine)
+                throw new Error("Workflow engine non disponibile");
+            for (const instance of selectedInstances) {
+                if (instance.wfid && instance.did) {
+                    await workflowEngine.WFCtrl_EndInstanceAsync(instance.wfid, instance.tid ?? 0, instance.did, commentValue);
+                }
+            }
+            ShowAlert({
+                mode: 'success',
+                position: 'TOP_RIGHT',
+                title: 'Terminazione istanze',
+                message: `${selectedInstances.length} ${selectedInstances.length === 1 ? 'istanza terminata' : 'istanze terminate'} con successo`,
+                duration: 3000
+            });
+            await onCompleted?.();
+        }
+        catch (e) {
+            TMExceptionBoxManager.show({ exception: e });
+        }
+        finally {
+            onClose?.();
+            TMSpinner.hide();
+        }
+    };
+    const itemCount = selectedInstances.length > 0 ? `(${selectedInstances.length} ${selectedInstances.length === 1 ? 'istanza' : 'istanze'})` : '';
+    const title = `Termina istanza ${itemCount}`;
+    return (_jsx(TMModal, { title: title, onClose: onClose, width: '600px', height: '270px', isModal: true, children: _jsxs(StyledModalBodyWrapper, { children: [_jsxs(StyledModalContentContainer, { children: [_jsx("div", { style: { fontWeight: 600, marginBottom: '8px' }, children: "Motivazione (obbligatorio):" }), _jsx(StyledTextArea, { "$isValid": !disable, value: commentValue, onChange: (e) => setCommentValue(e.target.value), placeholder: "Inserisci il motivo della terminazione...", maxLength: 200 }), _jsxs(CharacterCounter, { children: [commentValue.length, "/200"] })] }), _jsx(StyledModalFooter, { children: _jsx(TMButton, { btnStyle: 'advanced', showTooltip: false, icon: _jsx(IconStop, {}), caption: "Termina istanza", width: '150px', disabled: disable, onClick: () => !disable && endInstancesAsync(), advancedColor: TMColors.error }) })] }) }));
 };
 export const WorkFlowMoreInfoPopUp = ({ DID = 0, TID = 0, deviceType = DeviceType.DESKTOP, onClose, onCompleted }) => {
     const [users, setUsers] = useState([]);

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

@@ -1656,10 +1656,10 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, allowEdit = true, onDiagram
         }
     }, [wfDiagram]);
     const handleCanvasDoubleClick = useCallback((event) => {
-        if (isReadOnly) {
+        if (isReadOnly && allowEdit) {
             toggleReadOnlyMode();
         }
-    }, [isReadOnly, toggleReadOnlyMode]);
+    }, [isReadOnly, allowEdit, toggleReadOnlyMode]);
     const handleFullScreenKeyDown = useCallback((event) => {
         if (event.key === 'Escape') {
             // Blocca sempre la propagazione per evitare che TMSaveForm riceva l'evento

package/lib/components/forms/Login/LoginValidatorService.d.ts

@@ -3,6 +3,8 @@ import { TMEndpointsType } from './TMLoginForm';
 export interface LoginData {
     endpoint: TMEndpointsType;
     dcmtArchive: ArchiveDescriptor;
+    manualArchiveID?: string;
+    hasArchives?: boolean;
     authenticationMode: AuthenticationModes;
     username?: string;
     password?: string;

package/lib/components/forms/Login/LoginValidatorService.js

@@ -27,8 +27,13 @@ export class LoginValidator {
         if (!data.endpoint?.Description?.trim()) {
             addError("endpoint", SDKUI_Localizator.RequiredField);
         }
-        if (!data.dcmtArchive?.description?.trim()) {
-            addError("dcmtArchive", SDKUI_Localizator.RequiredField);
+        if (data.hasArchives) {
+            if (!data.dcmtArchive?.description?.trim()) {
+                addError("dcmtArchive", SDKUI_Localizator.RequiredField);
+            }
+        }
+        else if (!data.manualArchiveID?.trim()) {
+            addError("manualArchiveID", SDKUI_Localizator.RequiredField);
         }
         if (!data.authenticationMode || data.authenticationMode === AuthenticationModes.None) {
             addError("authenticationMode", SDKUI_Localizator.RequiredField);

package/lib/components/forms/Login/TMLoginForm.js

@@ -8,6 +8,7 @@ import frMessages from "devextreme/localization/messages/fr.json";
 import itMessages from "devextreme/localization/messages/it.json";
 import ptMessages from "devextreme/localization/messages/pt.json";
 import { locale as dxlocale, loadMessages } from "devextreme/localization";
+import { devextremeCustomMessages } from "../../../helper/devextremeCustomMessages";
 import styled from "styled-components";
 import Menu from "./Menu";
 import TextBox from "./TextBox";
@@ -81,6 +82,7 @@ export const useCultureID = ({ cultureID = CultureIDs.It_IT }) => {
         loadMessages(frMessages);
         loadMessages(itMessages);
         loadMessages(ptMessages);
+        loadMessages(devextremeCustomMessages); // Fix traduzioni mancanti in DevExtreme
     }, []);
     return (currentCultureID);
 };
@@ -111,6 +113,7 @@ const TMLoginForm = (props) => {
     const [showCultureIDs, setShowCultureIDs] = useState(false);
     const [dcmtArchives, setDcmtArchives] = useState([]);
     const [dcmtArchive, setDcmtArchive] = useState();
+    const [manualArchiveID, setManualArchiveID] = useState('');
     const [authMode, setAuthMode] = useState(AuthenticationModes.TopMedia);
     const [username, setUsername] = useState('SysAdmin');
     const [password, setPassword] = useState('');
@@ -131,6 +134,8 @@ const TMLoginForm = (props) => {
             authenticationMode: authMode,
             cultureID: props.cultureID ?? CultureIDs.It_IT,
             dcmtArchive: dcmtArchive,
+            manualArchiveID: manualArchiveID,
+            hasArchives: dcmtArchives.length > 0,
             endpoint: endpoint,
             authDomain: authDomain,
             authDomainOnBehalfOf: authDomain,
@@ -142,7 +147,7 @@ const TMLoginForm = (props) => {
             username: username,
             usernameOnBehalfOf: usernameOnBehalf
         };
-    }, [authMode, props.cultureID, dcmtArchive, endpoint, authDomain, otpCode, password, passwordOnBehalf, saveLoginName, saveLoginEnable, username, usernameOnBehalf]);
+    }, [authMode, props.cultureID, dcmtArchive, manualArchiveID, dcmtArchives.length, endpoint, authDomain, otpCode, password, passwordOnBehalf, saveLoginName, saveLoginEnable, username, usernameOnBehalf]);
     const inputRefs = useMemo(() => {
         switch (authMode) {
             case AuthenticationModes.TopMedia:
@@ -302,7 +307,7 @@ const TMLoginForm = (props) => {
     }, []);
     const disableContinueBtn = useMemo(() => {
         switch (loginStep) {
-            case 1: return fieldValidations('endpoint').length > 0 || fieldValidations('dcmtArchive').length > 0;
+            case 1: return fieldValidations('endpoint').length > 0 || fieldValidations('dcmtArchive').length > 0 || fieldValidations('manualArchiveID').length > 0;
             case 2: return fieldValidations('authenticationMode').length > 0 || fieldValidations('username').length > 0 || fieldValidations('password').length > 0;
             default: return false;
         }
@@ -321,8 +326,13 @@ const TMLoginForm = (props) => {
         return tmSession;
     }, [endpoint, username, dcmtArchive]);
     const nextStepHandler = async () => {
-        if (!endpoint || !dcmtArchive)
+        if (!endpoint || (!dcmtArchive && !manualArchiveID))
             return;
+        if (loginStep === 1 && !dcmtArchive && manualArchiveID) {
+            const isValid = await validateManualArchiveAsync();
+            if (!isValid)
+                return;
+        }
         if (loginStep === 1) {
             setLoginStep(2);
         }
@@ -349,6 +359,23 @@ const TMLoginForm = (props) => {
             return;
         setLoginStep(prev => prev - 1);
     }, [loginStep]);
+    const validateManualArchiveAsync = async () => {
+        if (!tmSession || !manualArchiveID)
+            return false;
+        try {
+            TMSpinner.show({ description: '' });
+            const archiveEngine = tmSession.NewArchiveEngine();
+            await archiveEngine.RetrieveAsync(manualArchiveID);
+            return true;
+        }
+        catch (e) {
+            TMExceptionBoxManager.show({ exception: e });
+            return false;
+        }
+        finally {
+            TMSpinner.hide();
+        }
+    };
     const getArchivesAsync = async () => {
         if (!tmSession)
             return;
@@ -392,7 +419,7 @@ const TMLoginForm = (props) => {
             const sdInput = {
                 authenticationMode: authMode,
                 appModuleID: props.appModule,
-                archiveID: dcmtArchive?.id,
+                archiveID: dcmtArchive?.id ?? (dcmtArchives.length === 0 && manualArchiveID ? manualArchiveID : undefined),
                 description: dcmtArchive?.description,
                 userName: username,
                 password: password,
@@ -594,7 +621,7 @@ const TMLoginForm = (props) => {
         }
     }, [SDK_Globals.appModule]);
     return (_jsxs(StyledWrapper, { children: [!isMobile && _jsxs(StyledVersionContainer, { children: [_jsxs(StyledVersion, { children: [_jsxs(StyledVersionName, { children: [_jsx("span", { style: { color: TMColors.primary }, children: "\u25CF" }), SDK_Globals.appModule] }), _jsxs("p", { children: ["v.", SDK_Globals.appVersion] })] }), _jsxs(StyledVersion, { children: [_jsxs(StyledVersionName, { children: [_jsx("span", { style: { color: TMColors.tertiary }, children: "\u25CF" }), "SDKUI"] }), _jsxs("p", { children: ["v.", SDK_Globals.sdkuiVersion] })] }), _jsxs(StyledVersion, { children: [_jsxs(StyledVersionName, { children: [_jsx("span", { style: { color: TMColors.error }, children: "\u25CF" }), "SDK"] }), _jsxs("p", { children: ["v.", SDK_Globals.sdkVersion] })] })] }), _jsxs(StyledLoginContainer, { "$isMobile": isMobile, children: [_jsxs(StyledLeftSection, { "$isMobile": isMobile, "$isConnector": props.isConnector ?? false, children: [isMobile && _jsxs(StyledTopBar, { children: [_jsx(StyledTitle, { children: SDKUI_Localizator.WelcomeTo.replaceParams('') + ' ' + welcomeAppNameHeader + ' ' + 'v.' + SDK_Globals.appVersion }), _jsx(StyledMobileVersionIcon, { onClick: showVersionPopup, children: _jsx(IconInfo, { fontSize: 20, color: TMColors.primary }) })] }), _jsx(StyledOverlay, { "$isMobile": isMobile, children: _jsx(StyledCustomLogo, { style: { backgroundImage: `url(${showDefaultLogo ? 'logo-default.svg' : 'logo-custom.svg'})` } }) }), (windowHeight === WindowHeight.LARGE || !isMobile) && _jsxs(StyledPoweredByContainer, { "$isMobile": isMobile, children: [" ", showDefaultLogo ? 'Powered by TopConsult' : _jsx("img", { src: "/logo-default.svg", alt: "Logo", width: isMobile ? 50 : 100 }), " "] })] }), _jsxs(StyledRightSection, { "$isMobile": isMobile, children: [((((getDeviceType() === 'desktop' || isDesktop || isTablet) && windowHeight !== WindowHeight.SMALL)) && !isMobile) && _jsxs(StyledLogoContainer, { "$isMobile": isMobile, children: [_jsx(StyledWelcomeText, { children: SDKUI_Localizator.WelcomeTo.replaceParams('') }), _jsx(StyledLogo, { children: _jsx("img", { src: six, alt: "six", height: 50 }) }), _jsx(StyledWelcomeText, { children: welcomeAppName })] }), _jsxs(StyledToolbarContainer, { children: [_jsx(StyledLanguageChooser, { onClick: () => setShowCultureIDs(true), children: _jsx(TMTooltip, { content: SDKUI_Localizator.CultureID, children: _jsx("img", { src: getCultureIDImg(), alt: "Lang", width: 25, height: 25 }) }) }), loginStep !== 3 && _jsx(TMButton, { btnStyle: "icon", onClick: () => setShowRapidAccess(true), icon: _jsx(IconFastAccess, { fontSize: 20 }), caption: LOGINLocalizator.QuickAccess }), showPasswordOperations && _jsx(TMButton, { disabled: disablePasswordOperations, btnStyle: "icon", onClick: () => setShowChangePassword(true), icon: _jsx(IconPasswordOutline, { fontSize: 19 }), caption: SDKUI_Localizator.ChangePassword })] }), _jsxs(StyledFormContainer, { "$isMobile": isMobile, "$windowHeight": windowHeight, children: [loginStep === 1 &&
-                                        _jsxs(StyledStepContainer, { "$deviceType": deviceType, children: [_jsx(Chooser, { isDropDown: isDesktop, dataSource: props.endpoints, value: 'Description', columns: accessPointChooserColumns, additionalIcons: accessPointAdditionalIcons, icon: _jsx(IconAccessPoint, {}), label: SDKUI_Localizator.Endpoint, onSelectionChanged: (ep) => { setEndpoint(ep); setDcmtArchive(undefined); }, validationItems: fieldValidations('endpoint'), selectedRow: endpoint ?? undefined }), _jsx(Chooser, { isDropDown: isDesktop, dataSource: dcmtArchives, value: 'description', columns: dcmtArchiveChooserColumns, icon: _jsx(IconArchiveDoc, {}), label: SDKUI_Localizator.ArchiveID, onSelectionChanged: (arch) => setDcmtArchive(arch), validationItems: fieldValidations('dcmtArchive'), disabled: !endpoint, selectedRow: dcmtArchive ?? undefined })] }), loginStep === 2 &&
+                                        _jsxs(StyledStepContainer, { "$deviceType": deviceType, children: [_jsx(Chooser, { isDropDown: isDesktop, dataSource: props.endpoints, value: 'Description', columns: accessPointChooserColumns, additionalIcons: accessPointAdditionalIcons, icon: _jsx(IconAccessPoint, {}), label: SDKUI_Localizator.Endpoint, onSelectionChanged: (ep) => { setEndpoint(ep); setDcmtArchive(undefined); }, validationItems: fieldValidations('endpoint'), selectedRow: endpoint ?? undefined }), dcmtArchives.length > 0 ? (_jsx(Chooser, { isDropDown: isDesktop, dataSource: dcmtArchives, value: 'description', columns: dcmtArchiveChooserColumns, icon: _jsx(IconArchiveDoc, {}), label: SDKUI_Localizator.ArchiveID, onSelectionChanged: (arch) => setDcmtArchive(arch), validationItems: fieldValidations('dcmtArchive'), disabled: !endpoint, selectedRow: dcmtArchive ?? undefined })) : (_jsx(TextBox, { type: "text", icon: _jsx(IconArchiveDoc, {}), label: SDKUI_Localizator.ArchiveID, value: manualArchiveID, onValueChanged: (value) => setManualArchiveID(value), validationItems: fieldValidations('manualArchiveID'), disabled: !endpoint, placeHolder: 'Inserisci archivio' }))] }), loginStep === 2 &&
                                         _jsxs(_Fragment, { children: [_jsxs(StyledSummaryContainer, { style: {
                                                         display: 'flex',
                                                         justifyContent: 'center',
@@ -604,7 +631,7 @@ const TMLoginForm = (props) => {
                                                         marginBottom: windowHeight === WindowHeight.SMALL ? '30px' : '25px',
                                                         width: '100%',
                                                         minHeight: '15px'
-                                                    }, children: [_jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.Endpoint, children: _jsx(IconAccessPoint, { color: TMColors.primary, fontSize: 16 }) }), _jsx(TMTooltip, { content: endpoint?.Description ?? '', children: _jsx("p", { children: endpoint?.Description && endpoint.Description.length > 20 ? endpoint.Description.substring(0, 20) + '...' : endpoint?.Description }) })] }), _jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.ArchiveID, children: _jsx(IconArchiveDoc, { color: TMColors.primary, fontSize: 16 }) }), _jsx(TMTooltip, { content: dcmtArchive?.description ?? '', children: _jsx("p", { children: dcmtArchive?.description && dcmtArchive.description.length > 20 ? dcmtArchive.description.substring(0, 20) + '...' : dcmtArchive?.description }) })] })] }), _jsxs(StyledStepContainer, { "$windowHeight": windowHeight, "$deviceType": deviceType, children: [_jsx(SelectBox, { value: authMode, options: authModeOptions, onValueChanged: (value) => setAuthMode(value), validationItems: fieldValidations('authenticationMode'), icon: _jsx(IconLogin, {}), label: SDKUI_Localizator.AuthMode }), _jsxs(StyledCredentialWrapper, { children: [authMode === AuthenticationModes.WindowsThroughTopMedia && _jsx(TextBox, { ref: authDomainRef, value: authDomain, onValueChanged: (e) => setAuthDomain(e), validationItems: fieldValidations('authDomain'), type: "text", icon: _jsx(IconWeb, {}), label: SDKUI_Localizator.Domain }), authMode !== AuthenticationModes.MSAzure && _jsx(CeredentialContainer, { isMobile: isMobile, ref: usernameRef, secondaryRef: passwordRef, usernameValidator: fieldValidations('username'), passwordValidator: fieldValidations('password'), authMode: authMode, username: username, password: password, onUsernameChanged: (un) => setUsername(un), onPasswordChanged: (ps) => setPassword(ps) }), authMode === AuthenticationModes.TopMediaOnBehalfOf &&
+                                                    }, children: [_jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.Endpoint, children: _jsx(IconAccessPoint, { color: TMColors.primary, fontSize: 16 }) }), _jsx(TMTooltip, { content: endpoint?.Description ?? '', children: _jsx("p", { children: endpoint?.Description && endpoint.Description.length > 20 ? endpoint.Description.substring(0, 20) + '...' : endpoint?.Description }) })] }), _jsxs(StyledDescription, { children: [_jsx(TMTooltip, { content: SDKUI_Localizator.ArchiveID, children: _jsx(IconArchiveDoc, { color: TMColors.primary, fontSize: 16 }) }), _jsx(TMTooltip, { content: dcmtArchive ? (dcmtArchive.description ?? '') : manualArchiveID, children: _jsx(StyledArchiveText, { children: dcmtArchive ? (dcmtArchive.description ?? '') : manualArchiveID }) })] })] }), _jsxs(StyledStepContainer, { "$windowHeight": windowHeight, "$deviceType": deviceType, children: [_jsx(SelectBox, { value: authMode, options: authModeOptions, onValueChanged: (value) => setAuthMode(value), validationItems: fieldValidations('authenticationMode'), icon: _jsx(IconLogin, {}), label: SDKUI_Localizator.AuthMode }), _jsxs(StyledCredentialWrapper, { children: [authMode === AuthenticationModes.WindowsThroughTopMedia && _jsx(TextBox, { ref: authDomainRef, value: authDomain, onValueChanged: (e) => setAuthDomain(e), validationItems: fieldValidations('authDomain'), type: "text", icon: _jsx(IconWeb, {}), label: SDKUI_Localizator.Domain }), authMode !== AuthenticationModes.MSAzure && _jsx(CeredentialContainer, { isMobile: isMobile, ref: usernameRef, secondaryRef: passwordRef, usernameValidator: fieldValidations('username'), passwordValidator: fieldValidations('password'), authMode: authMode, username: username, password: password, onUsernameChanged: (un) => setUsername(un), onPasswordChanged: (ps) => setPassword(ps) }), authMode === AuthenticationModes.TopMediaOnBehalfOf &&
                                                                     _jsxs(StyledCredentialWrapper, { children: [_jsx(TextBox, { value: authDomain, ref: authDomainRef, onValueChanged: (e) => setAuthDomain(e), validationItems: fieldValidations('authDomain'), type: "text", icon: _jsx(IconWeb, {}), label: SDKUI_Localizator.Domain }), _jsx(CeredentialContainer, { isMobile: isMobile, ref: usernameOnBehalfOfRef, secondaryRef: passwordOnBehalfOfRRef, usernameValidator: fieldValidations('usernameOnBehalfOf'), passwordValidator: fieldValidations('passwordOnBehalfOf'), authMode: AuthenticationModes.TopMediaOnBehalfOf, username: usernameOnBehalf, password: passwordOnBehalf, onUsernameChanged: (un) => setUsernameOnBehalf(un), onPasswordChanged: (ps) => setPasswordOnBehalf(ps) })] })] }), authMode !== AuthenticationModes.TopMediaWithMFA &&
                                                             _jsx(RapidAccessContainer, { isSaveEnable: saveLoginEnable, name: saveLoginName, nameValidationItems: fieldValidations('rapidAccessName'), onEnableSaveChange: () => setSaveLoginEnable(!saveLoginEnable), onNameChange: (name) => setSaveLoginName(name) })] })] }), loginStep === 3 &&
                                         _jsxs(StyledStepThreeContainer, { "$isMobile": isMobile, children: [_jsx(OTPReader, { isMobile: isMobile, digits: otpCode, onChange: handleDigitChange, onFullChange: handleFullChange, text: _jsxs("div", { children: [" ", LOGINLocalizator.EnterOtpInstructions, " "] }), header: '', additionalButtons: [
@@ -703,6 +730,7 @@ const StyledLogo = styled.div ` display: flex; gap: 5px; align-items: center; `;
 const StyledFormContainer = styled.div ` display: flex; flex-direction: column; padding: ${props => getPadding(props.$windowHeight, props.$isMobile)} ; align-items: center; justify-content: center; gap: 10px; width: 100%; height: fit-content; max-height: calc(100% - 100px); margin-top : ${props => !props.$isMobile && props.$windowHeight === WindowHeight.MEDIUM ? '70px' : '0'} ; `;
 const StyledButtonContainer = styled.div ` display: flex; align-items: center; justify-content: center; padding: ${props => props.$windowHeight !== WindowHeight.SMALL ? '10px' : '0'}; width: 100%; margin-top: ${props => props.$windowHeight !== WindowHeight.SMALL ? '10px' : '0'}; `;
 const StyledDescription = styled.div ` display: flex; align-items: center; gap: 2px; `;
+const StyledArchiveText = styled.p ` max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; `;
 const StyledRapidLoginSave = styled.div ` display: flex; flex-direction: column; width: 100%; gap: 2px; `;
 const StyledForgetPassword = styled.div ` position: absolute; bottom: ${props => props.$isMobile ? '15px' : '25px'}; left: 50%; transform: translateX(-50%); font-size: 0.8rem; `;
 const StyledBackButton = styled.div ` position: absolute; top: 20px; left: 20px; `;

package/lib/components/forms/TMChooserForm.js

@@ -88,7 +88,7 @@ const TMChooserForm = ({ children, title, allowMultipleSelection = false, allowA
     }, [manageUseLocalizedName, summaryItems]);
     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, searchPanelFocusStarting: true, headerFilter: { visible: true }, selection: { mode: allowMultipleSelection ? 'multiple' : 'single', showCheckBoxesMode: 'always', selectAllMode: 'allPages' }, grouping: allowGrouping ? { autoExpandAll: false, expandMode: 'rowClick' } : undefined, summary: customSummary, showFilterPanel: showFilterPanel, onFocusedRowChanged: handleFocusedRowChange, onSelectionChanged: handleSelectionChanged, onRowDblClick: handleRowDoubleClick })
+            ? _jsx(TMDataGrid, { dataSource: filteredItems, keyExpr: keyName, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selectedRowKeys: selectedRowKeys, searchPanelFocusTrigger: 1, headerFilter: { visible: true }, selection: { mode: allowMultipleSelection ? 'multiple' : 'single', showCheckBoxesMode: 'always', selectAllMode: 'allPages' }, grouping: allowGrouping ? { autoExpandAll: false, expandMode: 'rowClick' } : undefined, summary: customSummary, showFilterPanel: showFilterPanel, 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 }) }) }) }));
 };
 export default TMChooserForm;

package/lib/components/grids/TMBlogsPost.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useCallback, useEffect, useRef, useState } from "react";
-import { DossierEngine, LayoutModes, ResultTypes, SDK_Globals, TaskDescriptor, WorkingGroupEngine } from "@topconsultnpm/sdk-ts";
-import { ContextMenu } from "devextreme-react";
+import { DossierEngine, LayoutModes, ObjectClasses, ResultTypes, SDK_Globals, TaskDescriptor, WorkingGroupEngine } from "@topconsultnpm/sdk-ts";
+import { ContextMenu as TMContextMenu } from "../NewComponents/ContextMenu";
 import { SDKUI_Localizator, Globalization, getExceptionMessage, TMConditionalWrapper, calcResponsiveSizes } from "../../helper";
 import TMToppyMessage from "../../helper/TMToppyMessage";
 import { useDcmtOperations } from "../../hooks/useDcmtOperations";
@@ -68,7 +68,8 @@ const TMBlogsPost = (props) => {
     const [showTaskForm, setShowTaskForm] = useState(false);
     // State to manage show selected file
     const [dcmtForm, setDcmtForm] = useState({ show: false, dcmt: undefined });
-    const [anchorEl, setAnchorEl] = useState(null);
+    const [menuVisible, setMenuVisible] = useState(false);
+    const [menuPosition, setMenuPosition] = useState({ x: 0, y: 0 });
     const [menuItems, setMenuItems] = useState([]);
     const [localShowWaitPanel, setLocalShowWaitPanel] = useState(false);
     const [localWaitPanelTitle, setLocalWaitPanelTitle] = useState('');
@@ -500,8 +501,8 @@ const TMBlogsPost = (props) => {
         const classId = targetItem ? targetItem.classID : undefined;
         if (contextMenuParams.isDownloadAttachmentEnabled && focusedAttachment !== undefined) {
             menuItems.push({
-                icon: "download",
-                text: 'Download',
+                icon: _jsx("span", { className: "dx-icon-download" }),
+                name: 'Download',
                 onClick: async () => {
                     await downloadDcmtsAsync([
                         { TID: focusedAttachment.TID, DID: focusedAttachment.DID, fileName: focusedAttachment.fileName }
@@ -511,26 +512,26 @@ const TMBlogsPost = (props) => {
         }
         if (contextMenuParams.isViewEditMetadata && focusedAttachment !== undefined) {
             menuItems.push({
-                icon: 'eyeopen',
-                text: SDKUI_Localizator.OpenForm,
+                icon: _jsx("span", { className: "dx-icon-eyeopen" }),
+                name: SDKUI_Localizator.OpenForm,
                 onClick: () => openDcmtForm(focusedAttachment),
             });
         }
         if (contextMenuParams.isCommentEnabled && showCommentFormCallback !== undefined) {
             menuItems.push({
-                icon: 'chat',
-                text: SDKUI_Localizator.Comment,
+                icon: _jsx("span", { className: "dx-icon-chat" }),
+                name: SDKUI_Localizator.Comment,
                 disabled: isGroupArchived ? true : false,
                 onClick: () => {
                     showCommentFormCallback(focusedAttachment);
                 },
-                beginGroup: true
+                beginGroup: menuItems.length > 0
             });
         }
         if (targetItem && contextMenuParams.isDeleteEnabled) {
             menuItems.push({
-                icon: "trash",
-                text: SDKUI_Localizator.Delete,
+                icon: _jsx("span", { className: "dx-icon-trash" }),
+                name: SDKUI_Localizator.Delete,
                 visible: contextMenuParams.isDeleteEnabled,
                 onClick: () => deleteOrUndeleteCommentCallback(targetItem, true),
                 disabled: isNotOwner || isDeleted || isGroupArchived,
@@ -538,24 +539,24 @@ const TMBlogsPost = (props) => {
         }
         if (targetItem && contextMenuParams.isRestoreEnabled) {
             menuItems.push({
-                icon: "undo",
-                text: SDKUI_Localizator.Restore,
+                icon: _jsx("span", { className: "dx-icon-undo" }),
+                name: SDKUI_Localizator.Restore,
                 onClick: () => deleteOrUndeleteCommentCallback(targetItem, false),
                 disabled: isNotOwner || (targetItem && (targetItem.isDel === undefined || targetItem.isDel === 0)),
             });
         }
         if (targetItem && contextMenuParams.isCopyToClipboardEnabled) {
             menuItems.push({
-                text: SDKUI_Localizator.CopyToClipboard,
-                icon: 'copy',
+                name: SDKUI_Localizator.CopyToClipboard,
+                icon: _jsx("span", { className: "dx-icon-copy" }),
                 disabled: false,
                 onClick: () => { copyInClipboard(targetItem); }
             });
         }
         if (contextMenuParams.isCreateContextualTask) {
             menuItems.push({
-                text: SDKUI_Localizator.CreateContextualTask,
-                icon: 'plus',
+                name: SDKUI_Localizator.CreateContextualTask,
+                icon: _jsx("span", { className: "dx-icon-plus" }),
                 onClick: () => openTaskFormCallback(targetItem),
                 disabled: isGroupArchived ? true : false,
                 beginGroup: true
@@ -563,15 +564,15 @@ const TMBlogsPost = (props) => {
         }
         if (targetItem && Boolean(classId && (classId === 'WG' || classId === 'DS'))) {
             menuItems.push({
-                icon: "eyeclose",
-                text: SDKUI_Localizator.Unfollow,
+                icon: _jsx("span", { className: "dx-icon-eyeclose" }),
+                name: SDKUI_Localizator.Unfollow,
                 onClick: () => (targetItem && classId) && unFollowCallback(targetItem, classId),
             });
         }
         if (contextMenuParams.isShowHideFilterEnabled) {
             menuItems.push({
-                icon: isHeaderHidden ? 'eyeopen' : 'eyeclose',
-                text: isHeaderHidden ? SDKUI_Localizator.ShowFilters : SDKUI_Localizator.HideFilters,
+                icon: _jsx("span", { className: isHeaderHidden ? "dx-icon-eyeopen" : "dx-icon-eyeclose" }),
+                name: isHeaderHidden ? SDKUI_Localizator.ShowFilters : SDKUI_Localizator.HideFilters,
                 onClick: toggleHeaderClick,
                 disabled: false,
                 beginGroup: true
@@ -579,23 +580,24 @@ const TMBlogsPost = (props) => {
         }
         if (contextMenuParams.isShowHideIDEnaled) {
             menuItems.push({
-                icon: localShowId ? 'eyeclose' : 'eyeopen',
+                icon: _jsx("span", { className: localShowId ? "dx-icon-eyeclose" : "dx-icon-eyeopen" }),
                 onClick: () => setLocalShowId(prevShowId => !prevShowId),
-                text: localShowId ? SDKUI_Localizator.ID_Hide : SDKUI_Localizator.ID_Show,
+                name: localShowId ? SDKUI_Localizator.ID_Hide : SDKUI_Localizator.ID_Show,
                 disabled: false,
             });
         }
         if (contextMenuParams.isRefreshEnabled && refreshCallback !== undefined) {
             menuItems.push({
-                icon: "refresh",
-                text: SDKUI_Localizator.Refresh,
+                icon: _jsx("span", { className: "dx-icon-refresh" }),
+                name: SDKUI_Localizator.Refresh,
                 onClick: refresh,
                 disabled: false,
             });
         }
         if (menuItems.length > 0) {
-            setAnchorEl(event.currentTarget);
+            setMenuPosition({ x: event.clientX, y: event.clientY });
             setMenuItems(menuItems);
+            setMenuVisible(true);
         }
     };
     const handlePostsToShowChange = (value) => {
@@ -606,12 +608,31 @@ const TMBlogsPost = (props) => {
         setSearchText(value);
     };
     const closeContextMenu = useCallback(() => {
-        setAnchorEl(null);
+        setMenuVisible(false);
     }, []);
+    const handleNavigateToReference = (ref) => {
+        switch (ref.objClass) {
+            case ObjectClasses.Dossier:
+                if (ref.objID)
+                    handleNavigateToDossiers?.(ref.objID);
+                else
+                    console.log("Dossier reference missing objID");
+                break;
+            case ObjectClasses.WorkingGroup:
+                if (ref.objID)
+                    handleNavigateToWGs?.(ref.objID);
+                else
+                    console.log("Working Group reference missing objID");
+                break;
+            // Handle other object types as needed
+            default:
+                console.warn(`Unhandled object type: ${ref.objClass}`);
+        }
+    };
     return _jsx("div", { ref: containerRef, style: { height: height, width: width }, 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: localShowWaitPanel, showWaitPanelPrimary: localShowPrimary, waitPanelTitle: localWaitPanelTitle, waitPanelTextPrimary: localWaitPanelTextPrimary, waitPanelValuePrimary: localWaitPanelValuePrimary, waitPanelMaxValuePrimary: localWaitPanelMaxValuePrimary, isCancelable: true, abortController: localAbortController, children: [_jsx(TMBlogHeader, { isVisible: currentHeader !== undefined && !isHeaderHidden, layoutMode: layoutMode, height: layoutMode === 'extended' ? "40px" : "70px", width: "100%", allPosts: posts, postsToShow: postsToShow, onPostsToShowChange: handlePostsToShowChange, categoryIdDataSource: categoryIdDataSource, appliedCategoryIdFilters: appliedCategoryIdFilters, setAppliedCategoryIdFilters: setAppliedCategoryIdFilters, searchText: searchText, onSearchChange: handleSearchChange }), _jsxs("div", { style: {
                             width: "100%",
                             height: currentHeader !== undefined && !isHeaderHidden ? `calc(100% - ${layoutMode === 'extended' ? "40px" : "70px"})` : "100%",
-                        }, children: [blogPosts.length === 0 && _jsx(TMToppyMessage, { message: searchText.length > 0 ? SDKUI_Localizator.NoMessagesFound : SDKUI_Localizator.NoMessages }), blogPosts.length > 0 && _jsxs("div", { tabIndex: 0, onKeyDown: handleKeyDown, onContextMenu: onContextMenu, style: {
+                        }, children: [blogPosts.length === 0 && _jsx(TMToppyMessage, { message: searchText.length > 0 ? SDKUI_Localizator.NoMessagesFound : SDKUI_Localizator.NoMessages }), blogPosts.length > 0 && _jsxs("div", { id: `${id}-blogs-container`, tabIndex: 0, onKeyDown: handleKeyDown, onContextMenu: onContextMenu, style: {
                                     height: '100%',
                                     width: '100%',
                                     outline: "none",
@@ -659,7 +680,11 @@ const TMBlogsPost = (props) => {
                                                             boxShadow: isFocused ? "0 4px 12px rgba(19, 85, 150, 0.6)" : "none",
                                                             cursor: 'pointer',
                                                         }, children: [_jsx(BlogPostTitle, { displayMode: displayMode, layoutMode: layoutMode, blogPost: blogPost, isSelected: isSelected, isOwnComment: isOwnComment, searchText: searchText, isSys: isSys, isHomeBlogPost: isHomeBlogPost, showId: localShowId, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), isNew && _jsx(NewBadge, { layoutMode: layoutMode }), _jsx("div", { style: { fontSize: '1rem', color: "#000", marginTop: "10px", overflow: "hidden" }, children: _jsx(TMHtmlContentDisplay, { markup: blogPost.description ?? '-', searchText: searchText, isSelected: isSelected }) }), showExtendedAttachments && blogPost.attachments && blogPost.attachments.length > 0 && (_jsx(TMBlogAttachments, { attachments: blogPost.attachments, layoutMode: layoutMode, isSelected: isSelected, searchText: searchText, dcmtTypeDescriptors: dcmtTypeDescriptors, treeFs: treeFs, draftLatestInfoMap: draftLatestInfoMap, archivedDocumentMap: archivedDocumentMap, handleAttachmentFocus: handleFocusedAttachment, openDcmtForm: openDcmtForm }))] }, `${id}-blogpost-${blogPost.id}`) })] }, "blog-post-wrapper-" + id + "-" + blogPost.id);
-                                    }), _jsx("div", { ref: bottomRef }), anchorEl && _jsx("div", { style: { position: 'fixed', zIndex: 9999 }, children: _jsx(ContextMenu, { dataSource: menuItems, target: anchorEl, onHiding: closeContextMenu }) })] }), (showTaskForm && handleNavigateToWGs && handleNavigateToDossiers && getAllTasks && deleteTaskByIdsCallback && addTaskCallback && editTaskCallback) && _jsx("div", { style: { height: "100%", width: "100%" }, children: _jsx(TMTaskForm, { id: -1, title: SDKUI_Localizator.ContextualTask, isModal: true, width: calcResponsiveSizes(deviceType, '700px', '700px', '95%'), height: calcResponsiveSizes(deviceType, '670px', '80%', '95%'), formMode: FormModes.Create, visualizedTasks: [], currentTask: currentTask, setCurrentTask: () => { }, selectedRowKeys: [], handleFocusedRowKeyChange: () => { }, onStatusChanged: () => { }, onSaved: onSavedTaskFormCallback, onClose: () => closeTaskFormCallback(), onCancel: () => closeTaskFormCallback(), usersList: participants, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, isContextualCreate: true, taskContext: taskContext, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback }) }), (dcmtForm.dcmt && dcmtForm.dcmt.TID && dcmtForm.dcmt.DID) && _jsx(TMDcmtForm, { TID: Number(dcmtForm.dcmt.TID), DID: Number(dcmtForm.dcmt.DID), layoutMode: LayoutModes.Update, onClose: closeDcmtForm, isClosable: true, titleModal: SDKUI_Localizator.Attachment + ": " + dcmtForm.dcmt.fileName, isModal: true, widthModal: "95%", heightModal: "95%", allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers }), (showFloatingCommentButton && showCommentFormCallback && !(context?.engine === 'WorkingGroupEngine' && context?.object?.customData1 === 1)) && _jsx("button", { style: {
+                                    }), _jsx("div", { ref: bottomRef }), _jsx(TMContextMenu, { items: menuItems, target: `#${id}-blogs-container`, externalControl: {
+                                            visible: menuVisible,
+                                            position: menuPosition,
+                                            onClose: closeContextMenu,
+                                        } })] }), (showTaskForm && handleNavigateToWGs && handleNavigateToDossiers && getAllTasks && deleteTaskByIdsCallback && addTaskCallback && editTaskCallback) && _jsx("div", { style: { height: "100%", width: "100%" }, children: _jsx(TMTaskForm, { id: -1, title: SDKUI_Localizator.ContextualTask, isModal: true, width: calcResponsiveSizes(deviceType, '700px', '700px', '95%'), height: calcResponsiveSizes(deviceType, '670px', '80%', '95%'), formMode: FormModes.Create, visualizedTasks: [], currentTask: currentTask, setCurrentTask: () => { }, selectedRowKeys: [], handleFocusedRowKeyChange: () => { }, onStatusChanged: () => { }, onSaved: onSavedTaskFormCallback, onClose: () => closeTaskFormCallback(), onCancel: () => closeTaskFormCallback(), usersList: participants, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, isContextualCreate: true, taskContext: taskContext, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback }) }), (dcmtForm.dcmt && dcmtForm.dcmt.TID && dcmtForm.dcmt.DID) && _jsx(TMDcmtForm, { TID: Number(dcmtForm.dcmt.TID), DID: Number(dcmtForm.dcmt.DID), layoutMode: LayoutModes.Update, onClose: closeDcmtForm, isClosable: true, titleModal: SDKUI_Localizator.Attachment + ": " + dcmtForm.dcmt.fileName, isModal: true, widthModal: "95%", heightModal: "95%", allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, onReferenceClick: handleNavigateToReference }), (showFloatingCommentButton && showCommentFormCallback && !(context?.engine === 'WorkingGroupEngine' && context?.object?.customData1 === 1)) && _jsx("button", { style: {
                                     position: 'absolute',
                                     bottom: '18px',
                                     right: '20px',

package/lib/components/index.d.ts

@@ -112,5 +112,7 @@ export * from "./features/workflow/diagram/WFDiagram";
 export * from "./features/workflow/diagram/workflowHelpers";
 export * from "./features/workflow/diagram/xmlParser";
 export * from "./features/workflow/diagram/interfaces";
+export * from "./features/workflow/diagram/DiagramItemSvgContent";
+export * from "./features/workflow/TMWorkflowPopup";
 export { default as TMWizard } from './wizard/TMWizard';
 export * from './wizard/TMWizard';

package/lib/components/index.js

@@ -133,6 +133,8 @@ export * from "./features/workflow/diagram/WFDiagram";
 export * from "./features/workflow/diagram/workflowHelpers";
 export * from "./features/workflow/diagram/xmlParser";
 export * from "./features/workflow/diagram/interfaces";
+export * from "./features/workflow/diagram/DiagramItemSvgContent";
+export * from "./features/workflow/TMWorkflowPopup";
 // wizard
 export { default as TMWizard } from './wizard/TMWizard';
 export * from './wizard/TMWizard';

package/lib/components/viewers/TMDataListItemViewer.d.ts

@@ -4,7 +4,8 @@ interface ITMDataListItemViewerProps {
     dataListId?: number;
     value?: string | Date | number;
     viewMode?: DataListViewModes;
+    showTooltip?: boolean;
 }
-declare const TMDataListItemViewer: ({ dataListId, value, viewMode }: ITMDataListItemViewerProps) => import("react/jsx-runtime").JSX.Element;
+declare const TMDataListItemViewer: ({ dataListId, value, viewMode, showTooltip }: ITMDataListItemViewerProps) => import("react/jsx-runtime").JSX.Element;
 export default TMDataListItemViewer;
 export declare const cellRenderDataListItem: (data: DataGridTypes.ColumnCellTemplateData, dataListId?: number, viewMode?: DataListViewModes) => import("react/jsx-runtime").JSX.Element;