@genexus/genexus-ide-ui 1.1.3 → 1.1.5

package/dist/collection/components/chat/chat-container/gx-ide-assets/chat-container/langs/chat-container.lang.zh.json

@@ -0,0 +1,9 @@
+{
+  "componentName": "Chat Container",
+  "showMenuAriaLabel": "Show actions",
+  "copyConversationLabel": "Copy conversation",
+  "clearConversationLabel": "Clear conversation",
+  "copyResponseAriaLabel": "Copy response",
+  "sendPromptAriaLabel": "Send prompt",
+  "stopGeneratingAnswerAriaLabel": "Stop response"
+}

package/dist/collection/components/chat/chat-welcome/chat-welcome.css

@@ -0,0 +1,109 @@
+:host {
+  block-size: 100%;
+}
+
+.welcome-container {
+  --opacity: 1;
+  --translate-y: 0;
+  opacity: var(--opacity);
+  transform: translateY(var(--translate-y));
+  transition: all var(--transition-duration);
+  display: flex;
+  block-size: 100%;
+  grid-template-rows: max-content max-content;
+  flex-direction: column;
+  justify-content: space-between;
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-size: contain;
+}
+.welcome-container.hidden {
+  --opacity: 0;
+  --translate-y: 4px;
+}
+
+.header {
+  --opacity: 0;
+  --translate-y: 3px;
+  transition: all var(--transition-duration) var(--transition-delay) cubic-bezier(0.4, 0, 0.2, 1);
+  transform: translateY(var(--translate-y));
+  opacity: var(--opacity);
+  display: flex;
+  flex-direction: column;
+  gap: var(--mer-spacing--md);
+  align-items: center;
+  padding: var(--mer-spacing--md);
+}
+.header--visible {
+  --opacity: 1;
+  --translate-y: 0;
+}
+.header__circle {
+  inline-size: 55px;
+  block-size: 55px;
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-position: center center;
+  margin-block-end: -6px;
+}
+.header__title {
+  display: grid;
+  text-align: center;
+  margin: 0;
+  text-align: center;
+  white-space: pre-line;
+  line-height: 1.3;
+  font-weight: 600;
+  font-size: var(--font-size-header-h3);
+}
+.header__greeting {
+  line-height: 1.4;
+  text-align: center;
+  font-weight: 300;
+}
+
+.suggested-prompts {
+  --opacity: 1;
+  opacity: var(--opacity);
+  transition: opacity var(--transition-duration);
+  display: flex;
+  flex-direction: column;
+  gap: var(--mer-spacing--md);
+  list-style: none;
+  margin: 0;
+  padding: var(--mer-spacing--md);
+}
+.suggested-prompts.hidden {
+  --opacity: 0;
+}
+.suggested-prompts__button {
+  opacity: 0;
+  transform: translateX(-3px);
+  animation: fadeInSuggestedPromptButton var(--mer-timing--regular) ease forwards;
+  animation-delay: var(--delay, 0s);
+  border: 0;
+  padding: var(--mer-spacing--sm);
+  border-radius: 30px;
+  font-size: 14px;
+  font-style: oblique;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: var(--mer-spacing--xs);
+  background-color: #22334a;
+  font-weight: 100;
+}
+.suggested-prompts__button:hover {
+  background-color: #1a2b42;
+}
+
+@keyframes fadeInSuggestedPromptButton {
+  from {
+    opacity: 0;
+    transform: translateX(-3px);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}

package/dist/collection/components/chat/chat-welcome/chat-welcome.js

@@ -0,0 +1,228 @@
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m")
+        throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _GxIdeChatWelcome_componentLocale, _GxIdeChatWelcome_animationEntrance, _GxIdeChatWelcome_sendPromptToChat, _GxIdeChatWelcome_animationExit;
+/* eslint-disable @stencil-community/strict-mutable */
+import { Host, h, getAssetPath } from "@stencil/core";
+import { getIconPath } from "@genexus/mercury";
+import { Locale } from "../../../common/locale";
+const HEADER_ILLUSTRATION = getAssetPath(`./gx-ide-assets/chat-welcome/images/header-illustration.svg`);
+const AI_AVATAR = getAssetPath(`./gx-ide-assets/chat-welcome/images/ai-avatar-welcome.svg`);
+const HEADER_TRANSITION_DELAY = 100;
+const HEADER_TRANSITION_DURATION = 500;
+const SUGGESTED_PROMPT_BUTTON_INTERVAL = 200;
+const SUGGESTED_PROMPT_BUTTONS_DELAY = 500;
+const WELCOME_EXIT_DURATION = 100;
+const AI_ICON = getIconPath({
+    category: "system",
+    name: "assistant",
+    colorType: "primary"
+});
+const ARROW_RIGHT_ICON = getIconPath({
+    category: "system",
+    name: "arrow-right",
+    colorType: "primary"
+});
+const CSS_BUNDLES = [
+    "resets/box-sizing",
+    "components/chat",
+    "components/icon",
+    "utils/typography"
+];
+export class GxIdeChatWelcome {
+    constructor() {
+        // eslint-disable-next-line @stencil-community/own-props-must-be-private
+        _GxIdeChatWelcome_componentLocale.set(this, void 0);
+        _GxIdeChatWelcome_animationEntrance.set(this, () => {
+            setTimeout(() => {
+                this.showHeader = true;
+                setTimeout(() => {
+                    this.showSuggestedPrompts = true;
+                }, SUGGESTED_PROMPT_BUTTONS_DELAY);
+            }, HEADER_TRANSITION_DELAY + HEADER_TRANSITION_DURATION);
+        });
+        _GxIdeChatWelcome_sendPromptToChat.set(this, async (e) => {
+            const prompt = e.currentTarget.dataset["prommpt"];
+            await __classPrivateFieldGet(this, _GxIdeChatWelcome_animationExit, "f").call(this);
+            this.suggestedPrompRequestedCallback(prompt);
+        });
+        _GxIdeChatWelcome_animationExit.set(this, async () => {
+            this.hideWelcome = true;
+            await new Promise(resolve => setTimeout(resolve, WELCOME_EXIT_DURATION));
+        });
+        this.showHeader = false;
+        this.showSuggestedPrompts = false;
+        this.hideWelcome = false;
+        this.welcomeTitle = undefined;
+        this.welcomeGreeting = undefined;
+        this.suggestedPrompts = undefined;
+        this.suggestedPrompRequestedCallback = undefined;
+    }
+    async componentWillLoad() {
+        __classPrivateFieldSet(this, _GxIdeChatWelcome_componentLocale, await Locale.getComponentStrings(this.el), "f");
+        // Set defaults
+        if (!this.welcomeTitle) {
+            this.welcomeTitle = __classPrivateFieldGet(this, _GxIdeChatWelcome_componentLocale, "f").welcomeTitle;
+        }
+        if (!this.welcomeGreeting) {
+            this.welcomeGreeting = __classPrivateFieldGet(this, _GxIdeChatWelcome_componentLocale, "f").welcomeGreeting;
+        }
+        if (!this.suggestedPrompts) {
+            this.suggestedPrompts = __classPrivateFieldGet(this, _GxIdeChatWelcome_componentLocale, "f").suggestedPrompts;
+        }
+    }
+    componentDidRender() {
+        if (!this.hideWelcome) {
+            __classPrivateFieldGet(this, _GxIdeChatWelcome_animationEntrance, "f").call(this);
+        }
+    }
+    /**
+     * It will exit the wellcome screen and remove it from the dom.
+     */
+    async exitWelcome() {
+        __classPrivateFieldGet(this, _GxIdeChatWelcome_animationExit, "f").call(this);
+    }
+    render() {
+        return (h(Host, null, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: { "welcome-container": true, "hidden": this.hideWelcome }, style: {
+                "backgroundImage": `url(${HEADER_ILLUSTRATION})`,
+                "--transition-duration": `${WELCOME_EXIT_DURATION}ms`
+            } }, h("header", { class: { "header": true, "header--visible": this.showHeader }, style: {
+                "--transition-delay": `${HEADER_TRANSITION_DELAY}ms`,
+                "--transition-duration": `${HEADER_TRANSITION_DURATION}ms`
+            } }, h("span", { class: "header__circle", style: { backgroundImage: `url(${AI_AVATAR})` } }), h("h2", { class: "header__title" }, this.welcomeTitle), h("p", { class: "header__greeting" }, this.welcomeGreeting)), this.suggestedPrompts && this.showSuggestedPrompts && (h("ul", { class: "suggested-prompts" }, this.suggestedPrompts.map((prompt, i) => (h("li", { class: "suggested-prompts__item" }, h("button", { class: {
+                "suggested-prompts__button": true
+            }, onClick: __classPrivateFieldGet(this, _GxIdeChatWelcome_sendPromptToChat, "f"), style: {
+                "--delay": `${SUGGESTED_PROMPT_BUTTON_INTERVAL * i}ms`
+            }, "data-prommpt": prompt }, h("ch-image", { src: AI_ICON, class: "icon-md" }), prompt, h("ch-image", { src: ARROW_RIGHT_ICON, class: "icon-md" }))))))))));
+    }
+    static get is() { return "gx-ide-chat-welcome"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chat-welcome.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chat-welcome.css"]
+        };
+    }
+    static get assetsDirs() { return ["gx-ide-assets/chat-welcome"]; }
+    static get properties() {
+        return {
+            "welcomeTitle": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The welcome title, if not provided, the default title will be used."
+                },
+                "attribute": "welcome-title",
+                "reflect": false
+            },
+            "welcomeGreeting": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The welcome greeting description, if not provided, the default title will be used."
+                },
+                "attribute": "welcome-greeting",
+                "reflect": false
+            },
+            "suggestedPrompts": {
+                "type": "unknown",
+                "mutable": true,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The suggested prompts, if not provided, the default title will be used."
+                }
+            },
+            "suggestedPrompRequestedCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(\n    prompt: string\n  ) => Promise<void>",
+                    "resolved": "(prompt: string) => Promise<void>",
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Fired when the user clicks on a suggested prompt button"
+                }
+            }
+        };
+    }
+    static get states() {
+        return {
+            "showHeader": {},
+            "showSuggestedPrompts": {},
+            "hideWelcome": {}
+        };
+    }
+    static get methods() {
+        return {
+            "exitWelcome": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "It will exit the wellcome screen and remove it from the dom.",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+}
+_GxIdeChatWelcome_componentLocale = new WeakMap(), _GxIdeChatWelcome_animationEntrance = new WeakMap(), _GxIdeChatWelcome_sendPromptToChat = new WeakMap(), _GxIdeChatWelcome_animationExit = new WeakMap();
+//# sourceMappingURL=chat-welcome.js.map

package/dist/collection/components/chat/chat-welcome/chat-welcome.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-welcome.js","sourceRoot":"","sources":["../../../../src/components/chat/chat-welcome/chat-welcome.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @stencil-community/strict-mutable */\nimport {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  getAssetPath,\n  Method\n} from \"@stencil/core\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../../common/locale\";\n\nconst HEADER_ILLUSTRATION = getAssetPath(\n  `./gx-ide-assets/chat-welcome/images/header-illustration.svg`\n);\nconst AI_AVATAR = getAssetPath(\n  `./gx-ide-assets/chat-welcome/images/ai-avatar-welcome.svg`\n);\n\nconst HEADER_TRANSITION_DELAY: number = 100;\nconst HEADER_TRANSITION_DURATION: number = 500;\nconst SUGGESTED_PROMPT_BUTTON_INTERVAL: number = 200;\nconst SUGGESTED_PROMPT_BUTTONS_DELAY: number = 500;\nconst WELCOME_EXIT_DURATION: number = 100;\n\nconst AI_ICON = getIconPath({\n  category: \"system\",\n  name: \"assistant\",\n  colorType: \"primary\"\n});\nconst ARROW_RIGHT_ICON = getIconPath({\n  category: \"system\",\n  name: \"arrow-right\",\n  colorType: \"primary\"\n});\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/chat\",\n  \"components/icon\",\n  \"utils/typography\"\n];\n\n@Component({\n  tag: \"gx-ide-chat-welcome\",\n  styleUrl: \"chat-welcome.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/chat-welcome\"]\n})\nexport class GxIdeChatWelcome {\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n\n  @Element() el: HTMLGxIdeChatWelcomeElement;\n\n  /**\n   * When true, it will display the welcome elements (title, greeting, and buttons)\n   */\n  @State() showHeader: boolean = false;\n\n  /**\n   * When true, it will display the suggested prompts buttons\n   */\n  @State() showSuggestedPrompts: boolean = false;\n\n  /**\n   * When true, it will hide entire welcome layout\n   */\n  @State() hideWelcome: boolean = false;\n\n  /**\n   * The welcome title, if not provided, the default title will be used.\n   */\n  @Prop({ mutable: true }) welcomeTitle?: string;\n\n  /**\n   * The welcome greeting description, if not provided, the default title will be used.\n   */\n  @Prop({ mutable: true }) welcomeGreeting?: string;\n\n  /**\n   * The suggested prompts, if not provided, the default title will be used.\n   */\n  @Prop({ mutable: true }) suggestedPrompts?: string[];\n\n  /**\n   * Fired when the user clicks on a suggested prompt button\n   */\n  @Prop() readonly suggestedPrompRequestedCallback: (\n    prompt: string\n  ) => Promise<void>;\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n\n    // Set defaults\n    if (!this.welcomeTitle) {\n      this.welcomeTitle = this.#componentLocale.welcomeTitle;\n    }\n    if (!this.welcomeGreeting) {\n      this.welcomeGreeting = this.#componentLocale.welcomeGreeting;\n    }\n    if (!this.suggestedPrompts) {\n      this.suggestedPrompts = this.#componentLocale.suggestedPrompts;\n    }\n  }\n\n  componentDidRender() {\n    if (!this.hideWelcome) {\n      this.#animationEntrance();\n    }\n  }\n\n  /**\n   * It will exit the wellcome screen and remove it from the dom.\n   */\n  @Method()\n  async exitWelcome() {\n    this.#animationExit();\n  }\n\n  #animationEntrance = () => {\n    setTimeout(() => {\n      this.showHeader = true;\n      setTimeout(() => {\n        this.showSuggestedPrompts = true;\n      }, SUGGESTED_PROMPT_BUTTONS_DELAY);\n    }, HEADER_TRANSITION_DELAY + HEADER_TRANSITION_DURATION);\n  };\n\n  #sendPromptToChat = async (e: MouseEvent) => {\n    const prompt = (e.currentTarget as HTMLButtonElement).dataset[\"prommpt\"];\n    await this.#animationExit();\n    this.suggestedPrompRequestedCallback(prompt);\n  };\n\n  #animationExit = async (): Promise<void> => {\n    this.hideWelcome = true;\n    await new Promise(resolve => setTimeout(resolve, WELCOME_EXIT_DURATION));\n  };\n\n  render() {\n    return (\n      <Host>\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <div\n          class={{ \"welcome-container\": true, \"hidden\": this.hideWelcome }}\n          style={{\n            \"backgroundImage\": `url(${HEADER_ILLUSTRATION})`,\n            \"--transition-duration\": `${WELCOME_EXIT_DURATION}ms`\n          }}\n        >\n          <header\n            class={{ \"header\": true, \"header--visible\": this.showHeader }}\n            style={{\n              \"--transition-delay\": `${HEADER_TRANSITION_DELAY}ms`,\n              \"--transition-duration\": `${HEADER_TRANSITION_DURATION}ms`\n            }}\n          >\n            <span\n              class=\"header__circle\"\n              style={{ backgroundImage: `url(${AI_AVATAR})` }}\n            ></span>\n            <h2 class=\"header__title\">{this.welcomeTitle}</h2>\n            <p class=\"header__greeting\">{this.welcomeGreeting}</p>\n          </header>\n\n          {this.suggestedPrompts && this.showSuggestedPrompts && (\n            <ul class=\"suggested-prompts\">\n              {this.suggestedPrompts.map((prompt, i) => (\n                <li class=\"suggested-prompts__item\">\n                  <button\n                    class={{\n                      \"suggested-prompts__button\": true\n                    }}\n                    onClick={this.#sendPromptToChat}\n                    style={{\n                      \"--delay\": `${SUGGESTED_PROMPT_BUTTON_INTERVAL * i}ms`\n                    }}\n                    data-prommpt={prompt}\n                  >\n                    <ch-image src={AI_ICON} class=\"icon-md\"></ch-image>\n                    {prompt}\n                    <ch-image src={ARROW_RIGHT_ICON} class=\"icon-md\"></ch-image>\n                  </button>\n                </li>\n              ))}\n            </ul>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/helpers.js

@@ -0,0 +1,3 @@
+import { h } from "@stencil/core";
+export const aiIconBorder = (h("svg", { class: "header__circle-border", xmlns: "http://www.w3.org/2000/svg", width: "56", height: "55", viewBox: "0 0 56 55", fill: "none" }, h("path", { d: "M55.5 27.5C55.5 42.6878 43.1878 55 28 55C12.8122 55 0.5 42.6878 0.5 27.5C0.5 12.3122 12.8122 0 28 0C43.1878 0 55.5 12.3122 55.5 27.5ZM2.7 27.5C2.7 41.4728 14.0272 52.8 28 52.8C41.9728 52.8 53.3 41.4728 53.3 27.5C53.3 13.5272 41.9728 2.2 28 2.2C14.0272 2.2 2.7 13.5272 2.7 27.5Z", fill: "url(#paint0_linear_311_13158)", "fill-opacity": "0.9" }), h("defs", null, h("linearGradient", { id: "paint0_linear_311_13158", x1: "73.4348", y1: "9.56522", x2: "28", y2: "55", gradientUnits: "userSpaceOnUse" }, h("stop", { "stop-color": "#00CCFF" }), h("stop", { offset: "1", "stop-color": "#CF7AFF" })))));
+//# sourceMappingURL=helpers.js.map

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../../../../src/components/chat/chat-welcome/gx-ide-assets/chat-welcome/helpers.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElC,MAAM,CAAC,MAAM,YAAY,GAAmB,CAC1C,WACE,KAAK,EAAC,uBAAuB,EAC7B,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM;IAEX,YACE,CAAC,EAAC,uRAAuR,EACzR,IAAI,EAAC,+BAA+B,kBACvB,KAAK,GAClB;IACF;QACE,sBACE,EAAE,EAAC,yBAAyB,EAC5B,EAAE,EAAC,SAAS,EACZ,EAAE,EAAC,SAAS,EACZ,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,aAAa,EAAC,gBAAgB;YAE9B,0BAAiB,SAAS,GAAG;YAC7B,YAAM,MAAM,EAAC,GAAG,gBAAY,SAAS,GAAG,CACzB,CACZ,CACH,CACP,CAAC","sourcesContent":["import { h } from \"@stencil/core\";\n\nexport const aiIconBorder: SVGPathElement = (\n  <svg\n    class=\"header__circle-border\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"56\"\n    height=\"55\"\n    viewBox=\"0 0 56 55\"\n    fill=\"none\"\n  >\n    <path\n      d=\"M55.5 27.5C55.5 42.6878 43.1878 55 28 55C12.8122 55 0.5 42.6878 0.5 27.5C0.5 12.3122 12.8122 0 28 0C43.1878 0 55.5 12.3122 55.5 27.5ZM2.7 27.5C2.7 41.4728 14.0272 52.8 28 52.8C41.9728 52.8 53.3 41.4728 53.3 27.5C53.3 13.5272 41.9728 2.2 28 2.2C14.0272 2.2 2.7 13.5272 2.7 27.5Z\"\n      fill=\"url(#paint0_linear_311_13158)\"\n      fill-opacity=\"0.9\"\n    />\n    <defs>\n      <linearGradient\n        id=\"paint0_linear_311_13158\"\n        x1=\"73.4348\"\n        y1=\"9.56522\"\n        x2=\"28\"\n        y2=\"55\"\n        gradientUnits=\"userSpaceOnUse\"\n      >\n        <stop stop-color=\"#00CCFF\" />\n        <stop offset=\"1\" stop-color=\"#CF7AFF\" />\n      </linearGradient>\n    </defs>\n  </svg>\n);\n"]}

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/helpers.tsx

