React Typescript with Event types of Form Handlers

declare-event-types-form-handlers.js

  // With Bootstrap
  const onPageNameChange = (e: React.FormEvent<FormControl & FormControlProps>) => {
    const value = (e.target as HTMLInputElement).value;
    updatePageName(value);
  };

  const onDataSourceChange = (e: React.FormEvent<FormControl & FormControlProps>) => {
    const value = (e.target as HTMLSelectElement).value;
    updateChosenDataSource(value);
  };
  
  //Without Bootstrap
  
  const onPageNameChange = (e: React.FormEvent<HTMLInputElement>) => {
    const value = (e.target as HTMLInputElement).value;
    updatePageName(value);
  };

  const onDataSourceChange = (e: React.FormEvent<HTMLSelectElement>) => {
    const value = (e.target as HTMLSelectElement).value;
    updateChosenDataSource(value);
  };