@uifabric/experiments
Version:
Experimental React components for building experiences for Office 365.
41 lines • 2.9 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var office_ui_fabric_react_1 = require("office-ui-fabric-react");
var TestImages_1 = require("@uifabric/experiments/lib/common/TestImages");
var index_1 = require("../index");
var sectionGap = 32;
var headingGap = 16;
var personaCoinGap = 12;
var PersonaCoinStack = function (props) { return (React.createElement(office_ui_fabric_react_1.Stack, { horizontal: true, disableShrink: true, gap: personaCoinGap }, props.children)); };
var PersonaCoinExample = /** @class */ (function (_super) {
tslib_1.__extends(PersonaCoinExample, _super);
function PersonaCoinExample() {
return _super !== null && _super.apply(this, arguments) || this;
}
PersonaCoinExample.prototype.render = function () {
return (React.createElement(office_ui_fabric_react_1.Stack, { gap: sectionGap },
React.createElement(office_ui_fabric_react_1.Stack, { gap: headingGap, padding: 8 },
React.createElement(office_ui_fabric_react_1.Stack, { gap: personaCoinGap },
React.createElement(office_ui_fabric_react_1.Text, null, "When passing text initials will be extracted from the text"),
React.createElement(PersonaCoinStack, null,
React.createElement(index_1.PersonaCoin, { text: "Kevin Jameson" }),
React.createElement(index_1.PersonaCoin, { text: "\u738B\u529B" }),
React.createElement(index_1.PersonaCoin, { text: "Eline Page", presence: 4 }),
React.createElement(index_1.PersonaCoin, { text: "Eline Page", imageUrl: TestImages_1.PersonaTestImages.personFemale }),
React.createElement(index_1.PersonaCoin, { text: "Kevin Jameson", imageUrl: TestImages_1.PersonaTestImages.personMale }))),
React.createElement(office_ui_fabric_react_1.Stack, { gap: personaCoinGap },
React.createElement(office_ui_fabric_react_1.Text, null, "When passing specific initials"),
React.createElement(PersonaCoinStack, null,
React.createElement(index_1.PersonaCoin, { initials: "JB" }),
React.createElement(index_1.PersonaCoin, { initials: "\u738B\u529B" }))),
React.createElement(office_ui_fabric_react_1.Stack, { gap: personaCoinGap },
React.createElement(office_ui_fabric_react_1.Text, null, "Initials not available"),
React.createElement(PersonaCoinStack, null,
React.createElement(index_1.PersonaCoin, null))))));
};
return PersonaCoinExample;
}(React.Component));
exports.PersonaCoinExample = PersonaCoinExample;
//# sourceMappingURL=PersonaCoin.Example.js.map