import { g as getAssetPath, r as registerInstance, h, H as Host, a as getElement } from './index-b153bfd0.js';
import { g as getIconPath } from './assets-manager-7d6fc08f.js';
import './mer-animated-dots-7cbae6ef.js';
import 'lit';
import 'lit/directives/when.js';
import 'lit/directives/if-defined.js';
import { L as Locale } from './locale-e5107fad.js';

const pluginDetailsCss = "ch-tab-render.tab{background-color:transparent;border-color:transparent}ch-tab-render.tab::part(tab-list block-start){border-block-end:none}ch-tab-render.tab::part(tab block closable),ch-tab-render.tab::part(tab block not-closable){background-color:transparent}:host{display:grid;block-size:100%;grid-template-areas:\"header header\" \"main aside\";grid-template-rows:max-content 1fr;grid-template-columns:1fr 280px;row-gap:var(--spacing-gap-l)}.section{display:contents}.header{display:grid;grid-area:header;grid-template-areas:\"plugin-icon plugin-details\";grid-template-columns:64px 1fr;column-gap:var(--spacing-gap-xl);padding-block-start:var(--spacing-padding-xxl);padding-block-end:var(--spacing-padding-xl);padding-inline:var(--spacing-padding-xxl)}.plugin__icon{grid-area:plugin-icon;inline-size:100%;block-size:auto;display:block}.plugin__details{grid-area:plugin-details;display:flex;flex-direction:column;gap:var(--spacing-gap-m)}.plugin__publisher{display:flex;align-items:center;gap:var(--spacing-gap-xs)}.plugin__description{line-height:var(--line-height-spacious)}.plugin__actions-container{margin-block-start:var(--spacing-padding-m);align-items:center}.action-button{min-inline-size:100px}.action-button.more-versions-available{border-start-end-radius:0 !important;border-end-end-radius:0 !important}.installed-container{display:flex;align-items:center;gap:var(--spacing-gap-m)}.installed-container ch-image{--ch-image-size:20px}.main{grid-area:main}.docsTab{block-size:100%}.aside{grid-area:aside;overflow:auto;border-block-start:1px solid var(--items-container__border-color)}.fields__list{list-style:none;padding:0;margin:0;font-size:var(--font-size-body-s)}.plugin__info-category{display:flex;flex-direction:column;gap:var(--spacing-gap-m)}.plugin__info-category:not(:first-child){padding-block-start:var(--spacing-padding-xl);margin-block-start:var(--spacing-padding-xl);border-block-start:1px solid var(--color-border-surface-on-elevation-1)}.fields__list:not(.fields__list--as-tags){display:flex;flex-direction:column;gap:var(--spacing-gap-m)}.fields__list:not(.fields__list--as-tags) .field__li{display:flex;gap:var(--spacing-gap-xl)}.fields__list--as-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-gap-m)}.fields__list--as-tags .field__li{border:1px solid var(--color-border-surface-on-elevation-1);padding-block:var(--spacing-padding-xxs);padding-inline:var(--spacing-padding-m);border-radius:4px;text-transform:lowercase}.fields__list--as-tags .field__link{color:var(--color-text-neutral-strawberry)}.fields__list--as-tags .field__link:hover{color:var(--color-accent-primary-default)}.fields__list--as-tags .field__link:active{color:var(--color-accent-primary-hover)}.field__name,.field__value{flex:1}.field__link{color:var(--color-accent-primary-default)}.field__link:hover{color:var(--color-accent-primary-hover)}.field__link:active{color:var(--color-accent-primary-pressed)}.docsTab{background-color:transparent !important}.dropdown.button-icon-only::part(expandable-button){padding:calc( (var(--control-block-size) - 2 * var(--control-border-width) - 16px) / 2 ) !important;border-start-start-radius:0 !important;border-end-start-radius:0 !important}.version-buttons-container{display:flex;align-items:center;gap:1px}ch-markdown-viewer{block-size:100%;overflow:auto}.text-underline{text-decoration:underline}";

