@genexus/genexus-ide-ui 3.2.21 → 3.2.22

package/dist/genexus-ide-ui/p-514445ac.entry.js

@@ -1,291 +0,0 @@
-import { g as i, r as t, h as s, H as e, a } from "./p-9b9ccd0c.js";
-
-import { g as n } from "./p-d42e842b.js";
-
-import "./p-6534555e.js";
-
-import "lit";
-
-import "lit/directives/when.js";
-
-import "lit/directives/if-defined.js";
-
-import { L as o } from "./p-311eedf3.js";
-
-const r = '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 l = undefined && undefined.__classPrivateFieldGet || function(i, t, s, e) {
-  if (s === "a" && !e) throw new TypeError("Private accessor was defined without a getter");
-  if (typeof t === "function" ? i !== t || !e : !t.has(i)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-  return s === "m" ? e : s === "a" ? e.call(i) : e ? e.value : t.get(i);
-};
-
-var c = undefined && undefined.__classPrivateFieldSet || function(i, t, s, e, a) {
-  if (e === "m") throw new TypeError("Private method is not writable");
-  if (e === "a" && !a) throw new TypeError("Private accessor was defined without a setter");
-  if (typeof t === "function" ? i !== t || !a : !t.has(i)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-  return e === "a" ? a.call(i, s) : a ? a.value = s : t.set(i, s), s;
-};
-
-var d, p, h, g, f, u, m, b, _, v, k, w, y, x, M, W;
-
-const z = n({
-  category: "system",
-  name: "user",
-  colorType: "on-surface"
-});
-
-const T = n({
-  category: "system",
-  name: "chevron-down",
-  colorType: "on-primary"
-});
-
-const j = n({
-  category: "system",
-  name: "check-circle",
-  colorType: "success"
-});
-
-// plugin icon if no iconUri was provided
-const C = i(`./gx-ide-assets/plugin-manager/images/plugin-icon.svg`);
-
-const E = [ "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 L = class {
-  constructor(i) {
-    t(this, i);
-    /**
-         * The component hard-coded strings translations.
-         */
-    // eslint-disable-next-line @stencil-community/own-props-must-be-private
-        d.set(this, void 0);
-    p.set(this, void 0);
-    // A map between docSection "id", and docSection "description".
-    // "id" is generated inside this component.
-        h.set(this, new Map);
-    g.set(this, (() => {
-      var i;
-      const t = (i = this.data.versions) === null || i === void 0 ? void 0 : i.map((i => ({
-        id: i,
-        caption: i
-      })));
-      return t;
-    }));
-    f.set(this, (i => {
-      const t = i.detail.id;
-      this.installCallback(t);
-    }));
-    u.set(this, (() => s("button", {
-      class: "button-tertiary",
-      onClick: l(this, v, "f")
-    }, l(this, d, "f").actions.uninstall)));
-    m.set(this, (() => {
-      this.installCallback();
-    }));
-    b.set(this, (i => () => {
-      this.installCallback(i);
-    }));
-    _.set(this, (i => t => {
-      if (this.openLinkCallback) {
-        t.preventDefault();
-        this.openLinkCallback(i);
-      }
-    }));
-    v.set(this, (() => {
-      this.uninstallCallback();
-    }));
-    k.set(this, (() => {
-      var i;
-      let t;
-      let e = "button-primary action-button";
-      let a;
-      const n = (i = this.data.versions) === null || i === void 0 ? void 0 : i.length;
-      if (!this.data.installed) {
-        t = l(this, d, "f").actions.install;
-        a = l(this, m, "f");
-      } else if (this.data.updateVersion) {
-        t = `${l(this, d, "f").actions.updateTo} ${this.data.updateVersion}`;
-        a = l(this, b, "f").call(this, this.data.updateVersion);
-      } else {
-        t = l(this, d, "f").actions.installed;
-      }
-      if (n) {
-        e = `${e} more-versions-available`;
-      }
-      return [ s("div", {
-        class: "version-buttons-container"
-      }, s("button", {
-        class: e,
-        onClick: a
-      }, t), n ? s("ch-action-menu-render", {
-        class: "dropdown button-primary button-icon-only",
-        blockAlign: "outside-end",
-        inlineAlign: "inside-start",
-        model: l(this, g, "f").call(this),
-        onButtonClick: l(this, f, "f")
-      }, s("ch-image", {
-        src: T,
-        class: "icon-m"
-      })) : null) ];
-    }));
-    w.set(this, (i => {
-      this.selectedTabId = i.detail.newSelectedId;
-    }));
-    y.set(this, (() => this.docsTabModel.map((i => {
-      if (i.id === this.selectedTabId) {
-        const t = l(this, h, "f").get(i.id);
-        return s("ch-markdown-viewer", {
-          ref: i => c(this, p, i, "f"),
-          slot: i.id,
-          key: i.id,
-          class: "markdown spacing-body scrollable",
-          theme: "components/markdown-viewer",
-          value: t
-        });
-      }
-    }))));
-    x.set(this, (i => i.toLowerCase().replace(/\s+/g, "-")));
-    M.set(this, ((i, t, e, a) => s("a", {
-      href: i,
-      target: "_blank",
-      onClick: l(this, _, "f").call(this, i),
-      class: e
-    }, a && s("ch-image", {
-      src: a,
-      class: "icon-m"
-    }), t)));
-    W.set(this, (() => this.data.infoCategories.map((i => s("div", {
-      class: "plugin__info-category"
-    }, s("h3", {
-      class: "subtitle-semi-bold-s"
-    }, i.name), s("ul", {
-      class: {
-        fields__list: true,
-        "fields__list--as-tags": i.displayAsTags
-      }
-    }, i.fields.map((t => {
-      // If the field name isn’t specified, only the value is shown — usually a link.
-      const e = typeof t.value === "string" ? t.value : l(this, M, "f").call(this, t.value.url, t.value.text, "field__link");
-      return s("li", {
-        class: "field__li"
-      }, t.name && !i.displayAsTags ? // displaysAsTags forces the items to be displayed as tags
-      // no span.field__name and span.field__value
-      [ s("span", {
-        class: "field__name body-semi-bold-s"
-      }, t.name), s("span", {
-        class: "field__value body-regular-s"
-      }, e) ] : e);
-    }))))))));
-    this.docsTabModel = [];
-    this.selectedTabId = undefined;
-    this.data = undefined;
-    this.installCallback = undefined;
-    this.openLinkCallback = undefined;
-    this.uninstallCallback = undefined;
-  }
-  async componentWillLoad() {
-    var i;
-    c(this, d, await o.getComponentStrings(this.el), "f");
-    if ((i = this.data.docSections) === null || i === void 0 ? void 0 : i.length) {
-      this.docsTabModel = this.data.docSections.map(((i, t) => {
-        const s = l(this, x, "f").call(this, i.name);
-        l(this, h, "f").set(s, i.content);
-        if (t === 0) {
-          this.selectedTabId = s;
-        }
-        return {
-          id: s,
-          name: i.name
-        };
-      }));
-    }
-  }
-  componentDidLoad() {
-    l(this, p, "f").addEventListener("click", (i => {
-      // 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 t = i.composedPath();
-      const s = t.find((i => i instanceof HTMLAnchorElement));
-      if (s === null || s === void 0 ? void 0 : s.href) {
-        l(this, _, "f").call(this, s.href)(i);
-      }
-    }));
-  }
-  render() {
-    const i = !this.data.installed || this.data.installed && !!this.data.updateVersion;
-    const t = this.data.name.text;
-    const a = this.data.name.url;
-    const n = t && a;
-    const o = t || this.data.name;
-    const r = this.data.publisher.text;
-    const c = this.data.publisher.url;
-    const p = r && c;
-    const h = r || this.data.publisher;
-    return s(e, {
-      class: "widget"
-    }, s("ch-theme", {
-      model: E
-    }), s("section", {
-      class: "section"
-    }, s("header", {
-      class: "header"
-    }, s("img", {
-      class: "plugin__icon",
-      src: this.data.iconUrl || C,
-      alt: "plugin extension icon"
-    }), s("div", {
-      class: "plugin__details"
-    }, n ? s("h2", {
-      class: "heading-5 has-link"
-    }, l(this, M, "f").call(this, a, o, "text-underline")) : s("h2", {
-      class: "heading-5"
-    }, o), p ? l(this, M, "f").call(this, c, o, "text-underline plugin__publisher caption-semi-bold-l", z) : s("p", {
-      class: "plugin__publisher caption-semi-bold-l"
-    }, s("ch-image", {
-      src: z,
-      class: "icon-s"
-    }), h), s("p", {
-      class: "plugin__description"
-    }, this.data.description), s("div", {
-      class: "buttons-spacer plugin__actions-container"
-    }, i ? l(this, k, "f").call(this) : 
-    // installed and no updates
-    s("p", {
-      class: "installed-container subtitle-semi-bold-s"
-    }, s("ch-image", {
-      src: j,
-      class: "icon-s"
-    }), l(this, d, "f").actions.installed), this.data.installed && l(this, u, "f").call(this)))), s("div", {
-      class: "main"
-    }, this.docsTabModel.length > 0 && s("ch-tab-render", {
-      class: "tab docsTab scrollable",
-      tabListPosition: "block-start",
-      overflow: "auto",
-      contain: "size",
-      model: this.docsTabModel,
-      onSelectedItemChange: l(this, w, "f"),
-      selectedId: this.selectedTabId
-    }, l(this, y, "f").call(this))), s("div", {
-      class: "aside spacing-body scrollable"
-    }, l(this, W, "f").call(this))));
-  }
-  static get assetsDirs() {
-    return [ "gx-ide-assets/plugin-details" ];
-  }
-  get el() {
-    return a(this);
-  }
-};
-
-d = new WeakMap, p = new WeakMap, h = new WeakMap, g = new WeakMap, f = new WeakMap, 
-u = new WeakMap, m = new WeakMap, b = new WeakMap, _ = new WeakMap, v = new WeakMap, 
-k = new WeakMap, w = new WeakMap, y = new WeakMap, x = new WeakMap, M = new WeakMap, 
-W = new WeakMap;
-
-L.style = r;
-
-export { L as gx_ide_plugin_details };
-//# sourceMappingURL=p-514445ac.entry.js.map

package/dist/genexus-ide-ui/p-514445ac.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pluginDetailsCss","USER_ICON","getIconPath","category","name","colorType","CHEVRON_DOWN_ICON","CHECK_CIRCLE_ICON","EXTENSION_ICON_IMG","getAssetPath","CSS_BUNDLES","GxIdePluginDetails","_GxIdePluginDetails_componentLocale","set","this","_GxIdePluginDetails_chMarkdownViewer","_GxIdePluginDetails_docSectionIdDescriptionMap","Map","_GxIdePluginDetails_versionsMenuOptionsModel","versionsToUpdateMenusModel","_a","data","versions","map","version","id","caption","_GxIdePluginDetails_menuVersionSelectedHandler","event","selectedVersion","detail","installCallback","_GxIdePluginDetails_renderUninstallButton","h","class","onClick","__classPrivateFieldGet","_GxIdePluginDetails_uninstallClickedHandler","actions","uninstall","_GxIdePluginDetails_installClickedHandler","_GxIdePluginDetails_updateVersionHandler","_GxIdePluginDetails_openLinkHandler","link","openLinkCallback","preventDefault","uninstallCallback","_GxIdePluginDetails_renderActionButtons","actionButtonCaption","actionButtonClasses","actionButtonCallback","moreVersionsToUpdate","length","installed","install","updateVersion","updateTo","call","blockAlign","inlineAlign","model","onButtonClick","src","_GxIdePluginDetails_tabSelectionChangedHandler","selectedTabId","newSelectedId","_GxIdePluginDetails_renderDocSectionsSlots","docsTabModel","docSectionTab","markdownValue","get","ref","el","__classPrivateFieldSet","slot","key","theme","value","_GxIdePluginDetails_returnFormatedId","rawId","toLowerCase","replace","_GxIdePluginDetails_renderLinkTag","href","label","cssClass","chImageSrc","target","_GxIdePluginDetails_renderAsideContent","infoCategories","infoCategory","fields__list","displayAsTags","fields","field","fieldValue","url","text","componentWillLoad","Locale","getComponentStrings","docSections","docSection","i","formatedId","content","componentDidLoad","addEventListener","path","composedPath","find","HTMLAnchorElement","render","renderActionButtons","titleLinkDataText","titleLinkDataUrl","titleHasLink","titleText","publisherDataText","publisher","publisherDataUrl","publisherHasLink","publisherText","Host","iconUrl","alt","description","tabListPosition","overflow","contain","onSelectedItemChange","selectedId"],"sources":["src/components/plugin-details/plugin-details.scss?tag=gx-ide-plugin-details&encapsulation=shadow","src/components/plugin-details/plugin-details.tsx"],"sourcesContent":["@import \"../../global/temporary-mercury-overrides/_tab.scss\";\n\n:host {\n  display: grid;\n  block-size: 100%;\n  grid-template-areas:\n    \"header header\"\n    \"main aside\";\n  grid-template-rows: max-content 1fr;\n  grid-template-columns: 1fr 280px;\n  row-gap: var(--spacing-gap-l);\n}\n\n.section {\n  display: contents;\n}\n\n// header\n.header {\n  display: grid;\n  grid-area: header;\n  grid-template-areas: \"plugin-icon plugin-details\";\n  grid-template-columns: 64px 1fr;\n  column-gap: var(--spacing-gap-xl);\n  padding-block-start: var(--spacing-padding-xxl);\n  padding-block-end: var(--spacing-padding-xl);\n  padding-inline: var(--spacing-padding-xxl);\n}\n.plugin__icon {\n  grid-area: plugin-icon;\n  inline-size: 100%;\n  block-size: auto;\n  display: block;\n}\n.plugin__details {\n  grid-area: plugin-details;\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-m);\n}\n.plugin__publisher {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-gap-xs);\n}\n.plugin__description {\n  line-height: var(--line-height-spacious); // WA: Text appears too tight.\n}\n.plugin__actions-container {\n  margin-block-start: var(--spacing-padding-m);\n  align-items: center;\n}\n.action-button {\n  min-inline-size: 100px;\n\n  &.more-versions-available {\n    border-start-end-radius: 0 !important;\n    border-end-end-radius: 0 !important;\n  }\n}\n.installed-container {\n  display: flex;\n  align-items: center;\n  gap: var(--spacing-gap-m);\n\n  // WA Biggest Mercury icon (icon-s) looks small in this case.\n  // Mercury should expose more icon sizes.\n  ch-image {\n    --ch-image-size: 20px;\n  }\n}\n\n// main\n.main {\n  grid-area: main;\n}\n.docsTab {\n  block-size: 100%;\n}\n\n// aside\n.aside {\n  grid-area: aside;\n  overflow: auto;\n  border-block-start: 1px solid var(--items-container__border-color);\n}\n.fields__list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  font-size: var(--font-size-body-s);\n}\n.plugin__info-category {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-m);\n\n  &:not(:first-child) {\n    padding-block-start: var(--spacing-padding-xl);\n    margin-block-start: var(--spacing-padding-xl);\n    border-block-start: 1px solid var(--color-border-surface-on-elevation-1);\n  }\n}\n.fields__list:not(.fields__list--as-tags) {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-m);\n  .field__li {\n    display: flex;\n    gap: var(--spacing-gap-xl);\n  }\n}\n.fields__list--as-tags {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--spacing-gap-m);\n\n  .field__li {\n    border: 1px solid var(--color-border-surface-on-elevation-1);\n    padding-block: var(--spacing-padding-xxs);\n    padding-inline: var(--spacing-padding-m);\n    border-radius: 4px;\n\n    text-transform: lowercase;\n  }\n  .field__link {\n    color: var(--color-text-neutral-strawberry);\n\n    &:hover {\n      color: var(--color-accent-primary-default);\n    }\n    &:active {\n      color: var(--color-accent-primary-hover);\n    }\n  }\n}\n\n.field__name,\n.field__value {\n  flex: 1;\n}\n// WA: Link styles should be defined Mercury\n.field__link {\n  color: var(--color-accent-primary-default);\n  &:hover {\n    color: var(--color-accent-primary-hover);\n  }\n  &:active {\n    color: var(--color-accent-primary-pressed);\n  }\n}\n// WA: Remove tab elevation background color\n.docsTab {\n  background-color: transparent !important;\n}\n\n// WA: Styles for \"button-icon-only\" should be defined on mercury\n.dropdown.button-icon-only::part(expandable-button) {\n  padding: calc(\n    (var(--control-block-size) - 2 * var(--control-border-width) - 16px) / 2\n  ) !important;\n  border-start-start-radius: 0 !important;\n  border-end-start-radius: 0 !important;\n}\n\n.version-buttons-container {\n  display: flex;\n  align-items: center;\n  gap: 1px;\n}\n\nch-markdown-viewer {\n  block-size: 100%;\n  overflow: auto;\n}\n\n// WA: Need text with underline. This should be defined on Mercury\n.text-underline {\n  text-decoration: underline;\n}\n","import {\n  Component,\n  Host,\n  State,\n  Prop,\n  Element,\n  h,\n  getAssetPath,\n  JSX\n} from \"@stencil/core\";\n\nimport { getIconPath, MercuryBundles } from \"@genexus/mercury\";\nimport { Locale } from \"../../common/locale\";\nimport { ActionMenuModel, TabModel } from \"@genexus/chameleon-controls-library\";\nimport { TabItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/tab/types\";\n\nconst USER_ICON = getIconPath({\n  category: \"system\",\n  name: \"user\",\n  colorType: \"on-surface\"\n});\nconst CHEVRON_DOWN_ICON = getIconPath({\n  category: \"system\",\n  name: \"chevron-down\",\n  colorType: \"on-primary\"\n});\nconst CHECK_CIRCLE_ICON = getIconPath({\n  category: \"system\",\n  name: \"check-circle\",\n  colorType: \"success\"\n});\n\n// plugin icon if no iconUri was provided\nconst EXTENSION_ICON_IMG = getAssetPath(\n  `./gx-ide-assets/plugin-manager/images/plugin-icon.svg`\n);\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"chameleon/scrollbar\",\n  \"components/button\",\n  \"components/dropdown\",\n  \"components/edit\",\n  \"components/icon\",\n  \"components/list-box\",\n  \"components/tab\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/spacing\",\n  \"utils/typography\"\n];\n\n@Component({\n  tag: \"gx-ide-plugin-details\",\n  styleUrl: \"plugin-details.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/plugin-details\"]\n})\nexport class GxIdePluginDetails {\n  /**\n   * The component hard-coded strings translations.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n\n  #chMarkdownViewer: HTMLChMarkdownViewerElement;\n\n  // A map between docSection \"id\", and docSection \"description\".\n  // \"id\" is generated inside this component.\n  #docSectionIdDescriptionMap: Map<string, string> = new Map();\n\n  @Element() el: HTMLGxIdePluginDetailsElement;\n\n  @State() docsTabModel: TabModel = [];\n  @State() selectedTabId: string;\n\n  /**\n   * Specifies all the information related to a plugin.\n   */\n  @Prop() readonly data!: PluginDetailsData;\n\n  /**\n   * Callback that should be invoked when the user performs the install or update action.\n   * Receives an optional version string when a specific version is selected.\n   */\n  @Prop() readonly installCallback!: (version?: string) => Promise<void>;\n\n  /**\n   * Callback that should be invoked when the user attempts to open any link displayed in this component.\n   */\n  @Prop() readonly openLinkCallback!: (url: string) => Promise<void>;\n\n  /**\n   * Callback that should be invoked when the user performs the uninstall action.\n   */\n  @Prop() readonly uninstallCallback!: () => Promise<void>;\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n\n    if (this.data.docSections?.length) {\n      this.docsTabModel = this.data.docSections.map((docSection, i) => {\n        const formatedId = this.#returnFormatedId(docSection.name);\n\n        this.#docSectionIdDescriptionMap.set(formatedId, docSection.content);\n\n        if (i === 0) {\n          this.selectedTabId = formatedId;\n        }\n        return {\n          id: formatedId,\n          name: docSection.name\n        } as TabItemModel;\n      });\n    }\n  }\n\n  componentDidLoad() {\n    this.#chMarkdownViewer.addEventListener(\"click\", event => {\n      // Listens for clicks on links inside <ch-markdown-viewer>.\n      // If a link (<a>) is clicked and openLinkCallback is defined,\n      // it prevents the default navigation and delegates the event\n      // to this.#openLinkHandler, passing the link's href.\n      const path = event.composedPath() as EventTarget[];\n\n      const link = path.find(el => el instanceof HTMLAnchorElement) as\n        | HTMLAnchorElement\n        | undefined;\n\n      if (link?.href) {\n        this.#openLinkHandler(link.href)(event);\n      }\n    });\n  }\n\n  #versionsMenuOptionsModel = (): ActionMenuModel => {\n    const versionsToUpdateMenusModel: ActionMenuModel = this.data.versions?.map(\n      version => {\n        return { id: version, caption: version };\n      }\n    );\n    return versionsToUpdateMenusModel;\n  };\n\n  #menuVersionSelectedHandler = (\n    event: CustomEvent<{\n      id?: string;\n    }>\n  ) => {\n    const selectedVersion = event.detail.id;\n    this.installCallback(selectedVersion);\n  };\n\n  #renderUninstallButton = (): JSX.Element => {\n    return (\n      <button class=\"button-tertiary\" onClick={this.#uninstallClickedHandler}>\n        {this.#componentLocale.actions.uninstall}\n      </button>\n    );\n  };\n\n  #installClickedHandler = () => {\n    this.installCallback();\n  };\n\n  #updateVersionHandler = (id: string) => () => {\n    this.installCallback(id);\n  };\n\n  #openLinkHandler = (link: string) => (event: MouseEvent) => {\n    if (this.openLinkCallback) {\n      event.preventDefault();\n      this.openLinkCallback(link);\n    }\n  };\n\n  #uninstallClickedHandler = () => {\n    this.uninstallCallback();\n  };\n\n  #renderActionButtons = (): JSX.Element => {\n    let actionButtonCaption;\n    let actionButtonClasses = \"button-primary action-button\";\n    let actionButtonCallback;\n    const moreVersionsToUpdate = this.data.versions?.length;\n\n    if (!this.data.installed) {\n      actionButtonCaption = this.#componentLocale.actions.install;\n      actionButtonCallback = this.#installClickedHandler;\n    } else if (this.data.updateVersion) {\n      actionButtonCaption = `${this.#componentLocale.actions.updateTo} ${\n        this.data.updateVersion\n      }`;\n      actionButtonCallback = this.#updateVersionHandler(\n        this.data.updateVersion\n      );\n    } else {\n      actionButtonCaption = this.#componentLocale.actions.installed;\n    }\n\n    if (moreVersionsToUpdate) {\n      actionButtonClasses = `${actionButtonClasses} more-versions-available`;\n    }\n\n    return [\n      <div class=\"version-buttons-container\">\n        <button class={actionButtonClasses} onClick={actionButtonCallback}>\n          {actionButtonCaption}\n        </button>\n        {moreVersionsToUpdate ? (\n          <ch-action-menu-render\n            class=\"dropdown button-primary button-icon-only\"\n            blockAlign=\"outside-end\"\n            inlineAlign=\"inside-start\"\n            model={this.#versionsMenuOptionsModel()}\n            onButtonClick={this.#menuVersionSelectedHandler}\n          >\n            <ch-image src={CHEVRON_DOWN_ICON} class=\"icon-m\"></ch-image>\n          </ch-action-menu-render>\n        ) : null}\n      </div>\n    ];\n  };\n\n  #tabSelectionChangedHandler = (\n    event: CustomEvent<{\n      lastSelectedIndex: number;\n      newSelectedId: string;\n      newSelectedIndex: number;\n    }>\n  ): void => {\n    this.selectedTabId = event.detail.newSelectedId;\n  };\n\n  #renderDocSectionsSlots = (): JSX.Element => {\n    return this.docsTabModel.map(docSectionTab => {\n      if (docSectionTab.id === this.selectedTabId) {\n        const markdownValue = this.#docSectionIdDescriptionMap.get(\n          docSectionTab.id\n        );\n\n        return (\n          <ch-markdown-viewer\n            ref={(el: HTMLChMarkdownViewerElement) =>\n              (this.#chMarkdownViewer = el as HTMLChMarkdownViewerElement)\n            }\n            slot={docSectionTab.id}\n            key={docSectionTab.id}\n            class=\"markdown spacing-body scrollable\"\n            theme=\"components/markdown-viewer\"\n            value={markdownValue}\n          ></ch-markdown-viewer>\n        );\n      }\n    });\n  };\n\n  #returnFormatedId = (rawId: string): string => {\n    return rawId.toLowerCase().replace(/\\s+/g, \"-\");\n  };\n\n  #renderLinkTag = (\n    href: string,\n    label: string,\n    cssClass?: string,\n    chImageSrc?: string\n  ): HTMLAnchorElement => {\n    return (\n      <a\n        href={href}\n        target=\"_blank\"\n        onClick={this.#openLinkHandler(href)}\n        class={cssClass}\n      >\n        {chImageSrc && <ch-image src={chImageSrc} class=\"icon-m\"></ch-image>}\n        {label}\n      </a>\n    );\n  };\n\n  #renderAsideContent = (): JSX.Element => {\n    return this.data.infoCategories.map(infoCategory => {\n      return (\n        <div class=\"plugin__info-category\">\n          <h3 class=\"subtitle-semi-bold-s\">{infoCategory.name}</h3>\n          <ul\n            class={{\n              \"fields__list\": true,\n              \"fields__list--as-tags\": infoCategory.displayAsTags\n            }}\n          >\n            {infoCategory.fields.map(field => {\n              // If the field name isn’t specified, only the value is shown — usually a link.\n              const fieldValue: string | HTMLAnchorElement =\n                typeof field.value === \"string\"\n                  ? (field.value as string)\n                  : this.#renderLinkTag(\n                      (field.value as LinkData).url,\n                      (field.value as LinkData).text,\n                      \"field__link\"\n                    );\n              return (\n                <li class=\"field__li\">\n                  {field.name && !infoCategory.displayAsTags\n                    ? // displaysAsTags forces the items to be displayed as tags\n                      // no span.field__name and span.field__value\n                      [\n                        <span class=\"field__name body-semi-bold-s\">\n                          {field.name}\n                        </span>,\n                        <span class=\"field__value body-regular-s\">\n                          {fieldValue}\n                        </span>\n                      ]\n                    : fieldValue}\n                </li>\n              );\n            })}\n          </ul>\n        </div>\n      );\n    });\n  };\n\n  render() {\n    const renderActionButtons =\n      !this.data.installed ||\n      (this.data.installed && !!this.data.updateVersion);\n\n    const titleLinkDataText = (this.data.name as LinkData).text;\n    const titleLinkDataUrl = (this.data.name as LinkData).url;\n    const titleHasLink = titleLinkDataText && titleLinkDataUrl;\n    const titleText = titleLinkDataText || this.data.name;\n\n    const publisherDataText = (this.data.publisher as LinkData).text;\n    const publisherDataUrl = (this.data.publisher as LinkData).url;\n    const publisherHasLink = publisherDataText && publisherDataUrl;\n    const publisherText = publisherDataText || this.data.publisher;\n\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <section class=\"section\">\n          <header class=\"header\">\n            <img\n              class=\"plugin__icon\"\n              src={this.data.iconUrl || EXTENSION_ICON_IMG}\n              alt=\"plugin extension icon\"\n            />\n            <div class=\"plugin__details\">\n              {titleHasLink ? (\n                <h2 class=\"heading-5 has-link\">\n                  {this.#renderLinkTag(\n                    titleLinkDataUrl,\n                    titleText as string,\n                    \"text-underline\"\n                  )}\n                </h2>\n              ) : (\n                <h2 class=\"heading-5\">{titleText}</h2>\n              )}\n              {publisherHasLink ? (\n                this.#renderLinkTag(\n                  publisherDataUrl,\n                  titleText as string,\n                  \"text-underline plugin__publisher caption-semi-bold-l\",\n                  USER_ICON\n                )\n              ) : (\n                <p class=\"plugin__publisher caption-semi-bold-l\">\n                  <ch-image src={USER_ICON} class=\"icon-s\"></ch-image>\n                  {publisherText}\n                </p>\n              )}\n\n              <p class=\"plugin__description\">{this.data.description}</p>\n              <div class=\"buttons-spacer plugin__actions-container\">\n                {renderActionButtons ? (\n                  this.#renderActionButtons()\n                ) : (\n                  // installed and no updates\n                  <p class=\"installed-container subtitle-semi-bold-s\">\n                    <ch-image src={CHECK_CIRCLE_ICON} class=\"icon-s\"></ch-image>\n                    {this.#componentLocale.actions.installed}\n                  </p>\n                )}\n                {this.data.installed && this.#renderUninstallButton()}\n              </div>\n            </div>\n          </header>\n          <div class=\"main\">\n            {this.docsTabModel.length > 0 && (\n              <ch-tab-render\n                class=\"tab docsTab scrollable\"\n                tabListPosition=\"block-start\"\n                overflow=\"auto\"\n                contain=\"size\"\n                model={this.docsTabModel}\n                onSelectedItemChange={this.#tabSelectionChangedHandler}\n                selectedId={this.selectedTabId}\n              >\n                {this.#renderDocSectionsSlots()}\n              </ch-tab-render>\n            )}\n          </div>\n          <div class=\"aside spacing-body scrollable\">\n            {this.#renderAsideContent()}\n          </div>\n        </section>\n        {/* <slot></slot> */}\n      </Host>\n    );\n  }\n}\n\n// plugin-details.types.ts\n\nexport type LinkData = {\n  text: string;\n  url: string;\n};\n\nexport type PluginFieldData = {\n  name?: string;\n  value: string | LinkData;\n};\n\nexport type PluginInfoCategoryData = {\n  name: string;\n  fields: PluginFieldData[];\n  displayAsTags: boolean;\n};\n\nexport type DocSectionData = {\n  name: string;\n  content: string;\n};\n\nexport type PluginDetailsData = {\n  id: string;\n  name: string | LinkData;\n  publisher: string | LinkData;\n  installed: boolean;\n  updateVersion?: string;\n  versions: string[];\n  iconUrl: string;\n  description: string;\n  docSections: DocSectionData[];\n  infoCategories: PluginInfoCategoryData[];\n};\n"],"mappings":"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"}

