"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var map = require("lodash/map");
var React = require("react");
var __1 = require("../../../../");
var TabbedBox = (function (_super) {
    __extends(TabbedBox, _super);
    function TabbedBox(props) {
        var _this = _super.call(this, props) || this;
        _this.showTab = function (e) {
            var index = parseInt(e.currentTarget.dataset.index || '', 10);
            _this.setState({ show: index });
        };
        _this.state = {
            show: 0,
        };
        return _this;
    }
    TabbedBox.prototype.render = function () {
        var _this = this;
        var visibleChild = this.props.children[this.state.show];
        return (React.createElement(__1.Box, null,
            React.createElement(__1.Flex, { justify: "space-between", mb: 1 },
                React.createElement(__1.Flex, null, map(this.props.tabs, function (tab, index) {
                    return (React.createElement(__1.Button, { key: index, plaintext: true, "data-index": index, mr: 3, onClick: _this.showTab },
                        React.createElement(__1.Txt, { bold: index === _this.state.show }, tab)));
                })),
                this.props.help),
            visibleChild));
    };
    return TabbedBox;
}(React.Component));
exports.TabbedBox = TabbedBox;
