title: Typescript overload/edit given types by 3rd library component in React.js
body: <p>typescript beginner here.</p>
  
  <p>I am trying to convert my existing react project to use typescript.
  Now I changed my file to tsx, and got bunch of errors most I could fix.
  But I am stuck with 1 type I cannot find answers to online, To overload 3rd library types with my own.</p>
  
  <p>For example, I am using ant design for my components which brings its own types inside:</p>
  
  <pre><code>import React from 'react';
  import { Select, Form } from 'antd';
  import { AdvancedSelectPROPS, selectOptionItem } from '../types';
  const FormItem = Form.Item;
  const Option = Select.Option;
  
  const SelectElement = React.memo(function InputElement(props: AdvancedSelectPROPS) {
      const { status, hasfeed, error, label, formItemStyle, disabled, forwhom, value, options = [], ...otherProps } = props;
  
      return (
          &lt;FormItem
              validateStatus={disabled ? (status === 'error' ? 'error' : 'warning') : status === 'error' ? 'error' : ''}
              className="addLabel"
              hasFeedback={hasfeed === 'true'}
              help={status === 'error' ? error : ''}
              style={formItemStyle}
              label={label}
          &gt;
              &lt;Select {...otherProps} disabled={disabled} value={!value ? [] : value} forwhom={forwhom}&gt; 
                // I have added new prop "forwhom" which is not provided by the types of ant design
                  {options.map((item: selectOptionItem, index) =&gt; {
                      return (
                          &lt;Option value={item.value} key={item.name + index}&gt;
                              {item.name || item.Name}
                          &lt;/Option&gt;
                      );
                  })}
              &lt;/Select&gt;
          &lt;/FormItem&gt;
      );
  });
  
  export default SelectElement;
  </code></pre>
  
  <p>I have added new prop "forwhom" which is not provided by the types of ant design.
  Now I would like to add new props and their types to the built in types, how is something like that is done?</p>
  
  <p>I tried</p>
  
  <pre><code>declare namespace JSX {
    interface Select {
          forwhom: string | number
      }
  }
  </code></pre>
  
  <p>or</p>
  
  <pre><code>declare namespace JSX {
      interface IntrinsicAttributes {
          forwhom: string | number
      }
      interface IntrinsicClassAttributes {
          forwhom: string | number
      }
  }
  </code></pre>
  
  <p>But it didnt work.</p>
  
  <p>Error:</p>
  
  <pre><code>Property 'forwhom' does not exist on type 'IntrinsicAttributes &amp; IntrinsicClassAttributes&lt;Select&lt;any&gt;&gt; &amp; Pick&lt;Pick&lt;Readonly&lt;SelectProps&lt;any&gt;&gt; &amp; Readonly&lt;{ children?: ReactNode; }&gt;, "disabled" | "style" | "prefixCls" | ... 50 more ... | "loading"&gt; &amp; Pick&lt;...&gt; &amp; Pick&lt;...&gt;, "disabled" | ... 51 more ... | "loading"&gt; &amp; Partial&lt;...&gt; &amp; Partial&lt;...&gt;
  </code></pre>
  
  <p>Thanks for your help.</p>