office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
1 lines • 2.06 kB
JavaScript
module.exports = "import * as React from 'react';\nimport {\n Dialog,\n DialogType,\n DialogFooter,\n Button,\n ButtonType,\n ChoiceGroup\n} from '../../../../index';\nimport './Dialog.Basic.Example.scss';\n\nexport class DialogBasicExample extends React.Component<any, any> {\n\n constructor() {\n super();\n this.state = {\n showDialog: false\n };\n }\n\n public render() {\n return (\n <div>\n <Button description='Opens the Sample Dialog' onClick={ this._showDialog.bind(this) }>Open Dialog</Button>\n <Dialog\n isOpen={ this.state.showDialog }\n type={ DialogType.normal }\n onDismiss={ this._closeDialog.bind(this) }\n title='All emails together'\n subText='Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'\n isBlocking={ false }\n containerClassName='ms-dialogMainOverride'\n >\n <ChoiceGroup\n options={ [\n {\n key: 'A',\n text: 'Option A'\n },\n {\n key: 'B',\n text: 'Option B',\n isChecked: true\n },\n {\n key: 'C',\n text: 'Option C',\n isDisabled: true\n }\n ] }\n onChanged={ this._onChoiceChanged }\n />\n { null /** You can also include null values as the result of conditionals */ }\n <DialogFooter>\n <Button buttonType={ ButtonType.primary } onClick={this._closeDialog.bind(this)}>Save</Button>\n <Button onClick={this._closeDialog.bind(this)}>Cancel</Button>\n </DialogFooter>\n </Dialog>\n </div>\n );\n }\n\n private _showDialog() {\n this.setState( {showDialog: true } );\n }\n\n private _closeDialog() {\n this.setState( {showDialog: false } );\n }\n\n private _onChoiceChanged() {\n console.log( 'Choice option change' );\n }\n}\n";