"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const namespaceURI_1 = require("../../../../../client/component/namespaceURI");
const svg_1 = require("../../../../../client/svg");
class SVGSVG extends svg_1.SVGElement_ {
    constructor($props, $system) {
        super($props, $system, $system.api.document.createElementNS(namespaceURI_1.namespaceURI, 'svg'), $system.style['svg']);
        const { className, stroke = 'currentColor', strokeWidth = 0, viewBox, preserveAspectRatio = 'none', title, tabIndex = -1, } = $props;
        if (className !== undefined) {
            this.$element.classList.value = className;
        }
        if (viewBox) {
            this.$element.setAttribute('viewBox', viewBox);
        }
        if (preserveAspectRatio) {
            this.$element.setAttribute('preserveAspectRatio', preserveAspectRatio);
        }
        if (tabIndex !== undefined) {
            this.$element.tabIndex = tabIndex;
        }
        if (stroke !== undefined) {
            this.$element.setAttribute('stroke', `${stroke}`);
        }
        if (strokeWidth !== undefined) {
            this.$element.setAttribute('stroke-width', `${strokeWidth}`);
        }
        if (title) {
            const title_el = this.$system.api.document.createElementNS(namespaceURI_1.namespaceURI, 'title');
            title_el.innerHTML = title;
            this.$element.appendChild(title_el);
        }
        this.$element.setAttribute('preserveAspectRatio', 'xMidYMid meet');
        this.$propHandler = {
            ...this.$propHandler,
            viewBox: (viewBox) => {
                if (viewBox === undefined) {
                    this.$element.removeAttribute('viewBox');
                }
                else {
                    this.$element.setAttribute('viewBox', viewBox);
                }
            },
            width: (width) => {
                if (width === undefined) {
                    this.$element.removeAttribute('width');
                }
                else {
                    this.$element.setAttribute('width', `${width}`);
                }
            },
            height: (height) => {
                if (height === undefined) {
                    this.$element.removeAttribute('height');
                }
                else {
                    this.$element.setAttribute('height', `${height}`);
                }
            },
            strokeWidth: (strokeWidth) => {
                if (strokeWidth === undefined) {
                    this.$element.removeAttribute('stroke-width');
                }
                else {
                    this.$element.setAttribute('stroke-width', `${strokeWidth}`);
                }
            },
        };
    }
    onPropChanged(prop, current) {
        this.$propHandler[prop](current);
    }
}
exports.default = SVGSVG;
//# sourceMappingURL=Component.js.map