reactui/lib/components/layout/tabControl/tabHeader.js

A components library for ReactJS. This is part of the Gearz project

"use strict";

var React = require("react");
var gearzMixin = require("../../gearz.mixin");

var TabHeader = React.createClass({
    displayName: "TabHeader",

    mixins: [gearzMixin],
    propTypes: {
        // Active tab name
        activeTab: React.PropTypes.string.isRequired,
        // tab array. Each element is of type { name (string), displayName (string) }
        tabs: React.PropTypes.array.isRequired
    },

    render: function render() {
        var that = this;
        var activeTab = this.get("activeTab");
        var tabs = this.get("tabs");

        return React.createElement(
            "ul",
            { className: "nav nav-tabs tabControl" },
            tabs.map(function (item) {
                return React.createElement(
                    "li",
                    { role: "presentation", className: item.name == activeTab ? "active" : "" },
                    React.createElement(
                        "a",
                        { onClick: that.setter("activeTab", item.name) },
                        item.displayName
                    )
                );
            })
        );
    }
});

module.exports = TabHeader;