"use strict";
var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var React = require('react');
require('./Button.scss');
var css_1 = require('../../utilities/css');
var object_1 = require('../../utilities/object');
var Button_Props_1 = require('./Button.Props');
var _instance = 0;
var Button = (function (_super) {
    __extends(Button, _super);
    function Button(props) {
        _super.call(this, props);
        this.state = {
            labelId: "Button-" + _instance++,
            descriptionId: "Button-" + _instance++,
        };
    }
    Button.prototype.render = function () {
        var _this = this;
        var _a = this.props, buttonType = _a.buttonType, children = _a.children, icon = _a.icon, description = _a.description, ariaLabel = _a.ariaLabel;
        var _b = this.state, labelId = _b.labelId, descriptionId = _b.descriptionId;
        var tag = this.props.elementType === Button_Props_1.ElementType.button ? 'button' : 'a';
        var className = css_1.css(this.props.className, 'ms-Button', {
            'ms-Button--primary': buttonType === Button_Props_1.ButtonType.primary,
            'ms-Button--hero': buttonType === Button_Props_1.ButtonType.hero,
            'ms-Button--compound': buttonType === Button_Props_1.ButtonType.compound,
            'ms-Button--command': buttonType === Button_Props_1.ButtonType.command,
            'ms-Button--icon': buttonType === Button_Props_1.ButtonType.icon
        });
        var iconSpan = icon && (buttonType === Button_Props_1.ButtonType.command || buttonType === Button_Props_1.ButtonType.hero || buttonType === Button_Props_1.ButtonType.icon)
            ? React.createElement("span", {className: 'ms-Button-icon'}, React.createElement("i", {className: "ms-Icon ms-Icon--" + icon}))
            : null;
        var descriptionSpan;
        if (buttonType === Button_Props_1.ButtonType.compound) {
            descriptionSpan = React.createElement("span", {className: 'ms-Button-description', id: descriptionId}, description);
        }
        return React.createElement(tag, object_1.assign({
            'aria-label': ariaLabel,
            'aria-labelledby': ariaLabel ? null : labelId,
            'aria-describedby': buttonType === Button_Props_1.ButtonType.compound ? descriptionId : null,
            'ref': function (c) { return _this._buttonElement = c; }
        }, this.props, { className: className }), iconSpan, React.createElement("span", {className: 'ms-Button-label', id: labelId}, children), descriptionSpan);
    };
    Button.prototype.focus = function () {
        if (this._buttonElement) {
            this._buttonElement.focus();
        }
    };
    Button.defaultProps = {
        elementType: Button_Props_1.ElementType.button,
        buttonType: Button_Props_1.ButtonType.normal
    };
    return Button;
}(React.Component));
exports.Button = Button;

//# sourceMappingURL=Button.js.map
