lucid-ui
Version:
A UI component library from AppNexus.
80 lines • 3.48 kB
JavaScript
import _includes from "lodash/includes";
import _without from "lodash/without";
import _concat from "lodash/concat";
import React from 'react';
import createClass from 'create-react-class';
import { CheckboxLabeled } from '../../../index';
var style = {
marginBottom: '3px'
};
export default createClass({
getInitialState: function getInitialState() {
return {
flavors: []
};
},
handleSelectedChocolate: function handleSelectedChocolate(isSelected) {
this.setState({
flavors: isSelected ? _concat(this.state.flavors, 'chocolate') : _without(this.state.flavors, 'chocolate')
});
},
handleSelectedStrawberry: function handleSelectedStrawberry(isSelected) {
this.setState({
flavors: isSelected ? _concat(this.state.flavors, 'strawberry') : _without(this.state.flavors, 'strawberry')
});
},
handleSelectedVanilla: function handleSelectedVanilla(isSelected) {
this.setState({
flavors: isSelected ? _concat(this.state.flavors, 'vanilla') : _without(this.state.flavors, 'vanilla')
});
},
handleSelectedHipsum: function handleSelectedHipsum(isSelected) {
this.setState({
flavors: isSelected ? _concat(this.state.flavors, 'hipsum') : _without(this.state.flavors, 'hipsum')
});
},
handleSelectedHipsum2: function handleSelectedHipsum2(isSelected) {
this.setState({
flavors: isSelected ? _concat(this.state.flavors, 'hipsum2') : _without(this.state.flavors, 'hipsum2')
});
},
handleSelectedHipsum3: function handleSelectedHipsum3(isSelected) {
this.setState({
flavors: isSelected ? _concat(this.state.flavors, 'hipsum3') : _without(this.state.flavors, 'hipsum3')
});
},
render: function render() {
return /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement("span", {
style: {
display: 'inline-flex',
flexDirection: 'column',
alignItems: 'flex-start'
}
}, /*#__PURE__*/React.createElement(CheckboxLabeled, {
isSelected: _includes(this.state.flavors, 'vanilla'),
name: "interactive-checkboxes",
onSelect: this.handleSelectedVanilla,
style: style
}, /*#__PURE__*/React.createElement(CheckboxLabeled.Label, null, "Vanilla")), /*#__PURE__*/React.createElement(CheckboxLabeled, {
isSelected: _includes(this.state.flavors, 'chocolate'),
name: "interactive-checkboxes",
onSelect: this.handleSelectedChocolate,
style: style
}, /*#__PURE__*/React.createElement(CheckboxLabeled.Label, null, "Chocolate")), /*#__PURE__*/React.createElement(CheckboxLabeled, {
isSelected: _includes(this.state.flavors, 'strawberry'),
name: "interactive-checkboxes",
onSelect: this.handleSelectedStrawberry,
style: style
}, /*#__PURE__*/React.createElement(CheckboxLabeled.Label, null, "Strawberry")), /*#__PURE__*/React.createElement(CheckboxLabeled, {
isSelected: _includes(this.state.flavors, 'hipsum'),
name: "interactive-checkboxes",
onSelect: this.handleSelectedHipsum,
style: style
}, /*#__PURE__*/React.createElement(CheckboxLabeled.Label, null, "Salted Caramel")), /*#__PURE__*/React.createElement(CheckboxLabeled, {
isSelected: _includes(this.state.flavors, 'hipsum2'),
name: "interactive-checkboxes",
onSelect: this.handleSelectedHipsum2,
style: style
}, /*#__PURE__*/React.createElement(CheckboxLabeled.Label, null, "Mint chocolate chip (the best)"))));
}
});