[Autocomplete] Add maxOptions: null to autocomplete with remote data

src/Autocomplete/assets/dist/controller.d.ts

@@ -12,6 +12,7 @@ declare class export_default extends Controller {
     #private;
     static values: {
         url: StringConstructor;
+        maxOptions: NumberConstructor;
         optionsAsHtml: BooleanConstructor;
         loadingMoreText: StringConstructor;
         noResultsFoundText: StringConstructor;
@@ -22,6 +23,7 @@ declare class export_default extends Controller {
         preload: StringConstructor;
     };
     readonly urlValue: string;
+    readonly maxOptionsValue: number;
     readonly optionsAsHtmlValue: boolean;
     readonly loadingMoreTextValue: string;
     readonly noMoreResultsTextValue: string;

src/Autocomplete/assets/dist/controller.js

@@ -87,8 +87,14 @@ var controller_default = class extends Controller {
   urlValueChanged() {
     this.resetTomSelect();
   }
-  getMaxOptions() {
-    return this.selectElement ? this.selectElement.options.length : 50;
+  getMaxOptions(hasRemoteData = false) {
+    if (this.maxOptionsValue) {
+      return this.maxOptionsValue;
+    }
+    if (!hasRemoteData && this.selectElement) {
+      return this.selectElement.options.length;
+    }
+    return 50;
   }
   /**
    * Returns the element, but only if it's a select element.
@@ -342,6 +348,7 @@ createAutocompleteWithRemoteData_fn = function(autocompleteEndpointUrl, minChara
       }
       return query.length >= 3;
     },
+    maxOptions: this.getMaxOptions(true),
     optgroupField: "group_by",
     // avoid extra filtering after results are returned
     score: (search) => (item) => 1,
@@ -398,6 +405,7 @@ createTomSelect_fn = function(options) {
 };
 controller_default.values = {
   url: String,
+  maxOptions: Number,
   optionsAsHtml: Boolean,
   loadingMoreText: String,
   noResultsFoundText: String,

src/Autocomplete/assets/src/controller.ts

@@ -25,6 +25,7 @@ interface OptionDataStructure {
 export default class extends Controller {
     static values = {
         url: String,
+        maxOptions: Number,
         optionsAsHtml: Boolean,
         loadingMoreText: String,
         noResultsFoundText: String,
@@ -36,6 +37,7 @@ export default class extends Controller {
     };
 
     declare readonly urlValue: string;
+    declare readonly maxOptionsValue: number;
     declare readonly optionsAsHtmlValue: boolean;
     declare readonly loadingMoreTextValue: string;
     declare readonly noMoreResultsTextValue: string;
@@ -292,6 +294,7 @@ export default class extends Controller {
 
                 return query.length >= 3;
             },
+            maxOptions: this.getMaxOptions(true),
             optgroupField: 'group_by',
             // avoid extra filtering after results are returned
             score: (search: string) => (item: any) => 1,
@@ -317,8 +320,16 @@ export default class extends Controller {
         return this.#createTomSelect(config);
     }
 
-    private getMaxOptions(): number {
-        return this.selectElement ? this.selectElement.options.length : 50;
+    private getMaxOptions(hasRemoteData: boolean = false): number {
+        if (this.maxOptionsValue) {
+            return this.maxOptionsValue;
+        }
+
+        if (!hasRemoteData && this.selectElement) {
+            return this.selectElement.options.length;
+        }
+
+        return 50;
     }
 
     #stripTags(string: string): string {

src/Autocomplete/doc/index.rst

@@ -216,6 +216,9 @@ e.g. ``FoodAutocompleteField`` from above):
     an autocomplete-Ajax endpoint (e.g. for a custom ``ChoiceType``), then set this
     to change the field into an AJAX-powered select.
 
+``autocomplete_max_options`` (default: ``50``)
+    Limits the maximum number of results displayed in the autocomplete dropdown at once.
+
 ``loading_more_text`` (default: 'Loading more results...')
     Rendered at the bottom of the list while fetching more results. This message is
     automatically translated using the ``AutocompleteBundle`` domain.

src/Autocomplete/src/Form/AutocompleteChoiceTypeExtension.php

@@ -64,6 +64,10 @@ public function finishView(FormView $view, FormInterface $form, array $options):
             $values['url'] = $form->getConfig()->getAttribute('autocomplete_url');
         }
 
+        if ($options['autocomplete_max_options']) {
+            $values['max-options'] = $options['autocomplete_max_options'];
+        }
+
         if ($options['options_as_html']) {
             $values['options-as-html'] = '';
         }
@@ -142,6 +146,7 @@ public function configureOptions(OptionsResolver $resolver): void
         $resolver->setDefaults([
             'autocomplete' => false,
             'autocomplete_url' => null,
+            'autocomplete_max_options' => 50,
             'tom_select_options' => [],
             'options_as_html' => false,
             'allow_options_create' => false,