<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<script src="https://npmcdn.com/classnames/index.js"></script>
<script src="https://npmcdn.com/react-input-autosize/dist/react-input-autosize.js"></script>
<script src="https://npmcdn.com/react-select-plus/dist/react-select-plus.js"></script>
<link rel="stylesheet" href="https://npmcdn.com/react-select-plus/dist/react-select-plus.css">
<link rel="stylesheet" href="styles.css">
</head>
<body>
Your example code will be loaded below:
<div id="example"></div>
<script src="script.js"></script>
</body>
</html>
// Customize the below code to show your bug :)
var options = [
{
value: 'one',
label: 'One'
},
{
label: 'Group 1',
options: [
{ label: 'Option 1', value: '1' },
{ label: 'Option 2', value: '2' },
{ label: 'Option 3', value: '3' },
{ label: 'Option 4', value: '4' },
{ label: 'Option 5', value: '5' },
{ label: 'Option 6', value: '6' },
{ label: 'Option 7', value: '7' },
{ label: 'Option 8', value: '8' },
],
}
];
function logChange(val) {
console.log("Selected:", val);
}
ReactDOM.render(
<Select
name="form-field-name"
value="8"
options={options}
onChange={logChange}
/>,
document.getElementById('example')
);