text-field: Input has duplicate properties specified on Props interface

[Thomas Dekiere]

Some code taken from text-field/Input.tsx

export interface InputProps<T extends HTMLElement = HTMLInputElement> {
  className?: string;
  inputType?: 'input' | 'textarea';
  isValid?: boolean;
  foundation?: MDCTextFieldFoundation;
  syncInput?: (inputInstance: Input<T>) => void;
  onBlur?: Pick<React.HTMLProps<T>, 'onBlur'>; // DUPLICATE
  onChange?: Pick<React.HTMLProps<T>, 'onChange'>;  // DUPLICATE
  onFocus?: Pick<React.HTMLProps<T>, 'onFocus'>;  // DUPLICATE
  onMouseDown?: Pick<React.HTMLProps<T>, 'onMouseDown'>;  // DUPLICATE
  onTouchStart?: Pick<React.HTMLProps<T>, 'onTouchStart'>;  // DUPLICATE
  setDisabled?: (disabled: boolean) => void;
  setInputId?: (id: string | number) => void;
  handleFocusChange?: (isFocused: boolean) => void;
}

type InputElementProps = Exclude<React.HTMLProps<HTMLInputElement>, 'ref'>;
type TextareaElementProps = Exclude<
  React.HTMLProps<HTMLTextAreaElement>,
  'ref'
>;
type Props<T extends HTMLElement = HTMLInputElement> = InputProps<T> &
  (T extends HTMLInputElement ? InputElementProps : TextareaElementProps);

export default class Input<
  T extends HTMLElement = HTMLInputElement
> extends React.Component<Props<T>, InputState> {
....
}

So the Input component has Props as type for its props.
Let 's say T = HTMLInputElement.

This means type Props = InputProps<HTMLInputElement> & InputElementProps;

Both InputProps<HTMLInputElement> and InputElementProps specify onBlur, onChange, onFocus, onMouseDown, and onTouchStart.

My suggestion is to remove these from InputProps

Do you agree?

[Sovan Jana]

getting TypeScript error: Type '(e: any) => void' has no properties in common with type 'Pick<HTMLProps<HTMLInputElement>, "onChange">'. error for the same reason.
Please remove html events from InputProps.