@topconsultnpm/sdkui-react 6.19.0-dev1.9 → 6.19.0-dev2.2

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { DcmtTypeDescriptor, SearchResultDescriptor } from "@topconsultnpm/sdk-ts";
+import { DcmtTypeDescriptor, SearchResultDescriptor, DataColumnDescriptor } from "@topconsultnpm/sdk-ts";
 import { DcmtInfo } from '../../../ts';
 import { ITMTreeItem } from '../../base/TMTreeView';
 /**
@@ -17,6 +17,7 @@ export interface RelationTreeItem extends ITMTreeItem {
     isMaster?: boolean;
     isCorrelated?: boolean;
     isLoaded?: boolean;
+    isSeparator?: boolean;
     values?: any;
     searchResult?: SearchResultDescriptor[];
     itemsCount?: number;
@@ -49,8 +50,24 @@ export interface TMRelationViewerProps {
     onSelectedItemsChanged?: (items: RelationTreeItem[]) => void;
     /** Callback when a document is double-clicked */
     onDocumentDoubleClick?: (tid: number, did: number, name?: string) => void;
-    /** Custom item renderer */
-    customItemRender?: (item: RelationTreeItem | null) => JSX.Element;
+    /** Custom item renderer (full control). Return undefined to use default renderer. */
+    customItemRender?: (item: RelationTreeItem | null) => JSX.Element | undefined;
+    /** Custom document style function */
+    customDocumentStyle?: (item: RelationTreeItem) => React.CSSProperties;
+    /**
+     * Custom content renderer for the main container (when showMainDocument is false).
+     * Allows full control over the main container rendering including style and content.
+     * This replaces only the main container content, not the detail containers.
+     */
+    customMainContainerContent?: (item: RelationTreeItem, defaultContent: JSX.Element) => JSX.Element;
+    /** Custom document content renderer (partial control - replaces only metadata display) */
+    customDocumentContent?: (item: RelationTreeItem, defaultMetadataContent: JSX.Element) => JSX.Element;
+    /**
+     * Show metadata names before values (default: false).
+     * When true, displays "MetadataName: Value", otherwise just "Value".
+     * Value rendering respects DataDomain (uses TMDataListItemViewer for lists, TMUserIdViewer for users, etc.)
+     */
+    showMetadataNames?: boolean;
     /** Maximum depth level for recursive loading (default: 2) */
     maxDepthLevel?: number;
     /**
@@ -58,6 +75,23 @@ export interface TMRelationViewerProps {
      * If false, when isForMaster=true shows: master docs → detail docs as children (original navigation)
      */
     invertMasterNavigation?: boolean;
+    /**
+     * Additional static items to append at the end of the tree.
+     * These items are not loaded dynamically - they must already contain all data.
+     * Useful for showing pre-calculated documents (e.g., additional documents in dossiers).
+     * Can include a separator item by marking it with `isSeparator: true`.
+     */
+    additionalStaticItems?: RelationTreeItem[];
+    /**
+     * If false, hides the main document node and shows detail containers directly under the main container.
+     * Default: true (show main document as intermediate node)
+     */
+    showMainDocument?: boolean;
+    /**
+     * Custom label for the main container when showMainDocument is false.
+     * If not provided, uses the document type name.
+     */
+    labelMainContainer?: string;
 }
 /**
  * Check if document type has detail relations
@@ -67,5 +101,21 @@ export declare const hasDetailRelations: (mTID: number | undefined) => Promise<b
  * Check if document type has master relations
  */
 export declare const hasMasterRelations: (dTID: number | undefined) => Promise<boolean>;
+/**
+ * Get metadata keys excluding system metadata
+ */
+export declare const getMetadataKeys: (obj: any) => string[];
+/**
+ * Get display value keys for a document (max 5, prioritize SYS_Abstract)
+ */
+export declare const getDcmtDisplayValue: (obj: any) => string[];
+/**
+ * Get display value formatted by column type
+ */
+export declare const getDisplayValueByColumn: (col: DataColumnDescriptor | undefined, value: any) => any;
+/**
+ * Convert SearchResultDescriptor to structured data source with metadata
+ */
+export declare const searchResultToDataSource: (searchResult: SearchResultDescriptor | undefined, hideSysMetadata?: boolean) => Promise<any[]>;
 declare const TMRelationViewer: React.FC<TMRelationViewerProps>;
 export default TMRelationViewer;

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

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { DcmtTypeListCacheService, SDK_Globals, DataColumnTypes, MetadataFormats, SystemMIDs, MetadataDataDomains, RelationCacheService, RelationTypes } from "@topconsultnpm/sdk-ts";
-import { genUniqueId, IconBackhandIndexPointingRight, IconFolder } from '../../../helper';
+import { genUniqueId, IconFolder, IconBackhandIndexPointingRight } from '../../../helper';
 import { TMColors } from '../../../utils/theme';
 import { StyledDivHorizontal, StyledBadge } from '../../base/Styled';
 import TMTreeView from '../../base/TMTreeView';
