ueblueprint/js/template/LinkMessageTemplate.js

import html from "./html"
import ITemplate from "./ITemplate"
import LinkElement from "../element/LinkElement"
import sanitizeText from "./sanitizeText"

/**
 * @typedef {import("../element/LinkMessageElement").default} LinkMessageElement
 */
export default class LinkMessageTemplate extends ITemplate {

    /**
     * Computes the html content of the target element.
     * @param {LinkMessageElement} linkMessage attached to link destination
     * @returns The result html 
     */
    render(linkMessage) {
        return html`
            <span class="${sanitizeText(linkMessage.icon)}"></span>
            <span class="ueb-link-message"></span>
        `
    }

    /**
     * Applies the style to the element.
     * @param {LinkMessageElement} linkMessage element
     */
    apply(linkMessage) {
        super.apply(linkMessage)
        linkMessage.linkElement = linkMessage.closest(LinkElement.tagName)
        linkMessage.querySelector(".ueb-link-message").innerText = linkMessage.message(
            linkMessage.linkElement.getSourcePin(),
            linkMessage.linkElement.getDestinationPin()
        )
    }

}