import { r as registerInstance, h, H as Host } from './index-b153bfd0.js';
import './mer-animated-dots-7cbae6ef.js';
import { html, nothing } from 'lit';
import { when } from 'lit/directives/when.js';
import { ifDefined } from 'lit/directives/if-defined.js';

// TODO: The functions on this file are a WA until Chameleon 7 is released and we can reuse
// the existing functions from Chameleon. At the moment, we have to copy paste the functions
// because in Chameleon 6 we can import them.
// The following utils were copied from Chamelmeon (src/components/chat/utils.ts or src/common/utils.ts)
const getMessageSerializedContentAll = (message) => typeof message.content === "string"
    ? message.content
    : JSON.stringify(message.content, undefined, 2);
const getMessageContent = (message) => typeof message.content === "string"
    ? message.content
    : message.content.message;
/**
 * Converts an object mapping token keys to booleans into a space-separated
 * string containing the token keys that map to truthy values.
 * @example
 *   part={tokenMap({
 *     header: true,
 *     disabled: this.disabled,
 *     selected: this.selected,
 *     [levelPart]: canShowLines,
 *     "expand-button":
 *       canShowLines && !this.leaf && this.expandableButton !== "no"
 *   })}
 */
const tokenMap = (tokens) => {
    const keys = Object.keys(tokens);
    let result = "";
    for (let index = 0; index < keys.length; index++) {
        const tokenKey = keys[index];
        const tokenValue = tokens[tokenKey];
        if (tokenValue) {
            result += result === "" ? tokenKey : ` ${tokenKey}`;
        }
    }
    return result;
};
const copyToTheClipboard = (text) => navigator.clipboard.writeText(text);
const copyButtonClickHandler = (event, text) => {
    copyToTheClipboard(text);
    const button = event.currentTarget;
    if (button) {
        const buttonOriginalParts = button.getAttribute("part");
        const buttonWithCopyingParts = `${buttonOriginalParts} copying`;
        button.setAttribute("disabled", "disabled");
        button.setAttribute("part", buttonWithCopyingParts);
        setTimeout(() => {
            button.removeAttribute("disabled");
            button.setAttribute("part", buttonOriginalParts || "");
        }, 1500);
    }
};
const DEFAULT_ASSISTANT_STATUS = "complete";

const copyClickHandler = (event, message) => {
    // We use the whole message to support copying the files and/or sources
    const messageSerializedContentAll = getMessageSerializedContentAll(message);
    copyButtonClickHandler(event, messageSerializedContentAll);
};
const customActionsRender = (message, chatRef) => {
    const { accessibleName } = chatRef.translations;
    const conditionToRender1 = message.role === "assistant" &&
        (message.status === "complete" || !message.status);
    const conditionToRender2 = message.role === "error";
    return when(conditionToRender1 || conditionToRender2, () => html `<div part="actions-container"><button aria-label="${accessibleName.copyMessageContent}" part="${tokenMap({
        [`action-button action-copy-message ${message.id}`]: true,
        ...(message.parts ? { [message.parts]: true } : {})
    })}" type="button" @click="${(e) => copyClickHandler(e, message)}"></button></div>`);
};

const downloadCodeBlockCallback = (plainText, language, downloadCodeBlock) => () => downloadCodeBlock(plainText, language);
const customCodeBlockRender = (chatRef) => (options) => {
    const { accessibleName, text } = chatRef.translations;
    const downloadCb = chatRef.callbacks?.downloadCodeBlock;
    return html `<div part="code-block"><div part="code-block__header"><span part="code-block__header-caption">${options.language ?? "txt"}</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>`;
};

