@genexus/genexus-ide-ui 1.1.55 → 1.1.57

package/dist/collection/components/chat/chat-container/gx-ide-assets/chat-container/chat-lit.css

@@ -1,376 +0,0 @@
-.chat-lit::part(header__time assistant),
-.chat-lit::part(send-input),
-.chat-lit::part(assistant content waiting),
-.chat-lit::part(send-button),
-.chat-lit::part(stop-generating-answer-button) {
-  line-height: var(--line-height-tight);
-}
-.chat-lit::part(send-input),
-.chat-lit::part(send-button),
-.chat-lit::part(stop-generating-answer-button) {
-  font-size: var(--font-size-body-m);
-}
-.chat-lit::part(header__time assistant),
-.chat-lit::part(assistant content waiting) {
-  font-size: var(--font-size-body-s);
-}
-.chat-lit::part(send-input) {
-  font-weight: var(--font-weight-regular);
-}
-.chat-lit::part(message),
-.chat-lit::part(assistant copy-message-content) {
-  font-size: var(--font-size-body-m);
-  line-height: var(--line-height-tight);
-  font-weight: var(--font-weight-regular);
-}
-.chat-lit::part(send-button),
-.chat-lit::part(stop-generating-answer-button) {
-  font-weight: var(--font-weight-semi-bold);
-}
-.chat-lit::part(header__time assistant),
-.chat-lit::part(assistant content waiting) {
-  font-weight: var(--font-weight-regular);
-  font-style: italic;
-}
-.chat-lit::part(assistant copy-message-content),
-.chat-lit::part(send-button),
-.chat-lit::part(stop-generating-answer-button) {
-  display: inline-grid;
-  grid-auto-flow: column;
-  grid-auto-columns: max-content;
-  justify-content: center;
-  border-width: var(--control__border-width);
-  border-style: var(--control__border-style);
-  border-color: var(--control__border-color);
-  border-radius: var(--control__border-radius);
-  padding-block: var(--control__padding-block);
-  padding-inline: var(--control__padding-inline);
-  box-sizing: border-box;
-  background-color: var(--button-background-color);
-  color: var(--button-color);
-}
-.chat-lit::part(assistant copy-message-content):focus-visible,
-.chat-lit::part(send-button):focus-visible,
-.chat-lit::part(stop-generating-answer-button):focus-visible {
-  outline: var(--focus__outline-width) var(--focus__outline-style)
-    var(--focus__outline-color);
-  outline-offset: var(--focus__outline-offset);
-}
-.chat-lit::part(send-button),
-.chat-lit::part(stop-generating-answer-button) {
-  --button-background-color: transparent;
-  --control__border-color: var(--button-color);
-  --button-color: var(--mer-text__neutral);
-  --button-color--enabled: var(--mer-text__neutral);
-  --button-color--active: var(--mer-text__on-primary--active);
-}
-.chat-lit::part(send-button):hover,
-.chat-lit::part(stop-generating-answer-button):hover {
-  --button-color: var(--mer-text__primary--hover);
-}
-.chat-lit::part(send-button):active,
-.chat-lit::part(stop-generating-answer-button):active {
-  --control__border-color: var(--mer-border-color__primary--active);
-  --button-color: var(--button-color--active);
-}
-.chat-lit::part(send-button):disabled,
-.chat-lit::part(stop-generating-answer-button):disabled {
-  --button-color: var(--mer-text__on-disabled);
-}
-.chat-lit::part(assistant copy-message-content) {
-  --button-background-color: transparent;
-  --control__border-color: transparent;
-  --button-color: var(--mer-text__primary);
-}
-.chat-lit::part(assistant copy-message-content):hover {
-  --button-color: var(--mer-text__primary--hover);
-}
-.chat-lit::part(assistant copy-message-content):active {
-  --button-color: var(--mer-text__primary--active);
-}
-.chat-lit::part(assistant copy-message-content):disabled {
-  --button-color: var(--mer-text__on-disabled);
-}
-.chat-lit::part(assistant copy-message-content),
-.chat-lit::part(send-button),
-.chat-lit::part(stop-generating-answer-button) {
-  padding: calc(
-    (
-        var(--control__block-size) - 2 * var(--control__border-width) -
-          var(--mer-icon__box--md)
-      ) /
-      2
-  );
-  border-width: var(--control__border-width);
-  border-style: var(--control__border-style);
-  border-color: var(--control__border-color);
-  border-radius: var(--control__border-radius);
-}
-.chat-lit::part(send-input) {
-  --ch-edit-gap: var(--control__icon-gap);
-  --ch-edit__image-size: var(--mer-icon__box--md);
-  --ch-placeholder-color: var(--mer-color__neutral-gray--400);
-  border-width: var(--control__border-width);
-  border-style: var(--control__border-style);
-  border-color: var(--control__border-color);
-  border-radius: var(--control__border-radius);
-  background-color: var(--control__bg-color);
-  color: var(--control__color);
-  --ch-placeholder-color: var(--control-placeholder__color);
-  padding-block: var(--control__padding-block);
-  padding-inline: var(--control__padding-inline);
-}
-.chat-lit::part(send-input):focus {
-  outline: var(--focus__outline-width) var(--focus__outline-style)
-    var(--focus__outline-color);
-  outline-offset: var(--focus__outline-offset);
-}
-.chat-lit::part(send-input):hover {
-  --control__border-color: var(--control__border-color--hover);
-}
-.chat-lit {
-  --button-block-size: 31px;
-  --button-margin-block: var(--mer-spacing--md);
-  --font-weight-regular: 100;
-  --line-height-tight: 1.4;
-  --send-input-block-padding: 16px;
-  --send-input-inline-start-padding: 10px;
-  --send-input-inline-end-padding: 10px;
-  --send-input-inline-size: 32px;
-}
-.chat-lit::part(messages-container) {
-  gap: var(--mer-spacing--md);
-  padding: var(--mer-spacing--md);
-}
-.chat-lit-with-file-upload {
-  --send-input-block-padding: 10px;
-  --send-input-inline-start-padding: 2px;
-}
-.chat-lit-with-file-upload::part(send-input) {
-  grid-template: "file-upload-menu ch-edit-content live-audio-button" 1fr / max-content 1fr max-content;
-}
-.chat-lit-with-file-viewer::part(send-input) {
-  grid-template: "file-upload-menu ch-edit-content live-audio-button" 1fr "file-viewer file-viewer file-viewer" max-content/max-content 1fr;
-}
-.chat-lit::part(message) {
-  --message-content-border-color: transparent;
-  --time-display: initial;
-  color: var(--mer-color__neutral-gray--100);
-}
-.chat-lit::part(message user) {
-  background-color: var(--mer-color__chat-message--user);
-  max-inline-size: 90%;
-  justify-self: end;
-}
-.chat-lit::part(message user),
-.chat-lit::part(error content),
-.chat-lit::part(assistant content warning),
-.chat-lit::part(assistant content success) {
-  padding: var(--mer-spacing--sm);
-  border-radius: var(--mer-border__radius--sm);
-}
-.chat-lit::part(assistant copy-message-content)::before {
-  --button-icon: var(--icon__system_copy_primary--enabled);
-  content: "";
-  inline-size: var(--mer-icon__box--md);
-  block-size: var(--mer-icon__box--md);
-  content: "";
-  display: grid;
-  -webkit-mask: no-repeat center/100% var(--button-icon);
-  background-color: currentColor;
-}
-.chat-lit::part(assistant copy-message-content copying)::before {
-  --button-icon: var(--icon__system_check_on-elevation--enabled);
-}
-.chat-lit::part(header assistant) {
-  align-items: center;
-  display: flex;
-  font-size: 12px;
-  justify-content: space-between;
-  margin-block-end: var(--mer-spacing--sm);
-}
-.chat-lit::part(header__start assistant) {
-  align-items: center;
-  display: flex;
-  gap: var(--mer-spacing--xs);
-}
-.chat-lit::part(header__avatar-container assistant) {
-  position: relative;
-  inline-size: 26px;
-  block-size: 26px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.chat-lit::part(header__avatar-border assistant) {
-  position: absolute;
-  overflow: hidden;
-  inline-size: 100%;
-  block-size: 100%;
-  background: linear-gradient(
-    90deg,
-    var(
-        --chat-avatar-border-color-from,
-        var(--mer-color__chat-avatar-circle-from)
-      )
-      0%,
-    var(--chat-avatar-border-color-to, var(--mer-color__chat-avatar-circle-to))
-      100%
-  );
-  border-radius: 50%;
-  -webkit-mask-image: radial-gradient(
-    circle 12px at center,
-    transparent 98%,
-    black 100%
-  );
-  mask-image: radial-gradient(
-    circle 12px at center,
-    transparent 98%,
-    black 100%
-  );
-}
-.chat-lit::part(header__avatar-image assistant) {
-  position: absolute;
-  display: block;
-  width: calc(100% - 6px);
-  height: calc(100% - 6px);
-  border-radius: 50%;
-  background-image: var(--icon__system_assistant-fill_primary--active);
-  background-color: var(
-    --chat-avatar-background-color,
-    var(--mer-color__primary--300)
-  );
-  background-size: 80%;
-  background-repeat: no-repeat;
-  background-position: center center;
-}
-.chat-lit::part(header__role assistant) {
-  display: inline-grid;
-  gap: 6px;
-  grid-template-columns: max-content max-content;
-}
-.chat-lit::part(header__role assistant)::before {
-  align-self: center;
-  background-color: currentColor;
-  block-size: var(--mer-spacing--2xs);
-  border-radius: 50%;
-  content: "";
-  display: grid;
-  inline-size: var(--mer-spacing--2xs);
-  justify-self: flex-end;
-}
-.chat-lit::part(header__time assistant) {
-  display: var(--time-display);
-  color: var(--mer-text__complementary);
-}
-.chat-lit::part(error content),
-.chat-lit::part(assistant content warning),
-.chat-lit::part(assistant content success) {
-  display: grid;
-  grid-template-columns: max-content 1fr;
-  gap: var(--mer-spacing--sm);
-  align-items: center;
-}
-.chat-lit::part(error content)::before,
-.chat-lit::part(assistant content warning)::before,
-.chat-lit::part(assistant content success)::before {
-  block-size: var(--mer-spacing--md);
-  content: "";
-  display: grid;
-  inline-size: var(--mer-spacing--md);
-  justify-self: flex-end;
-  background: var(--chat-message-icon) no-repeat center center/contain;
-}
-.chat-lit::part(error content) {
-  background-color: var(--mer-color__chat-message--error);
-  --chat-message-icon: var(--icon__system_warning_error--enabled);
-}
-.chat-lit::part(assistant content warning) {
-  background-color: var(--mer-color__chat-message--warning);
-  --chat-message-icon: var(--icon__system_warning_warning--enabled);
-}
-.chat-lit::part(assistant content success) {
-  background-color: var(--mer-color__chat-message--success);
-  --chat-message-icon: var(--icon__system_check_success--enabled);
-}
-.chat-lit::part(assistant content waiting) {
-  display: flex;
-  gap: var(--mer-spacing--xs);
-}
-.chat-lit::part(send-container) {
-  background-color: var(--mer-surface__elevation--02);
-  border-radius: var(--mer-spacing--2xs);
-  position: relative;
-  margin: var(--mer-spacing--md);
-}
-.chat-lit::part(send-input-wrapper) {
-  position: relative;
-}
-.chat-lit::part(send-input) {
-  --ch-edit-gap: var(--control__icon-gap);
-  --ch-edit__image-size: var(--mer-icon__box--md);
-  --ch-placeholder-color: var(--control-placeholder__color);
-  border-width: 0 !important;
-  background-color: rgba(0, 0, 0, 0) !important;
-  border-color: var(--mer-color__neutral-gray--900);
-  border-radius: var(--control__border-radius);
-  border-style: var(--control__border-style);
-  color: var(--control__color);
-  padding-block: var(--send-input-block-padding);
-  padding-inline-start: var(--send-input-inline-start-padding);
-  padding-inline-end: calc(
-    var(--send-input-inline-end-padding) * 2 + var(--send-input-inline-size)
-  );
-}
-.chat-lit::part(send-input):hover {
-  --control__border-color: var(--control__border-color--hover);
-}
-.chat-lit::part(send-input):focus {
-  outline: var(--focus__outline-width) var(--focus__outline-style)
-    var(--focus__outline-color);
-  outline-offset: var(--focus__outline-offset);
-}
-.chat-lit::part(send-button),
-.chat-lit::part(stop-generating-answer-button) {
-  position: absolute;
-  inset-inline-end: var(--send-input-inline-end-padding);
-  inset-block-end: var(--send-input-inline-end-padding);
-}
-.chat-lit::part(send-button) {
-  --icon-path: var(--icon__system_send_neutral--enabled);
-  z-index: 1;
-}
-.chat-lit::part(send-button):hover {
-  --icon-path: var(--icon__system_send_neutral--hover);
-}
-.chat-lit::part(send-button):active {
-  --icon-path: var(--icon__system_send_neutral--active);
-}
-.chat-lit::part(stop-generating-answer-button) {
-  --icon-path: var(--icon__system_cancel-circle_neutral--enabled);
-  font-size: 0 !important;
-  background-color: var(--mer-surface__elevation--02);
-  z-index: 2;
-}
-.chat-lit::part(stop-generating-answer-button):hover {
-  --icon-path: var(--icon__system_cancel-circle_neutral--hover);
-}
-.chat-lit::part(stop-generating-answer-button):active {
-  --icon-path: var(--icon__system_cancel-circle_neutral--active);
-}
-.chat-lit::part(send-button)::before,
-.chat-lit::part(stop-generating-answer-button)::before {
-  content: "";
-  display: inline-block;
-  inline-size: var(--mer-icon__box--md);
-  block-size: var(--mer-icon__box--md);
-  background: no-repeat center/var(--mer-icon__size--md) var(--icon-path);
-}
-@keyframes spin {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}

package/dist/collection/components/chat/lit-custom-render/actions.lit.js

@@ -1,27 +0,0 @@
-import { html } from "lit";
-import { when } from "lit/directives/when.js";
-import { copyButtonClickHandler, getMessageSerializedContentAll, tokenMap } from "./utils";
-const copyClickHandler = (event, message) => {
-    // We use the whole message to support copying the files and/or sources
-    const messageSerializedContentAll = getMessageSerializedContentAll(message);
-    copyButtonClickHandler(event, messageSerializedContentAll);
-};
-export 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=${
-    // TODO: Don't set aria-label if it equals to the caption
-    accessibleName.copyMessageContent}
-          part=${tokenMap(Object.assign({ [`assistant copy-message-content ${message.id}`]: true }, (message.parts ? { [message.parts]: true } : {})))}
-          type="button"
-          @click=${(e) => copyClickHandler(e, message)}
-        >
-          <!-- icon only button type -->
-        </button>
-      </div>`);
-};
-//# sourceMappingURL=actions.lit.js.map

package/dist/collection/components/chat/lit-custom-render/actions.lit.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"actions.lit.js","sourceRoot":"","sources":["../../../../src/components/chat/lit-custom-render/actions.lit.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAM9C,OAAO,EACL,sBAAsB,EACtB,8BAA8B,EAC9B,QAAQ,EACT,MAAM,SAAS,CAAC;AAEjB,MAAM,gBAAgB,GAAG,CAAC,KAAY,EAAE,OAAoB,EAAE,EAAE;IAC9D,uEAAuE;IACvE,MAAM,2BAA2B,GAAG,8BAA8B,CAAC,OAAO,CAAC,CAAC;IAC5E,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,CAAC,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAsB,CACpD,OAAoB,EACpB,OAA0B,EACrB,EAAE;IACP,MAAM,EAAE,cAAc,EAAE,GAAG,OAAO,CAAC,YAAY,CAAC;IAEhD,MAAM,kBAAkB,GACtB,OAAO,CAAC,IAAI,KAAK,WAAW;QAC5B,CAAC,OAAO,CAAC,MAAM,KAAK,UAAU,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IACrD,MAAM,kBAAkB,GAAG,OAAO,CAAC,IAAI,KAAK,OAAO,CAAC;IAEpD,OAAO,IAAI,CACT,kBAAkB,IAAI,kBAAkB,EACxC,GAAG,EAAE,CACH,IAAI,CAAA;;uBAEa;IACX,yDAAyD;IACzD,cAAc,CAAC,kBACjB;iBACO,QAAQ,iBACb,CAAC,kCAAkC,OAAO,CAAC,EAAE,EAAE,CAAC,EAAE,IAAI,IACnD,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACnD;;mBAEO,CAAC,CAAa,EAAE,EAAE,CAAC,gBAAgB,CAAC,CAAC,EAAE,OAAO,CAAC;;;;aAIrD,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { html } from \"lit\";\nimport { when } from \"lit/directives/when.js\";\n\nimport type {\n  ChatActionsRender,\n  ChatMessage\n} from \"@genexus/chameleon-controls-library/dist/types/components/chat/types\";\nimport {\n  copyButtonClickHandler,\n  getMessageSerializedContentAll,\n  tokenMap\n} from \"./utils\";\n\nconst copyClickHandler = (event: Event, message: ChatMessage) => {\n  // We use the whole message to support copying the files and/or sources\n  const messageSerializedContentAll = getMessageSerializedContentAll(message);\n  copyButtonClickHandler(event, messageSerializedContentAll);\n};\n\nexport const customActionsRender: ChatActionsRender = (\n  message: ChatMessage,\n  chatRef: HTMLChChatElement\n): any => {\n  const { accessibleName } = chatRef.translations;\n\n  const conditionToRender1 =\n    message.role === \"assistant\" &&\n    (message.status === \"complete\" || !message.status);\n  const conditionToRender2 = message.role === \"error\";\n\n  return when(\n    conditionToRender1 || conditionToRender2,\n    () =>\n      html`<div part=\"actions-container\">\n        <button\n          aria-label=${\n            // TODO: Don't set aria-label if it equals to the caption\n            accessibleName.copyMessageContent\n          }\n          part=${tokenMap({\n            [`assistant copy-message-content ${message.id}`]: true,\n            ...(message.parts ? { [message.parts]: true } : {})\n          })}\n          type=\"button\"\n          @click=${(e: MouseEvent) => copyClickHandler(e, message)}\n        >\n          <!-- icon only button type -->\n        </button>\n      </div>`\n  );\n};\n"]}

