office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
65 lines • 8.23 kB
JavaScript
"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