title: How do you use React-bootstrap with Typescript?
body: <p>I have started using Typescript in my project next to React-Bootstrap and the following piece of code:</p>
  
  <pre><code> const renderSearchAddressButton = (): JSX.Element =&gt; {
      return (
        &lt;div className="search-address-button"&gt;
          &lt;Button variant="myownvariant" onClick={onClickSearchAddressButton}&gt;
            {t('search-address-button')}
          &lt;/Button&gt;
        &lt;/div&gt;
      );
    };
  </code></pre>
  
  <p>Gives me a Lint error because myownvariant is not a correct variant. The code works but the only variant types allowed are the following:</p>
  
  <pre><code>variant?:
      | 'primary'
      | 'secondary'
      | 'success'
      | 'danger'
      | 'warning'
      | 'info'
      | 'dark'
      | 'light'
      | 'link'
      | 'outline-primary'
      | 'outline-secondary'
      | 'outline-success'
      | 'outline-danger'
      | 'outline-warning'
      | 'outline-info'
      | 'outline-dark'
      | 'outline-light';
  </code></pre>
  
  <p>Those types are coming from @types/react-bootstrap, but they do not seem aligned to the official react-bootstrap as they do not leave any room for your own variant.</p>
  
  <p>Therefore, the question is, how can I get rid of that error? Is there another package with better types? I thought about modifying the types myself but every time I update my libraries I guess it will get overwritten.</p>
  
  <p>Thank you in advance and regards.</p>