office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
39 lines (38 loc) • 3.98 kB
JavaScript
var __extends = (this && this.__extends) || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
define(["require", "exports", 'react', '../../../index', '../../components/index', './examples/Pivot.Basic.Example', './examples/Pivot.Large.Example', './examples/Pivot.Tabs.Example', './examples/Pivot.TabsLarge.Example', './examples/Pivot.Fabric.Example', './examples/Pivot.OnChange.Example', './examples/Pivot.Remove.Example', '../../utilities/pageroute', '../../components/App/AppState'], function (require, exports, React, index_1, index_2, Pivot_Basic_Example_1, Pivot_Large_Example_1, Pivot_Tabs_Example_1, Pivot_TabsLarge_Example_1, Pivot_Fabric_Example_1, Pivot_OnChange_Example_1, Pivot_Remove_Example_1, pageroute_1, AppState_1) {
"use strict";
var PivotRemoveExampleCode = require('./examples/Pivot.Remove.Example.tsx');
var PivotBasicExampleCode = require('./examples/Pivot.Basic.Example.tsx');
var PivotLargeExampleCode = require('./examples/Pivot.Large.Example.tsx');
var PivotTabsExampleCode = require('./examples/Pivot.Tabs.Example.tsx');
var PivotTabsLargesExampleCode = require('./examples/Pivot.TabsLarge.Example.tsx');
var PivotFabricExampleCode = require('./examples/Pivot.Fabric.Example.tsx');
var PivotOnChangeExampleCode = require('./examples/Pivot.OnChange.Example.tsx');
var PivotPage = (function (_super) {
__extends(PivotPage, _super);
function PivotPage() {
_super.call(this);
this._url = pageroute_1.getPageRouteFromState(AppState_1.AppState, 'Basic components', 'Pivot');
}
PivotPage.prototype.render = function () {
return (React.createElement(index_2.ComponentPage, {title: 'Pivot', componentName: 'PivotExample', exampleCards: [
React.createElement(index_2.ExampleCard, {title: 'Basic example', code: PivotBasicExampleCode}, React.createElement(Pivot_Basic_Example_1.PivotBasicExample, null)),
React.createElement(index_2.ExampleCard, {title: 'Large link size', code: PivotLargeExampleCode}, React.createElement(Pivot_Large_Example_1.PivotLargeExample, null)),
React.createElement(index_2.ExampleCard, {title: 'Links of tab style', code: PivotTabsExampleCode}, React.createElement(Pivot_Tabs_Example_1.PivotTabsExample, null)),
React.createElement(index_2.ExampleCard, {title: 'Links of large tab style', code: PivotTabsLargesExampleCode}, React.createElement(Pivot_TabsLarge_Example_1.PivotTabsLargeExample, null)),
React.createElement(index_2.ExampleCard, {title: 'Trigger onchange event', code: PivotOnChangeExampleCode}, React.createElement(Pivot_OnChange_Example_1.PivotOnChangeExample, null)),
React.createElement(index_2.ExampleCard, {title: 'Rendering nested components within the Pivot', code: PivotFabricExampleCode}, React.createElement(Pivot_Fabric_Example_1.PivotFabricExample, null)),
React.createElement(index_2.ExampleCard, {title: 'Show/Hide pivot item', code: PivotRemoveExampleCode}, React.createElement(Pivot_Remove_Example_1.PivotRemoveExample, null))
], propertiesTables: [
React.createElement(index_2.PropertiesTableSet, {componentName: 'Pivot'}),
React.createElement(index_2.PropertiesTableSet, {componentPath: 'components/Pivot/', componentName: 'PivotItem'})
], overview: React.createElement("div", null, React.createElement(index_1.Link, {target: '_blank', href: 'http://dev.office.com/fabric/components/Pivot'}, "Pivots"), React.createElement("span", null, " are used for grouping components under a set of Links or Tabs")), route: this._url, isHeaderVisible: this.props.isHeaderVisible}));
};
return PivotPage;
}(React.Component));
exports.PivotPage = PivotPage;
});