@@ -9,9 +9,6 @@ import { TMWaitPanel } from '../../base/TMWaitPanel';
 import { TMUserIdViewer } from '../../choosers/TMUserChooser';
 import TMDataListItemViewer from '../../viewers/TMDataListItemViewer';
 import TMDcmtIcon from './TMDcmtIcon';
-// ============================================================================
-// UTILITY FUNCTIONS 
-// ============================================================================
 /**
  * Check if document type has detail relations
  */
@@ -47,26 +44,32 @@ const isManyToManyRelation = async (relationID) => {
 /**
  * Get metadata keys excluding system metadata
  */
-function getMetadataKeys(obj) {
+export const getMetadataKeys = (obj) => {
     if (!obj)
         return [];
     const keys = Object.keys(obj);
+    // Escludi metadati di sistema (MID < 100 che sono uppercase) e altri campi tecnici
     const sysMIDs = Object.values(SystemMIDs).map(o => o.toUpperCase());
     return keys.filter(k => obj?.[k].value && !sysMIDs.includes(k)).filter(o => o !== "rowIndex" && o !== "ISLEXPROT");
-}
+};
 /**
  * Get display value keys for a document (max 5, prioritize SYS_Abstract)
  */
-function getDcmtDisplayValue(obj) {
+export const getDcmtDisplayValue = (obj) => {
+    if (!obj)
+        return [];
+    // Prima cerca SYS_Abstract
+    if (obj['SYS_Abstract']?.value) {
+        return ['SYS_Abstract'];
+    }
+    // Altrimenti prendi i primi 5 metadati non di sistema
     const mdKeys = getMetadataKeys(obj);
-    if (mdKeys.includes("SYS_Abstract"))
-        return ["SYS_Abstract"];
     return mdKeys.slice(0, 5);
-}
+};
 /**
  * Get display value formatted by column type
  */
-const getDisplayValueByColumn = (col, value) => {
+export const getDisplayValueByColumn = (col, value) => {
     if (!value)
         return value;
     if (!col)
@@ -107,7 +110,7 @@ const getDisplayValueByColumn = (col, value) => {
 /**
  * Convert SearchResultDescriptor to structured data source with metadata
  */
-const searchResultToDataSource = async (searchResult, hideSysMetadata) => {
+export const searchResultToDataSource = async (searchResult, hideSysMetadata) => {
     const rows = searchResult?.dtdResult?.rows ?? [];
     const tid = searchResult?.fromTID;
     const dtd = await DcmtTypeListCacheService.GetAsync(tid);
@@ -133,11 +136,12 @@ const searchResultToDataSource = async (searchResult, hideSysMetadata) => {
     }
     return output;
 };
-const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndicator = true, allowShowZeroDcmts = true, initialShowZeroDcmts = false, allowedTIDs, allowMultipleSelection = false, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged, onDocumentDoubleClick, customItemRender, maxDepthLevel = 2, invertMasterNavigation = true, }) => {
+const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndicator = true, allowShowZeroDcmts = true, initialShowZeroDcmts = false, allowedTIDs, allowMultipleSelection = false, focusedItem, selectedItems, onFocusedItemChanged, onSelectedItemsChanged, onDocumentDoubleClick, customItemRender, customDocumentStyle, customMainContainerContent, customDocumentContent, showMetadataNames = false, maxDepthLevel = 2, invertMasterNavigation = true, additionalStaticItems = [], showMainDocument = true, labelMainContainer, }) => {
     // State
     const [dcmtTypes, setDcmtTypes] = useState([]);
     const [treeData, setTreeData] = useState([]);
     const [showZeroDcmts, setShowZeroDcmts] = useState(initialShowZeroDcmts);
+    const [staticItemsState, setStaticItemsState] = useState([]);
     // Wait Panel State (only used if allowWaitPanel is true)
     const [showWaitPanel, setShowWaitPanel] = useState(false);
     const [waitPanelTextPrimary, setWaitPanelTextPrimary] = useState('');
@@ -146,6 +150,8 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
     const [abortController] = useState(new AbortController());
     // Ref to track last loaded input to prevent unnecessary reloads
     const lastLoadedInputRef = React.useRef('');
+    // Ref to track if user has manually expanded/collapsed static items
+    const userInteractedWithStaticItemsRef = React.useRef(false);
     /**
      * Generate a stable key from inputDcmts to detect real changes
      */
@@ -386,48 +392,86 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                 const relatedDocs = isForMaster
                     ? await getMasterDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel)
                     : await getDetailDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel);
-                // Create document node WITH VALUES
-                const docNode = {
-                    key: `${isForMaster ? 'detail' : 'master'}-doc-${dcmt.TID}-${dcmt.DID}-${containerGUID}`,
-                    name: docRow?.SYS_Abstract?.value || docRow?.SYS_SUBJECT?.value || `Documento ${isForMaster ? 'Dettaglio' : 'Master'}`,
-                    tid: dcmt.TID,
-                    did: dcmt.DID,
-                    isDcmt: true,
-                    isContainer: false,
-                    expanded: tree.length === 0,
-                    isZero: dcmt.DID === 0,
-                    isMaster: !isForMaster,
-                    isRoot: true,
-                    isLoaded: true,
-                    hidden: false,
-                    values: docRow,
-                    searchResult: result ? [result] : [],
-                    items: relatedDocs,
-                    itemsCount: relatedDocs.length
-                };
-                // Create type container with unique key
-                const typeContainer = {
-                    key: `${isForMaster ? 'detail' : 'master'}-type-${dcmt.TID}-${containerGUID}`,
-                    name: result?.fromName || dtd?.name || `TID: ${dcmt.TID}`,
-                    tid: dcmt.TID,
-                    dtd,
-                    isContainer: true,
-                    isRoot: true,
-                    isLoaded: true,
-                    isZero: false, // Type container is never zero (contains documents)
-                    searchResult: result ? [result] : [],
-                    items: [docNode],
-                    itemsCount: 1,
-                    expanded: tree.length === 0
-                };
-                tree.push(typeContainer);
+                // Se showMainDocument è false, mostra i container dei dettagli direttamente sotto il container principale
+                if (!showMainDocument) {
+                    // Create type container that contains detail containers directly
+                    const typeContainer = {
+                        key: `${isForMaster ? 'detail' : 'master'}-type-${dcmt.TID}-${containerGUID}`,
+                        name: labelMainContainer || result?.fromName || dtd?.name || `TID: ${dcmt.TID}`,
+                        tid: dcmt.TID,
+                        dtd,
+                        isContainer: true,
+                        isRoot: true,
+                        isLoaded: true,
+                        isZero: false,
+                        searchResult: result ? [result] : [],
+                        items: relatedDocs, // Directly show detail containers
+                        itemsCount: relatedDocs.length,
+                        expanded: tree.length === 0,
+                        hidden: false
+                    };
+                    tree.push(typeContainer);
+                }
+                else {
+                    // MODALITÀ ORIGINALE: mostra il documento master come nodo intermedio
+                    // Create document node WITH VALUES
+                    const docNode = {
+                        key: `${isForMaster ? 'detail' : 'master'}-doc-${dcmt.TID}-${dcmt.DID}-${containerGUID}`,
+                        name: docRow?.SYS_Abstract?.value || docRow?.SYS_SUBJECT?.value || `Documento ${isForMaster ? 'Dettaglio' : 'Master'}`,
+                        tid: dcmt.TID,
+                        did: dcmt.DID,
+                        isDcmt: true,
+                        isContainer: false,
+                        expanded: tree.length === 0,
+                        isZero: dcmt.DID === 0,
+                        isMaster: !isForMaster,
+                        isRoot: true,
+                        isLoaded: true,
+                        hidden: false,
+                        values: docRow,
+                        searchResult: result ? [result] : [],
+                        items: relatedDocs,
+                        itemsCount: relatedDocs.length
+                    };
+                    // Create type container with unique key
+                    const typeContainer = {
+                        key: `${isForMaster ? 'detail' : 'master'}-type-${dcmt.TID}-${containerGUID}`,
+                        name: labelMainContainer || result?.fromName || dtd?.name || `TID: ${dcmt.TID}`,
+                        tid: dcmt.TID,
+                        dtd,
+                        isContainer: true,
+                        isRoot: true,
+                        isLoaded: true,
+                        isZero: false, // Type container is never zero (contains documents)
+                        searchResult: result ? [result] : [],
+                        items: [docNode],
+                        itemsCount: 1,
+                        expanded: tree.length === 0,
+                        hidden: false
+                    };
+                    tree.push(typeContainer);
+                }
             }
             // Update progress counter
             processedCount++;
             setWaitPanelValuePrimary(processedCount);
         }
         setTreeData(updateHiddenProperty(tree));
