@topconsultnpm/sdkui-react 6.20.0-dev1.34 → 6.20.0-dev1.36

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

@@ -32,8 +32,8 @@ export interface TMDataGridProps<T> extends IDataGridOptions {
     pageSize?: TMDataGridPageSize;
     /** Configures the search panel position in the toolbar */
     searchPanelToolbarPosition?: 'before' | 'default';
-    /** if visible, set focus on SearchPanel */
-    searchPanelFocusStarting?: boolean;
+    /** Trigger to set focus on SearchPanel (only if visible) - change the number to trigger focus */
+    searchPanelFocusTrigger?: number;
     /** Show the header filter */
     showHeaderFilter?: boolean;
     /** Show the filter panel */

package/lib/components/base/TMDataGrid.js

@@ -17,7 +17,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 = true, showHeaderColumnChooser = false, showLoadPanel = true, showSearchPanel = true, searchPanelToolbarPosition = 'before', searchPanelFocusStarting = false, counterConfig = { show: false, items: new Map() }, onHasFiltersChange, customContextMenuItems, 
+    dataColumns = [], pageSize = TMDataGridPageSize.Large, showHeaderFilter = true, showFilterPanel = true, showHeaderColumnChooser = false, showLoadPanel = true, showSearchPanel = true, searchPanelToolbarPosition = 'before', searchPanelFocusTrigger = 0, counterConfig = { show: false, items: new Map() }, onHasFiltersChange, customContextMenuItems, 
     // 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, grouping, groupPanel, filterRow, headerFilter, editing, rowDragging, masterDetail, 
     // other properties
@@ -39,6 +39,17 @@ const TMDataGrid = React.forwardRef((props, ref) => {
         const count = getRecordCount(dataSource);
         setTotalRecordCount(count);
     }, [dataSource]);
+    // Handle search panel focus when trigger changes
+    useEffect(() => {
+        if (!searchPanelFocusTrigger || searchPanelFocusTrigger <= 0 || !showSearchPanel || !internalRef.current)
+            return;
+        setTimeout(() => {
+            const searchInput = internalRef.current?.instance().element().querySelector('.dx-datagrid-search-panel input');
+            if (searchInput) {
+                searchInput.focus();
+            }
+        }, 100);
+    }, [searchPanelFocusTrigger, showSearchPanel]);
     // Handle custom context menu (only when customContextMenuItems is provided)
     useEffect(() => {
         if (!customContextMenuItems || !gridContainerRef.current)
@@ -258,10 +269,9 @@ const TMDataGrid = React.forwardRef((props, ref) => {
             return;
         // Update state with the current number of visible rows in the DataGrid
         setVisibleItemsCount(internalRef.current.instance()?.getVisibleRows()?.length ?? 0);
-        // Focusing SearchPanel
-        if (showSearchPanel && searchPanelFocusStarting) {
+        // Focusing SearchPanel on content ready
+        if (showSearchPanel && searchPanelFocusTrigger && searchPanelFocusTrigger > 0) {
             // Use a small delay to ensure the DOM is fully rendered before trying to focus
-            // This can prevent issues with the focus not being set correctly
             setTimeout(() => {
                 const searchInput = internalRef.current?.instance().element().querySelector('.dx-datagrid-search-panel input');
                 if (searchInput) {
@@ -269,7 +279,7 @@ const TMDataGrid = React.forwardRef((props, ref) => {
                 }
             }, 100);
         }
-    }, [onContentReady]);
+    }, [onContentReady, showSearchPanel, searchPanelFocusTrigger]);
     const onOptionChangedCallback = useCallback((e) => {
         // Assicurati che component esista
         const grid = e.component;

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

@@ -11,8 +11,9 @@ import TMRecentsManager from '../../grids/TMRecentsManager';
 import { SearchResultContext } from '../../../ts';
 import { useDeviceType, DeviceType } from '../../base/TMDeviceProvider';
 import { StyledMultiViewPanel } from '../../base/Styled';
-import { TMPanelManagerProvider, useTMPanelManagerContext } from '../../layout/panelManager/TMPanelManagerContext';
+import { useTMPanelManagerContext } from '../../layout/panelManager/TMPanelManagerContext';
 import TMPanelManagerContainer from '../../layout/panelManager/TMPanelManagerContainer';
+import { TMPanelManagerWithPersistenceProvider } from '../../layout/panelManager/TMPanelManagerWithPersistenceProvider';
 var TMSearchViews;
 (function (TMSearchViews) {
     TMSearchViews[TMSearchViews["Search"] = 0] = "Search";
@@ -141,15 +142,16 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
             console.error("Error refreshing search:", error);
         }
     };
-    const isMobile = deviceType === DeviceType.TABLET || deviceType === DeviceType.MOBILE;
+    const isMobile = deviceType === DeviceType.MOBILE;
+    const isTabletOrMobile = deviceType === DeviceType.TABLET || deviceType === DeviceType.MOBILE;
     // --- JSX WRAPPERS ---
-    const tmTreeSelectorElement = useMemo(() => _jsx(TMTreeSelectorWrapper, { isMobile: isMobile, onSelectedTIDChanged: (tid) => {
+    const tmTreeSelectorElement = useMemo(() => _jsx(TMTreeSelectorWrapper, { isMobile: isTabletOrMobile, onSelectedTIDChanged: (tid) => {
             setCurrentTID(tid);
             if (tid && mruTIDs.includes(tid))
                 setCurrentMruTID(tid);
             else
                 setCurrentMruTID(0);
-        } }), [isMobile, mruTIDs]);
+        } }), [isTabletOrMobile, mruTIDs]);
     const tmRecentsManagerElement = useMemo(() => _jsx(TMRecentsManagerWrapper, { mruTIDs: mruTIDs, currentMruTID: currentMruTID, deviceType: deviceType, onSelectedTID: (tid) => {
             setCurrentMruTID(tid);
             setCurrentTID(tid);
@@ -180,6 +182,29 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
                     }, onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? filteredByTIDSQDs.find(o => o.id == 1) : currentSQD, setSQDAsync) }) }) : _jsx(_Fragment, {}), _jsx(Item, { title: SDKUI_Localizator.AllFemale, children: _jsx(TMSavedQuerySelectorWrapper, { allowShowSearch: true, items: allSQDs, manageDefault: false, onItemClick: (sqd) => {
                         onSQDItemClick(sqd, setSQDAsync);
                     }, onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? undefined : currentSQD, setSQDAsync) }) })] }), [currentSQDMode, currentTID, currentSQD, fromDTD, filteredByTIDSQDs, allSQDs]);
