title: External component with consts interfaces in react
body: <p>Hay, 
  I want to create reuseable compoenent in React like for example DialogBox.</p>
  
  <p>It has required fields like type, message and title.</p>
  
  <p>Type can be one of 'yesNo' string or 'ok' and it defines how much buttons should be shown (yes &amp; no, ok).
  Message and title are simple text that are displayed inside of dialog box.</p>
  
  <p>Simple view of this: 
  <a href="https://i.stack.imgur.com/xdyIG.png" rel="nofollow noreferrer">IMG</a></p>
  
  <p>And I created DialogBox component that I can use like:</p>
  
  <pre><code>&lt;DialogBox type={'yesNo'} message={'Message'} title={'Title'} /&gt;
  </code></pre>
  
  <p>But I want to use predefined const like that: </p>
  
  <pre><code>&lt;DialogBox type={DialogBox.TYPE.YES_NO} message={'Message'} title={'Title'} /&gt;
  </code></pre>
  
  <p>With simple one import DialogBox:</p>
  
  <pre><code>import Dialogbox from './DialogBox.js'
  </code></pre>
  
  <p>To achieve <code>DialogBox.TYPE.YES_NO</code></p>
  
  <p>In my component DialogBox I created static object TYPE with predefined elements:</p>
  
  <pre><code>...
  static TYPE = {
     YES_NO: 'yesNo',
     OK: 'ok'
  }
  ...
  </code></pre>
  
  <p>And everything was beautiful to the time when I wanted to use that statics to check props in child component: </p>
  
  <pre><code>ButtonArea.propTypes = {
      type: PropTypes.oneOf(Object.values(DialogBox.TYPE))
  };
  </code></pre>
  
  <p>And I got a circular dependencies error and my DialogBox.TYPE inside of props definition is undefined. That is how I can see it:</p>
  
  <p>In DailogBox.js :</p>
  
  <pre><code>import ButtonArea from './BA';
  
  export default class DialogBox extends Component {
   static TYPE = {
    YES_NO: 'yesNo',
    OK: 'ok'
   }
  
   render() {
    &lt;ButtonArea type={this.props.type} /&gt;
   }
  
  }
  </code></pre>
  
  <p>In ButtonArea.js:</p>
  
  <pre><code>import DialogBox from './DB';
  
  export default class ButtonArea extends Component {...}
  
  ButtonArea.propTypes = {
      type: PropTypes.oneOf(Object.values(DialogBox.TYPE))
  };
  </code></pre>
  
  <p>And on checking propTypes DialogBox is an undefined cause of circular dependencies.</p>
  
  <p>The question is.
  Is there a way to create component to use it like component and which has inside const object definitions and avoid circular dependencies. Like :</p>
  
  <pre><code>&lt;Test type={Test.TYPE.SUPER_TEST}/&gt;
  </code></pre>
  
  <p>I <strong>don't</strong> want to import Test and TestConst and use it like that: </p>
  
  <pre><code>&lt;Test type={TestConst.TYPE.SUPER_TEST}/&gt;
  </code></pre>