@topconsultnpm/sdkui-react-beta 6.16.68 → 6.16.70

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

@@ -49,6 +49,8 @@ export interface TMDataGridProps<T> extends IDataGridOptions {
     counterConfig?: ITMCounterContainerProps;
     /** Master Detail */
     masterDetail?: IMasterDetailProps;
+    /** On Has Filters Change */
+    onHasFiltersChange?: (hasFilters: boolean) => void;
 }
 declare const TMDataGrid: React.ForwardRefExoticComponent<TMDataGridProps<unknown> & React.RefAttributes<dxDataGrid<any, any>>>;
 export default TMDataGrid;

package/lib/components/base/TMDataGrid.js

@@ -16,7 +16,7 @@ const TMDataGrid = React.forwardRef((props, ref) => {
     // main properties
     keyExpr = 'id', dataSource, focusedRowEnabled = true, hoverStateEnabled = true, focusedRowKey, selectedRowKeys = [], 
     // custom options
-    dataColumns = [], pageSize = TMDataGridPageSize.Large, showHeaderFilter = true, showFilterPanel = false, showLoadPanel = true, showSearchPanel = true, searchPanelToolbarPosition = 'before', searchPanelFocusStarting = false, counterConfig = { show: false, items: new Map() }, 
+    dataColumns = [], pageSize = TMDataGridPageSize.Large, showHeaderFilter = true, showFilterPanel = true, showLoadPanel = true, showSearchPanel = true, searchPanelToolbarPosition = 'before', searchPanelFocusStarting = false, counterConfig = { show: false, items: new Map() }, onHasFiltersChange, 
     // events and callbacks
     onSelectionChanged, onFocusedRowChanged, onRowDblClick, onRowClick, onCellClick, onCellDblClick, onOptionChanged, onContentReady, onContextMenuPreparing, onInitialized, onEditorPreparing, onCellPrepared, onRowPrepared, onRowUpdating, onRowExpanded, onRowCollapsed, onRowUpdated, onSaved, onEditCanceled, onEditingStart, onEditingChange, customizeColumns, onKeyDown, scrolling = { mode: 'standard', useNative: SDKUI_Globals.userSettings?.themeSettings.gridSettings.useNativeScrollbar === 1 }, paging = { enabled: true, pageSize: pageSize }, pager = { visible: true, showInfo: true, showNavigationButtons: true }, selection = { mode: 'multiple', showCheckBoxesMode: "always", selectAllMode: "allPages" }, sorting, summary, stateStoring, columnChooser, grouping, groupPanel, filterRow, headerFilter, editing, rowDragging, masterDetail, 
     // other properties
@@ -28,6 +28,7 @@ const TMDataGrid = React.forwardRef((props, ref) => {
     const [counterValues, setCounterValues] = useState(new Map());
     const [totalRecordCount, setTotalRecordCount] = useState(0);
     const [visibleItemsCount, setVisibleItemsCount] = useState(0);
+    const [hasFilters, setHasFilters] = useState(false);
     useEffect(() => {
         const count = getRecordCount(dataSource);
         setTotalRecordCount(count);
@@ -182,11 +183,19 @@ const TMDataGrid = React.forwardRef((props, ref) => {
             }, 100);
         }
     }, [onContentReady]);
-    return _jsxs("div", { style: { width: "100%", height: "100%" }, children: [_jsx("div", { style: { width: "100%", height: counterConfig.show ? "calc(100% - 25px)" : "100%" }, children: _jsxs(DataGrid, { ref: internalRef, id: id, className: 'tm-datagrid', 
+    const onOptionChangedCallback = useCallback((e) => {
+        if (showFilterPanel && e.fullName === 'filterValue' || e.fullName?.startsWith('columns') && e.fullName.endsWith('filterValues')) {
+            const newHasFilters = Array.isArray(e.value) ? e.value.length > 0 : !!e.value;
+            setHasFilters(newHasFilters);
+            onHasFiltersChange?.(newHasFilters);
+        }
+        onOptionChanged?.(e);
+    }, [onOptionChanged]);
+    return _jsxs("div", { style: { width: "100%", height: "100%" }, children: [_jsx("div", { style: { width: "100%", height: counterConfig.show ? "calc(100% - 25px)" : "100%" }, children: _jsxs(DataGrid, { ref: internalRef, id: id, className: `tm-datagrid ${hasFilters ? 'has-filters' : ''}`, 
                     // main properties
                     keyExpr: keyExpr, dataSource: dataSource, selectedRowKeys: selectedRowKeys, focusedRowEnabled: focusedRowEnabled, hoverStateEnabled: hoverStateEnabled, 
                     // events and callbacks
-                    onSelectionChanged: onSelectionChangedCallback, onRowDblClick: onRowDblClickCallback, onRowPrepared: onRowPrepared, onContextMenuPreparing: onContextMenuPreparingCallback, onToolbarPreparing: onToolbarPreparingCallback, onFocusedRowChanged: onFocusedRowChanged, onRowClick: onRowClick, onCellClick: onCellClick, onCellDblClick: onCellDblClick, onOptionChanged: onOptionChanged, onContentReady: onContentReadyCallback, onInitialized: onInitialized, customizeColumns: customizeColumns, onEditorPreparing: onEditorPreparing, onCellPrepared: onCellPrepared, onRowUpdating: onRowUpdating, onRowExpanded: onRowExpanded, onRowCollapsed: onRowCollapsed, onRowUpdated: onRowUpdated, onSaved: onSaved, onEditCanceled: onEditCanceled, onEditingStart: onEditingStart, onEditingChange: onEditingChange, onKeyDown: onKeyDown, 
+                    onSelectionChanged: onSelectionChangedCallback, onRowDblClick: onRowDblClickCallback, onRowPrepared: onRowPrepared, onContextMenuPreparing: onContextMenuPreparingCallback, onToolbarPreparing: onToolbarPreparingCallback, onFocusedRowChanged: onFocusedRowChanged, onRowClick: onRowClick, onCellClick: onCellClick, onCellDblClick: onCellDblClick, onOptionChanged: onOptionChangedCallback, onContentReady: onContentReadyCallback, onInitialized: onInitialized, customizeColumns: customizeColumns, onEditorPreparing: onEditorPreparing, onCellPrepared: onCellPrepared, onRowUpdating: onRowUpdating, onRowExpanded: onRowExpanded, onRowCollapsed: onRowCollapsed, onRowUpdated: onRowUpdated, onSaved: onSaved, onEditCanceled: onEditCanceled, onEditingStart: onEditingStart, onEditingChange: onEditingChange, onKeyDown: onKeyDown, 
                     // other properties
                     disabled: disabled, autoNavigateToFocusedRow: autoNavigateToFocusedRow, focusedRowKey: focusedRowKey, columnHidingEnabled: columnHidingEnabled, columnResizingMode: columnResizingMode, columnAutoWidth: columnAutoWidth, allowColumnResizing: allowColumnResizing, allowColumnReordering: allowColumnReordering, showBorders: showBorders, showRowLines: showRowLines, showColumnLines: showColumnLines, showColumnHeaders: showColumnHeaders, rowAlternationEnabled: rowAlternationEnabled, wordWrapEnabled: wordWrapEnabled, noDataText: noDataText, 
                     // styles

package/lib/components/base/TMFileManager.js

@@ -189,7 +189,7 @@ const TMFileManager = (props) => {
     const handleDragLeave = (e) => {
         setIsDragging(false);
     };
-    return _jsx(TMPanel, { title: SDKUI_Localizator.Drafts, totalItems: dcmtsFound ?? 0, showHeader: showPanel, onBack: (isMobile && openDraftList) ? onBackCallback : undefined, onClose: onClosePanel, allowMaximize: !isMobile ? allowMaximize : false, onMaximize: !isMobile ? onMaximizePanel : undefined, onHeaderDoubleClick: !isMobile ? onMaximizePanel : undefined, toolbar: toolbar, children: _jsx("div", { style: { flexDirection: "column", height: "100%", width: "100%", }, children: _jsxs(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: "flex", flexGrow: 1, height: "100%" }, children: _jsx(TMSplitterLayout, { direction: 'horizontal', showSeparator: true, separatorColor: 'transparent', separatorActiveColor: 'transparent', min: ['0', '0'], start: [isLeftPanelCollapsed ? '0%' : "32.5%", isLeftPanelCollapsed ? '100%' : "67.5%"], children: children }, "TMWGs-panels-treeView") }), children: [_jsxs("div", { style: {
+    return _jsx(TMPanel, { title: SDKUI_Localizator.Drafts, totalItems: dcmtsFound ?? 0, showHeader: showPanel, onBack: (isMobile && openDraftList) ? onBackCallback : undefined, onClose: onClosePanel, allowMaximize: !isMobile ? allowMaximize : false, onMaximize: !isMobile ? onMaximizePanel : undefined, onHeaderDoubleClick: !isMobile ? onMaximizePanel : undefined, toolbar: toolbar, children: _jsx("div", { style: { flexDirection: "column", height: "100%", width: "100%", }, children: _jsxs(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: "flex", flexGrow: 1, height: "100%" }, children: _jsx(TMSplitterLayout, { direction: 'horizontal', showSeparator: true, separatorColor: 'transparent', separatorActiveColor: 'transparent', min: ['0', '0'], start: [isLeftPanelCollapsed ? '0%' : "32%", isLeftPanelCollapsed ? '100%' : "68%"], children: children }, "TMWGs-panels-treeView") }), children: [_jsxs("div", { style: {
                             height: "100%",
                             width: "100%",
                             ...(isMobile && { display: openDraftList ? 'none' : 'block', transition: "opacity 0.3s ease-in-out" }),

package/lib/components/base/TMFloatingToolbar.js

@@ -64,6 +64,8 @@ const TMFloatingToolbar = ({ children, backgroundColor, initialLeft, initialTop
             isClicked.current = true;
             coords.current.startX = e.clientX;
             coords.current.startY = e.clientY;
+            coords.current.lastX = box.offsetLeft;
+            coords.current.lastY = box.offsetTop;
         };
         const onMouseUp = (e) => {
             isClicked.current = false;

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

@@ -483,7 +483,6 @@ export default TMSearchResult;
 const renderDcmtIcon = (cellData, onDownloadDcmtsAsync, openInOffice) => _jsx(TMDcmtIcon, { tid: cellData.data.TID, did: cellData.data.DID, fileExtension: cellData.data.FILEEXT, fileCount: cellData.data.FILECOUNT, isLexProt: cellData.data.IsLexProt, isMail: cellData.data.ISMAIL, isShared: cellData.data.ISSHARED, isSigned: cellData.data.ISSIGNED, downloadMode: 'openInNewWindow', onDownloadDcmtsAsync: onDownloadDcmtsAsync, openInOffice: openInOffice });
 const TMSearchResultGrid = ({ openInOffice, inputFocusedItem, showSearch, allowMultipleSelection = true, showExportForm = false, onCloseExportForm, onFocusedItemChanged, onDownloadDcmtsAsync, onVisibleItemChanged, inputSelectedItems = [], lastUpdateSearchTime, searchResult, onContextMenuPreparing, onSelectionChanged, onDblClick }) => {
     const [dataSource, setDataSource] = useState();
-    const [showFilterPanel, setShowFilterPanel] = useState(false);
     const [columns, setColumns] = useState([]);
     // State to store selected row keys
     const [selectedRowKeys, setSelectedRowKeys] = useState([]);
@@ -652,14 +651,7 @@ const TMSearchResultGrid = ({ openInOffice, inputFocusedItem, showSearch, allowM
         setVisibleItems(visibleRows.map((row) => { return row.data; }));
     }, []);
     useEffect(() => { onVisibleItemChanged?.(visibleItems); }, [visibleItems]);
-    const onOptionChanged = useCallback((e) => {
-        if (e === undefined)
-            return;
-        if (e.fullName === "filterValue") {
-            setShowFilterPanel(!!e.value);
-        }
-    }, []);
-    return _jsxs("div", { style: { width: "100%", height: "100%" }, children: [_jsx(TMDataGrid, { id: "tm-search-result", keyExpr: "rowIndex", dataColumns: dataColumns, dataSource: dataSource, repaintChangesOnly: true, selectedRowKeys: selectedRowKeys, focusedRowKey: Number(focusedItem?.rowIndex ?? 0), showSearchPanel: showSearch, showFilterPanel: showFilterPanel, sorting: { mode: "multiple" }, selection: { mode: allowMultipleSelection ? 'multiple' : 'single' }, pageSize: TMDataGridPageSize.Small, onSelectionChanged: handleSelectionChange, onFocusedRowChanged: handleFocusedRowChange, onRowDblClick: onRowDblClick, onContentReady: onContentReady, onOptionChanged: onOptionChanged, onContextMenuPreparing: onContextMenuPreparing, onKeyDown: onKeyDown, counterConfig: { show: true } }), (showExportForm && searchResult && onCloseExportForm) && _jsx(TMDataGridExportForm, { dataColumns: dataColumns, dataSource: dataSource, selectedRowKeys: selectedRowKeys, onCloseExportForm: onCloseExportForm, searchResult: searchResult })] });
+    return _jsxs("div", { style: { width: "100%", height: "100%" }, children: [_jsx(TMDataGrid, { id: "tm-search-result", keyExpr: "rowIndex", dataColumns: dataColumns, dataSource: dataSource, repaintChangesOnly: true, selectedRowKeys: selectedRowKeys, focusedRowKey: Number(focusedItem?.rowIndex ?? 0), showSearchPanel: showSearch, showFilterPanel: true, sorting: { mode: "multiple" }, selection: { mode: allowMultipleSelection ? 'multiple' : 'single' }, pageSize: TMDataGridPageSize.Small, onSelectionChanged: handleSelectionChange, onFocusedRowChanged: handleFocusedRowChange, onRowDblClick: onRowDblClick, onContentReady: onContentReady, onContextMenuPreparing: onContextMenuPreparing, onKeyDown: onKeyDown, counterConfig: { show: true } }), (showExportForm && searchResult && onCloseExportForm) && _jsx(TMDataGridExportForm, { dataColumns: dataColumns, dataSource: dataSource, selectedRowKeys: selectedRowKeys, onCloseExportForm: onCloseExportForm, searchResult: searchResult })] });
 };
 //#region TMSearchResultSelector
 const StyledItemTemplate = styled.div ` 

package/lib/components/features/workflow/diagram/WFDiagram.d.ts

@@ -6,7 +6,6 @@ interface IWFDiagramProps {
     translateX?: number;
     translateY?: number;
     currentSetID?: string;
-    onDiagramImport?: (newXmlString: string) => void;
 }
 declare const WFDiagram: React.FC<IWFDiagramProps>;
 export default WFDiagram;

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

@@ -205,7 +205,7 @@ const DiagramMessage = styled.div `
   color: #555;
   text-align: center;
 `;
-const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel = 1, translateX = 0, translateY = 0, onDiagramImport }) => {
+const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel = 1, translateX = 0, translateY = 0 }) => {
     const [isLoading, setIsLoading] = useState(true);
     const [wfDiagram, setWfDiagram] = useState(null);
     const [selectedItems, setSelectedItems] = useState(new Set());
@@ -270,31 +270,6 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel
         const totalHeight = finalMaxY - finalMinY;
         return { svgWidth: Math.max(0, totalWidth * zoomLevel), svgHeight: Math.max(0, totalHeight * zoomLevel) };
     }, [wfDiagram, zoomLevel]);
-    // const updateWfDiagram = useCallback((newDiagram: WfDiagram) => {
-    //     if (readOnly) return;
-    //     try {
-    //         validateDiagram(newDiagram);
-    //         setWfDiagram(newDiagram);
-    //         if (!isUndoingRedoing.current) {
-    //             setWfDiagramHistory(prevHistory => {
-    //                 const newHistory = prevHistory.slice(0, historyIndex + 1);
-    //                 return [...newHistory, newDiagram];
-    //             });
-    //             setHistoryIndex(prevIndex => prevIndex + 1);
-    //         }
-    //     } catch (e: any) {
-    //         TMExceptionBoxManager.show({ exception: e });
-    //     }
-    // }, [historyIndex, readOnly]);
-    // const updateDiagramAndHistory = useCallback((newDiagram: WfDiagram) => {
-    //     if (readOnly) return;
-    //     if (!isUndoingRedoing.current) {
-    //         const newHistory = wfDiagramHistory.slice(0, historyIndex + 1);
-    //         setWfDiagramHistory([...newHistory, newDiagram]);
-    //         setHistoryIndex(newHistory.length);
-    //     }
-    //     setWfDiagram(newDiagram);
-    // }, [wfDiagramHistory, historyIndex, isUndoingRedoing, setWfDiagramHistory, setHistoryIndex, setWfDiagram, readOnly]);
     const updateDiagram = useCallback((newDiagram, validate = true) => {
         if (readOnly)
             return;
@@ -615,6 +590,7 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel
         }
     }, []);
     // Gestore dell'evento di selezione file (esegue il parse e chiama il genitore)
+    // Gestore dell'evento di selezione file (esegue il parse e chiama il genitore)
     const handleFileChange = useCallback((event) => {
         const file = event.target.files?.[0];
         if (!file) {
@@ -624,15 +600,13 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel
         reader.onload = (e) => {
             try {
                 const xmlContent = e.target?.result;
-                // 1. Esegui il parse per validare il file.
-                // parseWfDiagramXml lancerà un errore se l'XML è invalido o malformato,
-                // intercettato nel blocco catch.
-                // NON ASSEGNIAMO wfDiagram QUI, MA CHIAMIAMO SOLO PER VERIFICA.
-                parseWfDiagramXml(xmlContent);
-                // 2. Se il parsing ha successo, comunichiamo la nuova stringa XML al genitore.
-                // Il genitore sarà responsabile di aggiornare lo stato di xmlDiagramString,
-                // il che farà re-renderizzare questo componente con il nuovo diagramma.
-                onDiagramImport?.(xmlContent);
+                // 1. Esegui il parse per ottenere il nuovo oggetto WfDiagram.
+                const newWfDiagram = parseWfDiagramXml(xmlContent);
+                // 2. TRATTA L'IMPORT COME UNA MODIFICA:
+                // Usa updateDiagram per aggiornare lo stato interno (wfDiagram) e la history (wfDiagramHistory).
+                // L'originale xmlDiagramString del genitore resta intatto.
+                // Passiamo false per 'validate' in quanto il file importato è già stato validato da parseWfDiagramXml.
+                updateDiagram(newWfDiagram, false);
                 // 3. Resetta l'input per permettere re-import dello stesso file
                 if (fileInputRef.current) {
                     fileInputRef.current.value = '';
@@ -649,7 +623,7 @@ const WFDiagram = ({ xmlDiagramString, currentSetID, readOnly = false, zoomLevel
             }
         };
         reader.readAsText(file, 'UTF-8');
-    }, [onDiagramImport]);
+    }, [updateDiagram]);
     const calculateConnectionPath = useCallback((connection, sourceItem, sinkItem) => {
         const sourcePoint = getConnectionPoint(sourceItem, connection.Source.ConnectorName);
         const sinkPoint = getConnectionPoint(sinkItem, connection.Sink.ConnectorName);

package/lib/components/grids/TMBlogs.js

@@ -621,49 +621,49 @@ const TMBlogs = (props) => {
         setShowDcmtForm(false);
         handleFocusedAttachment(undefined);
     }, []);
-    return _jsx("div", { style: { height: height ?? '100%', width: width ?? '100%' }, children: _jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: localShowWaitPanel, showWaitPanelPrimary: localShowPrimary, waitPanelTitle: localWaitPanelTitle, waitPanelTextPrimary: localWaitPanelTextPrimary, waitPanelValuePrimary: localWaitPanelValuePrimary, waitPanelMaxValuePrimary: localWaitPanelMaxValuePrimary, isCancelable: true, abortController: localAbortController, children: [(currentHeader && !isHeaderHidden) && (_jsx("div", { style: { display: 'block', width: '100%', overflowX: 'auto', overflowY: 'hidden', whiteSpace: 'nowrap' }, onContextMenu: e => e.preventDefault(), children: _jsx(ScrollView, { width: "100%", height: "auto", direction: "horizontal", useNative: true, children: _jsxs("div", { style: {
-                                display: 'flex',
-                                flexDirection: 'row',
-                                gap: '8px',
-                                alignItems: 'center',
-                                minWidth: 'max-content',
-                                padding: '10px 0',
-                            }, children: [currentHeader.showSearchBar && (_jsx("div", { style: {
-                                        minWidth: isMobile ? '120px' : '160px',
-                                        maxWidth: isMobile ? '120px' : '200px',
-                                        marginLeft: "10px"
-                                    }, children: _jsx(TMSearchBar, { marginLeft: "0px", maxWidth: "100%", searchValue: searchText, onSearchValueChanged: (e) => handleSearchChange(e) }) })), currentHeader.showPostsDropDown && (_jsx("div", { style: {
-                                        minWidth: isMobile ? '90px' : '120px',
-                                        maxWidth: isMobile ? '90px' : '200px',
-                                    }, children: _jsx(TMDropDown, { value: postsToShow, dataSource: postsToShowDataSource, onValueChanged: handleFilterChange }) })), currentHeader.showFilters && (_jsx(TMTreeDropDown, { dataSource: treeDataSource, values: appliedGlobalFilters, setValues: setAppliedGlobalFilters, displayExpr: false, isValidKey: () => true, elementStyle: {
-                                        minWidth: isMobile ? '90px' : '120px',
-                                        width: isMobile ? '90px' : '150px',
-                                        height: '29px',
-                                    } }))] }) }) })), _jsxs("div", { style: { height: `calc(100% - ${currentHeader && !isHeaderHidden ? '50px' : '0px'})`, width: "100%", overflow: 'auto', display: 'block' }, onContextMenu: onBackgroundContextMenu, children: [_jsx("div", { style: { width: "100%", height: "100%" }, children: ThumbnailView() }), anchorEl && _jsx(ContextMenu, { ref: contextMenuRef, dataSource: contextMenuItems, target: anchorEl, onHiding: closeContextMenu })] }), (showDcmtForm && focusedAttachment && focusedAttachment.TID && focusedAttachment.DID) && _jsx(TMDcmtForm, { TID: Number(focusedAttachment.TID), DID: Number(focusedAttachment.DID), layoutMode: LayoutModes.Update, onClose: onCloseDcmtForm, isClosable: true, titleModal: SDKUI_Localizator.Attachment + ": " + focusedAttachment.fileName, isModal: true, widthModal: "95%", heightModal: "95%" }), (showFloatingCommentButton && showCommentFormCallback && !(context?.engine === 'WorkingGroupEngine' && context?.object?.customData1 === 1)) && _jsx("button", { style: {
-                        position: 'absolute',
-                        bottom: '10px',
-                        right: '20px',
-                        width: '40px',
-                        height: '40px',
-                        borderRadius: "50%",
-                        backgroundColor: "#C2388B",
-                        color: '#fff',
-                        border: 'none',
-                        cursor: 'pointer',
-                        boxShadow: '0 2px 6px rgba(0,0,0,0.2)',
-                        zIndex: 1000,
-                        transition: 'background-color 0.3s ease, transform 0.2s ease',
-                        display: 'flex',
-                        justifyContent: 'center',
-                        alignItems: 'center',
-                    }, onMouseEnter: (e) => {
-                        e.currentTarget.style.backgroundColor = '#D94A9F';
-                        e.currentTarget.style.transform = 'scale(1.1)';
-                        e.currentTarget.style.boxShadow = '0 4px 12px rgba(37, 89, 165, 0.6)';
-                    }, onMouseLeave: (e) => {
-                        e.currentTarget.style.backgroundColor = "#C2388B";
-                        e.currentTarget.style.transform = 'scale(1)';
-                        e.currentTarget.style.boxShadow = '0 2px 6px rgba(0,0,0,0.2)';
-                    }, onClick: () => { showCommentFormCallback(); }, children: _jsx(TMTooltip, { content: SDKUI_Localizator.AddNewComment, children: _jsx("i", { className: "dx-icon-chat", style: { fontSize: '25px' } }) }) })] }) });
+    return _jsxs("div", { style: { height: height ?? '100%', width: width ?? '100%' }, children: [_jsxs(TMLayoutWaitingContainer, { direction: 'vertical', showWaitPanel: localShowWaitPanel, showWaitPanelPrimary: localShowPrimary, waitPanelTitle: localWaitPanelTitle, waitPanelTextPrimary: localWaitPanelTextPrimary, waitPanelValuePrimary: localWaitPanelValuePrimary, waitPanelMaxValuePrimary: localWaitPanelMaxValuePrimary, isCancelable: true, abortController: localAbortController, children: [(currentHeader && !isHeaderHidden) && (_jsx("div", { style: { display: 'block', width: '100%', overflowX: 'auto', overflowY: 'hidden', whiteSpace: 'nowrap' }, onContextMenu: e => e.preventDefault(), children: _jsx(ScrollView, { width: "100%", height: "auto", direction: "horizontal", useNative: true, children: _jsxs("div", { style: {
+                                    display: 'flex',
+                                    flexDirection: 'row',
+                                    gap: '8px',
+                                    alignItems: 'center',
+                                    minWidth: 'max-content',
+                                    padding: '10px 0',
+                                }, children: [currentHeader.showSearchBar && (_jsx("div", { style: {
+                                            minWidth: isMobile ? '120px' : '160px',
+                                            maxWidth: isMobile ? '120px' : '200px',
+                                            marginLeft: "10px"
+                                        }, children: _jsx(TMSearchBar, { marginLeft: "0px", maxWidth: "100%", searchValue: searchText, onSearchValueChanged: (e) => handleSearchChange(e) }) })), currentHeader.showPostsDropDown && (_jsx("div", { style: {
+                                            minWidth: isMobile ? '90px' : '120px',
+                                            maxWidth: isMobile ? '90px' : '200px',
+                                        }, children: _jsx(TMDropDown, { value: postsToShow, dataSource: postsToShowDataSource, onValueChanged: handleFilterChange }) })), currentHeader.showFilters && (_jsx(TMTreeDropDown, { dataSource: treeDataSource, values: appliedGlobalFilters, setValues: setAppliedGlobalFilters, displayExpr: false, isValidKey: () => true, elementStyle: {
+                                            minWidth: isMobile ? '90px' : '120px',
+                                            width: isMobile ? '90px' : '150px',
+                                            height: '29px',
+                                        } }))] }) }) })), _jsxs("div", { style: { height: `calc(100% - ${currentHeader && !isHeaderHidden ? '50px' : '0px'})`, width: "100%", overflow: 'auto', display: 'block' }, onContextMenu: onBackgroundContextMenu, children: [_jsx("div", { style: { width: "100%", height: "100%" }, children: ThumbnailView() }), anchorEl && _jsx(ContextMenu, { ref: contextMenuRef, dataSource: contextMenuItems, target: anchorEl, onHiding: closeContextMenu })] }), (showDcmtForm && focusedAttachment && focusedAttachment.TID && focusedAttachment.DID) && _jsx(TMDcmtForm, { TID: Number(focusedAttachment.TID), DID: Number(focusedAttachment.DID), layoutMode: LayoutModes.Update, onClose: onCloseDcmtForm, isClosable: true, titleModal: SDKUI_Localizator.Attachment + ": " + focusedAttachment.fileName, isModal: true, widthModal: "95%", heightModal: "95%" })] }), (showFloatingCommentButton && showCommentFormCallback && !(context?.engine === 'WorkingGroupEngine' && context?.object?.customData1 === 1)) && _jsx("button", { style: {
+                    position: 'absolute',
+                    bottom: '18px',
+                    right: '20px',
+                    width: '40px',
+                    height: '40px',
+                    borderRadius: "50%",
+                    backgroundColor: "#C2388B",
+                    color: '#fff',
+                    border: 'none',
+                    cursor: 'pointer',
+                    boxShadow: '0 2px 6px rgba(0,0,0,0.2)',
+                    zIndex: 1000,
+                    transition: 'background-color 0.3s ease, transform 0.2s ease',
+                    display: 'flex',
+                    justifyContent: 'center',
+                    alignItems: 'center',
+                }, onMouseEnter: (e) => {
+                    e.currentTarget.style.backgroundColor = '#D94A9F';
+                    e.currentTarget.style.transform = 'scale(1.1)';
+                    e.currentTarget.style.boxShadow = '0 4px 12px rgba(37, 89, 165, 0.6)';
+                }, onMouseLeave: (e) => {
+                    e.currentTarget.style.backgroundColor = "#C2388B";
+                    e.currentTarget.style.transform = 'scale(1)';
+                    e.currentTarget.style.boxShadow = '0 2px 6px rgba(0,0,0,0.2)';
+                }, onClick: () => { showCommentFormCallback(); }, children: _jsx(TMTooltip, { content: SDKUI_Localizator.AddNewComment, children: _jsx("i", { className: "dx-icon-chat", style: { fontSize: '25px' } }) }) })] });
 };
 export default TMBlogs;

package/package.json

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