Setting value on a Select element triggers a React warning

[nerfologist]

Issue summary

When creating a Select component, as soon as you specify a value property, the following warning is displayed in the console:

import React from 'react';
import ReactDOM from 'react-dom';
import { Select } from '@shopify/polaris';

const MyComp = () => <Select value=1 options={[1, 2]} />

ReactDOM.render(<MyComp/>, document.getElementById('root'));

Warning: Select elements must be either controlled or uncontrolled (specify
either the value prop, or the defaultValue prop, but not both). Decide between
using a controlled or uncontrolled select element and remove one of these props.
More info: https://fb.me/react-controlled-components

This happens because in the current implementation of <Select /> the defaultValue is always specified and set to '__placeholder__'.

Expected behavior

defaultValue is not set on the <select /> at the same time as value. No warning is raised by React.

Actual behavior

A warning is raised.

Steps to Reproduce the Problem

1. Render a <Select /> component
2. Add a value property
3. See the warning appear in the console

Specifications

• Polaris version: 1.1.1
• React version: 15.6.1
• Browser: Version 59.0.3071.115 (Official Build) (64-bit)
• Device: MacBook Pro (Retina, 15-inch, Late 2013)
• Operating System: macOS Sierra version 10.12.5 (16F73)

NOTE: This repo is only used for reporting issues and new feature requests. We are not accepting pull requests at this point in time.

[nerfologist]

This is the same issue as #98, sorry for the duplicate issue (it was closed), but I believe this still needs fixing.

[lemonmade]

Thanks for the issue, @nerfologist. I'm going to reopen the other issue since it has a few more comments/ context.