const DEFAULT_FILE_UPLOAD_STATE = "uploaded";
// /**
//  * Returns a skeleton element shown while a file is being uploaded.
//  *
//  * In Mercury, the loading state is visually represented in the footer,
//  * so this skeleton is currently unused. However, it is recommended to keep
//  * this function in the file in case the design changes and a visual loader
//  * inside the file container becomes necessary again.
//  *
//  * @param file - The file object containing metadata and upload state.
//  * @param fileFormat - The format type of the file (e.g., text, image, etc.).
//  * @returns A TemplateResult with the skeleton element or `nothing` if not loading.
//  */
// const fileSkeleton = (
//   file: ChatMessageFile,
//   fileFormat: keyof ChMimeTypeFormatMap
// ): TemplateResult | typeof nothing => {
//   return file.uploadState === "in-progress"
//     ? html`<div
//         part=${tokenMap({
//           [`file-skeleton format-${fileFormat} ${file.mimeType} ${
//             file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE
//           }`]: true,
//           [file.extension!]: !!file.extension,
//           [file.parts!]: !!file.parts
//         })}
//       ></div>`
//     : nothing;
// };
const fileFooter = (file, fileFormat) => {
    return html `<div class="elevation-1" part="${tokenMap({
        [`file-footer format-${fileFormat} ${file.mimeType} ${file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE}`]: true,
        [file.extension]: !!file.extension,
        [file.parts]: !!file.parts
    })}"><span part="file-caption">${file.caption}${file.extension && "." + file.extension.toLowerCase()} </span>${file.uploadState === "in-progress"
        ? html `<mer-spinner></mer-spinner>`
        : nothing}</div>`;
};
const getFileContainerParts = (file, fileFormat) => {
    return tokenMap({
        [`file-container format-${fileFormat} ${file.mimeType} ${file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE}`]: true,
        [file.extension]: !!file.extension,
        [file.parts]: !!file.parts
    });
};
const getFileParts = (file, fileFormat) => tokenMap({
    [`file format-${fileFormat} ${file.mimeType} ${file.uploadState ?? DEFAULT_FILE_UPLOAD_STATE}`]: true,
    [file.extension]: !!file.extension,
    [file.parts]: !!file.parts
});
// TODO: Improve accessibility by exposing progress or spin states while
// uploading
const customFileRenders = {
    audio: (file) => {
        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>`;
    },
    video: (file) => {
        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>`;
    },
    image: (file) => {
        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>`;
    },
    file: (file) => {
        const disabledWhileUploading = file.uploadState === "in-progress";
        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>`;
    }
};

/*
README:
This file contains two utilities:

1) [Sections for customitizing the ch-chat renderItem]
The following sections are being customized at the time of writting:
- actions: customActionsRender,
- codeBlock: customCodeBlockRender,
- content: customContentRender

What for?

- actions: In order to be able to customize the copy button, by adding a part
"copying" when the user copies the message. This additional part allows changing
the current button icon of "copy" to a "checked" icon.
- codeBlock: Same reason as "actions" section.
- content: Mercury includes a "header" section for the assistant message. This
header includes an avatar, the assistant name, and optionally the message time.
This header requires custom markup, and for this reason this section has to be
customized.

2) [Configuration for the ch-chat sendContainerLayout property]
The chat styles are designed for a specific layout, so users must use the sendContainerLayout provided by Mercury. Customizing it is not supported.
*/
// 1) [Sections for customitizing the ch-chat renderItem.]
/**
 * Mercury section that includes the assistant the assistant name, and an optional message time.
 *
 * @param messageMetaData - Metadata containing agentName and time
 * @returns TemplateResult rendering the assistant message header
 */
