"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
            t[p[i]] = s[p[i]];
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
var assign = require("lodash/assign");
var find = require("lodash/find");
var get = require("lodash/get");
var omit = require("lodash/omit");
var React = require("react");
var recompose_1 = require("recompose");
var styled_components_1 = require("styled-components");
var asRendition_1 = require("../asRendition");
var theme_1 = require("../theme");
var utils_1 = require("../utils");
var transition = 'width linear 250ms';
var Bar = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  height: ", ";\n  overflow: hidden;\n  background: ", ";\n  transition: ", ";\n  text-align: center;\n"], ["\n  position: relative;\n  height: ",
    ";\n  overflow: hidden;\n  background: ", ";\n  transition: ", ";\n  text-align: center;\n"])), function (props) {
    return utils_1.px(props.emphasized ? props.theme.space[5] : props.theme.space[4]);
}, function (props) { return props.bg || props.theme.colors.primary.main; }, transition);
var LoadingContent = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tbottom: 0;\n\tright: 0;\n\ttext-align: center;\n\tcolor: #000;\n\ttext-shadow: 0 0 3px rgba(255, 255, 255, 0.5);\n"], ["\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\tbottom: 0;\n\tright: 0;\n\ttext-align: center;\n\tcolor: #000;\n\ttext-shadow: 0 0 3px rgba(255, 255, 255, 0.5);\n"])));
var Content = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n\ttext-align: center;\n\tposition: absolute;\n\tleft: 0;\n\tbottom: 0;\n\ttop: 0;\n\ttext-shadow: 0 0 3px rgba(0, 0, 0, 0.5);\n\ttransition: ", ";\n"], ["\n\ttext-align: center;\n\tposition: absolute;\n\tleft: 0;\n\tbottom: 0;\n\ttop: 0;\n\ttext-shadow: 0 0 3px rgba(0, 0, 0, 0.5);\n\ttransition: ", ";\n"])), transition);
var Sleeve = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: relative;\n  border-radius: ", ";\n  height: ", ";\n  line-height: ", ";\n  background: ", ";\n  font-size: ", "em;\n  overflow: hidden;\n"], ["\n  position: relative;\n  border-radius: ", ";\n  height: ",
    ";\n  line-height: ",
    ";\n  background: ", ";\n  font-size: ", "em;\n  overflow: hidden;\n"])), utils_1.px(theme_1.radius), function (props) {
    return utils_1.px(props.emphasized ? props.theme.space[4] : props.theme.space[3]);
}, function (props) {
    return utils_1.px(props.emphasized ? props.theme.space[4] : props.theme.space[3]);
}, function (props) { return props.theme.colors.quartenary.main; }, function (props) { return (props.emphasized ? 1 : 0.6); });
var getType = recompose_1.withProps(function (props) {
    var type = find(Object.keys(props), function (b) {
        return find(Object.keys(props.theme.colors), function (k) { return k === b; });
    });
    return assign({}, props, { type: type });
});
var setTypeProps = recompose_1.withProps(function (_a) {
    var type = _a.type, theme = _a.theme, background = _a.background, color = _a.color;
    var themeBackground = get(theme.colors[type || 'primary'], 'main');
    return {
        color: color || '#fff',
        background: background || themeBackground,
    };
});
var Base = function (_a) {
    var children = _a.children, background = _a.background, value = _a.value, props = __rest(_a, ["children", "background", "value"]);
    return (React.createElement(Sleeve, __assign({}, omit(props, ['color'])),
        React.createElement(LoadingContent, null, children),
        React.createElement(Bar, { bg: background, style: { width: value + "%" } },
            React.createElement(Content, { style: { width: (value && (100 * 100) / value) + "%" } }, children))));
};
exports.default = recompose_1.compose(styled_components_1.withTheme, getType, setTypeProps, asRendition_1.default)(Base);
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
