import { findParentElement } from "../../util/dom";
import { PlatformServiceName, } from "@limetech/lime-web-components";
import { getElement, h } from "@stencil/core";
/**
 * A mention
 *
 * Creates a mention that can be displayed as an indicator that a specific user have
 * been mentioned. The mentioned user descriptive should be added as a slot along with
 * the limetype and object id of the mentioned user object.
 *
 * This component is internally used together with `limebb-text-editor` to
 * render "mentioned" coworkers inside the `<p>` elements.
 *
 * :::note
 * Platform will be fetched from the DOM if not supplied
 * :::
 *
 * @exampleComponent limebb-example-mention
 * @exampleComponent limebb-example-mention-with-invalid-object
 * @exampleComponent limebb-example-mention-multi-lines
 * @private
 */
export class Mention {
    connectedCallback() {
        const element = findParentElement(getElement(this), this.hasPlatform);
        if (!element) {
            return;
        }
        this.loadLimeObject(element.platform);
    }
    hasPlatform(element) {
        if (!('platform' in element)) {
            return false;
        }
        if (!element.platform) {
            return false;
        }
        return typeof element.platform === 'object';
    }
    async loadLimeObject(platform) {
        const repository = platform.get(PlatformServiceName.LimeObjectRepository);
        this.limeobject = repository.getObject(this.limetype, this.objectid);
        if (this.limeobject) {
            return;
        }
        try {
            await repository.loadObject(this.limetype, this.objectid);
        }
        catch (_a) {
            console.error('Could not load mentioned object');
        }
        this.limeobject = repository.getObject(this.limetype, this.objectid);
    }
    render() {
        if (!this.limeobject) {
            return this.renderSlot();
        }
        return this.renderLimeObject(this.limeobject);
    }
    renderLimeObject(limeobject) {
        return (h("a", { href: `object/${this.limetype}/${this.objectid}` }, limeobject.descriptive, this.renderSlot({ hidden: true })));
    }
    renderSlot(attributes = {}) {
        return (h("span", Object.assign({}, attributes), h("slot", null)));
    }
    static get is() { return "limebb-mention"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["mention.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["mention.css"]
        };
    }
    static get properties() {
        return {
            "limetype": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Name of the limetype of the mentioned object."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "limetype"
            },
            "objectid": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Id of the mentioned object."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "objectid"
            }
        };
    }
    static get states() {
        return {
            "limeobject": {}
        };
    }
}
