dbp-lit-element.js

import {AdapterLitElement} from './src/adapter-lit-element';

export default class DBPLitElement extends AdapterLitElement {
    constructor() {
        super();
        this.htmlOverrides = '';
        this._localTemplateSlotsImported = false;
        this._globalSlotsContainer = null;
        this._globalTemplateSlotsImported = false;
        this._renderDone = false;
    }

    static get properties() {
        return {
            ...super.properties,
            htmlOverrides: {type: String, attribute: 'html-overrides'},
        };
    }

    disconnectedCallback() {
        super.disconnectedCallback();

        if (this._globalSlotsContainer !== null) {
            this._globalSlotsContainer.remove();
        }
    }

    _(selector) {
        return this.shadowRoot === null
            ? this.querySelector(selector)
            : this.shadowRoot.querySelector(selector);
    }

    firstUpdated() {
        super.firstUpdated();
        this._renderDone = true;
        this._importTemplateSlots();
    }

    update(changedProperties) {
        changedProperties.forEach((oldValue, propName) => {
            switch (propName) {
                case 'html-overrides':
                    this._importTemplateSlots();
                    break;
            }
        });

        super.update(changedProperties);
    }

    /**
     * Transforms all global override templates or named template slots in the light DOM to named div slots
     * on the first render.
     *
     * Global overrides will replace all existing slotted elements with the same slot name.
     */
    _importTemplateSlots() {
        if (!this._renderDone) {
            return;
        }
        this._importLocalTemplateSlots();
        this._importGlobalTemplateSlots();
    }

    _importLocalTemplateSlots() {
        if (this._localTemplateSlotsImported) {
            return;
        }