office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
47 lines • 3.05 kB
JavaScript
import * as React from 'react';
import { DialogBasicExample } from './examples/Dialog.Basic.Example';
import { DialogLargeHeaderExample } from './examples/Dialog.LargeHeader.Example';
import { DialogBlockingExample } from './examples/Dialog.Blocking.Example';
import { DialogStatus } from './Dialog.checklist';
var DialogBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx');
var DialogLargeHeaderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx');
var DialogBlockingExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx');
var DialogBlockingExampleCodepen = require('!raw-loader!office-ui-fabric-react/lib/codepen/components/Dialog/Dialog.Blocking.Example.Codepen.txt');
export var DialogPageProps = {
title: 'Dialog',
componentName: 'Dialog',
componentUrl: 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react/src/components/Dialog',
componentStatus: DialogStatus,
examples: [
{
title: 'Default Dialog',
code: DialogBasicExampleCode,
view: React.createElement(DialogBasicExample, null)
},
{
title: 'Dialog with large header and ChoiceGroup',
code: DialogLargeHeaderExampleCode,
view: (React.createElement(React.Fragment, null,
React.createElement("p", null, "Use this Dialog sparingly, when calling extra attention to the content. It can be used in situations where you want to teach the user something or notify them of an important change."),
React.createElement(DialogLargeHeaderExample, null)))
},
{
title: 'Blocking Dialog',
code: DialogBlockingExampleCode,
view: (React.createElement(React.Fragment, null,
React.createElement("p", null, "A blocking Dialog disables all other actions and commands on the page behind it. They should be used very sparingly, only when it is critical that the user makes a choice or provides information before they can proceed. Blocking Dialogs are generally used for irreversible or potentially destructive tasks."),
React.createElement(DialogBlockingExample, null))),
codepenJS: DialogBlockingExampleCodepen
}
],
propertiesTablesSources: [
require('!raw-loader!office-ui-fabric-react/src/components/Dialog/Dialog.types.ts')
],
overview: require('!raw-loader!office-ui-fabric-react/src/components/Dialog/docs/DialogOverview.md'),
bestPractices: '',
dos: require('!raw-loader!office-ui-fabric-react/src/components/Dialog/docs/DialogDos.md'),
donts: require('!raw-loader!office-ui-fabric-react/src/components/Dialog/docs/DialogDonts.md'),
isHeaderVisible: true,
isFeedbackVisible: true
};
//# sourceMappingURL=Dialog.doc.js.map