const messageHeader = (message) => {
    if (message.role === "system" || message.role === "user") {
        return nothing; // TODO: Improve type safety in the ch-chat (nicolas-camera_globant)
    }
    const agentName = message.metadata?.agentName;
    const assistantId = agentName?.toLowerCase().replace(/ /g, "-");
    const messageTime = message.metadata?.time;
    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>${message.role === "assistant" && message.status === "waiting"
        ? html `<mer-animated-dots></mer-animated-dots>`
        : nothing}</div>${messageTime
        ? html `<time datetime="${messageTime}" part="header__time assistant">${messageTime}</time>`
        : nothing}</div>`;
};
// customzied in order to add the custom "messageHeader"
const customAssistantContentRender = (message, chatRef, codeBlockRender) => {
    const messageContent = getMessageContent(message);
    return message.status === "waiting"
        ? html `<div class="assistant-loading" part="${tokenMap({
            [`assistant content waiting ${message.id}`]: true,
            ...(message.parts ? { [message.parts]: true } : {})
        })}">${messageContent}</div>`
        : html `<ch-markdown-viewer part="${tokenMap({
            [`assistant content ${message.id} ${message.status ?? DEFAULT_ASSISTANT_STATUS}`]: true,
            ...(message.parts ? { [message.parts]: true } : {})
        })}" .renderCode="${
        // WA: Define codeBlockRender as "never" to avoid types incompatibility:
        // codeBlockRender returns TemplateResult and renderCode expects TemplateResult | undefined
        // In Chameleon this type mismatch does not happens. TODO: Evaluate a solution in Chameleon.
        codeBlockRender(chatRef)}" .showIndicator="${message.status === "streaming"}" .theme="${chatRef.markdownTheme ?? undefined}" .value="${messageContent}"></ch-markdown-viewer>`;
};
// Customized in order to add the custom "messageHeader"
const customErrorContentRender = (message, chatRef, codeBlockRender) => {
    const errorContent = getMessageContent(message);
    return html `<ch-markdown-viewer part="${tokenMap({
        [`error content ${message.id}`]: true,
        ...(message.parts ? { [message.parts]: true } : {})
    })}" .renderCode="${
    // WA: Define codeBlockRender as "never" to avoid types incompatibility:
    // codeBlockRender returns TemplateResult and renderCode expects TemplateResult | undefined
    // In Chameleon this type mismatch does not happens. TODO: Evaluate a solution in Chameleon.
    codeBlockRender(chatRef)}" .theme="${chatRef.markdownTheme ?? undefined}" .value="${errorContent}"></ch-markdown-viewer>`;
};
// No modification. It is required to be defined.
const defaultSystemContentRender = () => "string | TemplateResult";
// No modification. It is required to be defined.
const defaultUserContentRender = (messageModel) => getMessageContent(messageModel) ?? "";
const contentRenderByRole = {
    // TODO: Check if each contentRender can be optional, since it may be not me required to implement
    // a custom render for each type of content. ie.: Mercury does not requres to customize "system" and "user"
    assistant: customAssistantContentRender,
    error: customErrorContentRender,
    system: defaultSystemContentRender, // No modification
    user: defaultUserContentRender // No modification
};
const customContentRender = (message, chatRef, codeBlockRender) => contentRenderByRole[message.role](message, chatRef, codeBlockRender);
const renderItem = {
    actions: customActionsRender,
    contentBefore: messageHeader,
    codeBlock: customCodeBlockRender,
    content: customContentRender,
    file: customFileRenders
};
// 2) [Configuration for the ch-chat sendContainerLayout property]
const sendContainerLayout = {
    sendInputAfter: [
        "attach-files-button",
        "live-audio-button",
        "send-button",
        "chat-attached-files-viewer"
    ],
    sendContainerAfter: ["live-audio-container"]
};

