How to extend my type while I'm extending other type already?

Question

export type InputProps<T extends FieldValues> = {
  control: Control<T, Record<string, unknown>>;
  name: Path<T>;
  placeholder?: string;
  label?: string;
  id?: string;
  type: 'text' | 'email' | 'number' | 'password';
  rules?: RegisterOptions;
};

I declared properties like: name, label, id, placeholder by myself. I would inherit those properties from HTML input element but I don't know how I can achieve that while I'm already extending one generic type.

I've tried to use "typeof" and "&"

Answer 1

I found solution. On my component where i'm using code from question i used '&' to extend my type.

export const FormInput = <T extends FieldValues>({
  control,
  name,
  placeholder,
  label,
  id,
  type,
  rules,
}: InputProps<T> & TextFieldProps) => {