[pull] latest from ag-grid:latest

.claude/settings.json

@@ -86,7 +86,8 @@
     ],
     "deny": [
       "Read(.env.local)",
-      "Read(credentials/)"
+      "Read(credentials/)",
+      "Read(credentials/**)"
     ]
   },
   "hooks": {

documentation/ag-grid-docs/src/content/docs-nav/nav.json

@@ -1204,6 +1204,11 @@
                             "title": "Touch",
                             "path": "touch"
                         },
+                        {
+                            "type": "item",
+                            "title": "Input Fields",
+                            "path": "input-fields"
+                        },
                         {
                             "type": "item",
                             "title": "Accessibility (ARIA)",

documentation/ag-grid-docs/src/content/docs/cell-editors/index.mdoc

@@ -9,6 +9,8 @@ The example below shows some Provided Editor Components and some Custom Editor C
 
 {% gridExampleRunner title="Simple Editor Components" name="component-editor-2"  exampleHeight=370 /%}
 
+The provided editors' input fields share the grid-wide input behaviour (clear button on supported inputs, browser autocomplete) described in [Input Fields](./input-fields/).
+
 ## Custom Components
 
 {% partial file="./_component-interface-javascript.mdoc" /%}

documentation/ag-grid-docs/src/content/docs/filter-set-mini-filter/index.mdoc

@@ -118,6 +118,8 @@ The example below shows this text being customised:
 
 {% gridExampleRunner title="Text Customisation" name="text-customisation" /%}
 
+The Mini Filter input shares the grid-wide input behaviour (clear button, browser autocomplete) described in [Input Fields](./input-fields/).
+
 ## Hiding the Mini Filter
 
 By default, the Mini Filter is shown whenever the Set Filter is used. If you would like to hide it, you can use the following:

documentation/ag-grid-docs/src/content/docs/filter-text/index.mdoc

@@ -54,6 +54,8 @@ The following example demonstrates configuring different Text Filter parameters:
 
 {% gridExampleRunner title="Text Filter Parameters" name="text-filter-parameters" /%}
 
+Filter input fields share the grid-wide input behaviour (clear button, browser autocomplete) described in [Input Fields](./input-fields/).
+
 ## Text Formatter
 
 By default, the grid compares the Text Filter with the values in a case-insensitive way, by converting both the filter text and the values to lower case and comparing them; for example, `'o'` will match `'Olivia'` and `'Salmon'`. If you instead want to have case-sensitive matches, you can set `caseSensitive = true` in the `filterParams`, so that no lowercasing is performed. In this case, `'o'` would no longer match `'Olivia'`.

documentation/ag-grid-docs/src/content/docs/find/index.mdoc

@@ -53,6 +53,8 @@ The active match and the total number of matches can also be retrieved via the A
 
 {% gridExampleRunner title="Find" name="find" /%}
 
+The Find input shares the grid-wide input behaviour (clear button, browser autocomplete) described in [Input Fields](./input-fields/).
+
 ## Using Find with Cell Components
 
 By default, Find searches within the [Formatted Value](./value-formatters/) of the cell, or the raw cell value if there is no Value Formatter. This is what is displayed in the cell by default.

documentation/ag-grid-docs/src/content/docs/floating-filters/index.mdoc

@@ -70,19 +70,13 @@ The screen shots below show example scenarios where the provided Number floating
 
 ### Controlling Autocomplete on Floating Filters
 
-Browser autocomplete is disabled for grid input fields by default. Set `enableInputAutoComplete` to `true` to enable it for eligible inputs. Inputs that provide grid-owned suggestions, such as Rich Select and Advanced Filter inputs, keep browser autocomplete disabled so the browser UI cannot overlap their suggestion lists.
+Browser autocomplete on grid inputs is controlled globally by `enableInputAutoComplete` and per input with
+`browserAutoComplete` parameters, see [Input Fields](./input-fields/) for the full behaviour and the accepted values.
 
-The `Text` and `Number` floating filters also support overriding this behaviour for an individual input by passing the
-`browserAutoComplete` parameter in `floatingFilterComponentParams` (as defined in `ITextFloatingFilterParams` and
-`INumberFloatingFilterParams`).
-
-Possible values for `browserAutoComplete`:
-
-- `true` to allow the browser's default autocomplete/autofill behaviour.
-- `false` to disable the browser autocomplete/autofill behaviour by setting the `autocomplete` attribute to `off`.
-- A **string** to be used as the [autocomplete](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) attribute value.
-
-Some browsers do not respect setting the HTML attribute `autocomplete="off"` and display the auto-fill prompts anyway.
+For floating filters specifically, `browserAutoComplete` can be set in two places: `filterParams` (shared with the
+parent filter's inputs, and inherited by the floating filter input) or `floatingFilterComponentParams` (as defined in
+`ITextFloatingFilterParams` and `INumberFloatingFilterParams`), which applies to the floating filter input only and
+takes precedence over the `filterParams` value.
 
 ### Placeholder Text on Floating Filters
 

documentation/ag-grid-docs/src/content/docs/input-fields/index.mdoc

@@ -0,0 +1,59 @@
+---
+title: "Input Fields"
+---
+
+The grid renders text input fields in many features: column filters, floating filters, the Set Filter Mini Filter,
+cell editors, tool panel search boxes and toolbar items. This page describes the behaviour these inputs share and how
+to configure it, globally or per input.
+
+## Clear Button
+
+Supported input fields show a clear button when they contain a value. Clicking it clears the input, keeps focus in the
+field, and applies the change immediately, for example, a filter input clears its filter without waiting for the
+typing debounce. When a filter has an Apply button, clearing updates the input but the filter model is only changed
+once **Apply** is clicked.
+
+Set `suppressInputClearButton` to `true` to hide the clear button across the grid:
+
+{% apiDocumentation source="grid-options/properties.json" section="miscellaneous" names=["suppressInputClearButton"] /%}
+
+Date inputs only show the clear button when a text input is used (`browserDatePicker` disabled); native browser date
+pickers provide their own clear affordance.
+
+## Browser Autocomplete
+
+Browser autocomplete/autofill is disabled for grid input fields by default. Set `enableInputAutoComplete` to `true` to
+enable it for eligible inputs:
+
+{% apiDocumentation source="grid-options/properties.json" section="miscellaneous" names=["enableInputAutoComplete"] /%}
+
+Inputs that provide grid-owned suggestions — the Rich Select editor with `allowTyping`, the Advanced Filter input, and
+the Calculated Columns expression editor — always keep browser autocomplete disabled so the browser UI cannot overlap
+their suggestion lists.
+
+### Overriding Autocomplete per Input
+
+Individual inputs can override the global behaviour with a `browserAutoComplete` parameter:
+
+| Input                                                               | Where to set `browserAutoComplete`                                                                                                      |
+| ------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
+| Provided cell editors (text, number, date, date string, large text) | `colDef.cellEditorParams`                                                                                                               |
+| Provided filter inputs (text, number, date, bigint)                 | `colDef.filterParams`                                                                                                                   |
+| Text / Number floating filters                                      | `colDef.floatingFilterComponentParams` (takes precedence over the `filterParams` value, which floating filter inputs otherwise inherit) |
+| Set Filter Mini Filter                                              | `colDef.filterParams`                                                                                                                   |
+| Columns / Filters Tool Panel search                                 | the tool panel's `toolPanelParams`                                                                                                      |
+| Find and Quick Filter toolbar items                                 | the item definition's `toolbarItemParams`                                                                                               |
+
+Possible values for `browserAutoComplete`:
+
+- `true` to allow the browser's default autocomplete/autofill behaviour.
+- `false` to disable the browser autocomplete/autofill behaviour by setting the `autocomplete` attribute to `off`.
+- A **string** to be used as the [autocomplete](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) attribute value, e.g. `'email'` on a cell editor.
+
+A `browserAutoComplete` value always wins over `enableInputAutoComplete`, in both directions: with the option
+disabled, `browserAutoComplete: true` enables autofill for that input alone, and with the option enabled,
+`browserAutoComplete: false` disables it for that input alone. Omitting the parameter defers to the option.
+
+Some browsers do not respect setting the HTML attribute `autocomplete="off"` and display the auto-fill prompts anyway.
+
+Custom components render their own inputs, so these options do not apply to them.

documentation/ag-grid-docs/src/content/docs/tool-panel/index.mdoc

@@ -19,6 +19,8 @@ The grid provides the following Tool Panels:
 - [Filters Tool Panel](./tool-panel-filters/) - to perform multiple column filters.
 - [New Filters Tool Panel](./tool-panel-filters-new/) - a redesigned version of the Filters Tool Panel that provides improved UX.
 
+The provided tool panels' search inputs share the grid-wide input behaviour (clear button, browser autocomplete) described in [Input Fields](./input-fields/).
+
 ## Custom Tool Panels
 
 In addition to the provided Tool Panels, it is also possible to provide custom Tool Panels.

documentation/ag-grid-docs/src/content/docs/toolbar/index.mdoc

@@ -71,6 +71,8 @@ A number of built-in toolbar items are provided for common use cases that integr
 | [`agMenuToolbarItem`](#dropdown-menus) | Button that opens a [dropdown menu](#dropdown-menus).                        | `ContextMenuModule` or `ColumnMenuModule` |
 | `separator`                            | Vertical divider used to group items visually. Has no behaviour of its own.  | None                                      |
 
+The Find and Quick Filter items' inputs share the grid-wide input behaviour (clear button, browser autocomplete) described in [Input Fields](./input-fields/).
+
 ### Row Group and Pivot Panels
 
 The Row Group Panel and Pivot Panel can both be embedded in the Quick Access Toolbar using `agRowGroupPanelToolbarItem` and `agPivotPanelToolbarItem`. Both panels are configured independently of the [Row Group Panel](./grouping-group-panel/) and the [Pivot Panel](./pivoting/#enabling-the-pivot-panel/), so you can display each panel in the Toolbar, above the grid, or both at the same time.

packages/ag-grid-community/src/edit/cellEditors/dateCellEditor.ts

@@ -36,7 +36,9 @@ class DateCellEditorInput implements CellEditorInput<Date, IDateCellEditorParams
         this.eEditor = eEditor;
         this.params = params;
 
-        const { min, max, step, colDef } = params;
+        const { browserAutoComplete, min, max, step, colDef } = params;
+
+        eEditor.setAutoComplete(browserAutoComplete);
 
         if (min != null) {
             eEditor.setMin(min);

packages/ag-grid-community/src/edit/cellEditors/dateStringCellEditor.ts

@@ -41,7 +41,9 @@ class DateStringCellEditorInput implements CellEditorInput<string, IDateStringCe
         this.eEditor = eEditor;
         this.params = params;
 
-        const { min, max, step, colDef } = params;
+        const { browserAutoComplete, min, max, step, colDef } = params;
+
+        eEditor.setAutoComplete(browserAutoComplete);
 
         if (min != null) {
             eEditor.setMin(min);

packages/ag-grid-community/src/edit/cellEditors/iDateCellEditor.ts

@@ -1,6 +1,8 @@
+import type { IAutoCompleteComponentParams } from '../../interfaces/iAutoComplete';
 import type { ICellEditorParams } from '../../interfaces/iCellEditor';
 
-export interface IDateCellEditorParams<TData = any, TContext = any> extends ICellEditorParams<TData, Date, TContext> {
+export interface IDateCellEditorParams<TData = any, TContext = any>
+    extends ICellEditorParams<TData, Date, TContext>, IAutoCompleteComponentParams {
     /** Min allowed value. Either `Date` object or string in format `'yyyy-mm-dd'`. */
     min?: string | Date;
     /** Max allowed value. Either `Date` object or string in format `'yyyy-mm-dd'`. */

packages/ag-grid-community/src/edit/cellEditors/iDateStringCellEditor.ts

@@ -1,10 +1,8 @@
+import type { IAutoCompleteComponentParams } from '../../interfaces/iAutoComplete';
 import type { ICellEditorParams } from '../../interfaces/iCellEditor';
 
-export interface IDateStringCellEditorParams<TData = any, TContext = any> extends ICellEditorParams<
-    TData,
-    string,
-    TContext
-> {
+export interface IDateStringCellEditorParams<TData = any, TContext = any>
+    extends ICellEditorParams<TData, string, TContext>, IAutoCompleteComponentParams {
     /** Min allowed value. Either `Date` object or string in format `'yyyy-mm-dd'`. */
     min?: string | Date;
     /** Max allowed value. Either `Date` object or string in format `'yyyy-mm-dd'`. */

packages/ag-grid-community/src/edit/cellEditors/iLargeTextCellEditor.ts

@@ -1,6 +1,7 @@
+import type { IAutoCompleteComponentParams } from '../../interfaces/iAutoComplete';
 import type { ICellEditorParams } from '../../interfaces/iCellEditor';
 
-export interface ILargeTextEditorParams extends ICellEditorParams {
+export interface ILargeTextEditorParams extends ICellEditorParams, IAutoCompleteComponentParams {
     /**
      * Max number of characters to allow.
      * @default 200

packages/ag-grid-community/src/edit/cellEditors/iNumberCellEditor.ts

@@ -1,10 +1,8 @@
+import type { IAutoCompleteComponentParams } from '../../interfaces/iAutoComplete';
 import type { ICellEditorParams } from '../../interfaces/iCellEditor';
 
-export interface INumberCellEditorParams<TData = any, TContext = any> extends ICellEditorParams<
-    TData,
-    number,
-    TContext
-> {
+export interface INumberCellEditorParams<TData = any, TContext = any>
+    extends ICellEditorParams<TData, number, TContext>, IAutoCompleteComponentParams {
     /** Min allowed value. */
     min?: number;
     /** Max allowed value. */

packages/ag-grid-community/src/edit/cellEditors/iTextCellEditor.ts

@@ -1,10 +1,8 @@
+import type { IAutoCompleteComponentParams } from '../../interfaces/iAutoComplete';
 import type { ICellEditorParams } from '../../interfaces/iCellEditor';
 
-export interface ITextCellEditorParams<TData = any, TValue = any, TContext = any> extends ICellEditorParams<
-    TData,
-    TValue,
-    TContext
-> {
+export interface ITextCellEditorParams<TData = any, TValue = any, TContext = any>
+    extends ICellEditorParams<TData, TValue, TContext>, IAutoCompleteComponentParams {
     /** If `true`, the editor will use the provided `colDef.valueFormatter` to format the value displayed in the editor.
      * Used when the cell value needs formatting prior to editing, such as when using reference data and you
      * want to display text rather than code. */

packages/ag-grid-community/src/edit/cellEditors/largeTextCellEditor.ts

@@ -32,14 +32,15 @@ export class LargeTextCellEditor extends AgAbstractCellEditor<ILargeTextEditorPa
 
     public initialiseEditor(params: ILargeTextEditorParams): void {
         const { eEditor } = this;
-        const { cellStartedEdit, eventKey, maxLength, cols, rows } = params;
+        const { browserAutoComplete, cellStartedEdit, eventKey, maxLength, cols, rows } = params;
         this.focusAfterAttached = cellStartedEdit;
 
         // disable initial tooltips added to the input field
         // let the validation handle tooltips.
         eEditor.getInputElement().setAttribute('title', '');
 
         eEditor
+            .setAutoComplete(browserAutoComplete)
             .setMaxLength(maxLength || 200)
             .setCols(cols || 60)
             .setRows(rows || 10);

packages/ag-grid-community/src/edit/cellEditors/numberCellEditor.ts

@@ -33,7 +33,10 @@ class NumberCellEditorInput implements CellEditorInput<number, INumberCellEditor
     public init(eEditor: GridInputNumberField, params: INumberCellEditorParams): void {
         this.eEditor = eEditor;
         this.params = params;
-        const { max, min, precision, step } = params;
+
+        const { browserAutoComplete, max, min, precision, step } = params;
+
+        eEditor.setAutoComplete(browserAutoComplete);
         if (max != null) {
             eEditor.setMax(max);
         }

packages/ag-grid-community/src/edit/cellEditors/textCellEditor.ts

@@ -38,7 +38,11 @@ class TextCellEditorInput<TValue = any> implements CellEditorInput<
     public init(eEditor: GridInputTextField, params: ITextCellEditorParams<any, TValue>): void {
         this.eEditor = eEditor;
         this.params = params;
-        const maxLength = params.maxLength;
+
+        const { maxLength, browserAutoComplete } = params;
+
+        eEditor.setAutoComplete(browserAutoComplete);
+
         if (maxLength != null) {
             eEditor.setMaxLength(maxLength);
         }

packages/ag-grid-community/src/filter/floating/provided/textInputFloatingFilter.ts

@@ -80,7 +80,7 @@ export abstract class TextInputFloatingFilter<
 
         inputSvc.setParams({
             ariaLabel: this.getAriaLabel(column as AgColumn),
-            autoComplete: browserAutoComplete,
+            autoComplete: browserAutoComplete ?? (filterParams as TextFilterParams).browserAutoComplete,
             placeholder,
         });
 

packages/ag-grid-community/src/filter/provided/bigInt/bigIntFilter.ts

@@ -157,6 +157,7 @@ export class BigIntFilter extends SimpleFilter<
                 allowedCharPattern: allowedCharPattern ?? undefined,
                 clearButton: true,
                 searchIcon: true,
+                autoComplete: this.params.browserAutoComplete,
             })
         );
         eValue.addCss(`ag-filter-${fromTo}`);

packages/ag-grid-community/src/filter/provided/date/defaultDateComponent.ts

@@ -91,6 +91,8 @@ export class DefaultDateComponent extends Component implements IDateComp {
     }
 
     private setParams(params: IDateParams): void {
+        // re-applied on refresh so params updates re-pin (or clear) the override
+        this.eDateInput.setAutoComplete(params.filterParams?.browserAutoComplete);
         const inputElement = this.eDateInput.getInputElement();
 
         const shouldUseBrowserDatePicker = this.shouldUseBrowserDatePicker(params);

packages/ag-grid-community/src/filter/provided/iSimpleFilter.ts

@@ -1,3 +1,4 @@
+import type { IAutoCompleteComponentParams } from '../../interfaces/iAutoComplete';
 import type { IFilterParams } from '../../interfaces/iFilter';
 import type { IFloatingFilterParent } from '../floating/floatingFilter';
 import type { IProvidedFilter, IProvidedFilterParams, ProvidedFilterModel } from './iProvidedFilter';
@@ -46,7 +47,7 @@ export type SimpleFilterParams<TData = any> = ISimpleFilterParams & IFilterParam
 /**
  * Common parameters in `colDef.filterParams` used by all simple filters. Extended by the specific filter types.
  */
-export interface ISimpleFilterParams extends IProvidedFilterParams {
+export interface ISimpleFilterParams extends IProvidedFilterParams, IAutoCompleteComponentParams {
     /**
      * Array of filter options to present to the user.
      * A key the filter cannot evaluate is reported when a value is tested against it under the built-in matching.

packages/ag-grid-community/src/filter/provided/number/numberFilter.ts

@@ -155,10 +155,20 @@ export class NumberFilter extends SimpleFilter<
         fromTo: string,
         allowedCharPattern: string | null
     ): GridInputTextField | GridInputNumberField {
+        const { browserAutoComplete } = this.params;
         const eValue = this.createManagedBean<GridInputTextField | GridInputNumberField>(
             allowedCharPattern
-                ? new AgInputTextField({ allowedCharPattern, clearButton: true, searchIcon: true })
-                : new AgInputNumberField({ clearButton: true, searchIcon: true })
+                ? new AgInputTextField({
+                      allowedCharPattern,
+                      clearButton: true,
+                      searchIcon: true,
+                      autoComplete: browserAutoComplete,
+                  })
+                : new AgInputNumberField({
+                      clearButton: true,
+                      searchIcon: true,
+                      autoComplete: browserAutoComplete,
+                  })
         );
         eValue.addCss(`ag-filter-${fromTo}`);
         eValue.addCss('ag-filter-filter');

packages/ag-grid-community/src/filter/provided/simpleFilter.ts

@@ -134,6 +134,12 @@ export abstract class SimpleFilter<
     protected commonUpdateSimpleParams(params: P): void {
         this.setNumConditions(params);
 
+        this.forEachInput((element) => {
+            if (element instanceof AgAbstractInputField) {
+                element.setAutoComplete(params.browserAutoComplete);
+            }
+        });
+
         this.defaultJoinOperator = getDefaultJoinOperator(params.defaultJoinOperator);
         this.filterPlaceholder = params.filterPlaceholder;