package/dist/collection/components/chat/lit-custom-render/code-block.lit.js

@@ -1,46 +0,0 @@
-import { html } from "lit";
-import { when } from "lit/directives/when.js";
-import { copyButtonClickHandler } from "./utils";
-const downloadCodeBlockCallback = (plainText, language, downloadCodeBlock) => () => downloadCodeBlock(plainText, language);
-export const customCodeBlockRender = (chatRef) => (options) => {
-    var _a;
-    const { accessibleName, text } = chatRef.translations;
-    const downloadCb = (_a = chatRef.callbacks) === null || _a === void 0 ? void 0 : _a.downloadCodeBlock;
-    // console.log("downloadCb", downloadCb);
-    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)}
-          >
-            <!-- icon only button type -->
-          </button>
-
-          ${when(downloadCb, () => html `<button
-                aria-label=${
-    // TODO: Don't set aria-label if it equals to the caption
-    accessibleName.downloadCodeButton}
-                part="code-block__button--icon-only code-block__download-code-button"
-                @click=${downloadCodeBlockCallback(options.plainText, options.language, downloadCb)}
-              >
-                <!-- icon only button type -->
-              </button>`)}
-        </div>
-      </div>
-
-      <ch-code
-        .language=${options.language}
-        .lastNestedChildClass=${options.lastNestedChildClass}
-        part="code-block__content"
-        .showIndicator=${options.showIndicator}
-        .value=${options.plainText}
-      ></ch-code>
-    </div>`;
-};
-//# sourceMappingURL=code-block.lit.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"code-block.lit.js","sourceRoot":"","sources":["../../../../src/components/chat/lit-custom-render/code-block.lit.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAEjD,MAAM,yBAAyB,GAC7B,CACE,SAAiB,EACjB,QAAgB,EAChB,iBAAqD,EACrD,EAAE,CACJ,GAAG,EAAE,CACH,iBAAkB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;AAE5C,MAAM,CAAC,MAAM,qBAAqB,GAChC,CAAC,OAA0B,EAAE,EAAE,CAC/B,CAAC,OAAwC,EAAO,EAAE;;IAChD,MAAM,EAAE,cAAc,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,YAAY,CAAC;IAEtD,MAAM,UAAU,GAAG,MAAA,OAAO,CAAC,SAAS,0CAAE,iBAAiB,CAAC;IAExD,yCAAyC;IAEzC,OAAO,IAAI,CAAA;;kDAEmC,OAAO,CAAC,QAAQ;;;;;yBAKzC,IAAI,CAAC,cAAc;;;qBAGvB,CAAC,CAAa,EAAE,EAAE,CACzB,sBAAsB,CAAC,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC;;;;;YAK9C,IAAI,CACJ,UAAU,EACV,GAAG,EAAE,CACH,IAAI,CAAA;6BACW;IACX,yDAAyD;IACzD,cAAc,CAAC,kBACjB;;yBAES,yBAAyB,CAChC,OAAO,CAAC,SAAS,EACjB,OAAO,CAAC,QAAQ,EAChB,UAAU,CACX;;;wBAGO,CACb;;;;;oBAKS,OAAO,CAAC,QAAQ;gCACJ,OAAO,CAAC,oBAAoB;;yBAEnC,OAAO,CAAC,aAAa;iBAC7B,OAAO,CAAC,SAAS;;WAEvB,CAAC;AACV,CAAC,CAAC","sourcesContent":["import type { ChatCallbacks } from \"@genexus/chameleon-controls-library\";\nimport type { ChatCodeBlockRender } from \"@genexus/chameleon-controls-library/dist/types/components/chat/types\";\n\nimport type { MarkdownViewerCodeRenderOptions } from \"@genexus/chameleon-controls-library/dist/types/components/markdown-viewer/parsers/types\";\nimport { html } from \"lit\";\nimport { when } from \"lit/directives/when.js\";\nimport { copyButtonClickHandler } from \"./utils\";\n\nconst downloadCodeBlockCallback =\n  (\n    plainText: string,\n    language: string,\n    downloadCodeBlock: ChatCallbacks[\"downloadCodeBlock\"]\n  ) =>\n  () =>\n    downloadCodeBlock!(plainText, language);\n\nexport const customCodeBlockRender: ChatCodeBlockRender =\n  (chatRef: HTMLChChatElement) =>\n  (options: MarkdownViewerCodeRenderOptions): any => {\n    const { accessibleName, text } = chatRef.translations;\n\n    const downloadCb = chatRef.callbacks?.downloadCodeBlock;\n\n    // console.log(\"downloadCb\", downloadCb);\n\n    return html`<div part=\"code-block\">\n      <div part=\"code-block__header\">\n        <span part=\"code-block__header-caption\">${options.language}</span>\n\n        <div part=\"code-block__header-actions\">\n          <button\n            class=\"button-copy-code\"\n            aria-label=${text.copyCodeButton}\n            part=\"code-block__button--icon-only code-block__copy-code-button\"\n            type=\"button\"\n            @click=${(e: MouseEvent) =>\n              copyButtonClickHandler(e, options.plainText)}\n          >\n            <!-- icon only button type -->\n          </button>\n\n          ${when(\n            downloadCb,\n            () =>\n              html`<button\n                aria-label=${\n                  // TODO: Don't set aria-label if it equals to the caption\n                  accessibleName.downloadCodeButton\n                }\n                part=\"code-block__button--icon-only code-block__download-code-button\"\n                @click=${downloadCodeBlockCallback(\n                  options.plainText,\n                  options.language,\n                  downloadCb\n                )}\n              >\n                <!-- icon only button type -->\n              </button>`\n          )}\n        </div>\n      </div>\n\n      <ch-code\n        .language=${options.language}\n        .lastNestedChildClass=${options.lastNestedChildClass}\n        part=\"code-block__content\"\n        .showIndicator=${options.showIndicator}\n        .value=${options.plainText}\n      ></ch-code>\n    </div>`;\n  };\n"]}