@@ -0,0 +1,31 @@
+import { h } from "@stencil/core";
+
+export const aiIconBorder: SVGPathElement = (
+  <svg
+    class="header__circle-border"
+    xmlns="http://www.w3.org/2000/svg"
+    width="56"
+    height="55"
+    viewBox="0 0 56 55"
+    fill="none"
+  >
+    <path
+      d="M55.5 27.5C55.5 42.6878 43.1878 55 28 55C12.8122 55 0.5 42.6878 0.5 27.5C0.5 12.3122 12.8122 0 28 0C43.1878 0 55.5 12.3122 55.5 27.5ZM2.7 27.5C2.7 41.4728 14.0272 52.8 28 52.8C41.9728 52.8 53.3 41.4728 53.3 27.5C53.3 13.5272 41.9728 2.2 28 2.2C14.0272 2.2 2.7 13.5272 2.7 27.5Z"
+      fill="url(#paint0_linear_311_13158)"
+      fill-opacity="0.9"
+    />
+    <defs>
+      <linearGradient
+        id="paint0_linear_311_13158"
+        x1="73.4348"
+        y1="9.56522"
+        x2="28"
+        y2="55"
+        gradientUnits="userSpaceOnUse"
+      >
+        <stop stop-color="#00CCFF" />
+        <stop offset="1" stop-color="#CF7AFF" />
+      </linearGradient>
+    </defs>
+  </svg>
+);

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/images/ai-avatar-welcome.svg

