@topconsultnpm/sdkui-react 6.20.0-dev3.10 → 6.20.0-dev3.12

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

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import { DcmtTypeListCacheService, SDK_Localizator } from '@topconsultnpm/sdk-ts';
-import styled from 'styled-components';
 import TMRelationViewer from './TMRelationViewer';
 import TMContextMenu from '../../NewComponents/ContextMenu/TMContextMenu';
-import { genUniqueId, IconMultipleSelection, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, IconMenuVertical, IconDataList, IconPreview, IconSearchCheck, IconBoard, IconDcmtTypeSys, IconShow, getMoreInfoTasksForDocument } from '../../../helper';
+import { IconMultipleSelection, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, IconMenuVertical, IconDataList, IconPreview, IconSearchCheck, IconBoard, IconDcmtTypeSys, IconShow, getMoreInfoTasksForDocument } from '../../../helper';
 import { FormModes, SearchResultContext } from '../../../ts';
 import { TMColors } from '../../../utils/theme';
+import ShowAlert from '../../base/TMAlert';
 import { DeviceType } from '../../base/TMDeviceProvider';
 import { TMSaveFormButtonPrevious, TMSaveFormButtonNext } from '../../forms/TMSaveForm';
 import TMPanelManagerContainer from '../../layout/panelManager/TMPanelManagerContainer';
@@ -14,56 +14,15 @@ import { TMPanelManagerProvider, useTMPanelManagerContext } from '../../layout/p
 import TMSearchResult from '../search/TMSearchResult';
 import TMDcmtForm from './TMDcmtForm';
 import { TMNothingToShow } from './TMDcmtPreview';
-import TMButton from '../../base/TMButton';
-const StyledNoRelationsOverlay = styled.div `
-    width: 100%;
-    height: 100%;
-    position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 1501;
-    overflow: visible; 
-    background-color: rgba(0, 0, 0, 0.5);
-    backdrop-filter: blur(8px);
-`;
-const StyledNoRelationsPanel = styled.div `
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    width: 400px; 
-    background: white; 
-    border-radius: 8px; 
-    padding: 20px; 
-    text-align: center; 
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-`;
-const StyledNoRelationsTitle = styled.h2 `
-    margin: 0 0 20px 0;
-    font-size: 1.3em;
-    color: #333;
-`;
-const StyledNoRelationsMessage = styled.p `
-    color: #666;
-    font-size: 1em;
-    margin: 0 0 25px 0;
-    line-height: 1.4;
-`;
+import { Spinner } from '../..';
 const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTaskCallback, editTaskCallback, handleNavigateToWGs, handleNavigateToDossiers, deviceType, inputDcmts, isForMaster, showCurrentDcmtIndicator = true, allowNavigation, canNext, canPrev, onNext, onPrev, onBack, appendMasterDcmts, onTaskCreateRequest }) => {
-    const [id, setID] = useState('');
     const [focusedItem, setFocusedItem] = useState();
     const [selectedItems, setSelectedItems] = useState([]);
     const [showZeroDcmts, setShowZeroDcmts] = useState(false);
     const [allowMultipleSelection, setAllowMultipleSelection] = useState(false);
     const [dtdMaster, setDtdMaster] = useState();
-    const [showNoRelationsModal, setShowNoRelationsModal] = useState(false);
-    const [shouldGoBackOnClose, setShouldGoBackOnClose] = useState(false);
-    // Ref to track if this is the first load (vs navigation with onPrev/onNext)
-    const isFirstLoadRef = useRef(true);
-    useEffect(() => { setID(genUniqueId()); }, []);
+    const [noRelationsOnFirstLoad, setNoRelationsOnFirstLoad] = useState(false);
+    const [isCheckingFirstLoad, setIsCheckingFirstLoad] = useState(true);
     // Load dtdMaster when inputDcmts changes
     useEffect(() => {
         const loadDtdMaster = async () => {
@@ -82,23 +41,31 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
     }, [inputDcmts?.length, inputDcmts?.[0]?.TID, isForMaster]);
     const handleFocusedItemChanged = useCallback((item) => {
         setFocusedItem(item);
-        // When data is loaded and an item is focused, mark as no longer first load
         if (item) {
-            isFirstLoadRef.current = false;
+            setIsCheckingFirstLoad(false);
         }
     }, []);
     const handleSelectedItemsChanged = useCallback((items) => {
         setSelectedItems(items);
     }, []);
     const handleNoRelationsFound = useCallback(() => {
-        // Show modal only on first load, not during navigation with onPrev/onNext
-        if (isFirstLoadRef.current) {
-            setShowNoRelationsModal(true);
-            setShouldGoBackOnClose(true);
+        if (isCheckingFirstLoad) {
+            setNoRelationsOnFirstLoad(true);
         }
-        // Mark as no longer first load
-        isFirstLoadRef.current = false;
-    }, []);
+    }, [isCheckingFirstLoad]);
+    // Show warning alert and navigate back when no relations found on first load
+    useEffect(() => {
+        if (noRelationsOnFirstLoad) {
+            setNoRelationsOnFirstLoad(false);
+            ShowAlert({
+                message: SDKUI_Localizator.RelatedDcmtsNotFound,
+                title: SDKUI_Localizator.RelationsNotFound,
+                duration: 3000,
+                mode: 'warning',
+            });
+            onBack?.();
+        }
+    }, [noRelationsOnFirstLoad, onBack]);
     const commandsMenuItems = [
         {
             icon: _jsx(IconMultipleSelection, { color: allowMultipleSelection ? TMColors.tertiary : TMColors.text_normal }),
@@ -123,7 +90,7 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             }
         }
     ];