+    // Returns the current panelLayout from user settings, falling back to an empty object if not present.
+    const getPanelLayoutSetting = () => {
+        return SDKUI_Globals.userSettings.searchSettings.panelLayout ?? {};
+    };
+    // Checks whether a persisted panel layout exists and is not empty.
+    const hasSavedLayout = () => {
+        const panelLayout = getPanelLayoutSetting();
+        return Object.keys(panelLayout).length > 0;
+    };
+    // Persists the current panel states into user settings. Each panel must contain: visible, width and height.
+    const persistPanelStates = (state) => {
+        if (!state || Object.keys(state).length === 0)
+            return;
+        SDKUI_Globals.userSettings.searchSettings.panelLayout = {
+            ...state
+        };
+    };
+    // Retrieves the persisted panel layout. Returns undefined on mobile devices.
+    const getPersistedPanelStates = () => {
+        if (isMobile)
+            return undefined;
+        return getPanelLayoutSetting();
+    };
     // --- PANEL DEFINITIONS ---
     const allInitialPanelVisibility = {
         'TMTreeSelector': true,
@@ -219,7 +244,7 @@ const TMSearch = ({ allTasks = [], getAllTasks, deleteTaskByIdsCallback, addTask
             toolbarOptions: { icon: _jsx(IconSavedQuery, { fontSize: 24 }), visible: true, orderNumber: 4, isActive: allInitialPanelVisibility['TMSavedQuerySelector'] }
         }
     ], [tmTreeSelectorElement, showSearchResults, tmRecentsManagerElement, tmSearchQueryPanelElement, tmSavedQuerySelectorElement, fromDTD, mruTIDs]);