-    }, [inputDcmts, dcmtTypes, maxDepthLevel, isForMaster, invertMasterNavigation, getDetailDcmtsAsync, getMasterDcmtsAsync, abortController, updateHiddenProperty]);
+    }, [inputDcmts, dcmtTypes, maxDepthLevel, isForMaster, invertMasterNavigation, getDetailDcmtsAsync, getMasterDcmtsAsync, abortController, updateHiddenProperty, showMainDocument, labelMainContainer]);
+    /**
+     * Merge main tree data with additional static items
+     */
+    const mergedTreeData = useMemo(() => {
+        if (!additionalStaticItems || additionalStaticItems.length === 0) {
+            return treeData;
+        }
+        // Use staticItemsState if available (preserves expanded state), otherwise use fresh additionalStaticItems
+        const itemsToMerge = staticItemsState.length > 0 ? staticItemsState : additionalStaticItems;
+        // Append additional static items at the end
+        // NOTE: Do NOT call updateHiddenProperty on static items - they are pre-processed by the parent
+        // and may contain custom properties that would be lost by the spread operator
+        return [...treeData, ...itemsToMerge];
+    }, [treeData, additionalStaticItems, staticItemsState]);
     /**
      * Load data when inputs change
      */
@@ -435,6 +479,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         if (!inputDcmts || inputDcmts.length === 0 || dcmtTypes.length === 0) {
             setTreeData([]);
             lastLoadedInputRef.current = '';
+            userInteractedWithStaticItemsRef.current = false; // Reset interaction flag
             return;
         }
         // Generate current input key
