@uifabric/experiments
Version:
Experimental React components for building experiences for Office 365.
21 lines • 2.23 kB
JavaScript
import * as React from 'react';
import { ExampleCard, ComponentPage, PropertiesTableSet } from '@uifabric/example-app-base';
import { PersonaExample } from './examples/Persona.Example';
import { VerticalPersonaExample } from './examples/VerticalPersona.Example';
var PersonaExampleCode = require('!raw-loader!@uifabric/experiments/src/components/Persona/examples/Persona.Example.tsx');
var VerticalPersonaExampleCode = require('!raw-loader!@uifabric/experiments/src/components/Persona/examples/VerticalPersona.Example.tsx');
export var PersonaPage = function (props) {
return (React.createElement(ComponentPage, { title: " Persona", componentName: " Persona", exampleCards: React.createElement("div", null,
React.createElement(ExampleCard, { title: "Persona basic usage", code: PersonaExampleCode },
React.createElement(PersonaExample, null)),
React.createElement(ExampleCard, { title: "VerticalPersona basic usage", code: VerticalPersonaExampleCode },
React.createElement(VerticalPersonaExample, null))), propertiesTables: React.createElement(PropertiesTableSet, { sources: [
require('!raw-loader!@uifabric/experiments/src/components/Persona/Persona.types.ts'),
require('!raw-loader!@uifabric/experiments/src/components/Persona/Vertical/VerticalPersona.types.ts')
] }), overview: React.createElement("div", null,
React.createElement("p", null, "The Persona component in experiments is the next iteration of the one that is currently in fabric. Currently it supports rendering a vertical variation of the Persona component."),
React.createElement("p", null, "On a somewhat longer term this should replace the Persona component in the next major version. It'll aim to reduce the DOM impact and in addition support stuff like slots etc for the \"horizontal\" persona as well.")), bestPractices: React.createElement("div", null), dos: React.createElement("div", null,
React.createElement("ul", null)), donts: React.createElement("div", null,
React.createElement("ul", null)), isHeaderVisible: props.isHeaderVisible }));
};
//# sourceMappingURL=PersonaPage.js.map