"use strict";
exports.__esModule = true;
var React = require("react");
var glamorous_1 = require("glamorous");
var Row = glamorous_1["default"].div({
    display: 'flex',
    alignItems: 'flex-start'
}, function (props) { return ({
    flexDirection: 'row',
    flexWrap: props.orientation === 'vertical' ? 'nowrap' : 'wrap',
    marginBottom: props.orientation === 'vertical' ? '0.5em' : '0',
    marginLeft: props.orientation === 'horizontal' ? '0.5em' : '0'
}); });
exports["default"] = function (props) {
    return (React.createElement(glamorous_1.Div, { display: "flex", flexFlow: props.orientation === 'vertical' ? 'column' : 'row', flexWrap: props.orientation === 'vertical' ? 'nowrap' : 'wrap', alignItems: "flex-start" }, props.data.map(function (row) { return (React.createElement(Row, { orientation: props.orientation, key: row.value },
        React.createElement(glamorous_1.Div, { backgroundColor: row.color, width: "1em", height: "1em" }),
        React.createElement(glamorous_1.Div, { marginLeft: '1em', textAlign: 'left' }, row.value))); })));
};