var __classPrivateFieldGet = (undefined && undefined.__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 = (undefined && undefined.__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 _GxIdePluginDetails_componentLocale, _GxIdePluginDetails_chMarkdownViewer, _GxIdePluginDetails_docSectionIdDescriptionMap, _GxIdePluginDetails_versionsMenuOptionsModel, _GxIdePluginDetails_menuVersionSelectedHandler, _GxIdePluginDetails_renderUninstallButton, _GxIdePluginDetails_installClickedHandler, _GxIdePluginDetails_updateVersionHandler, _GxIdePluginDetails_openLinkHandler, _GxIdePluginDetails_uninstallClickedHandler, _GxIdePluginDetails_renderActionButtons, _GxIdePluginDetails_tabSelectionChangedHandler, _GxIdePluginDetails_renderDocSectionsSlots, _GxIdePluginDetails_returnFormatedId, _GxIdePluginDetails_renderLinkTag, _GxIdePluginDetails_renderAsideContent;
const USER_ICON = getIconPath({
    category: "system",
    name: "user",
    colorType: "on-surface"
});
const CHEVRON_DOWN_ICON = getIconPath({
    category: "system",
    name: "chevron-down",
    colorType: "on-primary"
});
const CHECK_CIRCLE_ICON = getIconPath({
    category: "system",
    name: "check-circle",
    colorType: "success"
});
// plugin icon if no iconUri was provided
const EXTENSION_ICON_IMG = getAssetPath(`./gx-ide-assets/plugin-manager/images/plugin-icon.svg`);
const CSS_BUNDLES = [
    "resets/box-sizing",
    "chameleon/scrollbar",
    "components/button",
    "components/dropdown",
    "components/edit",
    "components/icon",
    "components/list-box",
    "components/tab",
    "utils/form",
    "utils/layout",
    "utils/spacing",
    "utils/typography"
];
const GxIdePluginDetails = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        /**
         * The component hard-coded strings translations.
         */
        // eslint-disable-next-line @stencil-community/own-props-must-be-private
        _GxIdePluginDetails_componentLocale.set(this, void 0);
        _GxIdePluginDetails_chMarkdownViewer.set(this, void 0);
        // A map between docSection "id", and docSection "description".
        // "id" is generated inside this component.
        _GxIdePluginDetails_docSectionIdDescriptionMap.set(this, new Map());
        _GxIdePluginDetails_versionsMenuOptionsModel.set(this, () => {
            var _a;
            const versionsToUpdateMenusModel = (_a = this.data.versions) === null || _a === void 0 ? void 0 : _a.map(version => {
                return { id: version, caption: version };
            });
            return versionsToUpdateMenusModel;
        });
        _GxIdePluginDetails_menuVersionSelectedHandler.set(this, (event) => {
            const selectedVersion = event.detail.id;
            this.installCallback(selectedVersion);
        });
        _GxIdePluginDetails_renderUninstallButton.set(this, () => {
            return (h("button", { class: "button-tertiary", onClick: __classPrivateFieldGet(this, _GxIdePluginDetails_uninstallClickedHandler, "f") }, __classPrivateFieldGet(this, _GxIdePluginDetails_componentLocale, "f").actions.uninstall));
        });
        _GxIdePluginDetails_installClickedHandler.set(this, () => {
            this.installCallback();
        });
        _GxIdePluginDetails_updateVersionHandler.set(this, (id) => () => {
            this.installCallback(id);
        });
        _GxIdePluginDetails_openLinkHandler.set(this, (link) => (event) => {
            if (this.openLinkCallback) {
                event.preventDefault();
                this.openLinkCallback(link);
            }
        });
        _GxIdePluginDetails_uninstallClickedHandler.set(this, () => {
            this.uninstallCallback();
        });
        _GxIdePluginDetails_renderActionButtons.set(this, () => {
            var _a;
            let actionButtonCaption;
            let actionButtonClasses = "button-primary action-button";
            let actionButtonCallback;
            const moreVersionsToUpdate = (_a = this.data.versions) === null || _a === void 0 ? void 0 : _a.length;
            if (!this.data.installed) {
                actionButtonCaption = __classPrivateFieldGet(this, _GxIdePluginDetails_componentLocale, "f").actions.install;
                actionButtonCallback = __classPrivateFieldGet(this, _GxIdePluginDetails_installClickedHandler, "f");
            }
            else if (this.data.updateVersion) {
                actionButtonCaption = `${__classPrivateFieldGet(this, _GxIdePluginDetails_componentLocale, "f").actions.updateTo} ${this.data.updateVersion}`;
                actionButtonCallback = __classPrivateFieldGet(this, _GxIdePluginDetails_updateVersionHandler, "f").call(this, this.data.updateVersion);
            }
            else {
                actionButtonCaption = __classPrivateFieldGet(this, _GxIdePluginDetails_componentLocale, "f").actions.installed;
            }
            if (moreVersionsToUpdate) {
                actionButtonClasses = `${actionButtonClasses} more-versions-available`;
            }
            return [
                h("div", { class: "version-buttons-container" }, h("button", { class: actionButtonClasses, onClick: actionButtonCallback }, actionButtonCaption), moreVersionsToUpdate ? (h("ch-action-menu-render", { class: "dropdown button-primary button-icon-only", blockAlign: "outside-end", inlineAlign: "inside-start", model: __classPrivateFieldGet(this, _GxIdePluginDetails_versionsMenuOptionsModel, "f").call(this), onButtonClick: __classPrivateFieldGet(this, _GxIdePluginDetails_menuVersionSelectedHandler, "f") }, h("ch-image", { src: CHEVRON_DOWN_ICON, class: "icon-m" }))) : null)
            ];
        });
        _GxIdePluginDetails_tabSelectionChangedHandler.set(this, (event) => {
            this.selectedTabId = event.detail.newSelectedId;
        });
        _GxIdePluginDetails_renderDocSectionsSlots.set(this, () => {
            return this.docsTabModel.map(docSectionTab => {
                if (docSectionTab.id === this.selectedTabId) {
                    const markdownValue = __classPrivateFieldGet(this, _GxIdePluginDetails_docSectionIdDescriptionMap, "f").get(docSectionTab.id);
                    return (h("ch-markdown-viewer", { ref: (el) => (__classPrivateFieldSet(this, _GxIdePluginDetails_chMarkdownViewer, el, "f")), slot: docSectionTab.id, key: docSectionTab.id, class: "markdown spacing-body scrollable", theme: "components/markdown-viewer", value: markdownValue }));
                }
            });
        });
        _GxIdePluginDetails_returnFormatedId.set(this, (rawId) => {
            return rawId.toLowerCase().replace(/\s+/g, "-");
        });
        _GxIdePluginDetails_renderLinkTag.set(this, (href, label, cssClass, chImageSrc) => {
            return (h("a", { href: href, target: "_blank", onClick: __classPrivateFieldGet(this, _GxIdePluginDetails_openLinkHandler, "f").call(this, href), class: cssClass }, chImageSrc && h("ch-image", { src: chImageSrc, class: "icon-m" }), label));
        });
        _GxIdePluginDetails_renderAsideContent.set(this, () => {
            return this.data.infoCategories.map(infoCategory => {
                return (h("div", { class: "plugin__info-category" }, h("h3", { class: "subtitle-semi-bold-s" }, infoCategory.name), h("ul", { class: {
                        "fields__list": true,
                        "fields__list--as-tags": infoCategory.displayAsTags
                    } }, infoCategory.fields.map(field => {
                    // If the field name isn’t specified, only the value is shown — usually a link.
                    const fieldValue = typeof field.value === "string"
                        ? field.value
                        : __classPrivateFieldGet(this, _GxIdePluginDetails_renderLinkTag, "f").call(this, field.value.url, field.value.text, "field__link");
                    return (h("li", { class: "field__li" }, field.name && !infoCategory.displayAsTags
                        ? // displaysAsTags forces the items to be displayed as tags
                            // no span.field__name and span.field__value
                            [
                                h("span", { class: "field__name body-semi-bold-s" }, field.name),
                                h("span", { class: "field__value body-regular-s" }, fieldValue)
                            ]
                        : fieldValue));
                }))));
            });
        });
        this.docsTabModel = [];
        this.selectedTabId = undefined;
        this.data = undefined;
        this.installCallback = undefined;
        this.openLinkCallback = undefined;
        this.uninstallCallback = undefined;
    }
    async componentWillLoad() {
        var _a;
        __classPrivateFieldSet(this, _GxIdePluginDetails_componentLocale, await Locale.getComponentStrings(this.el), "f");
        if ((_a = this.data.docSections) === null || _a === void 0 ? void 0 : _a.length) {
            this.docsTabModel = this.data.docSections.map((docSection, i) => {
                const formatedId = __classPrivateFieldGet(this, _GxIdePluginDetails_returnFormatedId, "f").call(this, docSection.name);
                __classPrivateFieldGet(this, _GxIdePluginDetails_docSectionIdDescriptionMap, "f").set(formatedId, docSection.content);
                if (i === 0) {
                    this.selectedTabId = formatedId;
                }
                return {
                    id: formatedId,
                    name: docSection.name
                };
            });
        }
    }
    componentDidLoad() {
        __classPrivateFieldGet(this, _GxIdePluginDetails_chMarkdownViewer, "f").addEventListener("click", event => {
            // Listens for clicks on links inside <ch-markdown-viewer>.
            // If a link (<a>) is clicked and openLinkCallback is defined,
            // it prevents the default navigation and delegates the event
            // to this.#openLinkHandler, passing the link's href.
            const path = event.composedPath();
            const link = path.find(el => el instanceof HTMLAnchorElement);
            if (link === null || link === void 0 ? void 0 : link.href) {
                __classPrivateFieldGet(this, _GxIdePluginDetails_openLinkHandler, "f").call(this, link.href)(event);
            }
        });
    }
    render() {
        const renderActionButtons = !this.data.installed ||
            (this.data.installed && !!this.data.updateVersion);
        const titleLinkDataText = this.data.name.text;
        const titleLinkDataUrl = this.data.name.url;
        const titleHasLink = titleLinkDataText && titleLinkDataUrl;
        const titleText = titleLinkDataText || this.data.name;
        const publisherDataText = this.data.publisher.text;
        const publisherDataUrl = this.data.publisher.url;
        const publisherHasLink = publisherDataText && publisherDataUrl;
        const publisherText = publisherDataText || this.data.publisher;
        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, h("header", { class: "header" }, h("img", { class: "plugin__icon", src: this.data.iconUrl || EXTENSION_ICON_IMG, alt: "plugin extension icon" }), h("div", { class: "plugin__details" }, titleHasLink ? (h("h2", { class: "heading-5 has-link" }, __classPrivateFieldGet(this, _GxIdePluginDetails_renderLinkTag, "f").call(this, titleLinkDataUrl, titleText, "text-underline"))) : (h("h2", { class: "heading-5" }, titleText)), publisherHasLink ? (__classPrivateFieldGet(this, _GxIdePluginDetails_renderLinkTag, "f").call(this, publisherDataUrl, titleText, "text-underline plugin__publisher caption-semi-bold-l", USER_ICON)) : (h("p", { class: "plugin__publisher caption-semi-bold-l" }, h("ch-image", { src: USER_ICON, class: "icon-s" }), publisherText)), h("p", { class: "plugin__description" }, this.data.description), h("div", { class: "buttons-spacer plugin__actions-container" }, renderActionButtons ? (__classPrivateFieldGet(this, _GxIdePluginDetails_renderActionButtons, "f").call(this)) : (
        // installed and no updates
        h("p", { class: "installed-container subtitle-semi-bold-s" }, h("ch-image", { src: CHECK_CIRCLE_ICON, class: "icon-s" }), __classPrivateFieldGet(this, _GxIdePluginDetails_componentLocale, "f").actions.installed)), this.data.installed && __classPrivateFieldGet(this, _GxIdePluginDetails_renderUninstallButton, "f").call(this)))), h("div", { class: "main" }, this.docsTabModel.length > 0 && (h("ch-tab-render", { class: "tab docsTab scrollable", tabListPosition: "block-start", overflow: "auto", contain: "size", model: this.docsTabModel, onSelectedItemChange: __classPrivateFieldGet(this, _GxIdePluginDetails_tabSelectionChangedHandler, "f"), selectedId: this.selectedTabId }, __classPrivateFieldGet(this, _GxIdePluginDetails_renderDocSectionsSlots, "f").call(this)))), h("div", { class: "aside spacing-body scrollable" }, __classPrivateFieldGet(this, _GxIdePluginDetails_renderAsideContent, "f").call(this)))));
    }
    static get assetsDirs() { return ["gx-ide-assets/plugin-details"]; }
    get el() { return getElement(this); }
};
_GxIdePluginDetails_componentLocale = new WeakMap(), _GxIdePluginDetails_chMarkdownViewer = new WeakMap(), _GxIdePluginDetails_docSectionIdDescriptionMap = new WeakMap(), _GxIdePluginDetails_versionsMenuOptionsModel = new WeakMap(), _GxIdePluginDetails_menuVersionSelectedHandler = new WeakMap(), _GxIdePluginDetails_renderUninstallButton = new WeakMap(), _GxIdePluginDetails_installClickedHandler = new WeakMap(), _GxIdePluginDetails_updateVersionHandler = new WeakMap(), _GxIdePluginDetails_openLinkHandler = new WeakMap(), _GxIdePluginDetails_uninstallClickedHandler = new WeakMap(), _GxIdePluginDetails_renderActionButtons = new WeakMap(), _GxIdePluginDetails_tabSelectionChangedHandler = new WeakMap(), _GxIdePluginDetails_renderDocSectionsSlots = new WeakMap(), _GxIdePluginDetails_returnFormatedId = new WeakMap(), _GxIdePluginDetails_renderLinkTag = new WeakMap(), _GxIdePluginDetails_renderAsideContent = new WeakMap();
GxIdePluginDetails.style = pluginDetailsCss;

export { GxIdePluginDetails as gx_ide_plugin_details };

//# sourceMappingURL=gx-ide-plugin-details.entry.js.map