lucid-ui
Version:
A UI component library from AppNexus.
24 lines (23 loc) • 1.29 kB
JavaScript
import _ from 'lodash';
import React from 'react';
import createClass from 'create-react-class';
import { Button, Dialog } from '../../../index';
export default createClass({
getInitialState() {
return {
isShown: false,
};
},
handleShow(isShown) {
this.setState({ isShown });
},
render() {
return (React.createElement("div", null,
React.createElement(Button, { onClick: _.partial(this.handleShow, !this.state.isShown) }, "Toggle"),
React.createElement(Dialog, { isModal: false, isShown: this.state.isShown, handleClose: _.partial(this.handleShow, !this.state.isShown), onBackgroundClick: _.partial(this.handleShow, false), onEscape: _.partial(this.handleShow, false), Header: 'Header', size: 'small' },
"In most cases, you'll probably just use an isModal Dialog, but this example shows that the Dialog doesn't have to be a modal. Try pressing \"escape\" to close this Dialog.",
React.createElement(Dialog.Footer, null,
React.createElement(Button, { kind: 'invisible', onClick: _.partial(this.handleShow, false), style: { marginRight: '9px' } }, "Cancel"),
React.createElement(Button, { kind: 'primary' }, "Save")))));
},
});