UNPKG

office-ui-fabric-react

Version:

Reusable React components for building experiences for Office 365.

65 lines 8.23 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var React = require("react"); var example_app_base_1 = require("@uifabric/example-app-base"); var ContextualMenu_Basic_Example_1 = require("./examples/ContextualMenu.Basic.Example"); var ContextualMenu_Icon_Example_1 = require("./examples/ContextualMenu.Icon.Example"); var ContextualMenu_Icon_SecondaryText_Example_1 = require("./examples/ContextualMenu.Icon.SecondaryText.Example"); var ContextualMenu_Section_Example_1 = require("./examples/ContextualMenu.Section.Example"); var ContextualMenu_Submenu_Example_1 = require("./examples/ContextualMenu.Submenu.Example"); var ContextualMenu_CustomizationWithNoWrap_Example_1 = require("./examples/ContextualMenu.CustomizationWithNoWrap.Example"); var ContextualMenu_Checkmarks_Example_1 = require("./examples/ContextualMenu.Checkmarks.Example"); var ContextualMenu_Directional_Example_1 = require("./examples/ContextualMenu.Directional.Example"); var ContextualMenu_Customization_Example_1 = require("./examples/ContextualMenu.Customization.Example"); var ContextualMenu_ScrollBar_Example_1 = require("./examples/ContextualMenu.ScrollBar.Example"); var ContextualMenu_CustomMenuItem_Example_1 = require("./examples/ContextualMenu.CustomMenuItem.Example"); var ComponentStatus_1 = require("../../demo/ComponentStatus/ComponentStatus"); var ContextualMenu_checklist_1 = require("./ContextualMenu.checklist"); var ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx'); 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 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'); var ContextualMenuPage = /** @class */ (function (_super) { tslib_1.__extends(ContextualMenuPage, _super); function ContextualMenuPage() { return _super !== null && _super.apply(this, arguments) || this; } ContextualMenuPage.prototype.render = function () { return (React.createElement(example_app_base_1.ComponentPage, { title: 'ContextualMenu', componentName: 'ContextualMenuExample', componentUrl: 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react/src/components/ContextualMenu', exampleCards: React.createElement("div", null, React.createElement(example_app_base_1.ExampleCard, { title: 'Default ContextualMenu', code: ContextualMenuBasicExampleCode }, React.createElement(ContextualMenu_Basic_Example_1.ContextualMenuBasicExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with icons', code: ContextualMenuIconExampleCode }, React.createElement(ContextualMenu_Icon_Example_1.ContextualMenuIconExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with icons and secondary text', code: ContextualMenuIconSecondaryTextExampleCode }, React.createElement(ContextualMenu_Icon_SecondaryText_Example_1.ContextualMenuIconSecondaryTextExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with submenus', code: ContextualMenuSubmenuExampleCode }, React.createElement(ContextualMenu_Submenu_Example_1.ContextualMenuSubmenuExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with section headers', code: ContextualMenuSectionExampleCode }, React.createElement(ContextualMenu_Section_Example_1.ContextualMenuSectionExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with checkable menu items and toggleable split button', code: ContextualMenuCheckmarksExampleCode }, React.createElement(ContextualMenu_Checkmarks_Example_1.ContextualMenuCheckmarksExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with beak and directional settings', code: ContextualMenuDirectionalExampleCode }, React.createElement(ContextualMenu_Directional_Example_1.ContextualMenuDirectionalExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with customized submenus', code: ContextualMenuCustomizationExampleCode }, React.createElement(ContextualMenu_Customization_Example_1.ContextualMenuCustomizationExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with customized submenus and noWrap attributes', code: ContextualMenuSubmenuExampleCode }, React.createElement(ContextualMenu_CustomizationWithNoWrap_Example_1.ContextualMenuCustomizationWithNoWrapExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with a scroll bar and fixed direction', code: ContextualMenuWithScrollBarExampleCode }, React.createElement(ContextualMenu_ScrollBar_Example_1.ContextualMenuWithScrollBarExample, null)), React.createElement(example_app_base_1.ExampleCard, { title: 'ContextualMenu with custom rendered menu items', code: ContextualMenuWithCustomMenuItemExampleCode }, React.createElement(ContextualMenu_CustomMenuItem_Example_1.ContextualMenuWithCustomMenuItemExample, null))), propertiesTables: React.createElement(example_app_base_1.PropertiesTableSet, { sources: [ 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: React.createElement(example_app_base_1.PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/docs/ContextualMenuOverview.md')), bestPractices: React.createElement("div", null), dos: React.createElement(example_app_base_1.PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/docs/ContextualMenuDos.md')), donts: React.createElement(example_app_base_1.PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/docs/ContextualMenuDonts.md')), isHeaderVisible: this.props.isHeaderVisible, componentStatus: React.createElement(ComponentStatus_1.ComponentStatus, tslib_1.__assign({}, ContextualMenu_checklist_1.ContextualMenuStatus)) })); }; return ContextualMenuPage; }(React.Component)); exports.ContextualMenuPage = ContextualMenuPage; //# sourceMappingURL=ContextualMenuPage.js.map