import { proxyCustomElement, HTMLElement, getAssetPath, h, Host } from '@stencil/core/internal/client';
import { L as Locale } from './locale.js';

const aboutCss = "button.button-secondary{border-color:var(--color-border-neutral-default)}:host{--spacing-body-block-start:24px;--spacing-body-block-end:24px;--spacing-body-inline-start:16px;--spacing-body-inline-end:16px;display:grid;inline-size:100%;block-size:100%;gap:var(--spacing-gap-xl);overflow:auto;grid-template-rows:max-content 1fr max-content;background-color:var(--elevation-background-color, var(--color-accent-surface-elevation-2));color:var(--color-text-neutral-default);text-align:center}.section{display:contents}.header{display:flex;flex-direction:column;gap:var(--spacing-gap-m)}.main{overflow:auto;display:grid;grid-template-rows:1fr max-content;gap:var(--spacing-gap-xxl)}.logo__container{display:flex;flex-direction:column;gap:var(--spacing-gap-l);align-items:center;margin:unset}.logo__img{inline-size:28px;block-size:28px}.logotype{color:var(--color-text-neutral-default)}.versions__container{overflow:hidden;border:1px solid var(--color-border-surface-on-elevation-1);border-radius:4px;display:grid;grid-template-rows:1fr max-content;inline-size:100%}.versions__container button{justify-self:center;min-inline-size:72px}.versions__container-footer{padding:14px}.versions__list{overflow:auto;list-style:none;margin:0;padding:14px;display:flex;flex-direction:column;gap:var(--spacing-gap-m)}.link-underlined{text-decoration:underline;color:var(--color-text-neutral-default)}.link-underlined:hover{color:var(--color-text-neutral-hover)}.link-underlined:active{color:var(--color-text-neutral-pressed)}.links-container{display:flex;gap:var(--spacing-gap-m)}.footer{display:flex;align-items:center;flex-direction:column;gap:var(--spacing-gap-m);color:var(--color-text-neutral-disabled)}";

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 _GxIdeAbout_componentLocale, _GxIdeAbout_nextLogo, _GxIdeAbout_copyVersionsHandler;
const CSS_BUNDLES = [
    "resets/box-sizing",
    "utils/typography",
    "utils/elevation",
    "components/button",
    "chameleon/scrollbar"
];
const GxIdeAbout$1 = /*@__PURE__*/ proxyCustomElement(class GxIdeAbout extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        _GxIdeAbout_componentLocale.set(this, void 0);
        _GxIdeAbout_nextLogo.set(this, getAssetPath(`./gx-ide-assets/about/images/next-logo.svg`));
        _GxIdeAbout_copyVersionsHandler.set(this, () => {
            this.copying = true;
            setTimeout(() => {
                this.copying = false;
            }, 1000);
            // be cautions with spaces and indentaiton on the following .writeText
            navigator.clipboard.writeText(`${this.appVersion}\n
${__classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").copyVersionsAdditionalText}${this.versions
                .map(version => `- ${version}`)
                .join("\n")}`);
        });
        this.appVersion = undefined;
        this.versions = [];
        this.detailsCallback = undefined;
        this.privacyPolicyCallback = undefined;
        this.termsAndConditionsCallback = undefined;
        this.copying = false;
    }
    async componentWillLoad() {
        __classPrivateFieldSet(this, _GxIdeAbout_componentLocale, await Locale.getComponentStrings(this.el), "f");
    }
    render() {
        const renderPrivacyAndTerms = this.privacyPolicyCallback && this.termsAndConditionsCallback;
        const renderPrivacyOrTerms = this.privacyPolicyCallback || this.termsAndConditionsCallback;
        return (h(Host, { class: "scrollable" }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, h("header", { class: "header" }, h("figure", { class: "logo__container" }, h("img", { class: "logo__img", src: __classPrivateFieldGet(this, _GxIdeAbout_nextLogo, "f"), alt: __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").logoAlt }), h("figcaption", { class: "body-semi-bold-m logotype" }, "GeneXus Next")), this.appVersion && (h("p", { class: "body-reuglar-m" }, __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").nextVersion, " ", h("span", null, this.appVersion)))), h("div", { class: "main" }, this.versions.length ? (h("div", { class: "versions__container elevation-1" }, h("ul", { class: "versions__list scrollable" }, this.versions.map(version => {
            return h("li", { class: "body-regular-s" }, version);
        })), h("div", { class: "versions__container-footer" }, h("button", { class: "button-secondary", type: "button", onClick: __classPrivateFieldGet(this, _GxIdeAbout_copyVersionsHandler, "f"), disabled: this.copying }, this.copying
            ? __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").copied
            : __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").copy)))) : null, this.detailsCallback && (h("button", { class: "button-tertiary", type: "button", onClick: this.detailsCallback }, __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").detailsAndAcknowledgmentes))), h("footer", { class: "body-regular-s footer" }, renderPrivacyOrTerms && (h("div", { class: "links-container", hidden: !renderPrivacyAndTerms }, this.privacyPolicyCallback && (h("button", { class: "link-underlined caption-regular-m", type: "button", onClick: this.privacyPolicyCallback }, __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").privacyPolicy)), renderPrivacyAndTerms && "|", this.termsAndConditionsCallback && (h("button", { class: "link-underlined caption-regular-m", type: "button", onClick: this.termsAndConditionsCallback }, __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").termsAndConditions)))), __classPrivateFieldGet(this, _GxIdeAbout_componentLocale, "f").copyright))));
    }
    static get assetsDirs() { return ["gx-ide-assets/about"]; }
    get el() { return this; }
    static get style() { return aboutCss; }
}, [1, "gx-ide-about", {
        "appVersion": [1, "app-version"],
        "versions": [16],
        "detailsCallback": [16],
        "privacyPolicyCallback": [16],
        "termsAndConditionsCallback": [16],
        "copying": [32]
    }]);
_GxIdeAbout_componentLocale = new WeakMap(), _GxIdeAbout_nextLogo = new WeakMap(), _GxIdeAbout_copyVersionsHandler = new WeakMap();
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["gx-ide-about"];
    components.forEach(tagName => { switch (tagName) {
        case "gx-ide-about":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, GxIdeAbout$1);
            }
            break;
    } });
}

const GxIdeAbout = GxIdeAbout$1;
const defineCustomElement = defineCustomElement$1;

export { GxIdeAbout, defineCustomElement };

//# sourceMappingURL=gx-ide-about.js.map