@genexus/genexus-ide-ui 1.1.55 → 1.1.57

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

@@ -0,0 +1 @@
+{"version":3,"names":["getMessageSerializedContentAll","message","content","JSON","stringify","undefined","getMessageContent","tokenMap","tokens","keys","Object","result","index","length","tokenKey","tokenValue","copyToTheClipboard","text","navigator","clipboard","writeText","copyButtonClickHandler","event","button","currentTarget","buttonOriginalParts","getAttribute","buttonWithCopyingParts","setAttribute","setTimeout","removeAttribute","DEFAULT_ASSISTANT_STATUS","copyClickHandler","messageSerializedContentAll","customActionsRender","chatRef","accessibleName","translations","conditionToRender1","role","status","conditionToRender2","when","html","copyMessageContent","id","parts","e","downloadCodeBlockCallback","plainText","language","downloadCodeBlock","customCodeBlockRender","options","downloadCb","callbacks","copyCodeButton","downloadCodeButton","lastNestedChildClass","showIndicator","DEFAULT_FILE_UPLOAD_STATE","fileFooter","file","fileFormat","mimeType","uploadState","extension","caption","toLowerCase","nothing","getFileContainerParts","getFileParts","customFileRenders","audio","ifDefined","url","video","image","alternativeText","disabledWhileUploading","messageHeader","messageMetaData","waiting","agentName","assistantId","replace","messageTime","time","customAssistantContentRender","codeBlockRender","messageContent","metadata","markdownTheme","customErrorContentRender","errorContent","defaultSystemContentRender","defaultUserContentRender","messageModel","contentRenderByRole","assistant","error","system","user","customContentRender","renderItem","actions","codeBlock","sendContainerLayout","sendInputAfter","sendContainerAfter","ASSISTANT_RESPONSE_SHORT_MARKDOWN","ASSISTANT_NAME","ASSISTANT_RESPONSE_MARKDOWN","Array","from","_","codeFixerRecord","PROCESSING_PLACEHOLDER","sendChatMessages","waitingResponse","addNewMessage","Date","getTime","updateLastMessage","dummyStreaming","stopResponseAnswer","console","log","Promise","resolve","chatCallbacksWithChatRef","chChatRef","uploadFile","stopResponse","counter","stringToDisplay","mode","streamingCompleted","substring","chatTranslations","clearChat","sendButton","sendInput","stopResponseButton","placeholder","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","includes","userPrompt","exitWelcome","componentDidLoad","assistantStatus","componentDidRender","__classPrivateFieldSet","componentWillLoad","chatItems","render","h","Host","model","chatTitle","copyConversationCallback","deleteConversationCallback","ref","el","class","generatingResponse","loadingState","mercuryChatRenderItem","items","showAdditionalContent","mercurySendContainerLayout","slot","suggestedPrompRequestedCallback"],"sources":["node_modules/@genexus/mercury/dist/components/chat/utils.js","node_modules/@genexus/mercury/dist/components/chat/actions.lit.js","node_modules/@genexus/mercury/dist/components/chat/code-block.lit.js","node_modules/@genexus/mercury/dist/components/chat/file.lit.js","node_modules/@genexus/mercury/dist/components/chat/render.lit.js","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":["// TODO: The functions on this file are a WA until Chameleon 7 is released and we can reuse\n// the existing functions from Chameleon. At the moment, we have to copy paste the functions\n// because in Chameleon 6 we can import them.\n// The following utils were copied from Chamelmeon (src/components/chat/utils.ts or src/common/utils.ts)\nexport const getMessageSerializedContentAll = (message) => typeof message.content === \"string\"\n    ? message.content\n    : JSON.stringify(message.content, undefined, 2);\nexport const getMessageContent = (message) => typeof message.content === \"string\"\n    ? message.content\n    : message.content.message;\n/**\n * Converts an object mapping token keys to booleans into a space-separated\n * string containing the token keys that map to truthy values.\n * @example\n *   part={tokenMap({\n *     header: true,\n *     disabled: this.disabled,\n *     selected: this.selected,\n *     [levelPart]: canShowLines,\n *     \"expand-button\":\n *       canShowLines && !this.leaf && this.expandableButton !== \"no\"\n *   })}\n */\nexport const tokenMap = (tokens) => {\n    const keys = Object.keys(tokens);\n    let result = \"\";\n    for (let index = 0; index < keys.length; index++) {\n        const tokenKey = keys[index];\n        const tokenValue = tokens[tokenKey];\n        if (tokenValue) {\n            result += result === \"\" ? tokenKey : ` ${tokenKey}`;\n        }\n    }\n    return result;\n};\nexport const copyToTheClipboard = (text) => navigator.clipboard.writeText(text);\nexport const copy = (text) => () => {\n    copyToTheClipboard(text);\n};\nexport const copyButtonClickHandler = (event, text) => {\n    copyToTheClipboard(text);\n    const button = event.currentTarget;\n    if (button) {\n        const buttonOriginalParts = button.getAttribute(\"part\");\n        const buttonWithCopyingParts = `${buttonOriginalParts} copying`;\n        button.setAttribute(\"disabled\", \"disabled\");\n        button.setAttribute(\"part\", buttonWithCopyingParts);\n        setTimeout(() => {\n            button.removeAttribute(\"disabled\");\n            button.setAttribute(\"part\", buttonOriginalParts || \"\");\n        }, 1500);\n    }\n};\nexport const DEFAULT_ASSISTANT_STATUS = \"complete\";\n","import { html } from \"lit\";\nimport { when } from \"lit/directives/when.js\";\nimport { copyButtonClickHandler, getMessageSerializedContentAll, tokenMap } from \"./utils.js\";\nconst copyClickHandler = (event, message) => {\n    // We use the whole message to support copying the files and/or sources\n    const messageSerializedContentAll = getMessageSerializedContentAll(message);\n    copyButtonClickHandler(event, messageSerializedContentAll);\n};\nexport const customActionsRender = (message, chatRef) => {\n    const { accessibleName } = chatRef.translations;\n    const conditionToRender1 = message.role === \"assistant\" &&\n        (message.status === \"complete\" || !message.status);\n    const conditionToRender2 = message.role === \"error\";\n    return when(conditionToRender1 || conditionToRender2, () => html `<div part=\"actions-container\"><button aria-label=\"${accessibleName.copyMessageContent}\" part=\"${tokenMap({\n        [`action-button action-copy-message ${message.id}`]: true,\n        ...(message.parts ? { [message.parts]: true } : {})\n    })}\" type=\"button\" @click=\"${(e) => copyClickHandler(e, message)}\"></button></div>`);\n};\n","import { html } from \"lit\";\nimport { when } from \"lit/directives/when.js\";\nimport { copyButtonClickHandler } from \"./utils.js\";\nconst downloadCodeBlockCallback = (plainText, language, downloadCodeBlock) => () => downloadCodeBlock(plainText, language);\nexport const customCodeBlockRender = (chatRef) => (options) => {\n    const { accessibleName, text } = chatRef.translations;\n    const downloadCb = chatRef.callbacks?.downloadCodeBlock;\n    return html `<div part=\"code-block\"><div part=\"code-block__header\"><span part=\"code-block__header-caption\">${options.language}</span><div part=\"code-block__header-actions\"><button class=\"button-copy-code\" aria-label=\"${text.copyCodeButton}\" part=\"code-block__button--icon-only code-block__copy-code-button\" type=\"button\" @click=\"${(e) => copyButtonClickHandler(e, options.plainText)}\"></button> ${when(downloadCb, () => html `<button aria-label=\"${accessibleName.downloadCodeButton}\" part=\"code-block__button--icon-only code-block__download-code-button\" @click=\"${downloadCodeBlockCallback(options.plainText, options.language, downloadCb)}\"></button>`)}</div></div><ch-code .language=\"${options.language}\" .lastNestedChildClass=\"${options.lastNestedChildClass}\" part=\"code-block__content\" .showIndicator=\"${options.showIndicator}\" .value=\"${options.plainText}\"></ch-code></div>`;\n};\n","import { html, nothing } from \"lit\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport \"./mer-spinner.lit.js\";\nimport { tokenMap } from \"./utils.js\";\nconst DEFAULT_FILE_UPLOAD_STATE = \"uploaded\";\n// /**\n//  * Returns a skeleton element shown while a file is being uploaded.\n//  *\n//  * In Mercury, the loading state is visually represented in the footer,\n//  * so this skeleton is currently unused. However, it is recommended to keep\n//  * this function in the file in case the design changes and a visual loader\n//  * inside the file container becomes necessary again.\n//  *\n//  * @param file - The file object containing metadata and upload state.\n//  * @param fileFormat - The format type of the file (e.g., text, image, etc.).\n//  * @returns A TemplateResult with the skeleton element or `nothing` if not loading.\n//  */\n// const fileSkeleton = (\n//   file: ChatMessageFile,\n//   fileFormat: keyof ChMimeTypeFormatMap\n// ): TemplateResult | typeof nothing => {\n//   return file.uploadState === \"in-progress\"\n//     ? html`<div\n//         part=${tokenMap({\n//           [`file-skeleton format-${fileFormat} ${file.mimeType} ${\n//             file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE\n//           }`]: true,\n//           [file.extension!]: !!file.extension,\n//           [file.parts!]: !!file.parts\n//         })}\n//       ></div>`\n//     : nothing;\n// };\nconst fileFooter = (file, fileFormat) => {\n    return html `<div class=\"elevation-1\" part=\"${tokenMap({\n        [`file-footer format-${fileFormat} ${file.mimeType} ${file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE}`]: true,\n        [file.extension]: !!file.extension,\n        [file.parts]: !!file.parts\n    })}\"><span class=\"body-regular-xs\" part=\"file-caption\">${file.caption}${file.extension && \".\" + file.extension.toLowerCase()} </span>${file.uploadState === \"in-progress\"\n        ? html `<mer-spinner></mer-spinner>`\n        : nothing}</div>`;\n};\nconst getFileContainerParts = (file, fileFormat) => {\n    return tokenMap({\n        [`file-container format-${fileFormat} ${file.mimeType} ${file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE}`]: true,\n        [file.extension]: !!file.extension,\n        [file.parts]: !!file.parts\n    });\n};\nconst getFileParts = (file, fileFormat) => tokenMap({\n    [`file format-${fileFormat} ${file.mimeType} ${file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE}`]: true,\n    [file.extension]: !!file.extension,\n    [file.parts]: !!file.parts\n});\n// TODO: Improve accessibility by exposing progress or spin states while\n// uploading\nexport const customFileRenders = {\n    audio: (file) => {\n        return html `<li class=\"file-container\" part=\"${getFileContainerParts(file, \"audio\")}\"><audio aria-label=\"${ifDefined(file.accessibleName)}\" part=\"${getFileParts(file, \"audio\")}\" src=\"${ifDefined(file.uploadState === \"in-progress\" ? undefined : file.url)}\" controls></audio>${fileFooter(file, \"audio\")}</li>`;\n    },\n    video: (file) => {\n        return html `<li class=\"file-container\" part=\"${getFileContainerParts(file, \"video\")}\"><video aria-label=\"${ifDefined(file.accessibleName)}\" part=\"${getFileParts(file, \"video\")}\" src=\"${ifDefined(file.uploadState === \"in-progress\" ? undefined : file.url)}\" controls></video>${fileFooter(file, \"video\")}</li>`;\n    },\n    image: (file) => {\n        return html `<li class=\"file-container\" part=\"${getFileContainerParts(file, \"image\")}\"><img aria-label=\"${ifDefined(file.accessibleName)}\" part=\"${getFileParts(file, \"image\")}\" src=\"${file.url}\" alt=\"${file.alternativeText ?? file.accessibleName ?? \"\"}\" loading=\"lazy\"> ${fileFooter(file, \"image\")}</li>`;\n    },\n    file: (file) => {\n        const disabledWhileUploading = file.uploadState === \"in-progress\";\n        return html `<li class=\"file-container\" part=\"${getFileContainerParts(file, \"file\")}\"><a aria-label=\"${ifDefined(file.accessibleName)}\" role=\"${disabledWhileUploading ? \"link\" : nothing}\" aria-disabled=\"${disabledWhileUploading ? \"true\" : nothing}\" part=\"${getFileParts(file, \"file\")}\" href=\"${disabledWhileUploading ? nothing : file.url}\" target=\"_blank\"></a> ${fileFooter(file, \"file\")}</li>`;\n    }\n};\n","/*\nREADME:\nThis file contains two utilities:\n\n1) [Sections for customitizing the ch-chat renderItem]\nThe following sections are being customized at the time of writting:\n- actions: customActionsRender,\n- codeBlock: customCodeBlockRender,\n- content: customContentRender\n\nWhat for?\n\n- actions: In order to be able to customize the copy button, by adding a part\n\"copying\" when the user copies the message. This additional part allows changing\nthe current button icon of \"copy\" to a \"checked\" icon.\n- codeBlock: Same reason as \"actions\" section.\n- content: Mercury includes a \"header\" section for the assistant message. This\nheader includes an avatar, the assistant name, and optionally the message time.\nThis header requires custom markup, and for this reason this section has to be\ncustomized.\n\n2) [Configuration for the ch-chat sendContainerLayout property]\nThe chat styles are designed for a specific layout, so users must use the sendContainerLayout provided by Mercury. Customizing it is not supported.\n*/\nimport { html, nothing } from \"lit\";\n// Side effect to define the animation for \"waiting\" messages.\nimport { customActionsRender } from \"./actions.lit.js\";\nimport { customCodeBlockRender } from \"./code-block.lit.js\";\nimport { customFileRenders } from \"./file.lit.js\";\nimport { DEFAULT_ASSISTANT_STATUS, getMessageContent, tokenMap } from \"./utils.js\";\nimport \"./mer-animated-dots.js\";\n// 1) [Sections for customitizing the ch-chat renderItem.]\n/**\n * Mercury section that includes the assistant the assistant name, and an optional message time.\n *\n * @param messageMetaData - Metadata containing agentName and time\n * @returns TemplateResult rendering the assistant message header\n */\nconst messageHeader = (messageMetaData, waiting = false) => {\n    const agentName = messageMetaData?.agentName;\n    const assistantId = agentName?.toLowerCase().replace(/ /g, \"-\");\n    const messageTime = messageMetaData?.time;\n    return html `<div part=\"header assistant${assistantId ? ` header-${assistantId}` : \"\"}\"><div part=\"header__start assistant\"><div part=\"header__avatar-container assistant\"><div part=\"header__avatar-border assistant\"></div><div part=\"header__avatar-image assistant\"></div></div><div part=\"header__role assistant\">${agentName}</div>${waiting ? html `<mer-animated-dots></mer-animated-dots>` : nothing}</div>${messageTime\n        ? html `<time datetime=\"${messageTime}\" part=\"header__time assistant\">${messageTime}</time>`\n        : nothing}</div>`;\n};\n// customzied in order to add the custom \"messageHeader\"\nconst customAssistantContentRender = (message, chatRef, codeBlockRender) => {\n    const messageContent = getMessageContent(message);\n    return message.status === \"waiting\"\n        ? html `${messageHeader(message.metadata, true)}<div class=\"assistant-loading\" part=\"${tokenMap({\n            [`assistant content waiting ${message.id}`]: true,\n            ...(message.parts ? { [message.parts]: true } : {})\n        })}\">${messageContent}</div>`\n        : html `${messageHeader(message.metadata)}<ch-markdown-viewer part=\"${tokenMap({\n            [`assistant content ${message.id} ${message.status ?? DEFAULT_ASSISTANT_STATUS}`]: true,\n            ...(message.parts ? { [message.parts]: true } : {})\n        })}\" .renderCode=\"${\n        // WA: Define codeBlockRender as \"never\" to avoid types incompatibility:\n        // codeBlockRender returns TemplateResult and renderCode expects TemplateResult | undefined\n        // In Chameleon this type mismatch does not happens. TODO: Evaluate a solution in Chameleon.\n        codeBlockRender(chatRef)}\" .showIndicator=\"${message.status === \"streaming\"}\" .theme=\"${chatRef.markdownTheme ?? undefined}\" .value=\"${messageContent}\"></ch-markdown-viewer>`;\n};\n// customzied in order to add the custom \"messageHeader\"\nconst customErrorContentRender = (message, chatRef, codeBlockRender) => {\n    const errorContent = getMessageContent(message);\n    return html `${messageHeader(message.metadata)}<ch-markdown-viewer part=\"${tokenMap({\n        [`error content ${message.id}`]: true,\n        ...(message.parts ? { [message.parts]: true } : {})\n    })}\" .renderCode=\"${\n    // WA: Define codeBlockRender as \"never\" to avoid types incompatibility:\n    // codeBlockRender returns TemplateResult and renderCode expects TemplateResult | undefined\n    // In Chameleon this type mismatch does not happens. TODO: Evaluate a solution in Chameleon.\n    codeBlockRender(chatRef)}\" .theme=\"${chatRef.markdownTheme ?? undefined}\" .value=\"${errorContent}\"></ch-markdown-viewer>`;\n};\n// No modification. It is required to be defined.\nconst defaultSystemContentRender = () => \"string | TemplateResult\";\n// No modification. It is required to be defined.\nconst defaultUserContentRender = (messageModel) => getMessageContent(messageModel) ?? \"\";\nconst contentRenderByRole = {\n    // TODO: Check if each contentRender can be optional, since it may be not me required to implement\n    // a custom render for each type of content. ie.: Mercury does not requres to customize \"system\" and \"user\"\n    assistant: customAssistantContentRender,\n    error: customErrorContentRender,\n    system: defaultSystemContentRender, // No modification\n    user: defaultUserContentRender // No modification\n};\nconst customContentRender = (message, chatRef, codeBlockRender) => contentRenderByRole[message.role](message, chatRef, codeBlockRender);\nexport const renderItem = {\n    actions: customActionsRender,\n    codeBlock: customCodeBlockRender,\n    content: customContentRender,\n    file: customFileRenders\n};\n// 2) [Configuration for the ch-chat sendContainerLayout property]\nexport const sendContainerLayout = {\n    sendInputAfter: [\n        \"attach-files-button\",\n        \"live-audio-button\",\n        \"send-button\",\n        \"chat-attached-files-viewer\"\n    ],\n    sendContainerAfter: [\"live-audio-container\"]\n};\n","import type {\n  ChatMessage,\n  ChatTranslations\n} from \"@genexus/chameleon-controls-library\";\n\nimport { MercuryChatMessageMetadata } from \"@genexus/mercury\";\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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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    stopResponseButton: \"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    stopResponseButton: \"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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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      agentName: 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 \"@genexus/mercury\";\n\nconst PROCESSING_PLACEHOLDER = \"{{ASSISTANT_NAME}}\";\n\nconst sendChatMessages = (chatRef: HTMLChChatElement) => () => {\n  chatRef.waitingResponse = true;\n\n  chatRef.addNewMessage({\n    id: `${new Date().getTime()}`,\n    role: \"assistant\",\n    content: \"Analyzing\",\n    status: \"waiting\",\n    metadata: {\n      agentName: 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          agentName: 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 stopResponseAnswer = (): 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    stopResponse: stopResponseAnswer\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            agentName: 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.waitingResponse = 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    stopResponseButton: \"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    stopResponseButton: \"\"\n  }\n};\n",":host {\n  block-size: 100%;\n  display: grid;\n}\n","import { Component, Host, h, State, Prop, Method } from \"@stencil/core\";\nimport { renderItem as mercuryChatRenderItem } from \"@genexus/mercury\";\nimport { sendContainerLayout as mercurySendContainerLayout } from \"@genexus/mercury\";\nimport { codeFixerRecord } from \"./models\";\n\nconst CSS_BUNDLES = [\n  \"resets/box-sizing\",\n  \"utils/elevation\",\n  \"components/chat\",\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\"\n            waitingResponse={this.generatingResponse}\n            loadingState={this.loadingState} // \"all-records-loaded\" to display the welcome screen\n            renderItem={mercuryChatRenderItem}\n            items={this.chatItems} // length 0 to display the welcome screen\n            showAdditionalContent={false}\n            sendContainerLayout={mercurySendContainerLayout}\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":";;;;;;;;;;;;;;AAIO,MAAMA,iCAAkCC,YAAmBA,EAAQC,YAAY,WAChFD,EAAQC,UACRC,KAAKC,UAAUH,EAAQC,SAASG,WAAW;;AAC1C,MAAMC,oBAAqBL,YAAmBA,EAAQC,YAAY,WACnED,EAAQC,UACRD,EAAQC,QAAQD;;;;;;;;;;;;;;;AAcf,MAAMM,WAAYC;EACrB,MAAMC,IAAOC,OAAOD,KAAKD;EACzB,IAAIG,IAAS;EACb,KAAK,IAAIC,IAAQ,GAAGA,IAAQH,EAAKI,QAAQD,KAAS;IAC9C,MAAME,IAAWL,EAAKG;IACtB,MAAMG,IAAaP,EAAOM;IAC1B,IAAIC,GAAY;MACZJ,KAAUA,MAAW,KAAKG,IAAW,IAAIA;AACrD;AACA;EACI,OAAOH;AAAM;;AAEV,MAAMK,qBAAsBC,KAASC,UAAUC,UAAUC,UAAUH;;AAInE,MAAMI,yBAAyB,CAACC,GAAOL;EAC1CD,mBAAmBC;EACnB,MAAMM,IAASD,EAAME;EACrB,IAAID,GAAQ;IACR,MAAME,IAAsBF,EAAOG,aAAa;IAChD,MAAMC,IAAyB,GAAGF;IAClCF,EAAOK,aAAa,YAAY;IAChCL,EAAOK,aAAa,QAAQD;IAC5BE,YAAW;MACPN,EAAOO,gBAAgB;MACvBP,EAAOK,aAAa,QAAQH,KAAuB;AAAG,QACvD;AACX;AAAA;;AAEO,MAAMM,IAA2B;;AClDxC,MAAMC,mBAAmB,CAACV,GAAOrB;;EAE7B,MAAMgC,IAA8BjC,+BAA+BC;EACnEoB,uBAAuBC,GAAOW;AAA4B;;AAEvD,MAAMC,sBAAsB,CAACjC,GAASkC;EACzC,OAAMC,gBAAEA,KAAmBD,EAAQE;EACnC,MAAMC,IAAqBrC,EAAQsC,SAAS,gBACvCtC,EAAQuC,WAAW,eAAevC,EAAQuC;EAC/C,MAAMC,IAAqBxC,EAAQsC,SAAS;EAC5C,OAAOG,EAAKJ,KAAsBG,IAAoB,MAAME,CAAK,qDAAqDP,EAAeQ,6BAA6BrC,SAAS;IACvK,CAAC,qCAAqCN,EAAQ4C,OAAO;OACjD5C,EAAQ6C,QAAQ;MAAE,CAAC7C,EAAQ6C,QAAQ;QAAS;+BACtBC,KAAMf,iBAAiBe,GAAG9C;AAA4B;;ACbxF,MAAM+C,4BAA4B,CAACC,GAAWC,GAAUC,MAAsB,MAAMA,EAAkBF,GAAWC;;AAC1G,MAAME,wBAAyBjB,KAAakB;EAC/C,OAAMjB,gBAAEA,GAAcnB,MAAEA,KAASkB,EAAQE;EACzC,MAAMiB,IAAanB,EAAQoB,WAAWJ;EACtC,OAAOR,CAAK,iGAAiGU,EAAQH,sGAAsGjC,EAAKuC,2GAA4GT,KAAM1B,uBAAuB0B,GAAGM,EAAQJ,yBAAyBP,EAAKY,IAAY,MAAMX,CAAK,uBAAuBP,EAAeqB,qGAAqGT,0BAA0BK,EAAQJ,WAAWI,EAAQH,UAAUI,oDAA4DD,EAAQH,oCAAoCG,EAAQK,oEAAoEL,EAAQM,0BAA0BN,EAAQJ;AAA6B;;ACHl3B,MAAMW,IAA4B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6BlC;MAAMC,aAAa,CAACC,GAAMC,MACfpB,CAAK,kCAAkCpC,SAAS;EACnD,CAAC,sBAAsBwD,KAAcD,EAAKE,YAAYF,EAAKG,eAAeL,MAA8B;EACxG,CAACE,EAAKI,cAAcJ,EAAKI;EACzB,CAACJ,EAAKhB,UAAUgB,EAAKhB;yDACgCgB,EAAKK,UAAUL,EAAKI,aAAa,MAAMJ,EAAKI,UAAUE,wBAAwBN,EAAKG,gBAAgB,gBACtJtB,CAAK,gCACL0B;;AAEV,MAAMC,wBAAwB,CAACR,GAAMC,MAC1BxD,SAAS;EACZ,CAAC,yBAAyBwD,KAAcD,EAAKE,YAAYF,EAAKG,eAAeL,MAA8B;EAC3G,CAACE,EAAKI,cAAcJ,EAAKI;EACzB,CAACJ,EAAKhB,UAAUgB,EAAKhB;;;AAG7B,MAAMyB,eAAe,CAACT,GAAMC,MAAexD,SAAS;EAChD,CAAC,eAAewD,KAAcD,EAAKE,YAAYF,EAAKG,eAAeL,MAA8B;EACjG,CAACE,EAAKI,cAAcJ,EAAKI;EACzB,CAACJ,EAAKhB,UAAUgB,EAAKhB;;;;;;AAIlB,MAAM0B,IAAoB;EAC7BC,OAAQX,KACGnB,CAAK,oCAAoC2B,sBAAsBR,GAAM,gCAAgCY,EAAUZ,EAAK1B,0BAA0BmC,aAAaT,GAAM,kBAAkBY,EAAUZ,EAAKG,gBAAgB,gBAAgB5D,YAAYyD,EAAKa,0BAA0Bd,WAAWC,GAAM;EAEzSc,OAAQd,KACGnB,CAAK,oCAAoC2B,sBAAsBR,GAAM,gCAAgCY,EAAUZ,EAAK1B,0BAA0BmC,aAAaT,GAAM,kBAAkBY,EAAUZ,EAAKG,gBAAgB,gBAAgB5D,YAAYyD,EAAKa,0BAA0Bd,WAAWC,GAAM;EAEzSe,OAAQf,KACGnB,CAAK,oCAAoC2B,sBAAsBR,GAAM,8BAA8BY,EAAUZ,EAAK1B,0BAA0BmC,aAAaT,GAAM,kBAAkBA,EAAKa,aAAab,EAAKgB,mBAAmBhB,EAAK1B,kBAAkB,uBAAuByB,WAAWC,GAAM;EAErSA,MAAOA;IACH,MAAMiB,IAAyBjB,EAAKG,gBAAgB;IACpD,OAAOtB,CAAK,oCAAoC2B,sBAAsBR,GAAM,2BAA2BY,EAAUZ,EAAK1B,0BAA0B2C,IAAyB,SAASV,qBAA2BU,IAAyB,SAASV,YAAkBE,aAAaT,GAAM,kBAAkBiB,IAAyBV,IAAUP,EAAKa,6BAA6Bd,WAAWC,GAAM;AAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GC9BlZ,OAAMkB,gBAAgB,CAACC,GAAiBC,IAAU;EAC9C,MAAMC,IAAYF,GAAiBE;EACnC,MAAMC,IAAcD,GAAWf,cAAciB,QAAQ,MAAM;EAC3D,MAAMC,IAAcL,GAAiBM;EACrC,OAAO5C,CAAK,8BAA8ByC,IAAc,WAAWA,MAAgB,sOAAsOD,UAAkBD,IAAUvC,CAAK,4CAA4C0B,UAAgBiB,IAChZ3C,CAAK,mBAAmB2C,oCAA8CA,aACtEjB;AAAe;;wDAGzB;MAAMmB,+BAA+B,CAACvF,GAASkC,GAASsD;EACpD,MAAMC,IAAiBpF,kBAAkBL;EACzC,OAAOA,EAAQuC,WAAW,YACpBG,CAAK,GAAGqC,cAAc/E,EAAQ0F,UAAU,6CAA6CpF,SAAS;IAC5F,CAAC,6BAA6BN,EAAQ4C,OAAO;OACzC5C,EAAQ6C,QAAQ;MAAE,CAAC7C,EAAQ6C,QAAQ;QAAS;SAC7C4C,YACL/C,CAAK,GAAGqC,cAAc/E,EAAQ0F,sCAAsCpF,SAAS;IAC3E,CAAC,qBAAqBN,EAAQ4C,MAAM5C,EAAQuC,UAAUT,MAA6B;OAC/E9B,EAAQ6C,QAAQ;MAAE,CAAC7C,EAAQ6C,QAAQ;QAAS;;;;;EAKpD2C,EAAgBtD,uBAA6BlC,EAAQuC,WAAW,wBAAwBL,EAAQyD,iBAAiBvF,sBAAsBqF;AAAuC;;wDAGtL;MAAMG,2BAA2B,CAAC5F,GAASkC,GAASsD;EAChD,MAAMK,IAAexF,kBAAkBL;EACvC,OAAO0C,CAAK,GAAGqC,cAAc/E,EAAQ0F,sCAAsCpF,SAAS;IAChF,CAAC,iBAAiBN,EAAQ4C,OAAO;OAC7B5C,EAAQ6C,QAAQ;MAAE,CAAC7C,EAAQ6C,QAAQ;QAAS;;;;;EAKpD2C,EAAgBtD,eAAqBA,EAAQyD,iBAAiBvF,sBAAsByF;AAAqC;;iDAG7H;MAAMC,6BAA6B,MAAM;;;;AAEzC,MAAMC,2BAA4BC,KAAiB3F,kBAAkB2F,MAAiB;;AACtF,MAAMC,IAAsB;;;EAGxBC,WAAWX;EACXY,OAAOP;EACPQ,QAAQN;;EACRO,MAAMN;;;AAEV,MAAMO,sBAAsB,CAACtG,GAASkC,GAASsD,MAAoBS,EAAoBjG,EAAQsC,MAAMtC,GAASkC,GAASsD;;AAChH,MAAMe,IAAa;EACtBC,SAASvE;EACTwE,WAAWtD;EACXlD,SAASqG;EACTzC,MAAMU;;;kEAGH;MAAMmC,IAAsB;EAC/BC,gBAAgB,EACZ,uBACA,qBACA,eACA;EAEJC,oBAAoB,EAAC;;;AC/FlB,MAAMC,IACX;;AAEK,MAAMC,IAAiB;;;;8BAyKvB;MAAMC,IAA8B;;AAiEEC,MAAMC,KACjD;EAAErG,QAAQ;IACV,CAACsG,GAAGvG,MACFA,IAAQ,MAAM,IACV;EACEiC,IAAI,UAAUjC;EACd2B,MAAM;EACNrC,SACE,UAAUU,MACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA;IAEd;EACEiC,IAAI,UAAUjC;EACd2B,MAAM;EACNrC,SACE4G,IACA,YAAYlG,QACZ,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA,QACV,UAAUA;;;AAIf,MAAMwG,IAAiC,EAC5C;EACEvE,IAAI;EACJN,MAAM;EACNrC,SAAS;EACTyF,UAAU;GAEZ;EACE9C,IAAI;EACJN,MAAM;EACNC,QAAQ;EACRtC,SACE;EACFyF,UAAU;IACRR,WAAW4B;IACXxB,MAAM;;GAGV;EACE1C,IAAI;EACJN,MAAM;EACNC,QAAQ;EACRtC,SACE;EACFyF,UAAU;IACRR,WAAW4B;IACXxB,MAAM;;EAERzC,OAAO;GAET;EACED,IAAI;EACJN,MAAM;EACNrC,SACE;EACFyF,UAAU;IACRR,WAAW4B;IACXxB,MAAM;;GAGV;EACE1C,IAAI;EACJN,MAAM;EACNC,QAAQ;EACRtC,SACE;EACFyF,UAAU;IACRR,WAAW4B;IACXxB,MAAM;;EAERzC,OAAO;GAET;EACED,IAAI;EACJN,MAAM;EACNrC,SACE;EACFyF,UAAU;GAEZ;EACE9C,IAAI;EACJN,MAAM;EACNC,QAAQ;EACRtC,SACE;EACFyF,UAAU;IACRR,WAAW4B;IACXxB,MAAM;;GAGV;EACE1C,IAAI;EACJN,MAAM;EACNC,QAAQ;EACRtC,SAAS;EACTyF,UAAU;IACRR,WAAW4B;IACXxB,MAAM;;GAGV;EACE1C,IAAI;EACJN,MAAM;EACNC,QAAQ;EACRtC,SAAS4G;EACTnB,UAAU;IACRR,WAAW4B;IACXxB,MAAM;;;;AC/VZ,MAAM8B,IAAyB;;AAE/B,MAAMC,mBAAoBnF,KAA+B;EACvDA,EAAQoF,kBAAkB;EAE1BpF,EAAQqF,cAAc;IACpB3E,IAAI,IAAG,IAAI4E,MAAOC;IAClBnF,MAAM;IACNrC,SAAS;IACTsC,QAAQ;IACRmD,UAAU;MACRR,WAAW4B;MACXxB,MAAM;;;EAIV1D,YAAW;IACTM,EAAQwF,kBACN;MACEpF,MAAM;MACNrC,SAAS;MACTsC,QAAQ;MACRmD,UAAU;QACRR,WAAW4B;QACXxB,MAAM;;OAGV;IAGF1D,YAAW;MACT+F,eAAezF,GAAS,IAAI6E,GAA6B;AAAU,QAClE;AAAK,MACP;AAAK;;AAGV,MAAMa,qBAAqB;EACzBC,QAAQC,IAAI;EACZ,OAAO,IAAIC,SAAcC;;IAEvBA;AAAS;AACT;;AAGG,MAAMC,2BACXC,MAEO;EACLb,kBAAkBA,iBAAiBa;EACnCC,YAAatE,KACX,IAAIkE,SAAyB;IAC3BF,QAAQC,IAAI,QAAQjE;IAEpB,OAAOkE,QAAQC,QAAQ;MACrBtD,KAAK;MACLX,UAAU;;AACgB;EAEhCqE,cAAcR;;;AAIlB,SAASD,eACPzF,GACAmG,GACAC,GACAC;EAEA3G,YACE;IACE,MAAM4G,IAAqBH,KAAWC,EAAgB1H;IAEtDsB,EAAQwF,kBACN;MACEpF,MAAM;MACNrC,SAASqI,EAAgBG,UAAUJ,IAAU,IAAIA;;;;;;;;;;;;;;;;MAiBjD9F,QAAQiG,IAAqB,aAAa;MAC1C9C,UAAU;QACRR,WAAW4B;QACXxB,MAAM;;OAGViD;IAGF,KAAKC,GAAoB;MACvBb,eAAezF,GAASmG,IAAU,IAAIC,GAAiB;WAClD;MACLpG,EAAQoF,kBAAkB;;MAG9Be,IAAU,QAAQ,IAAI,KAAK;AAE/B;;AAEO,MAAMK,IAAqC;EAChDvG,gBAAgB;IACdwG,WAAW;IACXhG,oBAAoB;IACpBa,oBAAoB;IACpBoF,YAAY;IACZC,WAAW;IACXC,oBAAoB;;EAEtBC,aAAa;IACXF,WAAW;;EAEb7H,MAAM;IACJuC,gBAAgB;IAChBZ,oBAAoB;IACpBa,oBAAoB;IACpBwF,YAAY,mBAAmB5B;IAC/B6B,aAAa;IACbH,oBAAoB;;;;AC5IxB,MAAMI,IAAkB;;;;;;;;;;;;;;;;;ACKxB,MAAMC,IAAc,EAClB,qBACA,mBACA,mBACA;;MAeWC,IAAoB;;;IAC/BC,EAAAC,IAAAC,WAAA;IACAC,EAAAF,IAAAC,WAAA;IACAE,EAAAH,IAAAC,WAAA;IACAG,EAAAJ,IAAAC,WAAA;IA6BAI,EAAAL,IAAAC,OAAmC;MACjCK,EAAAL,MAAIF,GAAA,KAAmBQ;AAA6B;IAGtDC,EAAAR,IAAAC,OAAqC;IA+BrCQ,EAAAT,IAAAC,OAA0CS,MACxCC;MAEA,IAAIC;MACJ,IAAID,EAAO9F,cAAcgG,SAAS,gBAAgB;QAChDD,IACE;aACG,IAAID,EAAO9F,cAAcgG,SAAS,WAAW;QAClDD,IACE;aACG;QACLA,IACE;;MAGJ,MAAME,IAA8B;QAClCxH,IAAI;QACJN,MAAM;QACNrC,SAASgK;;MAEXL,EAAAL,MAAIE,GAAA,KAAYlC,cAAc6C;MAC9BxI,YAAW;QACTgI,EAAAL,MAAIE,GAAA,KAAYlC,cAAc;UAC5B3E,IAAI,IAAG,IAAI4E,MAAOC;UAClBnF,MAAM;UACNrC,SAAS;UACTsC,QAAQ;;QAEVX,YAAW;UACTgI,EAAAL,MAAIE,GAAA,KAAY/B,kBACd;YACEpF,MAAM;YACNrC,SAAS;YACTsC,QAAQ;aAEV;UAEFX,YAAW;YACTgI,EAAAL,MAAIE,GAAA,KAAY/B,kBACd;cACEpF,MAAM;cACNrC,SAAS;cACTsC,QAAQ;eAEV;YAEFqH,EAAAL,MAAIE,GAAA,KAAY/B,kBACd;cACEpF,MAAM;cACNrC,SAASiK;cACT3H,QAAQ;eAEV;AACD,cACA;AAAK,YACP;AAAK,UACP;AAAI;gBAjHP;8BAEqC;wBAKZ;iCACe;8BACH;2BACJ;qBACC;;;;SAMpC,iBAAM8H;;IAEJT,EAAAL,MAAIC,GAAA,KAAiBa;;EASvB,gBAAAC;IACE1I,YAAW;MACT2H,KAAKgB,kBAAkB;AAAsB,QAC5C;;EAGL,kBAAAC;IACE,KAAKZ,EAAAL,MAAIG,GAAA,QAAmBE,EAAAL,MAAIE,GAAA,MAAa;MAC3CgB,EAAAlB,MAAIG,GAAkBzB,yBAAyB2B,EAAAL,MAAIE,GAAA,OAAY;;;EAInE,uBAAMiB;IACJ,IAAInB,KAAKhB,SAAS,mBAAmB;MACnCgB,KAAKoB,YAAYxD;WACZ,IAAIoC,KAAKhB,SAAS,WAAW;MAClCgB,KAAKoB,YAAY;WACZ,IAAIpB,KAAKhB,SAAS,SAAS;MAChCgB,KAAKoB,YAAY,EACf;QACE/H,IAAI;QACJN,MAAM;QACNC,QAAQ;QACRtC,SAAS;QACTyF,UAAU;;;;EAgElB,MAAAkF;IACE,OACEC,EAACC,GAAI,MACHD,EAAA;MAAUE,OAAO5B;QACjB0B,EAAA;MACEG,WAAU;MACVC,0BAA0BrB,EAAAL,MAAII,GAAA;MAC9BuB,4BAA4BtB,EAAAL,MAAIO,GAAA;MAChCqB,KAAKC,KACFX,EAAAlB,MAAIF,GAAqB+B,GAAmC;MAE/DC,OAAM;OAENR,EAAA;MACEvH,WAAWsG,EAAAL,MAAIG,GAAA;MACf2B,OAAM;MACN/D,iBAAiBiC,KAAK+B;MACtBC,cAAchC,KAAKgC;MACnBhF,YAAYiF;MACZC,OAAOlC,KAAKoB;MACZe,uBAAuB;MACvBhF,qBAAqBiF;MACrBvJ,cAAcsG;MACdyC,KAAMC,KACHX,EAAAlB,MAAIE,GAAc2B,GAAuB;MAE5CzF,eAAc;OAEdkF,EAAA;MACEM,KAAKC,KACFX,EAAAlB,MAAIC,GAAmB4B,GAAiC;MAE3DQ,MAAK;MACLC,iCACEjC,EAAAL,MAAIQ,GAAA;QAGRc,EAAA;MAAKe,MAAK;OAAoB"}

package/dist/genexus-ide-ui/{p-7b986243.entry.js → p-71d4d3dd.entry.js}

@@ -1,33 +1,41 @@
-import { r as t, g as e, h as s, H as o, a as n } from "./p-97107ecc.js";
+import { r as t, g as e, h as s, H as i, a as o } from "./p-97107ecc.js";
 
-import { g as r } from "./p-401bfc97.js";
+import { g as n } from "./p-d42e842b.js";
 
-import { L as i } from "./p-311eedf3.js";
+import "./p-d4ecd3bb.js";
+
+import "lit";
+
+import "lit/directives/when.js";
+
+import "lit/directives/if-defined.js";
+
+import { L as r } from "./p-311eedf3.js";
 
 const a = ":host{display:grid;block-size:100%;overflow:auto;grid-template-rows:max-content 1fr max-content}.section{display:contents}.main{overflow:auto;display:flex;align-items:center;justify-content:center}";
 
 // This is a starting template. Do not edit this file directly.
 // Dupicate it and modify the new file as needed.
-var c = undefined && undefined.__classPrivateFieldGet || function(t, e, s, o) {
-  if (s === "a" && !o) throw new TypeError("Private accessor was defined without a getter");
-  if (typeof e === "function" ? t !== e || !o : !e.has(t)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-  return s === "m" ? o : s === "a" ? o.call(t) : o ? o.value : e.get(t);
+var c = undefined && undefined.__classPrivateFieldGet || function(t, e, s, i) {
+  if (s === "a" && !i) throw new TypeError("Private accessor was defined without a getter");
+  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");
+  return s === "m" ? i : s === "a" ? i.call(t) : i ? i.value : e.get(t);
 };
 
-var d = undefined && undefined.__classPrivateFieldSet || function(t, e, s, o, n) {
-  if (o === "m") throw new TypeError("Private method is not writable");
-  if (o === "a" && !n) throw new TypeError("Private accessor was defined without a setter");
-  if (typeof e === "function" ? t !== e || !n : !e.has(t)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-  return o === "a" ? n.call(t, s) : n ? n.value = s : e.set(t, s), s;
+var d = undefined && undefined.__classPrivateFieldSet || function(t, e, s, i, o) {
+  if (i === "m") throw new TypeError("Private method is not writable");
+  if (i === "a" && !o) throw new TypeError("Private accessor was defined without a setter");
+  if (typeof e === "function" ? t !== e || !o : !e.has(t)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+  return i === "a" ? o.call(t, s) : o ? o.value = s : e.set(t, s), s;
 };
 
-var l, h, f, u;
+var l, h, f, m;
 
-const m = [ 
+const p = [ 
 // Use only the bundles that are needed for this component.
 "resets/box-sizing", "components/edit", "components/button", "components/icon", "utils/layout", "utils/form", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
 
-const p = r({
+const u = n({
   category: "system",
   name: "folder",
   colorType: "on-primary"
@@ -41,7 +49,7 @@ const w = class {
     f.set(this, (() => {
       this.cancelCallback();
     }));
-    u.set(this, (() => {
+    m.set(this, (() => {
       this.saveCallback();
     }));
     this.myStateVariable = undefined;
@@ -53,7 +61,7 @@ const w = class {
     console.log("First name changed:", t);
   }
   async componentWillLoad() {
-    this._componentLocale = await i.getComponentStrings(this.el);
+    this._componentLocale = await r.getComponentStrings(this.el);
   }
   componentDidLoad() {
     // Here you can do any additional setup after the component has been rendered.
@@ -68,10 +76,10 @@ const w = class {
     }
   }
   render() {
-    return s(o, {
+    return s(i, {
       class: "widget spacing-body"
     }, s("ch-theme", {
-      model: m
+      model: p
     }), s("ch-shortcuts", {
       src: c(this, h, "f"),
       ref: t => d(this, l, t, "f")
@@ -104,18 +112,18 @@ const w = class {
       // #create
       class: "button-primary button-icon-and-text",
       id: "button-create",
-      onClick: c(this, u, "f"),
+      onClick: c(this, m, "f"),
       part: "button-create"
     }, s("ch-image", {
       class: "icon-md",
-      src: p
+      src: u
     }), this._componentLocale.footer.btnSave)))));
   }
   static get assetsDirs() {
     return [ "gx-ide-assets/starting-template" ];
   }
   get el() {
-    return n(this);
+    return o(this);
   }
   static get watchers() {
     return {
@@ -124,9 +132,9 @@ const w = class {
   }
 };
 
-l = new WeakMap, h = new WeakMap, f = new WeakMap, u = new WeakMap;
+l = new WeakMap, h = new WeakMap, f = new WeakMap, m = new WeakMap;
 
 w.style = a;
 
 export { w as gx_ide_starting_template };
-//# sourceMappingURL=p-7b986243.entry.js.map
+//# sourceMappingURL=p-71d4d3dd.entry.js.map

package/dist/genexus-ide-ui/{p-7b986243.entry.js.map → p-71d4d3dd.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["startingTemplateCss","CSS_BUNDLES","SYSTEM_ICON","getIconPath","category","name","colorType","GxIdeStartingTemplate","_GxIdeStartingTemplate_chShortcutsEl","set","this","_GxIdeStartingTemplate_shortcutsSrc","getAssetPath","_GxIdeStartingTemplate_cancelButtonClickedHandler","cancelCallback","_GxIdeStartingTemplate_saveButtonClickedHandler","saveCallback","firstNameChanged","newValue","console","log","componentWillLoad","_componentLocale","Locale","getComponentStrings","el","componentDidLoad","suspendShortcuts","__classPrivateFieldGet","suspend","render","h","Host","class","model","src","ref","__classPrivateFieldSet","htmlFor","main","firstName","id","value","onClick","part","footer","btnCancel","btnSave"],"sources":["src/components/_starting-template/starting-template.scss?tag=gx-ide-starting-template&encapsulation=shadow","src/components/_starting-template/starting-template.tsx"],"sourcesContent":[":host {\n  display: grid;\n  block-size: 100%;\n  overflow: auto;\n  grid-template-rows: max-content 1fr max-content;\n}\n\n.section {\n  // section is  just for semantics if a header is present\n  display: contents;\n}\n\n// header\n.header {\n}\n\n// main\n.main {\n  overflow: auto;\n  // The following styles are just to center the text.\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n// footer\n.footer {\n}\n","// This is a starting template. Do not edit this file directly.\n// Dupicate it and modify the new file as needed.\n\nimport {\n  Component,\n  Host,\n  Prop,\n  Element,\n  State,\n  getAssetPath,\n  Method,\n  h,\n  Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  // Use only the bundles that are needed for this component.\n  \"resets/box-sizing\",\n  \"components/edit\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/layout\",\n  \"utils/form\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst SYSTEM_ICON = getIconPath({\n  category: \"system\",\n  name: \"folder\",\n  colorType: \"on-primary\"\n});\n\n@Component({\n  tag: \"gx-ide-starting-template\",\n  styleUrl: \"starting-template.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/starting-template\"]\n})\nexport class GxIdeStartingTemplate {\n  _componentLocale: any;\n\n  @Element() el: HTMLGxIdeStartingTemplateElement;\n\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #shortcutsSrc = getAssetPath(`./gx-ide-assets/new-kb/shortcuts.json`);\n\n  /**\n   * Description of my state variable.\n   */\n  @State() myStateVariable: string;\n\n  /**\n   * Description of my prop variable.\n   */\n  @Prop() readonly firstName: string;\n  @Watch(\"firstName\")\n  firstNameChanged(newValue: string[]) {\n    console.log(\"First name changed:\", newValue);\n  }\n\n  /**\n   * Callback that will be invoked when the user cancels.\n   */\n  @Prop() readonly cancelCallback!: CancelCallback;\n\n  /**\n   * Callback that will be invoked when the user saves.\n   */\n  @Prop() readonly saveCallback!: SaveCallback;\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidLoad() {\n    // Here you can do any additional setup after the component has been rendered.\n  }\n\n  /**\n   * Suspends or reactivates the shortcuts\n   */\n  @Method()\n  async suspendShortcuts(suspendShortcuts: boolean) {\n    if (suspendShortcuts) {\n      this.#chShortcutsEl.suspend = true;\n    } else {\n      this.#chShortcutsEl.suspend = false;\n    }\n  }\n\n  #cancelButtonClickedHandler = () => {\n    this.cancelCallback();\n  };\n\n  #saveButtonClickedHandler = () => {\n    this.saveCallback();\n  };\n\n  render() {\n    return (\n      <Host class=\"widget spacing-body\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <ch-shortcuts\n          src={this.#shortcutsSrc}\n          ref={(el: HTMLChShortcutsElement) =>\n            (this.#chShortcutsEl = el as HTMLChShortcutsElement)\n          }\n        ></ch-shortcuts>\n        <section class=\"section\">\n          <header class=\"header control-header control-header-with-border\">\n            <div class=\"field field-block\">\n              <label class=\"label\" htmlFor=\"first-name\">\n                {this._componentLocale.main.firstName}\n              </label>\n              <ch-edit class=\"input\" id=\"first-name\" value={this.firstName} />\n            </div>\n          </header>\n\n          <div class=\"main\">The main content here</div>\n\n          <footer class=\"footer control-footer control-footer-with-border\">\n            <div class=\"buttons-spacer\">\n              <button\n                // #cancel\n                class=\"button-secondary\"\n                id=\"button-cancel\"\n                onClick={this.#cancelButtonClickedHandler}\n                part=\"button-cancel\"\n              >\n                {this._componentLocale.footer.btnCancel}\n              </button>\n              <button\n                // #create\n                class=\"button-primary button-icon-and-text\"\n                id=\"button-create\"\n                onClick={this.#saveButtonClickedHandler}\n                part=\"button-create\"\n              >\n                <ch-image class=\"icon-md\" src={SYSTEM_ICON}></ch-image>\n                {this._componentLocale.footer.btnSave}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type CancelCallback = () => Promise<void>;\n\nexport type SaveCallback = () => Promise<string>;\n"],"mappings":";;;;;;AAAA,MAAMA,IAAsB;;;;;;;;;;;;;;;;;;;ACmB5B,MAAMC,IAA8B;;AAElC,qBACA,mBACA,qBACA,mBACA,gBACA,cACA,oBACA,iBACA;;AAGF,MAAMC,IAAcC,EAAY;EAC9BC,UAAU;EACVC,MAAM;EACNC,WAAW;;;MASAC,IAAqB;;;IAKhCC,EAAAC,IAAAC,WAAA;IACAC,EAAAF,IAAAC,MAAgBE,EAAa;IA8C7BC,EAAAJ,IAAAC,OAA8B;MAC5BA,KAAKI;AAAgB;IAGvBC,EAAAN,IAAAC,OAA4B;MAC1BA,KAAKM;AAAc;;;;;;EAvCrB,gBAAAC,CAAiBC;IACfC,QAAQC,IAAI,uBAAuBF;;EAarC,uBAAMG;IACJX,KAAKY,yBAAyBC,EAAOC,oBAAoBd,KAAKe;;EAGhE,gBAAAC;;;;;SAQA,sBAAMC,CAAiBA;IACrB,IAAIA,GAAkB;MACpBC,EAAAlB,MAAIF,GAAA,KAAgBqB,UAAU;WACzB;MACLD,EAAAlB,MAAIF,GAAA,KAAgBqB,UAAU;;;EAYlC,MAAAC;IACE,OACEC,EAACC,GAAI;MAACC,OAAM;OACVF,EAAA;MAAUG,OAAOjC;QACjB8B,EAAA;MACEI,KAAKP,EAAAlB,MAAIC,GAAA;MACTyB,KAAMX,KACHY,EAAA3B,MAAIF,GAAkBiB,GAA4B;QAGvDM,EAAA;MAASE,OAAM;OACbF,EAAA;MAAQE,OAAM;OACZF,EAAA;MAAKE,OAAM;OACTF,EAAA;MAAOE,OAAM;MAAQK,SAAQ;OAC1B5B,KAAKY,iBAAiBiB,KAAKC,YAE9BT,EAAA;MAASE,OAAM;MAAQQ,IAAG;MAAaC,OAAOhC,KAAK8B;UAIvDT,EAAA;MAAKE,OAAM;OAAM,0BAEjBF,EAAA;MAAQE,OAAM;OACZF,EAAA;MAAKE,OAAM;OACTF,EAAA;;MAEEE,OAAM;MACNQ,IAAG;MACHE,SAASf,EAAAlB,MAAIG,GAAA;MACb+B,MAAK;OAEJlC,KAAKY,iBAAiBuB,OAAOC,YAEhCf,EAAA;;MAEEE,OAAM;MACNQ,IAAG;MACHE,SAASf,EAAAlB,MAAIK,GAAA;MACb6B,MAAK;OAELb,EAAA;MAAUE,OAAM;MAAUE,KAAKjC;QAC9BQ,KAAKY,iBAAiBuB,OAAOE"}
+{"version":3,"names":["startingTemplateCss","CSS_BUNDLES","SYSTEM_ICON","getIconPath","category","name","colorType","GxIdeStartingTemplate","_GxIdeStartingTemplate_chShortcutsEl","set","this","_GxIdeStartingTemplate_shortcutsSrc","getAssetPath","_GxIdeStartingTemplate_cancelButtonClickedHandler","cancelCallback","_GxIdeStartingTemplate_saveButtonClickedHandler","saveCallback","firstNameChanged","newValue","console","log","componentWillLoad","_componentLocale","Locale","getComponentStrings","el","componentDidLoad","suspendShortcuts","__classPrivateFieldGet","suspend","render","h","Host","class","model","src","ref","__classPrivateFieldSet","htmlFor","main","firstName","id","value","onClick","part","footer","btnCancel","btnSave"],"sources":["src/components/_starting-template/starting-template.scss?tag=gx-ide-starting-template&encapsulation=shadow","src/components/_starting-template/starting-template.tsx"],"sourcesContent":[":host {\n  display: grid;\n  block-size: 100%;\n  overflow: auto;\n  grid-template-rows: max-content 1fr max-content;\n}\n\n.section {\n  // section is  just for semantics if a header is present\n  display: contents;\n}\n\n// header\n.header {\n}\n\n// main\n.main {\n  overflow: auto;\n  // The following styles are just to center the text.\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n// footer\n.footer {\n}\n","// This is a starting template. Do not edit this file directly.\n// Dupicate it and modify the new file as needed.\n\nimport {\n  Component,\n  Host,\n  Prop,\n  Element,\n  State,\n  getAssetPath,\n  Method,\n  h,\n  Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  // Use only the bundles that are needed for this component.\n  \"resets/box-sizing\",\n  \"components/edit\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/layout\",\n  \"utils/form\",\n  \"utils/typography\",\n  \"utils/spacing\",\n  \"chameleon/scrollbar\"\n];\n\nconst SYSTEM_ICON = getIconPath({\n  category: \"system\",\n  name: \"folder\",\n  colorType: \"on-primary\"\n});\n\n@Component({\n  tag: \"gx-ide-starting-template\",\n  styleUrl: \"starting-template.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/starting-template\"]\n})\nexport class GxIdeStartingTemplate {\n  _componentLocale: any;\n\n  @Element() el: HTMLGxIdeStartingTemplateElement;\n\n  #chShortcutsEl: HTMLChShortcutsElement;\n  #shortcutsSrc = getAssetPath(`./gx-ide-assets/new-kb/shortcuts.json`);\n\n  /**\n   * Description of my state variable.\n   */\n  @State() myStateVariable: string;\n\n  /**\n   * Description of my prop variable.\n   */\n  @Prop() readonly firstName: string;\n  @Watch(\"firstName\")\n  firstNameChanged(newValue: string[]) {\n    console.log(\"First name changed:\", newValue);\n  }\n\n  /**\n   * Callback that will be invoked when the user cancels.\n   */\n  @Prop() readonly cancelCallback!: CancelCallback;\n\n  /**\n   * Callback that will be invoked when the user saves.\n   */\n  @Prop() readonly saveCallback!: SaveCallback;\n\n  async componentWillLoad() {\n    this._componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  componentDidLoad() {\n    // Here you can do any additional setup after the component has been rendered.\n  }\n\n  /**\n   * Suspends or reactivates the shortcuts\n   */\n  @Method()\n  async suspendShortcuts(suspendShortcuts: boolean) {\n    if (suspendShortcuts) {\n      this.#chShortcutsEl.suspend = true;\n    } else {\n      this.#chShortcutsEl.suspend = false;\n    }\n  }\n\n  #cancelButtonClickedHandler = () => {\n    this.cancelCallback();\n  };\n\n  #saveButtonClickedHandler = () => {\n    this.saveCallback();\n  };\n\n  render() {\n    return (\n      <Host class=\"widget spacing-body\">\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <ch-shortcuts\n          src={this.#shortcutsSrc}\n          ref={(el: HTMLChShortcutsElement) =>\n            (this.#chShortcutsEl = el as HTMLChShortcutsElement)\n          }\n        ></ch-shortcuts>\n        <section class=\"section\">\n          <header class=\"header control-header control-header-with-border\">\n            <div class=\"field field-block\">\n              <label class=\"label\" htmlFor=\"first-name\">\n                {this._componentLocale.main.firstName}\n              </label>\n              <ch-edit class=\"input\" id=\"first-name\" value={this.firstName} />\n            </div>\n          </header>\n\n          <div class=\"main\">The main content here</div>\n\n          <footer class=\"footer control-footer control-footer-with-border\">\n            <div class=\"buttons-spacer\">\n              <button\n                // #cancel\n                class=\"button-secondary\"\n                id=\"button-cancel\"\n                onClick={this.#cancelButtonClickedHandler}\n                part=\"button-cancel\"\n              >\n                {this._componentLocale.footer.btnCancel}\n              </button>\n              <button\n                // #create\n                class=\"button-primary button-icon-and-text\"\n                id=\"button-create\"\n                onClick={this.#saveButtonClickedHandler}\n                part=\"button-create\"\n              >\n                <ch-image class=\"icon-md\" src={SYSTEM_ICON}></ch-image>\n                {this._componentLocale.footer.btnSave}\n              </button>\n            </div>\n          </footer>\n        </section>\n      </Host>\n    );\n  }\n}\n\nexport type CancelCallback = () => Promise<void>;\n\nexport type SaveCallback = () => Promise<string>;\n"],"mappings":";;;;;;;;;;;;;;AAAA,MAAMA,IAAsB;;;;;;;;;;;;;;;;;;;ACmB5B,MAAMC,IAA8B;;AAElC,qBACA,mBACA,qBACA,mBACA,gBACA,cACA,oBACA,iBACA;;AAGF,MAAMC,IAAcC,EAAY;EAC9BC,UAAU;EACVC,MAAM;EACNC,WAAW;;;MASAC,IAAqB;;;IAKhCC,EAAAC,IAAAC,WAAA;IACAC,EAAAF,IAAAC,MAAgBE,EAAa;IA8C7BC,EAAAJ,IAAAC,OAA8B;MAC5BA,KAAKI;AAAgB;IAGvBC,EAAAN,IAAAC,OAA4B;MAC1BA,KAAKM;AAAc;;;;;;EAvCrB,gBAAAC,CAAiBC;IACfC,QAAQC,IAAI,uBAAuBF;;EAarC,uBAAMG;IACJX,KAAKY,yBAAyBC,EAAOC,oBAAoBd,KAAKe;;EAGhE,gBAAAC;;;;;SAQA,sBAAMC,CAAiBA;IACrB,IAAIA,GAAkB;MACpBC,EAAAlB,MAAIF,GAAA,KAAgBqB,UAAU;WACzB;MACLD,EAAAlB,MAAIF,GAAA,KAAgBqB,UAAU;;;EAYlC,MAAAC;IACE,OACEC,EAACC,GAAI;MAACC,OAAM;OACVF,EAAA;MAAUG,OAAOjC;QACjB8B,EAAA;MACEI,KAAKP,EAAAlB,MAAIC,GAAA;MACTyB,KAAMX,KACHY,EAAA3B,MAAIF,GAAkBiB,GAA4B;QAGvDM,EAAA;MAASE,OAAM;OACbF,EAAA;MAAQE,OAAM;OACZF,EAAA;MAAKE,OAAM;OACTF,EAAA;MAAOE,OAAM;MAAQK,SAAQ;OAC1B5B,KAAKY,iBAAiBiB,KAAKC,YAE9BT,EAAA;MAASE,OAAM;MAAQQ,IAAG;MAAaC,OAAOhC,KAAK8B;UAIvDT,EAAA;MAAKE,OAAM;OAAM,0BAEjBF,EAAA;MAAQE,OAAM;OACZF,EAAA;MAAKE,OAAM;OACTF,EAAA;;MAEEE,OAAM;MACNQ,IAAG;MACHE,SAASf,EAAAlB,MAAIG,GAAA;MACb+B,MAAK;OAEJlC,KAAKY,iBAAiBuB,OAAOC,YAEhCf,EAAA;;MAEEE,OAAM;MACNQ,IAAG;MACHE,SAASf,EAAAlB,MAAIK,GAAA;MACb6B,MAAK;OAELb,EAAA;MAAUE,OAAM;MAAUE,KAAKjC;QAC9BQ,KAAKY,iBAAiBuB,OAAOE"}

package/dist/genexus-ide-ui/{p-891faf90.entry.js → p-77c315d9.entry.js}

@@ -1,18 +1,26 @@
 import { r as t, c as e, h as i, H as o, a as s } from "./p-97107ecc.js";
 
-import { g as r } from "./p-401bfc97.js";
+import { g as r } from "./p-d42e842b.js";
+
+import "./p-d4ecd3bb.js";
+
+import "lit";
+
+import "lit/directives/when.js";
+
+import "lit/directives/if-defined.js";
 
 import { L as n } from "./p-311eedf3.js";
 
 const a = ".wrapper{display:grid;grid-template-columns:1fr max-content max-content;gap:var(--mer-spacing--xs);border-radius:var(--control__border-radius);border:var(--control__border-width) var(--control__border-style) var(--control__border-color);padding:var(--control__padding-block) var(--control__padding-inline)}.wrapper:hover{--control__border-color:var(--control__border-color--hover)}.input{--control__padding-block:0;--control__padding-inline:0;--control__border-width:0;--focus__outline-width:0}:host(:focus-within) .wrapper{--control__border-color:var(--focus__outline-color)}:host(.entity-selector--button-has-focus) .wrapper{outline:none}:host([disabled]){pointer-events:none}:host([disabled]) .wrapper{background-color:var(--control__background-color--disabled);border-color:var(--control__border-color--disabled)}";
 
-var l = undefined && undefined.__classPrivateFieldGet || function(t, e, i, o) {
+var d = undefined && undefined.__classPrivateFieldGet || function(t, e, i, o) {
   if (i === "a" && !o) throw new TypeError("Private accessor was defined without a getter");
   if (typeof e === "function" ? t !== e || !o : !e.has(t)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
   return i === "m" ? o : i === "a" ? o.call(t) : o ? o.value : e.get(t);
 };
 
-var d = undefined && undefined.__classPrivateFieldSet || function(t, e, i, o, s) {
+var l = undefined && undefined.__classPrivateFieldSet || function(t, e, i, o, s) {
   if (o === "m") throw new TypeError("Private method is not writable");
   if (o === "a" && !s) throw new TypeError("Private accessor was defined without a setter");
   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");
@@ -65,10 +73,10 @@ const _ = class {
         part: "wrapper",
         class: "wrapper"
       }, i("ch-edit", {
-        accessibleName: this.labelPosition === "none" && l(this, c, "f").entitySelectorInputAccessibleName,
+        accessibleName: this.labelPosition === "none" && d(this, c, "f").entitySelectorInputAccessibleName,
         class: "input",
         disabled: this.disabled,
-        name: this.name || l(this, c, "f").entitySelectorNameAttribute,
+        name: this.name || d(this, c, "f").entitySelectorNameAttribute,
         startImgSrc: this.iconSrc,
         readonly: true,
         value: ((t = this.value) === null || t === void 0 ? void 0 : t.name) || ((e = this.defaultValue) === null || e === void 0 ? void 0 : e.name),
@@ -76,26 +84,26 @@ const _ = class {
       }), i("button", {
         part: "button-clear",
         class: "icon-button",
-        "aria-label": l(this, c, "f").clearButtonLabel,
-        title: l(this, c, "f").clearButtonLabel,
+        "aria-label": d(this, c, "f").clearButtonLabel,
+        title: d(this, c, "f").clearButtonLabel,
         type: "button",
         disabled: this.disabled,
-        onClick: l(this, h, "f"),
-        onFocus: this.buttonHasFocus ? l(this, f, "f") : undefined,
-        onBlur: !this.buttonHasFocus ? l(this, f, "f") : undefined
+        onClick: d(this, h, "f"),
+        onFocus: this.buttonHasFocus ? d(this, f, "f") : undefined,
+        onBlur: !this.buttonHasFocus ? d(this, f, "f") : undefined
       }, i("ch-image", {
         class: "icon-md",
         src: w,
         disabled: this.disabled
       })), i("button", {
         class: "icon-button",
-        "aria-label": l(this, c, "f").selectButtonLabel,
-        title: l(this, c, "f").selectButtonLabel,
+        "aria-label": d(this, c, "f").selectButtonLabel,
+        title: d(this, c, "f").selectButtonLabel,
         type: "button",
         disabled: !this.selectEntityCallback || this.disabled,
-        onClick: l(this, u, "f"),
-        onBlur: !this.buttonHasFocus ? l(this, f, "f") : undefined,
-        onFocus: this.buttonHasFocus ? l(this, f, "f") : undefined
+        onClick: d(this, u, "f"),
+        onBlur: !this.buttonHasFocus ? d(this, f, "f") : undefined,
+        onFocus: this.buttonHasFocus ? d(this, f, "f") : undefined
       }, i("ch-image", {
         class: "icon-md",
         src: v,
@@ -119,14 +127,14 @@ const _ = class {
   }
   valueChangedHandler() {
     this.valueChanged.emit(this.value);
-    l(this, b, "f").call(this);
+    d(this, b, "f").call(this);
   }
   // 6.Component Lifecycle Events
   async componentWillLoad() {
-    d(this, c, await n.getComponentStrings(this.el), "f");
+    l(this, c, await n.getComponentStrings(this.el), "f");
   }
   connectedCallback() {
-    l(this, b, "f").call(this);
+    d(this, b, "f").call(this);
   }
   render() {
     return i(o, {
@@ -144,7 +152,7 @@ const _ = class {
     }, i("label", {
       class: "label",
       htmlFor: "entity-input"
-    }, this.labelCaption || l(this, c, "f").entitySelectorInputAccessibleName), l(this, p, "f").call(this)) : l(this, p, "f").call(this));
+    }, this.labelCaption || d(this, c, "f").entitySelectorInputAccessibleName), d(this, p, "f").call(this)) : d(this, p, "f").call(this));
   }
   static get assetsDirs() {
     return [ "gx-ide-assets/entity-selector" ];
@@ -165,4 +173,4 @@ b = new WeakMap;
 _.style = a;
 
 export { _ as gx_ide_entity_selector };
-//# sourceMappingURL=p-891faf90.entry.js.map
+//# sourceMappingURL=p-77c315d9.entry.js.map

package/dist/genexus-ide-ui/{p-891faf90.entry.js.map → p-77c315d9.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["entitySelectorCss","CSS_BUNDLES","SELECT_DEFAULT_ICON","getIconPath","category","name","colorType","CLEAR_ICON","GxIdeEntitySelector","_GxIdeEntitySelector_componentLocale","set","this","_GxIdeEntitySelector_btnClearClickHandler","value","defaultValue","iconSrc","_a","_GxIdeEntitySelector_btnSelectClickHandler","selectEntityCallback","then","result","_GxIdeEntitySelector_buttonFocusHandler","e","type","buttonHasFocus","_GxIdeEntitySelector_renderControl","h","part","class","accessibleName","labelPosition","__classPrivateFieldGet","entitySelectorInputAccessibleName","disabled","entitySelectorNameAttribute","startImgSrc","readonly","_b","id","clearButtonLabel","title","onClick","onFocus","undefined","onBlur","src","selectButtonLabel","_GxIdeEntitySelector_updateIconSrc","valueChangedHandler","valueChanged","emit","call","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","connectedCallback","render","Host","model","field","htmlFor","labelCaption"],"sources":["src/components/_helpers/entity-selector/entity-selector.scss?tag=gx-ide-entity-selector&encapsulation=shadow","src/components/_helpers/entity-selector/entity-selector.tsx"],"sourcesContent":["/*wrapper*/\n.wrapper {\n  display: grid;\n  grid-template-columns: 1fr max-content max-content;\n  gap: var(--mer-spacing--xs);\n  border-radius: var(--control__border-radius);\n  border: var(--control__border-width) var(--control__border-style)\n    var(--control__border-color);\n  padding: var(--control__padding-block) var(--control__padding-inline);\n\n  &:hover {\n    --control__border-color: var(--control__border-color--hover);\n  }\n  &:focus {\n  }\n}\n/*input*/\n.input {\n  --control__padding-block: 0;\n  --control__padding-inline: 0;\n  // Remove control border. We want to simulate a input that includes two buttons at the end.\n  --control__border-width: 0;\n  --focus__outline-width: 0;\n}\n:host(:focus-within) {\n  .wrapper {\n    --control__border-color: var(--focus__outline-color);\n  }\n}\n:host(.entity-selector--button-has-focus) {\n  .wrapper {\n    outline: none;\n  }\n}\n\n:host([disabled]) {\n  pointer-events: none;\n  .wrapper {\n    background-color: var(--control__background-color--disabled);\n    border-color: var(--control__border-color--disabled);\n  }\n}\n/*custom button icon*/\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Event,\n  EventEmitter,\n  Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../../common/locale\";\nimport { LabelPosition } from \"../../../common/types\";\nimport { EntityData } from \"../../../common/types\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/edit\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/form\"\n];\nconst SELECT_DEFAULT_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"show-more-horizontal\",\n  colorType: \"primary\"\n});\nconst CLEAR_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"reset\",\n  colorType: \"primary\"\n});\n\n@Component({\n  tag: \"gx-ide-entity-selector\",\n  styleUrl: \"entity-selector.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/entity-selector\"]\n})\nexport class GxIdeEntitySelector {\n  #componentLocale: any;\n\n  @Element() el: HTMLGxIdeEntitySelectorElement;\n\n  /**\n   * Adds/removes a CSS class on the host. It removes focus-within styles when\n   * focus is on a button.\n   */\n  @State() buttonHasFocus = false;\n\n  @State() iconSrc: string = null;\n\n  /**\n   * Default value for the component. Used when the 'X' button is pressed.\n   */\n  @Prop() readonly defaultValue?: EntityData | null | undefined;\n\n  /**\n   * This attribute lets you specify if the element is disabled.\n   */\n  @Prop({ reflect: true }) readonly disabled: boolean = false;\n\n  /**\n   * The label caption. Only visible if \"labelPosition\" is not \"none\".\n   * I no \"labelCaption\" is provided, a generic caption \"Select Entity\" will be provided\n   */\n  @Prop() readonly labelCaption?: string;\n\n  /**\n   * The label position\n   */\n  @Prop({ reflect: true }) readonly labelPosition?: LabelPosition =\n    \"block-start\";\n\n  /**\n   * This property specifies the `name` of the control when used in a form.\n   */\n  @Prop({ reflect: true }) readonly name?: string;\n\n  /**\n   * Callback invoked when the action button is pressed. Returns the new value.\n   */\n  @Prop() readonly selectEntityCallback!: () => Promise<EntityData> | null;\n\n  /**\n   * Value currently assigned.\n   */\n  @Prop({ mutable: true }) value: EntityData | null | undefined;\n  @Watch(\"value\")\n  valueChangedHandler() {\n    this.valueChanged.emit(this.value);\n    this.#updateIconSrc();\n  }\n\n  /**\n   * Emits the input value every time it changes\n   */\n  @Event() valueChanged: EventEmitter<EntityData>;\n\n  // 6.Component Lifecycle Events\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  connectedCallback() {\n    this.#updateIconSrc();\n  }\n\n  #btnClearClickHandler = () => {\n    this.value = this.defaultValue;\n    this.iconSrc = this.defaultValue?.iconSrc;\n  };\n\n  #btnSelectClickHandler = () => {\n    this.selectEntityCallback().then(result => {\n      if (result) {\n        this.value = result;\n      }\n    });\n  };\n\n  #buttonFocusHandler = (e: FocusEvent) => {\n    if (e.type === \"focus\") {\n      this.buttonHasFocus = true;\n    } else if (e.type === \"blur\") {\n      this.buttonHasFocus = false;\n    }\n  };\n\n  #renderControl = (): HTMLDivElement => {\n    return (\n      <div part=\"wrapper\" class=\"wrapper\">\n        <ch-edit\n          accessibleName={\n            this.labelPosition === \"none\" &&\n            this.#componentLocale.entitySelectorInputAccessibleName\n          }\n          class=\"input\"\n          disabled={this.disabled}\n          name={this.name || this.#componentLocale.entitySelectorNameAttribute}\n          startImgSrc={this.iconSrc}\n          readonly\n          value={this.value?.name || this.defaultValue?.name}\n          id=\"entity-input\"\n        ></ch-edit>\n\n        <button\n          part=\"button-clear\"\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.clearButtonLabel}\n          title={this.#componentLocale.clearButtonLabel}\n          type=\"button\"\n          disabled={this.disabled}\n          onClick={this.#btnClearClickHandler}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={CLEAR_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n\n        <button\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.selectButtonLabel}\n          title={this.#componentLocale.selectButtonLabel}\n          type=\"button\"\n          disabled={!this.selectEntityCallback || this.disabled}\n          onClick={this.#btnSelectClickHandler}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={SELECT_DEFAULT_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n      </div>\n    );\n  };\n\n  #updateIconSrc = () => {\n    if (this.value && this.value.iconSrc) {\n      this.iconSrc = this.value.iconSrc;\n    }\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          \"entity-selector--button-has-focus\": this.buttonHasFocus\n        }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        {this.labelPosition !== \"none\" ? (\n          <div\n            class={{\n              \"field\": true,\n              \"field-block\": this.labelPosition === \"block-start\",\n              \"field-inline\": this.labelPosition === \"inline-start\"\n            }}\n          >\n            <label class=\"label\" htmlFor=\"entity-input\">\n              {this.labelCaption ||\n                this.#componentLocale.entitySelectorInputAccessibleName}\n            </label>\n            {this.#renderControl()}\n          </div>\n        ) : (\n          this.#renderControl()\n        )}\n      </Host>\n    );\n  }\n}\n\nexport type EntitySelectorLabels = {\n  buttonClearLabel: string;\n  buttonSelectLabel: string;\n};\n"],"mappings":"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"}
+{"version":3,"names":["entitySelectorCss","CSS_BUNDLES","SELECT_DEFAULT_ICON","getIconPath","category","name","colorType","CLEAR_ICON","GxIdeEntitySelector","_GxIdeEntitySelector_componentLocale","set","this","_GxIdeEntitySelector_btnClearClickHandler","value","defaultValue","iconSrc","_a","_GxIdeEntitySelector_btnSelectClickHandler","selectEntityCallback","then","result","_GxIdeEntitySelector_buttonFocusHandler","e","type","buttonHasFocus","_GxIdeEntitySelector_renderControl","h","part","class","accessibleName","labelPosition","__classPrivateFieldGet","entitySelectorInputAccessibleName","disabled","entitySelectorNameAttribute","startImgSrc","readonly","_b","id","clearButtonLabel","title","onClick","onFocus","undefined","onBlur","src","selectButtonLabel","_GxIdeEntitySelector_updateIconSrc","valueChangedHandler","valueChanged","emit","call","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","connectedCallback","render","Host","model","field","htmlFor","labelCaption"],"sources":["src/components/_helpers/entity-selector/entity-selector.scss?tag=gx-ide-entity-selector&encapsulation=shadow","src/components/_helpers/entity-selector/entity-selector.tsx"],"sourcesContent":["/*wrapper*/\n.wrapper {\n  display: grid;\n  grid-template-columns: 1fr max-content max-content;\n  gap: var(--mer-spacing--xs);\n  border-radius: var(--control__border-radius);\n  border: var(--control__border-width) var(--control__border-style)\n    var(--control__border-color);\n  padding: var(--control__padding-block) var(--control__padding-inline);\n\n  &:hover {\n    --control__border-color: var(--control__border-color--hover);\n  }\n  &:focus {\n  }\n}\n/*input*/\n.input {\n  --control__padding-block: 0;\n  --control__padding-inline: 0;\n  // Remove control border. We want to simulate a input that includes two buttons at the end.\n  --control__border-width: 0;\n  --focus__outline-width: 0;\n}\n:host(:focus-within) {\n  .wrapper {\n    --control__border-color: var(--focus__outline-color);\n  }\n}\n:host(.entity-selector--button-has-focus) {\n  .wrapper {\n    outline: none;\n  }\n}\n\n:host([disabled]) {\n  pointer-events: none;\n  .wrapper {\n    background-color: var(--control__background-color--disabled);\n    border-color: var(--control__border-color--disabled);\n  }\n}\n/*custom button icon*/\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Event,\n  EventEmitter,\n  Watch\n} from \"@stencil/core\";\n\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../../common/locale\";\nimport { LabelPosition } from \"../../../common/types\";\nimport { EntityData } from \"../../../common/types\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"components/edit\",\n  \"components/button\",\n  \"components/icon\",\n  \"utils/form\"\n];\nconst SELECT_DEFAULT_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"show-more-horizontal\",\n  colorType: \"primary\"\n});\nconst CLEAR_ICON = getIconPath({\n  category: \"gemini-tools\",\n  name: \"reset\",\n  colorType: \"primary\"\n});\n\n@Component({\n  tag: \"gx-ide-entity-selector\",\n  styleUrl: \"entity-selector.scss\",\n  shadow: true,\n  assetsDirs: [\"gx-ide-assets/entity-selector\"]\n})\nexport class GxIdeEntitySelector {\n  #componentLocale: any;\n\n  @Element() el: HTMLGxIdeEntitySelectorElement;\n\n  /**\n   * Adds/removes a CSS class on the host. It removes focus-within styles when\n   * focus is on a button.\n   */\n  @State() buttonHasFocus = false;\n\n  @State() iconSrc: string = null;\n\n  /**\n   * Default value for the component. Used when the 'X' button is pressed.\n   */\n  @Prop() readonly defaultValue?: EntityData | null | undefined;\n\n  /**\n   * This attribute lets you specify if the element is disabled.\n   */\n  @Prop({ reflect: true }) readonly disabled: boolean = false;\n\n  /**\n   * The label caption. Only visible if \"labelPosition\" is not \"none\".\n   * I no \"labelCaption\" is provided, a generic caption \"Select Entity\" will be provided\n   */\n  @Prop() readonly labelCaption?: string;\n\n  /**\n   * The label position\n   */\n  @Prop({ reflect: true }) readonly labelPosition?: LabelPosition =\n    \"block-start\";\n\n  /**\n   * This property specifies the `name` of the control when used in a form.\n   */\n  @Prop({ reflect: true }) readonly name?: string;\n\n  /**\n   * Callback invoked when the action button is pressed. Returns the new value.\n   */\n  @Prop() readonly selectEntityCallback!: () => Promise<EntityData> | null;\n\n  /**\n   * Value currently assigned.\n   */\n  @Prop({ mutable: true }) value: EntityData | null | undefined;\n  @Watch(\"value\")\n  valueChangedHandler() {\n    this.valueChanged.emit(this.value);\n    this.#updateIconSrc();\n  }\n\n  /**\n   * Emits the input value every time it changes\n   */\n  @Event() valueChanged: EventEmitter<EntityData>;\n\n  // 6.Component Lifecycle Events\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  connectedCallback() {\n    this.#updateIconSrc();\n  }\n\n  #btnClearClickHandler = () => {\n    this.value = this.defaultValue;\n    this.iconSrc = this.defaultValue?.iconSrc;\n  };\n\n  #btnSelectClickHandler = () => {\n    this.selectEntityCallback().then(result => {\n      if (result) {\n        this.value = result;\n      }\n    });\n  };\n\n  #buttonFocusHandler = (e: FocusEvent) => {\n    if (e.type === \"focus\") {\n      this.buttonHasFocus = true;\n    } else if (e.type === \"blur\") {\n      this.buttonHasFocus = false;\n    }\n  };\n\n  #renderControl = (): HTMLDivElement => {\n    return (\n      <div part=\"wrapper\" class=\"wrapper\">\n        <ch-edit\n          accessibleName={\n            this.labelPosition === \"none\" &&\n            this.#componentLocale.entitySelectorInputAccessibleName\n          }\n          class=\"input\"\n          disabled={this.disabled}\n          name={this.name || this.#componentLocale.entitySelectorNameAttribute}\n          startImgSrc={this.iconSrc}\n          readonly\n          value={this.value?.name || this.defaultValue?.name}\n          id=\"entity-input\"\n        ></ch-edit>\n\n        <button\n          part=\"button-clear\"\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.clearButtonLabel}\n          title={this.#componentLocale.clearButtonLabel}\n          type=\"button\"\n          disabled={this.disabled}\n          onClick={this.#btnClearClickHandler}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={CLEAR_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n\n        <button\n          class=\"icon-button\"\n          aria-label={this.#componentLocale.selectButtonLabel}\n          title={this.#componentLocale.selectButtonLabel}\n          type=\"button\"\n          disabled={!this.selectEntityCallback || this.disabled}\n          onClick={this.#btnSelectClickHandler}\n          onBlur={!this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n          onFocus={this.buttonHasFocus ? this.#buttonFocusHandler : undefined}\n        >\n          <ch-image\n            class=\"icon-md\"\n            src={SELECT_DEFAULT_ICON}\n            disabled={this.disabled}\n          ></ch-image>\n        </button>\n      </div>\n    );\n  };\n\n  #updateIconSrc = () => {\n    if (this.value && this.value.iconSrc) {\n      this.iconSrc = this.value.iconSrc;\n    }\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          \"entity-selector--button-has-focus\": this.buttonHasFocus\n        }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        {this.labelPosition !== \"none\" ? (\n          <div\n            class={{\n              \"field\": true,\n              \"field-block\": this.labelPosition === \"block-start\",\n              \"field-inline\": this.labelPosition === \"inline-start\"\n            }}\n          >\n            <label class=\"label\" htmlFor=\"entity-input\">\n              {this.labelCaption ||\n                this.#componentLocale.entitySelectorInputAccessibleName}\n            </label>\n            {this.#renderControl()}\n          </div>\n        ) : (\n          this.#renderControl()\n        )}\n      </Host>\n    );\n  }\n}\n\nexport type EntitySelectorLabels = {\n  buttonClearLabel: string;\n  buttonSelectLabel: string;\n};\n"],"mappings":"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"}

package/dist/genexus-ide-ui/{p-18bbaa49.entry.js → p-7c95f511.entry.js}

@@ -1,6 +1,14 @@
 import { g as i, r as e, h as t, H as s, a as n } from "./p-97107ecc.js";
 
-import { g as a } from "./p-401bfc97.js";
+import { g as a } from "./p-d42e842b.js";
+
+import "./p-d4ecd3bb.js";
+
+import "lit";
+
+import "lit/directives/when.js";
+
+import "lit/directives/if-defined.js";
 
 import { L as o } from "./p-311eedf3.js";
 
@@ -33,16 +41,16 @@ const z = a({
   colorType: "on-primary"
 });
 
-const C = a({
+const j = a({
   category: "system",
   name: "check-circle",
   colorType: "success"
 });
 
 // plugin icon if no iconUri was provided
-const E = i(`./gx-ide-assets/plugin-manager/images/plugin-icon.svg`);
+const C = i(`./gx-ide-assets/plugin-manager/images/plugin-icon.svg`);
 
-const j = [ "resets/box-sizing", "chameleon/scrollbar", "components/button", "components/dropdown", "components/edit", "components/icon", "components/list-box", "components/tab", "utils/form", "utils/layout", "utils/spacing", "utils/typography" ];
+const E = [ "resets/box-sizing", "chameleon/scrollbar", "components/button", "components/dropdown", "components/edit", "components/icon", "components/list-box", "components/tab", "utils/form", "utils/layout", "utils/spacing", "utils/typography" ];
 
 const L = class {
   constructor(i) {
@@ -219,14 +227,14 @@ const L = class {
     return t(s, {
       class: "widget"
     }, t("ch-theme", {
-      model: j
+      model: E
     }), t("section", {
       class: "section"
     }, t("header", {
       class: "header"
     }, t("img", {
       class: "plugin__icon",
-      src: this.data.iconUrl || E,
+      src: this.data.iconUrl || C,
       alt: "plugin extension icon"
     }), t("div", {
       class: "plugin__details"
@@ -248,7 +256,7 @@ const L = class {
     t("p", {
       class: "installed-container subtitle-semi-bold-s"
     }, t("ch-image", {
-      src: C,
+      src: j,
       class: "icon-md"
     }), l(this, d, "f").actions.installed), this.data.installed && l(this, u, "f").call(this)))), t("div", {
       class: "main"
@@ -280,4 +288,4 @@ W = new WeakMap;
 L.style = r;
 
 export { L as gx_ide_plugin_details };
-//# sourceMappingURL=p-18bbaa49.entry.js.map
+//# sourceMappingURL=p-7c95f511.entry.js.map