package/dist/genexus-ide-ui/p-b3c5c315.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["progressBarCss","CSS_BUNDLES","CLOSE_ICON","getIconPath","category","name","colorType","PROGRESS_TRANSITION_SPEED","GxIdeProgressBar","this","evaluateInitialProgress","progress","undefined","stateType","el","style","setProperty","closeClickHandler","active","closedCallback","renderClose","closeType","h","class","onClick","role","tabIndex","visible","src","watchActiveHandler","setTimeout","topStateBarVisible","progressBarClosed","emit","watchProgressHandler","componentWillLoad","reset","disableTransition","render","Host","model","minimal","id","part","caption"],"sources":["src/components/_helpers/progress-bar/progress-bar.scss?tag=gx-ide-progress-bar&encapsulation=shadow","src/components/_helpers/progress-bar/progress-bar.tsx"],"sourcesContent":["// --progress-bar-transition-speed is defined on the Host in the .tsx\n$border: 1px solid var(--color-border-surface-on-elevation-1);\n\n:host {\n  --top-bar-progress: 0%;\n  display: grid;\n  grid-template-rows: 0fr;\n  transition: var(--timing-fast) grid-template-rows;\n  overflow: hidden;\n\n  //icon\n  --ds-icon-size-box--small: var(--font-size-body-s);\n  --ds-icon-size--small: 100%;\n\n  > * {\n    overflow: hidden;\n  }\n}\n:host(.disable-transition) {\n  --progress-bar-transition-speed: 0 !important;\n}\n:host(.visible) {\n  grid-template-rows: 1fr;\n}\n.top-state-bar {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-l);\n\n  > * {\n    position: relative;\n    z-index: 1;\n  }\n  border-radius: 4px;\n  list-style: var(--font-size-body-s);\n  display: flex;\n\n  &__outer-wrapper {\n    &::after,\n    &::before {\n      border-radius: 4px;\n    }\n    &::before {\n      content: \"\";\n      inline-size: 100%;\n      block-size: 100%;\n      inset-inline-start: 0;\n      inset-block-start: 0;\n      position: absolute;\n      background-color: var(--color-accent-surface-elevation-3);\n      z-index: 0;\n    }\n    &::after {\n      content: \"\";\n      inset-inline-start: 1px;\n      inset-block-start: 1px;\n      inline-size: calc(100% - 1px * 2);\n      block-size: calc(100% - 1px * 2);\n      position: absolute;\n      background-color: var(--color-accent-surface-surface);\n      z-index: 1;\n    }\n\n    position: relative;\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: var(--spacing-gap-l);\n    padding: var(--spacing-padding-l) var(--spacing-padding-l);\n  }\n  &__inner-wrapper {\n    flex: 1;\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    gap: var(--spacing-gap-m);\n    position: relative;\n    z-index: 2;\n  }\n  &__caption {\n    color: var(--color-text-neutral-strawberry);\n    font-size: var(--font-size-body-s);\n    line-height: var(--font-size-body-s);\n    font-weight: var(--font-style-regular);\n    display: flex;\n    align-items: center;\n    font-style: italic;\n  }\n  &__progress-wrapper {\n    block-size: 4px;\n    background-color: var(--color-accent-surface-elevation-1);\n    position: relative;\n    z-index: 2;\n  }\n  &__close {\n    cursor: pointer;\n    transition: var(--timing-fast) background-color;\n  }\n  &__inner-wrapper,\n  &__progress-wrapper,\n  &__close {\n    opacity: 0;\n    transition: 150ms opacity;\n  }\n\n  /*states*/\n  &--accent {\n    .progress-bar {\n      background-color: var(--color-accent-primary-default);\n    }\n  }\n  &--success {\n    .progress-bar {\n      background-color: var(--color-border-success-default);\n    }\n  }\n  &--warning {\n    .progress-bar {\n      background-color: var(--color-border-warning-default);\n    }\n  }\n  &--error {\n    .progress-bar {\n      background-color: var(--color-border-error-default);\n    }\n  }\n  &--in-progress {\n    .top-state-bar__outer-wrapper:before {\n      block-size: 0;\n      inline-size: 120%;\n      padding-block-start: 60%;\n      padding-block-end: 60%;\n      background: linear-gradient(\n        90deg,\n        rgba(91, 167, 255, 0.4) 0%,\n        rgba(63, 168, 155, 0.4) 100%\n      );\n      inset-block-start: 50%;\n      inset-inline-start: 50%;\n      transform: translate(-50%, -50%);\n      -webkit-animation: inProgressBackgroundColor 1s linear infinite;\n      animation: inProgressBackgroundColor 1s linear infinite;\n    }\n    .progress-bar {\n      position: relative;\n      overflow: hidden;\n      z-index: 1;\n      &:after {\n        content: \"\";\n        position: absolute;\n        z-index: 0;\n        inline-size: 300%;\n        block-size: 100%;\n        inset-inline-start: 0;\n        background: linear-gradient(\n          90deg,\n          rgba(147, 245, 235, 1) 0%,\n          rgba(26, 163, 255, 1) 33%,\n          rgba(147, 245, 235, 1) 66%,\n          rgba(26, 163, 255, 1) 100%\n        );\n        animation-name: inProgressBar;\n        animation-duration: 2s;\n        animation-iteration-count: infinite;\n      }\n    }\n  }\n  &--visible {\n    .top-state-bar__inner-wrapper,\n    .top-state-bar__progress-wrapper,\n    .top-state-bar__close {\n      opacity: 1;\n    }\n    .top-state-bar__close {\n      &:hover {\n        opacity: 0.75;\n      }\n      &:active {\n        opacity: 0.5;\n      }\n    }\n  }\n}\n\n// With Close Button (some spacing needs to be adjusted)\n:host(.with-close-button) {\n  .top-state-bar {\n    &__outer-wrapper {\n      padding-block-start: 4px;\n      gap: var(--spacing-gap-xs);\n    }\n  }\n}\n\n/*in progress animation*/\n@-webkit-keyframes inProgressBackgroundColor {\n  0% {\n    transform: translate(-50%, -50%) rotate(0);\n  }\n  100% {\n    transform: translate(-50%, -50%) rotate(1turn);\n  }\n}\n@-webkit-keyframes inProgressBar {\n  0% {\n    inset-inline-start: 0%;\n  }\n  100% {\n    inset-inline-start: -200%;\n  }\n}\n@-moz-keyframes inProgressBar {\n  0% {\n    inset-inline-start: 0%;\n  }\n  100% {\n    inset-inline-start: 200%;\n  }\n}\n@keyframes inProgressBar {\n  0% {\n    inset-inline-start: 0%;\n  }\n  100% {\n    inset-inline-start: -200%;\n  }\n}\n\n.progress-bar {\n  display: block;\n  transition: all var(--progress-bar-transition-speed);\n  inline-size: var(--top-bar-progress);\n  border-radius: calc(4px / 2);\n  block-size: 100%;\n}\n\n:host(.no-border),\n:host(.border-block-start),\n:host(.border-block-end) {\n  .top-state-bar__outer-wrapper {\n    &:before {\n      display: none;\n    }\n  }\n}\n:host(.border-block-start) {\n  .top-state-bar__outer-wrapper {\n    border-block-start: $border;\n  }\n}\n:host(.border-block-end) {\n  .top-state-bar__outer-wrapper {\n    border-block-end: $border;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n  Method\n} from \"@stencil/core\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"components/button\",\n  \"components/icon\",\n  \"components/combo-box\",\n  \"components/edit\",\n  \"components/tabular-grid\"\n];\n\nconst CLOSE_ICON = getIconPath({\n  category: \"system\",\n  name: \"close\",\n  colorType: \"primary\"\n});\nconst PROGRESS_TRANSITION_SPEED = 200;\n\n@Component({\n  tag: \"gx-ide-progress-bar\",\n  styleUrl: \"progress-bar.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/progress-bar\"]\n})\nexport class GxIdeProgressBar {\n  @Element() el: HTMLGxIdeProgressBarElement;\n\n  /**\n   * If true it will display the caption\n   */\n  @State() topStateBarVisible: boolean = false;\n\n  /**\n   * If true the progress will be updated instantly, without transition. This is required when the host user is calling the \"reset\" method.\n   */\n  @State() disableTransition: boolean = false;\n\n  /**\n   * If true it will display bar\n   */\n  @State() visible: boolean = false;\n\n  /**\n   * The top-bar title\n   */\n  @Prop() readonly caption: string;\n\n  /**\n   * It will only display the bar (no title, no close button)\n   */\n  @Prop({ reflect: true }) readonly minimal: boolean = false;\n\n  /**\n   * The top-bar active state. If false it will be hidden\n   */\n  @Prop({ mutable: true }) active: boolean = false;\n  @Watch(\"active\")\n  watchActiveHandler(active: boolean) {\n    if (active) {\n      this.visible = true;\n      setTimeout(() => {\n        this.topStateBarVisible = true;\n      }, 300);\n    } else {\n      this.topStateBarVisible = false;\n      setTimeout(() => {\n        this.visible = false;\n        this.el.style.setProperty(\"--top-bar-progress\", `0%`);\n        this.progressBarClosed.emit();\n      }, 300);\n    }\n  }\n\n  /**\n   * The top-bar state\n   */\n  @Prop({ mutable: true }) stateType: TopStateBarType = \"in-progress\";\n\n  /**\n   * The progress bar progress\n   */\n  @Prop({ mutable: true }) progress: number = undefined;\n  @Watch(\"progress\")\n  watchProgressHandler(progress: number) {\n    if (progress >= 0 && progress <= 100) {\n      this.el.style.setProperty(\"--top-bar-progress\", `${progress}%`);\n    }\n    if (progress === 100 && this.closeType === \"auto-close\") {\n      setTimeout(() => {\n        this.active = false;\n      }, 200);\n    }\n  }\n\n  /**\n   * How to display the close button\n   */\n  @Prop() readonly closeType: \"auto-close\" | \"button\" = \"button\";\n\n  /**\n   * A callback that gets called when the top-state-bar is closed\n   */\n  @Prop() readonly closedCallback: () => void = () => {};\n\n  /**\n   * Emitted every time the progress bar is closed.\n   */\n  @Event() progressBarClosed: EventEmitter;\n\n  componentWillLoad() {\n    this.evaluateInitialProgress();\n    if (this.active) {\n      this.visible = true;\n      this.topStateBarVisible = true;\n    }\n  }\n\n  /**\n   * Sets the progress bar to zero instantly (no transition) and changes the type\n   * to 'accent'. Useful when reusing the progress bar for a new process.\n   */\n  @Method()\n  async reset() {\n    // Resetting involves setting the progress to zero. In this case it is preferable\n    // to disable the transition.\n    this.disableTransition = true;\n    this.progress = 0;\n    this.stateType = \"accent\";\n    setTimeout(() => {\n      this.disableTransition = false; // enable transition for the nex process.\n    }, PROGRESS_TRANSITION_SPEED);\n  }\n\n  private evaluateInitialProgress = () => {\n    if (\n      this.progress === undefined &&\n      (this.stateType === \"error\" ||\n        this.stateType === \"warning\" ||\n        this.stateType === \"success\")\n    ) {\n      this.progress = 100;\n    } else if (\n      this.progress === undefined &&\n      this.stateType === \"in-progress\"\n    ) {\n      this.progress = 0;\n    }\n    this.el.style.setProperty(\"--top-bar-progress\", `${this.progress}%`);\n  };\n\n  private closeClickHandler = () => {\n    this.active = false;\n    this.closedCallback();\n  };\n\n  private renderClose = () => {\n    return (\n      this.closeType === \"button\" && (\n        <button\n          class=\"button-tertiary button-icon-only\"\n          aria-label=\"close\"\n          onClick={this.closeClickHandler}\n          role=\"button\"\n          tabIndex={this.visible ? 0 : -1}\n        >\n          <ch-image src={CLOSE_ICON} class=\"icon-m\"></ch-image>\n        </button>\n      )\n    );\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          \"visible\": this.visible,\n          \"with-close-button\": this.closeType === \"button\",\n          \"disable-transition\": this.disableTransition\n        }}\n        aria-hidden={!this.active}\n        style={{\n          \"--progress-bar-transition-speed\": `${PROGRESS_TRANSITION_SPEED}ms`\n        }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <div\n          role=\"status\"\n          aria-labelledby=\"label\"\n          aria-hidden={!this.active}\n          class={{\n            \"top-state-bar\": true,\n            [`top-state-bar--${this.stateType}`]: true,\n            \"top-state-bar--visible\": this.topStateBarVisible\n          }}\n        >\n          <div class=\"top-state-bar__outer-wrapper\">\n            {!this.minimal ? (\n              <div class=\"top-state-bar__inner-wrapper\">\n                <label\n                  id=\"label\"\n                  class={{\n                    \"top-state-bar__caption\": true\n                  }}\n                  part=\"label\"\n                >\n                  {this.caption}\n                </label>\n\n                {this.renderClose()}\n              </div>\n            ) : null}\n            <div\n              class={{\n                \"top-state-bar__progress-wrapper\": true\n              }}\n              part=\"progress-wrapper\"\n            >\n              <span class=\"progress-bar\"></span>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type TopStateBarType =\n  | \"accent\"\n  | \"success\"\n  | \"warning\"\n  | \"error\"\n  | \"in-progress\";\n"],"mappings":";;;;;;;;;;;;AAAA,MAAMA,IAAiB;;ACcvB,MAAMC,IAA8B,EAClC,qBACA,cACA,gBACA,oBACA,qBACA,mBACA,wBACA,mBACA;;AAGF,MAAMC,IAAaC,EAAY;EAC7BC,UAAU;EACVC,MAAM;EACNC,WAAW;;;AAEb,MAAMC,IAA4B;;MAQrBC,IAAgB;;;;IA6GnBC,KAAAC,0BAA0B;MAChC,IACED,KAAKE,aAAaC,cACjBH,KAAKI,cAAc,WAClBJ,KAAKI,cAAc,aACnBJ,KAAKI,cAAc,YACrB;QACAJ,KAAKE,WAAW;aACX,IACLF,KAAKE,aAAaC,aAClBH,KAAKI,cAAc,eACnB;QACAJ,KAAKE,WAAW;;MAElBF,KAAKK,GAAGC,MAAMC,YAAY,sBAAsB,GAAGP,KAAKE;AAAY;IAG9DF,KAAAQ,oBAAoB;MAC1BR,KAAKS,SAAS;MACdT,KAAKU;AAAgB;IAGfV,KAAAW,cAAc,MAElBX,KAAKY,cAAc,YACjBC,EAAA;MACEC,OAAM;MAAkC,cAC7B;MACXC,SAASf,KAAKQ;MACdQ,MAAK;MACLC,UAAUjB,KAAKkB,UAAU,KAAK;OAE9BL,EAAA;MAAUM,KAAK1B;MAAYqB,OAAM;;8BAvIF;6BAKD;mBAKV;;mBAUyB;kBAKV;qBAqBW;oBAKVX;qBAgBU;0BAKR;;EA7C9C,kBAAAiB,CAAmBX;IACjB,IAAIA,GAAQ;MACVT,KAAKkB,UAAU;MACfG,YAAW;QACTrB,KAAKsB,qBAAqB;AAAI,UAC7B;WACE;MACLtB,KAAKsB,qBAAqB;MAC1BD,YAAW;QACTrB,KAAKkB,UAAU;QACflB,KAAKK,GAAGC,MAAMC,YAAY,sBAAsB;QAChDP,KAAKuB,kBAAkBC;AAAM,UAC5B;;;EAcP,oBAAAC,CAAqBvB;IACnB,IAAIA,KAAY,KAAKA,KAAY,KAAK;MACpCF,KAAKK,GAAGC,MAAMC,YAAY,sBAAsB,GAAGL;;IAErD,IAAIA,MAAa,OAAOF,KAAKY,cAAc,cAAc;MACvDS,YAAW;QACTrB,KAAKS,SAAS;AAAK,UAClB;;;EAmBP,iBAAAiB;IACE1B,KAAKC;IACL,IAAID,KAAKS,QAAQ;MACfT,KAAKkB,UAAU;MACflB,KAAKsB,qBAAqB;;;;;;SAS9B,WAAMK;;;IAGJ3B,KAAK4B,oBAAoB;IACzB5B,KAAKE,WAAW;IAChBF,KAAKI,YAAY;IACjBiB,YAAW;MACTrB,KAAK4B,oBAAoB;+EAAK;YAC7B9B;;EAyCL,MAAA+B;IACE,OACEhB,EAACiB,GAAI;MACHhB,OAAO;QACLI,SAAWlB,KAAKkB;QAChB,qBAAqBlB,KAAKY,cAAc;QACxC,sBAAsBZ,KAAK4B;;MAC5B,gBACa5B,KAAKS;MACnBH,OAAO;QACL,mCAAmC,GAAGR;;OAGxCe,EAAA;MAAUkB,OAAOvC;QACjBqB,EAAA;MACEG,MAAK;MAAQ,mBACG;MAAO,gBACThB,KAAKS;MACnBK,OAAO;QACL,iBAAiB;QACjB,CAAC,kBAAkBd,KAAKI,cAAc;QACtC,0BAA0BJ,KAAKsB;;OAGjCT,EAAA;MAAKC,OAAM;QACPd,KAAKgC,UACLnB,EAAA;MAAKC,OAAM;OACTD,EAAA;MACEoB,IAAG;MACHnB,OAAO;QACL,0BAA0B;;MAE5BoB,MAAK;OAEJlC,KAAKmC,UAGPnC,KAAKW,iBAEN,MACJE,EAAA;MACEC,OAAO;QACL,mCAAmC;;MAErCoB,MAAK;OAELrB,EAAA;MAAMC,OAAM"}