package/dist/collection/components/chat/lit-custom-render/dots-animation.js

@@ -1,61 +0,0 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { LitElement, css, html } from "lit";
-import { customElement } from "lit/decorators.js";
-const DOT_SELECTOR = "dot";
-let DotsAnimation = class DotsAnimation extends LitElement {
-    // Render the UI as a function of component state
-    render() {
-        return html `<div class=${DOT_SELECTOR} part="dot dot-1"></div>
-      <div class=${DOT_SELECTOR} part="dot dot-2"></div>
-      <div class=${DOT_SELECTOR} part="dot dot-3"></div>`;
-    }
-};
-DotsAnimation.styles = css `
-    :host {
-      --dot-size: 5px;
-      --dot-initial-opacity: 0;
-      --dot-initial-scale: 0.5;
-      --dot-background-color: var(--mer-color__primary--200);
-      --animation-duration: 0.4s;
-      display: inline-flex;
-      gap: calc(var(--dot-size) / 1.15);
-    }
-
-    .dot {
-      display: inline-block;
-      inline-size: var(--dot-size);
-      block-size: var(--dot-size);
-      border-radius: calc(var(--dot-size) / 2);
-      opacity: var(--dot-initial-opacity);
-      transform: scale(var(--dot-initial-scale));
-      animation: animateDot var(--animation-duration) ease-in-out infinite alternate;
-      background-color: var(--dot-background-color);
-    }
-    .dot:nth-child(2) {
-      animation-delay: calc(var(--animation-duration) / 3); // 33% delay
-    }
-    .dot:nth-child(3) {
-      animation-delay: calc(var(--animation-duration) / 1.5); // 66% delay
-    }
-
-    @keyframes animateDot {
-      to {
-        opacity: 1;
-        transform: scale(1);
-      }
-    }
-  `;
-DotsAnimation = __decorate([
-    customElement("dots-animation")
-], DotsAnimation);
-export { DotsAnimation };
-//# sourceMappingURL=dots-animation.js.map

