lucid-ui
Version:
A UI component library from AppNexus.
33 lines (32 loc) • 1.2 kB
JavaScript
import React from 'react';
import createClass from 'create-react-class';
import { SingleSelect } from '../../../index';
const { Placeholder, Option } = SingleSelect;
export default createClass({
getInitialState() {
return {
selectedIndex: null,
};
},
handleSelect(optionIndex) {
this.setState({
selectedIndex: optionIndex,
});
},
render() {
return (React.createElement("section", null,
React.createElement(SingleSelect, { isInvisible: true, onSelect: this.handleSelect },
React.createElement(Placeholder, null, "Select Color"),
React.createElement(Option, null, "Red"),
React.createElement(Option, null, "Green"),
React.createElement(Option, null, "Blue")),
React.createElement("section", { style: { marginTop: '10px' } },
"Selected Index: ",
JSON.stringify(this.state.selectedIndex))));
},
});
// begin-hide-from-docs
export const notes = `
This removes the dropdown border. The lack of a border gives the dropdown a lighter visual weight within a data-intense layout.
`;
// end-hide-from-docs