@@ -445,6 +490,8 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         }
         // Mark as loading this key
         lastLoadedInputRef.current = currentKey;
+        // Reset interaction flag when loading new data
+        userInteractedWithStaticItemsRef.current = false;
         setShowWaitPanel(true);
         setWaitPanelMaxValuePrimary(inputDcmts.length);
         setWaitPanelValuePrimary(0);
@@ -462,10 +509,51 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
     useEffect(() => {
         setTreeData(prevData => updateHiddenProperty(prevData));
     }, [showZeroDcmts, updateHiddenProperty]);
+    /**
+     * Sync static items state when additionalStaticItems change
+     * IMPORTANT: Only update if user hasn't manually interacted with the tree,
+     * to preserve expand/collapse state
+     */
+    useEffect(() => {
+        // If user hasn't interacted yet, sync with incoming additionalStaticItems
+        if (!userInteractedWithStaticItemsRef.current) {
+            setStaticItemsState(additionalStaticItems || []);
+        }
+        // If user has interacted, we need to merge the new data with existing state
+        // to preserve expanded/collapsed state while updating content
+        else if (additionalStaticItems && additionalStaticItems.length > 0) {
+            setStaticItemsState(prevState => {
+                // Create a map of existing state by key
+                const stateMap = new Map(prevState.map(item => [item.key, item]));
+                // Merge: use existing state if available (preserves expanded), otherwise use new item
+                return additionalStaticItems.map(newItem => {
+                    const existingItem = stateMap.get(newItem.key);
+                    if (existingItem) {
+                        // Preserve expanded state but update content
+                        return {
+                            ...newItem,
+                            expanded: existingItem.expanded,
+                            items: newItem.items // Always use fresh items from parent
+                        };
+                    }
+                    return newItem;
+                });
+            });
+        }
+    }, [additionalStaticItems]);
     /**
      * Calculate items for node when expanded (lazy loading)
+     * Note: additionalStaticItems are already fully loaded, so skip calculation for them
      */
     const calculateItemsForNode = useCallback(async (node) => {
+        // Skip calculation for separator (it has no children)
+        if (node.isSeparator) {
+            return undefined;
+        }
+        // Skip calculation for additional static items (they're pre-loaded and should not trigger dynamic loading)
+        if (node.isStaticItem || node.isAdditionalContainer || node.isAdditional) {
+            return node.items;
+        }
         // If it's a document, return existing items
         if (node.isDcmt)
             return node.items;
@@ -511,45 +599,92 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         };
         // Container rendering
         if (item.isContainer || !item.isDcmt) {
-            return (_jsxs("div", { style: {
-                    display: 'flex',
-                    alignItems: 'center',
-                    gap: '10px',
-                    height: '32px',
-                    padding: '6px 0',
-                    opacity: item.isZero ? 0.4 : 1,
-                    transition: 'opacity 0.2s ease-in-out'
-                }, children: [_jsx("div", { style: { position: 'relative' }, children: _jsx(IconFolder, { color: item.isManyToMany ? '#ff8f44' : TMColors.iconLight, fontSize: 24 }) }), _jsxs(StyledDivHorizontal, { style: { gap: 5, overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis' }, children: [_jsx("p", { style: {
+            const defaultContainerStyle = {
+                display: 'flex',
+                alignItems: 'center',
+                gap: '10px',
+                height: '32px',
+                padding: '6px 0',
+                opacity: item.isZero ? 0.4 : 1,
+                transition: 'opacity 0.2s ease-in-out'
+            };
+            // Se è il container principale (root) e showMainDocument è false,
+            // non mostrare il badge perché conterrebbe il numero di sotto-container, non di documenti
+            const shouldShowBadge = !(item.isRoot && !showMainDocument);
+            const defaultContent = (_jsxs(_Fragment, { children: [_jsx("div", { style: { position: 'relative' }, children: _jsx(IconFolder, { color: item.isManyToMany ? '#ff8f44' : TMColors.iconLight, fontSize: 24 }) }), _jsxs(StyledDivHorizontal, { style: { gap: 5, overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis' }, children: [_jsx("p", { style: {
                                     whiteSpace: 'nowrap',
                                     textOverflow: 'ellipsis',
                                     fontSize: '1rem',
                                     color: 'inherit'
-                                }, children: item.name }), _jsx(StyledBadge, { "$backgroundColor": TMColors.info, children: item.items?.length ?? 0 })] })] }));
+                                }, children: item.name }), shouldShowBadge && (_jsx(StyledBadge, { "$backgroundColor": TMColors.info, children: item.items?.length ?? 0 }))] })] }));
+            // Se è il container principale (root) e abbiamo un custom renderer, usalo
+            const content = (item.isRoot && customMainContainerContent)
+                ? customMainContainerContent(item, defaultContent)
+                : defaultContent;
+            return (_jsx("div", { style: defaultContainerStyle, children: content }));
         }
         // Document rendering with full metadata display
