var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { umbExtensionsRegistry } from './registry.js';
import { property, state } from '../../../external/lit/index.js';
import { UmbLitElement } from '../lit-element/index.js';
import { UmbExtensionElementAndApiInitializer } from '../../../libs/extension-api/index.js';
export class UmbExtensionElementAndApiSlotElementBase extends UmbLitElement {
    get alias() {
        return this.#alias;
    }
    set alias(newVal) {
        this.#alias = newVal;
        this.#observeManifest();
    }
    #alias;
    set props(newVal) {
        // TODO, compare changes since last time. only reset the ones that changed. This might be better done by the controller is self:
        this.#props = newVal;
        if (this.#extensionController) {
            this.#extensionController.elementProps = newVal;
        }
    }
    get props() {
        return this.#props;
    }
    #props = {};
    #extensionController;
    #observeManifest() {
        if (!this.alias)
            return;
        this.#extensionController = new UmbExtensionElementAndApiInitializer(this, umbExtensionsRegistry, this.alias, [this], this.#extensionChanged, this.getDefaultElementName(), this.getDefaultApiConstructor?.());
        this.#extensionController.elementProps = this.props;
    }
    #extensionChanged = (isPermitted, controller) => {
        this.apiChanged(isPermitted ? controller.api : undefined);
        this.elementChanged(isPermitted ? controller.component : undefined);
    };
    /**
     * Called when the API is changed.
     * @protected
     * @param {(ManifestType['API_TYPE'] | undefined)} api
     * @memberof UmbExtensionElementAndApiSlotElementBase
     */
    apiChanged(api) {
        this._api = api;
    }
    /**
     * Called when the element is changed.
     * @protected
     * @param {(ManifestType['ELEMENT_TYPE'] | undefined)} element
     * @memberof UmbExtensionElementAndApiSlotElementBase
     */
    elementChanged(element) {
        this._element = element;
        this.requestUpdate('_element');
    }
    /**
     * Render the element.
     * @returns {*}
     * @memberof UmbExtensionElementAndApiSlotElementBase
     */
    render() {
        return this._element;
    }
    /**
     * Disable the Shadow DOM for this element. This is needed because this is a wrapper element and should not stop the event propagation.
     */
    createRenderRoot() {
        return this;
    }
}
__decorate([
    property({ type: String, reflect: true })
], UmbExtensionElementAndApiSlotElementBase.prototype, "alias", null);
__decorate([
    property({ type: Object, attribute: false })
], UmbExtensionElementAndApiSlotElementBase.prototype, "props", null);
__decorate([
    state()
], UmbExtensionElementAndApiSlotElementBase.prototype, "_api", void 0);
__decorate([
    state()
], UmbExtensionElementAndApiSlotElementBase.prototype, "_element", void 0);