@@ -0,0 +1,21 @@
+<svg width="56" height="55" viewBox="0 0 56 55" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_311_13151)">
+<g clip-path="url(#clip1_311_13151)">
+<rect x="7.375" y="6.87501" width="41.25" height="41.25" rx="20.625" fill="#5CA7FF" fill-opacity="0.9"/>
+<path d="M25.6362 22.2718C26.1168 20.8652 28.0603 20.8226 28.6302 22.144L28.6784 22.2726L29.327 24.1694C29.4757 24.6044 29.7159 25.0025 30.0314 25.3368C30.347 25.6711 30.7306 25.9338 31.1564 26.1073L31.3308 26.1724L33.2276 26.8202C34.6342 27.3008 34.6768 29.2443 33.3562 29.8142L33.2276 29.8624L31.3308 30.511C30.8956 30.6596 30.4974 30.8997 30.1629 31.2153C29.8285 31.5309 29.5656 31.9145 29.3921 32.3403L29.327 32.514L28.6792 34.4116C28.1986 35.8182 26.2551 35.8608 25.686 34.5402L25.6362 34.4116L24.9884 32.5148C24.8398 32.0796 24.5997 31.6814 24.2841 31.3469C23.9685 31.0125 23.5849 30.7496 23.159 30.5761L22.9854 30.511L21.0886 29.8632C19.6812 29.3825 19.6386 27.4391 20.96 26.87L21.0886 26.8202L22.9854 26.1724C23.4204 26.0237 23.8185 25.7835 24.1528 25.4679C24.4871 25.1524 24.7498 24.7688 24.9233 24.343L24.9884 24.1694L25.6362 22.2718ZM33.5877 19.5004C33.7381 19.5004 33.8854 19.5426 34.013 19.6222C34.1406 19.7018 34.2433 19.8155 34.3095 19.9505L34.348 20.0446L34.6294 20.8692L35.4548 21.1505C35.6055 21.2017 35.7376 21.2965 35.8344 21.4229C35.9311 21.5492 35.9882 21.7014 35.9984 21.8603C36.0085 22.0191 35.9713 22.1774 35.8914 22.315C35.8115 22.4527 35.6926 22.5635 35.5496 22.6335L35.4548 22.672L34.6302 22.9534L34.3488 23.7788C34.2976 23.9294 34.2027 24.0615 34.0763 24.1582C33.9499 24.2549 33.7977 24.3118 33.6388 24.3219C33.48 24.332 33.3218 24.2947 33.1842 24.2147C33.0466 24.1348 32.9358 24.0158 32.8659 23.8728L32.8273 23.7788L32.546 22.9542L31.7206 22.6728C31.5699 22.6216 31.4378 22.5269 31.341 22.4005C31.2443 22.2742 31.1872 22.1219 31.177 21.9631C31.1669 21.8043 31.2041 21.646 31.284 21.5084C31.3639 21.3707 31.4828 21.2599 31.6257 21.1899L31.7206 21.1513L32.5452 20.87L32.8265 20.0446C32.8807 19.8858 32.9833 19.7479 33.1198 19.6503C33.2563 19.5528 33.4199 19.5003 33.5877 19.5004Z" fill="#1C6AC7"/>
+</g>
+<path d="M55.5 27.5C55.5 42.6878 43.1878 55 28 55C12.8122 55 0.5 42.6878 0.5 27.5C0.5 12.3122 12.8122 0 28 0C43.1878 0 55.5 12.3122 55.5 27.5ZM2.7 27.5C2.7 41.4728 14.0272 52.8 28 52.8C41.9728 52.8 53.3 41.4728 53.3 27.5C53.3 13.5272 41.9728 2.2 28 2.2C14.0272 2.2 2.7 13.5272 2.7 27.5Z" fill="url(#paint0_linear_311_13151)" fill-opacity="0.9"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_311_13151" x1="73.4348" y1="9.56522" x2="28" y2="55" gradientUnits="userSpaceOnUse">
+<stop stop-color="#00CCFF"/>
+<stop offset="1" stop-color="#CF7AFF"/>
+</linearGradient>
+<clipPath id="clip0_311_13151">
+<rect width="55" height="55" fill="white" transform="translate(0.5)"/>
+</clipPath>
+<clipPath id="clip1_311_13151">
+<rect x="7.375" y="6.87501" width="41.25" height="41.25" rx="20.625" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/images/ai-avatar.svg