package/dist/genexus-ide-ui/p-fc0bc991.entry.js

@@ -1,204 +0,0 @@
-import { g as t, r as e, h as i, H as o, a as n } from "./p-9b9ccd0c.js";
-
-import { g as s } from "./p-d42e842b.js";
-
-import "./p-6534555e.js";
-
-import "lit";
-
-import "lit/directives/when.js";
-
-import "lit/directives/if-defined.js";
-
-import { L as r } from "./p-311eedf3.js";
-
-import { c as a } from "./p-c5196b3b.js";
-
-const c = ":host{display:grid;block-size:100%;position:relative}.outer-container{grid-template-rows:max-content 1fr}.inner-container{position:relative}.list-box::part(item){width:100%;min-width:100%}.list-box::part(item__action){gap:var(--spacing-gap-xs)}.list-box::part(item__caption){font-weight:var(--font-style-semi-bold)}.list-box::part(custom-container){display:flex;flex-direction:column;gap:var(--spacing-gap-xs);width:100%}.list-box::part(custom-image){block-size:32px;inline-size:32px;margin-inline-end:12px}.list-box::part(custom-description){font-size:var(--font-size-body-s);margin:0;opacity:0.8;line-height:var(--line-height-relaxed);margin-inline-end:8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.list-box::part(item__block-end start){width:100%;min-width:100%}.list-box::part(custom-brand){font-weight:var(--font-style-semi-bold);display:flex;gap:var(--spacing-gap-xs);align-items:center}.list-box::part(custom-brand-icon){--icon-path:var(--icon__system_user_neutral--enabled);display:inline-block;background-image:var(--icon-path);background-size:contain;background-repeat:no-repeat;background-position:center center;block-size:16px;inline-size:16px}.list-box::part(custom-button){--button-color:var(--color-text-primary-default);--button-color--enabled:var(--color-text-neutral-on-text);--button-color--active:var(--color-text-neutral-on-pressed);display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;justify-content:center;padding-block:var(--control-padding-block);padding-inline:var(--control-padding-inline);box-sizing:border-box;color:var(--button-color);font-weight:var(--font-style-semi-bold);margin-block-end:auto;margin-block-start:auto;text-transform:capitalize}.list-box::part(custom-button):hover{--button-color:var(--color-text-primary-hover)}.list-box::part(custom-button):active{--button-color:var(--color-text-primary-pressed)}";
-
-var l = undefined && undefined.__classPrivateFieldGet || function(t, e, i, o) {
-  if (i === "a" && !o) throw new TypeError("Private accessor was defined without a getter");
-  if (typeof e === "function" ? t !== e || !o : !e.has(t)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-  return i === "m" ? o : i === "a" ? o.call(t) : o ? o.value : e.get(t);
-};
-
-var d = undefined && undefined.__classPrivateFieldSet || function(t, e, i, o, n) {
-  if (o === "m") throw new TypeError("Private method is not writable");
-  if (o === "a" && !n) throw new TypeError("Private accessor was defined without a setter");
-  if (typeof e === "function" ? t !== e || !n : !e.has(t)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-  return o === "a" ? n.call(t, i) : n ? n.value = i : e.set(t, i), i;
-};
-
-var p, u, h, m, g, b, f, x;
-
-const v = s({
-  category: "system",
-  name: "filters",
-  colorType: "on-surface"
-});
-
-// plugin icon if no iconUrl was provided
-const w = t(`./gx-ide-assets/plugin-manager/images/plugin-icon.svg`);
-
-const y = [ "resets/box-sizing", "components/list-box", "components/button", "components/edit", "utils/form", "utils/layout", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
-
-const k = class {
-  constructor(t) {
-    e(this, t);
-    /**
-         * The component hard-coded strings translations.
-         */
-    // eslint-disable-next-line @stencil-community/own-props-must-be-private
-        p.set(this, void 0);
-    u.set(this, false);
-    h.set(this, ((t, e) => i => {
-      i.stopPropagation();
-      this.executeActionCallback(t, e);
-    }));
-    m.set(this, (t => {
-      const e = [];
-      const o = {
-        type: "separator"
-      };
-      t === null || t === void 0 ? void 0 : t.forEach(((t, n) => {
-        const s = !!t.action;
-        const r = {
-          id: t.id,
-          caption: t.name,
-          imgSrc: t.iconUrl,
-          type: "actionable",
-          additionalInformation: {
-            "stretch-start": {
-              center: [ {
-                part: "custom-image",
-                jsx: () => i("img", {
-                  part: "custom-image",
-                  src: t.iconUrl || w,
-                  alt: `${l(this, p, "f").logotype.replace("PLUGIN_NAME_PLACEHOLDER", t.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: () => i("div", {
-                  part: "custom-container",
-                  title: t.description
-                }, i("p", {
-                  part: "custom-description"
-                }, t.description), i("small", {
-                  part: "custom-brand"
-                }, t.publisher))
-                // {
-                //   slot: "abcd"
-                // } as ActionListItemAdditionalSlot // slot not working
-                            } ]
-            },
-            "stretch-end": s && {
-              center: [ {
-                jsx: () => i("button", {
-                  part: "custom-button",
-                  onClick: l(this, h, "f").call(this, t.id, t.action)
-                }, t.action)
-              } ]
-            }
-          }
-        };
-        if (n !== 0) {
-          e.push(o);
-        }
-        e.push(r);
-      }));
-      return e;
-    }));
-    g.set(this, (async t => {
-      this.loading = true;
-      const e = t.detail;
-      this.plugins = await this.filterCallback(e);
-    }));
-    b.set(this, (() => {
-      const t = this.pluginsActionListModel.length;
-      return t ? i("ch-action-list-render", {
-        model: this.pluginsActionListModel,
-        class: "list-box",
-        selection: "single",
-        onSelectedItemsChange: l(this, x, "f")
-      }) : i("gx-ide-empty-state", {
-        isAnimated: l(this, u, "f"),
-        class: "recent-objects__empty-state",
-        stateIconSrc: v,
-        stateTitle: l(this, p, "f").emptyStateTitle,
-        stateDescription: l(this, p, "f").emptyStateDescription
-      });
-    }));
-    f.set(this, (() => {
-      d(this, u, true, "f");
-      return i("gx-ide-loader", {
-        loaderTitle: l(this, p, "f").loaderTitle,
-        description: l(this, p, "f").loaderDescription,
-        show: true
-      });
-    }));
-    x.set(this, (t => {
-      var e;
-      const i = (e = t.detail[0]) === null || e === void 0 ? void 0 : e.item.type;
-      if (i === "actionable") {
-        const e = t.detail[0].item.id;
-        this.showDetailsCallback(e);
-      }
-    }));
-    this.loading = true;
-    this.pluginsActionListModel = [];
-    this.plugins = undefined;
-    this.filterCallback = undefined;
-    this.showDetailsCallback = undefined;
-    this.executeActionCallback = undefined;
-  }
-  pluginsChangedHandler(t) {
-    this.pluginsActionListModel = l(this, m, "f").call(this, t);
-    this.loading = false;
-  }
-  async componentWillLoad() {
-    d(this, p, await r.getComponentStrings(this.el), "f");
-    this.pluginsChangedHandler(this.plugins);
-  }
-  render() {
-    return i(o, {
-      class: "widget"
-    }, i("ch-theme", {
-      model: y
-    }), i("div", {
-      class: "outer-container field-group"
-    }, i("ch-edit", {
-      id: "search-plugins-input",
-      class: "input",
-      accessibleName: l(this, p, "f").accessibleName,
-      placeholder: l(this, p, "f").searchInputPlaceholder,
-      debounce: a.inputDebounce,
-      onInput: l(this, g, "f"),
-      type: "search"
-    }), i("div", {
-      class: "inner-container"
-    }, this.loading ? l(this, f, "f").call(this) : l(this, b, "f").call(this))));
-  }
-  static get assetsDirs() {
-    return [ "gx-ide-assets/plugin-explorer" ];
-  }
-  get el() {
-    return n(this);
-  }
-  static get watchers() {
-    return {
-      plugins: [ "pluginsChangedHandler" ]
-    };
-  }
-};
-
-p = new WeakMap, u = new WeakMap, h = new WeakMap, m = new WeakMap, g = new WeakMap, 
-b = new WeakMap, f = new WeakMap, x = new WeakMap;
-
-k.style = c;
-
-export { k as gx_ide_plugin_explorer };
-//# sourceMappingURL=p-fc0bc991.entry.js.map

package/dist/genexus-ide-ui/p-fc0bc991.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["pluginExplorerCss","FILTER_ICON","getIconPath","category","name","colorType","EXTENSION_ICON_IMG","getAssetPath","CSS_BUNDLES","GxIdePluginManager","_GxIdePluginManager_componentLocale","set","this","_GxIdePluginManager_animateEmptyState","_GxIdePluginManager_actionListButtonClickHandler","pluginId","action","event","stopPropagation","executeActionCallback","_GxIdePluginManager_mapPluginDataToActionListModel","pluginsData","pluginsActionListModel","separatorItem","type","forEach","pluginData","index","hasActionButton","pluginItem","id","caption","imgSrc","iconUrl","additionalInformation","center","part","jsx","h","src","alt","__classPrivateFieldGet","logotype","replace","loading","start","title","description","publisher","onClick","call","push","_GxIdePluginManager_pluginsFilterInputHandler","async","filterValue","detail","plugins","filterCallback","_GxIdePluginManager_evaluateContentToDisplay","pluginsToDisplay","length","model","class","selection","onSelectedItemsChange","_GxIdePluginManager_pluginSelectedHandler","isAnimated","stateIconSrc","stateTitle","emptyStateTitle","stateDescription","emptyStateDescription","_GxIdePluginManager_renderLoader","__classPrivateFieldSet","loaderTitle","loaderDescription","show","eventType","_a","item","showDetailsCallback","pluginsChangedHandler","newPlugins","componentWillLoad","Locale","getComponentStrings","el","render","Host","accessibleName","placeholder","searchInputPlaceholder","debounce","config","inputDebounce","onInput"],"sources":["src/components/plugin-explorer/plugin-explorer.scss?tag=gx-ide-plugin-explorer&encapsulation=shadow","src/components/plugin-explorer/plugin-explorer.tsx"],"sourcesContent":["@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n  display: grid;\n  block-size: 100%;\n  position: relative;\n}\n\n.outer-container {\n  grid-template-rows: max-content 1fr;\n}\n.inner-container {\n  position: relative;\n}\n\n.list-box::part(item) {\n  width: 100%;\n  min-width: 100%;\n}\n.list-box::part(item__action) {\n  gap: var(--spacing-gap-xs);\n}\n.list-box::part(item__caption) {\n  font-weight: var(--font-style-semi-bold);\n}\n.list-box::part(custom-container) {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-gap-xs);\n  width: 100%;\n}\n.list-box::part(custom-image) {\n  block-size: 32px;\n  inline-size: 32px;\n  margin-inline-end: 12px;\n}\n.list-box::part(custom-description) {\n  font-size: var(--font-size-body-s);\n  margin: 0;\n  opacity: 0.8;\n  line-height: var(--line-height-relaxed);\n  margin-inline-end: 8px;\n  @include ellipsis();\n}\n.list-box::part(item__block-end start) {\n  width: 100%;\n  min-width: 100%;\n}\n.list-box::part(custom-brand) {\n  font-weight: var(--font-style-semi-bold);\n  display: flex;\n  gap: var(--spacing-gap-xs);\n  align-items: center;\n}\n.list-box::part(custom-brand-icon) {\n  // --icon-path: var(--icon__system_publish_on-elevation--enabled);\n  --icon-path: var(--icon__system_user_neutral--enabled);\n  display: inline-block;\n  background-image: var(--icon-path);\n  background-size: contain;\n  background-repeat: no-repeat;\n  background-position: center center;\n  block-size: 16px;\n  inline-size: 16px;\n}\n.list-box::part(custom-button) {\n  // WA: Style the button like a Mercury primary button\n  // \"Slot\" not working apparently.\n  --button-color: var(--color-text-primary-default);\n  --button-color--enabled: var(--color-text-neutral-on-text);\n  --button-color--active: var(--color-text-neutral-on-pressed);\n  display: inline-grid;\n  grid-auto-flow: column;\n  grid-auto-columns: max-content;\n  justify-content: center;\n  padding-block: var(--control-padding-block);\n  padding-inline: var(--control-padding-inline);\n  box-sizing: border-box;\n  color: var(--button-color);\n  font-weight: var(--font-style-semi-bold);\n  margin-block-end: auto;\n  margin-block-start: auto;\n  text-transform: capitalize;\n}\n.list-box::part(custom-button):hover {\n  --button-color: var(--color-text-primary-hover);\n}\n.list-box::part(custom-button):active {\n  --button-color: var(--color-text-primary-pressed);\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  State,\n  Element,\n  h,\n  Watch,\n  getAssetPath\n} from \"@stencil/core\";\n\nimport { getIconPath, MercuryBundles } from \"@genexus/mercury\";\nimport { Locale } from \"../../common/locale\";\nimport { config } from \"../../common/config\";\n\nimport { ActionListModel } from \"@genexus/chameleon-controls-library\";\nimport {\n  ActionListItemModel,\n  ActionListItemModelExtended,\n  ActionListItemSeparator\n} from \"@genexus/chameleon-controls-library/dist/types/components/action-list/types\";\n\nconst FILTER_ICON = getIconPath({\n  category: \"system\",\n  name: \"filters\",\n  colorType: \"on-surface\"\n});\n\n// plugin icon if no iconUrl was provided\nconst EXTENSION_ICON_IMG = getAssetPath(\n  `./gx-ide-assets/plugin-manager/images/plugin-icon.svg`\n);\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/list-box\",\n  \"components/button\",\n  \"components/edit\",\n  \"utils/form\",\n  \"utils/layout\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\n@Component({\n  tag: \"gx-ide-plugin-explorer\",\n  styleUrl: \"plugin-explorer.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/plugin-explorer\"]\n})\nexport class GxIdePluginManager {\n  /**\n   * The component hard-coded strings translations.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n  #animateEmptyState: boolean = false;\n\n  @Element() el: HTMLGxIdePluginExplorerElement;\n\n  /**\n   * If true it will hide the content, and display a loader\n   */\n  @State() loading: boolean = true;\n\n  /**\n   * The plugins model as ActionListModel, which is the model the ch-action-list expects\n   */\n  @State() pluginsActionListModel: ActionListModel = [];\n\n  /**\n   * List of plugins to display. Usually used to initialize the component.\n   */\n  @Prop({ mutable: true }) plugins: PluginData[];\n  @Watch(\"plugins\")\n  pluginsChangedHandler(newPlugins: PluginData[]) {\n    this.pluginsActionListModel =\n      this.#mapPluginDataToActionListModel(newPlugins);\n    this.loading = false;\n  }\n\n  /**\n   * Callback that should be invoked when the user updates the filter.\n   * A debounce should be applied before invoking this function.\n   */\n  @Prop() readonly filterCallback!: (text: string) => Promise<PluginData[]>;\n\n  /**\n   * Callback that should be invoked when the user clicks or presses Enter\n   * on a selected plugin item.\n   */\n  @Prop() readonly showDetailsCallback!: (pluginId: string) => Promise<void>;\n\n  /**\n   * Callback that should be invoked when the user clicks on a plugin's action button.\n   */\n  @Prop() readonly executeActionCallback!: (\n    pluginId: string,\n    action: PluginAction\n  ) => Promise<void>;\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n    this.pluginsChangedHandler(this.plugins);\n  }\n\n  #actionListButtonClickHandler =\n    (pluginId: string, action: PluginAction) => (event: MouseEvent) => {\n      event.stopPropagation();\n      this.executeActionCallback(pluginId, action);\n    };\n\n  #mapPluginDataToActionListModel = (\n    pluginsData: PluginData[]\n  ): ActionListModel => {\n    const pluginsActionListModel: ActionListModel = [];\n    const separatorItem: ActionListItemSeparator = { type: \"separator\" };\n\n    pluginsData?.forEach((pluginData, index) => {\n      const hasActionButton = !!pluginData.action;\n      const pluginItem = {\n        id: pluginData.id,\n        caption: pluginData.name,\n        imgSrc: pluginData.iconUrl,\n        type: \"actionable\",\n\n        additionalInformation: {\n          \"stretch-start\": {\n            center: [\n              {\n                part: \"custom-image\",\n                jsx: () => (\n                  <img\n                    part=\"custom-image\"\n                    src={pluginData.iconUrl || EXTENSION_ICON_IMG}\n                    alt={`${this.#componentLocale.logotype.replace(\n                      \"PLUGIN_NAME_PLACEHOLDER\",\n                      pluginData.name\n                    )}`}\n                    loading=\"lazy\"\n                  />\n                )\n              }\n            ]\n          },\n          \"block-end\": {\n            start: [\n              {\n                part: \"custom-description custom-button custom-container custom-brand custom-brand-icon custom-image item__block-end start\",\n                jsx: () => (\n                  <div part=\"custom-container\" title={pluginData.description}>\n                    <p part=\"custom-description\">{pluginData.description}</p>\n                    <small part=\"custom-brand\">{pluginData.publisher}</small>\n                  </div>\n                )\n              }\n              // {\n              //   slot: \"abcd\"\n              // } as ActionListItemAdditionalSlot // slot not working\n            ]\n          },\n          \"stretch-end\": hasActionButton && {\n            center: [\n              {\n                jsx: () => (\n                  <button\n                    part=\"custom-button\"\n                    onClick={this.#actionListButtonClickHandler(\n                      pluginData.id,\n                      pluginData.action\n                    )}\n                  >\n                    {pluginData.action}\n                  </button>\n                )\n              }\n            ]\n          }\n        }\n      } as ActionListItemModel;\n      if (index !== 0) {\n        pluginsActionListModel.push(separatorItem);\n      }\n      pluginsActionListModel.push(pluginItem);\n    });\n\n    return pluginsActionListModel;\n  };\n\n  #pluginsFilterInputHandler = async (\n    event: CustomEvent<string> | InputEvent\n  ) => {\n    this.loading = true;\n    const filterValue = event.detail as string;\n    this.plugins = await this.filterCallback(filterValue);\n  };\n\n  #evaluateContentToDisplay = () => {\n    const pluginsToDisplay = this.pluginsActionListModel.length;\n    return pluginsToDisplay ? (\n      <ch-action-list-render\n        model={this.pluginsActionListModel}\n        class=\"list-box\"\n        selection=\"single\"\n        onSelectedItemsChange={this.#pluginSelectedHandler}\n      >\n        {/* <p slot=\"abcd\">Slot for \"abcd\" id</p> */}\n      </ch-action-list-render>\n    ) : (\n      <gx-ide-empty-state\n        isAnimated={this.#animateEmptyState}\n        class=\"recent-objects__empty-state\"\n        stateIconSrc={FILTER_ICON}\n        stateTitle={this.#componentLocale.emptyStateTitle}\n        stateDescription={this.#componentLocale.emptyStateDescription}\n      ></gx-ide-empty-state>\n    );\n  };\n\n  #renderLoader = () => {\n    this.#animateEmptyState = true;\n    return (\n      <gx-ide-loader\n        loaderTitle={this.#componentLocale.loaderTitle}\n        description={this.#componentLocale.loaderDescription}\n        show\n      ></gx-ide-loader>\n    );\n  };\n\n  #pluginSelectedHandler = (\n    event: CustomEvent<ActionListItemModelExtended[]>\n  ) => {\n    const eventType = event.detail[0]?.item.type;\n    if (eventType === \"actionable\") {\n      const pluginId = event.detail[0].item.id;\n      this.showDetailsCallback(pluginId);\n    }\n  };\n\n  render() {\n    return (\n      <Host class=\"widget\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n\n        <div class=\"outer-container field-group\">\n          <ch-edit\n            id=\"search-plugins-input\"\n            class=\"input\"\n            accessibleName={this.#componentLocale.accessibleName}\n            placeholder={this.#componentLocale.searchInputPlaceholder}\n            debounce={config.inputDebounce}\n            onInput={this.#pluginsFilterInputHandler}\n            type=\"search\"\n          ></ch-edit>\n          <div class=\"inner-container\">\n            {this.loading\n              ? this.#renderLoader()\n              : this.#evaluateContentToDisplay()}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n\nexport type PluginData = {\n  id: string;\n  iconUrl: string;\n  name: string;\n  description: string;\n  publisher: string;\n  action?: PluginAction;\n};\n\nexport type PluginAction = \"install\" | \"update\";\n"],"mappings":"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"}