@joist/element/target/lib/tags.js

Intelligently apply styles to WebComponents

export class HTMLResult {
    #template;
    constructor(raw, ..._values) {
        this.#template = document.createElement("template");
        this.#template.innerHTML = concat(raw);
    }
    createNode() {
        return document.importNode(this.#template.content, true);
    }
    apply(el) {
        if (el.shadowRoot) {
            el.shadowRoot.append(this.createNode());
        }
    }
}
export function html(strings, ...values) {
    return new HTMLResult(strings, ...values);
}
export class CSSResult {
    #sheet;
    constructor(raw, ..._values) {
        this.#sheet = new CSSStyleSheet();
        this.#sheet.replaceSync(concat(raw));
    }
    apply(el) {
        if (el.shadowRoot) {
            el.shadowRoot.adoptedStyleSheets = [
                ...el.shadowRoot.adoptedStyleSheets,
                this.#sheet,
            ];
        }
    }
}
export function css(strings) {
    return new CSSResult(strings);
}
function concat(strings) {
    let res = "";
    for (let i = 0; i < strings.length; i++) {
        res += strings[i];
    }
    return res;
}
//# sourceMappingURL=tags.js.map