package/dist/collection/components/chat/lit-custom-render/dots-animation.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dots-animation.js","sourceRoot":"","sources":["../../../../src/components/chat/lit-custom-render/dots-animation.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,YAAY,GAAG,KAAK,CAAC;AAGpB,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAqC3C,iDAAiD;IACxC,MAAM;QACb,OAAO,IAAI,CAAA,cAAc,YAAY;mBACtB,YAAY;mBACZ,YAAY,0BAA0B,CAAC;IACxD,CAAC;;AAzCe,oBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkC3B,AAlCqB,CAkCpB;AAnCS,aAAa;IADzB,aAAa,CAAC,gBAAgB,CAAC;GACnB,aAAa,CA2CzB","sourcesContent":["import { LitElement, css, html } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\n\nconst DOT_SELECTOR = \"dot\";\n\n@customElement(\"dots-animation\")\nexport class DotsAnimation extends LitElement {\n  static override styles = css`\n    :host {\n      --dot-size: 5px;\n      --dot-initial-opacity: 0;\n      --dot-initial-scale: 0.5;\n      --dot-background-color: var(--mer-color__primary--200);\n      --animation-duration: 0.4s;\n      display: inline-flex;\n      gap: calc(var(--dot-size) / 1.15);\n    }\n\n    .dot {\n      display: inline-block;\n      inline-size: var(--dot-size);\n      block-size: var(--dot-size);\n      border-radius: calc(var(--dot-size) / 2);\n      opacity: var(--dot-initial-opacity);\n      transform: scale(var(--dot-initial-scale));\n      animation: animateDot var(--animation-duration) ease-in-out infinite alternate;\n      background-color: var(--dot-background-color);\n    }\n    .dot:nth-child(2) {\n      animation-delay: calc(var(--animation-duration) / 3); // 33% delay\n    }\n    .dot:nth-child(3) {\n      animation-delay: calc(var(--animation-duration) / 1.5); // 66% delay\n    }\n\n    @keyframes animateDot {\n      to {\n        opacity: 1;\n        transform: scale(1);\n      }\n    }\n  `;\n\n  // Render the UI as a function of component state\n  override render() {\n    return html`<div class=${DOT_SELECTOR} part=\"dot dot-1\"></div>\n      <div class=${DOT_SELECTOR} part=\"dot dot-2\"></div>\n      <div class=${DOT_SELECTOR} part=\"dot dot-3\"></div>`;\n  }\n}\n"]}

