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