title: How to create fully controlled dropdown in semantic-ui-react
body: <p>I want to create a fully controlled dropdown in order to use <a href="https://github.com/bvaughn/react-window" rel="nofollow noreferrer">react-window</a> to show really long list of items in it.</p>
  
  <p>I've checked docs, and there is no any example of controlled dropdown with <code>Dropdown.Item</code> specified.</p>
  
  <p>This is how my component looks like:</p>
  
  <pre><code>&lt;Dropdown
    placeholder="Filter Posts"
    clearable={true}
    search={true}
    onChange={this.handleChange}
    text={tagOptions[1].value}
    value={tagOptions[1].value}
    onSearchChange={this.handleChange}
  &gt;
    &lt;Dropdown.Menu&gt;
      {tagOptions.map(option =&gt; (
        &lt;Dropdown.Item key={option.value} {...option} onClick={this.handleItemClick} /&gt;
      ))}
    &lt;/Dropdown.Menu&gt;
  &lt;/Dropdown&gt;;
  </code></pre>
  
  <p>I've encounter with 2 issues:</p>
  
  <ol>
  <li>Initial value is not appears, I dig into the code, and saw that if i don't pass <code>options</code> property it won't find the given value, therefore, it will not be shown. I can use the <code>text</code> property, but it seems like a hack.</li>
  <li>I need to implement <code>handleItemClick</code> by myself, and I see that there is logic in the <a href="https://github.com/Semantic-Org/Semantic-UI-React/blob/master/src/modules/Dropdown/Dropdown.js#L675-L710" rel="nofollow noreferrer">original handleItemClick</a>.</li>
  </ol>
  
  <p>Any suggestions? did I missed something here?</p>