"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var css = require("../theme/default/loading-indicator.m.css");
var theme_1 = require("../middleware/theme");
var vdom_1 = require("@dojo/framework/core/vdom");
var factory = vdom_1.create({ theme: theme_1.default }).properties();
exports.LoadingIndicator = factory(function LoadingIndicator(_a) {
    var properties = _a.properties, theme = _a.middleware.theme;
    var classes = theme.classes(css);
    var _b = properties(), _c = _b.active, active = _c === void 0 ? true : _c, _d = _b.type, type = _d === void 0 ? 'linear' : _d;
    var isLinear = type === 'linear';
    if (isLinear) {
        return (vdom_1.tsx("div", { classes: [
                theme.variant(),
                classes.root,
                !active && classes.inactive,
                classes.linear
            ], role: "progressbar" },
            vdom_1.tsx("div", { classes: classes.buffer }),
            active && (vdom_1.tsx("div", { classes: [classes.bar, classes.primary] },
                vdom_1.tsx("span", { classes: classes.inner })))));
    }
    var sizeClass;
    switch (type) {
        case 'circular-small':
            sizeClass = css.small;
            break;
        case 'circular-large':
            sizeClass = css.large;
            break;
        case 'circular-medium':
        default:
            sizeClass = css.medium;
            break;
    }
    return (vdom_1.tsx("div", { classes: [
            theme.variant(),
            classes.root,
            !active && classes.inactive,
            classes.circular,
            sizeClass
        ], role: "progressbar" }, active && (vdom_1.tsx("div", { classes: classes.circularContainer },
        vdom_1.tsx("div", { classes: classes.spinnerLayer },
            vdom_1.tsx("div", { classes: [classes.circleClipper, classes.circleLeft] },
                vdom_1.tsx("svg", { classes: classes.circleGraphic, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
                    vdom_1.tsx("circle", { cx: "12", cy: "12", r: "8.75", "stroke-dasharray": "54.978", "stroke-dashoffset": "27.489", "stroke-width": "2.5" }))),
            vdom_1.tsx("div", { classes: classes.gapPatch },
                vdom_1.tsx("svg", { classes: classes.circleGraphic, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
                    vdom_1.tsx("circle", { cx: "12", cy: "12", r: "8.75", "stroke-dasharray": "54.978", "stroke-dashoffset": "27.489", "stroke-width": "2" }))),
            vdom_1.tsx("div", { classes: [classes.circleClipper, classes.circleRight] },
                vdom_1.tsx("svg", { classes: classes.circleGraphic, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
                    vdom_1.tsx("circle", { cx: "12", cy: "12", r: "8.75", "stroke-dasharray": "54.978", "stroke-dashoffset": "27.489", "stroke-width": "2.5" }))))))));
});
exports.default = exports.LoadingIndicator;

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