@topconsultnpm/sdkui-react-beta 6.13.64 → 6.13.66

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

@@ -5,7 +5,7 @@ import { ContextMenu } from 'devextreme-react';
 import { TMNothingToShow } from './TMDcmtPreview';
 import TMDcmtForm from './TMDcmtForm';
 import TMSearchResult from '../search/TMSearchResult';
-import { genUniqueId, getExceptionMessage, IconFolder, IconShow, IconBoard, IconDcmtTypeSys, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, svgToString, IconMail, IconDcmtTypeOnlyMetadata, IconCopy, IconMultipleSelection, IconMenuVertical, IconSearchCheck, IconDataList } from '../../../helper';
+import { genUniqueId, getExceptionMessage, IconFolder, IconShow, IconBoard, IconDcmtTypeSys, IconCheckFile, IconDetailDcmts, SDKUI_Localizator, svgToString, IconMail, IconDcmtTypeOnlyMetadata, IconCopy, IconMultipleSelection, IconMenuVertical, IconSearchCheck, IconDataList, IconPreview } from '../../../helper';
 import { hasDetailRelations } from '../../../helper/dcmtsHelper';
 import { FormModes, SearchResultContext } from '../../../ts';
 import { TMColors } from '../../../utils/theme';
@@ -22,7 +22,7 @@ import TMDataListItemViewer from '../../viewers/TMDataListItemViewer';
 import { TMDcmtTypeTooltip } from '../../viewers/TMTidViewer';
 import TMTreeView from '../../base/TMTreeView';
 import TMDcmtIcon from './TMDcmtIcon';
-import { TMPanelManagerProvider } from '../../layout/panelManager/TMPanelManagerContext';
+import { TMPanelManagerProvider, useTMPanelManagerContext } from '../../layout/panelManager/TMPanelManagerContext';
 import TMPanelManagerContainer from '../../layout/panelManager/TMPanelManagerContainer';
 let abortController = new AbortController();
 const TMMasterDetailDcmts = ({ deviceType, inputDcmts, isForMaster, showCurrentDcmtIndicator = true, allowNavigation, canNext, canPrev, onNext, onPrev, onBack, appendMasterDcmts, onTaskCreateRequest }) => {
@@ -405,46 +405,66 @@ const TMMasterDetailDcmts = ({ deviceType, inputDcmts, isForMaster, showCurrentD
                 ?
                     _jsx(TMNothingToShow, { text: getTitle(), secondText: SDKUI_Localizator.NoDataToDisplay, icon: isForMaster ? _jsx(IconDetailDcmts, { fontSize: 96, transform: 'scale(-1, 1)' }) : _jsx(IconDetailDcmts, { fontSize: 96 }) })
                 :
-                    _jsx(TMTreeView, { dataSource: data, allowMultipleSelection: allowMultipleSelection, calculateItemsForNode: calculateItemsForNode, itemRender: renderItem, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectionChanged: handleSelectedItemsChanged, onDataChanged: (items) => setData(updateHiddenProperty(items)) }) }), [data, isLoading, focusedItem, selectedItems, allowMultipleSelection, isForMaster]);
+                    _jsx(TMTreeViewWrapper, { data: data, allowMultipleSelection: allowMultipleSelection, calculateItemsForNode: calculateItemsForNode, renderItem: renderItem, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: handleFocusedItemChanged, onSelectionChanged: handleSelectedItemsChanged, onDataChanged: (items) => setData(updateHiddenProperty(items)) }) }), [data, isLoading, focusedItem, selectedItems, allowMultipleSelection, isForMaster]);
     const tmFormOrResult = useMemo(() => _jsx(_Fragment, { children: focusedItem?.isDcmt ?
-            _jsx(TMDcmtForm, { TID: focusedItem?.tid, DID: focusedItem.did, isClosable: deviceType !== DeviceType.MOBILE, allowNavigation: false, allowRelations: deviceType !== DeviceType.MOBILE, showDcmtFormSidebar: deviceType === DeviceType.MOBILE }) :
-            _jsx(TMSearchResult, { groupId: 'tmFormOrResult', context: SearchResultContext.MASTER_DETAIL, allowFloatingBar: false, allowRelations: false, openDcmtFormAsModal: true, searchResults: focusedItem?.searchResult ?? [], showSearchResultSidebar: false, 
-                // onClose={() => { setShowDcmtForm(false); }}
-                onClosePreviewPanel: () => { }, onTaskCreateRequest: onTaskCreateRequest }) }), [focusedItem, deviceType]);
-    const allInitialPanelVisibility = {
-        'tmTreeView': true,
-        'tmFormOrResult': true,
-        'tmSearchResult': true,
-        'tmBlog': false,
-        'tmSysMetadata': false,
-        'tmDcmtPreview': false,
-    };
+            _jsx(TMDcmtForm, { groupId: 'tmFormOrResult', TID: focusedItem?.tid, DID: focusedItem.did, isClosable: deviceType !== DeviceType.MOBILE, allowNavigation: false, allowRelations: deviceType !== DeviceType.MOBILE, showDcmtFormSidebar: deviceType === DeviceType.MOBILE }) :
+            _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 }) }), [focusedItem, deviceType]);
     const initialPanelDimensions = {
         'tmTreeView': { width: '50%', height: '100%' },
         'tmFormOrResult': { width: '50%', height: '100%' },
+        'tmDcmtForm': { width: '25%', height: '100%' },
         'tmSearchResult': { width: '25%', height: '100%' },
         'tmBlog': { width: '25%', height: '100%' },
         'tmSysMetadata': { width: '25%', height: '100%' },
         'tmDcmtPreview': { width: '25%', height: '100%' },
     };