@@ -0,0 +1,11 @@
+<svg width="26" height="27" viewBox="0 0 26 27" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="1" width="25" height="25" rx="12.5" stroke="url(#paint0_linear_738_366)" stroke-opacity="0.9"/>
+<circle cx="12.9999" cy="13.4999" r="10.1122" fill="#5BA7FF"/>
+<path d="M11.3364 9.82021C11.6747 8.83021 13.0426 8.80023 13.4437 9.73026L13.4776 9.82077L13.9341 11.1559C14.0388 11.462 14.2078 11.7422 14.4299 11.9775C14.652 12.2128 14.922 12.3977 15.2217 12.5198L15.3444 12.5656L16.6795 13.0216C17.6695 13.3599 17.6995 14.7278 16.77 15.1289L16.6795 15.1628L15.3444 15.6193C15.0382 15.7239 14.7579 15.8929 14.5225 16.115C14.2871 16.3372 14.1021 16.6072 13.98 16.9069L13.9341 17.0291L13.4782 18.3647C13.1399 19.3547 11.772 19.3847 11.3714 18.4552L11.3364 18.3647L10.8804 17.0296C10.7759 16.7234 10.6068 16.4431 10.3847 16.2077C10.1626 15.9723 9.89256 15.7873 9.59285 15.6651L9.47066 15.6193L8.13557 15.1634C7.14501 14.8251 7.11503 13.4572 8.04506 13.0566L8.13557 13.0216L9.47066 12.5656C9.77684 12.461 10.057 12.2919 10.2923 12.0698C10.5276 11.8477 10.7125 11.5777 10.8346 11.278L10.8804 11.1559L11.3364 9.82021ZM16.933 7.86963C17.0388 7.86963 17.1425 7.89932 17.2323 7.95532C17.3221 8.01132 17.3944 8.09139 17.441 8.18643L17.4681 8.25262L17.6661 8.83304L18.2471 9.03104C18.3532 9.06707 18.4462 9.13378 18.5143 9.22271C18.5824 9.31164 18.6226 9.41879 18.6297 9.53057C18.6368 9.64236 18.6107 9.75375 18.5544 9.85063C18.4982 9.94752 18.4145 10.0255 18.3139 10.0748L18.2471 10.1019L17.6667 10.2999L17.4687 10.8809C17.4326 10.9869 17.3658 11.0799 17.2769 11.1479C17.1879 11.216 17.0808 11.2561 16.969 11.2632C16.8572 11.2703 16.7458 11.244 16.649 11.1877C16.5521 11.1315 16.4742 11.0477 16.425 10.9471L16.3978 10.8809L16.1998 10.3005L15.6188 10.1025C15.5128 10.0665 15.4198 9.99975 15.3517 9.91082C15.2836 9.82189 15.2434 9.71475 15.2362 9.60296C15.2291 9.49117 15.2553 9.37978 15.3115 9.2829C15.3677 9.18602 15.4515 9.10801 15.5521 9.05876L15.6188 9.0316L16.1992 8.8336L16.3972 8.25262C16.4354 8.14085 16.5076 8.04382 16.6036 7.97513C16.6997 7.90645 16.8149 7.86956 16.933 7.86963Z" fill="#1C6AC7"/>
+<defs>
+<linearGradient id="paint0_linear_738_366" x1="34.4783" y1="5.02174" x2="13" y2="26.5" gradientUnits="userSpaceOnUse">
+<stop stop-color="#00CCFF"/>
+<stop offset="1" stop-color="#CF7AFF"/>
+</linearGradient>
+</defs>
+</svg>

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/images/header-illustration.svg