const ASSISTANT_RESPONSE_SHORT_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```json\n{\n  "firstName": "John",\n  "lastName": "Smith",\n  "age": 25\n}';
const ASSISTANT_NAME = "Nexa";
// - - - - - - - - - - - - - -
// Other messages
// - - - - - - - - - - - - - -
const ASSISTANT_RESPONSE_MARKDOWN = `
###### Code block {#code-block}
To create code blocks, you’ll use three backticks (\` \`\`\` \`) or three tildes (\`~~~\`) on the lines before and after the code block.

\`\`\`
{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}
\`\`\`

Another way to create code blocks is to indent every line of the block by at least four spaces or one tab.

    <html>
      <head>
      </head>
    </html>


###### Syntax Highlighting {#syntax-highlighting}
This feature allows you to add color highlighting for whatever language your code was written in.
To add syntax highlighting, specify a language next to the backticks before the fenced code block.

\`\`\`json
{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}
\`\`\`

\`\`\`javascript
import React from 'react'
import ReactDOM from 'react-dom'
import Markdown from 'react-markdown'
import rehypeHighlight from 'rehype-highlight'

const markdown = \`
# Your markdown here
\`

ReactDOM.render(
  <Markdown rehypePlugins={[rehypeHighlight]}>{markdown}</Markdown>,
  document.querySelector('#content')
)
\`\`\`

###### Horizontal Rules {#horizontal-rules}
To create a horizontal rule, use three or more asterisks (\`***\`), dashes (\`---\`), or underscores (\`___\`) on a line by themselves.
`;
Array.from({ length: 40 }, (_, index) => index % 2 === 0
    ? {
        id: `index: ${index}`,
        role: "user",
        content: `index: ${index}` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n`
    }
    : {
        id: `index: ${index}`,
        role: "assistant",
        content: ASSISTANT_RESPONSE_SHORT_MARKDOWN +
            `\nindex: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n` +
            `index: ${index}\n`
    });
const codeFixerRecord = [
    {
        id: "1",
        role: "user",
        content: "Please give me an example about...",
        metadata: "14:55"
    },
    {
        id: "2",
        role: "assistant",
        status: "complete",
        content: "Action required example. Action required example. Action required example.",
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        }
    },
    {
        id: "3",
        role: "assistant",
        status: "complete",
        content: "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.",
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        },
        parts: "warning"
    },
    {
        id: "4",
        role: "error",
        content: "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.",
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        }
    },
    {
        id: "5",
        role: "assistant",
        status: "complete",
        content: "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.",
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        },
        parts: "success"
    },
    {
        id: "6",
        role: "user",
        content: "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",
        metadata: "15:00"
    },
    {
        id: "7",
        role: "assistant",
        status: "complete",
        content: "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.",
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        }
    },
    {
        id: "8",
        role: "assistant",
        status: "waiting",
        content: "You can provide further details or updates",
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        }
    },
    {
        id: "9",
        role: "assistant",
        status: "complete",
        content: ASSISTANT_RESPONSE_SHORT_MARKDOWN,
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        }
    }
];

const PROCESSING_PLACEHOLDER = "{{ASSISTANT_NAME}}";
const sendChatMessages = (chatRef) => () => {
    chatRef.waitingResponse = true;
    chatRef.addNewMessage({
        id: `${new Date().getTime()}`,
        role: "assistant",
        content: "Analyzing",
        status: "waiting",
        metadata: {
            agentName: ASSISTANT_NAME,
            time: "14:25"
        }
    });
    setTimeout(() => {
        chatRef.updateLastMessage({
            role: "assistant",
            content: "Processing with Chat with LLMs",
            status: "waiting",
            metadata: {
                agentName: ASSISTANT_NAME,
                time: "14:25"
            }
        }, "replace");
        setTimeout(() => {
            dummyStreaming(chatRef, 20, ASSISTANT_RESPONSE_MARKDOWN, "replace");
        }, 2000);
    }, 2000);
};
const stopResponseAnswer = () => {
    console.log("stop generating answer");
    return new Promise(resolve => {
        // Lógica asincrónica aquí si es necesario
        resolve();
    });
};
const chatCallbacksWithChatRef = (chChatRef) => {
    return {
        sendChatMessages: sendChatMessages(chChatRef),
        uploadFile: (file) => new Promise(() => {
            console.log("file", file);
            return Promise.resolve({
                url: "Error",
                mimeType: "application/javascript"
            });
        }),
        stopResponse: stopResponseAnswer
    };
};
function dummyStreaming(chatRef, counter, stringToDisplay, mode) {
    setTimeout(() => {
        const streamingCompleted = counter >= stringToDisplay.length;
        chatRef.updateLastMessage({
            role: "assistant",
            content: stringToDisplay.substring(counter - 20, counter),
            // {
            //   message: stringToDisplay.substring(counter - 20, counter),
            //   files: streamingCompleted
            //     ? [
            //         {
            //           url: "https://next.genexus.ai",
            //           caption: "Mars Exploration Contract"
            //         },
            //         {
            //           url: "https://gx-chameleon.netlify.app",
            //           caption: "Venus Exploration Contract"
            //         }
            //       ]
            //     : undefined
            // },
            status: streamingCompleted ? "complete" : "streaming",
            metadata: {
                agentName: ASSISTANT_NAME,
                time: "14:25"
            }
        }, mode);
        if (!streamingCompleted) {
            dummyStreaming(chatRef, counter + 20, stringToDisplay, "concat");
        }
        else {
            chatRef.waitingResponse = false;
        }
    }, counter % 200 === 0 ? 50 : 40);
}
const chatTranslations = {
    accessibleName: {
        clearChat: "Clear chat",
        copyMessageContent: "Copy message",
        downloadCodeButton: "Download code",
        sendButton: "Send",
        sendInput: "Message",
        stopResponseButton: "Stop generating answer"
    },
    placeholder: {
        sendInput: "Ask me a question..."
    },
    text: {
        copyCodeButton: "Copy code",
        copyMessageContent: "Copy message content",
        downloadCodeButton: "Download code",
        processing: `Processing with ${PROCESSING_PLACEHOLDER}`,
        sourceFiles: "Source files:",
        stopResponseButton: ""
    }
};

const chatShowcaseCss = ":host{block-size:100%;display:grid}";

var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
    if (kind === "a" && !f)
        throw new TypeError("Private accessor was defined without a getter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
        throw new TypeError("Cannot read private member from an object whose class did not declare it");
    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
    if (kind === "m")
        throw new TypeError("Private method is not writable");
    if (kind === "a" && !f)
        throw new TypeError("Private accessor was defined without a setter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
        throw new TypeError("Cannot write private member to an object whose class did not declare it");
    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var _GxIdeScChatContainer_chatContainerRef, _GxIdeScChatContainer_chatWelcomeRef, _GxIdeScChatContainer_chChatRef, _GxIdeScChatContainer_chatCallbacks, _GxIdeScChatContainer_copyConversationCallbackHandler, _GxIdeScChatContainer_deleteConversationCallbackHandler, _GxIdeScChatContainer_suggestedPrompRequestedCallbackHandler;
const CSS_BUNDLES = [
    "resets/box-sizing",
    "utils/elevation",
    "components/chat",
    "components/markdown-viewer"
];
const GxIdeScChatContainer = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        _GxIdeScChatContainer_chatContainerRef.set(this, void 0);
        _GxIdeScChatContainer_chatWelcomeRef.set(this, void 0);
        _GxIdeScChatContainer_chChatRef.set(this, void 0);
        _GxIdeScChatContainer_chatCallbacks.set(this, void 0);
        _GxIdeScChatContainer_copyConversationCallbackHandler.set(this, () => {
            __classPrivateFieldGet(this, _GxIdeScChatContainer_chatContainerRef, "f").showCopyConversationMessage();
        });
        _GxIdeScChatContainer_deleteConversationCallbackHandler.set(this, () => { });
        _GxIdeScChatContainer_suggestedPrompRequestedCallbackHandler.set(this, async (prompt) => {
            let assistantFinalResponse;
            if (prompt.toLowerCase().includes("transaction")) {
                assistantFinalResponse =
                    '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.';
            }
            else if (prompt.toLowerCase().includes("entity")) {
                assistantFinalResponse =
                    '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.';
            }
            else {
                assistantFinalResponse =
                    "Sorry, I didn’t catch that—mind rephrasing it? 😅";
            }
            const userPrompt = {
                id: "1",
                role: "user",
                content: prompt
            };
            __classPrivateFieldGet(this, _GxIdeScChatContainer_chChatRef, "f").addNewMessage(userPrompt);
            setTimeout(() => {
                __classPrivateFieldGet(this, _GxIdeScChatContainer_chChatRef, "f").addNewMessage({
                    id: `${new Date().getTime()}`,
                    role: "assistant",
                    content: "Analyzing",
                    status: "waiting"
                });
                setTimeout(() => {
                    __classPrivateFieldGet(this, _GxIdeScChatContainer_chChatRef, "f").updateLastMessage({
                        role: "assistant",
                        content: "Processing with Chat with LLMs",
                        status: "waiting"
                    }, "replace");
                    setTimeout(() => {
                        __classPrivateFieldGet(this, _GxIdeScChatContainer_chChatRef, "f").updateLastMessage({
                            role: "assistant",
                            content: "Getting information",
                            status: "waiting"
                        }, "replace");
                        __classPrivateFieldGet(this, _GxIdeScChatContainer_chChatRef, "f").updateLastMessage({
                            role: "assistant",
                            content: assistantFinalResponse,
                            status: "complete"
                        }, "replace");
                    }, 1500);
                }, 1500);
            }, 100);
        });
        this.mode = "messages-sample";
        this.generatingResponse = false;
        this.loadingState = "all-records-loaded";
        this.showAdditionalContent = false;
        this.conversationCopied = false;
        this.assistantStatus = "Getting Data";
        this.chatItems = [];
    }
    /**
     * It will exit the wellcome screen and remove it from the dom.
     */
    async exitWelcome() {
        // hand exitWelcome to gx-ide-chat-welcome
        __classPrivateFieldGet(this, _GxIdeScChatContainer_chatWelcomeRef, "f").exitWelcome();
    }
    componentDidLoad() {
        setTimeout(() => {
            this.assistantStatus = "Creating Data Base..";
        }, 1000);
    }
    componentDidRender() {
        if (!__classPrivateFieldGet(this, _GxIdeScChatContainer_chatCallbacks, "f") && __classPrivateFieldGet(this, _GxIdeScChatContainer_chChatRef, "f")) {
            __classPrivateFieldSet(this, _GxIdeScChatContainer_chatCallbacks, chatCallbacksWithChatRef(__classPrivateFieldGet(this, _GxIdeScChatContainer_chChatRef, "f")), "f");
        }
    }
    async componentWillLoad() {
        if (this.mode === "messages-sample") {
            this.chatItems = codeFixerRecord;
        }
        else if (this.mode === "welcome") {
            this.chatItems = [];
        }
        else if (this.mode === "empty") {
            this.chatItems = [
                {
                    id: "1",
                    role: "assistant",
                    status: "complete",
                    content: "Hello! I am your assistant.",
                    metadata: "14:56"
                }
            ];
        }
    }
    render() {
        return (h(Host, null, h("ch-theme", { model: CSS_BUNDLES }), h("gx-ide-chat-container", { chatTitle: "GeneXus Assistant", copyConversationCallback: __classPrivateFieldGet(this, _GxIdeScChatContainer_copyConversationCallbackHandler, "f"), deleteConversationCallback: __classPrivateFieldGet(this, _GxIdeScChatContainer_deleteConversationCallbackHandler, "f"), ref: el => (__classPrivateFieldSet(this, _GxIdeScChatContainer_chatContainerRef, el, "f")), class: "elevation-1" }, h("ch-chat", { callbacks: __classPrivateFieldGet(this, _GxIdeScChatContainer_chatCallbacks, "f"), class: "chat", waitingResponse: this.generatingResponse, loadingState: this.loadingState, renderItem: renderItem, items: this.chatItems, showAdditionalContent: false, sendContainerLayout: sendContainerLayout, translations: chatTranslations, ref: (el) => (__classPrivateFieldSet(this, _GxIdeScChatContainer_chChatRef, el, "f")), markdownTheme: "components/markdown-viewer" }, h("gx-ide-chat-welcome", { ref: el => (__classPrivateFieldSet(this, _GxIdeScChatContainer_chatWelcomeRef, el, "f")), slot: "empty-chat", suggestedPrompRequestedCallback: __classPrivateFieldGet(this, _GxIdeScChatContainer_suggestedPrompRequestedCallbackHandler, "f") }), h("div", { slot: "additional-content" }, "Custom content that is rendered when the chat renders content")))));
    }
};
_GxIdeScChatContainer_chatContainerRef = new WeakMap(), _GxIdeScChatContainer_chatWelcomeRef = new WeakMap(), _GxIdeScChatContainer_chChatRef = new WeakMap(), _GxIdeScChatContainer_chatCallbacks = new WeakMap(), _GxIdeScChatContainer_copyConversationCallbackHandler = new WeakMap(), _GxIdeScChatContainer_deleteConversationCallbackHandler = new WeakMap(), _GxIdeScChatContainer_suggestedPrompRequestedCallbackHandler = new WeakMap();
GxIdeScChatContainer.style = chatShowcaseCss;

export { GxIdeScChatContainer as gx_ide_sc_chat_container };

//# sourceMappingURL=gx-ide-sc-chat-container.entry.js.map