@topconsultnpm/sdkui-react 6.20.0-dev1.35 → 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/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/package.json

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