@genexus/genexus-ide-ui 1.1.57 → 1.1.58

package/dist/components/launchpad-apis.js

@@ -0,0 +1,153 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { L as Locale } from './locale.js';
+import { d as defineCustomElement$1 } from './launchpad-api.js';
+
+const launchpadApisCss = ":host{display:block;block-size:100%;overflow:auto;background-color:var(--ch-color-surface-primary);color:var(--ch-color-text-primary)}.main{overflow:auto;display:block}.apis-container{padding:var(--mer-spacing--lg);display:flex;flex-direction:column;gap:var(--mer-spacing--md);max-width:100%}.api-item{background:var(--ch-color-surface-secondary);border:var(--mer-border__width--sm) solid var(--mer-border-color__dim);border-radius:0;overflow:hidden;transition:all var(--mer-timing--fast) ease;width:100%;max-width:100%;display:flex;flex-direction:column;min-height:var(--mer-spacing--4xl)}.api-item:hover{box-shadow:var(--mer-surface__elevation--02);transform:translateY(-2px);border-color:var(--mer-border-color__bright)}.api-header{padding:var(--mer-spacing--md);background:transparent;border-bottom:var(--mer-border__width--sm) solid var(--mer-border-color__dim);flex-shrink:0}.api-header .api-name{margin:0;color:var(--mer-text__bright);word-break:break-all;overflow-wrap:break-word}.api-content{overflow:hidden}.no-apis,.no-data{color:var(--mer-color__neutral-gray--400);font-style:italic;text-align:center;padding:var(--mer-spacing--md)}.no-apis p,.no-data p{font-size:var(--mer-font-size--lg);font-weight:var(--mer-font-weight--medium);line-height:var(--mer-line-height--relaxed)}";
+
+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 __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 _GxIdeLaunchpadApis_componentLocale, _GxIdeLaunchpadApis_ACCORDION_MODEL;
+const CSS_BUNDLES = [
+    "resets/box-sizing",
+    "components/accordion",
+    "utils/elevation",
+    "utils/layout",
+    "utils/typography",
+    "utils/spacing"
+];
+const GxIdeLaunchpadApis = /*@__PURE__*/ proxyCustomElement(class GxIdeLaunchpadApis extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.copyToClipboard = createEvent(this, "copyToClipboard", 7);
+        _GxIdeLaunchpadApis_componentLocale.set(this, void 0);
+        _GxIdeLaunchpadApis_ACCORDION_MODEL.set(this, []);
+        this.apis = undefined;
+        this.onObjectSelected = undefined;
+    }
+    async componentWillLoad() {
+        try {
+            __classPrivateFieldSet(this, _GxIdeLaunchpadApis_componentLocale, await Locale.getComponentStrings(this.element), "f");
+        }
+        catch (error) {
+            console.error("Error loading locale:", error);
+            __classPrivateFieldSet(this, _GxIdeLaunchpadApis_componentLocale, {}, "f");
+        }
+        this.initializeAccordionModel();
+    }
+    /**
+     * Initialize accordion model with dynamic sections for each API
+     */
+    initializeAccordionModel() {
+        if (!this.apis || !Array.isArray(this.apis)) {
+            __classPrivateFieldSet(this, _GxIdeLaunchpadApis_ACCORDION_MODEL, [], "f");
+            return;
+        }
+        __classPrivateFieldSet(this, _GxIdeLaunchpadApis_ACCORDION_MODEL, this.apis
+            .map((api, index) => {
+            let url;
+            if (typeof api === "string") {
+                url = api;
+            }
+            else if (api && typeof api === "object" && api.url) {
+                url = api.url.toString();
+            }
+            else {
+                return null;
+            }
+            const lastSlash = url.lastIndexOf("/");
+            const name = url.substring(lastSlash + 1, url.length).toUpperCase();
+            return {
+                id: `api-${index}`,
+                caption: name,
+                expanded: true
+            };
+        })
+            .filter(Boolean), "f");
+    }
+    renderApis() {
+        if (!this.apis || !Array.isArray(this.apis)) {
+            return null;
+        }
+        return this.apis
+            .map((api, index) => {
+            let apiData;
+            if (typeof api === "string") {
+                apiData = { url: api };
+            }
+            else if (api && typeof api === "object" && api.url) {
+                apiData = api;
+            }
+            else {
+                return null;
+            }
+            return (h("div", { key: `api-${index}`, slot: `api-${index}`, class: "api-content spacing-body" }, h("gx-ide-launchpad-api", { data: apiData, onObjectSelected: (event) => this.handleObjectSelection(event), onCopyToClipboard: (event) => this.handleCopyToClipboard(event) })));
+        })
+            .filter(Boolean);
+    }
+    /**
+     * Handles object selection from subcomponents
+     */
+    handleObjectSelection(event) {
+        if (this.onObjectSelected) {
+            this.onObjectSelected(event);
+        }
+    }
+    /**
+     * Handles copy to clipboard from subcomponents
+     */
+    handleCopyToClipboard(event) {
+        this.copyToClipboard.emit({ url: event.detail.url });
+    }
+    render() {
+        var _a;
+        if (!this.apis || this.apis.length === 0) {
+            return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "no-data" }, h("p", { class: "body-regular-s" }, ((_a = __classPrivateFieldGet(this, _GxIdeLaunchpadApis_componentLocale, "f")) === null || _a === void 0 ? void 0 : _a.noApis) || "No APIs available"))));
+        }
+        return (h(Host, { class: "widget spacing-body-inline-end" }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "main" }, h("ch-accordion-render", { class: "accordion-filled-header elevation-2 apis-accordion", model: __classPrivateFieldGet(this, _GxIdeLaunchpadApis_ACCORDION_MODEL, "f") }, this.renderApis()))));
+    }
+    static get assetsDirs() { return ["gx-ide-assets/launchpad-apis"]; }
+    get element() { return this; }
+    static get style() { return launchpadApisCss; }
+}, [1, "gx-ide-launchpad-apis", {
+        "apis": [16],
+        "onObjectSelected": [16]
+    }]);
+_GxIdeLaunchpadApis_componentLocale = new WeakMap(), _GxIdeLaunchpadApis_ACCORDION_MODEL = new WeakMap();
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["gx-ide-launchpad-apis", "gx-ide-launchpad-api"];
+    components.forEach(tagName => { switch (tagName) {
+        case "gx-ide-launchpad-apis":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, GxIdeLaunchpadApis);
+            }
+            break;
+        case "gx-ide-launchpad-api":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { GxIdeLaunchpadApis as G, defineCustomElement as d };
+
+//# sourceMappingURL=launchpad-apis.js.map

package/dist/components/launchpad-apis.js.map

@@ -0,0 +1 @@
+{"file":"launchpad-apis.js","mappings":"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","names":[],"sources":["src/components/launchpad/apis/launchpad-apis.scss?tag=gx-ide-launchpad-apis&encapsulation=shadow","src/components/launchpad/apis/launchpad-apis.tsx"],"sourcesContent":[":host {\n  display: block;\n  block-size: 100%;\n  overflow: auto;\n  background-color: var(--ch-color-surface-primary);\n  color: var(--ch-color-text-primary);\n}\n\n.main {\n  overflow: auto;\n  display: block;\n}\n\n.apis-container {\n  padding: var(--mer-spacing--lg);\n  display: flex;\n  flex-direction: column;\n  gap: var(--mer-spacing--md);\n  max-width: 100%;\n}\n\n.api-item {\n  background: var(--ch-color-surface-secondary);\n  border: var(--mer-border__width--sm) solid var(--mer-border-color__dim);\n  border-radius: 0;\n  overflow: hidden;\n  transition: all var(--mer-timing--fast) ease;\n  width: 100%;\n  max-width: 100%;\n  display: flex;\n  flex-direction: column;\n  min-height: var(--mer-spacing--4xl);\n\n  &:hover {\n    box-shadow: var(--mer-surface__elevation--02);\n    transform: translateY(-2px);\n    border-color: var(--mer-border-color__bright);\n  }\n}\n\n.api-header {\n  padding: var(--mer-spacing--md);\n  background: transparent;\n  border-bottom: var(--mer-border__width--sm) solid var(--mer-border-color__dim);\n  flex-shrink: 0;\n\n  .api-name {\n    margin: 0;\n    color: var(--mer-text__bright);\n    word-break: break-all;\n    overflow-wrap: break-word;\n  }\n}\n\n.api-content {\n  overflow: hidden;\n}\n\n.no-apis,\n.no-data {\n  color: var(--mer-color__neutral-gray--400);\n  font-style: italic;\n  text-align: center;\n  padding: var(--mer-spacing--md);\n\n  p {\n    font-size: var(--mer-font-size--lg);\n    font-weight: var(--mer-font-weight--medium);\n    line-height: var(--mer-line-height--relaxed);\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  Element,\n  h,\n  Event,\n  EventEmitter\n} from \"@stencil/core\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { AccordionModel } from \"@genexus/chameleon-controls-library\";\n\nimport { Locale } from \"../../../common/locale\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/accordion\",\n  \"utils/elevation\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"utils/spacing\"\n];\n\n@Component({\n  tag: \"gx-ide-launchpad-apis\",\n  styleUrl: \"launchpad-apis.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/launchpad-apis\"]\n})\nexport class GxIdeLaunchpadApis {\n  #componentLocale: any;\n  #ACCORDION_MODEL: AccordionModel = [];\n\n  @Prop() apis: Array<any>;\n  @Element() element: HTMLElement;\n\n  /**\n   * Callback function for object selection (passed from parent)\n   */\n  @Prop() onObjectSelected?: (event: any) => void;\n\n  /**\n   * Event emitted when copying to clipboard\n   */\n  @Event() copyToClipboard: EventEmitter<{ url: string }>;\n\n  async componentWillLoad() {\n    try {\n      this.#componentLocale = await Locale.getComponentStrings(this.element);\n    } catch (error) {\n      console.error(\"Error loading locale:\", error);\n      this.#componentLocale = {};\n    }\n\n    this.initializeAccordionModel();\n  }\n\n  /**\n   * Initialize accordion model with dynamic sections for each API\n   */\n  private initializeAccordionModel() {\n    if (!this.apis || !Array.isArray(this.apis)) {\n      this.#ACCORDION_MODEL = [];\n      return;\n    }\n\n    this.#ACCORDION_MODEL = this.apis\n      .map((api: any, index: number) => {\n        let url: string;\n\n        if (typeof api === \"string\") {\n          url = api;\n        } else if (api && typeof api === \"object\" && api.url) {\n          url = api.url.toString();\n        } else {\n          return null;\n        }\n\n        const lastSlash = url.lastIndexOf(\"/\");\n        const name = url.substring(lastSlash + 1, url.length).toUpperCase();\n\n        return {\n          id: `api-${index}`,\n          caption: name,\n          expanded: true\n        };\n      })\n      .filter(Boolean);\n  }\n\n  renderApis() {\n    if (!this.apis || !Array.isArray(this.apis)) {\n      return null;\n    }\n\n    return this.apis\n      .map((api: any, index: number) => {\n        let apiData: any;\n\n        if (typeof api === \"string\") {\n          apiData = { url: api };\n        } else if (api && typeof api === \"object\" && api.url) {\n          apiData = api;\n        } else {\n          return null;\n        }\n\n        return (\n          <div\n            key={`api-${index}`}\n            slot={`api-${index}`}\n            class=\"api-content spacing-body\"\n          >\n            <gx-ide-launchpad-api\n              data={apiData}\n              onObjectSelected={(event: any) =>\n                this.handleObjectSelection(event)\n              }\n              onCopyToClipboard={(event: any) =>\n                this.handleCopyToClipboard(event)\n              }\n            ></gx-ide-launchpad-api>\n          </div>\n        );\n      })\n      .filter(Boolean);\n  }\n\n  /**\n   * Handles object selection from subcomponents\n   */\n  private handleObjectSelection(event: any) {\n    if (this.onObjectSelected) {\n      this.onObjectSelected(event);\n    }\n  }\n\n  /**\n   * Handles copy to clipboard from subcomponents\n   */\n  private handleCopyToClipboard(event: any) {\n    this.copyToClipboard.emit({ url: event.detail.url });\n  }\n\n  render() {\n    if (!this.apis || this.apis.length === 0) {\n      return (\n        <Host class=\"widget\">\n          <ch-theme model={CSS_BUNDLES}></ch-theme>\n          <div class=\"no-data\">\n            <p class=\"body-regular-s\">\n              {this.#componentLocale?.noApis || \"No APIs available\"}\n            </p>\n          </div>\n        </Host>\n      );\n    }\n\n    return (\n      <Host class=\"widget spacing-body-inline-end\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n\n        <div class=\"main\">\n          <ch-accordion-render\n            class=\"accordion-filled-header elevation-2 apis-accordion\"\n            model={this.#ACCORDION_MODEL}\n          >\n            {this.renderApis()}\n          </ch-accordion-render>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/launchpad-native-apps.js

@@ -0,0 +1,216 @@
+import { getAssetPath, proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { g as getIconPath } from './mer-animated-dots.js';
+import 'lit';
+import 'lit/directives/when.js';
+import 'lit/directives/if-defined.js';
+import { L as Locale } from './locale.js';
+
+const launchpadNativeAppsCss = ".object-card{background:var(--mer-surface__elevation--02);border:var(--mer-border__width--sm) solid transparent;border-radius:var(--mer-border__radius--sm);padding:var(--mer-spacing--sm);display:flex;gap:var(--mer-spacing--sm);flex-direction:column;flex-shrink:0;text-align:left}.object-card:focus-visible{outline:none;border-color:var(--focus__outline-color)}.object-card:hover{cursor:pointer;border-color:var(--mer-border-color__primary--hover)}.object-card:active{border-color:var(--mer-border-color__primary--active)}.platform-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--card-min-inline-size, 300px), var(--card-max-inline-size, 1fr)));gap:var(--mer-spacing--sm);align-items:stretch}:host{display:block;block-size:100%;overflow:auto}.main{overflow:auto;display:block}ch-accordion-render{inline-size:100%;block-size:100%}.accordion-content{padding:var(--mer-spacing--md);inline-size:100%}.native-apps-accordion{inline-size:100%;block-size:100%}.platform-section{display:flex;align-items:center;gap:var(--mer-spacing--sm)}.app__apple-store{height:32px;cursor:pointer;transition:opacity var(--mer-timing--fast) ease}.app__apple-store:hover{opacity:0.8}.platform-grid{--card-min-inline-size:360px}.card-content{display:flex;gap:var(--mer-spacing--md);flex:1;width:100%}.card-content:focus{outline:none}.info-section{flex:1;display:flex;flex-direction:column;justify-content:space-between;width:100%}.app-info{display:flex;flex-direction:column;gap:var(--mer-spacing--2xs);flex:1}.name{color:var(--mer-text__bright)}.description{color:var(--mer-text__dim);margin:0;line-height:1.4}.dialog{--ch-dialog-block-size:400px;--ch-dialog-inline-size:350px;--ch-dialog-min-block-size:400px;--ch-dialog-min-inline-size:350px}.qr-container{display:flex;align-items:center;justify-content:center}.card-actions{display:flex;justify-content:space-between;align-items:center;padding-top:var(--mer-spacing--sm);border-top:var(--mer-border__width--sm) solid var(--mer-border-color__dim)}.no-data,.no-results{color:var(--mer-color__neutral-gray--400);font-style:italic;text-align:center;padding:var(--mer-spacing--md)}.no-data p,.no-results p{font-size:var(--mer-font-size--lg);font-weight:var(--mer-font-weight--medium);line-height:var(--mer-line-height--relaxed)}@media (max-width: 768px){.platform-grid{justify-content:center}.card-content{flex-direction:column;gap:var(--mer-spacing--sm)}.card-actions{flex-direction:column;gap:var(--mer-spacing--sm);align-items:stretch}}@media (max-width: 480px){.main{padding:var(--mer-spacing--sm)}.object-card{padding:var(--mer-spacing--sm)}.platform-grid{gap:var(--mer-spacing--sm);padding:var(--mer-spacing--sm)}}.android:after{content:\"\";display:block}";
+
+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 __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 _GxIdeLaunchpadNativeApps_instances, _GxIdeLaunchpadNativeApps_componentLocale, _GxIdeLaunchpadNativeApps_ACCORDION_MODEL, _GxIdeLaunchpadNativeApps_timeoutIds, _GxIdeLaunchpadNativeApps_getQRFillColor, _GxIdeLaunchpadNativeApps_getQRBackgroundColor, _GxIdeLaunchpadNativeApps_getCopyIcon, _GxIdeLaunchpadNativeApps_getQRIcon, _GxIdeLaunchpadNativeApps_copyToClipboardFunc, _GxIdeLaunchpadNativeApps_openAppStoreFunc, _GxIdeLaunchpadNativeApps_handleQRClick, _GxIdeLaunchpadNativeApps_handleCloseQRDialog, _GxIdeLaunchpadNativeApps_handleObjectClick, _GxIdeLaunchpadNativeApps_renderPlatformSection;
+const IOS_ID = "ios";
+const ANDROID_ID = "android";
+const APP_STORE_BADGE = getAssetPath("./gx-ide-assets/launchpad-native-apps/images/app-store-badge.svg");
+const ANDROID_LOGO = getAssetPath("./gx-ide-assets/launchpad-native-apps/images/android-logo.svg");
+const MAC_LOGO = getAssetPath("./gx-ide-assets/launchpad-native-apps/images/mac-logo.svg");
+const CSS_BUNDLES = [
+    "resets/box-sizing",
+    "components/accordion",
+    "components/button",
+    "components/dialog",
+    "components/icon",
+    "utils/elevation",
+    "utils/layout",
+    "utils/spacing",
+    "utils/typography"
+];
+const GxIdeLaunchpadNativeApps = /*@__PURE__*/ proxyCustomElement(class GxIdeLaunchpadNativeApps extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.copyToClipboard = createEvent(this, "copyToClipboard", 7);
+        this.openOnTheAppStore = createEvent(this, "openOnTheAppStore", 7);
+        _GxIdeLaunchpadNativeApps_instances.add(this);
+        _GxIdeLaunchpadNativeApps_componentLocale.set(this, void 0);
+        _GxIdeLaunchpadNativeApps_ACCORDION_MODEL.set(this, []);
+        _GxIdeLaunchpadNativeApps_timeoutIds.set(this, new Set());
+        this.objects = [];
+        this.filterValue = "";
+        this.order = {
+            orderCriteria: null,
+            ascending: null
+        };
+        this.page = 1;
+        this.perPage = 10;
+        this.onObjectSelected = undefined;
+        this.showCopiedMessage = {};
+        this.showQRDialog = false;
+        this.selectedObjectForQR = null;
+    }
+    async componentWillLoad() {
+        try {
+            __classPrivateFieldSet(this, _GxIdeLaunchpadNativeApps_componentLocale, await Locale.getComponentStrings(this.el), "f");
+        }
+        catch (error) {
+            console.error("Error loading locale:", error);
+            __classPrivateFieldSet(this, _GxIdeLaunchpadNativeApps_componentLocale, {}, "f");
+        }
+        __classPrivateFieldSet(this, _GxIdeLaunchpadNativeApps_ACCORDION_MODEL, [
+            {
+                id: IOS_ID,
+                caption: "iOS",
+                expanded: true
+            },
+            {
+                id: ANDROID_ID,
+                caption: "Android",
+                expanded: true
+            }
+        ], "f");
+    }
+    /**
+     * Cleanup method to prevent memory leaks
+     */
+    disconnectedCallback() {
+        if (__classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_timeoutIds, "f")) {
+            __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_timeoutIds, "f").forEach(timeoutId => {
+                if (timeoutId) {
+                    clearTimeout(timeoutId);
+                }
+            });
+            __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_timeoutIds, "f").clear();
+        }
+    }
+    render() {
+        var _a;
+        if (!this.objects || this.objects.length === 0) {
+            return (h("div", { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "no-data" }, h("p", { class: "body-regular-s" }, ((_a = __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_componentLocale, "f")) === null || _a === void 0 ? void 0 : _a.noData) ||
+                "No native applications data available"))));
+        }
+        return (h("div", { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "main" }, h("ch-accordion-render", { class: "accordion-filled-header elevation-2 native-apps-accordion", model: __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_ACCORDION_MODEL, "f") }, h("div", { slot: IOS_ID, class: "accordion-content spacing-body" }, __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_renderPlatformSection).call(this, IOS_ID)), h("div", { slot: ANDROID_ID, class: "accordion-content spacing-body" }, __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_renderPlatformSection).call(this, ANDROID_ID)))), h("ch-dialog", { class: "dialog", show: this.showQRDialog, "show-header": true, closable: true, "close-button-accessible-name": "Close QR code", onDialogClosed: () => __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_handleCloseQRDialog).call(this) }, this.selectedObjectForQR && (h("div", { class: "qr-container" }, h("ch-qr", { value: this.selectedObjectForQR.url || "", size: 200, "error-correction-level": "Low", class: "qr-code", fill: __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_getQRFillColor).call(this), background: __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_getQRBackgroundColor).call(this) }))))));
+    }
+    static get assetsDirs() { return ["gx-ide-assets/launchpad-native-apps"]; }
+    get el() { return this; }
+    static get style() { return launchpadNativeAppsCss; }
+}, [1, "gx-ide-launchpad-native-apps", {
+        "objects": [16],
+        "onObjectSelected": [16],
+        "filterValue": [32],
+        "order": [32],
+        "page": [32],
+        "perPage": [32],
+        "showCopiedMessage": [32],
+        "showQRDialog": [32],
+        "selectedObjectForQR": [32]
+    }]);
+_GxIdeLaunchpadNativeApps_componentLocale = new WeakMap(), _GxIdeLaunchpadNativeApps_ACCORDION_MODEL = new WeakMap(), _GxIdeLaunchpadNativeApps_timeoutIds = new WeakMap(), _GxIdeLaunchpadNativeApps_instances = new WeakSet(), _GxIdeLaunchpadNativeApps_getQRFillColor = function _GxIdeLaunchpadNativeApps_getQRFillColor() {
+    const computedStyle = getComputedStyle(document.documentElement);
+    return (computedStyle.getPropertyValue("--mer-text__on-surface").trim() ||
+        computedStyle.getPropertyValue("--mer-color__neutral-gray--200").trim() ||
+        "#49566d");
+}, _GxIdeLaunchpadNativeApps_getQRBackgroundColor = function _GxIdeLaunchpadNativeApps_getQRBackgroundColor() {
+    const computedStyle = getComputedStyle(document.documentElement);
+    return (computedStyle
+        .getPropertyValue("--mer-color__neutral-gray--1000")
+        .trim() || "#ffffff");
+}, _GxIdeLaunchpadNativeApps_getCopyIcon = function _GxIdeLaunchpadNativeApps_getCopyIcon() {
+    return getIconPath({
+        category: "system",
+        name: "copy",
+        colorType: "primary"
+    });
+}, _GxIdeLaunchpadNativeApps_getQRIcon = function _GxIdeLaunchpadNativeApps_getQRIcon() {
+    return getIconPath({
+        category: "system",
+        name: "qr-code",
+        colorType: "neutral"
+    });
+}, _GxIdeLaunchpadNativeApps_copyToClipboardFunc = function _GxIdeLaunchpadNativeApps_copyToClipboardFunc(object) {
+    this.copyToClipboard.emit({
+        url: object.url
+    });
+    if (object.url) {
+        navigator.clipboard
+            .writeText(object.url)
+            .then(() => {
+            const objectKey = `${object.name}-${object.url}`;
+            this.showCopiedMessage = Object.assign(Object.assign({}, this.showCopiedMessage), { [objectKey]: true });
+            const timeoutId = window.setTimeout(() => {
+                this.showCopiedMessage = Object.assign(Object.assign({}, this.showCopiedMessage), { [objectKey]: false });
+                __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_timeoutIds, "f").delete(timeoutId);
+            }, 2000);
+            __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_timeoutIds, "f").add(timeoutId);
+        })
+            .catch(err => {
+            console.error("Failed to copy text: ", err);
+        });
+    }
+}, _GxIdeLaunchpadNativeApps_openAppStoreFunc = function _GxIdeLaunchpadNativeApps_openAppStoreFunc(object) {
+    this.openOnTheAppStore.emit({
+        url: object.url
+    });
+    if (object.url) {
+        window.open(object.url, "_blank");
+    }
+}, _GxIdeLaunchpadNativeApps_handleQRClick = function _GxIdeLaunchpadNativeApps_handleQRClick(object) {
+    this.selectedObjectForQR = object;
+    this.showQRDialog = true;
+}, _GxIdeLaunchpadNativeApps_handleCloseQRDialog = function _GxIdeLaunchpadNativeApps_handleCloseQRDialog() {
+    this.showQRDialog = false;
+    this.selectedObjectForQR = null;
+}, _GxIdeLaunchpadNativeApps_handleObjectClick = function _GxIdeLaunchpadNativeApps_handleObjectClick(object) {
+    if (object.key && this.onObjectSelected) {
+        // Send the full key object as string in format "type|id"
+        const keyString = `${object.key.type}|${object.key.id}`;
+        this.onObjectSelected({ detail: { key: keyString } });
+    }
+}, _GxIdeLaunchpadNativeApps_renderPlatformSection = function _GxIdeLaunchpadNativeApps_renderPlatformSection(platformType) {
+    var _a, _b;
+    const platformIcon = platformType === IOS_ID ? (h("img", { src: MAC_LOGO, alt: "Apple iOS Logo" })) : (h("img", { src: ANDROID_LOGO, alt: "Android Logo" }));
+    const platformSection = this.objects.find(obj => obj.type === platformType);
+    if (!platformSection || platformSection.objects.length === 0) {
+        return (h("div", { class: "no-results" }, h("p", { class: "body-regular-s" }, ((_b = (_a = __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_componentLocale, "f")) === null || _a === void 0 ? void 0 : _a.noPlatformApps) === null || _b === void 0 ? void 0 : _b.replace("{platformType}", platformType)) || `No ${platformType} applications available`)));
+    }
+    return (h("div", { class: "platform-grid" }, platformSection.objects.map((object, index) => {
+        var _a, _b, _c;
+        return (h("div", { key: index, class: "object-card elevation-2", tabindex: "0", onClick: () => __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_handleObjectClick).call(this, object) }, h("div", { class: "card-content" }, h("div", { class: "info-section" }, h("div", { class: "app-info" }, h("h1", { class: "name body-semi-bold-s" }, object.name), object.description && (h("p", { class: "description body-regular-xs" }, object.description))))), h("div", { class: "card-actions" }, object.url && (h("div", { class: "platform-section" }, object["app-store-badge"] ? (h("img", { src: APP_STORE_BADGE, alt: "Download on the App Store", class: "app__apple-store", onClick: () => __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_openAppStoreFunc).call(this, object) })) : (platformIcon), h("button", { class: "button-secondary button-icon-and-text", onClick: () => __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_handleQRClick).call(this, object), "aria-label": "Show QR Code" }, h("ch-image", { class: "icon-md", src: __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_getQRIcon).call(this), type: "mask" }), ((_a = __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_componentLocale, "f")) === null || _a === void 0 ? void 0 : _a.showQR) || "Show QR"))), h("button", { class: "button-tertiary button-icon-and-text copy-button", onClick: () => __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_copyToClipboardFunc).call(this, object), "aria-label": "Copy to clipboard" }, h("ch-image", { class: "icon-md", src: __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_instances, "m", _GxIdeLaunchpadNativeApps_getCopyIcon).call(this) }), this.showCopiedMessage[`${object.name}-${object.url}`]
+            ? ((_b = __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_componentLocale, "f")) === null || _b === void 0 ? void 0 : _b.copied) || "Copied!"
+            : ((_c = __classPrivateFieldGet(this, _GxIdeLaunchpadNativeApps_componentLocale, "f")) === null || _c === void 0 ? void 0 : _c.copy) || "Copy"))));
+    }), 
+    // WA: Prevent card take full width if there is only one card
+    platformSection.objects.length === 1 && h("div", null)));
+};
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["gx-ide-launchpad-native-apps"];
+    components.forEach(tagName => { switch (tagName) {
+        case "gx-ide-launchpad-native-apps":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, GxIdeLaunchpadNativeApps);
+            }
+            break;
+    } });
+}
+
+export { GxIdeLaunchpadNativeApps as G, defineCustomElement as d };
+
+//# sourceMappingURL=launchpad-native-apps.js.map

