"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var focus_1 = require("@dojo/framework/core/middleware/focus");
var theme_1 = require("../middleware/theme");
var util_1 = require("@dojo/framework/core/util");
var vdom_1 = require("@dojo/framework/core/vdom");
var util_2 = require("../common/util");
var index_1 = require("../label/index");
var css = require("../theme/default/checkbox.m.css");
var factory = vdom_1.create({ theme: theme_1.default, focus: focus_1.default })
    .properties()
    .children();
exports.Checkbox = factory(function Checkbox(_a) {
    var children = _a.children, properties = _a.properties, _b = _a.middleware, theme = _b.theme, focus = _b.focus;
    var _uuid = util_1.uuid();
    var _c = properties(), _d = _c.aria, aria = _d === void 0 ? {} : _d, _e = _c.checked, checked = _e === void 0 ? false : _e, classes = _c.classes, disabled = _c.disabled, labelHidden = _c.labelHidden, name = _c.name, onBlur = _c.onBlur, onFocus = _c.onFocus, onValue = _c.onValue, onOut = _c.onOut, onOver = _c.onOver, readOnly = _c.readOnly, required = _c.required, themeProp = _c.theme, variant = _c.variant, valid = _c.valid, value = _c.value, _f = _c.widgetId, widgetId = _f === void 0 ? _uuid : _f;
    var _g = tslib_1.__read(children(), 1), label = _g[0];
    var themeCss = theme.classes(css);
    return (vdom_1.tsx("div", { key: "root", classes: [
            theme.variant(),
            themeCss.root,
            checked ? themeCss.checked : null,
            disabled ? themeCss.disabled : null,
            focus.isFocused('root') ? themeCss.focused : null,
            valid === false ? themeCss.invalid : null,
            valid === true ? themeCss.valid : null,
            readOnly ? themeCss.readonly : null,
            required ? themeCss.required : null
        ] },
        vdom_1.tsx("div", { classes: themeCss.inputWrapper },
            vdom_1.tsx("input", tslib_1.__assign({ id: widgetId }, util_2.formatAriaProperties(aria), { classes: themeCss.input, checked: checked, disabled: disabled, focus: focus.shouldFocus(), "aria-invalid": valid === false ? 'true' : undefined, name: name, readonly: readOnly, "aria-readonly": readOnly === true ? 'true' : undefined, required: required, type: "checkbox", value: value, onblur: function () { return onBlur && onBlur(); }, onchange: function (event) {
                    event.stopPropagation();
                    var checkbox = event.target;
                    onValue(checkbox.checked);
                }, onfocus: function () { return onFocus && onFocus(); }, onpointerenter: function () { return onOver && onOver(); }, onpointerleave: function () { return onOut && onOut(); } })),
            vdom_1.tsx("div", { classes: themeCss.background })),
        label && (vdom_1.tsx(index_1.default, { key: "label", classes: classes, theme: themeProp, variant: variant, disabled: disabled, focused: focus.isFocused('root'), valid: valid, readOnly: readOnly, required: required, hidden: labelHidden, forId: widgetId, secondary: true }, label))));
});
exports.default = exports.Checkbox;

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