npm - @genexus/genexus-ide-ui - Versions diffs - 1.0.49 → 1.0.51 - Mend

@genexus/genexus-ide-ui 1.0.49 → 1.0.51

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (96) hide show

package/dist/genexus-ide-ui/{p-72867329.entry.js → p-dd6bbdd5.entry.js} RENAMED Viewed

@@ -1,76 +1,16 @@
-import { h as e, r as t, H as n } from "./p-49712340.js";
+import { r as e, h as t, H as n } from "./p-49712340.js";
-import "./p-ad5caf61.js";
-const a = "message__copied-feedback";
-const o = "message__copied-feedback-visible";
-const copy = e => t => {
-  t.stopPropagation();
-  // 1. Copy message
-    navigator.clipboard.writeText(e);
-  // 2. Display "copied" message (expects to be the next sibling!)
-    const n = t.target.nextSibling;
-  const s = n.getAttribute("part");
-  if (s === a) {
-    n.setAttribute("part", `${a} ${o}`);
-    setTimeout((() => {
-      n.setAttribute("part", `${a}`);
-    }), 1e3);
-  }
-};
-const copyButton = (t, n, a) => e("button", {
-  "aria-label": n,
-  title: n,
-  class: "button-copy-code",
-  type: "button",
-  onClick: copy(t),
-  part: `message__copy-button ${a}`
-});
+import { m as a } from "./p-732941de.js";
-const mercuryCodeRender = t => n => e("div", {
-  class: "code-block-container"
-}, e("div", {
-  class: "code-block-header"
-}, copyButton(n.plainText, t, "code-render")), e("ch-code", {
-  language: n.language,
-  lastNestedChildClass: n.lastNestedChildClass,
-  value: n.plainText
-}));
-const mercuryChatMessageRender = t => n => n.role === "assistant" && n.status === "waiting" ? [ e("span", {
-  part: "message__processing"
-}, "Processing request"), e("div", {
-  class: "processing-animation",
-  part: "processing-animation"
-}) ] : [
-// "copy button" before "role" and "time" to hide both on button:focus
-copyButton(n.content, "Copy code", "common-message"), e("p", {
-  part: a
-}, "message copied to clipboard"), e("span", {
-  part: `message__role ${n.role}`
-}, n.role === "user" ? "You" : "GeneXus Code Fixer"), e("time", {
-  dateTime: n.metadata,
-  part: "message__time"
-}, n.metadata), n.role === "user" ? e("span", {
-  part: "message__content user"
-}, n.content) : e("ch-markdown-viewer", {
-  part: n.role === "assistant" && (n.status === "complete" || !n.status) && !n.parts ? `message__content no-error` : "message__content",
-  theme: t,
-  showIndicator: false,
-  renderCode: mercuryCodeRender("Copy code"),
-  value: n.content
-}) ];
+import "./p-ad5caf61.js";
-const s = "{{ASSISTANT_NAME}}";
+const o = "{{ASSISTANT_NAME}}";
-let r;
+let s;
-const i = `\n    ### Code block {#code-block}\n    To create code blocks, you’ll use three backticks (\` \`\`\` \`) or three tildes (\`~~~\`) on the lines before and after the code block.\n    \n    \`\`\`\n    {\n      "firstName": "John",\n      "lastName": "Smith",\n      "age": 25\n    }\n    \`\`\`\n    \n    Another way to create code blocks is to indent every line of the block by at least four spaces or one tab.\n    \n        <html>\n          <head>\n          </head>\n        </html>\n    \n    \n    #### Syntax Highlighting {#syntax-highlighting}\n    This feature allows you to add color highlighting for whatever language your code was written in.\n    To add syntax highlighting, specify a language next to the backticks before the fenced code block.\n    \n    \`\`\`json\n    {\n      "firstName": "John",\n      "lastName": "Smith",\n      "age": 25\n    }\n    \`\`\`\n    \n    \`\`\`javascript\n    import React from 'react'\n    import ReactDOM from 'react-dom'\n    import Markdown from 'react-markdown'\n    import rehypeHighlight from 'rehype-highlight'\n    \n    const markdown = \`\n    # Your markdown here\n    \`\n    \n    ReactDOM.render(\n      <Markdown rehypePlugins={[rehypeHighlight]}>{markdown}</Markdown>,\n      document.querySelector('#content')\n    )\n    \`\`\`\n    \n    ### Horizontal Rules {#horizontal-rules}\n    To create a horizontal rule, use three or more asterisks (\`***\`), dashes (\`---\`), or underscores (\`___\`) on a line by themselves.\n    `;
+const r = `\n    ### Code block {#code-block}\n    To create code blocks, you’ll use three backticks (\` \`\`\` \`) or three tildes (\`~~~\`) on the lines before and after the code block.\n    \n    \`\`\`\n    {\n      "firstName": "John",\n      "lastName": "Smith",\n      "age": 25\n    }\n    \`\`\`\n    \n    Another way to create code blocks is to indent every line of the block by at least four spaces or one tab.\n    \n        <html>\n          <head>\n          </head>\n        </html>\n    \n    \n    #### Syntax Highlighting {#syntax-highlighting}\n    This feature allows you to add color highlighting for whatever language your code was written in.\n    To add syntax highlighting, specify a language next to the backticks before the fenced code block.\n    \n    \`\`\`json\n    {\n      "firstName": "John",\n      "lastName": "Smith",\n      "age": 25\n    }\n    \`\`\`\n    \n    \`\`\`javascript\n    import React from 'react'\n    import ReactDOM from 'react-dom'\n    import Markdown from 'react-markdown'\n    import rehypeHighlight from 'rehype-highlight'\n    \n    const markdown = \`\n    # Your markdown here\n    \`\n    \n    ReactDOM.render(\n      <Markdown rehypePlugins={[rehypeHighlight]}>{markdown}</Markdown>,\n      document.querySelector('#content')\n    )\n    \`\`\`\n    \n    ### Horizontal Rules {#horizontal-rules}\n    To create a horizontal rule, use three or more asterisks (\`***\`), dashes (\`---\`), or underscores (\`___\`) on a line by themselves.\n    `;
-const c = `\n    ### Code block {#code-block}\n    To create code blocks, you’ll use three backticks (\` \`\`\` \`) or three tildes (\`~~~\`) on the lines before and after the code block.\n    \n    \`\`\`json\n    {\n      "firstName": "John",\n      "lastName": "Smith",\n      "age": 25\n    }\n    \`\`\`\n    `;
+const i = `\n    ### Code block {#code-block}\n    To create code blocks, you’ll use three backticks (\` \`\`\` \`) or three tildes (\`~~~\`) on the lines before and after the code block.\n    \n    \`\`\`json\n    {\n      "firstName": "John",\n      "lastName": "Smith",\n      "age": 25\n    }\n    \`\`\`\n    `;
 const sendChatToLLM = () => {
   // This is a WA to get the chat reference
@@ -81,20 +21,20 @@ const sendChatToLLM = () => {
     content: "Analyzing",
     status: "waiting"
   });