@@ -0,0 +1,24 @@
+<svg width="446" height="234" viewBox="0 0 446 234" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_311_13145)">
+<ellipse cx="397.016" cy="83.8918" rx="60.3657" ry="58.9125" fill="url(#paint0_linear_311_13145)" fill-opacity="0.6"/>
+<ellipse cx="102.28" cy="103.703" rx="102.28" ry="103.703" transform="matrix(0.474261 0.880384 -0.889726 0.456494 155.142 -140.581)" fill="url(#paint1_linear_311_13145)" fill-opacity="0.5"/>
+<path d="M388.876 20.3603C390.349 21.6813 391.006 23.6881 390.598 25.6246L381.772 67.5732C381.364 69.5095 379.955 71.0814 378.074 71.6968L337.33 85.0292C335.449 85.6445 333.383 85.2099 331.91 83.889L299.993 55.2725C298.519 53.9515 297.863 51.9448 298.27 50.0083L307.097 8.05961C307.504 6.12331 308.914 4.55144 310.794 3.93607L351.539 -9.39632C353.419 -10.0117 355.485 -9.57706 356.959 -8.25616L388.876 20.3603Z" fill="url(#paint2_linear_311_13145)" fill-opacity="0.6"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_311_13145" x1="379.841" y1="142.804" x2="437.267" y2="-41.2632" gradientUnits="userSpaceOnUse">
+<stop stop-color="#226B98" stop-opacity="0"/>
+<stop offset="0.886406" stop-color="#7945AA"/>
+</linearGradient>
+<linearGradient id="paint1_linear_311_13145" x1="73.1795" y1="207.405" x2="177.465" y2="-114.341" gradientUnits="userSpaceOnUse">
+<stop stop-color="#226B98" stop-opacity="0"/>
+<stop offset="0.886406" stop-color="#5BA7FF" stop-opacity="0.5"/>
+</linearGradient>
+<linearGradient id="paint2_linear_311_13145" x1="293.253" y1="39.8168" x2="454.135" y2="38.7216" gradientUnits="userSpaceOnUse">
+<stop stop-color="#226B98" stop-opacity="0"/>
+<stop offset="0.886406" stop-color="#7945AA"/>
+</linearGradient>
+<clipPath id="clip0_311_13145">
+<rect width="514" height="234" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/langs/chat-welcome.lang.en.json

