2017-10-11 17:56:24 +03:00
|
|
|
```jsx
|
2017-10-31 12:03:44 +02:00
|
|
|
const React = require('react');
|
|
|
|
const { default: Select } = require('./select');
|
|
|
|
|
2017-05-18 21:21:33 +03:00
|
|
|
<Select>
|
2017-10-12 21:15:51 +03:00
|
|
|
<option selected disabled>
|
|
|
|
Select a datacenter
|
|
|
|
</option>
|
2017-05-18 21:21:33 +03:00
|
|
|
<option>Amsterdam, EU</option>
|
|
|
|
<option>San Francisco, USA</option>
|
|
|
|
<option>Seoul, South Korea</option>
|
|
|
|
<option>Tokyo, Japan</option>
|
2017-10-12 21:15:51 +03:00
|
|
|
</Select>;
|
2017-05-18 21:21:33 +03:00
|
|
|
```
|
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
#### Select > Disabled
|
2017-05-18 21:21:33 +03:00
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
```jsx
|
2017-10-31 12:03:44 +02:00
|
|
|
const React = require('react');
|
|
|
|
const { default: FormGroup } = require('./group');
|
|
|
|
const { default: Label } = require('./label');
|
|
|
|
const { default: Select } = require('./select');
|
2017-05-18 21:21:33 +03:00
|
|
|
|
|
|
|
<FormGroup>
|
2017-10-11 17:56:24 +03:00
|
|
|
<Label disabled>Your location</Label>
|
2017-05-18 21:21:33 +03:00
|
|
|
<Select disabled>
|
2017-10-12 21:15:51 +03:00
|
|
|
<option selected disabled>
|
|
|
|
Select Location
|
|
|
|
</option>
|
|
|
|
<option value="1">Amsterdam, EU</option>
|
2017-05-18 21:21:33 +03:00
|
|
|
<option>San Francisco, USA</option>
|
|
|
|
<option>Seoul, South Korea</option>
|
|
|
|
<option>Tokyo, Japan</option>
|
|
|
|
</Select>
|
2017-10-12 21:15:51 +03:00
|
|
|
</FormGroup>;
|
2017-05-18 21:21:33 +03:00
|
|
|
```
|
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
#### Select > Warning
|
2017-05-18 21:21:33 +03:00
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
```jsx
|
2017-10-31 12:03:44 +02:00
|
|
|
const React = require('react');
|
|
|
|
const { default: FormMeta } = require('./meta');
|
|
|
|
const { default: FormGroup } = require('./group');
|
|
|
|
const { default: Label } = require('./label');
|
|
|
|
const { default: Select } = require('./select');
|
2017-05-18 21:21:33 +03:00
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
<FormGroup>
|
|
|
|
<Label>Your location</Label>
|
|
|
|
<Select>
|
|
|
|
<option>Amsterdam, EU</option>
|
|
|
|
<option>San Francisco, USA</option>
|
|
|
|
<option>Seoul, South Korea</option>
|
|
|
|
<option>Tokyo, Japan</option>
|
|
|
|
</Select>
|
2017-10-12 21:15:51 +03:00
|
|
|
<FormMeta warning>Unexpected children warning!</FormMeta>
|
|
|
|
</FormGroup>;
|
2017-05-18 21:21:33 +03:00
|
|
|
```
|
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
#### Select > Error
|
2017-05-18 21:21:33 +03:00
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
```jsx
|
2017-10-31 12:03:44 +02:00
|
|
|
const React = require('react');
|
|
|
|
const { default: FormMeta } = require('./meta');
|
|
|
|
const { default: FormGroup } = require('./group');
|
|
|
|
const { default: Label } = require('./label');
|
|
|
|
const { default: Select } = require('./select');
|
2017-05-18 21:21:33 +03:00
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
<FormGroup>
|
|
|
|
<Label>Your location</Label>
|
|
|
|
<Select>
|
|
|
|
<option>Amsterdam, EU</option>
|
|
|
|
<option>San Francisco, USA</option>
|
|
|
|
<option>Seoul, South Korea</option>
|
|
|
|
<option>Tokyo, Japan</option>
|
|
|
|
</Select>
|
2017-10-12 21:15:51 +03:00
|
|
|
<FormMeta error>Unexpected children error!</FormMeta>
|
|
|
|
</FormGroup>;
|
2017-05-18 21:21:33 +03:00
|
|
|
```
|
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
#### Select > Success
|
2017-05-18 21:21:33 +03:00
|
|
|
|
2017-10-11 17:56:24 +03:00
|
|
|
```jsx
|
2017-10-31 12:03:44 +02:00
|
|
|
const React = require('react');
|
|
|
|
const { default: FormMeta } = require('./meta');
|
|
|
|
const { default: FormGroup } = require('./group');
|
|
|
|
const { default: Label } = require('./label');
|
|
|
|
const { default: Select } = require('./select');
|
2017-05-18 21:21:33 +03:00
|
|
|
|
|
|
|
<FormGroup>
|
|
|
|
<Label>Your location</Label>
|
|
|
|
<Select>
|
|
|
|
<option>Amsterdam, EU</option>
|
|
|
|
<option>San Francisco, USA</option>
|
|
|
|
<option>Seoul, South Korea</option>
|
|
|
|
<option>Tokyo, Japan</option>
|
|
|
|
</Select>
|
2017-10-12 21:15:51 +03:00
|
|
|
<FormMeta success>Unexpected children success!</FormMeta>
|
|
|
|
</FormGroup>;
|
|
|
|
```
|