office-ui-fabric-react/lib/components/ContextualMenu/ContextualMenu.doc.js

Reusable React components for building experiences for Office 365.

import * as React from 'react';
import { ContextualMenuBasicExample } from './examples/ContextualMenu.Basic.Example';
import { ContextualMenuIconExample } from './examples/ContextualMenu.Icon.Example';
import { ContextualMenuIconSecondaryTextExample } from './examples/ContextualMenu.Icon.SecondaryText.Example';
import { ContextualMenuSectionExample } from './examples/ContextualMenu.Section.Example';
import { ContextualMenuSubmenuExample } from './examples/ContextualMenu.Submenu.Example';
import { ContextualMenuCustomizationWithNoWrapExample } from './examples/ContextualMenu.CustomizationWithNoWrap.Example';
import { ContextualMenuCheckmarksExample } from './examples/ContextualMenu.Checkmarks.Example';
import { ContextualMenuDirectionalExample } from './examples/ContextualMenu.Directional.Example';
import { ContextualMenuCustomizationExample } from './examples/ContextualMenu.Customization.Example';
import { ContextualMenuWithScrollBarExample } from './examples/ContextualMenu.ScrollBar.Example';
import { ContextualMenuWithCustomMenuItemExample } from './examples/ContextualMenu.CustomMenuItem.Example';
import { ContextualMenuWithCustomMenuListExample } from './examples/ContextualMenu.CustomMenuList.Example';
import { ContextualMenuStatus } from './ContextualMenu.checklist';
var ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx');
var ContextualMenuBasicExampleCodepen = require('!raw-loader!office-ui-fabric-react/lib/codepen/components/ContextualMenu/ContextualMenu.Basic.Example.Codepen.txt');
var ContextualMenuIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx');
var ContextualMenuIconSecondaryTextExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.SecondaryText.Example.tsx');
var ContextualMenuSectionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx');
var ContextualMenuSubmenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx');
var ContextualMenuCustomMenuListExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuList.Example.tsx');
var ContextualMenuCheckmarksExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx');
var ContextualMenuDirectionalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx');
var ContextualMenuCustomizationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx');
var ContextualMenuWithScrollBarExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx');
var ContextualMenuWithCustomMenuItemExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx');
export var ContextualMenuPageProps = {
    title: 'ContextualMenu',
    componentName: 'ContextualMenu',
    componentUrl: 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react/src/components/ContextualMenu',
    componentStatus: ContextualMenuStatus,
    examples: [
        {
            title: 'Default ContextualMenu',
            code: ContextualMenuBasicExampleCode,
            view: React.createElement(ContextualMenuBasicExample, null),
            codepenJS: ContextualMenuBasicExampleCodepen
        },
        {
            title: 'ContextualMenu with icons',
            code: ContextualMenuIconExampleCode,
            view: React.createElement(ContextualMenuIconExample, null)
        },
        {
            title: 'ContextualMenu with icons and secondary text',
            code: ContextualMenuIconSecondaryTextExampleCode,
            view: React.createElement(ContextualMenuIconSecondaryTextExample, null)
        },
        {
            title: 'ContextualMenu with submenus',
            code: ContextualMenuSubmenuExampleCode,
            view: React.createElement(ContextualMenuSubmenuExample, null)
        },
        {
            title: 'ContextualMenu with section headers',
            code: ContextualMenuSectionExampleCode,
            view: React.createElement(ContextualMenuSectionExample, null)
        },
        {
            title: 'ContextualMenu with checkable menu items and toggleable split button',
            code: ContextualMenuCheckmarksExampleCode,
            view: React.createElement(ContextualMenuCheckmarksExample, null)
        },
        {
            title: 'ContextualMenu with beak and directional settings',
            code: ContextualMenuDirectionalExampleCode,
            view: React.createElement(ContextualMenuDirectionalExample, null)
        },
        {
            title: 'ContextualMenu with customized submenus',
            code: ContextualMenuCustomizationExampleCode,
            view: React.createElement(ContextualMenuCustomizationExample, null)
        },
        {
            title: 'ContextualMenu with customized submenus and noWrap attributes',
            code: ContextualMenuSubmenuExampleCode,
            view: React.createElement(ContextualMenuCustomizationWithNoWrapExample, null)
        },
        {
            title: 'ContextualMenu with a scroll bar and fixed direction',
            code: ContextualMenuWithScrollBarExampleCode,
            view: React.createElement(ContextualMenuWithScrollBarExample, null)
        },
        {
            title: 'ContextualMenu with custom rendered menu items',
            code: ContextualMenuWithCustomMenuItemExampleCode,
            view: React.createElement(ContextualMenuWithCustomMenuItemExample, null)
        },
        {
            title: 'ContextualMenu with custom rendered menu list that renders a searchbox to filter menu items',
            code: ContextualMenuCustomMenuListExampleCode,
            view: React.createElement(ContextualMenuWithCustomMenuListExample, null)
        }
    ],
    propertiesTablesSources: [
        require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts'),
        require('!raw-loader!office-ui-fabric-react/src/components/Callout/Callout.types.ts')
    ],
    overview: require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/docs/ContextualMenuOverview.md'),
    bestPractices: '',
    dos: require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/docs/ContextualMenuDos.md'),
    donts: require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/docs/ContextualMenuDonts.md'),
    isHeaderVisible: true,
    isFeedbackVisible: true
};
//# sourceMappingURL=ContextualMenu.doc.js.map