package/dist/components/launchpad-native-apps.js.map

@@ -0,0 +1 @@
+{"file":"launchpad-native-apps.js","mappings":"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","names":[],"sources":["src/components/launchpad/native-apps/launchpad-native-apps.scss?tag=gx-ide-launchpad-native-apps&encapsulation=shadow","src/components/launchpad/native-apps/launchpad-native-apps.tsx"],"sourcesContent":["@use \"../common.scss\" as *;\n\n:host {\n  display: block;\n  block-size: 100%;\n  overflow: auto;\n}\n\n.main {\n  overflow: auto;\n  display: block;\n}\n\nch-accordion-render {\n  inline-size: 100%;\n  block-size: 100%;\n}\n\n.accordion-content {\n  padding: var(--mer-spacing--md);\n  inline-size: 100%;\n}\n\n.native-apps-accordion {\n  inline-size: 100%;\n  block-size: 100%;\n}\n\n/* WA: Platform Section */\n.platform-section {\n  display: flex;\n  align-items: center;\n  gap: var(--mer-spacing--sm);\n}\n\n.app__apple-store {\n  height: 32px; // This should equal the button height in Mercury\n  cursor: pointer;\n  transition: opacity var(--mer-timing--fast) ease;\n\n  &:hover {\n    opacity: 0.8;\n  }\n}\n\n.platform-grid {\n  --card-min-inline-size: 360px;\n  @extend %appCardsContainer;\n}\n\n.object-card {\n  @extend %appCard;\n}\n\n.card-content {\n  display: flex;\n  gap: var(--mer-spacing--md);\n  flex: 1;\n  width: 100%;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n.info-section {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  width: 100%;\n}\n\n.app-info {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mer-spacing--2xs);\n  flex: 1;\n}\n\n.name {\n  color: var(--mer-text__bright);\n}\n\n.description {\n  color: var(--mer-text__dim);\n  margin: 0;\n  line-height: 1.4;\n}\n\n/* Copy button styles handled by Mercury components/button bundle */\n\n/* QR Dialog Styles */\n.dialog {\n  --ch-dialog-block-size: 400px;\n  --ch-dialog-inline-size: 350px;\n  --ch-dialog-min-block-size: 400px;\n  --ch-dialog-min-inline-size: 350px;\n}\n.qr-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.card-actions {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-top: var(--mer-spacing--sm);\n  border-top: var(--mer-border__width--sm) solid var(--mer-border-color__dim);\n}\n\n/* No Data States */\n.no-data,\n.no-results {\n  color: var(--mer-color__neutral-gray--400);\n  font-style: italic;\n  text-align: center;\n  padding: var(--mer-spacing--md);\n\n  p {\n    font-size: var(--mer-font-size--lg);\n    font-weight: var(--mer-font-weight--medium);\n    line-height: var(--mer-line-height--relaxed);\n  }\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n  .platform-grid {\n    justify-content: center;\n  }\n\n  .card-content {\n    flex-direction: column;\n    gap: var(--mer-spacing--sm);\n  }\n\n  .card-actions {\n    flex-direction: column;\n    gap: var(--mer-spacing--sm);\n    align-items: stretch;\n  }\n}\n\n@media (max-width: 480px) {\n  .main {\n    padding: var(--mer-spacing--sm);\n  }\n\n  .object-card {\n    padding: var(--mer-spacing--sm);\n  }\n\n  .platform-grid {\n    gap: var(--mer-spacing--sm);\n    padding: var(--mer-spacing--sm);\n  }\n}\n\n.android:after {\n  content: \"\";\n  display: block;\n}\n","import {\n  Component,\n  h,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  getAssetPath\n} from \"@stencil/core\";\n\nimport { getIconPath, MercuryBundles } from \"@genexus/mercury\";\nimport { AccordionModel } from \"@genexus/chameleon-controls-library\";\n\nimport { Locale } from \"../../../common/locale\";\n\nconst IOS_ID = \"ios\";\nconst ANDROID_ID = \"android\";\n\nconst APP_STORE_BADGE = getAssetPath(\n  \"./gx-ide-assets/launchpad-native-apps/images/app-store-badge.svg\"\n);\nconst ANDROID_LOGO = getAssetPath(\n  \"./gx-ide-assets/launchpad-native-apps/images/android-logo.svg\"\n);\nconst MAC_LOGO = getAssetPath(\n  \"./gx-ide-assets/launchpad-native-apps/images/mac-logo.svg\"\n);\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/accordion\",\n  \"components/button\",\n  \"components/dialog\",\n  \"components/icon\",\n  \"utils/elevation\",\n  \"utils/layout\",\n  \"utils/spacing\",\n  \"utils/typography\"\n];\n\n@Component({\n  tag: \"gx-ide-launchpad-native-apps\",\n  styleUrl: \"launchpad-native-apps.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/launchpad-native-apps\"]\n})\nexport class GxIdeLaunchpadNativeApps {\n  #componentLocale: any;\n  #ACCORDION_MODEL: AccordionModel = [];\n  #timeoutIds: Set<number> = new Set();\n\n  @Element() el: HTMLGxIdeLaunchpadNativeAppsElement;\n\n  /**\n   * Array of platform sections (ios, android)\n   */\n  @Prop() readonly objects: PlatformSection[] = [];\n\n  /**\n   * Filter value for searching objects\n   */\n  @State() filterValue: string = \"\";\n\n  /**\n   * Sorting order for recent objects table\n   */\n  @State() order: { orderCriteria: string | null; ascending: boolean | null } =\n    {\n      orderCriteria: null,\n      ascending: null\n    };\n\n  /**\n   * Current page for pagination\n   */\n  @State() page: number = 1;\n\n  /**\n   * Items per page for pagination\n   */\n  @State() perPage: number = 10;\n\n  /**\n   * Event emitted when copying to clipboard - like the original version\n   */\n  @Event() copyToClipboard: EventEmitter<{ url: string }>;\n\n  /**\n   * Event emitted when opening app store - like the original version\n   */\n  @Event() openOnTheAppStore: EventEmitter<{ url: string }>;\n\n  /**\n   * Callback function for object selection (passed from parent)\n   */\n  @Prop() onObjectSelected?: (event: any) => void;\n\n  /**\n   * State to track copied messages for each object\n   */\n  @State() showCopiedMessage: { [key: string]: boolean } = {};\n\n  /**\n   * State to control QR dialog visibility\n   */\n  @State() showQRDialog: boolean = false;\n\n  /**\n   * State to store the selected object for QR display\n   */\n  @State() selectedObjectForQR: NativeAppObject | null = null;\n\n  async componentWillLoad() {\n    try {\n      this.#componentLocale = await Locale.getComponentStrings(this.el);\n    } catch (error) {\n      console.error(\"Error loading locale:\", error);\n      this.#componentLocale = {};\n    }\n\n    this.#ACCORDION_MODEL = [\n      {\n        id: IOS_ID,\n        caption: \"iOS\",\n        expanded: true\n      },\n      {\n        id: ANDROID_ID,\n        caption: \"Android\",\n        expanded: true\n      }\n    ];\n  }\n\n  #getQRFillColor(): string {\n    const computedStyle = getComputedStyle(document.documentElement);\n    return (\n      computedStyle.getPropertyValue(\"--mer-text__on-surface\").trim() ||\n      computedStyle.getPropertyValue(\"--mer-color__neutral-gray--200\").trim() ||\n      \"#49566d\"\n    );\n  }\n\n  #getQRBackgroundColor(): string {\n    const computedStyle = getComputedStyle(document.documentElement);\n    return (\n      computedStyle\n        .getPropertyValue(\"--mer-color__neutral-gray--1000\")\n        .trim() || \"#ffffff\"\n    );\n  }\n\n  #getCopyIcon(): string {\n    return getIconPath({\n      category: \"system\",\n      name: \"copy\",\n      colorType: \"primary\"\n    });\n  }\n\n  /**\n   * Gets the QR icon\n   */\n  #getQRIcon(): string {\n    return getIconPath({\n      category: \"system\",\n      name: \"qr-code\",\n      colorType: \"neutral\"\n    });\n  }\n\n  /**\n   * Copies text to clipboard and emits event - like the original version\n   */\n  #copyToClipboardFunc(object: NativeAppObject) {\n    this.copyToClipboard.emit({\n      url: object.url\n    });\n\n    if (object.url) {\n      navigator.clipboard\n        .writeText(object.url)\n        .then(() => {\n          const objectKey = `${object.name}-${object.url}`;\n\n          this.showCopiedMessage = {\n            ...this.showCopiedMessage,\n            [objectKey]: true\n          };\n\n          const timeoutId = window.setTimeout(() => {\n            this.showCopiedMessage = {\n              ...this.showCopiedMessage,\n              [objectKey]: false\n            };\n            this.#timeoutIds.delete(timeoutId);\n          }, 2000);\n\n          this.#timeoutIds.add(timeoutId);\n        })\n        .catch(err => {\n          console.error(\"Failed to copy text: \", err);\n        });\n    }\n  }\n\n  /**\n   * Opens app store and emits event - like the original version\n   */\n  #openAppStoreFunc(object: NativeAppObject) {\n    this.openOnTheAppStore.emit({\n      url: object.url\n    });\n\n    if (object.url) {\n      window.open(object.url, \"_blank\");\n    }\n  }\n\n  /**\n   * Handles QR button click\n   */\n  #handleQRClick(object: NativeAppObject) {\n    this.selectedObjectForQR = object;\n    this.showQRDialog = true;\n  }\n\n  /**\n   * Handles closing QR dialog\n   */\n  #handleCloseQRDialog() {\n    this.showQRDialog = false;\n    this.selectedObjectForQR = null;\n  }\n\n  /**\n   * Handles object click and calls parent callback\n   */\n  #handleObjectClick(object: NativeAppObject) {\n    if (object.key && this.onObjectSelected) {\n      // Send the full key object as string in format \"type|id\"\n      const keyString = `${object.key.type}|${object.key.id}`;\n      this.onObjectSelected({ detail: { key: keyString } });\n    }\n  }\n\n  /**\n   * Cleanup method to prevent memory leaks\n   */\n  disconnectedCallback() {\n    if (this.#timeoutIds) {\n      this.#timeoutIds.forEach(timeoutId => {\n        if (timeoutId) {\n          clearTimeout(timeoutId);\n        }\n      });\n      this.#timeoutIds.clear();\n    }\n  }\n\n  /**\n   * Renders platform section (iOS or Android) with grid layout like the original version\n   */\n  #renderPlatformSection(platformType: string) {\n    const platformIcon =\n      platformType === IOS_ID ? (\n        <img src={MAC_LOGO} alt=\"Apple iOS Logo\"></img>\n      ) : (\n        <img src={ANDROID_LOGO} alt=\"Android Logo\"></img>\n      );\n\n    const platformSection = this.objects.find(obj => obj.type === platformType);\n\n    if (!platformSection || platformSection.objects.length === 0) {\n      return (\n        <div class=\"no-results\">\n          <p class=\"body-regular-s\">\n            {this.#componentLocale?.noPlatformApps?.replace(\n              \"{platformType}\",\n              platformType\n            ) || `No ${platformType} applications available`}\n          </p>\n        </div>\n      );\n    }\n\n    return (\n      <div class=\"platform-grid\">\n        {platformSection.objects.map((object, index) => (\n          <div\n            key={index}\n            class=\"object-card elevation-2\"\n            tabindex=\"0\"\n            onClick={() => this.#handleObjectClick(object)}\n          >\n            <div class=\"card-content\">\n              <div class=\"info-section\">\n                <div class=\"app-info\">\n                  <h1 class=\"name body-semi-bold-s\">{object.name}</h1>\n                  {object.description && (\n                    <p class=\"description body-regular-xs\">\n                      {object.description}\n                    </p>\n                  )}\n                </div>\n              </div>\n            </div>\n            <div class=\"card-actions\">\n              {object.url && (\n                <div class=\"platform-section\">\n                  {object[\"app-store-badge\"] ? (\n                    <img\n                      src={APP_STORE_BADGE}\n                      alt=\"Download on the App Store\"\n                      class=\"app__apple-store\"\n                      onClick={() => this.#openAppStoreFunc(object)}\n                    />\n                  ) : (\n                    platformIcon\n                  )}\n                  <button\n                    class=\"button-secondary button-icon-and-text\"\n                    onClick={() => this.#handleQRClick(object)}\n                    aria-label=\"Show QR Code\"\n                  >\n                    <ch-image\n                      class=\"icon-md\"\n                      src={this.#getQRIcon()}\n                      type=\"mask\"\n                    />\n                    {this.#componentLocale?.showQR || \"Show QR\"}\n                  </button>\n                </div>\n              )}\n              <button\n                class=\"button-tertiary button-icon-and-text copy-button\"\n                onClick={() => this.#copyToClipboardFunc(object)}\n                aria-label=\"Copy to clipboard\"\n              >\n                <ch-image class=\"icon-md\" src={this.#getCopyIcon()} />\n                {this.showCopiedMessage[`${object.name}-${object.url}`]\n                  ? this.#componentLocale?.copied || \"Copied!\"\n                  : this.#componentLocale?.copy || \"Copy\"}\n              </button>\n            </div>\n          </div>\n        ))}\n        {\n          // WA: Prevent card take full width if there is only one card\n          platformSection.objects.length === 1 && <div></div>\n        }\n      </div>\n    );\n  }\n\n  render() {\n    if (!this.objects || this.objects.length === 0) {\n      return (\n        <div class=\"widget\">\n          <ch-theme model={CSS_BUNDLES}></ch-theme>\n          <div class=\"no-data\">\n            <p class=\"body-regular-s\">\n              {this.#componentLocale?.noData ||\n                \"No native applications data available\"}\n            </p>\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <div class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <div class=\"main\">\n          <ch-accordion-render\n            class=\"accordion-filled-header elevation-2 native-apps-accordion\"\n            model={this.#ACCORDION_MODEL}\n          >\n            <div slot={IOS_ID} class=\"accordion-content spacing-body\">\n              {this.#renderPlatformSection(IOS_ID)}\n            </div>\n            <div slot={ANDROID_ID} class=\"accordion-content spacing-body\">\n              {this.#renderPlatformSection(ANDROID_ID)}\n            </div>\n          </ch-accordion-render>\n        </div>\n\n        <ch-dialog\n          class=\"dialog\"\n          show={this.showQRDialog}\n          show-header={true}\n          closable={true}\n          close-button-accessible-name=\"Close QR code\"\n          onDialogClosed={() => this.#handleCloseQRDialog()}\n        >\n          {this.selectedObjectForQR && (\n            <div class=\"qr-container\">\n              <ch-qr\n                value={this.selectedObjectForQR.url || \"\"}\n                size={200}\n                error-correction-level=\"Low\"\n                class=\"qr-code\"\n                fill={this.#getQRFillColor()}\n                background={this.#getQRBackgroundColor()}\n              ></ch-qr>\n            </div>\n          )}\n        </ch-dialog>\n      </div>\n    );\n  }\n}\n\ninterface NativeAppObject {\n  \"name\": string;\n  \"module\"?: string;\n  \"type\"?: string;\n  \"description\"?: string;\n  \"platform\"?: string;\n  \"url\"?: string;\n  \"generator\"?: string;\n  \"app-store-badge\"?: boolean;\n  \"key\"?: {\n    type: string;\n    id: string;\n  };\n}\n\ninterface PlatformSection {\n  type: string;\n  objects: NativeAppObject[];\n}\n"],"version":3}