"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.makeAttrHandler = makeAttrHandler;
exports.elementPropHandler = elementPropHandler;
exports.htmlPropHandler = htmlPropHandler;
exports.svgPropHandler = svgPropHandler;
exports.basePropHandler = basePropHandler;
exports.stylePropHandler = stylePropHandler;
exports.inputPropHandler = inputPropHandler;
const identity_1 = require("../util/identity");
const attr_1 = require("./attr");
const style_1 = require("./style");
function makeAttrHandler(element, name) {
    return (data) => {
        if (data === undefined) {
            element.removeAttribute(name);
        }
        else {
            element.setAttribute(name, data);
        }
    };
}
function elementPropHandler(component, element, DEFAULT_STYLE, DEFAULT_ATTR) {
    return {
        ...basePropHandler(component, element, DEFAULT_STYLE, DEFAULT_ATTR),
        ...stylePropHandler(component, element, DEFAULT_STYLE),
    };
}
function htmlPropHandler(component, element, DEFAULT_STYLE, DEFAULT_ATTR) {
    return {
        ...elementPropHandler(component, element, DEFAULT_STYLE, DEFAULT_ATTR),
        innerText: (innerText) => {
            element.innerText = innerText || '';
        },
    };
}
function svgPropHandler(component, element, DEFAULT_STYLE, DEFAULT_ATTR) {
    return {
        ...basePropHandler(component, element, DEFAULT_STYLE, DEFAULT_ATTR),
        ...stylePropHandler(component, element, DEFAULT_STYLE),
        ...{
            x: (x = component.$props.attr.x ?? DEFAULT_ATTR.x) => {
                element.setAttribute('x', `${x}`);
            },
            y: (y = component.$props.attr.y ?? DEFAULT_ATTR.y) => {
                element.setAttribute('y', `${y}`);
            },
            x1: (x1 = component.$props.attr.x1 ?? DEFAULT_ATTR.x1) => {
                element.setAttribute('x1', `${x1}`);
            },
            x2: (x2 = component.$props.attr.x2 ?? DEFAULT_ATTR.x2) => {
                element.setAttribute('x2', `${x2}`);
            },
            y1: (y1 = component.$props.attr.y1 ?? DEFAULT_ATTR.y1) => {
                element.setAttribute('y1', `${y1}`);
            },
            y2: (y2 = component.$props.attr.y2 ?? DEFAULT_ATTR.y2) => {
                element.setAttribute('y2', `${y2}`);
            },
            width: (width = component.$props.attr.width ??
                DEFAULT_ATTR.width) => {
                element.setAttribute('width', `${width}`);
            },
            height: (height = component.$props.attr.height ??
                DEFAULT_ATTR.height) => {
                element.setAttribute('height', `${height}`);
            },
            rx: (rx = component.$props.attr.rx ?? DEFAULT_ATTR.rx) => {
                element.setAttribute('rx', `${rx}`);
            },
            ry: (ry = component.$props.attr.ry ?? DEFAULT_ATTR.ry) => {
                element.setAttribute('ry', `${ry}`);
            },
            href: (href = component.$props.attr.href ??
                DEFAULT_ATTR.href) => {
                element.setAttribute('href', `${href}`);
            },
        },
    };
}
function basePropHandler(component, element, DEFAULT_STYLE, DEFAULT_ATTR) {
    return {
        attr: (attr, prev) => {
            (0, attr_1.applyAttr)(element, { ...DEFAULT_ATTR, ...attr }, prev);
        },
        style: (style = {}) => {
            (0, style_1.applyStyle)(element, { ...DEFAULT_STYLE, ...style });
        },
        name: makeAttrHandler(element, 'name'),
        className: makeAttrHandler(element, 'className'),
        id: makeAttrHandler(element, 'id'),
        tabIndex: makeAttrHandler(element, 'tabIndex'),
        title: makeAttrHandler(element, 'title'),
        draggable: makeAttrHandler(element, 'draggable'),
        offset: makeAttrHandler(element, 'offset'),
        stopColor: makeAttrHandler(element, 'stop-color'),
        stopOpacity: makeAttrHandler(element, 'stop-opacity'),
    };
}
function stylePropHandler(component, element, DEFAULT_STYLE) {
    return {
        style: (style = {}) => {
            (0, style_1.applyDynamicStyle)(component, element, { ...DEFAULT_STYLE, ...style });
        },
    };
}
function inputPropHandler(element, VALUE_NAME, DEFAULT_VALUE, parseValue = identity_1.identity) {
    return {
        value: (value) => {
            const value_ = parseValue(value);
            element[VALUE_NAME] = value_ || DEFAULT_VALUE;
        },
        placeholder: (placeholder) => {
            // @ts-ignore
            element.placeholder = placeholder ?? '';
        },
        checked: (checked) => {
            // @ts-ignore
            element.checked = checked;
        },
        disabled: makeAttrHandler(element, 'disabled'),
    };
}
//# sourceMappingURL=propHandler.js.map