@genexus/genexus-ide-ui 1.1.32 → 1.1.33

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 (39) hide show
  1. package/dist/cjs/gx-ide-chat-container_2.cjs.entry.js +9 -2
  2. package/dist/cjs/gx-ide-chat-container_2.cjs.entry.js.map +1 -1
  3. package/dist/cjs/gx-ide-sc-chat-container.cjs.entry.js +2 -1
  4. package/dist/cjs/gx-ide-sc-chat-container.cjs.entry.js.map +1 -1
  5. package/dist/cjs/gx-ide-sign-in-team.cjs.entry.js +1 -1
  6. package/dist/cjs/gx-ide-sign-in-team.cjs.entry.js.map +1 -1
  7. package/dist/collection/components/chat/chat-container/chat-container.js +10 -2
  8. package/dist/collection/components/chat/chat-container/chat-container.js.map +1 -1
  9. package/dist/collection/components/chat/chat-container/gx-ide-assets/chat-container/chat-lit.css +376 -0
  10. package/dist/collection/components/chat/chat-welcome/chat-welcome.js +0 -1
  11. package/dist/collection/components/chat/chat-welcome/chat-welcome.js.map +1 -1
  12. package/dist/collection/components/sign-in-team/sign-in-team.css +1 -2
  13. package/dist/collection/showcase/chat-container/chat.showcase.js +2 -1
  14. package/dist/collection/showcase/chat-container/chat.showcase.js.map +1 -1
  15. package/dist/components/chat-container.js +10 -2
  16. package/dist/components/chat-container.js.map +1 -1
  17. package/dist/components/chat-welcome.js +0 -1
  18. package/dist/components/chat-welcome.js.map +1 -1
  19. package/dist/components/gx-ide-sc-chat-container.js +2 -1
  20. package/dist/components/gx-ide-sc-chat-container.js.map +1 -1
  21. package/dist/components/gx-ide-sign-in-team.js +1 -1
  22. package/dist/components/gx-ide-sign-in-team.js.map +1 -1
  23. package/dist/esm/gx-ide-chat-container_2.entry.js +10 -3
  24. package/dist/esm/gx-ide-chat-container_2.entry.js.map +1 -1
  25. package/dist/esm/gx-ide-sc-chat-container.entry.js +2 -1
  26. package/dist/esm/gx-ide-sc-chat-container.entry.js.map +1 -1
  27. package/dist/esm/gx-ide-sign-in-team.entry.js +1 -1
  28. package/dist/esm/gx-ide-sign-in-team.entry.js.map +1 -1
  29. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  30. package/dist/genexus-ide-ui/gx-ide-assets/chat-container/chat-lit.css +376 -0
  31. package/dist/genexus-ide-ui/{p-61343e93.entry.js → p-203f0417.entry.js} +8 -8
  32. package/dist/genexus-ide-ui/p-203f0417.entry.js.map +1 -0
  33. package/dist/genexus-ide-ui/{p-137130ad.entry.js → p-8d6f2b4f.entry.js} +4 -2
  34. package/dist/genexus-ide-ui/{p-137130ad.entry.js.map → p-8d6f2b4f.entry.js.map} +1 -1
  35. package/dist/genexus-ide-ui/{p-1477d49a.entry.js → p-9270c80f.entry.js} +102 -90
  36. package/dist/genexus-ide-ui/p-9270c80f.entry.js.map +1 -0
  37. package/package.json +3 -3
  38. package/dist/genexus-ide-ui/p-1477d49a.entry.js.map +0 -1
  39. package/dist/genexus-ide-ui/p-61343e93.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"names":["ASSISTANT_RESPONSE_SHORT_MARKDOWN","ASSISTANT_NAME","ASSISTANT_RESPONSE_MARKDOWN","Array","from","length","_","index","id","role","content","codeFixerRecord","metadata","status","assistantName","time","parts","PROCESSING_PLACEHOLDER","sendChatMessages","chatRef","generatingResponse","addNewMessage","Date","getTime","setTimeout","updateLastMessage","dummyStreaming","stopGeneratingAnswer","console","log","Promise","resolve","chatCallbacksWithChatRef","chChatRef","uploadFile","file","url","mimeType","counter","stringToDisplay","mode","streamingCompleted","substring","chatTranslations","accessibleName","clearChat","copyMessageContent","downloadCodeButton","sendButton","sendInput","stopGeneratingAnswerButton","placeholder","text","copyCodeButton","processing","sourceFiles","chatShowcaseCss","CSS_BUNDLES","GxIdeScChatContainer","_GxIdeScChatContainer_chatContainerRef","set","this","_GxIdeScChatContainer_chatWelcomeRef","_GxIdeScChatContainer_chChatRef","_GxIdeScChatContainer_chatCallbacks","_GxIdeScChatContainer_copyConversationCallbackHandler","__classPrivateFieldGet","showCopyConversationMessage","_GxIdeScChatContainer_deleteConversationCallbackHandler","_GxIdeScChatContainer_suggestedPrompRequestedCallbackHandler","async","prompt","assistantFinalResponse","toLowerCase","includes","userPrompt","exitWelcome","componentDidLoad","assistantStatus","componentDidRender","__classPrivateFieldSet","componentWillLoad","chatItems","render","h","Host","model","chatTitle","copyConversationCallback","deleteConversationCallback","ref","el","class","callbacks","loadingState","renderItem","renderItemMercury","items","showAdditionalContent","translations","markdownTheme","slot","suggestedPrompRequestedCallback"],"sources":["src/showcase/chat-container/models.ts","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 type {\n ChatMessage,\n ChatTranslations\n} from \"@genexus/chameleon-controls-library\";\n\nimport { MercuryChatMessageMetadata } from \"../../components/chat/lit-custom-render/types\";\n\nexport const ASSISTANT_RESPONSE_SHORT_MARKDOWN =\n '\\n### Code block {#code-block}\\nTo 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\nexport const ASSISTANT_NAME = \"Nexa\";\n\n// - - - - - - - - - - - - - -\n// Types of messages\n// - - - - - - - - - - - - - -\n\nexport const userMessageChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"user\",\n content:\n \"Generate a web form for customer registration with fields for name, email, phone, and address. Include validation, save the data to the database, and show a confirmation message after submission.\",\n metadata: null\n }\n];\n\nexport const assistantMessageChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"I’ve created the basic structure for the registration form, but I need a bit more info: Should the address include city, state, and ZIP? Do you want a separate confirmation page or just a message on the same screen? Any specific format or validation for the phone number?\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n\nexport const assistantMessageWarningChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"The CustomerRegistration panel was created with warnings: The “Phone” field uses a generic character format—consider a phone mask. No address validation rules applied.The data is still saved correctly, and the panel works as expected.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"warning\"\n }\n];\n\nexport const assistantMessageSuccessChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"The CustomerRegistration web panel was created successfully. Fields: Name, Email, Phone, Address. Validations applied (required, email format). Data saved to “Customer” transaction. Confirmation message shown after submit. Let me know if you'd like to add styles or link it to another object.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"success\"\n }\n];\n\nexport const errorMessageChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"error\",\n content:\n \"Sorry, I couldn't generate the requested form. Reason: The “Customer” transaction does not exist in the current Knowledge Base. Please create the “Customer” object or check if it’s named differently.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n\nexport const assistantWaitingChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"waiting\",\n content: \"Creating CustomerRegistration panel\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n\nexport const chatTranslations: ChatTranslations = {\n accessibleName: {\n clearChat: \"Clear chat\",\n copyMessageContent: \"Copy assistant content\",\n downloadCodeButton: \"Download code\",\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 copyMessageContent: \"Copy\",\n downloadCodeButton: \"Download\",\n processing: `Processing...`,\n sourceFiles: \"Source files:\",\n stopGeneratingAnswerButton: \"Stop generating answer\"\n }\n};\n\n// All messages\n\nexport const allMessagesModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"user\",\n content:\n \"Generate a web form for customer registration with fields for name, email, phone, and address. Include validation, save the data to the database, and show a confirmation message after submission.\",\n metadata: null\n },\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"I’ve created the basic structure for the registration form, but I need a bit more info: Should the address include city, state, and ZIP? Do you want a separate confirmation page or just a message on the same screen? Any specific format or validation for the phone number?\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"The CustomerRegistration panel was created with warnings: The “Phone” field uses a generic character format—consider a phone mask. No address validation rules applied.The data is still saved correctly, and the panel works as expected.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"warning\"\n },\n {\n id: \"1\",\n role: \"error\",\n content:\n \"Sorry, I couldn't generate the requested form. Reason: The “Customer” transaction does not exist in the current Knowledge Base. Please create the “Customer” object or check if it’s named differently.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"5\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Your information has been saved successfully, and all changes are now reflected in your account. You can continue with the next steps or return to the dashboard at any time.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"15:00\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"success\"\n }\n];\n\n// - - - - - - - - - - - - - -\n// Other messages\n// - - - - - - - - - - - - - -\n\nexport const ASSISTANT_RESPONSE_MARKDOWN = `\n###### Code block {#code-block}\nTo 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\nAnother 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}\nThis feature allows you to add color highlighting for whatever language your code was written in.\nTo 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\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport Markdown from 'react-markdown'\nimport rehypeHighlight from 'rehype-highlight'\n\nconst markdown = \\`\n# Your markdown here\n\\`\n\nReactDOM.render(\n <Markdown rehypePlugins={[rehypeHighlight]}>{markdown}</Markdown>,\n document.querySelector('#content')\n)\n\\`\\`\\`\n\n###### Horizontal Rules {#horizontal-rules}\nTo create a horizontal rule, use three or more asterisks (\\`***\\`), dashes (\\`---\\`), or underscores (\\`___\\`) on a line by themselves.\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: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"3\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Some fields contain missing or invalid data, which may prevent the process from completing correctly. Review your input carefully and make any necessary corrections before continuing.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"warning\"\n },\n {\n id: \"4\",\n role: \"error\",\n content:\n \"An unexpected error occurred while processing your request, and the operation couldn’t be completed.Please check your internet connection or try again later. If the problem persists, contact support.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"5\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Your information has been saved successfully, and all changes are now reflected in your account. You can continue with the next steps or return to the dashboard at any time.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\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: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"8\",\n role: \"assistant\",\n status: \"waiting\",\n content: \"You can provide further details or updates\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"9\",\n role: \"assistant\",\n status: \"complete\",\n content: ASSISTANT_RESPONSE_SHORT_MARKDOWN,\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n","import {\n ChatCallbacks,\n ChatTranslations\n} from \"@genexus/chameleon-controls-library\";\nimport { ChatMessageFile } from \"@genexus/chameleon-controls-library/dist/types/components/chat/types\";\n\nimport { ASSISTANT_RESPONSE_MARKDOWN } from \"./models\";\n\nimport { ASSISTANT_NAME } from \"./models\";\nimport { MercuryChatMessageMetadata } from \"../../components/chat/lit-custom-render/types\";\n\nconst PROCESSING_PLACEHOLDER = \"{{ASSISTANT_NAME}}\";\n\nconst sendChatMessages = (chatRef: HTMLChChatElement) => () => {\n chatRef.generatingResponse = true;\n\n chatRef.addNewMessage({\n id: `${new Date().getTime()}`,\n role: \"assistant\",\n content: \"Analyzing\",\n status: \"waiting\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n });\n\n setTimeout(() => {\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Processing with Chat with LLMs\",\n status: \"waiting\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n \"replace\"\n );\n\n setTimeout(() => {\n dummyStreaming(chatRef, 20, ASSISTANT_RESPONSE_MARKDOWN, \"replace\");\n }, 2000);\n }, 2000);\n};\n\nconst stopGeneratingAnswer = (): Promise<void> => {\n console.log(\"stop generating answer\");\n return new Promise<void>(resolve => {\n // Lógica asincrónica aquí si es necesario\n resolve();\n });\n};\n\nexport const chatCallbacksWithChatRef = (\n chChatRef: HTMLChChatElement\n): ChatCallbacks => {\n return {\n sendChatMessages: sendChatMessages(chChatRef),\n uploadFile: (file: File) =>\n new Promise<ChatMessageFile>(() => {\n console.log(\"file\", file);\n\n return Promise.resolve({\n url: \"Error\",\n mimeType: \"application/javascript\"\n } satisfies ChatMessageFile);\n }),\n stopGeneratingAnswer: stopGeneratingAnswer\n };\n};\n\nfunction dummyStreaming(\n chatRef: HTMLChChatElement,\n counter: number,\n stringToDisplay: string,\n mode: \"concat\" | \"replace\"\n) {\n setTimeout(\n () => {\n const streamingCompleted = counter >= stringToDisplay.length;\n\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: stringToDisplay.substring(counter - 20, counter),\n\n // {\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 metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n mode\n );\n\n if (!streamingCompleted) {\n dummyStreaming(chatRef, counter + 20, stringToDisplay, \"concat\");\n } else {\n chatRef.generatingResponse = false;\n }\n },\n counter % 200 === 0 ? 50 : 40\n );\n}\n\nexport const chatTranslations: ChatTranslations = {\n accessibleName: {\n clearChat: \"Clear chat\",\n copyMessageContent: \"Copy message\",\n downloadCodeButton: \"Download code\",\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 copyMessageContent: \"Copy message content\",\n downloadCodeButton: \"Download code\",\n processing: `Processing with ${PROCESSING_PLACEHOLDER}`,\n sourceFiles: \"Source files:\",\n stopGeneratingAnswerButton: \"Stop generating answer\"\n }\n};\n",":host {\n block-size: 100%;\n display: grid;\n}\n","import { Component, Host, h, State, Prop, Method } from \"@stencil/core\";\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { renderItemMercury } from \"../../components/chat/lit-custom-render/render-item.lit\";\nimport { codeFixerRecord } from \"./models\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"utils/elevation\",\n \"components/chat-lit\",\n \"components/markdown-viewer\"\n];\n\nimport { chatCallbacksWithChatRef, chatTranslations } from \"./callbacks\";\nimport {\n ChatMessage,\n ChatCallbacks\n} from \"@genexus/chameleon-controls-library\";\nimport { ChatMessageUser } from \"@genexus/chameleon-controls-library/dist/types/components/chat/types\";\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 #chatWelcomeRef!: HTMLGxIdeChatWelcomeElement;\n #chChatRef!: HTMLChChatElement;\n #chatCallbacks: ChatCallbacks;\n\n /**\n * If true, the chat items length will be 0, since this is a requirement for dipslaying the ch-chat\n * \"empty-chat\" slot that welcome screen uses to display.\n */\n @Prop() readonly mode: \"welcome\" | \"messages-sample\" | \"empty\" =\n \"messages-sample\";\n\n @State() generatingResponse: boolean = false;\n @State() loadingState:\n | \"all-records-loaded\"\n | \"initial\"\n | \"loading\"\n | \"more-data-to-fetch\" = \"all-records-loaded\";\n @State() showAdditionalContent: boolean = false;\n @State() conversationCopied: boolean = false;\n @State() assistantStatus: string = \"Getting Data\";\n @State() chatItems: ChatMessage[] = [];\n\n /**\n * It will exit the wellcome screen and remove it from the dom.\n */\n @Method()\n async exitWelcome() {\n // hand exitWelcome to gx-ide-chat-welcome\n this.#chatWelcomeRef.exitWelcome();\n }\n\n #copyConversationCallbackHandler = () => {\n this.#chatContainerRef.showCopyConversationMessage();\n };\n\n #deleteConversationCallbackHandler = () => {};\n\n componentDidLoad() {\n setTimeout(() => {\n this.assistantStatus = \"Creating Data Base..\";\n }, 1000);\n }\n\n componentDidRender() {\n if (!this.#chatCallbacks && this.#chChatRef) {\n this.#chatCallbacks = chatCallbacksWithChatRef(this.#chChatRef);\n }\n }\n\n async componentWillLoad() {\n if (this.mode === \"messages-sample\") {\n this.chatItems = codeFixerRecord;\n } else if (this.mode === \"welcome\") {\n this.chatItems = [];\n } else if (this.mode === \"empty\") {\n this.chatItems = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content: \"Hello! I am your assistant.\",\n metadata: \"14:56\"\n }\n ];\n }\n }\n #suggestedPrompRequestedCallbackHandler = async (\n prompt: string\n ): Promise<void> => {\n let assistantFinalResponse: string;\n if (prompt.toLowerCase().includes(\"transaction\")) {\n assistantFinalResponse =\n 'To create a transaction in GeneXus, start by opening your KB (Knowledge Base) and selecting \"Transaction\" from the \"New Object\" options. Give it a name and define its attributes, starting with a primary key followed by the related data fields. GeneXus will automatically infer the data structure and relationships based on how you define the attributes and their nesting. Once saved, it generates the necessary database tables and forms for inserting, updating, and deleting records. You can then run the application to test the transaction directly in your browser.';\n } else if (prompt.toLowerCase().includes(\"entity\")) {\n assistantFinalResponse =\n 'In GeneXus, creating an entity usually means defining a Transaction object that represents a real-world concept like \"Customer\" or \"Product.\" To do this, create a new Transaction, name it after the entity, and define its attributes—starting with a unique identifier (like CustomerId) and then adding other fields (like CustomerName, CustomerEmail). GeneXus treats this Transaction as an entity and uses it to generate the corresponding table and interface automatically.';\n } else {\n assistantFinalResponse =\n \"Sorry, I didn’t catch that—mind rephrasing it? 😅\";\n }\n\n const userPrompt: ChatMessageUser = {\n id: \"1\",\n role: \"user\",\n content: prompt\n };\n this.#chChatRef.addNewMessage(userPrompt);\n setTimeout(() => {\n this.#chChatRef.addNewMessage({\n id: `${new Date().getTime()}`,\n role: \"assistant\",\n content: \"Analyzing\",\n status: \"waiting\"\n });\n setTimeout(() => {\n this.#chChatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Processing with Chat with LLMs\",\n status: \"waiting\"\n },\n \"replace\"\n );\n setTimeout(() => {\n this.#chChatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Getting information\",\n status: \"waiting\"\n },\n \"replace\"\n );\n this.#chChatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: assistantFinalResponse,\n status: \"complete\"\n },\n \"replace\"\n );\n }, 1500);\n }, 1500);\n }, 100);\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 class=\"elevation-1\"\n >\n <ch-chat\n callbacks={this.#chatCallbacks}\n class=\"chat-lit\"\n generatingResponse={this.generatingResponse}\n loadingState={this.loadingState} // \"all-records-loaded\" to display the welcome screen\n renderItem={renderItemMercury}\n items={this.chatItems} // length 0 to display the welcome screen\n showAdditionalContent={this.showAdditionalContent}\n translations={chatTranslations}\n ref={(el: HTMLChChatElement) =>\n (this.#chChatRef = el as HTMLChChatElement)\n }\n markdownTheme=\"components/markdown-viewer\"\n >\n <gx-ide-chat-welcome\n ref={el =>\n (this.#chatWelcomeRef = el as HTMLGxIdeChatWelcomeElement)\n }\n slot=\"empty-chat\"\n suggestedPrompRequestedCallback={\n this.#suggestedPrompRequestedCallbackHandler\n }\n ></gx-ide-chat-welcome>\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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"}