-        return (_jsxs("div", { onDoubleClick: handleDoubleClick, style: {
-                minWidth: '90px',
-                width: '100%',
-                display: 'flex',
-                marginLeft: '5px',
-                marginTop: '5px',
-                marginBottom: '5px',
-                gap: '15px',
-                alignItems: 'center',
-                cursor: 'pointer',
-                userSelect: 'none',
-                opacity: item.isZero ? 0.4 : 1,
-                transition: 'opacity 0.2s ease-in-out'
-            }, children: [item.did && showCurrentDcmtIndicator && item.did === inputDcmts?.[0].DID ? _jsx(IconBackhandIndexPointingRight, { fontSize: 22, overflow: 'visible' }) : _jsx(_Fragment, {}), item.values && (_jsx(TMDcmtIcon, { tid: item.values?.TID?.value, did: item.values?.DID?.value, fileExtension: item.values?.FILEEXT?.value, fileCount: item.values?.FILECOUNT?.value, isLexProt: item.values?.IsLexProt?.value, isMail: item.values?.ISMAIL?.value, isShared: item.values?.ISSHARED?.value, isSigned: item.values?.ISSIGNED?.value, downloadMode: 'openInNewWindow' })), item.values && (_jsx(StyledDivHorizontal, { style: {
-                        whiteSpace: 'nowrap',
-                        textOverflow: 'ellipsis',
-                        fontSize: '1rem',
-                    }, children: getDcmtDisplayValue(item.values).map((key, index) => {
-                        const md = item.values?.[key]?.md;
-                        const value = item.values?.[key]?.value;
-                        return (_jsxs(StyledDivHorizontal, { children: [index > 0 && _jsx("p", { style: { marginRight: '2px' }, children: ";" }), md?.dataDomain == MetadataDataDomains.DataList ? (_jsx(TMDataListItemViewer, { dataListId: md.dataListID, viewMode: md.dataListViewMode, value: value })) : md?.dataDomain == MetadataDataDomains.UserID ? (_jsx(TMUserIdViewer, { userId: value, showIcon: true, noneSelectionText: '' })) : (_jsx("p", { style: { fontSize: '1rem' }, children: value }))] }, `${key}_${index}`));
-                    }) }))] }));
-    }, [onDocumentDoubleClick]);
+        const defaultDocumentStyle = {
+            minWidth: '90px',
+            width: '100%',
+            display: 'flex',
+            marginLeft: '5px',
+            marginTop: '5px',
+            marginBottom: '5px',
+            gap: '15px',
+            alignItems: 'center',
+            cursor: 'pointer',
+            userSelect: 'none',
+            opacity: item.isZero ? 0.4 : 1,
+            transition: 'opacity 0.2s ease-in-out'
+        };
+        const documentStyle = customDocumentStyle
+            ? { ...defaultDocumentStyle, ...customDocumentStyle(item) }
+            : defaultDocumentStyle;
+        const defaultMetadataContent = item.values && (_jsx(StyledDivHorizontal, { style: {
+                fontSize: '1rem',
+                overflow: 'hidden',
+                flex: 1,
+                minWidth: 0,
+                whiteSpace: 'nowrap'
+            }, children: getDcmtDisplayValue(item.values).map((key, index) => {
+                const md = item.values?.[key]?.md;
+                const value = item.values?.[key]?.value;
+                const displayValues = getDcmtDisplayValue(item.values);
+                const isLast = index === displayValues.length - 1;
+                return (_jsxs(StyledDivHorizontal, { style: {
+                        flexShrink: isLast ? 1 : 0,
+                        minWidth: isLast ? 0 : 'auto',
+                        overflow: isLast ? 'hidden' : 'visible'
+                    }, children: [index > 0 && _jsx("span", { style: { margin: '0 5px', color: '#999' }, children: "\u2022" }), showMetadataNames && (_jsxs("span", { style: { color: '#666', marginRight: '5px' }, children: [md?.name || key, ":"] })), md?.dataDomain === MetadataDataDomains.DataList ? (_jsx(TMDataListItemViewer, { dataListId: md.dataListID, viewMode: md.dataListViewMode, value: value })) : md?.dataDomain === MetadataDataDomains.UserID ? (_jsx(TMUserIdViewer, { userId: value, showIcon: true, noneSelectionText: '' })) : (_jsx("span", { style: {
+                                fontWeight: 500,
+                                overflow: isLast ? 'hidden' : 'visible',
+                                textOverflow: isLast ? 'ellipsis' : 'clip',
+                                whiteSpace: 'nowrap'
+                            }, children: value }))] }, `${key}_${index}`));
+            }) }));
+        const metadataContent = customDocumentContent
+            ? customDocumentContent(item, defaultMetadataContent || _jsx(_Fragment, {}))
+            : defaultMetadataContent;
+        return (_jsxs("div", { onDoubleClick: handleDoubleClick, style: documentStyle, children: [item.did && showCurrentDcmtIndicator && item.did === inputDcmts?.[0].DID ? _jsx(IconBackhandIndexPointingRight, { fontSize: 22, overflow: 'visible' }) : _jsx(_Fragment, {}), item.values && (_jsx(TMDcmtIcon, { tid: item.values?.TID?.value, did: item.values?.DID?.value, fileExtension: item.values?.FILEEXT?.value, fileCount: item.values?.FILECOUNT?.value, isLexProt: item.values?.IsLexProt?.value, isMail: item.values?.ISMAIL?.value, isShared: item.values?.ISSHARED?.value, isSigned: item.values?.ISSIGNED?.value, downloadMode: 'openInNewWindow' })), metadataContent] }));
+    }, [onDocumentDoubleClick, showCurrentDcmtIndicator, inputDcmts, customMainContainerContent, customDocumentStyle, customDocumentContent, showMetadataNames, showMainDocument]);
+    /**
+     * Wrapper renderer that handles custom rendering if provided
+     */
+    const finalItemRender = useCallback((item) => {
+        if (!item)
+            return _jsx("span", { children: "-" });
+        // If customItemRender is provided, try it first
+        if (customItemRender) {
+            const customResult = customItemRender(item);
+            // If custom renderer returns something (not undefined), use it
+            if (customResult !== undefined) {
+                return customResult;
+            }
+        }
+        // Otherwise use default renderer
+        return defaultItemRender(item);
+    }, [customItemRender, defaultItemRender]);
     /**
      * Handle focused item changed
      */
