ui-lit/mixins/labled/index.js

UI Elements on LIT

export const labled = (superClass) => {
    class LabledElement extends superClass {
        constructor(...args) {
            super(...args);
            this._labels = [];
        }
        get labels() {
            return this._labels;
        }
        willUpdate(_changedProperties) {
            super.willUpdate(_changedProperties);
            if (_changedProperties.has('disabled')) {
                this._updateDisabled();
            }
        }
        _updateDisabled() {
            this._labels.forEach(it => {
                if (this.disabled) {
                    it.setAttribute('disabled', '');
                }
                else {
                    it.removeAttribute('disabled');
                }
            });
        }
        connectedCallback() {
            super.connectedCallback();
            this._notify();
        }
        disconnectedCallback() {
            super.disconnectedCallback();
            this._labels = [];
        }
        addLabel(label) {
            this._labels.push(label);
            this._updateDisabled();
        }
        removeLabel(label) {
            this._labels = this._labels.filter(l => l !== label);
        }
        _notify() {
            this.dispatchEvent(new CustomEvent('labledConnected', {
                composed: true,
                bubbles: true,
                detail: this
            }));
        }
    }
    return LabledElement;
};