+    const allInitialPanelVisibility = {
+        'tmTreeView': true,
+        'tmFormOrResult': true,
+        'tmDcmtForm': false,
+        'tmSearchResult': true,
+        'tmBlog': false,
+        'tmSysMetadata': false,
+        'tmDcmtPreview': false,
+    };
     const initialPanels = useMemo(() => [
         {
             id: 'tmTreeView',
             name: SDK_Localizator.Relations,
-            contentOptions: { component: tmTreeView, panelContainer: { title: getTitle(), toolbar: toolbar, allowMaximize: !isMobile } },
-            toolbarOptions: { icon: _jsx(IconDataList, { fontSize: 24 }), visible: true, orderNumber: 1, isActive: allInitialPanelVisibility['tmTreeView'] }
+            contentOptions: {
+                component: tmTreeView,
+                isClosable: false,
+                panelContainer: {
+                    title: getTitle(),
+                    toolbar: toolbar,
+                    allowMaximize: !isMobile,
+                    onBack: onBack
+                }
+            },
+            toolbarOptions: {
+                icon: _jsx(IconDataList, { fontSize: 24 }),
+                visible: true,
+                orderNumber: 1,
+                isActive: allInitialPanelVisibility['tmTreeView']
+            }
         },
         {
             id: 'tmFormOrResult',
             name: focusedItem?.isDcmt ? SDK_Localizator.Metadatas : SDKUI_Localizator.SearchResult,
             contentOptions: {
-                component: tmFormOrResult
+                component: tmFormOrResult,
+                isClosable: false
             },
             children: [
+                {
+                    id: 'tmDcmtForm',
+                    name: SDK_Localizator.Metadatas,
+                    toolbarOptions: { icon: _jsx(IconPreview, { fontSize: 24 }), visible: false, orderNumber: 1, isActive: allInitialPanelVisibility['tmDcmtForm'] }
+                },
                 {
                     id: 'tmSearchResult',
-                    name: 'tmSearchResult',
-                    toolbarOptions: { icon: _jsx(IconSearchCheck, { fontSize: 24 }), visible: true, orderNumber: 3, isActive: allInitialPanelVisibility['tmSearchResult'] }
+                    name: SDKUI_Localizator.SearchResult,
+                    toolbarOptions: { icon: _jsx(IconSearchCheck, { fontSize: 24 }), visible: false, orderNumber: 1, isActive: allInitialPanelVisibility['tmSearchResult'] }
                 },
                 {
                     id: 'tmBlog',
@@ -462,9 +482,9 @@ const TMMasterDetailDcmts = ({ deviceType, inputDcmts, isForMaster, showCurrentD
                     toolbarOptions: { icon: _jsx(IconShow, { fontSize: 24 }), visible: true, orderNumber: 6, isActive: allInitialPanelVisibility['tmDcmtPreview'] }
                 }
             ],
-            toolbarOptions: { icon: _jsx(IconSearchCheck, { fontSize: 24 }), visible: true, orderNumber: 2, isActive: allInitialPanelVisibility['tmFormOrResult'] }
+            toolbarOptions: { icon: _jsx(IconSearchCheck, { fontSize: 24 }), visible: false, orderNumber: 2, isActive: allInitialPanelVisibility['tmFormOrResult'] }
         }
-    ], [tmTreeView, tmFormOrResult, focusedItem]);
+    ], [tmTreeView, tmFormOrResult, focusedItem?.isDcmt]);
     return (_jsx(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: showWaitPanel, showWaitPanelPrimary: showPrimary, waitPanelTitle: waitPanelTitle, waitPanelTextPrimary: waitPanelTextPrimary, waitPanelValuePrimary: waitPanelValuePrimary, waitPanelMaxValuePrimary: waitPanelMaxValuePrimary, isCancelable: true, abortController: abortController, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'tmTreeView', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) }));
 };
 export default TMMasterDetailDcmts;
