var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
    if (kind === "a" && !f)
        throw new TypeError("Private accessor was defined without a getter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
        throw new TypeError("Cannot read private member from an object whose class did not declare it");
    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
    if (kind === "m")
        throw new TypeError("Private method is not writable");
    if (kind === "a" && !f)
        throw new TypeError("Private accessor was defined without a setter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
        throw new TypeError("Cannot write private member to an object whose class did not declare it");
    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var _GxIdePluginManager_componentLocale, _GxIdePluginManager_animateEmptyState, _GxIdePluginManager_actionListButtonClickHandler, _GxIdePluginManager_mapPluginDataToActionListModel, _GxIdePluginManager_pluginsFilterInputHandler, _GxIdePluginManager_evaluateContentToDisplay, _GxIdePluginManager_renderLoader, _GxIdePluginManager_pluginSelectedHandler;
import { Host, h, getAssetPath } from "@stencil/core";
import { getIconPath } from "@genexus/mercury";
import { Locale } from "../../common/locale";
import { config } from "../../common/config";
const FILTER_ICON = getIconPath({
    category: "system",
    name: "filters",
    colorType: "on-surface"
});
// plugin icon if no iconUrl was provided
const EXTENSION_ICON_IMG = getAssetPath(`./gx-ide-assets/plugin-manager/images/plugin-icon.svg`);
const CSS_BUNDLES = [
    "resets/box-sizing",
    "components/list-box",
    "components/button",
    "components/edit",
    "utils/form",
    "utils/layout",
    "utils/typography",
    "utils/spacing",
    "chameleon/scrollbar"
];
export class GxIdePluginManager {
    constructor() {
        /**
         * The component hard-coded strings translations.
         */
        // eslint-disable-next-line @stencil-community/own-props-must-be-private
        _GxIdePluginManager_componentLocale.set(this, void 0);
        _GxIdePluginManager_animateEmptyState.set(this, false);
        _GxIdePluginManager_actionListButtonClickHandler.set(this, (pluginId, action) => (event) => {
            event.stopPropagation();
            this.executeActionCallback(pluginId, action);
        });
        _GxIdePluginManager_mapPluginDataToActionListModel.set(this, (pluginsData) => {
            const pluginsActionListModel = [];
            const separatorItem = { type: "separator" };
            pluginsData === null || pluginsData === void 0 ? void 0 : pluginsData.forEach((pluginData, index) => {
                const hasActionButton = !!pluginData.action;
                const pluginItem = {
                    id: pluginData.id,
                    caption: pluginData.name,
                    imgSrc: pluginData.iconUrl,
                    type: "actionable",
                    additionalInformation: {
                        "stretch-start": {
                            center: [
                                {
                                    part: "custom-image",
                                    jsx: () => (h("img", { part: "custom-image", src: pluginData.iconUrl || EXTENSION_ICON_IMG, alt: `${__classPrivateFieldGet(this, _GxIdePluginManager_componentLocale, "f").logotype.replace("PLUGIN_NAME_PLACEHOLDER", pluginData.name)}`, loading: "lazy" }))
                                }
                            ]
                        },
                        "block-end": {
                            start: [
                                {
                                    part: "custom-description custom-button custom-container custom-brand custom-brand-icon custom-image item__block-end start",
                                    jsx: () => (h("div", { part: "custom-container", title: pluginData.description }, h("p", { part: "custom-description" }, pluginData.description), h("small", { part: "custom-brand" }, pluginData.publisher)))
                                }
                                // {
                                //   slot: "abcd"
                                // } as ActionListItemAdditionalSlot // slot not working
                            ]
                        },
                        "stretch-end": hasActionButton && {
                            center: [
                                {
                                    jsx: () => (h("button", { part: "custom-button", onClick: __classPrivateFieldGet(this, _GxIdePluginManager_actionListButtonClickHandler, "f").call(this, pluginData.id, pluginData.action) }, pluginData.action))
                                }
                            ]
                        }
                    }
                };
                if (index !== 0) {
                    pluginsActionListModel.push(separatorItem);
                }
                pluginsActionListModel.push(pluginItem);
            });
            return pluginsActionListModel;
        });
        _GxIdePluginManager_pluginsFilterInputHandler.set(this, async (event) => {
            this.loading = true;
            const filterValue = event.detail;
            this.plugins = await this.filterCallback(filterValue);
        });
        _GxIdePluginManager_evaluateContentToDisplay.set(this, () => {
            const pluginsToDisplay = this.pluginsActionListModel.length;
            return pluginsToDisplay ? (h("ch-action-list-render", { model: this.pluginsActionListModel, class: "list-box", selection: "single", onSelectedItemsChange: __classPrivateFieldGet(this, _GxIdePluginManager_pluginSelectedHandler, "f") })) : (h("gx-ide-empty-state", { isAnimated: __classPrivateFieldGet(this, _GxIdePluginManager_animateEmptyState, "f"), class: "recent-objects__empty-state", stateIconSrc: FILTER_ICON, stateTitle: __classPrivateFieldGet(this, _GxIdePluginManager_componentLocale, "f").emptyStateTitle, stateDescription: __classPrivateFieldGet(this, _GxIdePluginManager_componentLocale, "f").emptyStateDescription }));
        });
        _GxIdePluginManager_renderLoader.set(this, () => {
            __classPrivateFieldSet(this, _GxIdePluginManager_animateEmptyState, true, "f");
            return (h("gx-ide-loader", { loaderTitle: __classPrivateFieldGet(this, _GxIdePluginManager_componentLocale, "f").loaderTitle, description: __classPrivateFieldGet(this, _GxIdePluginManager_componentLocale, "f").loaderDescription, show: true }));
        });
        _GxIdePluginManager_pluginSelectedHandler.set(this, (event) => {
            var _a;
            const eventType = (_a = event.detail[0]) === null || _a === void 0 ? void 0 : _a.item.type;
            if (eventType === "actionable") {
                const pluginId = event.detail[0].item.id;
                this.showDetailsCallback(pluginId);
            }
        });
        this.loading = true;
        this.pluginsActionListModel = [];
        this.plugins = undefined;
        this.filterCallback = undefined;
        this.showDetailsCallback = undefined;
        this.executeActionCallback = undefined;
    }
    pluginsChangedHandler(newPlugins) {
        this.pluginsActionListModel =
            __classPrivateFieldGet(this, _GxIdePluginManager_mapPluginDataToActionListModel, "f").call(this, newPlugins);
        this.loading = false;
    }
    async componentWillLoad() {
        __classPrivateFieldSet(this, _GxIdePluginManager_componentLocale, await Locale.getComponentStrings(this.el), "f");
        this.pluginsChangedHandler(this.plugins);
    }
    render() {
        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "outer-container field-group" }, h("ch-edit", { id: "search-plugins-input", class: "input", accessibleName: __classPrivateFieldGet(this, _GxIdePluginManager_componentLocale, "f").accessibleName, placeholder: __classPrivateFieldGet(this, _GxIdePluginManager_componentLocale, "f").searchInputPlaceholder, debounce: config.inputDebounce, onInput: __classPrivateFieldGet(this, _GxIdePluginManager_pluginsFilterInputHandler, "f"), type: "search" }), h("div", { class: "inner-container" }, this.loading
            ? __classPrivateFieldGet(this, _GxIdePluginManager_renderLoader, "f").call(this)
            : __classPrivateFieldGet(this, _GxIdePluginManager_evaluateContentToDisplay, "f").call(this)))));
    }
    static get is() { return "gx-ide-plugin-explorer"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["plugin-explorer.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["plugin-explorer.css"]
        };
    }
    static get assetsDirs() { return ["gx-ide-assets/plugin-explorer"]; }
    static get properties() {
        return {
            "plugins": {
                "type": "unknown",
                "mutable": true,
                "complexType": {
                    "original": "PluginData[]",
                    "resolved": "PluginData[]",
                    "references": {
                        "PluginData": {
                            "location": "local",
                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/plugin-explorer/plugin-explorer.tsx",
                            "id": "src/components/plugin-explorer/plugin-explorer.tsx::PluginData"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "List of plugins to display. Usually used to initialize the component."
                }
            },
            "filterCallback": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "(text: string) => Promise<PluginData[]>",
                    "resolved": "(text: string) => Promise<PluginData[]>",
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        },
                        "PluginData": {
                            "location": "local",
                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/plugin-explorer/plugin-explorer.tsx",
                            "id": "src/components/plugin-explorer/plugin-explorer.tsx::PluginData"
                        }
                    }
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Callback that should be invoked when the user updates the filter.\nA debounce should be applied before invoking this function."
                }
            },
            "showDetailsCallback": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "(pluginId: string) => Promise<void>",
                    "resolved": "(pluginId: string) => Promise<void>",
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    }
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Callback that should be invoked when the user clicks or presses Enter\non a selected plugin item."
                }
            },
            "executeActionCallback": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "(\n    pluginId: string,\n    action: PluginAction\n  ) => Promise<void>",
                    "resolved": "(pluginId: string, action: PluginAction) => Promise<void>",
                    "references": {
                        "PluginAction": {
                            "location": "local",
                            "path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/plugin-explorer/plugin-explorer.tsx",
                            "id": "src/components/plugin-explorer/plugin-explorer.tsx::PluginAction"
                        },
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    }
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Callback that should be invoked when the user clicks on a plugin's action button."
                }
            }
        };
    }
    static get states() {
        return {
            "loading": {},
            "pluginsActionListModel": {}
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "plugins",
                "methodName": "pluginsChangedHandler"
            }];
    }
}
_GxIdePluginManager_componentLocale = new WeakMap(), _GxIdePluginManager_animateEmptyState = new WeakMap(), _GxIdePluginManager_actionListButtonClickHandler = new WeakMap(), _GxIdePluginManager_mapPluginDataToActionListModel = new WeakMap(), _GxIdePluginManager_pluginsFilterInputHandler = new WeakMap(), _GxIdePluginManager_evaluateContentToDisplay = new WeakMap(), _GxIdePluginManager_renderLoader = new WeakMap(), _GxIdePluginManager_pluginSelectedHandler = new WeakMap();
//# sourceMappingURL=plugin-explorer.js.map
