JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/react@latest/dist/react-with-addons.js"></script>
<script src="https://unpkg.com/react-dom@latest/dist/react-dom.js"></script>
<h2>React</h2>
<div id="container"></div>

<h2>DOM Native</h2>
<div>
  <h3>Selected disabled option</h3>
  <select>
    <option selected disabled> -- Select Eisenhower --</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
    <option>0</option>
    <option>Eisenhower</option>
  </select>
  <h3>
Unselected disabled option (should skip to 1)
</h3>
  <h3>Selected disabled option</h3>
  <select>
    <option disabled> -- Select Eisenhower --</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
    <option>0</option>
    <option>Eisenhower</option>
  </select>
</div>

Babel + JSX

class App extends React.Component {
  render() {
    var options = [1,2,3,4,5,6,7,8,9,"Eisenhower"].map(function(X) {
      return <option key={X} value={X}>{X}</option>;
    });

    options.unshift(
      <option key="other" disabled> -- Select Eisenhower -- </option>
    );

    return (
      <div>
        <h3>Selected disabled option</h3>
        <select defaultValue=" -- Select Eisenhower -- ">{options}</select>;
        <h3>Unselected disabled option (should skip to 1)</h3>
        <select defaultValue="">{options}</select>;
      </div>
    )
  }
}

ReactDOM.render(<App />, document.getElementById('container'));