feat: add debounce interval property to combobox

Author: yordan-st

packages/pluggableWidgets/combobox-web/src/Combobox.xml

@@ -337,6 +337,11 @@
                     <actionVariable key="filterInput" caption="Filter Input" type="String" />
                 </actionVariables>
             </property>
+
+            <property key="debounceInterval" type="integer" required="true" defaultValue="200">
+                <caption>Debounce interval</caption>
+                <description>The debounce interval in milliseconds.</description>
+            </property>
         </propertyGroup>
         <propertyGroup caption="Accessibility">
             <propertyGroup caption="Accessibility">

packages/pluggableWidgets/combobox-web/src/hooks/useGetSelector.ts

@@ -25,7 +25,7 @@ export function useGetSelector(props: ComboboxContainerProps): Selector {
         () =>
             debounce((filterValue?: string) => {
                 onInputValueChange(props.onChangeFilterInputEvent, filterValue);
-            }, 200),
+            }, props.debounceInterval ?? 200),
         [props.onChangeFilterInputEvent]
     );
 

packages/pluggableWidgets/combobox-web/typings/ComboboxProps.d.ts

@@ -90,6 +90,7 @@ export interface ComboboxContainerProps {
     onEnterEvent?: ActionValue;
     onLeaveEvent?: ActionValue;
     onChangeFilterInputEvent?: ActionValue<{ filterInput: Option<string> }>;
+    debounceInterval: number;
     ariaRequired: DynamicValue<boolean>;
     ariaLabel?: DynamicValue<string>;
     clearButtonAriaLabel?: DynamicValue<string>;
@@ -147,6 +148,7 @@ export interface ComboboxPreviewProps {
     onEnterEvent: {} | null;
     onLeaveEvent: {} | null;
     onChangeFilterInputEvent: {} | null;
+    debounceInterval: number | null;
     ariaRequired: string;
     ariaLabel: string;
     clearButtonAriaLabel: string;