@@ -562,12 +697,24 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
     const handleSelectedItemsChanged = useCallback((items) => {
         onSelectedItemsChanged?.(items);
     }, [onSelectedItemsChanged]);
+    /**
+     * Handle data changed - separate static items from dynamic tree data
+     */
+    const handleDataChanged = useCallback((updatedData) => {
+        // Separate static items, separator, and dynamic correlations
+        const dynamicItems = updatedData.filter(item => !item.isStaticItem && !item.isSeparator);
+        const staticItems = updatedData.filter(item => item.isStaticItem);
+        setTreeData(dynamicItems);
+        setStaticItemsState(staticItems); // Preserve static items state (expanded/collapsed)
+        // Mark that user has interacted with the tree (expanded/collapsed nodes)
+        userInteractedWithStaticItemsRef.current = true;
+    }, []);
     if (showWaitPanel) {
         return _jsx("div", { style: { padding: '20px', textAlign: 'center' }, children: _jsx(TMWaitPanel, { title: 'Caricamento documenti dettaglio', showPrimary: true, textPrimary: waitPanelTextPrimary, valuePrimary: waitPanelValuePrimary, maxValuePrimary: waitPanelMaxValuePrimary, isCancelable: true, abortController: abortController, onAbortClick: (abortController) => { setTimeout(() => { abortController?.abort(); }, 1000); } }) });
     }