-    const toolbar = _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [allowMultipleSelection && _jsx("p", { style: { color: TMColors.colorHeader, textAlign: 'center', padding: '1px 4px', borderRadius: '3px', display: 'flex' }, children: `${selectedItems.length} selezionati` }), allowNavigation && canPrev != undefined && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canPrev: canPrev, onPrev: onPrev }), allowNavigation && canNext != undefined && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canNext: canNext, onNext: onNext }), _jsx(TMContextMenu, { items: commandsMenuItems, trigger: 'left', children: _jsx(IconMenuVertical, { color: 'white', cursor: 'pointer' }) })] });
+    const toolbar = _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '10px' }, children: [allowMultipleSelection && _jsx("p", { style: { color: TMColors.colorHeader, textAlign: 'center', padding: '1px 4px', borderRadius: '3px', display: 'flex' }, children: `${selectedItems.filter(item => item.isDcmt).length} selezionati` }), allowNavigation && canPrev != undefined && _jsx(TMSaveFormButtonPrevious, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canPrev: canPrev, onPrev: onPrev }), allowNavigation && canNext != undefined && _jsx(TMSaveFormButtonNext, { btnStyle: 'icon', iconColor: 'white', isModified: false, formMode: FormModes.ReadOnly, canNext: canNext, onNext: onNext }), _jsx(TMContextMenu, { items: commandsMenuItems, trigger: 'left', children: _jsx(IconMenuVertical, { color: 'white', cursor: 'pointer' }) })] });
     const getTitle = () => isForMaster ? `${SDKUI_Localizator.DcmtsMaster} - ${dtdMaster?.nameLoc}` : SDKUI_Localizator.DcmtsDetail;
     const isMobile = deviceType === DeviceType.MOBILE;
     const tmTreeView = useMemo(() => _jsx(_Fragment, { children: !inputDcmts || inputDcmts.length === 0
@@ -210,12 +177,7 @@ const TMMasterDetailDcmts = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallba
             toolbarOptions: { icon: _jsx(IconSearchCheck, { fontSize: 24 }), visible: false, orderNumber: 2, isActive: allInitialPanelVisibility['tmFormOrResult'] }
         }
     ], [tmTreeView, tmFormOrResult, focusedItem?.isDcmt, dtdMaster]);
