fix(combobox): let Downshift handle all props to fix out of sync even…

…ts (#1725)

* fix(combobox): let Downshift handle all props to fix out of sync events

* chore(combobox): comment about spreading and events

* chore: changeset

.changeset/tall-phones-rescue.md

@@ -0,0 +1,6 @@
+---
+'@twilio-paste/combobox': patch
+'@twilio-paste/core': patch
+---
+
+Allow Downshift to handle input events past by the component consumer. This allows for event data and internal state of the combobox to stay in sync correctly

packages/paste-core/components/combobox/src/Combobox.tsx

@@ -151,11 +151,11 @@ const Combobox = React.forwardRef<HTMLInputElement, ComboboxProps>(
           <ComboboxInputWrapper {...getComboboxProps({role: 'combobox'})}>
             <ComboboxInputSelect
               {...getToggleButtonProps({tabIndex: 0})}
-              {...getInputProps({disabled, required, ref})}
+              // we spread props into `getInputProps` so that Downshift handles events correctly
+              {...getInputProps({disabled, required, ref, ...props})}
               {...(!autocomplete ? {onChange: (event: React.ChangeEvent) => event.preventDefault()} : undefined)}
               autocomplete={autocomplete}
               aria-describedby={helpTextId}
-              {...props}
               type="text"
             />
             {!autocomplete && (

packages/paste-core/components/combobox/src/types.ts

@@ -54,6 +54,18 @@ export interface ComboboxProps extends Omit<InputProps, 'id' | 'type' | 'value'>
   groupItemsBy?: string;
   variant?: InputVariants;
   state?: Partial<UseComboboxPrimitiveReturnValue<any>>;
+  /**
+   * Use `onInputValueChange` instead.
+   * @type {never}
+   * @memberof ComboboxProps
+   */
+  onChange?: never;
+  /**
+   * Use `onInputValueChange` instead.
+   * @type {never}
+   * @memberof ComboboxProps
+   */
+  onInput?: never;
 }
 
 export interface ComboboxItemsProps