-    if (treeData.length === 0) {
+    if (mergedTreeData.length === 0) {
         return _jsx("div", { style: { padding: '20px', textAlign: 'center', color: '#666' }, children: "Nessuna relazione disponibile." });
     }
-    return (_jsx(TMTreeView, { dataSource: treeData, itemRender: customItemRender || defaultItemRender, calculateItemsForNode: calculateItemsForNode, onDataChanged: setTreeData, focusedItem: focusedItem, onFocusedItemChanged: handleFocusedItemChanged, allowMultipleSelection: allowMultipleSelection, selectedItems: selectedItems, onSelectionChanged: handleSelectedItemsChanged }));
+    return (_jsx(TMTreeView, { dataSource: mergedTreeData, itemRender: finalItemRender, calculateItemsForNode: calculateItemsForNode, onDataChanged: handleDataChanged, focusedItem: focusedItem, onFocusedItemChanged: handleFocusedItemChanged, allowMultipleSelection: allowMultipleSelection, selectedItems: selectedItems, onSelectionChanged: handleSelectedItemsChanged }));
 };
 export default TMRelationViewer;

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

@@ -1,8 +1,15 @@
 import React from 'react';
-import { DcmtTypeDescriptor, TaskDescriptor } from '@topconsultnpm/sdk-ts';
+import { DcmtTypeDescriptor, TaskDescriptor, ObjectRef, HomeBlogPost } from '@topconsultnpm/sdk-ts';
 import { DcmtInfo, TaskContext } from '../../../ts';
 import { TMSearchResultFloatingActionConfig } from './TMSearchResultFloatingActionButton';
 interface ITMSearchProps {
+    allTasks?: Array<TaskDescriptor>;
+    getAllTasks?: () => Promise<void>;
+    deleteTaskByIdsCallback?: (deletedTaskIds: Array<number>) => Promise<void>;
+    addTaskCallback?: (task: TaskDescriptor) => Promise<void>;
+    editTaskCallback?: (task: TaskDescriptor) => Promise<void>;
+    handleNavigateToWGs?: (value: HomeBlogPost | number) => Promise<void>;
+    handleNavigateToDossiers?: (value: HomeBlogPost | number) => Promise<void>;
     isVisible?: boolean;
     inputTID?: number;
     inputSqdID?: number;
@@ -26,6 +33,8 @@ interface ITMSearchProps {
         value: string;
     }>, 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 }) => {
+const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, 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();
@@ -30,6 +30,7 @@ const TMSearch = ({ openInOffice, isVisible, inputTID, inputSqdID, inputMids, is
     const [currentSearchView, setCurrentSearchView] = useState(TMSearchViews.Search);
     const [currentSQDMode, setCurrentSQDMode] = useState(1);
     const [lastQdSearched, setLastQdSearched] = useState();
+    const [showSearchResults, setShowSearchResults] = useState(true);
     const deviceType = useDeviceType();
     useEffect(() => {
         if (onCurrentTIDChangedCallback) {
@@ -76,6 +77,13 @@ const TMSearch = ({ openInOffice, isVisible, inputTID, inputSqdID, inputMids, is
             });
         }
     }, [currentSQD]);
+    useEffect(() => {
+        if (onlyShowSearchQueryPanel === undefined)
+            return;
+        if (onlyShowSearchQueryPanel) {
+            setShowSearchResults(false);
+        }
+    }, [onlyShowSearchQueryPanel]);
     const loadDataSQDsAsync = async (refreshCache, curTID) => {
         if (refreshCache) {
             SavedQueryCacheService.RemoveAll();
@@ -162,13 +170,14 @@ const TMSearch = ({ openInOffice, isVisible, inputTID, inputSqdID, inputMids, is
             SDKUI_Globals.userSettings.searchSettings.mruTIDs = newMruTIDS;
             setMruTIDs(newMruTIDS);
             setCurrentMruTID(fromTID);
+            setShowSearchResults(true);
         }, onSqdSaved: async (newSqd) => {
             await loadDataSQDsAsync(true, newSqd.masterTID);
             await setSQDAsync(newSqd);
-        } }), [fromDTD, currentSQD, isExpertMode, mruTIDs, searchResult, passToArchiveCallback, inputMids]);
+        } }), [fromDTD, showSearchResults, setShowSearchResults, currentSQD, isExpertMode, mruTIDs, searchResult, passToArchiveCallback, inputMids]);
     const tmSavedQuerySelectorElement = useMemo(() => _jsxs(TabPanel, { width: "100%", height: "100%", showNavButtons: true, repaintChangesOnly: true, selectedIndex: currentSQDMode, onSelectedIndexChange: (index) => setCurrentSQDMode(index), children: [(currentTID || currentSQD) ? _jsx(Item, { title: fromDTD?.nameLoc, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: false, items: filteredByTIDSQDs, selectedId: currentSQD?.id, onRefreshData: () => { loadDataSQDsAsync(true); }, onItemClick: (sqd) => {
                         onSQDItemClick(sqd, setSQDAsync);
-                    }, onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? filteredByTIDSQDs.find(o => o.id == 1) : currentSQD, setSQDAsync) }) }) : _jsx(_Fragment, {}), _jsx(Item, { title: SDKUI_Localizator.Alls2, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: true, items: allSQDs, manageDefault: false, onItemClick: (sqd) => {
+                    }, onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? filteredByTIDSQDs.find(o => o.id == 1) : currentSQD, setSQDAsync) }) }) : _jsx(_Fragment, {}), _jsx(Item, { title: SDKUI_Localizator.AllFemale, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: true, items: allSQDs, manageDefault: false, onItemClick: (sqd) => {
                         onSQDItemClick(sqd, setSQDAsync);
                     }, onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? undefined : currentSQD, setSQDAsync) }) })] }), [currentSQDMode, currentTID, currentSQD, fromDTD, filteredByTIDSQDs, allSQDs]);
     // --- PANEL DEFINITIONS ---
