@topconsultnpm/sdkui-react-beta 6.16.69 → 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/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/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.69",
+    "version": "6.16.70",
     "description": "",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",