UNPKG

office-ui-fabric-react

Version:

Reusable React components for building experiences for Office 365.

60 lines 5.82 kB
import * as tslib_1 from "tslib"; import * as React from 'react'; import { ExampleCard, ComponentPage, PageMarkdown, PropertiesTableSet } from '@uifabric/example-app-base'; import { PivotBasicExample } from './examples/Pivot.Basic.Example'; import { PivotIconCountExample } from './examples/Pivot.IconCount.Example'; import { PivotLargeExample } from './examples/Pivot.Large.Example'; import { PivotTabsExample } from './examples/Pivot.Tabs.Example'; import { PivotTabsLargeExample } from './examples/Pivot.TabsLarge.Example'; import { PivotFabricExample } from './examples/Pivot.Fabric.Example'; import { PivotOnChangeExample } from './examples/Pivot.OnChange.Example'; import { PivotRemoveExample } from './examples/Pivot.Remove.Example'; import { PivotOverrideExample } from './examples/Pivot.Override.Example'; import { PivotSeparateExample } from './examples/Pivot.Separate.Example'; import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus'; import { PivotStatus } from './Pivot.checklist'; var PivotRemoveExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Remove.Example.tsx'); var PivotBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Basic.Example.tsx'); var PivotLargeExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Large.Example.tsx'); var PivotTabsExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Tabs.Example.tsx'); var PivotTabsLargesExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.TabsLarge.Example.tsx'); var PivotFabricExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Fabric.Example.tsx'); var PivotOnChangeExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.OnChange.Example.tsx'); var PivotIconCountExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.IconCount.Example.tsx'); var PivotOverrideExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Override.Example.tsx'); var PivotSeparateExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx'); var PivotPage = /** @class */ (function (_super) { tslib_1.__extends(PivotPage, _super); function PivotPage() { return _super !== null && _super.apply(this, arguments) || this; } PivotPage.prototype.render = function () { return (React.createElement(ComponentPage, { title: 'Pivot', componentName: 'PivotExample', componentUrl: 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react/src/components/Pivot', exampleCards: React.createElement("div", null, React.createElement(ExampleCard, { title: 'Default Pivot', code: PivotBasicExampleCode }, React.createElement(PivotBasicExample, null)), React.createElement(ExampleCard, { title: 'Count and Icon', code: PivotIconCountExampleCode }, React.createElement(PivotIconCountExample, null)), React.createElement(ExampleCard, { title: 'Large link size', code: PivotLargeExampleCode }, React.createElement(PivotLargeExample, null)), React.createElement(ExampleCard, { title: 'Links of tab style', code: PivotTabsExampleCode }, React.createElement(PivotTabsExample, null)), React.createElement(ExampleCard, { title: 'Links of large tab style', code: PivotTabsLargesExampleCode }, React.createElement(PivotTabsLargeExample, null)), React.createElement(ExampleCard, { title: 'Trigger onchange event', code: PivotOnChangeExampleCode }, React.createElement(PivotOnChangeExample, null)), React.createElement(ExampleCard, { title: 'Rendering nested components within the Pivot', code: PivotFabricExampleCode }, React.createElement(PivotFabricExample, null)), React.createElement(ExampleCard, { title: 'Show/Hide pivot item', code: PivotRemoveExampleCode }, React.createElement(PivotRemoveExample, null)), React.createElement(ExampleCard, { title: 'Override selected item', code: PivotOverrideExampleCode }, React.createElement(PivotOverrideExample, null)), React.createElement(ExampleCard, { title: 'Render content separately', code: PivotSeparateExampleCode }, React.createElement(PivotSeparateExample, null))), allowNativeProps: 'PivotItem', propertiesTables: React.createElement(PropertiesTableSet, { sources: [ require('!raw-loader!office-ui-fabric-react/src/components/Pivot/Pivot.types.ts'), require('!raw-loader!office-ui-fabric-react/src/components/Pivot/PivotItem.types.ts') ] }), overview: React.createElement(PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/Pivot/docs/PivotOverview.md')), bestPractices: React.createElement("div", null), dos: React.createElement(PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/Pivot/docs/PivotDos.md')), donts: React.createElement(PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/Pivot/docs/PivotDonts.md')), isHeaderVisible: this.props.isHeaderVisible, componentStatus: React.createElement(ComponentStatus, tslib_1.__assign({}, PivotStatus)) })); }; return PivotPage; }(React.Component)); export { PivotPage }; //# sourceMappingURL=PivotPage.js.map