@topconsultnpm/sdkui-react 6.19.0-dev1.49 → 6.19.0-dev1.50

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

@@ -7,6 +7,7 @@ export declare const StyledMultiViewPanel: import("styled-components/dist/types"
 }>> & string;
 export declare const StyledParagraph: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
 export declare const StyledToolbarForm: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledReferenceButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
 export declare const StyledPanelPage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $isOpen?: boolean;
     $padding?: string;

package/lib/components/base/Styled.js

@@ -36,6 +36,46 @@ export const StyledToolbarForm = styled.div `
     gap: 2px;
     background-color: ${TMColors.toolbar_background};
 `;
+export const StyledReferenceButton = styled.button `
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 10px 16px;
+    border-radius: 20px;
+    border: none;
+    background-color: ${TMColors.button_floating_background};
+    color: white;
+    font-size: 0.9rem;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    text-align: center;
+    max-width: 200px;
+    gap: 2px;
+    
+    &:hover {
+        opacity: 0.9;
+        transform: translateY(-1px);
+        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+    }
+    
+    &:active {
+        transform: translateY(0);
+    }
+    
+    &:disabled {
+        opacity: 0.5;
+        cursor: not-allowed;
+    }
+    
+    span {
+        width: 100%;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+`;
 export const StyledPanelPage = styled.div ` 
   position: absolute; 
   width: calc(100% - 50px); 

package/lib/components/editors/TMMetadataValues.js

@@ -402,7 +402,6 @@ const TMMetadataValues = ({ showCheckBoxes = ShowCheckBoxesMode.Never, checkPerm
         return (_jsx("div", { style: { width: '100%' }, children: dsAttachsData.length > 0 && _jsx(TMAccordion, { title: SDKUI_Localizator.Attachment, children: dsAttachsData.map(item => renderMetadataItem(item, isReadOnly)) }) }));
     }, [metadataValues, showCheckBoxes, showNullValueCheckBoxes, isReadOnly, dynDataListsToBeRefreshed, validationItems, selectedMID, isOpenDistinctValues, openChooserBySingleClick, metadataValuesOrig]);
     const layoutCustom = useMemo(() => {
-        console.log('Rendering custom layout with layout:', layout);
         if (!layout || !layout.items || layout.items.length === 0) {
             return metadataValues.map((item) => renderMetadataItem(item));
         }

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

@@ -1,6 +1,6 @@
 import React from 'react';
-import { LayoutModes, SearchResultDescriptor, TaskDescriptor } from '@topconsultnpm/sdk-ts';
-import { DcmtInfo, FormModes, TaskContext } from '../../../ts';
+import { LayoutModes, ObjectRef, SearchResultDescriptor, TaskDescriptor, ValidationItem } from '@topconsultnpm/sdk-ts';
+import { DcmtInfo, FormModes, MetadataValueDescriptorEx, TaskContext } from '../../../ts';
 interface ITMDcmtFormProps {
     TID?: number;
     DID?: number;
@@ -49,6 +49,9 @@ interface ITMDcmtFormProps {
     isSharedDcmt?: boolean;
     sharedSourceTID?: number;
     sharedSourceDID?: number;
+    allowButtonsRefs?: boolean;
+    onReferenceClick?: (ref: ObjectRef) => void;
 }
 declare const TMDcmtForm: React.FC<ITMDcmtFormProps>;
 export default TMDcmtForm;
+export declare const validateMetadataList: (mvdList?: MetadataValueDescriptorEx[]) => ValidationItem[];

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 { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import TMDcmtPreview from './TMDcmtPreview';
-import { AccessLevels, ArchiveConstraints, ArchiveEngineByID, DcmtTypeListCacheService, LayoutCacheService, LayoutModes, MetadataDataTypes, ResultTypes, SDK_Globals, SDK_Localizator, SystemMIDsAsNumber, SystemTIDs, Task_States, TemplateTIDs, TID_DID, UpdateEngineByID, ValidationItem, WorkflowCacheService, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts';
+import { AccessLevels, ArchiveConstraints, ArchiveEngineByID, DcmtTypeListCacheService, LayoutCacheService, LayoutModes, MetadataDataTypes, ObjectClasses, ResultTypes, SDK_Globals, SDK_Localizator, SystemMIDsAsNumber, SystemTIDs, Task_States, TemplateTIDs, TID_DID, UpdateEngineByID, ValidationItem, WorkflowCacheService, WorkItemMetadataNames } from '@topconsultnpm/sdk-ts';
 import { ContextMenu } from 'devextreme-react';
 import { WorkFlowApproveRejectPopUp, WorkFlowMoreInfoPopUp, WorkFlowOperationButtons, WorkFlowReAssignPopUp } from '../workflow/TMWorkflowPopup';
 import { DownloadTypes, FormModes } from '../../../ts';
@@ -11,7 +11,7 @@ import { getWorkItemSetIDAsync, handleArchiveVisibility, searchResultToMetadataV
 import { genUniqueId, IconShow, SDKUI_Localizator, updateMruTids, IconBoard, IconDcmtTypeSys, IconDetailDcmts, svgToString, IconDownload, calcIsModified, IconMenuVertical, Globalization, getListMaxItems, getSystemMetadata, IconBoxArchiveIn, IconClear, IconUndo, SDKUI_Globals, IconPreview, isTaskMoreInfo, IconWorkflow, IconSearch, deepCompare, IconCheck } from '../../../helper';
 import { hasDetailRelations, hasMasterRelations, isXMLFileExt } from '../../../helper/dcmtsHelper';
 import { Gutters, TMColors } from '../../../utils/theme';
-import { StyledFormButtonsContainer, StyledLoadingContainer, StyledModalContainer, StyledSpinner, StyledToolbarCardContainer } from '../../base/Styled';
+import { StyledFormButtonsContainer, StyledLoadingContainer, StyledModalContainer, StyledReferenceButton, StyledSpinner, StyledToolbarCardContainer } from '../../base/Styled';
 import ShowAlert from '../../base/TMAlert';
 import TMButton from '../../base/TMButton';
 import { TMExceptionBoxManager, TMMessageBoxManager, ButtonNames } from '../../base/TMPopUp';
@@ -37,7 +37,7 @@ import WFDiagram from '../workflow/diagram/WFDiagram';
 import TMTooltip from '../../base/TMTooltip';
 let abortControllerLocal = new AbortController();
 //#endregion
-const TMDcmtForm = ({ 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, inputFile = null, taskFormDialogComponent, taskMoreInfo, connectorFileSave = undefined, inputMids = [], onOpenS4TViewerRequest, s4TViewerDialogComponent, enableDragDropOverlay = false, passToSearch, isSharedDcmt = false, sharedSourceTID, sharedSourceDID }) => {
+const TMDcmtForm = ({ 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, inputFile = null, taskFormDialogComponent, taskMoreInfo, connectorFileSave = undefined, inputMids = [], 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('');
@@ -87,6 +87,11 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
     const [showCommentForm, setShowCommentForm] = useState(false);
     const [isInitialLoading, setIsInitialLoading] = useState(true);
     const [isNavigating, setIsNavigating] = useState(false);
+    const [dcmtReferences, setDcmtReferences] = useState(undefined);
+    useEffect(() => {
+        if (!allowButtonsRefs)
+            setDcmtReferences(undefined);
+    }, [allowButtonsRefs]);
     const { openConfirmAttachmentsDialog, ConfirmAttachmentsDialog } = useInputAttachmentsDialog();
     const { abortController, showWaitPanel, waitPanelTitle, showPrimary, waitPanelTextPrimary, waitPanelValuePrimary, waitPanelMaxValuePrimary, showSecondary, waitPanelTextSecondary, waitPanelValueSecondary, waitPanelMaxValueSecondary, downloadDcmtsAsync } = useDcmtOperations();
     // Custom hook to manage workflow approval data
@@ -165,9 +170,20 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
                 // 3. CustomButtonsLayout - solo se layoutMode === Update
                 layoutMode === LayoutModes.Update
                     ? LayoutCacheService.GetAsync(TID, LayoutModes.None)
+                    : Promise.resolve(undefined),
+                // 4. Opcionalmente FindAllReferencesAsync se abilitato nelle impostazioni e se i bottoni sono richiesti
+                (allowButtonsRefs && SDKUI_Globals.userSettings.searchSettings.autoFindReferences.length > 0)
+                    ? SDK_Globals.tmSession?.NewSearchEngine().FindAllReferencesAsync(TID, DID, SDKUI_Globals.userSettings.searchSettings.autoFindReferences) ?? Promise.resolve(undefined)
                     : Promise.resolve(undefined)
             ];
-            const [getMetadataResult, resLayout, customButtonsLayoutResult] = await Promise.all(parallelCalls);
+            const results = await Promise.all(parallelCalls);
+            // Destructuring: first three are always the original ones, fourth is references (or undefined)
+            const getMetadataResult = results[0];
+            const resLayout = results[1];
+            const customButtonsLayoutResult = results[2];
+            const findRefsResult = results[3];
+            // Save references result into state (may be undefined)
+            setDcmtReferences(findRefsResult);
             // Imposta il layout e customButtonsLayout immediatamente
             setLayout(resLayout);
             if (layoutMode === LayoutModes.Update && customButtonsLayoutResult) {
@@ -196,7 +212,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
             setIsInitialLoading(false);
             setIsNavigating(false);
         }
-    }, [TID, DID, layoutMode, inputFile, setMetadataList, handleReset]);
+    }, [TID, DID, layoutMode, inputFile, setMetadataList, handleReset, allowButtonsRefs]);
     const createChange = useCallback((mid, metadataType, modifiedValue) => {
         return { mid, metadataType, modifiedValue };
     }, []);
@@ -432,6 +448,7 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
     const isWFDisabled = useMemo(() => layoutMode !== LayoutModes.Update || fetchError || workItems.length <= 0, [layoutMode, fetchError, workItems.length]);
     const showToppyForApprove = useMemo(() => layoutMode === LayoutModes.Update && !fetchError && workItems.length > 0 && !isOpenDetails && !isOpenMaster, [layoutMode, fetchError, workItems.length, isOpenDetails, isOpenMaster]);
     const showToppyForCompleteMoreInfo = useMemo(() => layoutMode === LayoutModes.Update && isTaskMoreInfo(taskMoreInfo?.name) && taskMoreInfo?.state !== Task_States.Completed, [layoutMode, taskMoreInfo?.name, taskMoreInfo?.state]);
+    const showToppyForReferences = useMemo(() => allowButtonsRefs && layoutMode === LayoutModes.Update && dcmtReferences && dcmtReferences.length > 0 && !isOpenDetails && !isOpenMaster, [allowButtonsRefs, layoutMode, dcmtReferences, isOpenDetails, isOpenMaster]);
     const isMobile = useMemo(() => deviceType === DeviceType.MOBILE, [deviceType]);
     const isApprView = useMemo(() => fromDTD?.templateTID === TemplateTIDs.WF_WIApprView, [fromDTD?.templateTID]);
     const workitemSetID = useMemo(() => workItems.find(o => o.did === Number(DID))?.setID || formData.find(o => o.md?.name === WorkItemMetadataNames.WI_SetID)?.value, [workItems, DID, formData]);
@@ -1013,6 +1030,23 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
             title: SDKUI_Localizator.SignatureAndApprove,
         });
     }, [onOpenS4TViewerRequest, TID, DID]);
+    const handleNavigateToReference = useCallback((ref) => {
+        if (onReferenceClick) {
+            try {
+                onReferenceClick(ref);
+            }
+            catch (e) {
+                console.error('onReferenceClick handler failed', e);
+            }
+            return;
+        }
+    }, [onReferenceClick]);
+    // Mapping for objClass specific label/action. Easy to extend for future objClass types.
+    const referenceActionMap = useMemo(() => ({
+        [ObjectClasses.Dossier]: { label: 'Vai a pratica' },
+        [ObjectClasses.WorkingGroup]: { label: 'Vai a gruppo di lavoro' },
+        // add other ObjectClasses here as needed
+    }), []);
     const renderDcmtForm = () => {
         // Show flat spinner during initial load (before component is mounted)
         if (isInitialLoading) {
@@ -1043,12 +1077,22 @@ const TMDcmtForm = ({ showHeader = true, onSaveRecents, layoutMode = LayoutModes
                                         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 })] }), showToppyForApprove && (_jsx(ToppyHelpCenter, { deviceType: deviceType, usePortal: false, content: workItems.length === 1 ?
-                        _jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: '10px' }, children: _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 && (_jsx(ToppyHelpCenter, { deviceType: deviceType, usePortal: false, content: _jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 10 }, 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: () => {
-                                    setShowCommentForm(true);
-                                } })] }) })), (showCommentForm && TID && DID) &&
+                                } }), 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 })] }), (showToppyForApprove || showToppyForCompleteMoreInfo || showToppyForReferences) && (_jsx(ToppyHelpCenter, { deviceType: deviceType, usePortal: false, 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: () => {
+                                            setShowCommentForm(true);
+                                        } })] })), showToppyForReferences && dcmtReferences && dcmtReferences
+                                .filter(ref => ref.objClass === ObjectClasses.Dossier || ref.objClass === ObjectClasses.WorkingGroup) // keep only known objClass types
+                                .map((ref, index, arr) => {
+                                const mapEntry = referenceActionMap[String(ref.objClass)];
+                                const label = mapEntry?.label ?? 'Vai a riferimento';
+                                return (_jsxs(React.Fragment, { children: [index === 0 && (showToppyForApprove || showToppyForCompleteMoreInfo) && (_jsx("div", { style: {
+                                                height: 1,
+                                                backgroundColor: 'rgba(255,255,255,0.2)',
+                                                margin: '6px 0'
+                                            } })), _jsxs(StyledReferenceButton, { onClick: () => handleNavigateToReference(ref), children: [_jsx("span", { children: label }), _jsx("span", { children: ref.objName })] }, `ref-${index}-${ref.objID}`)] }, `ref-frag-${index}-${ref.objID}`));
+                            })] }) })), (showCommentForm && TID && DID) &&
                     _jsx(TMBlogCommentForm, { context: { engine: 'SearchEngine', object: { tid: TID, did: DID } }, onClose: () => setShowCommentForm(false), refreshCallback: handleCompleteMoreInfo, participants: [], showAttachmentsSection: false, allArchivedDocumentsFileItems: [] }), isOpenDetails &&
                     _jsx(StyledModalContainer, { style: { backgroundColor: 'white' }, children: _jsx(TMMasterDetailDcmts, { deviceType: deviceType, isForMaster: false, inputDcmts: getSelectionDcmtInfo(), allowNavigation: allowNavigation, canNext: canNext, canPrev: canPrev, onNext: onNext, onPrev: onPrev, onBack: () => setIsOpenDetails(false) }) }), isOpenMaster &&
                     _jsxs(StyledModalContainer, { style: { backgroundColor: 'white' }, children: [_jsx(TMMasterDetailDcmts, { deviceType: deviceType, inputDcmts: getSelectionDcmtInfo(), isForMaster: true, allowNavigation: allowNavigation, canNext: canNext, canPrev: canPrev, onNext: onNext, onPrev: onPrev, onBack: () => setIsOpenMaster(false), appendMasterDcmts: handleAddItem }), secondaryMasterDcmts.length > 0 && secondaryMasterDcmts.map((dcmt, index) => {
@@ -1088,7 +1132,7 @@ const applyMetadataFilter = (data, showAll, listMaxItems, TID) => {
     return showAll ? filteredData : filteredData.slice(0, listMaxItems);
 };
 //#region Validaion
-const validateMetadataList = (mvdList = []) => {
+export const validateMetadataList = (mvdList = []) => {
     if (!Array.isArray(mvdList)) {
         throw new TypeError("metadataList must be an array of ITMMetadataProps.");
     }

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

@@ -279,7 +279,7 @@ const TMRelationViewerWrapper = ({ inputDcmts, isForMaster, showCurrentDcmtIndic
 const TMFormOrResultWrapper = ({ deviceType, focusedItem, onTaskCreateRequest }) => {
     const { setPanelVisibilityById } = useTMPanelManagerContext();
     return (_jsx(_Fragment, { children: focusedItem?.isDcmt ?
-            _jsx(TMDcmtForm, { groupId: 'tmFormOrResult', TID: focusedItem?.tid, DID: focusedItem.did, isClosable: deviceType !== DeviceType.MOBILE, allowNavigation: false, allowRelations: deviceType !== DeviceType.MOBILE, showDcmtFormSidebar: false, onClose: () => {
+            _jsx(TMDcmtForm, { groupId: 'tmFormOrResult', TID: focusedItem?.tid, DID: focusedItem.did, allowButtonsRefs: true, isClosable: deviceType !== DeviceType.MOBILE, allowNavigation: false, allowRelations: deviceType !== DeviceType.MOBILE, showDcmtFormSidebar: false, onClose: () => {
                     setPanelVisibilityById('tmTreeView', true);
                 } }) :
             _jsx(TMSearchResult, { groupId: 'tmFormOrResult', isClosable: deviceType !== DeviceType.MOBILE, context: SearchResultContext.METADATA_SEARCH, allowFloatingBar: false, allowRelations: false, openDcmtFormAsModal: true, searchResults: focusedItem?.searchResult ?? [], showSearchResultSidebar: false, onTaskCreateRequest: onTaskCreateRequest, onClose: () => {

package/lib/components/features/search/TMSearch.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { DcmtTypeDescriptor, TaskDescriptor } from '@topconsultnpm/sdk-ts';
+import { DcmtTypeDescriptor, TaskDescriptor, ObjectRef } from '@topconsultnpm/sdk-ts';
 import { DcmtInfo, TaskContext } from '../../../ts';
 import { TMSearchResultFloatingActionConfig } from './TMSearchResultFloatingActionButton';
 interface ITMSearchProps {
@@ -27,6 +27,7 @@ interface ITMSearchProps {
     }>, tid?: number) => void;
     onCurrentTIDChangedCallback?: (tid: number | undefined) => void;
     onlyShowSearchQueryPanel?: boolean;
+    onReferenceClick?: (ref: ObjectRef) => void;
 }
 declare const TMSearch: React.FunctionComponent<ITMSearchProps>;
 export default TMSearch;

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

@@ -18,7 +18,7 @@ var TMSearchViews;
     TMSearchViews[TMSearchViews["Search"] = 0] = "Search";
     TMSearchViews[TMSearchViews["Result"] = 1] = "Result";
 })(TMSearchViews || (TMSearchViews = {}));
-const TMSearch = ({ openInOffice, isVisible, inputTID, inputSqdID, inputMids, isExpertMode = SDKUI_Globals.userSettings.advancedSettings.expertMode === 1, floatingActionConfig, onFileOpened, onRefreshAfterAddDcmtToFavs, onTaskCreateRequest, openWGsCopyMoveForm, openEditPdf, openS4TViewer, onOpenS4TViewerRequest, showTodoDcmtForm, passToArchiveCallback, onCurrentTIDChangedCallback, onlyShowSearchQueryPanel }) => {
+const TMSearch = ({ openInOffice, isVisible, inputTID, inputSqdID, inputMids, isExpertMode = SDKUI_Globals.userSettings.advancedSettings.expertMode === 1, floatingActionConfig, onFileOpened, onRefreshAfterAddDcmtToFavs, onTaskCreateRequest, openWGsCopyMoveForm, openEditPdf, openS4TViewer, onOpenS4TViewerRequest, showTodoDcmtForm, passToArchiveCallback, onCurrentTIDChangedCallback, onlyShowSearchQueryPanel, onReferenceClick }) => {
     const [allSQDs, setAllSQDs] = useState([]);
     const [filteredByTIDSQDs, setFilteredByTIDSQDs] = useState([]);
     const [currentSQD, setCurrentSQD] = useState();
@@ -219,7 +219,7 @@ const TMSearch = ({ openInOffice, isVisible, inputTID, inputSqdID, inputMids, is
             toolbarOptions: { icon: _jsx(IconSavedQuery, { fontSize: 24 }), visible: true, orderNumber: 4, isActive: allInitialPanelVisibility['TMSavedQuerySelector'] }
         }
     ], [tmTreeSelectorElement, showSearchResults, tmRecentsManagerElement, tmSearchQueryPanelElement, tmSavedQuerySelectorElement, fromDTD, mruTIDs]);
-    return (_jsxs(_Fragment, { children: [showSearchResults ? _jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.Search, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'TMRecentsManager', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) }) : tmSearchQueryPanelElement, showSearchResults && _jsx(TMSearchResult, { isVisible: isVisible && currentSearchView === TMSearchViews.Result, context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, floatingActionConfig: floatingActionConfig, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, openInOffice: openInOffice, onRefreshSearchAsync: onRefreshSearchAsync, onClose: () => { onlyShowSearchQueryPanel ? setShowSearchResults(false) : setCurrentSearchView(TMSearchViews.Search); }, onFileOpened: onFileOpened, onTaskCreateRequest: onTaskCreateRequest, openWGsCopyMoveForm: openWGsCopyMoveForm, openEditPdf: openEditPdf, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, passToArchiveCallback: passToArchiveCallback, onSelectedTIDChanged: onCurrentTIDChangedCallback, showTodoDcmtForm: showTodoDcmtForm })] }));
+    return (_jsxs(_Fragment, { children: [showSearchResults ? _jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.Search, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'TMRecentsManager', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) }) : tmSearchQueryPanelElement, showSearchResults && _jsx(TMSearchResult, { isVisible: isVisible && currentSearchView === TMSearchViews.Result, context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, floatingActionConfig: floatingActionConfig, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, openInOffice: openInOffice, onRefreshSearchAsync: onRefreshSearchAsync, onClose: () => { onlyShowSearchQueryPanel ? setShowSearchResults(false) : setCurrentSearchView(TMSearchViews.Search); }, onFileOpened: onFileOpened, onTaskCreateRequest: onTaskCreateRequest, openWGsCopyMoveForm: openWGsCopyMoveForm, openEditPdf: openEditPdf, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, passToArchiveCallback: passToArchiveCallback, onSelectedTIDChanged: onCurrentTIDChangedCallback, showTodoDcmtForm: showTodoDcmtForm, onReferenceClick: onReferenceClick })] }));
 };
 export default TMSearch;
 const TMTreeSelectorWrapper = ({ isMobile, onSelectedTIDChanged }) => {

package/lib/components/features/search/TMSearchResult.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SearchResultDescriptor, DcmtTypeDescriptor, TaskDescriptor, WorkingGroupDescriptor } from '@topconsultnpm/sdk-ts';
+import { SearchResultDescriptor, DcmtTypeDescriptor, TaskDescriptor, WorkingGroupDescriptor, ObjectRef } from '@topconsultnpm/sdk-ts';
 import { DcmtInfo, SearchResultContext, TaskContext } from '../../../ts';
 import { TMSearchResultFloatingActionConfig } from './TMSearchResultFloatingActionButton';
 export declare const getSearchResultCountersSingleCategory: (searchResults: SearchResultDescriptor[]) => string;
@@ -40,6 +40,7 @@ interface ITMSearchResultProps {
         value: string;
     }>, tid?: number) => void;
     showTodoDcmtForm?: boolean;
+    onReferenceClick?: (ref: ObjectRef) => void;
 }
 declare const TMSearchResult: React.FC<ITMSearchResultProps>;
 export default TMSearchResult;

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

@@ -59,7 +59,7 @@ const orderByName = (array) => {
         return 1;
     } return 0; });
 };
-const TMSearchResult = ({ context = SearchResultContext.METADATA_SEARCH, isVisible = true, allowRelations = true, openDcmtFormAsModal = false, searchResults = [], showSearchResultSidebar = true, showSelector = false, groupId, title, isClosable = false, allowFloatingBar = true, showToolbarHeader = true, showBackButton = true, selectedSearchResultTID, workingGroupContext = undefined, disableAccordionIfSingleCategory = false, floatingActionConfig, openInOffice, onRefreshAfterAddDcmtToFavs, onRefreshSearchAsync, onSelectedTIDChanged, onWFOperationCompleted, onClose, onFileOpened, onTaskCreateRequest, openWGsCopyMoveForm, openEditPdf, openCommentFormCallback, openAddDocumentForm, openS4TViewer = false, onOpenS4TViewerRequest, passToArchiveCallback, showTodoDcmtForm = false }) => {
+const TMSearchResult = ({ context = SearchResultContext.METADATA_SEARCH, isVisible = true, allowRelations = true, openDcmtFormAsModal = false, searchResults = [], showSearchResultSidebar = true, showSelector = false, groupId, title, isClosable = false, allowFloatingBar = true, showToolbarHeader = true, showBackButton = true, selectedSearchResultTID, workingGroupContext = undefined, disableAccordionIfSingleCategory = false, floatingActionConfig, openInOffice, onRefreshAfterAddDcmtToFavs, onRefreshSearchAsync, onSelectedTIDChanged, onWFOperationCompleted, onClose, onFileOpened, onTaskCreateRequest, openWGsCopyMoveForm, openEditPdf, openCommentFormCallback, openAddDocumentForm, openS4TViewer = false, onOpenS4TViewerRequest, passToArchiveCallback, showTodoDcmtForm = false, onReferenceClick }) => {
     const [id, setID] = useState('');
     const [showApprovePopup, setShowApprovePopup] = useState(false);
     const [showRejectPopup, setShowRejectPopup] = useState(false);
@@ -644,9 +644,9 @@ const TMSearchResult = ({ context = SearchResultContext.METADATA_SEARCH, isVisib
                         :
                             _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmSearchResult', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", parentId: groupId, showToolbar: showSearchResultSidebar }) }) }) }), _jsx(StyledMultiViewPanel, { "$isVisible": isOpenDetails, children: isOpenDetails && _jsx(TMMasterDetailDcmts, { deviceType: deviceType, isForMaster: false, inputDcmts: getSelectionDcmtInfo(), allowNavigation: focusedItem && selectedItems.length <= 0, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onBack: () => setIsOpenDetails(false) }) }), _jsxs(StyledMultiViewPanel, { "$isVisible": isOpenMaster, children: [isOpenMaster && _jsx(TMMasterDetailDcmts, { deviceType: deviceType, inputDcmts: getSelectionDcmtInfo(), isForMaster: true, allowNavigation: focusedItem && selectedItems.length <= 0, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onBack: () => setIsOpenMaster(false), appendMasterDcmts: handleAddItem }), secondaryMasterDcmts.length > 0 && secondaryMasterDcmts.map((dcmt, index) => {
                         return (_jsx(StyledModalContainer, { style: { backgroundColor: 'white' }, children: _jsx(TMMasterDetailDcmts, { deviceType: deviceType, inputDcmts: [dcmt], isForMaster: true, allowNavigation: false, onBack: () => handleRemoveItem(dcmt.TID, dcmt.DID), appendMasterDcmts: handleAddItem }) }, `${index}-${dcmt.DID}`));
-                    })] }), _jsx(StyledMultiViewPanel, { "$isVisible": isOpenDcmtForm, children: isOpenDcmtForm && _jsx(TMDcmtForm, { isModal: openDcmtFormAsModal || (dcmtFormLayoutMode === LayoutModes.Ark && focusedItem?.DID), titleModal: fromDTD?.name ?? '', TID: focusedItem?.TID, DID: focusedItem?.DID, layoutMode: dcmtFormLayoutMode, count: visibleItems.length, itemIndex: visibleItems.findIndex(o => o.rowIndex === focusedItem?.rowIndex) + 1, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onClose: () => { setIsOpenDcmtForm(false); }, onWFOperationCompleted: onWFOperationCompleted, onTaskCreateRequest: onTaskCreateRequest, onSavedAsyncCallback: async (tid, did, metadataResult) => {
+                    })] }), _jsx(StyledMultiViewPanel, { "$isVisible": isOpenDcmtForm, children: isOpenDcmtForm && _jsx(TMDcmtForm, { isModal: openDcmtFormAsModal || (dcmtFormLayoutMode === LayoutModes.Ark && focusedItem?.DID), titleModal: fromDTD?.name ?? '', TID: focusedItem?.TID, DID: focusedItem?.DID, allowButtonsRefs: true, layoutMode: dcmtFormLayoutMode, count: visibleItems.length, itemIndex: visibleItems.findIndex(o => o.rowIndex === focusedItem?.rowIndex) + 1, canNext: canNavigateHandler('next'), canPrev: canNavigateHandler('prev'), onNext: () => onNavigateHandler('next'), onPrev: () => onNavigateHandler('prev'), onClose: () => { setIsOpenDcmtForm(false); }, onWFOperationCompleted: onWFOperationCompleted, onTaskCreateRequest: onTaskCreateRequest, onSavedAsyncCallback: async (tid, did, metadataResult) => {
                         await refreshFocusedDataRowAsync(tid, did, true, metadataResult);
-                    }, onOpenS4TViewerRequest: onOpenS4TViewerRequest }) }), isOpenArchiveRelationForm && _jsx(TMDcmtForm, { isModal: true, titleModal: SDKUI_Localizator.Archive + ' - ' + (archiveType === 'detail' ? SDKUI_Localizator.DcmtsDetail : SDKUI_Localizator.DcmtsMaster), TID: archiveRelatedDcmtFormTID, layoutMode: LayoutModes.Ark, inputMids: archiveRelatedDcmtFormMids, showBackButton: false, onClose: () => {
+                    }, onOpenS4TViewerRequest: onOpenS4TViewerRequest, onReferenceClick: onReferenceClick }) }), isOpenArchiveRelationForm && _jsx(TMDcmtForm, { isModal: true, titleModal: SDKUI_Localizator.Archive + ' - ' + (archiveType === 'detail' ? SDKUI_Localizator.DcmtsDetail : SDKUI_Localizator.DcmtsMaster), TID: archiveRelatedDcmtFormTID, layoutMode: LayoutModes.Ark, inputMids: archiveRelatedDcmtFormMids, showBackButton: false, allowButtonsRefs: false, onClose: () => {
                     setIsOpenArchiveRelationForm(false);
                     setArchiveType(undefined);
                     setArchiveRelatedDcmtFormTID(undefined);

package/lib/components/grids/TMBlogsUtils.d.ts

@@ -76,6 +76,7 @@ export declare const getAttachmentInfo: (attachment: BlogPostAttachment, treeFs:
     draftExist: boolean;
     archivedDocumentsExist: boolean;
 };
+export declare const findFileItemByTidDid: (tree: FileItem | undefined, tid: number | undefined, did: number | undefined) => FileItem | null;
 export declare const AttachmentElement: (attachment: BlogPostAttachment, treeFs: FileItem | undefined, draftLatestInfoMap: Map<number, {
     latestVersion: number;
     folderId: number;

package/lib/components/grids/TMBlogsUtils.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import styled from "styled-components";
-import { SDK_Globals } from "@topconsultnpm/sdk-ts";
+import { SDK_Globals, SystemTIDs } from "@topconsultnpm/sdk-ts";
 import { extractInitialsFromName, formatBytes, getAvatarColor, IconAttachment, IconCADossier, IconMenuCAWorkingGroups, SDKUI_Localizator } from "../../helper";
 import TMTooltip from "../base/TMTooltip";
 import { TMColors } from '../../utils/theme';
@@ -130,14 +130,48 @@ export const getAttachmentInfo = (attachment, treeFs, draftLatestInfoMap, archiv
             }
         }
         if (descriptor) {
+            // Default name from descriptor
             name = descriptor.name ?? "-";
+            // If descriptor is DSAttachs, try to find the actual archived file in treeFs by tid/did
+            if (descriptor.id === SystemTIDs.DSAttachs && treeFs && attachment.tid && attachment.did) {
+                const found = findFileItemByTidDid(treeFs, attachment.tid, attachment.did);
+                if (found) {
+                    name = found.name ?? name;
+                    fileExt = found.ext ?? (found.name && found.name.includes('.') ? found.name.substring(found.name.lastIndexOf('.') + 1) : fileExt);
+                    archivedDocumentsExist = true;
+                }
+            }
             const content = (_jsxs("div", { children: [archivedDocumentMap && (_jsxs("div", { children: [_jsx("span", { style: { fontWeight: 'bold' }, children: SDKUI_Localizator.Size }), ": ", fileSize] })), _jsx("hr", {}), _jsxs("div", { children: [_jsx("span", { style: { fontWeight: 'bold' }, children: SDKUI_Localizator.Path }), ": \"", SDKUI_Localizator.ArchivedDocuments, "\\", `${descriptor.name} (DID: ${attachment.did})`, "\""] })] }));
             tooltipContent = getTooltipContent(descriptor.name, content);
-            nameElement = (_jsx("span", { children: highlightText(`${name} (DID: ${attachment.did})`, searchText, isSelected) }));
+            nameElement = (_jsx("span", { children: descriptor.id !== SystemTIDs.DSAttachs
+                    ? highlightText(`${name} (DID: ${attachment.did})`, searchText, isSelected)
+                    : highlightText(`${name}`, searchText, isSelected) }));
         }
     }
     return { name, nameElement, tooltipContent, folderId, fileExt, draftExist, archivedDocumentsExist };
 };
+// Helper: find a file item by tid and did inside the treeFs structure
+export const findFileItemByTidDid = (tree, tid, did) => {
+    if (!tree || tid === undefined || did === undefined)
+        return null;
+    const stack = [tree];
+    while (stack.length > 0) {
+        const node = stack.pop();
+        if (!node)
+            continue;
+        if (!node.isDirectory) {
+            if ((node.tid === tid || node.tid === Number(tid)) && (node.did === did || node.did === Number(did))) {
+                return node;
+            }
+        }
+        if (node.items && node.items.length > 0) {
+            for (const child of node.items) {
+                stack.push(child);
+            }
+        }
+    }
+    return null;
+};
 export const AttachmentElement = (attachment, treeFs, draftLatestInfoMap, archivedDocumentMap, dcmtTypeDescriptors, isSelected, searchText, color, setShowDcmtForm, handleFocusedAttachment, setAnchorEl, contextMenuRef) => {
     const { name, nameElement, tooltipContent, fileExt, archivedDocumentsExist, draftExist } = getAttachmentInfo(attachment, treeFs, draftLatestInfoMap, archivedDocumentMap, dcmtTypeDescriptors, isSelected, searchText, color);
     const onDoubleClick = (e) => {

package/lib/utils/theme.d.ts

@@ -50,6 +50,7 @@ declare class TMColors {
     static separator: string;
     static button_primary: string;
     static iconLight: string;
+    static button_floating_background: string;
 }
 declare class FontSize {
     static defaultFontSize: string;

package/lib/utils/theme.js

@@ -58,6 +58,7 @@ TMColors._colorHeader = "black";
 TMColors.separator = "#00A99D";
 TMColors.button_primary = '#4A96D2';
 TMColors.iconLight = "#9fc6e7";
+TMColors.button_floating_background = "#C2388B";
 class FontSize {
 }
 FontSize.defaultFontSize = '1rem';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@topconsultnpm/sdkui-react",
-    "version": "6.19.0-dev1.49",
+    "version": "6.19.0-dev1.50",
     "description": "",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",