define(["require", "exports", "tslib", "react", "office-ui-fabric-react/lib/Utilities", "office-ui-fabric-react/lib/Persona", "office-ui-fabric-react/lib/Checkbox", "office-ui-fabric-react/lib/Label", "../../../common/TestImages", "../../../common/_exampleStyles.scss"], function (require, exports, tslib_1, React, Utilities_1, Persona_1, Checkbox_1, Label_1, TestImages_1, exampleStylesImport) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var exampleStyles = exampleStylesImport;
    var examplePersona = {
        imageUrl: TestImages_1.TestImages.personaFemale,
        imageInitials: 'AL',
        primaryText: 'Annie Lindqvist',
        secondaryText: 'Software Engineer',
        tertiaryText: 'In a meeting',
        optionalText: 'Available at 4:00pm'
    };
    var PersonaBasicExample = (function (_super) {
        tslib_1.__extends(PersonaBasicExample, _super);
        function PersonaBasicExample() {
            var _this = _super.call(this) || this;
            _this.state = {
                renderPersonaDetails: true
            };
            return _this;
        }
        PersonaBasicExample.prototype.render = function () {
            var renderPersonaDetails = this.state.renderPersonaDetails;
            return (React.createElement("div", null,
                React.createElement("div", null,
                    React.createElement(Checkbox_1.Checkbox, { label: 'Include persona details', checked: renderPersonaDetails, onChange: this._onChange })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Tiny Persona (12px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { size: Persona_1.PersonaSize.tiny, presence: Persona_1.PersonaPresence.offline, hidePersonaDetails: !renderPersonaDetails })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Extra Extra Small Persona (24px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { size: Persona_1.PersonaSize.extraExtraSmall, presence: Persona_1.PersonaPresence.none, hidePersonaDetails: !renderPersonaDetails })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Size 28 Persona (28px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { size: Persona_1.PersonaSize.size28, presence: Persona_1.PersonaPresence.none, hidePersonaDetails: !renderPersonaDetails })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Extra Small Persona (32px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { size: Persona_1.PersonaSize.extraSmall, presence: Persona_1.PersonaPresence.online, hidePersonaDetails: !renderPersonaDetails })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Small Persona (40px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { size: Persona_1.PersonaSize.small, presence: Persona_1.PersonaPresence.away, hidePersonaDetails: !renderPersonaDetails })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Medium Persona (48px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { hidePersonaDetails: !renderPersonaDetails, presence: Persona_1.PersonaPresence.busy })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Large Persona (72px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { size: Persona_1.PersonaSize.large, presence: Persona_1.PersonaPresence.dnd, hidePersonaDetails: !renderPersonaDetails })),
                React.createElement(Label_1.Label, { className: exampleStyles.exampleLabel }, "Extra Large Persona (100px)"),
                React.createElement(Persona_1.Persona, tslib_1.__assign({}, examplePersona, { size: Persona_1.PersonaSize.extraLarge, presence: Persona_1.PersonaPresence.blocked, hidePersonaDetails: !renderPersonaDetails }))));
        };
        PersonaBasicExample.prototype._onChange = function (ev, checked) {
            this.setState({ renderPersonaDetails: checked });
        };
        tslib_1.__decorate([
            Utilities_1.autobind
        ], PersonaBasicExample.prototype, "_onChange", null);
        return PersonaBasicExample;
    }(React.Component));
    exports.PersonaBasicExample = PersonaBasicExample;
});
//# sourceMappingURL=Persona.Basic.Example.js.map