@@ -0,0 +1,10 @@
+{
+  "componentName": "Chat Container",
+  "welcomeTitle": "Hello!\nI'm Nexa",
+  "welcomeGreeting": "Hey there! I’m your Next Assistant, you can use me for transactions, etc. I'm here to help you organize your knowledge. Ask me anything about your documents.",
+  "suggestedPrompts": [
+    "How do I make a transaction?",
+    "How do I generate a new entity?"
+  ],
+  "inputPlaceholder": "I need..."
+}

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/langs/chat-welcome.lang.ja.json

@@ -0,0 +1,10 @@
+{
+  "componentName": "Chat Container",
+  "welcomeTitle": "Hello!\nI'm Nexa",
+  "welcomeGreeting": "Hey there! I’m your Next Assistant, you can use me for transactions, etc. I'm here to help you organize your knowledge. Ask me anything about your documents.",
+  "suggestedPrompts": [
+    "How do I make a transaction?",
+    "How do I generate a new entity?"
+  ],
+  "inputPlaceholder": "I need..."
+}

package/dist/collection/components/chat/chat-welcome/gx-ide-assets/chat-welcome/langs/chat-welcome.lang.zh.json

@@ -0,0 +1,10 @@
+{
+  "componentName": "Chat Container",
+  "welcomeTitle": "Hello!\nI'm Nexa",
+  "welcomeGreeting": "Hey there! I’m your Next Assistant, you can use me for transactions, etc. I'm here to help you organize your knowledge. Ask me anything about your documents.",
+  "suggestedPrompts": [
+    "How do I make a transaction?",
+    "How do I generate a new entity?"
+  ],
+  "inputPlaceholder": "I need..."
+}

package/dist/collection/components/chat/code-render.js

