title: typescript map object return type
body: <p>I run into some behavior that seems a bit weird to me. </p>
  
  <p>In the following example, I have two functions that take an object as an input and return an object with the same keys but different values. When using <code>useForm1</code> I get the expected result. I can access the property keys of the input object and it also has the correct value (<code>Field</code>). </p>
  
  <p>However when using <code>useForm2</code>, (which uses <code>Form&lt;T&gt;</code> instead of the inlined <code>{ [P in keyof T]: Field }</code> and at first look seems to actually be the same), I also get an object that has the keys of the input object, unfortunately, the values are not of type <code>Field</code> but rather  plain object (aka <code>{}</code> without any properties.).</p>
  
  <p>Can anybody please explain why those two methods produce different results and how I could adjust the definitions for <code>useForm2</code>?</p>
  
  <pre><code>type FormConfig&lt;T&gt; = {
    [P in keyof T]: {
      required?: boolean;
      validator?: (input: string) =&gt; void | Promise&lt;void&gt;;
      type: string;
    }
  };
  
  type Field = {
    required?: boolean;
    name: string;
    type: string;
    value: string;
  };
  
  type Form&lt;T&gt; = { [P in keyof T]: Field };
  
  export const useForm1 = &lt;T extends Object&gt;(
    config: FormConfig&lt;T&gt;
  ): { [P in keyof T]: Field } =&gt; {
    // do some logic
  };
  
  export const useForm2 = &lt;T extends Object&gt;(config: FormConfig&lt;T&gt;): Form&lt;T&gt; =&gt; {
    // do some logic
  };
  
  const test1 = useForm1({
    login: {
      type: "text"
    }
  });
  
  const test2 = useForm2({
    login: {
      type: "text"
    }
  });
  </code></pre>