-    return (_jsxs(_Fragment, { children: [_jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmTreeView', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }), showNoRelationsModal && (_jsx(StyledNoRelationsOverlay, { children: _jsxs(StyledNoRelationsPanel, { children: [_jsx(StyledNoRelationsTitle, { children: SDKUI_Localizator.RelationsNotFound }), _jsx(StyledNoRelationsMessage, { children: SDKUI_Localizator.RelatedDcmtsNotFound }), _jsx(TMButton, { caption: "OK", showTooltip: false, onClick: () => {
-                                setShowNoRelationsModal(false);
-                                if (shouldGoBackOnClose) {
-                                    onBack?.();
-                                }
-                            }, btnStyle: "normal" })] }) }))] }));
+    return (_jsxs("div", { style: { width: '100%', height: '100%', position: 'relative' }, children: [isCheckingFirstLoad && (_jsx(Spinner, { description: SDKUI_Localizator.Loading, flat: true })), _jsx("div", { style: isCheckingFirstLoad ? { position: 'absolute', width: 0, height: 0, overflow: 'hidden', opacity: 0, pointerEvents: 'none' } : { width: '100%', height: '100%' }, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmTreeView', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) })] }));
 };
 export default TMMasterDetailDcmts;
 /**

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

@@ -399,7 +399,8 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
     /**
      * Helper function to set up initial tree expansion state.
      * Called after all data is loaded but before setTreeData.
-     * Ensures: root container expanded, first document expanded with isRoot=true (for focus), first correlation folder expanded
+     * Ensures: root container expanded, first document expanded with isRoot=true (for focus),
+     * first correlation folder expanded ONLY if it's the only one (single correlation type)
      * Returns a NEW tree with the modifications (immutable approach)
      */
     const setupInitialTreeExpansion = (tree) => {
@@ -426,9 +427,10 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                     expanded: true,
                     isRoot: true
                 };
-                // 3. Expand first correlation folder (child of the document)
+                // 3. Expand first correlation folder ONLY if there's exactly one
                 const docItems = newFirstDoc.items;
-                if (docItems && docItems.length > 0 && docItems[0].isContainer) {
+                const containerChildren = docItems?.filter(child => child.isContainer) ?? [];
+                if (containerChildren.length === 1 && docItems && docItems.length > 0 && docItems[0].isContainer) {
                     const newFirstCorrelation = { ...docItems[0], expanded: true };
                     newFirstDoc = {
                         ...newFirstDoc,
@@ -442,10 +444,13 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                 };
             }
             else if (firstDocOrContainer.isContainer) {
-                // First item is a container (correlation folder) - expand it
+                // First item is a container (correlation folder)
+                // Count how many sibling containers there are
+                const siblingContainers = firstRootItems.filter(child => child.isContainer);
+                const shouldExpand = siblingContainers.length === 1;
                 let newFirstCorrelation = {
                     ...firstDocOrContainer,
-                    expanded: true
+                    expanded: shouldExpand
                 };
                 // Find first document inside this container and mark for focus
                 const containerItems = newFirstCorrelation.items;
@@ -517,8 +522,25 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                         }
                     }
                 }
-                // Aggiungi i master come root
-                tree.push(...masterDocs);
+                // Aggiungi i master come root, raggruppando per TID e relationId
+                for (const masterContainer of masterDocs) {
+                    const existingContainer = tree.find(c => c.tid === masterContainer.tid && c.relationId === masterContainer.relationId && c.isContainer);
+                    if (existingContainer) {
+                        // Merge documents into existing container, deduplicating by DID
+                        const existingItems = existingContainer.items ?? [];
+                        const existingDIDs = new Set(existingItems.map(item => item.did));
+                        const newItems = (masterContainer.items ?? []).filter(item => !existingDIDs.has(item.did));
+                        existingContainer.items = [...existingItems, ...newItems];
+                        existingContainer.itemsCount = existingContainer.items.length;
+                        existingContainer.isZero = existingContainer.items.length === 0;
+                        if (masterContainer.searchResult) {
+                            existingContainer.searchResult = [...(existingContainer.searchResult ?? []), ...masterContainer.searchResult];
+                        }
+                    }
+                    else {
+                        tree.push(masterContainer);
+                    }
+                }
             }
             // ========================================================================
             // MODALITÀ STANDARD (detail o master invertito)
@@ -530,22 +552,53 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                     : await getDetailDcmtsAsync(dcmt.TID, dcmt.DID, maxDepthLevel);
                 // 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,
-                        isLoaded: true,
-                        isZero: false,
-                        searchResult: result ? [result] : [],
-                        items: relatedDocs, // Directly show detail containers
-                        itemsCount: relatedDocs.length,
-                        expanded: false,
-                        hidden: false
-                    };
-                    tree.push(typeContainer);
+                    // Check if a container for this TID already exists in the tree
+                    const existingContainer = tree.find(c => c.tid === dcmt.TID && c.isContainer);
+                    if (existingContainer) {
+                        // Merge relatedDocs into existing container, grouping sub-containers by TID+relationId
+                        const existingItems = existingContainer.items ?? [];
+                        for (const relDoc of relatedDocs) {
+                            const existingSub = existingItems.find(s => s.tid === relDoc.tid && s.relationId === relDoc.relationId && s.isContainer);
+                            if (existingSub) {
+                                // Merge documents into existing sub-container, deduplicating by DID
+                                const subItems = existingSub.items ?? [];
+                                const existingDIDs = new Set(subItems.map(item => item.did));
+                                const newItems = (relDoc.items ?? []).filter(item => !existingDIDs.has(item.did));
+                                existingSub.items = [...subItems, ...newItems];
+                                existingSub.itemsCount = existingSub.items.length;
+                                existingSub.isZero = existingSub.items.length === 0;
+                                if (relDoc.searchResult) {
+                                    existingSub.searchResult = [...(existingSub.searchResult ?? []), ...relDoc.searchResult];
+                                }
+                            }
+                            else {
+                                existingItems.push(relDoc);
+                            }
+                        }
+                        existingContainer.items = existingItems;
+                        existingContainer.itemsCount = existingItems.length;
+                        if (result) {
+                            existingContainer.searchResult = [...(existingContainer.searchResult ?? []), result];
+                        }
+                    }
+                    else {
+                        // 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,
+                            isLoaded: true,
+                            isZero: false,
+                            searchResult: result ? [result] : [],
+                            items: relatedDocs, // Directly show detail containers
+                            itemsCount: relatedDocs.length,
+                            expanded: false,
+                            hidden: false
+                        };
+                        tree.push(typeContainer);
+                    }
                 }
                 else {
                     // MODALITÀ ORIGINALE: mostra il documento master come nodo intermedio
@@ -567,22 +620,35 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
                         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,
-                        isLoaded: true,
-                        isZero: false, // Type container is never zero (contains documents)
-                        searchResult: result ? [result] : [],
-                        items: [docNode],
-                        itemsCount: 1,
-                        expanded: false,
-                        hidden: false
-                    };
-                    tree.push(typeContainer);
+                    // Check if a type container for this TID already exists in the tree
+                    const existingContainer = tree.find(c => c.tid === dcmt.TID && c.isContainer);
+                    if (existingContainer) {
+                        // Add document to existing container
+                        const existingItems = existingContainer.items ?? [];
+                        existingContainer.items = [...existingItems, docNode];
+                        existingContainer.itemsCount = existingContainer.items.length;
+                        if (result) {
+                            existingContainer.searchResult = [...(existingContainer.searchResult ?? []), result];
+                        }
+                    }
+                    else {
+                        // 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,
+                            isLoaded: true,
+                            isZero: false, // Type container is never zero (contains documents)
+                            searchResult: result ? [result] : [],
+                            items: [docNode],
+                            itemsCount: 1,
+                            expanded: false,
+                            hidden: false
+                        };
+                        tree.push(typeContainer);
+                    }
                 }
             }
             // Update progress counter