@@ -545,3 +565,21 @@ const getDisplayValueByColumn = (col, value) => {
 export function IconBackhandIndexPointingRight(props) {
     return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 128 128", width: "1em", height: "1em", ...props, children: [_jsx("path", { fill: "#E0BB95", d: "M58.7 41.1c10.8.1 53.3.4 54.9.4c12.8.3 12.7 16.7.7 16.9c-1.5 0-25 1.1-32.2 1.3c5.2 2 7.5 11.9-3.1 14.9c5 2.6 6.4 12.9-4.2 14.7c3.8 2.5 4.3 10.9-6 14.2c-8.4 2.7-28.2 2-40.3-2.3c-9.1-3.3-8.4-5.8-16.7-5.6c-1.4 0-2.1-1.1-2.4-2.4c-1.3-5.9-1.9-26.3-.3-33.8c.4-1.6 1.7-1.8 2.2-1.9c2.1-.4 4.2-2.5 5-4.3c3.2-6.4 12.8-12.8 23.4-18.2c5.5-2.8 9.2-8.8 10.4-18.3c.8-6.3 8.6-7.7 11.8-2.5c2.2 3.6 2.9 7 2.9 10.4c.2 6.2-1.6 10.1-6.1 16.5" }), _jsx("defs", { children: _jsx("path", { id: "notoBackhandIndexPointingRightMediumLightSkinTone0", d: "M58.7 41.1c10.8.1 53.3.4 54.9.4c12.8.3 12.7 16.7.7 16.9c-1.5 0-25 1.1-32.2 1.3c5.2 2 7.5 11.9-3.1 14.9c5 2.6 6.4 12.9-4.2 14.7c3.8 2.5 4.3 10.9-6 14.2c-8.4 2.7-28.2 2-40.3-2.3c-9.1-3.3-8.4-5.8-16.7-5.6c-1.4 0-2.1-1.1-2.4-2.4c-1.3-5.9-1.9-26.3-.3-33.8c.4-1.6 1.7-1.8 2.2-1.9c2.1-.4 4.2-2.5 5-4.3c3.2-6.4 12.8-12.8 23.4-18.2c5.5-2.8 9.2-8.8 10.4-18.3c.8-6.3 8.6-7.7 11.8-2.5c2.2 3.6 2.9 7 2.9 10.4c.2 6.2-1.6 10.1-6.1 16.5" }) }), _jsx("clipPath", { id: "notoBackhandIndexPointingRightMediumLightSkinTone1", children: _jsx("use", { href: "#notoBackhandIndexPointingRightMediumLightSkinTone0" }) }), _jsx("g", { fill: "#D19661", clipPath: "url(#notoBackhandIndexPointingRightMediumLightSkinTone1)", children: _jsx("path", { d: "M73.3 59.5c.1 1.6 2.8 2.9 2.8 6.4c0 3.7-3 4.7-3.1 7.5c-.1 2.7 2 3.8 1.5 7.7c-.6 4.5-4.1 4-4.2 7.1c0 2.7 1.8 3.2 1.8 6.6c0 3.1-3 5.8-5.5 7s-1.2 3.4 0 3.4s11.9-1.3 14.5-8.2c3-8 11-29.6 8.8-36.9c-7.1-1-11.5-1.6-13.7-1.8c-.7-.1-2.9-.6-2.9 1.2M60.1 40.7c0 .9.1 1.5 1 1.5c1 0 43.6 2.1 51.6 2.3c9.2.2 8.7 7.6 5.9 10.1c-1.9 1.7.6 4 2.2 2.6s4.4-3.4 4.3-8.4s-4.4-8.6-8.4-8.9c-3.8-.3-56.6.8-56.6.8m-51.9 21c15.9 0 14.1-11.7 25.2-18.9c15.4-10.1 16.3-11.1 19.7-25.2c1.2-4.9 5.7-4.4 7.7-2.1s4.9-1.3 3.6-2.7s-7.8-7.7-14.8-1.1s-42 46.2-42 46.2z" }) }), _jsx("defs", { children: _jsx("use", { href: "#notoBackhandIndexPointingRightMediumLightSkinTone0", id: "notoBackhandIndexPointingRightMediumLightSkinTone2" }) }), _jsx("clipPath", { id: "notoBackhandIndexPointingRightMediumLightSkinTone3", children: _jsx("use", { href: "#notoBackhandIndexPointingRightMediumLightSkinTone2" }) }), _jsx("g", { fill: "#8D542E", clipPath: "url(#notoBackhandIndexPointingRightMediumLightSkinTone3)", children: _jsx("path", { d: "M58.7 41.1h-1.9c-.4 0-.8-.4-.2-1.3s5.8-8 5.8-15c0-3.2-.5-7.7-3.4-12.4c-.6-.9.2-1.4.9-1c.7.5 6.4 3.2 6.5 13.4s-7.7 16.3-7.7 16.3m65.1 8.8c-.5 0-1.1-.2-1.7 1c-.7 1.5-3.1 4.4-8.4 4.7s-38.1 2.5-38.9 2.5c-1.1 0-1.2 1.9.1 1.8c1.7-.1 7.2-.2 7.2-.2s30.9 1.8 36.9-.6c6.1-2.4 4.8-9.2 4.8-9.2M86.6 68.5c-.3-.1-.7-.1-1 .3c-1.5 2-4.6 3.5-10.6 3.3c-1.4 0-1.6 2.7.1 2.7c.7 0 4-.1 4-.1l6.6-.2zm-3.6 15c-.3-.1-.7-.1-1.1.4c-1.5 2-3.5 2.8-9.7 3c-1.5.1-1.4 2.6.2 2.6c1.1 0 2.4-.1 2.4-.1l7-.6zm-5.4 12.7c-.3-.1-.8-.2-1.2.4c-.8 1.1-2.9 3-7.5 4.4c-3.7 1.1-21.3 1.9-32.5-.7c-2.3-.5-9.9-3-13.6-5.3s-7.3-1.6-8.3-1.4s-6.3.7-6.3.7l2.5 3.7l27 8.6l38.5-.6z" }) })] }));
 }
+const TMTreeViewWrapper = ({ data, allowMultipleSelection, focusedItem, selectedItems, renderItem, calculateItemsForNode, onFocusedItemChanged, onSelectionChanged, onDataChanged }) => {
+    const { setPanelVisibilityById, setToolbarButtonVisibility } = useTMPanelManagerContext();
+    return (_jsx(TMTreeView, { dataSource: data, allowMultipleSelection: allowMultipleSelection, calculateItemsForNode: calculateItemsForNode, itemRender: renderItem, focusedItem: focusedItem, selectedItems: selectedItems, onFocusedItemChanged: (item) => {
+            onFocusedItemChanged?.(item);
+            if (item?.isDcmt) {
+                setPanelVisibilityById('tmSearchResult', false);
+                setPanelVisibilityById('tmDcmtForm', true);
+                setToolbarButtonVisibility('tmSearchResult', false);
+                setToolbarButtonVisibility('tmDcmtForm', true);
+            }
+            else {
+                setPanelVisibilityById('tmSearchResult', true);
+                setPanelVisibilityById('tmDcmtForm', false);
+                setToolbarButtonVisibility('tmSearchResult', true);
+                setToolbarButtonVisibility('tmDcmtForm', false);
+            }
+        }, onSelectionChanged: onSelectionChanged, onDataChanged: onDataChanged }));
+};

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

@@ -33,7 +33,7 @@ const StyledSqdItem = styled.div `
     .info-icon {
         position: absolute;
         left: -2px;
-        top: 50%;
+        top: calc(50% - 5px);
         transform: translateY(-50%);
         opacity: 0;
         transition: opacity 0.2s;

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

@@ -188,7 +188,7 @@ const TMSearch = ({ inputTID, inputSqdID, isExpertMode = SDKUI_Globals.userSetti
         {
             id: 'TMRecentsManager',
             name: SDKUI_Localizator.Shortcuts,
-            contentOptions: { component: tmRecentsManagerElement, panelContainer: { title: SDKUI_Localizator.Shortcuts } },
+            contentOptions: { component: tmRecentsManagerElement, panelContainer: { title: SDKUI_Localizator.Shortcuts, totalItems: mruTIDs.length } },
             toolbarOptions: { icon: _jsx(IconRecentlyViewed, { fontSize: 24 }), visible: true, orderNumber: 2, isActive: allInitialPanelVisibility['TMRecentsManager'] }
         },
         {
@@ -203,7 +203,7 @@ const TMSearch = ({ inputTID, inputSqdID, isExpertMode = SDKUI_Globals.userSetti
             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]);
+    ], [tmTreeSelectorElement, tmRecentsManagerElement, tmSearchQueryPanelElement, tmSavedQuerySelectorElement, fromDTD, mruTIDs]);
     return (_jsxs(_Fragment, { children: [_jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.Search, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'TMRecentsManager', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true }) }) }), searchResult.length > 0 &&
                 _jsx(TMSearchResult, { isVisible: currentSearchView === TMSearchViews.Result, context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, onRefreshSearchAsync: async () => {
                         setSearchResult(await refreshLastSearch(lastQdSearched) ?? []);

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

@@ -19,7 +19,6 @@ interface ITMSearchResultProps {
     onSelectedTIDChanged?: (TID: number) => void;
     onRefreshSearchAsync?: () => Promise<void>;
     onRefreshAfterAddDcmtToFavs?: () => void;
-    onClosePreviewPanel?: () => void;
     onTaskCreateRequest?: (taskContext: TaskContext) => void;
 }
 declare const TMSearchResult: React.FC<ITMSearchResultProps>;

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

@@ -49,12 +49,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, onClosePreviewPanel, 
-// showDcmtForm = false, 
-// showBoard = false, 
-// showPreview = false, 
-// showSysMetadata = false, 
-title, isClosable = false, allowFloatingBar = true, showToolbarHeader = true, onRefreshAfterAddDcmtToFavs, onRefreshSearchAsync, onSelectedTIDChanged, onUpdate, onClose, onTaskCreateRequest }) => {
+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, onRefreshAfterAddDcmtToFavs, onRefreshSearchAsync, onSelectedTIDChanged, onUpdate, onClose, onTaskCreateRequest }) => {
     const [id, setID] = useState('');
     const [showApprovePopup, setShowApprovePopup] = useState(false);
     const [showRejectPopup, setShowRejectPopup] = useState(false);
@@ -703,6 +698,6 @@ const TMSearchResultSelector = ({ searchResults = [], onSelectionChanged }) => {
 };
 //#endregion TMSearchResultSelector
 const TMDcmtPreviewWrapper = ({ currentDcmt }) => {
-    const { setPanelVisibilityById, toggleMaximize } = useTMPanelManagerContext();
-    return (_jsx(TMDcmtPreview, { onClosePanel: () => setPanelVisibilityById('tmDcmtPreview', false), onMaximizePanel: () => toggleMaximize('tmDcmtPreview'), dcmtData: currentDcmt }));
+    const { setPanelVisibilityById, toggleMaximize, isResizingActive } = useTMPanelManagerContext();
+    return (_jsx(TMDcmtPreview, { onClosePanel: () => setPanelVisibilityById('tmDcmtPreview', false), onMaximizePanel: () => toggleMaximize('tmDcmtPreview'), dcmtData: currentDcmt, isResizingActive: isResizingActive }));
 };

package/lib/components/grids/TMRecentsManager.js

@@ -27,7 +27,7 @@ const StyledRecentTidItem = styled.div `
     .info-icon {
         position: absolute;
         left: -7px;
-        top: 50%;
+        top: calc(50% - 5px);
         transform: translateY(-50%);
         opacity: 0;
         transition: opacity 0.2s;

package/lib/components/index.d.ts

@@ -14,9 +14,6 @@ export * from './base/TMToolbarCard';
 export * from './base/TMRightSidebar';
 export * from './base/TMTreeView';
 export * from './base/TMPanel';
-export { default as TMPanelManager } from './base/TMPanelManager';
-export { default as TMPanelManagerToolbar } from './base/TMPanelManagerToolbar';
-export * from './base/TMPanelManagerUtils';
 export { default as CounterBar } from './base/TMCounterBar';
 export { default as TMProgressBar } from './base/TMProgressBar';
 export { default as TMSpinner } from './base/TMSpinner';

package/lib/components/index.js

@@ -15,9 +15,6 @@ export * from './base/TMToolbarCard';
 export * from './base/TMRightSidebar';
 export * from './base/TMTreeView';
 export * from './base/TMPanel';
-export { default as TMPanelManager } from './base/TMPanelManager';
-export { default as TMPanelManagerToolbar } from './base/TMPanelManagerToolbar';
-export * from './base/TMPanelManagerUtils';
 export { default as CounterBar } from './base/TMCounterBar';
 export { default as TMProgressBar } from './base/TMProgressBar';
 export { default as TMSpinner } from './base/TMSpinner';

package/lib/components/layout/panelManager/TMPanelManagerToolbar.js

@@ -36,11 +36,11 @@ const TMPanelManagerToolbar = (props) => {
     useEffect(() => {
         // Flatten panels, filter visible leaf nodes, and sort by orderNumber
         const visibleLeafPanelsSorted = flattenPanels(panels)
-            .filter(panel => panel.toolbarOptions?.visible && !panel.children?.length)
+            .filter(panel => toolbarButtonsVisibility[panel.id] && !panel.children?.length)
             .sort((a, b) => (a.toolbarOptions?.orderNumber ?? 0) - (b.toolbarOptions?.orderNumber ?? 0));
         // Update state with the filtered and sorted leaf panels for the toolbar
         setVisibleLeafPanels(visibleLeafPanelsSorted);
-    }, [panels]);
+    }, [toolbarButtonsVisibility]);
     return (_jsx("div", { style: {
             display: 'flex',
             flexDirection: isMobile ? 'row' : 'column',

package/lib/components/layout/panelManager/TMPanelWrapper.js

@@ -6,6 +6,9 @@ import TMPanel from '../../base/TMPanel';
 const TMPanelWrapper = (props) => {
     const { panel, children } = props;
     const { panelVisibility, panelDimensions, togglePanelVisibility, maximizedPanels, toggleMaximize } = useTMPanelManagerContext();
+    // Default to true if isMaximizable or isClosable is undefined, ensuring safe and expected behavior
+    const isMaximizable = panel.contentOptions?.isMaximizable ?? true;
+    const isClosable = panel.contentOptions?.isClosable ?? true;
     // Get the current device type (e.g., mobile, tablet, desktop) using a custom hook
     const deviceType = useDeviceType();
     // This avoids unnecessary re-renders by only recalculating when deviceType changes
@@ -30,6 +33,6 @@ const TMPanelWrapper = (props) => {
         pointerEvents: 'auto',
     };
     return (_jsx("div", { "data-panel-id": panel.id, style: panelStyles, children: panel.contentOptions?.panelContainer ?
-            _jsx(TMPanel, { ...panel.contentOptions.panelContainer, allowMaximize: !isMobile, onHeaderDoubleClick: () => toggleMaximize(panel.id), onMaximize: () => toggleMaximize(panel.id), onClose: () => togglePanelVisibility(panel.id), children: children }) : children }));
+            _jsx(TMPanel, { ...panel.contentOptions.panelContainer, allowMaximize: !isMobile, onHeaderDoubleClick: isMaximizable ? () => toggleMaximize(panel.id) : undefined, onMaximize: isMaximizable ? () => toggleMaximize(panel.id) : undefined, onClose: isClosable ? () => togglePanelVisibility(panel.id) : undefined, children: children }) : children }));
 };
 export default TMPanelWrapper;

package/lib/components/layout/panelManager/types.d.ts

@@ -9,6 +9,8 @@ export interface TMPanelDefinition {
     childrenGroupDirection?: TMPanelDirection;
     contentOptions?: {
         component: ReactNode;
+        isClosable?: boolean;
+        isMaximizable?: boolean;
         panelContainer?: ITMPanelProps;
     };
     toolbarOptions?: {

package/package.json

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

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

@@ -1,11 +0,0 @@
-import { TMPanelItemConfig } from './TMPanelManagerUtils';
-type TMPanelManagerProps = {
-    panels: Array<TMPanelItemConfig>;
-    initialMobilePanelId: string;
-    showToolbar?: boolean;
-    toolbarMode?: number;
-    gutters?: number;
-    minPanelPercent?: number;
-};
-declare const TMPanelManager: (props: TMPanelManagerProps) => import("react/jsx-runtime").JSX.Element;
-export default TMPanelManager;