-  r = setTimeout((() => {
+  s = setTimeout((() => {
     e.updateLastMessage({
       role: "assistant",
       content: "Processing with Chat with LLMs",
       status: "waiting"
     }, "replace");
-    r = setTimeout((() => {
-      dummyStreaming(e, 20, i, "replace");
+    s = setTimeout((() => {
+      dummyStreaming(e, 20, r, "replace");
     }), 200);
   }), 200);
 };
 function dummyStreaming(e, t, n, a) {
-  r = setTimeout((() => {
+  s = setTimeout((() => {
     const o = t >= n.length;
     e.updateLastMessage({
       role: "assistant",
@@ -116,12 +56,12 @@ function dummyStreaming(e, t, n, a) {
   }), t % 200 === 0 ? 50 : 40);
 }
-const d = {
+const c = {
   clear: () => new Promise((e => e())),
   sendChatToLLM,
   uploadImage: () => new Promise((e => e(""))),
   stopGeneratingAnswer: () => {
-    clearTimeout(r);
+    clearTimeout(s);
     // This is a WA to get the chat reference
         const e = document.querySelector("ch-chat");
     e.updateLastMessage({
@@ -133,7 +73,7 @@ const d = {
   }
 };
-const l = {
+const d = {
   accessibleName: {
     clearChat: "Clear chat",
     copyResponseButton: "Copy assistant response",
@@ -149,7 +89,7 @@ const l = {
   },
   text: {
     copyCodeButton: "Copy code",
-    processing: `Processing with ${s}`,
+    processing: `Processing with ${o}`,
     sourceFiles: "Source files:"
   }
 };
@@ -163,10 +103,10 @@ Array.from({
 } : {
   id: `index: ${t}`,
   role: "assistant",
-  content: c + `\nindex: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n`
+  content: i + `\nindex: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n` + `index: ${t}\n`
 }));
-const m = [ {
+const l = [ {
   id: "1",
   role: "user",
   content: "Please give me an example about...",
@@ -216,65 +156,75 @@ const m = [ {
   id: "9",
   role: "assistant",
   status: "complete",
-  content: c
+  content: i
 } ];
-const u = ":host{block-size:100%;display:grid}";
+const h = ":host{block-size:100%;display:grid}";
-var h = undefined && undefined.__classPrivateFieldGet || function(e, t, n, a) {
+var m = undefined && undefined.__classPrivateFieldGet || function(e, t, n, a) {
   if (n === "a" && !a) throw new TypeError("Private accessor was defined without a getter");
   if (typeof t === "function" ? e !== t || !a : !t.has(e)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
   return n === "m" ? a : n === "a" ? a.call(e) : a ? a.value : t.get(e);
 };
-var p = undefined && undefined.__classPrivateFieldSet || function(e, t, n, a, o) {
+var u = undefined && undefined.__classPrivateFieldSet || function(e, t, n, a, o) {
   if (a === "m") throw new TypeError("Private method is not writable");
   if (a === "a" && !o) throw new TypeError("Private accessor was defined without a setter");
   if (typeof t === "function" ? e !== t || !o : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
   return a === "a" ? o.call(e, n) : o ? o.value = n : t.set(e, n), n;
 };
-var g, f;
+var p, g, f;
 const w = [ "resets/box-sizing", "components/chat" ];
 const y = class {
-  constructor(e) {
-    t(this, e);
-    g.set(this, void 0);
+  constructor(t) {
+    e(this, t);
+    p.set(this, void 0);
+    g.set(this, (() => {
+      m(this, p, "f").showCopyConversationMessage();
+    }));
     f.set(this, (() => {
-      h(this, g, "f").showCopyConversationMessage();
+      console.log("delete messages");
     }));
     this.showAdditionalContent = false;
     this.conversationCopied = false;
+    this.assistantStatus = "Getting Data";
+  }
+  componentDidLoad() {
+    setTimeout((() => {
+      this.assistantStatus = "Creating Data Base..";
+    }), 1e3);
   }
   render() {
-    return e(n, null, e("ch-theme", {
+    return t(n, null, t("ch-theme", {
       model: w
-    }), e("gx-ide-chat-container", {
+    }), t("gx-ide-chat-container", {
       chatTitle: "GeneXus Assistant",
-      copyConversationCallback: h(this, f, "f"),
-      ref: e => p(this, g, e, "f")
-    }, e("ch-chat", {
-      callbacks: d,
+      copyConversationCallback: m(this, g, "f"),
+      deleteConversationCallback: m(this, f, "f"),
+      ref: e => u(this, p, e, "f")
+    }, t("ch-chat", {
+      callbacks: c,
       class: "chat",
       generatingResponse: false,
       loadingState: "all-records-loaded",
       markdownTheme: "mercury/markdown-viewer",
-      renderItem: mercuryChatMessageRender("mercury/markdown-viewer"),
+      renderItem: a("mercury/markdown-viewer", "Bruno", "Gx Assistant", this.assistantStatus),
       isMobile: false,
-      items: m,
+      items: l,
       showAdditionalContent: this.showAdditionalContent,
-      translations: l
-    }, e("div", {
+      translations: d
+    }, t("div", {
       slot: "additional-content"
     }, "Custom content that is rendered when the chat renders content"))));
   }
 };
-g = new WeakMap, f = new WeakMap;
+p = new WeakMap, g = new WeakMap, f = new WeakMap;
-y.style = u;
+y.style = h;
 export { y as gx_ide_sc_chat_container };
-//# sourceMappingURL=p-72867329.entry.js.map
+//# sourceMappingURL=p-dd6bbdd5.entry.js.map

package/dist/genexus-ide-ui/p-dd6bbdd5.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["PROCESSING_PLACEHOLDER","timeOut","ASSISTANT_RESPONSE_MARKDOWN","ASSISTANT_RESPONSE_SHORT_MARKDOWN","sendChatToLLM","chatRef","document","querySelector","addNewMessage","id","Date","getTime","role","content","status","setTimeout","updateLastMessage","dummyStreaming","counter","stringToDisplay","mode","streamingCompleted","length","message","substring","files","url","caption","undefined","chatCallbacks","clear","Promise","resolve","uploadImage","stopGeneratingAnswer","clearTimeout","chatTranslations","accessibleName","clearChat","copyResponseButton","downloadCodeButton","imagePicker","removeUploadedImage","sendButton","sendInput","stopGeneratingAnswerButton","placeholder","text","copyCodeButton","processing","sourceFiles","Array","from","_","index","codeFixerRecord","metadata","parts","chatShowcaseCss","CSS_BUNDLES","GxIdeScChatContainer","_GxIdeScChatContainer_chatContainerRef","set","this","_GxIdeScChatContainer_copyConversationCallbackHandler","__classPrivateFieldGet","showCopyConversationMessage","_GxIdeScChatContainer_deleteConversationCallbackHandler","console","log","componentDidLoad","assistantStatus","render","h","Host","model","chatTitle","copyConversationCallback","deleteConversationCallback","ref","el","__classPrivateFieldSet","callbacks","class","generatingResponse","loadingState","markdownTheme","renderItem","mercuryChatMessageRender","isMobile","items","showAdditionalContent","translations","slot"],"sources":["src/showcase/chat-container/callbacks.ts","src/showcase/chat-container/chat-showcase.scss?tag=gx-ide-sc-chat-container&encapsulation=shadow","src/showcase/chat-container/chat.showcase.tsx"],"sourcesContent":["import {\n ChatInternalCallbacks,\n ChatMessage,\n ChatTranslations\n} from \"@genexus/chameleon-controls-library\";\n\nconst PROCESSING_PLACEHOLDER = \"{{ASSISTANT_NAME}}\";\n\nlet timeOut: NodeJS.Timeout;\n\nconst ASSISTANT_RESPONSE_MARKDOWN = `\n ### Code block {#code-block}\n To create code blocks, you’ll use three backticks (\\` \\`\\`\\` \\`) or three tildes (\\`~~~\\`) on the lines before and after the code block.\n \n \\`\\`\\`\n {\n \"firstName\": \"John\",\n \"lastName\": \"Smith\",\n \"age\": 25\n }\n \\`\\`\\`\n \n Another way to create code blocks is to indent every line of the block by at least four spaces or one tab.\n \n <html>\n <head>\n </head>\n </html>\n \n \n #### Syntax Highlighting {#syntax-highlighting}\n This feature allows you to add color highlighting for whatever language your code was written in.\n To add syntax highlighting, specify a language next to the backticks before the fenced code block.\n \n \\`\\`\\`json\n {\n \"firstName\": \"John\",\n \"lastName\": \"Smith\",\n \"age\": 25\n }\n \\`\\`\\`\n \n \\`\\`\\`javascript\n import React from 'react'\n import ReactDOM from 'react-dom'\n import Markdown from 'react-markdown'\n import rehypeHighlight from 'rehype-highlight'\n \n const markdown = \\`\n # Your markdown here\n \\`\n \n ReactDOM.render(\n <Markdown rehypePlugins={[rehypeHighlight]}>{markdown}</Markdown>,\n document.querySelector('#content')\n )\n \\`\\`\\`\n \n ### Horizontal Rules {#horizontal-rules}\n To create a horizontal rule, use three or more asterisks (\\`***\\`), dashes (\\`---\\`), or underscores (\\`___\\`) on a line by themselves.\n `;\n\nconst ASSISTANT_RESPONSE_SHORT_MARKDOWN = `\n ### Code block {#code-block}\n To create code blocks, you’ll use three backticks (\\` \\`\\`\\` \\`) or three tildes (\\`~~~\\`) on the lines before and after the code block.\n \n \\`\\`\\`json\n {\n \"firstName\": \"John\",\n \"lastName\": \"Smith\",\n \"age\": 25\n }\n \\`\\`\\`\n `;\n\nconst sendChatToLLM = () => {\n // This is a WA to get the chat reference\n const chatRef = document.querySelector(\"ch-chat\") as HTMLChChatElement;\n\n chatRef.addNewMessage({\n id: `${new Date().getTime()}`,\n role: \"assistant\",\n content: \"Analyzing\",\n status: \"waiting\"\n });\n\n timeOut = setTimeout(() => {\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Processing with Chat with LLMs\",\n status: \"waiting\"\n },\n \"replace\"\n );\n\n timeOut = setTimeout(() => {\n dummyStreaming(chatRef, 20, ASSISTANT_RESPONSE_MARKDOWN, \"replace\");\n }, 200);\n }, 200);\n};\n\nfunction dummyStreaming(\n chatRef: HTMLChChatElement,\n counter: number,\n stringToDisplay: string,\n mode: \"concat\" | \"replace\"\n) {\n timeOut = setTimeout(\n () => {\n const streamingCompleted = counter >= stringToDisplay.length;\n\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: {\n message: stringToDisplay.substring(counter - 20, counter),\n files: streamingCompleted\n ? [\n {\n url: \"https://next.genexus.ai\",\n caption: \"Mars Exploration Contract\"\n },\n {\n url: \"https://gx-chameleon.netlify.app\",\n caption: \"Venus Exploration Contract\"\n }\n ]\n : undefined\n },\n status: streamingCompleted ? \"complete\" : \"streaming\"\n },\n mode\n );\n\n if (!streamingCompleted) {\n dummyStreaming(chatRef, counter + 20, stringToDisplay, \"concat\");\n }\n },\n counter % 200 === 0 ? 50 : 40\n );\n}\n\nexport const chatCallbacks: ChatInternalCallbacks = {\n clear: () => new Promise(resolve => resolve()),\n sendChatToLLM: sendChatToLLM,\n uploadImage: () => new Promise(resolve => resolve(\"\")),\n stopGeneratingAnswer: () => {\n clearTimeout(timeOut);\n\n // This is a WA to get the chat reference\n const chatRef = document.querySelector(\"ch-chat\") as HTMLChChatElement;\n\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"\",\n status: \"complete\"\n },\n \"concat\"\n );\n\n return new Promise(resolve => setTimeout(() => resolve, 10));\n }\n};\n\nexport const chatTranslations: ChatTranslations = {\n accessibleName: {\n clearChat: \"Clear chat\",\n copyResponseButton: \"Copy assistant response\",\n downloadCodeButton: \"Download code\",\n imagePicker: \"Select images\",\n removeUploadedImage: \"Remove uploaded image\",\n sendButton: \"Send\",\n sendInput: \"Message\",\n stopGeneratingAnswerButton: \"Stop generating answer\"\n },\n placeholder: {\n sendInput: \"Ask me a question...\"\n },\n text: {\n copyCodeButton: \"Copy code\",\n processing: `Processing with ${PROCESSING_PLACEHOLDER}`,\n sourceFiles: \"Source files:\"\n }\n};\n\nexport const chatRecord: ChatMessage[] = [\n { id: \"1\", role: \"user\", content: \"Hello world\" },\n { id: \"2\", role: \"assistant\", content: ASSISTANT_RESPONSE_MARKDOWN },\n { id: \"3\", role: \"user\", content: \"Hello world 1\" },\n { id: \"4\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN },\n { id: \"5\", role: \"user\", content: \"Hello world 2\" },\n { id: \"6\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN },\n { id: \"7\", role: \"user\", content: \"Hello world 3\" },\n { id: \"8\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN },\n { id: \"9\", role: \"user\", content: \"Hello world 4\" },\n { id: \"10\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN }\n];\n\nexport const longChatRecord: ChatMessage[] = Array.from(\n { length: 40 },\n (_, index) =>\n index % 2 === 0\n ? {\n id: `index: ${index}`,\n role: \"user\",\n content:\n `index: ${index}` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n`\n }\n : {\n id: `index: ${index}`,\n role: \"assistant\",\n content:\n ASSISTANT_RESPONSE_SHORT_MARKDOWN +\n `\\nindex: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n`\n }\n);\n\nexport const codeFixerRecord: ChatMessage[] = [\n {\n id: \"1\",\n role: \"user\",\n content: \"Please give me an example about...\",\n metadata: \"14:55\"\n },\n {\n id: \"2\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Action required example. Action required example. Action required example.\",\n metadata: \"14:56\"\n },\n {\n id: \"3\",\n role: \"assistant\",\n status: \"complete\",\n content: \"Warning in request\",\n metadata: \"14:57\",\n parts: \"warning\"\n },\n {\n id: \"4\",\n role: \"error\",\n content: \"Error in Request\",\n metadata: \"14:58\"\n },\n {\n id: \"5\",\n role: \"assistant\",\n status: \"complete\",\n content: \"Warning in request\",\n metadata: \"14:59\",\n parts: \"success\"\n },\n {\n id: \"6\",\n role: \"user\",\n content:\n \"Implement the function calculate_average_grade in grades.py that takes a list of grades as input and returns the average grade as a floating-point number\",\n metadata: \"15:00\"\n },\n {\n id: \"7\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"You can provide further details or updates regarding your support ticket and its associated code. Your input here helps us better understand and address your issue effectively.\",\n metadata: \"15:01\"\n },\n {\n id: \"8\",\n role: \"assistant\",\n status: \"waiting\",\n content: \"Processing Request\"\n },\n {\n id: \"9\",\n role: \"assistant\",\n status: \"complete\",\n content: ASSISTANT_RESPONSE_SHORT_MARKDOWN\n }\n];\n",":host {\n block-size: 100%;\n display: grid;\n}\n","import { Component, Host, h, State } from \"@stencil/core\";\nimport { mercuryChatMessageRender } from \"../../components/_helpers/chat-container/code-render\";\nimport { MercuryBundles } from \"@genexus/mercury\";\n\nconst CSS_BUNDLES: MercuryBundles = [\"resets/box-sizing\", \"components/chat\"];\n\nimport { chatCallbacks, chatTranslations, codeFixerRecord } from \"./callbacks\";\n\n@Component({\n tag: \"gx-ide-sc-chat-container\",\n styleUrl: \"chat-showcase.scss\",\n shadow: true\n})\nexport class GxIdeScChatContainer {\n #chatContainerRef!: HTMLGxIdeChatContainerElement;\n\n @State() showAdditionalContent: boolean = false;\n @State() conversationCopied: boolean = false;\n @State() assistantStatus: string = \"Getting Data\";\n\n #copyConversationCallbackHandler = () => {\n this.#chatContainerRef.showCopyConversationMessage();\n };\n\n #deleteConversationCallbackHandler = () => {\n console.log(\"delete messages\");\n };\n\n componentDidLoad() {\n setTimeout(() => {\n this.assistantStatus = \"Creating Data Base..\";\n }, 1000);\n }\n\n render() {\n return (\n <Host>\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <gx-ide-chat-container\n chatTitle=\"GeneXus Assistant\"\n copyConversationCallback={this.#copyConversationCallbackHandler}\n deleteConversationCallback={this.#deleteConversationCallbackHandler}\n ref={el =>\n (this.#chatContainerRef = el as HTMLGxIdeChatContainerElement)\n }\n >\n <ch-chat\n callbacks={chatCallbacks}\n class=\"chat\"\n generatingResponse={false}\n loadingState=\"all-records-loaded\"\n markdownTheme=\"mercury/markdown-viewer\"\n renderItem={mercuryChatMessageRender(\n \"mercury/markdown-viewer\",\n \"Bruno\",\n \"Gx Assistant\",\n this.assistantStatus\n )}\n isMobile={false}\n items={codeFixerRecord}\n showAdditionalContent={this.showAdditionalContent}\n translations={chatTranslations}\n >\n <div slot=\"additional-content\">\n Custom content that is rendered when the chat renders content\n </div>\n </ch-chat>\n </gx-ide-chat-container>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/types/components/_helpers/chat-container/chat-container.d.ts CHANGED Viewed

@@ -4,9 +4,13 @@ export declare class GxIdeChatContainer {
      */
     readonly chatTitle?: string;
     /**
-     * If true a button for copying the conversation will be render on the header.s
+     * If true a button for copying the conversation will be render on the header
      */
     readonly copyConversationCallback: () => void;
+    /**
+     * If true a button for deleting the conversation will be render on the header
+     */
+    readonly deleteConversationCallback: () => void;
     /**
      * Coneration Copied
      */

package/dist/types/components/_helpers/chat-container/code-render.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 import { MarkdownViewerCodeRender, ChatMessageByRole } from "@genexus/chameleon-controls-library";
 import { MarkdownViewerCodeRenderOptions } from "@genexus/chameleon-controls-library/dist/types/components/markdown-viewer/parsers/types";
 export declare const mercuryCodeRender: (copyButtonAccessibleName: string) => (options: MarkdownViewerCodeRenderOptions) => MarkdownViewerCodeRender;
-export declare const mercuryChatMessageRender: (theme: string) => (messageModel: ChatMessageByRole<"assistant" | "error" | "user">) => any[];
+export declare const mercuryChatMessageRender: (theme: string, userName?: string, assistantName?: string, assistantTaskDescription?: string) => (messageModel: ChatMessageByRole<"assistant" | "error" | "user">) => any[];

package/dist/types/components.d.ts CHANGED Viewed

@@ -360,9 +360,13 @@ export namespace Components {
          */
         "chatTitle"?: string;
         /**
-          * If true a button for copying the conversation will be render on the header.s
+          * If true a button for copying the conversation will be render on the header
          */
         "copyConversationCallback": () => void;
+        /**
+          * If true a button for deleting the conversation will be render on the header
+         */
+        "deleteConversationCallback": () => void;
         /**
           * It will display a feedback message that the conversation has been copied
          */
@@ -3217,9 +3221,13 @@ declare namespace LocalJSX {
          */
         "chatTitle"?: string;
         /**
-          * If true a button for copying the conversation will be render on the header.s
+          * If true a button for copying the conversation will be render on the header
          */
         "copyConversationCallback"?: () => void;
+        /**
+          * If true a button for deleting the conversation will be render on the header
+         */
+        "deleteConversationCallback"?: () => void;
     }
     interface GxIdeConnectGxServer {
         /**

package/dist/types/index.d.ts CHANGED Viewed

	@@ -1 +1,2 @@
1 1	export * from "./components";
2	+ export { mercuryChatMessageRender, mercuryCodeRender } from "./components/_helpers/chat-container/code-render";

package/dist/types/showcase/chat-container/chat.showcase.d.ts CHANGED Viewed

@@ -2,5 +2,7 @@ export declare class GxIdeScChatContainer {
     #private;
     showAdditionalContent: boolean;
     conversationCopied: boolean;
+    assistantStatus: string;
+    componentDidLoad(): void;
     render(): any;
 }

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@genexus/genexus-ide-ui",
   "license": "Apache-2.0",
-  "version": "1.0.49",
+  "version": "1.0.51",
   "description": "GeneXus IDE UI components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -36,12 +36,12 @@
   "peerDependencies": {
     "@genexus/chameleon-controls-library": "~6.2.0",
     "@genexus/gemini": "*2.0.1",
-    "@genexus/mercury": "*0.15.1"
+    "@genexus/mercury": "*0.19.1"
   },
   "devDependencies": {
     "@genexus/chameleon-controls-library": "~6.2.0",
     "@genexus/gemini": "*2.0.1",
-    "@genexus/mercury": "*0.15.1",
+    "@genexus/mercury": "*0.19.1",
     "@stencil-community/eslint-plugin": "~0.7.1",
     "@stencil/core": "~4.9.0",
     "@stencil/sass": "~1.4.0",

package/dist/genexus-ide-ui/p-72867329.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["MESSAGE_COPIED_PART_SELECTOR","MESSAGE_COPIED_VISIBLE_PART_SELECTOR","copy","text","event","stopPropagation","navigator","clipboard","writeText","copiedFeedbackRef","target","nextSibling","copiedFeedbackPart","getAttribute","setAttribute","setTimeout","copyButton","textToCopy","accessibleName","additionalPart","h","title","class","type","onClick","part","mercuryCodeRender","copyButtonAccessibleName","options","plainText","language","lastNestedChildClass","value","mercuryChatMessageRender","theme","messageModel","role","status","content","dateTime","metadata","parts","showIndicator","renderCode","PROCESSING_PLACEHOLDER","timeOut","ASSISTANT_RESPONSE_MARKDOWN","ASSISTANT_RESPONSE_SHORT_MARKDOWN","sendChatToLLM","chatRef","document","querySelector","addNewMessage","id","Date","getTime","updateLastMessage","dummyStreaming","counter","stringToDisplay","mode","streamingCompleted","length","message","substring","files","url","caption","undefined","chatCallbacks","clear","Promise","resolve","uploadImage","stopGeneratingAnswer","clearTimeout","chatTranslations","clearChat","copyResponseButton","downloadCodeButton","imagePicker","removeUploadedImage","sendButton","sendInput","stopGeneratingAnswerButton","placeholder","copyCodeButton","processing","sourceFiles","Array","from","_","index","codeFixerRecord","chatShowcaseCss","CSS_BUNDLES","GxIdeScChatContainer","_GxIdeScChatContainer_chatContainerRef","set","this","_GxIdeScChatContainer_copyConversationCallbackHandler","__classPrivateFieldGet","showCopyConversationMessage","render","Host","model","chatTitle","copyConversationCallback","ref","el","__classPrivateFieldSet","callbacks","generatingResponse","loadingState","markdownTheme","renderItem","isMobile","items","showAdditionalContent","translations","slot"],"sources":["src/components/_helpers/chat-container/code-render.tsx","src/showcase/chat-container/callbacks.ts","src/showcase/chat-container/chat-showcase.scss?tag=gx-ide-sc-chat-container&encapsulation=shadow","src/showcase/chat-container/chat.showcase.tsx"],"sourcesContent":["import { h } 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\";\nimport { getIconPath } from \"@genexus/mercury\";\ngetIconPath;\n\nconst MESSAGE_COPIED_PART_SELECTOR = \"message__copied-feedback\";\nconst MESSAGE_COPIED_VISIBLE_PART_SELECTOR = \"message__copied-feedback-visible\";\n\nconst copy = (text: string) => (event: Event) => {\n event.stopPropagation();\n\n // 1. Copy message\n navigator.clipboard.writeText(text);\n\n // 2. Display \"copied\" message (expects to be the next sibling!)\n const copiedFeedbackRef = (event.target as HTMLElement)\n .nextSibling as HTMLElement;\n const copiedFeedbackPart = copiedFeedbackRef.getAttribute(\"part\");\n if (copiedFeedbackPart === MESSAGE_COPIED_PART_SELECTOR) {\n copiedFeedbackRef.setAttribute(\n \"part\",\n `${MESSAGE_COPIED_PART_SELECTOR} ${MESSAGE_COPIED_VISIBLE_PART_SELECTOR}`\n );\n\n setTimeout(() => {\n copiedFeedbackRef.setAttribute(\"part\", `${MESSAGE_COPIED_PART_SELECTOR}`);\n }, 1000);\n }\n};\n\nconst copyButton = (\n textToCopy: string,\n accessibleName: string,\n additionalPart: string\n) => {\n return (\n <button\n aria-label={accessibleName}\n title={accessibleName}\n class=\"button-copy-code\"\n type=\"button\"\n onClick={copy(textToCopy)}\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\">\n {copyButton(\n options.plainText,\n copyButtonAccessibleName,\n \"code-render\"\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\nexport const mercuryChatMessageRender =\n (theme: string) =>\n (messageModel: ChatMessageByRole<\"assistant\" | \"error\" | \"user\">) =>\n messageModel.role === \"assistant\" && messageModel.status === \"waiting\"\n ? [\n <span part=\"message__processing\">Processing request</span>,\n\n <div class=\"processing-animation\" part=\"processing-animation\"></div>\n ]\n : [\n // \"copy button\" before \"role\" and \"time\" to hide both on button:focus\n copyButton(\n messageModel.content as string,\n \"Copy code\",\n \"common-message\"\n ),\n <p part={MESSAGE_COPIED_PART_SELECTOR}>\n message copied to clipboard\n </p>,\n <span part={`message__role ${messageModel.role}`}>\n {messageModel.role === \"user\" ? \"You\" : \"GeneXus Code Fixer\"}\n </span>,\n <time dateTime={messageModel.metadata} part=\"message__time\">\n {messageModel.metadata}\n </time>,\n\n messageModel.role === \"user\" ? (\n <span part=\"message__content user\">{messageModel.content}</span>\n ) : (\n <ch-markdown-viewer\n part={\n messageModel.role === \"assistant\" &&\n (messageModel.status === \"complete\" || !messageModel.status) &&\n !messageModel.parts\n ? `message__content no-error`\n : \"message__content\"\n }\n theme={theme}\n showIndicator={false}\n renderCode={mercuryCodeRender(\"Copy code\")}\n value={messageModel.content as string}\n ></ch-markdown-viewer>\n )\n ];\n","import {\n ChatInternalCallbacks,\n ChatMessage,\n ChatTranslations\n} from \"@genexus/chameleon-controls-library\";\n\nconst PROCESSING_PLACEHOLDER = \"{{ASSISTANT_NAME}}\";\n\nlet timeOut: NodeJS.Timeout;\n\nconst ASSISTANT_RESPONSE_MARKDOWN = `\n ### Code block {#code-block}\n To create code blocks, you’ll use three backticks (\\` \\`\\`\\` \\`) or three tildes (\\`~~~\\`) on the lines before and after the code block.\n \n \\`\\`\\`\n {\n \"firstName\": \"John\",\n \"lastName\": \"Smith\",\n \"age\": 25\n }\n \\`\\`\\`\n \n Another way to create code blocks is to indent every line of the block by at least four spaces or one tab.\n \n <html>\n <head>\n </head>\n </html>\n \n \n #### Syntax Highlighting {#syntax-highlighting}\n This feature allows you to add color highlighting for whatever language your code was written in.\n To add syntax highlighting, specify a language next to the backticks before the fenced code block.\n \n \\`\\`\\`json\n {\n \"firstName\": \"John\",\n \"lastName\": \"Smith\",\n \"age\": 25\n }\n \\`\\`\\`\n \n \\`\\`\\`javascript\n import React from 'react'\n import ReactDOM from 'react-dom'\n import Markdown from 'react-markdown'\n import rehypeHighlight from 'rehype-highlight'\n \n const markdown = \\`\n # Your markdown here\n \\`\n \n ReactDOM.render(\n <Markdown rehypePlugins={[rehypeHighlight]}>{markdown}</Markdown>,\n document.querySelector('#content')\n )\n \\`\\`\\`\n \n ### Horizontal Rules {#horizontal-rules}\n To create a horizontal rule, use three or more asterisks (\\`***\\`), dashes (\\`---\\`), or underscores (\\`___\\`) on a line by themselves.\n `;\n\nconst ASSISTANT_RESPONSE_SHORT_MARKDOWN = `\n ### Code block {#code-block}\n To create code blocks, you’ll use three backticks (\\` \\`\\`\\` \\`) or three tildes (\\`~~~\\`) on the lines before and after the code block.\n \n \\`\\`\\`json\n {\n \"firstName\": \"John\",\n \"lastName\": \"Smith\",\n \"age\": 25\n }\n \\`\\`\\`\n `;\n\nconst sendChatToLLM = () => {\n // This is a WA to get the chat reference\n const chatRef = document.querySelector(\"ch-chat\") as HTMLChChatElement;\n\n chatRef.addNewMessage({\n id: `${new Date().getTime()}`,\n role: \"assistant\",\n content: \"Analyzing\",\n status: \"waiting\"\n });\n\n timeOut = setTimeout(() => {\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Processing with Chat with LLMs\",\n status: \"waiting\"\n },\n \"replace\"\n );\n\n timeOut = setTimeout(() => {\n dummyStreaming(chatRef, 20, ASSISTANT_RESPONSE_MARKDOWN, \"replace\");\n }, 200);\n }, 200);\n};\n\nfunction dummyStreaming(\n chatRef: HTMLChChatElement,\n counter: number,\n stringToDisplay: string,\n mode: \"concat\" | \"replace\"\n) {\n timeOut = setTimeout(\n () => {\n const streamingCompleted = counter >= stringToDisplay.length;\n\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: {\n message: stringToDisplay.substring(counter - 20, counter),\n files: streamingCompleted\n ? [\n {\n url: \"https://next.genexus.ai\",\n caption: \"Mars Exploration Contract\"\n },\n {\n url: \"https://gx-chameleon.netlify.app\",\n caption: \"Venus Exploration Contract\"\n }\n ]\n : undefined\n },\n status: streamingCompleted ? \"complete\" : \"streaming\"\n },\n mode\n );\n\n if (!streamingCompleted) {\n dummyStreaming(chatRef, counter + 20, stringToDisplay, \"concat\");\n }\n },\n counter % 200 === 0 ? 50 : 40\n );\n}\n\nexport const chatCallbacks: ChatInternalCallbacks = {\n clear: () => new Promise(resolve => resolve()),\n sendChatToLLM: sendChatToLLM,\n uploadImage: () => new Promise(resolve => resolve(\"\")),\n stopGeneratingAnswer: () => {\n clearTimeout(timeOut);\n\n // This is a WA to get the chat reference\n const chatRef = document.querySelector(\"ch-chat\") as HTMLChChatElement;\n\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"\",\n status: \"complete\"\n },\n \"concat\"\n );\n\n return new Promise(resolve => setTimeout(() => resolve, 10));\n }\n};\n\nexport const chatTranslations: ChatTranslations = {\n accessibleName: {\n clearChat: \"Clear chat\",\n copyResponseButton: \"Copy assistant response\",\n downloadCodeButton: \"Download code\",\n imagePicker: \"Select images\",\n removeUploadedImage: \"Remove uploaded image\",\n sendButton: \"Send\",\n sendInput: \"Message\",\n stopGeneratingAnswerButton: \"Stop generating answer\"\n },\n placeholder: {\n sendInput: \"Ask me a question...\"\n },\n text: {\n copyCodeButton: \"Copy code\",\n processing: `Processing with ${PROCESSING_PLACEHOLDER}`,\n sourceFiles: \"Source files:\"\n }\n};\n\nexport const chatRecord: ChatMessage[] = [\n { id: \"1\", role: \"user\", content: \"Hello world\" },\n { id: \"2\", role: \"assistant\", content: ASSISTANT_RESPONSE_MARKDOWN },\n { id: \"3\", role: \"user\", content: \"Hello world 1\" },\n { id: \"4\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN },\n { id: \"5\", role: \"user\", content: \"Hello world 2\" },\n { id: \"6\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN },\n { id: \"7\", role: \"user\", content: \"Hello world 3\" },\n { id: \"8\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN },\n { id: \"9\", role: \"user\", content: \"Hello world 4\" },\n { id: \"10\", role: \"assistant\", content: ASSISTANT_RESPONSE_SHORT_MARKDOWN }\n];\n\nexport const longChatRecord: ChatMessage[] = Array.from(\n { length: 40 },\n (_, index) =>\n index % 2 === 0\n ? {\n id: `index: ${index}`,\n role: \"user\",\n content:\n `index: ${index}` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n`\n }\n : {\n id: `index: ${index}`,\n role: \"assistant\",\n content:\n ASSISTANT_RESPONSE_SHORT_MARKDOWN +\n `\\nindex: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n` +\n `index: ${index}\\n`\n }\n);\n\nexport const codeFixerRecord: ChatMessage[] = [\n {\n id: \"1\",\n role: \"user\",\n content: \"Please give me an example about...\",\n metadata: \"14:55\"\n },\n {\n id: \"2\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Action required example. Action required example. Action required example.\",\n metadata: \"14:56\"\n },\n {\n id: \"3\",\n role: \"assistant\",\n status: \"complete\",\n content: \"Warning in request\",\n metadata: \"14:57\",\n parts: \"warning\"\n },\n {\n id: \"4\",\n role: \"error\",\n content: \"Error in Request\",\n metadata: \"14:58\"\n },\n {\n id: \"5\",\n role: \"assistant\",\n status: \"complete\",\n content: \"Warning in request\",\n metadata: \"14:59\",\n parts: \"success\"\n },\n {\n id: \"6\",\n role: \"user\",\n content:\n \"Implement the function calculate_average_grade in grades.py that takes a list of grades as input and returns the average grade as a floating-point number\",\n metadata: \"15:00\"\n },\n {\n id: \"7\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"You can provide further details or updates regarding your support ticket and its associated code. Your input here helps us better understand and address your issue effectively.\",\n metadata: \"15:01\"\n },\n {\n id: \"8\",\n role: \"assistant\",\n status: \"waiting\",\n content: \"Processing Request\"\n },\n {\n id: \"9\",\n role: \"assistant\",\n status: \"complete\",\n content: ASSISTANT_RESPONSE_SHORT_MARKDOWN\n }\n];\n",":host {\n block-size: 100%;\n display: grid;\n}\n","import { Component, Host, h, State } from \"@stencil/core\";\nimport { mercuryChatMessageRender } from \"../../components/_helpers/chat-container/code-render\";\nimport { MercuryBundles } from \"@genexus/mercury\";\n\nconst CSS_BUNDLES: MercuryBundles = [\"resets/box-sizing\", \"components/chat\"];\n\nimport { chatCallbacks, chatTranslations, codeFixerRecord } from \"./callbacks\";\n\n@Component({\n tag: \"gx-ide-sc-chat-container\",\n styleUrl: \"chat-showcase.scss\",\n shadow: true\n})\nexport class GxIdeScChatContainer {\n #chatContainerRef!: HTMLGxIdeChatContainerElement;\n\n @State() showAdditionalContent: boolean = false;\n @State() conversationCopied: boolean = false;\n\n #copyConversationCallbackHandler = () => {\n this.#chatContainerRef.showCopyConversationMessage();\n };\n\n render() {\n return (\n <Host>\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <gx-ide-chat-container\n chatTitle=\"GeneXus Assistant\"\n copyConversationCallback={this.#copyConversationCallbackHandler}\n ref={el =>\n (this.#chatContainerRef = el as HTMLGxIdeChatContainerElement)\n }\n >\n <ch-chat\n callbacks={chatCallbacks}\n class=\"chat\"\n generatingResponse={false}\n loadingState=\"all-records-loaded\"\n markdownTheme=\"mercury/markdown-viewer\"\n renderItem={mercuryChatMessageRender(\"mercury/markdown-viewer\")}\n isMobile={false}\n items={codeFixerRecord}\n showAdditionalContent={this.showAdditionalContent}\n translations={chatTranslations}\n >\n <div slot=\"additional-content\">\n Custom content that is rendered when the chat renders content\n </div>\n </ch-chat>\n </gx-ide-chat-container>\n </Host>\n );\n }\n}\n"],"mappings":";;;;AASA,MAAMA,IAA+B;;AACrC,MAAMC,IAAuC;;AAE7C,MAAMC,OAAQC,KAAkBC;EAC9BA,EAAMC;;IAGNC,UAAUC,UAAUC,UAAUL;;IAG9B,MAAMM,IAAqBL,EAAMM,OAC9BC;EACH,MAAMC,IAAqBH,EAAkBI,aAAa;EAC1D,IAAID,MAAuBZ,GAA8B;IACvDS,EAAkBK,aAChB,QACA,GAAGd,KAAgCC;IAGrCc,YAAW;MACTN,EAAkBK,aAAa,QAAQ,GAAGd;AAA+B,QACxE;;;;AAIP,MAAMgB,aAAa,CACjBC,GACAC,GACAC,MAGEC,EAAA;EAAA,cACcF;EACZG,OAAOH;EACPI,OAAM;EACNC,MAAK;EACLC,SAAStB,KAAKe;EACdQ,MAAM,wBAAwBN;;;AAK7B,MAAMO,oBACVC,KACAC,KAEGR,EAAA;EAAKE,OAAM;GACTF,EAAA;EAAKE,OAAM;GACRN,WACCY,EAAQC,WACRF,GACA,iBAGJP,EAAA;EACEU,UAAUF,EAAQE;EAClBC,sBAAsBH,EAAQG;EAC9BC,OAAOJ,EAAQC;;;AAKlB,MAAMI,2BACVC,KACAC,KACCA,EAAaC,SAAS,eAAeD,EAAaE,WAAW,YACzD,EACEjB,EAAA;EAAMK,MAAK;GAAqB,uBAEhCL,EAAA;EAAKE,OAAM;EAAuBG,MAAK;OAEzC;;AAEET,WACEmB,EAAaG,SACb,aACA,mBAEFlB,EAAA;EAAGK,MAAMzB;GAA4B,gCAGrCoB,EAAA;EAAMK,MAAM,iBAAiBU,EAAaC;GACvCD,EAAaC,SAAS,SAAS,QAAQ,uBAE1ChB,EAAA;EAAMmB,UAAUJ,EAAaK;EAAUf,MAAK;GACzCU,EAAaK,WAGhBL,EAAaC,SAAS,SACpBhB,EAAA;EAAMK,MAAK;GAAyBU,EAAaG,WAEjDlB,EAAA;EACEK,MACEU,EAAaC,SAAS,gBACrBD,EAAaE,WAAW,eAAeF,EAAaE,YACpDF,EAAaM,QACV,8BACA;EAENP,OAAOA;EACPQ,eAAe;EACfC,YAAYjB,kBAAkB;EAC9BM,OAAOG,EAAaG;;;ACzGlC,MAAMM,IAAyB;;AAE/B,IAAIC;;AAEJ,MAAMC,IAA8B;;AAoDpC,MAAMC,IAAoC;;AAa1C,MAAMC,gBAAgB;;EAEpB,MAAMC,IAAUC,SAASC,cAAc;EAEvCF,EAAQG,cAAc;IACpBC,IAAI,IAAG,IAAIC,MAAOC;IAClBnB,MAAM;IACNE,SAAS;IACTD,QAAQ;;EAGVQ,IAAU9B,YAAW;IACnBkC,EAAQO,kBACN;MACEpB,MAAM;MACNE,SAAS;MACTD,QAAQ;OAEV;IAGFQ,IAAU9B,YAAW;MACnB0C,eAAeR,GAAS,IAAIH,GAA6B;AAAU,QAClE;AAAI,MACN;AAAI;;AAGT,SAASW,eACPR,GACAS,GACAC,GACAC;EAEAf,IAAU9B,YACR;IACE,MAAM8C,IAAqBH,KAAWC,EAAgBG;IAEtDb,EAAQO,kBACN;MACEpB,MAAM;MACNE,SAAS;QACPyB,SAASJ,EAAgBK,UAAUN,IAAU,IAAIA;QACjDO,OAAOJ,IACH,EACE;UACEK,KAAK;UACLC,SAAS;WAEX;UACED,KAAK;UACLC,SAAS;cAGbC;;MAEN/B,QAAQwB,IAAqB,aAAa;OAE5CD;IAGF,KAAKC,GAAoB;MACvBJ,eAAeR,GAASS,IAAU,IAAIC,GAAiB;;MAG3DD,IAAU,QAAQ,IAAI,KAAK;AAE/B;;AAEO,MAAMW,IAAuC;EAClDC,OAAO,MAAM,IAAIC,SAAQC,KAAWA;EACpCxB;EACAyB,aAAa,MAAM,IAAIF,SAAQC,KAAWA,EAAQ;EAClDE,sBAAsB;IACpBC,aAAa9B;;QAGb,MAAMI,IAAUC,SAASC,cAAc;IAEvCF,EAAQO,kBACN;MACEpB,MAAM;MACNE,SAAS;MACTD,QAAQ;OAEV;IAGF,OAAO,IAAIkC,SAAQC,KAAWzD,YAAW,MAAMyD,IAAS;AAAI;;;AAIzD,MAAMI,IAAqC;EAChD1D,gBAAgB;IACd2D,WAAW;IACXC,oBAAoB;IACpBC,oBAAoB;IACpBC,aAAa;IACbC,qBAAqB;IACrBC,YAAY;IACZC,WAAW;IACXC,4BAA4B;;EAE9BC,aAAa;IACXF,WAAW;;EAEbhF,MAAM;IACJmF,gBAAgB;IAChBC,YAAY,mBAAmB3C;IAC/B4C,aAAa;;;;AAiB4BC,MAAMC,KACjD;EAAE5B,QAAQ;IACV,CAAC6B,GAAGC,MACFA,IAAQ,MAAM,IACV;EACEvC,IAAI,UAAUuC;EACdxD,MAAM;EACNE,SACE,UAAUsD,MACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA;IAEd;EACEvC,IAAI,UAAUuC;EACdxD,MAAM;EACNE,SACES,IACA,YAAY6C,QACZ,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA;;;AAIf,MAAMC,IAAiC,EAC5C;EACExC,IAAI;EACJjB,MAAM;EACNE,SAAS;EACTE,UAAU;GAEZ;EACEa,IAAI;EACJjB,MAAM;EACNC,QAAQ;EACRC,SACE;EACFE,UAAU;GAEZ;EACEa,IAAI;EACJjB,MAAM;EACNC,QAAQ;EACRC,SAAS;EACTE,UAAU;EACVC,OAAO;GAET;EACEY,IAAI;EACJjB,MAAM;EACNE,SAAS;EACTE,UAAU;GAEZ;EACEa,IAAI;EACJjB,MAAM;EACNC,QAAQ;EACRC,SAAS;EACTE,UAAU;EACVC,OAAO;GAET;EACEY,IAAI;EACJjB,MAAM;EACNE,SACE;EACFE,UAAU;GAEZ;EACEa,IAAI;EACJjB,MAAM;EACNC,QAAQ;EACRC,SACE;EACFE,UAAU;GAEZ;EACEa,IAAI;EACJjB,MAAM;EACNC,QAAQ;EACRC,SAAS;GAEX;EACEe,IAAI;EACJjB,MAAM;EACNC,QAAQ;EACRC,SAASS;;;ACrSb,MAAM+C,IAAkB;;;;;;;;;;;;;;;;;ACIxB,MAAMC,IAA8B,EAAC,qBAAqB;;MAS7CC,IAAoB;;;IAC/BC,EAAAC,IAAAC,WAAA;IAKAC,EAAAF,IAAAC,OAAmC;MACjCE,EAAAF,MAAIF,GAAA,KAAmBK;AAA6B;iCAJZ;8BACH;;EAMvC,MAAAC;IACE,OACEnF,EAACoF,GAAI,MACHpF,EAAA;MAAUqF,OAAOV;QACjB3E,EAAA;MACEsF,WAAU;MACVC,0BAA0BN,EAAAF,MAAIC,GAAA;MAC9BQ,KAAKC,KACFC,EAAAX,MAAIF,GAAqBY,GAAmC;OAG/DzF,EAAA;MACE2F,WAAW1C;MACX/C,OAAM;MACN0F,oBAAoB;MACpBC,cAAa;MACbC,eAAc;MACdC,YAAYlF,yBAAyB;MACrCmF,UAAU;MACVC,OAAOxB;MACPyB,uBAAuBnB,KAAKmB;MAC5BC,cAAc3C;OAEdxD,EAAA;MAAKoG,MAAK;OAAoB"}