@@ -0,0 +1,65 @@
+import { h } from "@stencil/core";
+import { ANIMATION_DOTS } from "../../common/common";
+const animationDots = ANIMATION_DOTS("regular", "nexa");
+const CODE_RENDER_COPY_PART = "code-block-header__copy";
+const CODE_RENDER_COPIED_PART = `${CODE_RENDER_COPY_PART}-copied`;
+const CODE_BLOCK_HEADER_PART = "code-block-header";
+const copy = (text, isForCodeRender = false) => (event) => {
+    const setTimeoutTime = 1750;
+    event.stopPropagation();
+    // 1. Copy message
+    navigator.clipboard.writeText(text);
+    const copyButtonRef = event.target;
+    if (isForCodeRender) {
+        const copyTextElement = copyButtonRef.previousElementSibling;
+        const copyTextElementOriginalParts = copyTextElement?.getAttribute("part");
+        const copyTextElementWithCopiedPart = `${copyTextElementOriginalParts} ${CODE_RENDER_COPIED_PART}`;
+        copyTextElement.setAttribute("part", copyTextElementWithCopiedPart);
+        setTimeout(() => {
+            copyTextElement.setAttribute("part", `${copyTextElementOriginalParts}`);
+        }, setTimeoutTime);
+    }
+    else {
+        const cmSmartGridCellRef = copyButtonRef.closest("ch-smart-grid-cell");
+        const cmSmartGridCellRefOriginalParts = cmSmartGridCellRef?.getAttribute("part");
+        const cmSmartGridCellRefWithCopiedPart = `${cmSmartGridCellRefOriginalParts} copied`;
+        cmSmartGridCellRef.setAttribute("part", cmSmartGridCellRefWithCopiedPart);
+        setTimeout(() => {
+            cmSmartGridCellRef.setAttribute("part", `${cmSmartGridCellRefOriginalParts}`);
+        }, setTimeoutTime);
+    }
+};
+const copyButton = (textToCopy, accessibleName, additionalPart, isForCodeRender = false) => {
+    return (h("button", { "aria-label": accessibleName, title: accessibleName, class: "button-copy-code", type: "button", onClick: copy(textToCopy, isForCodeRender), part: `message__copy-button ${additionalPart}` }));
+};
+export const mercuryCodeRender = (copyButtonAccessibleName) => (options) => (h("div", { class: "code-block-container" }, h("div", { class: CODE_BLOCK_HEADER_PART, part: CODE_BLOCK_HEADER_PART }, h("p", { part: "code-block-header__copy" }, "Copied"), copyButton(options.plainText, copyButtonAccessibleName, "code-render", true)), h("ch-code", { language: options.language, lastNestedChildClass: options.lastNestedChildClass, value: options.plainText })));
+const renderMessageHeader = (avatarImagePath, displayName, messageContent, metadata) => {
+    return (h("div", { part: "message__header" }, h("div", { part: "message__header-start" }, h("span", { part: "message__avatar", style: { backgroundImage: `url(${avatarImagePath})` } }), h("span", { part: `message__role assistant` }, displayName), h("time", { dateTime: metadata, part: "message__time" }, metadata)), h("div", { part: "message__header-end" }, h("p", { part: "message__header-copy" }, "Copied"), copyButton(messageContent, "Copy code", "common-message"))));
+};
+export const mercuryChatMessageRender = (theme, assistantAvatarPath, assistantName = "AI Assistant") => (messageModel) => {
+    const messageHeader = renderMessageHeader(assistantAvatarPath, assistantName, messageModel.content, messageModel.metadata);
+    if (messageModel.role === "assistant") {
+        return messageModel.status === "waiting"
+            ? [
+                messageHeader,
+                h("div", { part: "message__processing-container" }, h("span", { part: "message__processing" }, messageModel.content), animationDots)
+            ]
+            : [
+                messageHeader,
+                h("div", { part: `message__content assistant ${messageModel.parts}` }, h("ch-markdown-viewer", { theme: theme, showIndicator: false, renderCode: mercuryCodeRender("Copy response"), value: messageModel.content, exportparts: `${CODE_BLOCK_HEADER_PART},${CODE_RENDER_COPY_PART},${CODE_RENDER_COPIED_PART}` }))
+            ];
+    }
+    else if (messageModel.role === "user") {
+        return [
+            h("span", { part: `message__content ${messageModel.role}` }, messageModel.content)
+        ];
+    }
+    else {
+        // error (this is nor from assistant but design dictates to show header)
+        return [
+            messageHeader,
+            h("span", { part: `message__content ${messageModel.role}` }, messageModel.content)
+        ];
+    }
+};
+//# sourceMappingURL=code-render.js.map

package/dist/collection/components/chat/code-render.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-render.js","sourceRoot":"","sources":["../../../src/components/chat/code-render.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, JSX } from \"@stencil/core\";\nimport {\n  MarkdownViewerCodeRender,\n  ChatMessageByRole\n} from \"@genexus/chameleon-controls-library\";\nimport { MarkdownViewerCodeRenderOptions } from \"@genexus/chameleon-controls-library/dist/types/components/markdown-viewer/parsers/types\";\n\nimport { ANIMATION_DOTS } from \"../../common/common\";\nconst animationDots = ANIMATION_DOTS(\"regular\", \"nexa\");\nconst CODE_RENDER_COPY_PART = \"code-block-header__copy\";\nconst CODE_RENDER_COPIED_PART = `${CODE_RENDER_COPY_PART}-copied`;\nconst CODE_BLOCK_HEADER_PART = \"code-block-header\";\n\nconst copy =\n  (text: string, isForCodeRender: boolean = false) =>\n  (event: Event) => {\n    const setTimeoutTime = 1750;\n    event.stopPropagation();\n\n    // 1. Copy message\n    navigator.clipboard.writeText(text);\n\n    const copyButtonRef = event.target as HTMLElement;\n\n    if (isForCodeRender) {\n      const copyTextElement = copyButtonRef.previousElementSibling;\n\n      const copyTextElementOriginalParts =\n        copyTextElement?.getAttribute(\"part\");\n      const copyTextElementWithCopiedPart = `${copyTextElementOriginalParts} ${CODE_RENDER_COPIED_PART}`;\n      copyTextElement.setAttribute(\"part\", copyTextElementWithCopiedPart);\n\n      setTimeout(() => {\n        copyTextElement.setAttribute(\"part\", `${copyTextElementOriginalParts}`);\n      }, setTimeoutTime);\n    } else {\n      const cmSmartGridCellRef = copyButtonRef.closest(\"ch-smart-grid-cell\");\n\n      const cmSmartGridCellRefOriginalParts =\n        cmSmartGridCellRef?.getAttribute(\"part\");\n      const cmSmartGridCellRefWithCopiedPart = `${cmSmartGridCellRefOriginalParts} copied`;\n      cmSmartGridCellRef.setAttribute(\"part\", cmSmartGridCellRefWithCopiedPart);\n\n      setTimeout(() => {\n        cmSmartGridCellRef.setAttribute(\n          \"part\",\n          `${cmSmartGridCellRefOriginalParts}`\n        );\n      }, setTimeoutTime);\n    }\n  };\n\nconst copyButton = (\n  textToCopy: string,\n  accessibleName: string,\n  additionalPart: string,\n  isForCodeRender: boolean = false\n) => {\n  return (\n    <button\n      aria-label={accessibleName}\n      title={accessibleName}\n      class=\"button-copy-code\"\n      type=\"button\"\n      onClick={copy(textToCopy, isForCodeRender)}\n      part={`message__copy-button ${additionalPart}`}\n    ></button>\n  );\n};\n\nexport const mercuryCodeRender =\n  (copyButtonAccessibleName: string) =>\n  (options: MarkdownViewerCodeRenderOptions): MarkdownViewerCodeRender =>\n    (\n      <div class=\"code-block-container\">\n        <div class={CODE_BLOCK_HEADER_PART} part={CODE_BLOCK_HEADER_PART}>\n          <p part=\"code-block-header__copy\">Copied</p>\n          {copyButton(\n            options.plainText,\n            copyButtonAccessibleName,\n            \"code-render\",\n            true\n          )}\n        </div>\n        <ch-code\n          language={options.language}\n          lastNestedChildClass={options.lastNestedChildClass}\n          value={options.plainText}\n        ></ch-code>\n      </div>\n    );\n\nconst renderMessageHeader = (\n  avatarImagePath: string,\n  displayName: string,\n  messageContent: string,\n  metadata: string\n): JSX.Element => {\n  return (\n    <div part=\"message__header\">\n      <div part=\"message__header-start\">\n        <span\n          part=\"message__avatar\"\n          style={{ backgroundImage: `url(${avatarImagePath})` }}\n        ></span>\n        <span part={`message__role assistant`}>{displayName}</span>\n        <time dateTime={metadata} part=\"message__time\">\n          {metadata}\n        </time>\n      </div>\n      <div part=\"message__header-end\">\n        <p part=\"message__header-copy\">Copied</p>\n        {copyButton(messageContent, \"Copy code\", \"common-message\")}\n      </div>\n    </div>\n  );\n};\n\nexport const mercuryChatMessageRender =\n  (\n    theme: string,\n    assistantAvatarPath: string,\n    assistantName: string = \"AI Assistant\"\n  ) =>\n  (messageModel: ChatMessageByRole<\"assistant\" | \"error\" | \"user\">) => {\n    const messageHeader = renderMessageHeader(\n      assistantAvatarPath,\n      assistantName,\n      messageModel.content as string,\n      messageModel.metadata\n    );\n    if (messageModel.role === \"assistant\") {\n      return messageModel.status === \"waiting\"\n        ? [\n            messageHeader,\n            <div part=\"message__processing-container\">\n              <span part=\"message__processing\">{messageModel.content}</span>\n              {animationDots}\n            </div>\n          ]\n        : [\n            messageHeader,\n            <div part={`message__content assistant ${messageModel.parts}`}>\n              <ch-markdown-viewer\n                theme={theme}\n                showIndicator={false}\n                renderCode={mercuryCodeRender(\"Copy response\")}\n                value={messageModel.content as string}\n                exportparts={`${CODE_BLOCK_HEADER_PART},${CODE_RENDER_COPY_PART},${CODE_RENDER_COPIED_PART}`}\n              ></ch-markdown-viewer>\n            </div>\n          ];\n    } else if (messageModel.role === \"user\") {\n      return [\n        <span part={`message__content ${messageModel.role}`}>\n          {messageModel.content}\n        </span>\n      ];\n    } else {\n      // error (this is nor from assistant but design dictates to show header)\n      return [\n        messageHeader,\n        <span part={`message__content ${messageModel.role}`}>\n          {messageModel.content}\n        </span>\n      ];\n    }\n  };\n"]}

