UNPKG

lucid-ui

Version:

A UI component library from AppNexus.

45 lines 2.07 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.notes = void 0; var react_1 = __importDefault(require("react")); var create_react_class_1 = __importDefault(require("create-react-class")); var index_1 = require("../../../index"); var Placeholder = index_1.SingleSelect.Placeholder, Option = index_1.SingleSelect.Option; exports.default = create_react_class_1.default({ getInitialState: function () { return { selectedIndex: null, selectedOptionName: null, }; }, handleSelect: function (optionIndex, _a) { var name = _a.props.name; this.setState({ selectedIndex: optionIndex, selectedOptionName: name, }); }, render: function () { return (react_1.default.createElement("section", null, react_1.default.createElement(index_1.SingleSelect, { onSelect: this.handleSelect }, react_1.default.createElement(Placeholder, null, "Select Color"), react_1.default.createElement(Option, { name: 'red' }, "Red"), react_1.default.createElement(Option, { name: 'green' }, "Green"), react_1.default.createElement(Option, { name: 'blue' }, "Blue")), react_1.default.createElement("section", null, react_1.default.createElement("p", null, "Selected Index: ", JSON.stringify(this.state.selectedIndex)), react_1.default.createElement("p", null, "Selected Option Name:", ' ', JSON.stringify(this.state.selectedOptionName))))); }, }); // begin-hide-from-docs exports.notes = "\nUse this when you need to display different values within the dropdown and elsewhere on the screen after the user makes a selection.\n"; // end-hide-from-docs //# sourceMappingURL=02.named-options.js.map