office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
1 lines • 1.27 kB
JavaScript
define([], function() { return "import * as React from 'react'; // tslint:disable-line:no-unused-variable\r\nimport './Layer.Example.scss';\r\nimport {\r\n BaseComponent,\r\n Checkbox,\r\n Layer\r\n} from '../../../../index';\r\n\r\nexport class LayerBasicExample extends BaseComponent<any, any> {\r\n\r\n constructor() {\r\n super();\r\n this.state = {\r\n showLayer: false,\r\n time: new Date().toLocaleTimeString()\r\n };\r\n }\r\n\r\n public componentDidMount() {\r\n this._async.setInterval(() => this.setState({ time: new Date().toLocaleTimeString() }), 1000);\r\n }\r\n\r\n public render() {\r\n let { showLayer, time } = this.state;\r\n let content = (\r\n <div className='LayerExample-content ms-u-scaleUpIn100'>\r\n <div className='LayerExample-textContent'>This is example layer content.</div>\r\n <div>{ time }</div>\r\n </div>\r\n );\r\n\r\n return (\r\n <div>\r\n\r\n <Checkbox\r\n label='Wrap the content box belowed in a Layer'\r\n checked={ showLayer }\r\n onChange={ (ev, checked) => this.setState({ showLayer: checked }) } />\r\n\r\n { showLayer ? <Layer>{ content }</Layer> : content }\r\n\r\n </div>\r\n );\r\n }\r\n}\r\n"; });