package/dist/collection/components/chat/lit-custom-render/render-item.lit.js

@@ -1,122 +0,0 @@
-/*
-README:
-This file contains 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.
-*/
-import { html, nothing } from "lit";
-// Side effect to define the animation for "waiting" messages.
-import { customActionsRender } from "./actions.lit";
-import { customCodeBlockRender } from "./code-block.lit";
-import { DEFAULT_ASSISTANT_STATUS, getMessageContent, tokenMap } from "./utils";
-import "./dots-animation";
-/**
- * Mercury section that includes the assistant the assistant name, and an optional message time.
- *
- * @param messageMetaData - Metadata containing assistantName and time
- * @returns TemplateResult rendering the assistant message header
- */
-const messageHeader = (messageMetaData) => {
-    const assistantName = messageMetaData.assistantName;
-    const messageTime = messageMetaData.time;
-    return html ` <div part="header assistant">
-    <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">${assistantName}</div>
-    </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) => {
-    var _a, _b;
-    const messageContent = getMessageContent(message);
-    return message.status === "waiting"
-        ? html `${messageHeader(message.metadata)}
-        <style>
-          dots-animation::part(dot-1) {
-            --dot-background-color: #5ba7ff;
-          }
-          dots-animation::part(dot-2) {
-            --dot-background-color: #00ccff;
-          }
-          dots-animation::part(dot-3) {
-            --dot-background-color: #cf7aff;
-          }
-        </style>
-        <div
-          class="assistant-loading"
-          part=${tokenMap(Object.assign({ [`assistant content waiting ${message.id}`]: true }, (message.parts ? { [message.parts]: true } : {})))}
-        >
-          ${messageContent}
-          <dots-animation></dots-animation>
-        </div>`
-        : html `${messageHeader(message.metadata)}
-        <ch-markdown-viewer
-          part=${tokenMap(Object.assign({ [`assistant content ${message.id} ${(_a = message.status) !== null && _a !== void 0 ? _a : DEFAULT_ASSISTANT_STATUS}`]: true }, (message.parts ? { [message.parts]: true } : {})))}
-          .renderCode=${
-        // WA: Define codeBlockRender as "any" 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=${(_b = chatRef.markdownTheme) !== null && _b !== void 0 ? _b : undefined}
-          .value=${messageContent}
-        ></ch-markdown-viewer>`;
-};
-// customzied in order to add the custom "messageHeader"
-const customErrorContentRender = (message, chatRef, codeBlockRender) => {
-    var _a;
-    const errorContent = getMessageContent(message);
-    return html `${messageHeader(message.metadata)}
-    <ch-markdown-viewer
-      part=${tokenMap(Object.assign({ [`error content ${message.id}`]: true }, (message.parts ? { [message.parts]: true } : {})))}
-      .renderCode=${
-    // WA: Define codeBlockRender as "any" 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=${(_a = chatRef.markdownTheme) !== null && _a !== void 0 ? _a : 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) => { var _a; return (_a = getMessageContent(messageModel)) !== null && _a !== void 0 ? _a : ""; };
-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,
-    user: defaultUserContentRender // No modification
-};
-const customContentRender = (message, chatRef, codeBlockRender) => contentRenderByRole[message.role](message, chatRef, codeBlockRender);
-// /Content
-export const renderItemMercury = {
-    actions: customActionsRender,
-    codeBlock: customCodeBlockRender,
-    content: customContentRender
-};
-//# sourceMappingURL=render-item.lit.js.map