@@ -209,8 +218,8 @@ const TMSearch = ({ openInOffice, isVisible, inputTID, inputSqdID, inputMids, is
             contentOptions: { component: tmSavedQuerySelectorElement, panelContainer: { title: SDK_Localizator.SavedQueries } },
             toolbarOptions: { icon: _jsx(IconSavedQuery, { fontSize: 24 }), visible: true, orderNumber: 4, isActive: allInitialPanelVisibility['TMSavedQuerySelector'] }
         }
-    ], [tmTreeSelectorElement, tmRecentsManagerElement, tmSearchQueryPanelElement, tmSavedQuerySelectorElement, fromDTD, mruTIDs]);
-    return (_jsxs(_Fragment, { children: [_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 }) }) }), _jsx(TMSearchResult, { isVisible: isVisible && currentSearchView === TMSearchViews.Result, context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, floatingActionConfig: floatingActionConfig, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, openInOffice: openInOffice, onRefreshSearchAsync: onRefreshSearchAsync, onClose: () => { setCurrentSearchView(TMSearchViews.Search); }, onFileOpened: onFileOpened, onTaskCreateRequest: onTaskCreateRequest, openWGsCopyMoveForm: openWGsCopyMoveForm, openEditPdf: openEditPdf, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, passToArchiveCallback: passToArchiveCallback, onSelectedTIDChanged: onCurrentTIDChangedCallback, showTodoDcmtForm: showTodoDcmtForm })] }));
+    ], [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, onReferenceClick: onReferenceClick, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers })] }));
 };
 export default TMSearch;
 const TMTreeSelectorWrapper = ({ isMobile, onSelectedTIDChanged }) => {

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

@@ -19,7 +19,7 @@ interface ITMSearchQueryPanelProps {
     passToArchiveCallback?: (outputMids: Array<{
         mid: number;
         value: string;
-    }>) => void;
+    }>, tid?: number) => void;
 }
 declare const TMSearchQueryPanel: React.FunctionComponent<ITMSearchQueryPanelProps>;
 export default TMSearchQueryPanel;