UNPKG

@uifabric/experiments

Version:

Experimental React components for building experiences for Office 365.

31 lines 2.55 kB
import * as tslib_1 from "tslib"; import * as React from 'react'; import { ExampleCard, ComponentPage, PropertiesTableSet } from '@uifabric/example-app-base'; import { TileFolderExample } from './examples/Tile.Folder.Example'; var TileFolderExampleCode = require('!raw-loader!@uifabric/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx'); import { TileMediaExample } from './examples/Tile.Media.Example'; var TileMediaExampleCode = require('!raw-loader!@uifabric/experiments/src/components/Tile/examples/Tile.Media.Example.tsx'); import { TileDocumentExample } from './examples/Tile.Document.Example'; var TileDocumentExampleCode = require('!raw-loader!@uifabric/experiments/src/components/Tile/examples/Tile.Document.Example.tsx'); var TilePage = /** @class */ (function (_super) { tslib_1.__extends(TilePage, _super); function TilePage() { return _super !== null && _super.apply(this, arguments) || this; } TilePage.prototype.render = function () { return (React.createElement(ComponentPage, { title: "Tile", componentName: "Tile", exampleCards: React.createElement("div", null, React.createElement(ExampleCard, { title: "Folder Tile", isOptIn: true, code: TileFolderExampleCode }, React.createElement(TileFolderExample, null)), React.createElement(ExampleCard, { title: "Document Tile", isOptIn: true, code: TileDocumentExampleCode }, React.createElement(TileDocumentExample, null)), React.createElement(ExampleCard, { title: "Media Tile", isOptIn: true, code: TileMediaExampleCode }, React.createElement(TileMediaExample, null))), propertiesTables: React.createElement(PropertiesTableSet, { sources: [require('!raw-loader!@uifabric/experiments/src/components/Tile/Tile.types.ts')] }), overview: React.createElement("div", null), bestPractices: React.createElement("div", null), dos: React.createElement("div", null, React.createElement("ul", null, React.createElement("li", null, "Use them to represent a large collection of items visually."))), donts: React.createElement("div", null, React.createElement("ul", null, React.createElement("li", null, "Use them for general layout of components that are not part of the same set."))), isHeaderVisible: this.props.isHeaderVisible })); }; return TilePage; }(React.Component)); export { TilePage }; //# sourceMappingURL=TilePage.js.map