package/dist/collection/components/current-user-info/current-user-info.js

@@ -107,9 +107,8 @@ export class GxIdeNewEnvironment {
         ], "f");
     }
     render() {
-        var _a, _b;
-        const userName = limitFullName((_a = this.userInfo) === null || _a === void 0 ? void 0 : _a.name);
-        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("ch-action-menu-render", { class: "dropdown user-login__button", model: __classPrivateFieldGet(this, _GxIdeNewEnvironment_menuDropdownModel, "f"), inlineAlign: "inside-end", blockAlign: "outside-end", onButtonClick: __classPrivateFieldGet(this, _GxIdeNewEnvironment_dropDownitemClickHandler, "f") }, h("div", { class: "user-login__details" }, userName ? h("span", { class: "user-login__name" }, userName) : null, ((_b = this.userInfo) === null || _b === void 0 ? void 0 : _b.team) ? (h("span", { class: "user-login__organization" }, this.userInfo.team)) : null), h("div", { class: "user-login__avatar" }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_initials, "f")), h("ch-image", { src: CHEVRON_DOWN_ICON, class: "icon-md", containerRef: __classPrivateFieldGet(this, _GxIdeNewEnvironment_userLoginButton, "f") }), h("div", { class: "user-login__footer footer-slot", slot: "agreement" }, h("button", { class: "body-regular-s agreement-link", onClick: this.termsCallback }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_componentLocale, "f").termsAndConditionsCaption), h("button", { class: "body-regular-s\tagreement-link", onClick: this.privacyCallback }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_componentLocale, "f").privacyPolicyCaption)))));
+        const userName = limitFullName(this.userInfo?.name);
+        return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("ch-action-menu-render", { class: "dropdown user-login__button", model: __classPrivateFieldGet(this, _GxIdeNewEnvironment_menuDropdownModel, "f"), inlineAlign: "inside-end", blockAlign: "outside-end", onButtonClick: __classPrivateFieldGet(this, _GxIdeNewEnvironment_dropDownitemClickHandler, "f") }, h("div", { class: "user-login__details" }, userName ? h("span", { class: "user-login__name" }, userName) : null, this.userInfo?.team ? (h("span", { class: "user-login__organization" }, this.userInfo.team)) : null), h("div", { class: "user-login__avatar" }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_initials, "f")), h("ch-image", { src: CHEVRON_DOWN_ICON, class: "icon-md", containerRef: __classPrivateFieldGet(this, _GxIdeNewEnvironment_userLoginButton, "f") }), h("div", { class: "user-login__footer footer-slot", slot: "agreement" }, h("button", { class: "body-regular-s agreement-link", onClick: this.termsCallback }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_componentLocale, "f").termsAndConditionsCaption), h("button", { class: "body-regular-s\tagreement-link", onClick: this.privacyCallback }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_componentLocale, "f").privacyPolicyCaption)))));
     }
     static get is() { return "gx-ide-current-user-info"; }
     static get encapsulation() { return "shadow"; }