@@ -1012,7 +1078,7 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         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] }));
+        return (_jsxs("div", { onDoubleClick: handleDoubleClick, style: documentStyle, children: [item.did && item.tid && showCurrentDcmtIndicator && inputDcmts?.some(d => d.DID === item.did && d.TID === item.tid) ? _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
@@ -1059,6 +1125,9 @@ const TMRelationViewer = ({ inputDcmts, isForMaster = false, showCurrentDcmtIndi
         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 (mergedTreeData.length === 0) {
+        // If parent handles no-relations via callback, render nothing to avoid UI flash
+        if (onNoRelationsFound)
+            return null;
         return _jsx("div", { style: { padding: '20px', textAlign: 'center', color: '#666' }, children: "Nessuna relazione disponibile." });
     }
     return (_jsxs(_Fragment, { children: [_jsx(TMTreeView, { dataSource: mergedTreeData, itemRender: finalItemRender, calculateItemsForNode: calculateItemsForNode, onDataChanged: handleDataChanged, focusedItem: focusedItem, onFocusedItemChanged: handleFocusedItemChanged, allowMultipleSelection: allowMultipleSelection, selectedItems: selectedItems, itemsPerPage: 100, onSelectionChanged: handleSelectedItemsChanged }), showExpansionWaitPanel && (_jsx(TMWaitPanel, { title: isForMaster ? 'Caricamento documenti master' : 'Caricamento documenti dettaglio', showPrimary: true, textPrimary: expansionWaitPanelText, valuePrimary: expansionWaitPanelValue, maxValuePrimary: expansionWaitPanelMaxValue, isCancelable: true, abortController: expansionAbortController, onAbortClick: (abortController) => {

package/lib/components/viewers/TMTidViewer.js

@@ -5,6 +5,7 @@ import { AccessLevels, AccessLevelsEx, ArchiveConstraints, DcmtTypeListCacheServ
 import TMSpinner from '../base/TMSpinner';
 import { StyledDivHorizontal, StyledTooltipContainer, StyledTooltipItem, StyledTooltipSeparatorItem } from '../base/Styled';
 import TMTooltip from '../base/TMTooltip';
+import { TMColors } from '../../utils/theme';
 export var ImageIDList;
 (function (ImageIDList) {
     ImageIDList["arrow_001"] = "arrow_001";
@@ -294,7 +295,7 @@ const TMTidViewer = ({ tmSession, tid, did, showIcon = false, color, showId = fa
         }, children: [showIcon && dtd && _jsx(TMDcmtTypeIcon, { dtd: dtd }), _jsx("p", { title: displayName(), style: {
                     textAlign: 'left',
                     marginLeft: showIcon ? '5px' : '',
-                    color: color ?? (dtd?.isView ? 'red' : ''),
+                    color: color ?? (dtd?.isView ? 'red' : TMColors.primary),
                     whiteSpace: 'nowrap',
                     overflow: 'hidden',
                     textOverflow: 'ellipsis',

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@topconsultnpm/sdkui-react",
-    "version": "6.20.0-dev3.10",
+    "version": "6.20.0-dev3.12",
     "description": "",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",