"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var focus_1 = require("@dojo/framework/core/middleware/focus");
var vdom_1 = require("@dojo/framework/core/vdom");
var theme_1 = require("../middleware/theme");
var css = require("../theme/default/rate.m.css");
var fixedCss = require("./rate.m.css");
var baseCss = require("../common/styles/base.m.css");
var radio_group_1 = require("../radio-group");
var icache_1 = require("@dojo/framework/core/middleware/icache");
var icon_1 = require("../icon");
var factory = vdom_1.create({ focus: focus_1.focus, theme: theme_1.default, icache: icache_1.createICacheMiddleware() })
    .properties()
    .children();
exports.Rate = factory(function Rate(_a) {
    var properties = _a.properties, id = _a.id, children = _a.children, _b = _a.middleware, theme = _b.theme, icache = _b.icache;
    var idBase = "rate-" + id;
    var _c = properties(), onValue = _c.onValue, _d = _c.max, max = _d === void 0 ? 5 : _d, initialValue = _c.initialValue, allowHalf = _c.allowHalf, _e = _c.name, name = _e === void 0 ? idBase : _e, readOnly = _c.readOnly, themeProp = _c.theme, classes = _c.classes, variant = _c.variant;
    var value = properties().value;
    var _f = tslib_1.__read(children(), 1), _g = _f[0], _h = _g === void 0 ? { label: undefined, icon: undefined } : _g, label = _h.label, icon = _h.icon;
    var themeCss = theme.classes(css);
    var hoveredValue = icache.getOrSet('valueHovered', 0);
    if (value === undefined) {
        if (initialValue !== undefined) {
            var previousInitialValue = icache.get('initialValue');
            if (initialValue !== previousInitialValue) {
                icache.set('initialValue', initialValue);
                icache.set('value', initialValue);
            }
        }
        value = icache.getOrSet('value', 0);
    }
    value = allowHalf ? Math.round(value * 2) / 2 : Math.round(value);
    var options = [];
    for (var i = 1; i <= max; i++) {
        options.push({ value: "" + i });
    }
    var valueFocused = icache.getOrSet('valueFocused', '');
    var containsFocus = icache.getOrSet('focused', false);
    function renderRadio(stringValue, checked) {
        var numValue = parseFloat(stringValue);
        var visiblyChecked = hoveredValue
            ? numValue <= hoveredValue
            : !!value && numValue <= value;
        return (vdom_1.tsx("label", { classes: [
                theme.variant(),
                fixedCss.labelFixed,
                themeCss.icon,
                visiblyChecked && themeCss.checked
            ], onmouseenter: function () {
                !readOnly && icache.set('valueHovered', numValue);
            }, onmouseleave: function () {
                !readOnly && icache.set('valueHovered', 0);
            }, title: stringValue },
            vdom_1.tsx("span", { classes: fixedCss.iconWrapperFixed }, icon || (vdom_1.tsx(icon_1.default, { size: "medium", type: "starIcon", theme: themeProp, variant: variant, classes: classes }))),
            vdom_1.tsx("input", { classes: baseCss.visuallyHidden, type: "radio", checked: checked(), name: name, value: stringValue, onfocus: function () {
                    icache.set('valueFocused', stringValue);
                    icache.set('focused', true);
                }, onblur: function () {
                    icache.set('focused', false);
                }, disabled: readOnly, onchange: function (event) {
                    event.stopPropagation();
                    var radio = event.target;
                    checked(radio.checked);
                } })));
    }
    return (vdom_1.tsx("div", { classes: [themeCss.root, theme.variant(), containsFocus && themeCss.focused] },
        vdom_1.tsx(radio_group_1.default, { key: "radio-group", name: name, options: options, onValue: function (value) {
                if (!readOnly) {
                    var numberVal = parseFloat(value);
                    icache.set('value', numberVal);
                    icache.set('valueHovered', 0);
                    onValue && onValue(numberVal);
                }
            }, variant: variant, theme: themeProp, classes: classes }, {
            label: label,
            radios: function (name, radioGroup, options) {
                return options.map(function (_a) {
                    var stringValue = _a.value;
                    if (allowHalf) {
                        var halfValue = "" + (parseFloat(stringValue) - 0.5);
                        var focused = false;
                        if (valueFocused === halfValue || valueFocused === stringValue) {
                            focused = true;
                        }
                        return (vdom_1.tsx("span", { classes: [
                                fixedCss.halfWrapperFixed,
                                focused && themeCss.focusedStar
                            ] },
                            renderRadio(halfValue, radioGroup(halfValue).checked),
                            renderRadio(stringValue, radioGroup(stringValue).checked)));
                    }
                    else {
                        return (vdom_1.tsx("span", { classes: [
                                valueFocused === stringValue && themeCss.focusedStar
                            ] }, renderRadio(stringValue, radioGroup(stringValue).checked)));
                    }
                });
            }
        })));
});
exports.default = exports.Rate;

/*# sourceMappingURL=index.js.map*/