-    return (_jsxs(_Fragment, { children: [showSearchResults ? _jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.Search, children: _jsx(TMPanelManagerProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'TMRecentsManager', children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true, minPanelSizePx: !isMobile ? 250 : 150 }) }) }) : tmSearchQueryPanelElement, showSearchResults && _jsx(TMSearchResult, { isVisible: isVisible && currentSearchView === TMSearchViews.Result, context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, floatingActionConfig: floatingActionConfig, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, openInOffice: openInOffice, onRefreshSearchAsync: onRefreshSearchAsync, onClose: () => { onlyShowSearchQueryPanel ? setShowSearchResults(false) : setCurrentSearchView(TMSearchViews.Search); }, onFileOpened: onFileOpened, onTaskCreateRequest: onTaskCreateRequest, openWGsCopyMoveForm: openWGsCopyMoveForm, openEditPdf: openEditPdf, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, passToArchiveCallback: passToArchiveCallback, onSelectedTIDChanged: onCurrentTIDChangedCallback, showTodoDcmtForm: showTodoDcmtForm, onReferenceClick: onReferenceClick, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers })] }));
+    return (_jsxs(_Fragment, { children: [showSearchResults ? _jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.Search, children: _jsx(TMPanelManagerWithPersistenceProvider, { panels: initialPanels, initialVisibility: allInitialPanelVisibility, defaultDimensions: initialPanelDimensions, initialDimensions: initialPanelDimensions, initialMobilePanelId: 'TMRecentsManager', isPersistenceEnabled: !isMobile ? hasSavedLayout() : false, persistPanelStates: !isMobile ? (state) => persistPanelStates(state) : undefined, persistedPanelStates: getPersistedPanelStates(), children: _jsx(TMPanelManagerContainer, { panels: initialPanels, direction: "horizontal", showToolbar: true, minPanelSizePx: !isMobile ? 250 : 150 }) }) }) : tmSearchQueryPanelElement, showSearchResults && _jsx(TMSearchResult, { isVisible: isVisible && currentSearchView === TMSearchViews.Result, context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, floatingActionConfig: floatingActionConfig, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, openInOffice: openInOffice, onRefreshSearchAsync: onRefreshSearchAsync, onClose: () => { onlyShowSearchQueryPanel ? setShowSearchResults(false) : setCurrentSearchView(TMSearchViews.Search); }, onFileOpened: onFileOpened, onTaskCreateRequest: onTaskCreateRequest, openWGsCopyMoveForm: openWGsCopyMoveForm, openEditPdf: openEditPdf, openS4TViewer: openS4TViewer, onOpenS4TViewerRequest: onOpenS4TViewerRequest, passToArchiveCallback: passToArchiveCallback, onSelectedTIDChanged: onCurrentTIDChangedCallback, showTodoDcmtForm: showTodoDcmtForm, onReferenceClick: onReferenceClick, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers })] }));
 };
 export default TMSearch;
 const TMTreeSelectorWrapper = ({ isMobile, onSelectedTIDChanged }) => {

package/lib/components/forms/TMChooserForm.js

@@ -88,7 +88,7 @@ const TMChooserForm = ({ children, title, allowMultipleSelection = false, allowA
     }, [manageUseLocalizedName, summaryItems]);
     return (_jsx(TMModal, { title: renderTitle(), width: width ?? '550px', height: height ?? '600px', toolbar: _jsx(ToolbarButtons, {}), onClose: onClose, children: children ??
             filteredItems.length > 0
-            ? _jsx(TMDataGrid, { dataSource: filteredItems, keyExpr: keyName, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selectedRowKeys: selectedRowKeys, searchPanelFocusStarting: true, headerFilter: { visible: true }, selection: { mode: allowMultipleSelection ? 'multiple' : 'single', showCheckBoxesMode: 'always', selectAllMode: 'allPages' }, grouping: allowGrouping ? { autoExpandAll: false, expandMode: 'rowClick' } : undefined, summary: customSummary, showFilterPanel: showFilterPanel, onFocusedRowChanged: handleFocusedRowChange, onSelectionChanged: handleSelectionChanged, onRowDblClick: handleRowDoubleClick })
+            ? _jsx(TMDataGrid, { dataSource: filteredItems, keyExpr: keyName, dataColumns: dataColumns, focusedRowKey: focusedRowKey, selectedRowKeys: selectedRowKeys, searchPanelFocusTrigger: 1, headerFilter: { visible: true }, selection: { mode: allowMultipleSelection ? 'multiple' : 'single', showCheckBoxesMode: 'always', selectAllMode: 'allPages' }, grouping: allowGrouping ? { autoExpandAll: false, expandMode: 'rowClick' } : undefined, summary: customSummary, showFilterPanel: showFilterPanel, onFocusedRowChanged: handleFocusedRowChange, onSelectionChanged: handleSelectionChanged, onRowDblClick: handleRowDoubleClick })
             : _jsx(TMLayoutContainer, { gap: 30, alignItems: 'center', justifyContent: 'center', children: _jsx(TMLayoutItem, { children: _jsx("p", { style: { height: "100%", color: TMColors.primaryColor, fontSize: "1.5rem", display: 'flex', alignItems: 'center', justifyContent: 'center' }, children: SDKUI_Localizator.NoDataToDisplay }) }) }) }));
 };
 export default TMChooserForm;

package/lib/helper/SDKUI_Globals.d.ts

@@ -55,6 +55,13 @@ export declare class SearchSettings {
     defaultTree: number;
     previewThreshold: number;
     floatingMenuBar: FloatingMenuBarSettings;
+    panelLayout: {
+        [id: string]: {
+            visible: boolean;
+            width: string;
+            height: string;
+        };
+    };
 }
 export declare class FloatingMenuBarSettings {
     orientation: 'horizontal' | 'vertical';

package/lib/helper/SDKUI_Globals.js

@@ -99,6 +99,7 @@ export class SearchSettings {
         this.defaultTree = -1;
         this.previewThreshold = 500; // KB
         this.floatingMenuBar = new FloatingMenuBarSettings();
+        this.panelLayout = {};
     }
 }
 export class FloatingMenuBarSettings {

package/package.json

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