UNPKG

@uifabric/experiments

Version:

Experimental React components for building experiences for Office 365.

33 lines 2.08 kB
import * as tslib_1 from "tslib"; import * as React from 'react'; import { Stack, Text } from 'office-ui-fabric-react'; import { PersonaTestImages } from '@uifabric/experiments/lib/common/TestImages'; import { Persona } from '../Persona'; var sectionGap = 32; var headingGap = 16; var personaCoinGap = 12; var PersonaExample = /** @class */ (function (_super) { tslib_1.__extends(PersonaExample, _super); function PersonaExample() { return _super !== null && _super.apply(this, arguments) || this; } PersonaExample.prototype.render = function () { return (React.createElement(Stack, { gap: sectionGap }, React.createElement(Stack, { gap: headingGap, padding: 8 }, React.createElement(Stack, { gap: personaCoinGap }, React.createElement(Text, null, "Basic Usage"), React.createElement(Stack, { gap: personaCoinGap }, React.createElement(Persona, { text: "Sukhnam Chander", secondaryText: "Principal Program manager" }), React.createElement(Persona, { text: "Kevin Jameson", secondaryText: "Professional traveller" }), React.createElement(Persona, { text: "\u738B\u529B", secondaryText: "Principal Program manager" }))), React.createElement(Stack, { gap: personaCoinGap }, React.createElement(Text, null, "When passing coinProps"), React.createElement(Stack, { gap: personaCoinGap }, React.createElement(Persona, { text: "Eline Page", secondaryText: "eSports commentator", coin: { presence: 4 } }), React.createElement(Persona, { text: "\u8D75\u4E3D\u9896", coin: { imageUrl: PersonaTestImages.personFemale } }), React.createElement(Persona, { text: "Kevin Jameson", coin: { imageUrl: PersonaTestImages.personMale } })))))); }; return PersonaExample; }(React.Component)); export { PersonaExample }; //# sourceMappingURL=Persona.Example.js.map