1
+ {"version":3,"names":["ASSISTANT_RESPONSE_SHORT_MARKDOWN","ASSISTANT_NAME","ASSISTANT_RESPONSE_MARKDOWN","Array","from","length","_","index","id","role","content","codeFixerRecord","metadata","status","assistantName","time","parts","PROCESSING_PLACEHOLDER","sendChatMessages","chatRef","generatingResponse","addNewMessage","Date","getTime","setTimeout","updateLastMessage","dummyStreaming","stopGeneratingAnswer","console","log","Promise","resolve","chatCallbacksWithChatRef","chChatRef","uploadFile","file","url","mimeType","counter","stringToDisplay","mode","streamingCompleted","substring","chatTranslations","accessibleName","clearChat","copyMessageContent","downloadCodeButton","sendButton","sendInput","stopGeneratingAnswerButton","placeholder","text","copyCodeButton","processing","sourceFiles","chatShowcaseCss","CSS_BUNDLES","GxIdeScChatContainer","_GxIdeScChatContainer_chatContainerRef","set","this","_GxIdeScChatContainer_chatWelcomeRef","_GxIdeScChatContainer_chChatRef","_GxIdeScChatContainer_chatCallbacks","_GxIdeScChatContainer_copyConversationCallbackHandler","__classPrivateFieldGet","showCopyConversationMessage","_GxIdeScChatContainer_deleteConversationCallbackHandler","_GxIdeScChatContainer_suggestedPrompRequestedCallbackHandler","async","prompt","assistantFinalResponse","toLowerCase","includes","userPrompt","exitWelcome","componentDidLoad","assistantStatus","componentDidRender","__classPrivateFieldSet","componentWillLoad","chatItems","render","h","Host","model","chatTitle","copyConversationCallback","deleteConversationCallback","ref","el","class","callbacks","loadingState","renderItem","renderItemMercury","items","showAdditionalContent","translations","markdownTheme","slot","suggestedPrompRequestedCallback"],"sources":["src/showcase/chat-container/models.ts","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 type {\n ChatMessage,\n ChatTranslations\n} from \"@genexus/chameleon-controls-library\";\n\nimport { MercuryChatMessageMetadata } from \"../../components/chat/lit-custom-render/types\";\n\nexport const ASSISTANT_RESPONSE_SHORT_MARKDOWN =\n '\\n### Code block {#code-block}\\nTo 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\nexport const ASSISTANT_NAME = \"Nexa\";\n\n// - - - - - - - - - - - - - -\n// Types of messages\n// - - - - - - - - - - - - - -\n\nexport const userMessageChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"user\",\n content:\n \"Generate a web form for customer registration with fields for name, email, phone, and address. Include validation, save the data to the database, and show a confirmation message after submission.\",\n metadata: null\n }\n];\n\nexport const assistantMessageChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"I’ve created the basic structure for the registration form, but I need a bit more info: Should the address include city, state, and ZIP? Do you want a separate confirmation page or just a message on the same screen? Any specific format or validation for the phone number?\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n\nexport const assistantMessageWarningChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"The CustomerRegistration panel was created with warnings: The “Phone” field uses a generic character format—consider a phone mask. No address validation rules applied.The data is still saved correctly, and the panel works as expected.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"warning\"\n }\n];\n\nexport const assistantMessageSuccessChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"The CustomerRegistration web panel was created successfully. Fields: Name, Email, Phone, Address. Validations applied (required, email format). Data saved to “Customer” transaction. Confirmation message shown after submit. Let me know if you'd like to add styles or link it to another object.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"success\"\n }\n];\n\nexport const errorMessageChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"error\",\n content:\n \"Sorry, I couldn't generate the requested form. Reason: The “Customer” transaction does not exist in the current Knowledge Base. Please create the “Customer” object or check if it’s named differently.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n\nexport const assistantWaitingChatModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"waiting\",\n content: \"Creating CustomerRegistration panel\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n\nexport const chatTranslations: ChatTranslations = {\n accessibleName: {\n clearChat: \"Clear chat\",\n copyMessageContent: \"Copy assistant content\",\n downloadCodeButton: \"Download code\",\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 copyMessageContent: \"Copy\",\n downloadCodeButton: \"Download\",\n processing: `Processing...`,\n sourceFiles: \"Source files:\",\n stopGeneratingAnswerButton: \"Stop generating answer\"\n }\n};\n\n// All messages\n\nexport const allMessagesModel: ChatMessage[] = [\n {\n id: \"1\",\n role: \"user\",\n content:\n \"Generate a web form for customer registration with fields for name, email, phone, and address. Include validation, save the data to the database, and show a confirmation message after submission.\",\n metadata: null\n },\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"I’ve created the basic structure for the registration form, but I need a bit more info: Should the address include city, state, and ZIP? Do you want a separate confirmation page or just a message on the same screen? Any specific format or validation for the phone number?\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"The CustomerRegistration panel was created with warnings: The “Phone” field uses a generic character format—consider a phone mask. No address validation rules applied.The data is still saved correctly, and the panel works as expected.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"warning\"\n },\n {\n id: \"1\",\n role: \"error\",\n content:\n \"Sorry, I couldn't generate the requested form. Reason: The “Customer” transaction does not exist in the current Knowledge Base. Please create the “Customer” object or check if it’s named differently.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"5\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Your information has been saved successfully, and all changes are now reflected in your account. You can continue with the next steps or return to the dashboard at any time.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"15:00\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"success\"\n }\n];\n\n// - - - - - - - - - - - - - -\n// Other messages\n// - - - - - - - - - - - - - -\n\nexport const ASSISTANT_RESPONSE_MARKDOWN = `\n###### Code block {#code-block}\nTo 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\nAnother 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}\nThis feature allows you to add color highlighting for whatever language your code was written in.\nTo 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\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport Markdown from 'react-markdown'\nimport rehypeHighlight from 'rehype-highlight'\n\nconst markdown = \\`\n# Your markdown here\n\\`\n\nReactDOM.render(\n <Markdown rehypePlugins={[rehypeHighlight]}>{markdown}</Markdown>,\n document.querySelector('#content')\n)\n\\`\\`\\`\n\n###### Horizontal Rules {#horizontal-rules}\nTo create a horizontal rule, use three or more asterisks (\\`***\\`), dashes (\\`---\\`), or underscores (\\`___\\`) on a line by themselves.\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: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"3\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Some fields contain missing or invalid data, which may prevent the process from completing correctly. Review your input carefully and make any necessary corrections before continuing.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\n parts: \"warning\"\n },\n {\n id: \"4\",\n role: \"error\",\n content:\n \"An unexpected error occurred while processing your request, and the operation couldn’t be completed.Please check your internet connection or try again later. If the problem persists, contact support.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"5\",\n role: \"assistant\",\n status: \"complete\",\n content:\n \"Your information has been saved successfully, and all changes are now reflected in your account. You can continue with the next steps or return to the dashboard at any time.\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata,\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: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"8\",\n role: \"assistant\",\n status: \"waiting\",\n content: \"You can provide further details or updates\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n {\n id: \"9\",\n role: \"assistant\",\n status: \"complete\",\n content: ASSISTANT_RESPONSE_SHORT_MARKDOWN,\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n }\n];\n","import {\n ChatCallbacks,\n ChatTranslations\n} from \"@genexus/chameleon-controls-library\";\nimport { ChatMessageFile } from \"@genexus/chameleon-controls-library/dist/types/components/chat/types\";\n\nimport { ASSISTANT_RESPONSE_MARKDOWN } from \"./models\";\n\nimport { ASSISTANT_NAME } from \"./models\";\nimport { MercuryChatMessageMetadata } from \"../../components/chat/lit-custom-render/types\";\n\nconst PROCESSING_PLACEHOLDER = \"{{ASSISTANT_NAME}}\";\n\nconst sendChatMessages = (chatRef: HTMLChChatElement) => () => {\n chatRef.generatingResponse = true;\n\n chatRef.addNewMessage({\n id: `${new Date().getTime()}`,\n role: \"assistant\",\n content: \"Analyzing\",\n status: \"waiting\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n });\n\n setTimeout(() => {\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Processing with Chat with LLMs\",\n status: \"waiting\",\n metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n \"replace\"\n );\n\n setTimeout(() => {\n dummyStreaming(chatRef, 20, ASSISTANT_RESPONSE_MARKDOWN, \"replace\");\n }, 2000);\n }, 2000);\n};\n\nconst stopGeneratingAnswer = (): Promise<void> => {\n console.log(\"stop generating answer\");\n return new Promise<void>(resolve => {\n // Lógica asincrónica aquí si es necesario\n resolve();\n });\n};\n\nexport const chatCallbacksWithChatRef = (\n chChatRef: HTMLChChatElement\n): ChatCallbacks => {\n return {\n sendChatMessages: sendChatMessages(chChatRef),\n uploadFile: (file: File) =>\n new Promise<ChatMessageFile>(() => {\n console.log(\"file\", file);\n\n return Promise.resolve({\n url: \"Error\",\n mimeType: \"application/javascript\"\n } satisfies ChatMessageFile);\n }),\n stopGeneratingAnswer: stopGeneratingAnswer\n };\n};\n\nfunction dummyStreaming(\n chatRef: HTMLChChatElement,\n counter: number,\n stringToDisplay: string,\n mode: \"concat\" | \"replace\"\n) {\n setTimeout(\n () => {\n const streamingCompleted = counter >= stringToDisplay.length;\n\n chatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: stringToDisplay.substring(counter - 20, counter),\n\n // {\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 metadata: {\n assistantName: ASSISTANT_NAME,\n time: \"14:25\"\n } satisfies MercuryChatMessageMetadata\n },\n mode\n );\n\n if (!streamingCompleted) {\n dummyStreaming(chatRef, counter + 20, stringToDisplay, \"concat\");\n } else {\n chatRef.generatingResponse = false;\n }\n },\n counter % 200 === 0 ? 50 : 40\n );\n}\n\nexport const chatTranslations: ChatTranslations = {\n accessibleName: {\n clearChat: \"Clear chat\",\n copyMessageContent: \"Copy message\",\n downloadCodeButton: \"Download code\",\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 copyMessageContent: \"Copy message content\",\n downloadCodeButton: \"Download code\",\n processing: `Processing with ${PROCESSING_PLACEHOLDER}`,\n sourceFiles: \"Source files:\",\n stopGeneratingAnswerButton: \"Stop generating answer\"\n }\n};\n",":host {\n block-size: 100%;\n display: grid;\n}\n","import { Component, Host, h, State, Prop, Method } from \"@stencil/core\";\nimport { renderItemMercury } from \"../../components/chat/lit-custom-render/render-item.lit\";\nimport { codeFixerRecord } from \"./models\";\n\n// TODO: Add back \"components/chat-lit\" once chat bundle for lit is ready\n// on a new Mercury version\nconst CSS_BUNDLES = [\n \"resets/box-sizing\",\n \"utils/elevation\",\n \"components/markdown-viewer\"\n];\n\nimport { chatCallbacksWithChatRef, chatTranslations } from \"./callbacks\";\nimport {\n ChatMessage,\n ChatCallbacks\n} from \"@genexus/chameleon-controls-library\";\nimport { ChatMessageUser } from \"@genexus/chameleon-controls-library/dist/types/components/chat/types\";\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 #chatWelcomeRef!: HTMLGxIdeChatWelcomeElement;\n #chChatRef!: HTMLChChatElement;\n #chatCallbacks: ChatCallbacks;\n\n /**\n * If true, the chat items length will be 0, since this is a requirement for dipslaying the ch-chat\n * \"empty-chat\" slot that welcome screen uses to display.\n */\n @Prop() readonly mode: \"welcome\" | \"messages-sample\" | \"empty\" =\n \"messages-sample\";\n\n @State() generatingResponse: boolean = false;\n @State() loadingState:\n | \"all-records-loaded\"\n | \"initial\"\n | \"loading\"\n | \"more-data-to-fetch\" = \"all-records-loaded\";\n @State() showAdditionalContent: boolean = false;\n @State() conversationCopied: boolean = false;\n @State() assistantStatus: string = \"Getting Data\";\n @State() chatItems: ChatMessage[] = [];\n\n /**\n * It will exit the wellcome screen and remove it from the dom.\n */\n @Method()\n async exitWelcome() {\n // hand exitWelcome to gx-ide-chat-welcome\n this.#chatWelcomeRef.exitWelcome();\n }\n\n #copyConversationCallbackHandler = () => {\n this.#chatContainerRef.showCopyConversationMessage();\n };\n\n #deleteConversationCallbackHandler = () => {};\n\n componentDidLoad() {\n setTimeout(() => {\n this.assistantStatus = \"Creating Data Base..\";\n }, 1000);\n }\n\n componentDidRender() {\n if (!this.#chatCallbacks && this.#chChatRef) {\n this.#chatCallbacks = chatCallbacksWithChatRef(this.#chChatRef);\n }\n }\n\n async componentWillLoad() {\n if (this.mode === \"messages-sample\") {\n this.chatItems = codeFixerRecord;\n } else if (this.mode === \"welcome\") {\n this.chatItems = [];\n } else if (this.mode === \"empty\") {\n this.chatItems = [\n {\n id: \"1\",\n role: \"assistant\",\n status: \"complete\",\n content: \"Hello! I am your assistant.\",\n metadata: \"14:56\"\n }\n ];\n }\n }\n #suggestedPrompRequestedCallbackHandler = async (\n prompt: string\n ): Promise<void> => {\n let assistantFinalResponse: string;\n if (prompt.toLowerCase().includes(\"transaction\")) {\n assistantFinalResponse =\n 'To create a transaction in GeneXus, start by opening your KB (Knowledge Base) and selecting \"Transaction\" from the \"New Object\" options. Give it a name and define its attributes, starting with a primary key followed by the related data fields. GeneXus will automatically infer the data structure and relationships based on how you define the attributes and their nesting. Once saved, it generates the necessary database tables and forms for inserting, updating, and deleting records. You can then run the application to test the transaction directly in your browser.';\n } else if (prompt.toLowerCase().includes(\"entity\")) {\n assistantFinalResponse =\n 'In GeneXus, creating an entity usually means defining a Transaction object that represents a real-world concept like \"Customer\" or \"Product.\" To do this, create a new Transaction, name it after the entity, and define its attributes—starting with a unique identifier (like CustomerId) and then adding other fields (like CustomerName, CustomerEmail). GeneXus treats this Transaction as an entity and uses it to generate the corresponding table and interface automatically.';\n } else {\n assistantFinalResponse =\n \"Sorry, I didn’t catch that—mind rephrasing it? 😅\";\n }\n\n const userPrompt: ChatMessageUser = {\n id: \"1\",\n role: \"user\",\n content: prompt\n };\n this.#chChatRef.addNewMessage(userPrompt);\n setTimeout(() => {\n this.#chChatRef.addNewMessage({\n id: `${new Date().getTime()}`,\n role: \"assistant\",\n content: \"Analyzing\",\n status: \"waiting\"\n });\n setTimeout(() => {\n this.#chChatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Processing with Chat with LLMs\",\n status: \"waiting\"\n },\n \"replace\"\n );\n setTimeout(() => {\n this.#chChatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: \"Getting information\",\n status: \"waiting\"\n },\n \"replace\"\n );\n this.#chChatRef.updateLastMessage(\n {\n role: \"assistant\",\n content: assistantFinalResponse,\n status: \"complete\"\n },\n \"replace\"\n );\n }, 1500);\n }, 1500);\n }, 100);\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 class=\"elevation-1\"\n >\n <ch-chat\n callbacks={this.#chatCallbacks}\n class=\"chat-lit\"\n generatingResponse={this.generatingResponse}\n loadingState={this.loadingState} // \"all-records-loaded\" to display the welcome screen\n renderItem={renderItemMercury}\n items={this.chatItems} // length 0 to display the welcome screen\n showAdditionalContent={this.showAdditionalContent}\n translations={chatTranslations}\n ref={(el: HTMLChChatElement) =>\n (this.#chChatRef = el as HTMLChChatElement)\n }\n markdownTheme=\"components/markdown-viewer\"\n >\n <gx-ide-chat-welcome\n ref={el =>\n (this.#chatWelcomeRef = el as HTMLGxIdeChatWelcomeElement)\n }\n slot=\"empty-chat\"\n suggestedPrompRequestedCallback={\n this.#suggestedPrompRequestedCallbackHandler\n }\n ></gx-ide-chat-welcome>\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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"}
@@ -1,4 +1,4 @@
1
- import { r as t, h as e, H as a, a as i, g as s } from "./p-97107ecc.js";
1
+ import { g as t, r as e, h as a, H as i, a as s } from "./p-97107ecc.js";
2
2
 
3
3
  import { g as n } from "./p-401bfc97.js";
4
4
 
@@ -21,34 +21,44 @@ var l = undefined && undefined.__classPrivateFieldGet || function(t, e, a, i) {
21
21
 
22
22
  var d, p, h, m, u, f;
23
23
 
24
- const g = [ "resets/box-sizing", "utils/typography", "chameleon/scrollbar", "components/button", "components/dropdown", "components/icon", "utils/elevation" ];
24
+ // TODO: Remove this once update chat bundle for lit is ready
25
+ // on a new Mercury version
26
+ const g = t(`./gx-ide-assets/chat-container/chat-lit.css`);
25
27
 
26
- const y = n({
28
+ const y = [ "resets/box-sizing", "utils/typography", "chameleon/scrollbar", "components/button", "components/dropdown", "components/icon", "utils/elevation" ];
29
+
30
+ const b = {
31
+ // styleSheet: chatListCss,
32
+ url: g,
33
+ name: "components/chat-lit"
34
+ };
35
+
36
+ const w = n({
27
37
  category: "system",
28
38
  name: "copy",
29
39
  colorType: "primary"
30
40
  });
31
41
 
32
- const b = n({
42
+ const v = n({
33
43
  category: "system",
34
44
  name: "delete-outlined",
35
45
  colorType: "primary"
36
46
  });
37
47
 
38
- const w = n({
48
+ const x = n({
39
49
  category: "objects",
40
50
  name: "conversational-flows"
41
51
  });
42
52
 
43
- const v = n({
53
+ const _ = n({
44
54
  category: "system",
45
55
  name: "more-horizontal",
46
56
  colorType: "neutral"
47
57
  });
48
58
 
49
- const x = class {
50
- constructor(e) {
51
- t(this, e);
59
+ const k = class {
60
+ constructor(t) {
61
+ e(this, t);
52
62
  d.set(this, [ {
53
63
  type: "slot",
54
64
  id: "delete-chat-button"
@@ -99,64 +109,66 @@ const x = class {
99
109
  }
100
110
  render() {
101
111
  const t = this.chatTitle || this.copyConversationCallback || this.deleteConversationCallback;
102
- const i = this.copyConversationCallback || this.deleteConversationCallback;
103
- return e(a, {
112
+ const e = this.copyConversationCallback || this.deleteConversationCallback;
113
+ return a(i, {
104
114
  class: {
105
115
  "chat-container": true,
106
116
  "with-header": !!t
107
117
  }
108
- }, e("ch-theme", {
109
- model: g
110
- }), e("section", {
118
+ }, a("ch-theme", {
119
+ model: y
120
+ }), a("ch-theme", {
121
+ model: b
122
+ }), a("section", {
111
123
  class: "section"
112
- }, t && e("header", {
124
+ }, t && a("header", {
113
125
  class: "header tiny-semi-bold-l"
114
- }, this.chatTitle && this.chatTitle, i && e("ch-action-menu-render", {
126
+ }, this.chatTitle && this.chatTitle, e && a("ch-action-menu-render", {
115
127
  class: "dropdown",
116
128
  blockAlign: "inside-start",
117
129
  inlineAlign: "inside-end",
118
130
  model: l(this, d, "f"),
119
131
  expanded: this.menuIsExpanded,
120
132
  onExpandedChange: l(this, m, "f")
121
- }, e("button", {
133
+ }, a("button", {
122
134
  class: "button-tertiary button-icon-only",
123
135
  onClick: l(this, h, "f"),
124
136
  type: "button",
125
137
  "aria-label": l(this, p, "f").showMenuAriaLabel,
126
138
  title: l(this, p, "f").showMenuAriaLabel
127
- }, e("ch-image", {
139
+ }, a("ch-image", {
128
140
  class: "icon-md",
129
- src: v
130
- })), this.copyConversationCallback && e("button", {
141
+ src: _
142
+ })), this.copyConversationCallback && a("button", {
131
143
  class: "button-tertiary button-icon-and-text button-copy-chat",
132
144
  slot: "copy-chat-button",
133
145
  onClick: l(this, u, "f"),
134
146
  type: "button",
135
147
  "aria-label": l(this, p, "f").copyConversationAriaLabel,
136
148
  title: l(this, p, "f").copyConversationAriaLabel
137
- }, e("ch-image", {
149
+ }, a("ch-image", {
138
150
  class: "icon-md",
139
- src: y
140
- }), l(this, p, "f").copyConversationLabel), this.deleteConversationCallback && e("button", {
151
+ src: w
152
+ }), l(this, p, "f").copyConversationLabel), this.deleteConversationCallback && a("button", {
141
153
  class: "button-tertiary button-icon-and-text button-delete-chat",
142
154
  slot: "delete-chat-button",
143
155
  onClick: l(this, f, "f"),
144
156
  type: "button",
145
157
  "aria-label": l(this, p, "f").deleteConversationAriaLabel,
146
158
  title: l(this, p, "f").deleteConversationAriaLabel
147
- }, e("ch-image", {
159
+ }, a("ch-image", {
148
160
  class: "icon-md",
149
- src: b
150
- }), l(this, p, "f").clearConversationLabel))), e("section", {
161
+ src: v
162
+ }), l(this, p, "f").clearConversationLabel))), a("section", {
151
163
  class: "ch-chat-container"
152
- }, e("slot", null), this.displayConversationCopiedMessage && e("div", {
164
+ }, a("slot", null), this.displayConversationCopiedMessage && a("div", {
153
165
  class: "chat-container__conversation-copied"
154
- }, e("div", {
166
+ }, a("div", {
155
167
  class: "chat-container__conversation-copied-wrapper"
156
- }, e("ch-image", {
168
+ }, a("ch-image", {
157
169
  class: "icon-md",
158
- src: w
159
- }), e("p", {
170
+ src: x
171
+ }), a("p", {
160
172
  class: "body-regular-l"
161
173
  }, "conversation copied"))))));
162
174
  }
@@ -164,81 +176,81 @@ const x = class {
164
176
  return [ "gx-ide-assets/chat-container" ];
165
177
  }
166
178
  get el() {
167
- return i(this);
179
+ return s(this);
168
180
  }
169
181
  };
170
182
 
171
183
  d = new WeakMap, p = new WeakMap, h = new WeakMap, m = new WeakMap, u = new WeakMap,
172
184
  f = new WeakMap;
173
185
 
174
- x.style = r;
186
+ k.style = r;
175
187
 
176
- const _ = ":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:44px;font-size:14px;font-style:oblique;cursor:pointer;display:flex;align-items:center;gap:var(--mer-spacing--xs);background-color:#22334a;font-weight:100;max-inline-size:300px}.suggested-prompts__button:hover{background-color:#1a2b42}.suggested-prompts__icon{flex-shrink:0}@keyframes fadeInSuggestedPromptButton{from{opacity:0;transform:translateX(-3px)}to{opacity:1;transform:translateX(0)}}";
188
+ const z = ":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:44px;font-size:14px;font-style:oblique;cursor:pointer;display:flex;align-items:center;gap:var(--mer-spacing--xs);background-color:#22334a;font-weight:100;max-inline-size:300px}.suggested-prompts__button:hover{background-color:#1a2b42}.suggested-prompts__icon{flex-shrink:0}@keyframes fadeInSuggestedPromptButton{from{opacity:0;transform:translateX(-3px)}to{opacity:1;transform:translateX(0)}}";
177
189
 
178
- var k = undefined && undefined.__classPrivateFieldGet || function(t, e, a, i) {
190
+ var T = undefined && undefined.__classPrivateFieldGet || function(t, e, a, i) {
179
191
  if (a === "a" && !i) throw new TypeError("Private accessor was defined without a getter");
180
192
  if (typeof e === "function" ? t !== e || !i : !e.has(t)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
181
193
  return a === "m" ? i : a === "a" ? i.call(t) : i ? i.value : e.get(t);
182
194
  };
183
195
 
184
- var z = undefined && undefined.__classPrivateFieldSet || function(t, e, a, i, s) {
196
+ var W = undefined && undefined.__classPrivateFieldSet || function(t, e, a, i, s) {
185
197
  if (i === "m") throw new TypeError("Private method is not writable");
186
198
  if (i === "a" && !s) throw new TypeError("Private accessor was defined without a setter");
187
199
  if (typeof e === "function" ? t !== e || !s : !e.has(t)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
188
200
  return i === "a" ? s.call(t, a) : s ? s.value = a : e.set(t, a), a;
189
201
  };
190
202
 
191
- var T, W, j, C;
203
+ var j, C, E, M;
192
204
 
193
- const E = s(`./gx-ide-assets/chat-welcome/images/header-illustration.svg`);
205
+ const P = t(`./gx-ide-assets/chat-welcome/images/header-illustration.svg`);
194
206
 
195
- const M = s(`./gx-ide-assets/chat-welcome/images/ai-avatar-welcome.svg`);
207
+ const I = t(`./gx-ide-assets/chat-welcome/images/ai-avatar-welcome.svg`);
196
208
 
197
- const P = 100;
209
+ const $ = 100;
198
210
 
199
- const I = 500;
211
+ const X = 500;
200
212
 
201
- const $ = 200;
213
+ const D = 200;
202
214
 
203
- const X = 500;
215
+ const L = 500;
204
216
 
205
- const D = 100;
217
+ const A = 100;
206
218
 
207
- const L = n({
219
+ const B = n({
208
220
  category: "system",
209
221
  name: "assistant",
210
222
  colorType: "primary"
211
223
  });
212
224
 
213
- const A = n({
225
+ const S = n({
214
226
  category: "system",
215
227
  name: "arrow-right",
216
228
  colorType: "primary"
217
229
  });
218
230
 
219
- const B = [ "resets/box-sizing", "components/chat", "components/icon", "utils/typography" ];
231
+ const U = [ "resets/box-sizing", "components/icon", "utils/typography" ];
220
232
 
221
- const S = class {
222
- constructor(e) {
223
- t(this, e);
233
+ const Y = class {
234
+ constructor(t) {
235
+ e(this, t);
224
236
  // eslint-disable-next-line @stencil-community/own-props-must-be-private
225
- T.set(this, void 0);
226
- W.set(this, (() => {
237
+ j.set(this, void 0);
238
+ C.set(this, (() => {
227
239
  setTimeout((() => {
228
240
  this.showHeader = true;
229
241
  setTimeout((() => {
230
242
  this.showSuggestedPrompts = true;
231
- }), X);
232
- }), P + I);
243
+ }), L);
244
+ }), $ + X);
233
245
  }));
234
- j.set(this, (async t => {
246
+ E.set(this, (async t => {
235
247
  const e = t.currentTarget.dataset["prommpt"];
236
- await k(this, C, "f").call(this);
248
+ await T(this, M, "f").call(this);
237
249
  this.suggestedPrompRequestedCallback(e);
238
250
  }));
239
- C.set(this, (async () => {
251
+ M.set(this, (async () => {
240
252
  this.hideWelcome = true;
241
- await new Promise((t => setTimeout(t, D)));
253
+ await new Promise((t => setTimeout(t, A)));
242
254
  }));
243
255
  this.showHeader = false;
244
256
  this.showSuggestedPrompts = false;
@@ -249,76 +261,76 @@ const S = class {
249
261
  this.suggestedPrompRequestedCallback = undefined;
250
262
  }
251
263
  async componentWillLoad() {
252
- z(this, T, await o.getComponentStrings(this.el), "f");
264
+ W(this, j, await o.getComponentStrings(this.el), "f");
253
265
  // Set defaults
254
266
  if (!this.welcomeTitle) {
255
- this.welcomeTitle = k(this, T, "f").welcomeTitle;
267
+ this.welcomeTitle = T(this, j, "f").welcomeTitle;
256
268
  }
257
269
  if (!this.welcomeGreeting) {
258
- this.welcomeGreeting = k(this, T, "f").welcomeGreeting;
270
+ this.welcomeGreeting = T(this, j, "f").welcomeGreeting;
259
271
  }
260
272
  if (!this.suggestedPrompts) {
261
- this.suggestedPrompts = k(this, T, "f").suggestedPrompts;
273
+ this.suggestedPrompts = T(this, j, "f").suggestedPrompts;
262
274
  }
263
275
  }
264
276
  componentDidRender() {
265
277
  if (!this.hideWelcome) {
266
- k(this, W, "f").call(this);
278
+ T(this, C, "f").call(this);
267
279
  }
268
280
  }
269
281
  /**
270
282
  * It will exit the wellcome screen and remove it from the dom.
271
283
  */ async exitWelcome() {
272
- k(this, C, "f").call(this);
284
+ T(this, M, "f").call(this);
273
285
  }
274
286
  render() {
275
- return e(a, null, e("ch-theme", {
276
- model: B
277
- }), e("div", {
287
+ return a(i, null, a("ch-theme", {
288
+ model: U
289
+ }), a("div", {
278
290
  class: {
279
291
  "welcome-container": true,
280
292
  hidden: this.hideWelcome
281
293
  },
282
294
  style: {
283
- backgroundImage: `url(${E})`,
284
- "--transition-duration": `${D}ms`
295
+ backgroundImage: `url(${P})`,
296
+ "--transition-duration": `${A}ms`
285
297
  }
286
- }, e("header", {
298
+ }, a("header", {
287
299
  class: {
288
300
  header: true,
289
301
  "header--visible": this.showHeader
290
302
  },
291
303
  style: {
292
- "--transition-delay": `${P}ms`,
293
- "--transition-duration": `${I}ms`
304
+ "--transition-delay": `${$}ms`,
305
+ "--transition-duration": `${X}ms`
294
306
  }
295
- }, e("span", {
307
+ }, a("span", {
296
308
  class: "header__circle",
297
309
  style: {
298
- backgroundImage: `url(${M})`
310
+ backgroundImage: `url(${I})`
299
311
  }
300
- }), e("h2", {
312
+ }), a("h2", {
301
313
  class: "header__title"
302
- }, this.welcomeTitle), e("p", {
314
+ }, this.welcomeTitle), a("p", {
303
315
  class: "header__greeting"
304
- }, this.welcomeGreeting)), this.suggestedPrompts && this.showSuggestedPrompts && e("ul", {
316
+ }, this.welcomeGreeting)), this.suggestedPrompts && this.showSuggestedPrompts && a("ul", {
305
317
  class: "suggested-prompts"
306
- }, this.suggestedPrompts.map(((t, a) => e("li", {
318
+ }, this.suggestedPrompts.map(((t, e) => a("li", {
307
319
  class: "suggested-prompts__item"
308
- }, e("button", {
320
+ }, a("button", {
309
321
  class: {
310
322
  "suggested-prompts__button": true
311
323
  },
312
- onClick: k(this, j, "f"),
324
+ onClick: T(this, E, "f"),
313
325
  style: {
314
- "--delay": `${$ * a}ms`
326
+ "--delay": `${D * e}ms`
315
327
  },
316
328
  "data-prommpt": t
317
- }, e("ch-image", {
318
- src: L,
329
+ }, a("ch-image", {
330
+ src: B,
319
331
  class: "icon-md suggested-prompts__icon"
320
- }), t, e("ch-image", {
321
- src: A,
332
+ }), t, a("ch-image", {
333
+ src: S,
322
334
  class: "icon-md suggested-prompts__icon"
323
335
  }))))))));
324
336
  }
@@ -326,13 +338,13 @@ const S = class {
326
338
  return [ "gx-ide-assets/chat-welcome" ];
327
339
  }
328
340
  get el() {
329
- return i(this);
341
+ return s(this);
330
342
  }
331
343
  };
332
344
 
333
- T = new WeakMap, W = new WeakMap, j = new WeakMap, C = new WeakMap;
345
+ j = new WeakMap, C = new WeakMap, E = new WeakMap, M = new WeakMap;
334
346
 
335
- S.style = _;
347
+ Y.style = z;
336
348
 
337
- export { x as gx_ide_chat_container, S as gx_ide_chat_welcome };
338
- //# sourceMappingURL=p-1477d49a.entry.js.map
349
+ export { k as gx_ide_chat_container, Y as gx_ide_chat_welcome };
350
+ //# sourceMappingURL=p-9270c80f.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["chatContainerCss","CHAT_LIT_PATH","getAssetPath","CSS_BUNDLES","CSS_BUNDLE_CHAT_LIT","url","name","COPY_ICON","getIconPath","category","colorType","DELETE_ICON","CONVERSATION_ICON","MORE_HORIZONTAL_ICON","GxIdeChatContainer","_GxIdeChatContainer_menuItems","set","this","type","id","_GxIdeChatContainer_componentLocale","_GxIdeChatContainer_showMenuHandler","menuIsExpanded","_GxIdeChatContainer_menuExpandedChangeHandler","event","detail","_GxIdeChatContainer_copyConversationHandler","copyConversationCallback","_GxIdeChatContainer_deleteConversationHandler","deleteConversationCallback","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","showCopyConversationMessage","displayConversationCopiedMessage","setTimeout","render","renderHeader","chatTitle","renderButtonsGroup","h","Host","class","model","blockAlign","inlineAlign","__classPrivateFieldGet","expanded","onExpandedChange","onClick","showMenuAriaLabel","title","src","slot","copyConversationAriaLabel","copyConversationLabel","deleteConversationAriaLabel","clearConversationLabel","chatWelcomeCss","HEADER_ILLUSTRATION","AI_AVATAR","HEADER_TRANSITION_DELAY","HEADER_TRANSITION_DURATION","SUGGESTED_PROMPT_BUTTON_INTERVAL","SUGGESTED_PROMPT_BUTTONS_DELAY","WELCOME_EXIT_DURATION","AI_ICON","ARROW_RIGHT_ICON","GxIdeChatWelcome","_GxIdeChatWelcome_componentLocale","_GxIdeChatWelcome_animationEntrance","showHeader","showSuggestedPrompts","_GxIdeChatWelcome_sendPromptToChat","async","e","prompt","currentTarget","dataset","_GxIdeChatWelcome_animationExit","call","suggestedPrompRequestedCallback","hideWelcome","Promise","resolve","welcomeTitle","welcomeGreeting","suggestedPrompts","componentDidRender","exitWelcome","hidden","style","backgroundImage","header","map","i"],"sources":["src/components/chat/chat-container/chat-container.scss?tag=gx-ide-chat-container","src/components/chat/chat-container/chat-container.tsx","src/components/chat/chat-welcome/chat-welcome.scss?tag=gx-ide-chat-welcome&encapsulation=shadow","src/components/chat/chat-welcome/chat-welcome.tsx"],"sourcesContent":[".chat-container {\n background-color: var(\n --elevation-background-color,\n --mer-surface__elevation--01\n );\n display: grid;\n block-size: 100%;\n overflow: auto;\n grid-template-rows: 1fr;\n position: relative;\n --chat-common-border-radius: var(--mer-spacing--2xs);\n}\n\n.chat-container.with-header {\n grid-template-rows: max-content 1fr;\n}\n\n.section {\n display: contents;\n}\n\n.header {\n padding: var(--mer-spacing--2xs) var(--mer-spacing--2xs)\n var(--mer-spacing--2xs) var(--mer-spacing--sm);\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--mer-spacing--sm);\n color: var(--mer-text__bright);\n border-block-end: var(--mer-border__width--sm) solid\n var(--color-border-surface-on-elevation-01, #333d47);\n\n .button-copy-chat,\n .button-delete-chat {\n --control__border-color: transparent !important;\n }\n\n .button-delete-chat {\n &:hover {\n filter: brightness(1.3);\n }\n &:active {\n filter: brightness(0.8);\n }\n }\n}\n\n.ch-chat-container {\n overflow: auto;\n position: relative;\n display: grid;\n}\n\n// - - - - - - - - - - - - - -\n// other\n// - - - - - - - - - - - - - -\n\n.chat-container__conversation-copied {\n position: absolute;\n z-index: 1;\n inline-size: 100%;\n block-size: 100%;\n background: rgba(22, 22, 23, 0.75);\n backdrop-filter: saturate(180%) blur(20px);\n display: grid;\n align-items: center;\n justify-content: center;\n text-align: center;\n padding: 32px;\n --mer-icon__box--md: 18px;\n pointer-events: none;\n overflow: hidden;\n animation: fadeIn 100ms ease-in-out forwards;\n opacity: 0;\n}\n\n.chat-container__conversation-copied-wrapper {\n display: flex;\n align-items: center;\n gap: var(--mer-spacing--sm);\n position: relative;\n inset-block-start: 4px;\n opacity: 0;\n animation: liftUp var(--mer-timing--fast) ease-in-out forwards;\n animation-delay: var(--mer-timing--fast);\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes liftUp {\n from {\n opacity: 0;\n inset-block-start: 4px;\n }\n to {\n opacity: 1;\n inset-block-start: 0;\n }\n}\n\n// The following styles shoul be moved over to Mercury\n\n.chat::part(code-block-header__copy) {\n --copy-text-opacity: 0;\n --copy-text-translate-x: 6px;\n opacity: var(--copy-text-opacity);\n pointer-events: none;\n transform: translateX(var(--copy-text-translate-x));\n transition:\n opacity 100ms ease-in-out,\n transform 100ms ease-in-out;\n font-size: 12px;\n}\n.chat::part(code-block-header__copy-copied) {\n --copy-button-pointer-events: none !important;\n --copy-text-opacity: 1;\n --copy-text-translate-x: 0;\n}\n.chat::part(code-block-header) {\n align-items: center;\n display: flex;\n gap: 8px;\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Method,\n State,\n getAssetPath\n} from \"@stencil/core\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\nimport { ActionMenuModel } from \"@genexus/chameleon-controls-library\";\n\nimport { Locale } from \"../../../common/locale\";\nimport { ThemeItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/theme/theme-types\";\n\n// TODO: Remove this once update chat bundle for lit is ready\n// on a new Mercury version\nconst CHAT_LIT_PATH = getAssetPath(\n `./gx-ide-assets/chat-container/chat-lit.css`\n);\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"utils/typography\",\n \"chameleon/scrollbar\",\n \"components/button\",\n \"components/dropdown\",\n \"components/icon\",\n \"utils/elevation\"\n];\nconst CSS_BUNDLE_CHAT_LIT: ThemeItemModel = {\n // styleSheet: chatListCss,\n url: CHAT_LIT_PATH,\n name: \"components/chat-lit\"\n};\n\nconst COPY_ICON = getIconPath({\n category: \"system\",\n name: \"copy\",\n colorType: \"primary\"\n});\nconst DELETE_ICON = getIconPath({\n category: \"system\",\n name: \"delete-outlined\",\n colorType: \"primary\"\n});\nconst CONVERSATION_ICON = getIconPath({\n category: \"objects\",\n name: \"conversational-flows\"\n});\nconst MORE_HORIZONTAL_ICON = getIconPath({\n category: \"system\",\n name: \"more-horizontal\",\n colorType: \"neutral\"\n});\n\n@Component({\n tag: \"gx-ide-chat-container\",\n styleUrl: \"chat-container.scss\",\n shadow: false,\n assetsDirs: [\"gx-ide-assets/chat-container\"]\n})\nexport class GxIdeChatContainer {\n #menuItems: ActionMenuModel = [\n { type: \"slot\", id: \"delete-chat-button\" },\n { type: \"slot\", id: \"copy-chat-button\" }\n ];\n\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 @Element() el: HTMLGxIdeChatContainerElement;\n\n /**\n * Coneration Copied\n */\n @State() displayConversationCopiedMessage: boolean = false;\n\n /**\n * Displays or hides the menu\n */\n @State() menuIsExpanded: boolean = false;\n\n /**\n * The chat title\n */\n @Prop() readonly chatTitle?: string;\n\n /**\n * If true a button for copying the conversation will be render on the header\n */\n @Prop() readonly copyConversationCallback: () => void;\n\n /**\n * If true a button for deleting the conversation will be render on the header\n */\n @Prop() readonly deleteConversationCallback: () => void;\n\n /**\n * If true a the welcome screen will be rendered\n */\n @Prop() readonly displayWelcomeScreen: boolean = false;\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n }\n\n /**\n * It will display a feedback message that the conversation has been copied\n */\n @Method()\n async showCopyConversationMessage() {\n this.displayConversationCopiedMessage = true;\n setTimeout(() => {\n this.displayConversationCopiedMessage = false;\n }, 2000);\n }\n\n #showMenuHandler = () => {\n this.menuIsExpanded = true;\n };\n\n #menuExpandedChangeHandler = (event: CustomEvent<boolean>) => {\n this.menuIsExpanded = event.detail;\n };\n\n #copyConversationHandler = () => {\n if (this.copyConversationCallback) {\n this.copyConversationCallback();\n this.menuIsExpanded = false;\n }\n };\n #deleteConversationHandler = () => {\n if (this.deleteConversationCallback) {\n this.deleteConversationCallback();\n this.menuIsExpanded = false;\n }\n };\n\n render() {\n const renderHeader =\n this.chatTitle ||\n this.copyConversationCallback ||\n this.deleteConversationCallback;\n\n const renderButtonsGroup =\n this.copyConversationCallback || this.deleteConversationCallback;\n return (\n <Host\n class={{\n \"chat-container\": true,\n \"with-header\": !!renderHeader\n }}\n >\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <ch-theme model={CSS_BUNDLE_CHAT_LIT}></ch-theme>\n <section class=\"section\">\n {renderHeader && (\n <header class=\"header tiny-semi-bold-l\">\n {this.chatTitle && this.chatTitle}\n {renderButtonsGroup && (\n <ch-action-menu-render\n class=\"dropdown\"\n blockAlign=\"inside-start\"\n inlineAlign=\"inside-end\"\n model={this.#menuItems}\n expanded={this.menuIsExpanded}\n onExpandedChange={this.#menuExpandedChangeHandler}\n >\n <button\n class=\"button-tertiary button-icon-only\"\n onClick={this.#showMenuHandler}\n type=\"button\"\n aria-label={this.#componentLocale.showMenuAriaLabel}\n title={this.#componentLocale.showMenuAriaLabel}\n >\n <ch-image\n class=\"icon-md\"\n src={MORE_HORIZONTAL_ICON}\n ></ch-image>\n </button>\n {this.copyConversationCallback && (\n <button\n class=\"button-tertiary button-icon-and-text button-copy-chat\"\n slot=\"copy-chat-button\"\n onClick={this.#copyConversationHandler}\n type=\"button\"\n aria-label={\n this.#componentLocale.copyConversationAriaLabel\n }\n title={this.#componentLocale.copyConversationAriaLabel}\n >\n <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n {this.#componentLocale.copyConversationLabel}\n </button>\n )}\n {this.deleteConversationCallback && (\n <button\n class=\"button-tertiary button-icon-and-text button-delete-chat\"\n slot=\"delete-chat-button\"\n onClick={this.#deleteConversationHandler}\n type=\"button\"\n aria-label={\n this.#componentLocale.deleteConversationAriaLabel\n }\n title={this.#componentLocale.deleteConversationAriaLabel}\n >\n <ch-image class=\"icon-md\" src={DELETE_ICON}></ch-image>\n {this.#componentLocale.clearConversationLabel}\n </button>\n )}\n </ch-action-menu-render>\n )}\n </header>\n )}\n <section class=\"ch-chat-container\">\n <slot></slot>\n {this.displayConversationCopiedMessage && (\n <div class=\"chat-container__conversation-copied\">\n <div class=\"chat-container__conversation-copied-wrapper\">\n <ch-image class=\"icon-md\" src={CONVERSATION_ICON}></ch-image>\n <p class=\"body-regular-l\">conversation copied</p>\n </div>\n </div>\n )}\n </section>\n {/* <footer class=\"footer elevation-1\">footer</footer> */}\n </section>\n </Host>\n );\n }\n}\n",":host {\n block-size: 100%;\n}\n\n$sharedPadding: var(--mer-spacing--md);\n\n.welcome-container {\n --opacity: 1;\n --translate-y: 0;\n opacity: var(--opacity);\n transform: translateY(var(--translate-y));\n transition: all var(--transition-duration);\n display: flex;\n block-size: 100%;\n grid-template-rows: max-content max-content;\n flex-direction: column;\n justify-content: space-between;\n background-repeat: no-repeat;\n background-size: cover;\n background-size: contain;\n\n &.hidden {\n --opacity: 0;\n --translate-y: 4px;\n }\n}\n\n%absolute-centered {\n position: absolute;\n inset-inline-start: 50%;\n inset-block-start: 50%;\n transform: translate(-50%, -50%);\n}\n\n.header {\n --opacity: 0;\n --translate-y: 3px;\n transition: all var(--transition-duration) var(--transition-delay)\n cubic-bezier(0.4, 0, 0.2, 1);\n transform: translateY(var(--translate-y));\n opacity: var(--opacity);\n display: flex;\n flex-direction: column;\n gap: var(--mer-spacing--md);\n align-items: center;\n padding: $sharedPadding;\n\n &--visible {\n --opacity: 1;\n --translate-y: 0;\n }\n\n &__circle {\n $circleSize: 55px;\n inline-size: $circleSize;\n block-size: $circleSize;\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center center;\n margin-block-end: -6px;\n }\n\n &__title {\n display: grid;\n text-align: center;\n margin: 0;\n text-align: center;\n white-space: pre-line;\n line-height: 1.3;\n font-weight: 600;\n font-size: var(--font-size-header-h3);\n }\n\n &__greeting {\n line-height: 1.4;\n text-align: center;\n font-weight: 300;\n }\n}\n\n.suggested-prompts {\n --opacity: 1;\n opacity: var(--opacity);\n transition: opacity var(--transition-duration);\n display: flex;\n flex-direction: column;\n gap: var(--mer-spacing--md);\n list-style: none;\n margin: 0;\n padding: $sharedPadding;\n\n &.hidden {\n --opacity: 0;\n }\n\n &__item {\n }\n\n &__button {\n opacity: 0;\n transform: translateX(-3px);\n animation: fadeInSuggestedPromptButton var(--mer-timing--regular) ease\n forwards;\n animation-delay: var(--delay, 0s);\n\n border: 0;\n padding: var(--mer-spacing--sm);\n border-radius: 44px; // Works with up to a a four lines button\n font-size: 14px; // TODO : Use a token when available\n font-style: oblique;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: var(--mer-spacing--xs);\n background-color: #22334a; // TODO : Use a token when available\n font-weight: 100;\n max-inline-size: 300px;\n\n &:hover {\n background-color: #1a2b42;\n }\n }\n\n &__icon {\n flex-shrink: 0;\n }\n}\n\n@keyframes fadeInSuggestedPromptButton {\n from {\n opacity: 0;\n transform: translateX(-3px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n","/* 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 { 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 = [\n \"resets/box-sizing\",\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\n src={AI_ICON}\n class=\"icon-md suggested-prompts__icon\"\n ></ch-image>\n {prompt}\n <ch-image\n src={ARROW_RIGHT_ICON}\n class=\"icon-md suggested-prompts__icon\"\n ></ch-image>\n </button>\n </li>\n ))}\n </ul>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":";;;;;;AAAA,MAAMA,IAAmB;;;;;;;;;;;;;;;;;;2BCkBzB;MAAMC,IAAgBC,EACpB;;AAGF,MAAMC,IAA8B,EAClC,qBACA,oBACA,uBACA,qBACA,uBACA,mBACA;;AAEF,MAAMC,IAAsC;;EAE1CC,KAAKJ;EACLK,MAAM;;;AAGR,MAAMC,IAAYC,EAAY;EAC5BC,UAAU;EACVH,MAAM;EACNI,WAAW;;;AAEb,MAAMC,IAAcH,EAAY;EAC9BC,UAAU;EACVH,MAAM;EACNI,WAAW;;;AAEb,MAAME,IAAoBJ,EAAY;EACpCC,UAAU;EACVH,MAAM;;;AAER,MAAMO,IAAuBL,EAAY;EACvCC,UAAU;EACVH,MAAM;EACNI,WAAW;;;MASAI,IAAkB;;;IAC7BC,EAAAC,IAAAC,MAA8B,EAC5B;MAAEC,MAAM;MAAQC,IAAI;OACpB;MAAED,MAAM;MAAQC,IAAI;;;;;;QAOtBC,EAAAJ,IAAAC,WAAA;IAiDAI,EAAAL,IAAAC,OAAmB;MACjBA,KAAKK,iBAAiB;AAAI;IAG5BC,EAAAP,IAAAC,OAA8BO;MAC5BP,KAAKK,iBAAiBE,EAAMC;AAAM;IAGpCC,EAAAV,IAAAC,OAA2B;MACzB,IAAIA,KAAKU,0BAA0B;QACjCV,KAAKU;QACLV,KAAKK,iBAAiB;;;IAG1BM,EAAAZ,IAAAC,OAA6B;MAC3B,IAAIA,KAAKY,4BAA4B;QACnCZ,KAAKY;QACLZ,KAAKK,iBAAiB;;;4CA3D2B;0BAKlB;;;;gCAoBc;;EAEjD,uBAAMQ;IACJC,EAAAd,MAAIG,SAA0BY,EAAOC,oBAAoBhB,KAAKiB,KAAG;;;;SAOnE,iCAAMC;IACJlB,KAAKmB,mCAAmC;IACxCC,YAAW;MACTpB,KAAKmB,mCAAmC;AAAK,QAC5C;;EAwBL,MAAAE;IACE,MAAMC,IACJtB,KAAKuB,aACLvB,KAAKU,4BACLV,KAAKY;IAEP,MAAMY,IACJxB,KAAKU,4BAA4BV,KAAKY;IACxC,OACEa,EAACC,GAAI;MACHC,OAAO;QACL,kBAAkB;QAClB,iBAAiBL;;OAGnBG,EAAA;MAAUG,OAAO1C;QACjBuC,EAAA;MAAUG,OAAOzC;QACjBsC,EAAA;MAASE,OAAM;OACZL,KACCG,EAAA;MAAQE,OAAM;OACX3B,KAAKuB,aAAavB,KAAKuB,WACvBC,KACCC,EAAA;MACEE,OAAM;MACNE,YAAW;MACXC,aAAY;MACZF,OAAOG,EAAA/B,MAAIF,GAAA;MACXkC,UAAUhC,KAAKK;MACf4B,kBAAkBF,EAAA/B,MAAIM,GAAA;OAEtBmB,EAAA;MACEE,OAAM;MACNO,SAASH,EAAA/B,MAAII,GAAA;MACbH,MAAK;MAAQ,cACD8B,EAAA/B,MAAIG,GAAA,KAAkBgC;MAClCC,OAAOL,EAAA/B,MAAIG,GAAA,KAAkBgC;OAE7BV,EAAA;MACEE,OAAM;MACNU,KAAKzC;SAGRI,KAAKU,4BACJe,EAAA;MACEE,OAAM;MACNW,MAAK;MACLJ,SAASH,EAAA/B,MAAIS,GAAA;MACbR,MAAK;MAAQ,cAEX8B,EAAA/B,MAAIG,GAAA,KAAkBoC;MAExBH,OAAOL,EAAA/B,MAAIG,GAAA,KAAkBoC;OAE7Bd,EAAA;MAAUE,OAAM;MAAUU,KAAK/C;QAC9ByC,EAAA/B,MAAIG,GAAA,KAAkBqC,wBAG1BxC,KAAKY,8BACJa,EAAA;MACEE,OAAM;MACNW,MAAK;MACLJ,SAASH,EAAA/B,MAAIW,GAAA;MACbV,MAAK;MAAQ,cAEX8B,EAAA/B,MAAIG,GAAA,KAAkBsC;MAExBL,OAAOL,EAAA/B,MAAIG,GAAA,KAAkBsC;OAE7BhB,EAAA;MAAUE,OAAM;MAAUU,KAAK3C;QAC9BqC,EAAA/B,MAAIG,GAAA,KAAkBuC,2BAOnCjB,EAAA;MAASE,OAAM;OACbF,EAAA,eACCzB,KAAKmB,oCACJM,EAAA;MAAKE,OAAM;OACTF,EAAA;MAAKE,OAAM;OACTF,EAAA;MAAUE,OAAM;MAAUU,KAAK1C;QAC/B8B,EAAA;MAAGE,OAAM;OAAgB;;;;;;;;;;;;;;;ACjO3C,MAAMgB,IAAiB;;;;;;;;;;;;;;;;;ACevB,MAAMC,IAAsB3D,EAC1B;;AAEF,MAAM4D,IAAY5D,EAChB;;AAGF,MAAM6D,IAAkC;;AACxC,MAAMC,IAAqC;;AAC3C,MAAMC,IAA2C;;AACjD,MAAMC,IAAyC;;AAC/C,MAAMC,IAAgC;;AAEtC,MAAMC,IAAU5D,EAAY;EAC1BC,UAAU;EACVH,MAAM;EACNI,WAAW;;;AAEb,MAAM2D,IAAmB7D,EAAY;EACnCC,UAAU;EACVH,MAAM;EACNI,WAAW;;;AAGb,MAAMP,IAAc,EAClB,qBACA,mBACA;;MASWmE,IAAgB;;;;QAE3BC,EAAAvD,IAAAC,WAAA;IAsEAuD,EAAAxD,IAAAC,OAAqB;MACnBoB,YAAW;QACTpB,KAAKwD,aAAa;QAClBpC,YAAW;UACTpB,KAAKyD,uBAAuB;AAAI,YAC/BR;AAA+B,UACjCH,IAA0BC;AAA2B;IAG1DW,EAAA3D,IAAAC,OAAoB2D,MAAOC;MACzB,MAAMC,IAAUD,EAAEE,cAAoCC,QAAQ;YACxDhC,EAAA/B,MAAIgE,GAAA,KAAeC,KAAnBjE;MACNA,KAAKkE,gCAAgCL;AAAO;IAG9CG,EAAAjE,IAAAC,OAAiB2D;MACf3D,KAAKmE,cAAc;YACb,IAAIC,SAAQC,KAAWjD,WAAWiD,GAASnB;AAAuB;sBAhF3C;gCAKU;uBAKT;;;;;;EAwBhC,uBAAMrC;IACJC,EAAAd,MAAIsD,SAA0BvC,EAAOC,oBAAoBhB,KAAKiB,KAAG;;QAGjE,KAAKjB,KAAKsE,cAAc;MACtBtE,KAAKsE,eAAevC,EAAA/B,MAAIsD,GAAA,KAAkBgB;;IAE5C,KAAKtE,KAAKuE,iBAAiB;MACzBvE,KAAKuE,kBAAkBxC,EAAA/B,MAAIsD,GAAA,KAAkBiB;;IAE/C,KAAKvE,KAAKwE,kBAAkB;MAC1BxE,KAAKwE,mBAAmBzC,EAAA/B,MAAIsD,GAAA,KAAkBkB;;;EAIlD,kBAAAC;IACE,KAAKzE,KAAKmE,aAAa;MACrBpC,EAAA/B,MAAIuD,GAAA,KAAmBU,KAAvBjE;;;;;SAQJ,iBAAM0E;IACJ3C,EAAA/B,MAAIgE,GAAA,KAAeC,KAAnBjE;;EAuBF,MAAAqB;IACE,OACEI,EAACC,GAAI,MACHD,EAAA;MAAUG,OAAO1C;QACjBuC,EAAA;MACEE,OAAO;QAAE,qBAAqB;QAAMgD,QAAU3E,KAAKmE;;MACnDS,OAAO;QACLC,iBAAmB,OAAOjC;QAC1B,yBAAyB,GAAGM;;OAG9BzB,EAAA;MACEE,OAAO;QAAEmD,QAAU;QAAM,mBAAmB9E,KAAKwD;;MACjDoB,OAAO;QACL,sBAAsB,GAAG9B;QACzB,yBAAyB,GAAGC;;OAG9BtB,EAAA;MACEE,OAAM;MACNiD,OAAO;QAAEC,iBAAiB,OAAOhC;;QAEnCpB,EAAA;MAAIE,OAAM;OAAiB3B,KAAKsE,eAChC7C,EAAA;MAAGE,OAAM;OAAoB3B,KAAKuE,mBAGnCvE,KAAKwE,oBAAoBxE,KAAKyD,wBAC7BhC,EAAA;MAAIE,OAAM;OACP3B,KAAKwE,iBAAiBO,KAAI,CAAClB,GAAQmB,MAClCvD,EAAA;MAAIE,OAAM;OACRF,EAAA;MACEE,OAAO;QACL,6BAA6B;;MAE/BO,SAASH,EAAA/B,MAAI0D,GAAA;MACbkB,OAAO;QACL,WAAW,GAAG5B,IAAmCgC;;MAClD,gBACanB;OAEdpC,EAAA;MACEY,KAAKc;MACLxB,OAAM;QAEPkC,GACDpC,EAAA;MACEY,KAAKe;MACLzB,OAAM"}