@tylertech/forge-ai 0.15.2 → 0.15.3-dev.1

package/dist/ai-chatbot/ai-chatbot-tool-call.mjs

@@ -1,7 +1,10 @@
 import { unsafeCSS, LitElement, nothing, html } from "lit";
 import { property, customElement } from "lit/decorators.js";
 import { createRef, ref } from "lit/directives/ref.js";
+import { ContextConsumer } from "@lit/context";
+import { toolCanvasHostContext, createToolCanvas, requestCanvasOpen, requestCanvasClose, resolveToolCanvasInline, resolveToolCanvasIcon, resolveToolCanvasTitle, resolveToolCanvasSubtitle, resolveToolCanvasActionLabel } from "./tool-canvas.mjs";
 import { shouldShowToolRenderer } from "./utils.mjs";
+import "../ai-artifact-card/ai-artifact-card.mjs";
 import styles from "./ai-chatbot-tool-call.scss.mjs";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -21,7 +24,7 @@ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read fr
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _customRendererRef, _renderedElement, _AiChatbotToolCallComponent_instances, shouldRenderCustom_get, dispatchScrollRequest_fn, customRenderer_get, replaceRenderedElement_fn;
+var _customRendererRef, _renderedElement, _renderedCanvas, _canvasHostConsumer, _AiChatbotToolCallComponent_instances, shouldRenderCustom_get, presentation_get, isOpenInCanvas_get, _canvasControls, canvas_get, showsArtifactCard_get, artifactCard_fn, dispatchScrollRequest_fn, customRenderer_get, replaceRenderedElement_fn;
 const AiChatbotToolCallComponentTagName = "forge-ai-chatbot-tool-call";
 let AiChatbotToolCallComponent = class extends LitElement {
   constructor() {
@@ -29,27 +32,40 @@ let AiChatbotToolCallComponent = class extends LitElement {
     __privateAdd(this, _AiChatbotToolCallComponent_instances);
     __privateAdd(this, _customRendererRef, createRef());
     __privateAdd(this, _renderedElement);
+    __privateAdd(this, _renderedCanvas);
+    __privateAdd(this, _canvasHostConsumer, new ContextConsumer(this, {
+      context: toolCanvasHostContext,
+      subscribe: true,
+      callback: () => this.requestUpdate()
+    }));
+    __privateAdd(this, _canvasControls);
   }
   updated(changedProperties) {
     super.updated(changedProperties);
-    if (!changedProperties.has("toolCall") && !changedProperties.has("toolDefinition")) {
-      return;
-    }
     const container = __privateGet(this, _customRendererRef).value;
     if (!container || !__privateGet(this, _AiChatbotToolCallComponent_instances, shouldRenderCustom_get)) {
       return;
     }
     const renderer = this.toolDefinition?.renderer;
+    const canvas = __privateGet(this, _AiChatbotToolCallComponent_instances, canvas_get);
+    const mounted = container.childNodes.length > 0;
+    const changed = changedProperties.has("toolCall") || changedProperties.has("toolDefinition");
     if (renderer?.elementTag) {
-      if (__privateGet(this, _renderedElement) instanceof HTMLElement && __privateGet(this, _renderedElement).tagName.toLowerCase() === renderer.elementTag) {
-        __privateGet(this, _renderedElement).toolCall = this.toolCall;
+      if (mounted && __privateGet(this, _renderedElement) instanceof HTMLElement && __privateGet(this, _renderedElement).tagName.toLowerCase() === renderer.elementTag) {
+        const existing = __privateGet(this, _renderedElement);
+        existing.toolCall = this.toolCall;
+        existing.presentation = __privateGet(this, _AiChatbotToolCallComponent_instances, presentation_get);
+        existing.canvas = canvas;
         return;
       }
       const element = document.createElement(renderer.elementTag);
       element.toolCall = this.toolCall;
+      element.presentation = __privateGet(this, _AiChatbotToolCallComponent_instances, presentation_get);
+      element.canvas = canvas;
       __privateMethod(this, _AiChatbotToolCallComponent_instances, replaceRenderedElement_fn).call(this, container, element);
-    } else if (renderer?.render) {
-      __privateMethod(this, _AiChatbotToolCallComponent_instances, replaceRenderedElement_fn).call(this, container, renderer.render(this.toolCall));
+    } else if (renderer?.render && (changed || !mounted || canvas !== __privateGet(this, _renderedCanvas))) {
+      __privateSet(this, _renderedCanvas, canvas);
+      __privateMethod(this, _AiChatbotToolCallComponent_instances, replaceRenderedElement_fn).call(this, container, renderer.render(this.toolCall, { presentation: __privateGet(this, _AiChatbotToolCallComponent_instances, presentation_get), canvas }));
     }
   }
   render() {
@@ -58,10 +74,68 @@ let AiChatbotToolCallComponent = class extends LitElement {
 };
 _customRendererRef = /* @__PURE__ */ new WeakMap();
 _renderedElement = /* @__PURE__ */ new WeakMap();
+_renderedCanvas = /* @__PURE__ */ new WeakMap();
+_canvasHostConsumer = /* @__PURE__ */ new WeakMap();
 _AiChatbotToolCallComponent_instances = /* @__PURE__ */ new WeakSet();
 shouldRenderCustom_get = function() {
   return shouldShowToolRenderer(this.toolCall, this.toolDefinition);
 };
+presentation_get = function() {
+  if (!this.toolDefinition?.canvas) {
+    return "inline";
+  }
+  return __privateGet(this, _canvasHostConsumer).value?.presentation ?? "inline";
+};
+isOpenInCanvas_get = function() {
+  return __privateGet(this, _canvasHostConsumer).value?.openToolCallId === this.toolCall.id;
+};
+_canvasControls = /* @__PURE__ */ new WeakMap();
+canvas_get = function() {
+  const available = __privateGet(this, _AiChatbotToolCallComponent_instances, presentation_get) === "inline-expandable";
+  const isOpen = __privateGet(this, _AiChatbotToolCallComponent_instances, isOpenInCanvas_get);
+  if (__privateGet(this, _canvasControls)?.available !== available || __privateGet(this, _canvasControls).isOpen !== isOpen) {
+    __privateSet(this, _canvasControls, createToolCanvas({
+      available,
+      isOpen: () => __privateGet(this, _AiChatbotToolCallComponent_instances, isOpenInCanvas_get),
+      open: (options) => requestCanvasOpen(this, {
+        toolCallId: this.toolCall.id,
+        toolName: this.toolCall.name,
+        title: options?.title
+      }),
+      close: () => requestCanvasClose(this, { toolCallId: this.toolCall.id })
+    }));
+  }
+  return __privateGet(this, _canvasControls);
+};
+showsArtifactCard_get = function() {
+  if (!this.toolDefinition || __privateGet(this, _AiChatbotToolCallComponent_instances, presentation_get) !== "inline-expandable") {
+    return false;
+  }
+  switch (resolveToolCanvasInline(this.toolDefinition)) {
+    case "card":
+      return true;
+    case "card-while-open":
+      return __privateGet(this, _AiChatbotToolCallComponent_instances, isOpenInCanvas_get);
+    default:
+      return false;
+  }
+};
+artifactCard_fn = function(toolDefinition) {
+  const active = __privateGet(this, _AiChatbotToolCallComponent_instances, isOpenInCanvas_get);
+  const icon = resolveToolCanvasIcon(this.toolCall, toolDefinition);
+  icon?.setAttribute("slot", "icon");
+  return html`
+      <forge-ai-artifact-card
+        title-text=${resolveToolCanvasTitle(this.toolCall, toolDefinition)}
+        .subtitleText=${resolveToolCanvasSubtitle(this.toolCall, toolDefinition) ?? ""}
+        action-label=${resolveToolCanvasActionLabel(this.toolCall, toolDefinition, active)}
+        asset-id=${this.toolCall.id}
+        ?active=${active}
+        @forge-ai-artifact-card-open=${() => __privateGet(this, _AiChatbotToolCallComponent_instances, canvas_get).toggle()}>
+        ${icon ?? nothing}
+      </forge-ai-artifact-card>
+    `;
+};
 dispatchScrollRequest_fn = function() {
   this.dispatchEvent(
     new CustomEvent("forge-ai-message-thread-scroll-request", {
@@ -71,10 +145,14 @@ dispatchScrollRequest_fn = function() {
   );
 };
 customRenderer_get = function() {
-  const renderer = this.toolDefinition?.renderer;
-  if (!renderer || !__privateGet(this, _AiChatbotToolCallComponent_instances, shouldRenderCustom_get)) {
+  const toolDefinition = this.toolDefinition;
+  const renderer = toolDefinition?.renderer;
+  if (!toolDefinition || !renderer || !__privateGet(this, _AiChatbotToolCallComponent_instances, shouldRenderCustom_get)) {
     return nothing;
   }
+  if (__privateGet(this, _AiChatbotToolCallComponent_instances, showsArtifactCard_get)) {
+    return __privateMethod(this, _AiChatbotToolCallComponent_instances, artifactCard_fn).call(this, toolDefinition);
+  }
   if (renderer.elementTag || renderer.render) {
     return html`<div ${ref(__privateGet(this, _customRendererRef))}></div>`;
   }

package/dist/ai-chatbot/ai-chatbot.d.ts

@@ -1,7 +1,8 @@
-import { TemplateResult, CSSResult } from 'lit';
+import { PropertyValues, TemplateResult, CSSResult } from 'lit';
 import { AiMessageThreadComponent } from '../ai-message-thread';
 import { AiPromptComponent } from '../ai-prompt';
 import { AiChatbotBase } from './ai-chatbot-base.js';
+import { CanvasOpenEventData, OpenCanvasOptions } from '../core/canvas-controller.js';
 import { Agent, ChatMessage, ForgeAiChatbotThreadSelectEventData, ForgeAiChatbotThreadSearchEventData, ForgeAiChatbotThreadLoadMoreEventData, ForgeAiChatbotThreadRenameEventData, ForgeAiChatbotThreadDeleteEventData, ForgeAiChatbotContextRemoveEventData, Thread } from './types.js';
 import { Ref } from 'lit/directives/ref.js';
 declare global {
@@ -35,6 +36,8 @@ declare global {
         'forge-ai-chatbot-thread-delete': CustomEvent<ForgeAiChatbotThreadDeleteEventData>;
         'forge-ai-chatbot-context-remove': CustomEvent<ForgeAiChatbotContextRemoveEventData>;
         'forge-ai-chatbot-thread-retry': CustomEvent<void>;
+        'forge-ai-chatbot-canvas-open': CustomEvent<CanvasOpenEventData>;
+        'forge-ai-chatbot-canvas-close': CustomEvent<void>;
     }
 }
 export interface ForgeAiChatbotMessageEventData {
@@ -102,12 +105,15 @@ export declare const AiChatbotComponentTagName: keyof HTMLElementTagNameMap;
  * @property {FeatureToggle} exportOption - Controls the export-conversation header action. `'on'` (default) shows it when messages exist; `'off'` hides it entirely.
  * @property {string | null} selectedThreadId - The id of the currently selected thread. Set this to highlight a thread in the conversations panel (e.g. when restoring a conversation loaded from the backend). Updated internally when a thread is selected or a new chat starts.
  * @property {boolean} threadsLoading - When true, shows a loading indicator in the conversations panel's recent chats list while threads are loading (default: false)
+ * @property {string} canvasTitle - Default title for the artifact canvas modal, used when the open request does not supply one
  * @property {string | undefined} threadsError - Message describing a failed thread load. When set, the conversations panel shows the message with a retry button instead of its empty state or loading indicator. The conversations button also shows an error badge so the failure is visible with the panel closed. If threads are already loaded the list stays visible and the message renders as a compact single line with a retry - at the bottom of the list when a page was in flight, otherwise above it. Clear it once a load succeeds.
  *
  * @cssproperty --forge-ai-chatbot-icon-color - The fill color for the AI icon. Defaults to `tertiary`.
  * @cssproperty --forge-ai-chatbot-suggestion-background - The background color for suggestion buttons. Defaults to `tertiary-container`.
  * @cssproperty --forge-ai-chatbot-suggestion-foreground - The text color for suggestion buttons. Defaults to `on-tertiary-container`.
  * @cssproperty --forge-ai-chatbot-header-title-color - The color of the header title text. Defaults to `currentColor`.
+ * @cssproperty --forge-ai-chatbot-canvas-width - Width of the artifact canvas modal (default: 80vw).
+ * @cssproperty --forge-ai-chatbot-canvas-height - Height of the artifact canvas modal (default: 80vh).
  *
  * @event {CustomEvent<void>} forge-ai-chatbot-connected - Fired when adapter connects
  * @event {CustomEvent<void>} forge-ai-chatbot-disconnected - Fired when adapter disconnects
@@ -132,6 +138,8 @@ export declare const AiChatbotComponentTagName: keyof HTMLElementTagNameMap;
  * @event {CustomEvent<ForgeAiChatbotThreadRenameEventData>} forge-ai-chatbot-thread-rename - Fired when user renames a thread. Cancelable - if prevented, call onSuccess() to commit or onError() to revert.
  * @event {CustomEvent<ForgeAiChatbotThreadDeleteEventData>} forge-ai-chatbot-thread-delete - Fired when user deletes a thread. Cancelable - if prevented, call onSuccess() to commit deletion or onError() to revert. Otherwise optimistically removed.
  * @event {CustomEvent<void>} forge-ai-chatbot-thread-retry - Fired when the retry button in the conversations panel's error state is clicked. Re-request the threads and clear threadsError once the load succeeds
+ * @event {CustomEvent<CanvasOpenEventData>} forge-ai-chatbot-canvas-open - Fired before the canvas modal opens or replaces its content. Cancelable - prevents the canvas from opening
+ * @event {CustomEvent<void>} forge-ai-chatbot-canvas-close - Fired when the canvas modal closes. Cancelable only for user or `closeCanvas()` initiated closes; closes caused by clearing the thread cannot be prevented
  */
 export declare class AiChatbotComponent extends AiChatbotBase {
     #private;
@@ -148,11 +156,26 @@ export declare class AiChatbotComponent extends AiChatbotBase {
     selectedThreadId: string | null;
     threadsLoading: boolean;
     threadsError?: string;
+    canvasTitle?: string;
     protected _messageThreadRef: Ref<AiMessageThreadComponent>;
     protected _promptRef: Ref<AiPromptComponent>;
     protected _handleInfo(): void;
     sendMessage(content: string, files?: File[]): Promise<void>;
     focus(): void;
+    willUpdate(changedProperties: PropertyValues<this>): void;
+    updated(changedProperties: PropertyValues<this>): void;
+    get canvasOpen(): boolean;
+    /**
+     * Opens the artifact canvas in a modal over the chatbot, or swaps its content if already open.
+     * Returns false when the open event is prevented.
+     */
+    openCanvas(options?: OpenCanvasOptions): boolean;
+    /**
+     * Closes the artifact canvas. Returns false if it was not open or the close event was prevented.
+     */
+    closeCanvas(): boolean;
+    clearMessages(): boolean;
+    setMessages(messages: ChatMessage[]): void;
     showConversations(): void;
     hideConversations(): void;
     /**

package/dist/ai-chatbot/ai-chatbot.mjs

@@ -3,14 +3,17 @@ import { property, customElement } from "lit/decorators.js";
 import { createRef, ref } from "lit/directives/ref.js";
 import { when } from "lit/directives/when.js";
 import { AiChatbotBase } from "./ai-chatbot-base.mjs";
+import { CanvasController } from "../core/canvas-controller.mjs";
 import { forwardCancelableEvent } from "../utils.mjs";
 import "../ai-attachment/ai-attachment.mjs";
+import "../ai-canvas/ai-canvas.mjs";
 import "../ai-chat-header/ai-chat-header.mjs";
 import "../ai-chat-interface/ai-chat-interface.mjs";
 import "../ai-context-chip/ai-context-chip.mjs";
 import "../ai-conversations-panel/ai-conversations-panel.mjs";
 import "../ai-file-picker/ai-file-picker.mjs";
 import "../ai-message-thread/ai-message-thread.mjs";
+import "../ai-modal/ai-modal.mjs";
 import "../ai-prompt/ai-prompt.mjs";
 import "../ai-spinner/ai-spinner.mjs";
 import "../ai-suggestions/ai-suggestions.mjs";
@@ -33,7 +36,7 @@ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _chatInterfaceRef, _headerRef, _conversationsPanelRef, _conversationsDialogRef, _boundEscapeHandler, _AiChatbotComponent_instances, handleHeaderExpand_fn, handleHeaderMinimize_fn, handleHeaderClear_fn, handleHeaderInfo_fn, handleConversationsDialogClose_fn, handleEscapeKey_fn, handleBackdropClick_fn, handleConversationsToggle_fn, handleThreadSelect_fn, handleThreadRetry_fn, handleNewChat_fn, handlePanelClose_fn, _handleThreadSearch, _handleThreadLoadMore, _handleThreadRename, _handleThreadDelete, promptSlot_get, messageThread_get;
+var _canvasModalRef, _canvasRef, _canvas, _chatInterfaceRef, _headerRef, _conversationsPanelRef, _conversationsDialogRef, _boundEscapeHandler, _AiChatbotComponent_instances, handleHeaderExpand_fn, handleHeaderMinimize_fn, handleHeaderClear_fn, handleHeaderInfo_fn, syncCanvasModal_fn, handleCanvasModalClose_fn, canvasModal_get, handleCanvasCloseClick_fn, handleConversationsDialogClose_fn, handleEscapeKey_fn, handleBackdropClick_fn, handleConversationsToggle_fn, handleThreadSelect_fn, handleThreadRetry_fn, handleNewChat_fn, handlePanelClose_fn, _handleThreadSearch, _handleThreadLoadMore, _handleThreadRename, _handleThreadDelete, promptSlot_get, messageThread_get;
 const AiChatbotComponentTagName = "forge-ai-chatbot";
 let AiChatbotComponent = class extends AiChatbotBase {
   constructor() {
@@ -50,6 +53,18 @@ let AiChatbotComponent = class extends AiChatbotBase {
     this.showThreadDelete = false;
     this.selectedThreadId = null;
     this.threadsLoading = false;
+    __privateAdd(this, _canvasModalRef, createRef());
+    __privateAdd(this, _canvasRef, createRef());
+    __privateAdd(this, _canvas, new CanvasController(this, {
+      openEvent: "forge-ai-chatbot-canvas-open",
+      closeEvent: "forge-ai-chatbot-canvas-close",
+      dispatchHostEvent: (config) => this._dispatchHostEvent(config),
+      getToolCalls: () => this._toolCalls,
+      getTools: () => this._tools,
+      // A modal opened while the chat is hidden (closed floating chat, collapsed sidebar) is invisible but still makes the page inert.
+      canOpen: () => this.checkVisibility() && this.getBoundingClientRect().width > 0,
+      onRefocus: () => __privateGet(this, _canvasRef).value?.focus()
+    }));
     __privateAdd(this, _chatInterfaceRef, createRef());
     this._messageThreadRef = createRef();
     this._promptRef = createRef();
@@ -89,6 +104,42 @@ let AiChatbotComponent = class extends AiChatbotBase {
   focus() {
     this._promptRef.value?.focus();
   }
+  willUpdate(changedProperties) {
+    super.willUpdate(changedProperties);
+    __privateGet(this, _canvas).syncToolCall();
+  }
+  // No `canvas.open: 'auto'` here: a modal popping over the chat mid-conversation is too disruptive, so only the launcher auto-opens.
+  updated(changedProperties) {
+    super.updated(changedProperties);
+    __privateMethod(this, _AiChatbotComponent_instances, syncCanvasModal_fn).call(this);
+  }
+  get canvasOpen() {
+    return __privateGet(this, _canvas).isOpen;
+  }
+  /**
+   * Opens the artifact canvas in a modal over the chatbot, or swaps its content if already open.
+   * Returns false when the open event is prevented.
+   */
+  openCanvas(options = {}) {
+    return __privateGet(this, _canvas).open(options);
+  }
+  /**
+   * Closes the artifact canvas. Returns false if it was not open or the close event was prevented.
+   */
+  closeCanvas() {
+    return __privateGet(this, _canvas).close();
+  }
+  clearMessages() {
+    if (super.clearMessages()) {
+      __privateGet(this, _canvas).reset();
+      return true;
+    }
+    return false;
+  }
+  setMessages(messages) {
+    __privateGet(this, _canvas).reset();
+    super.setMessages(messages);
+  }
   showConversations() {
     const dialog = __privateGet(this, _conversationsDialogRef).value;
     if (dialog && !dialog.open) {
@@ -121,6 +172,7 @@ let AiChatbotComponent = class extends AiChatbotBase {
   startNewChat() {
     super.startNewChat();
     this.selectedThreadId = null;
+    __privateGet(this, _canvas).reset();
   }
   toggleConversations() {
     if (this.conversationsOpen) {
@@ -131,7 +183,10 @@ let AiChatbotComponent = class extends AiChatbotBase {
   }
   render() {
     return html`
-      <div class="chatbot-container">
+      <div
+        class="chatbot-container"
+        @forge-ai-canvas-open-request=${__privateGet(this, _canvas).handleOpenRequest}
+        @forge-ai-canvas-close-request=${__privateGet(this, _canvas).handleCloseRequest}>
         <forge-ai-chat-interface
           ${ref(__privateGet(this, _chatInterfaceRef))}
           role="region"
@@ -205,10 +260,14 @@ let AiChatbotComponent = class extends AiChatbotBase {
             </dialog>
           `
     )}
+        ${__privateGet(this, _AiChatbotComponent_instances, canvasModal_get)}
       </div>
     `;
   }
 };
+_canvasModalRef = /* @__PURE__ */ new WeakMap();
+_canvasRef = /* @__PURE__ */ new WeakMap();
+_canvas = /* @__PURE__ */ new WeakMap();
 _chatInterfaceRef = /* @__PURE__ */ new WeakMap();
 _headerRef = /* @__PURE__ */ new WeakMap();
 _conversationsPanelRef = /* @__PURE__ */ new WeakMap();
@@ -227,6 +286,44 @@ handleHeaderClear_fn = function() {
 handleHeaderInfo_fn = function() {
   this._handleInfo();
 };
+syncCanvasModal_fn = function() {
+  const modal = __privateGet(this, _canvasModalRef).value;
+  if (modal && modal.open !== __privateGet(this, _canvas).isOpen) {
+    modal.open = __privateGet(this, _canvas).isOpen;
+  }
+};
+handleCanvasModalClose_fn = function(evt) {
+  evt.stopPropagation();
+  if (evt.detail.reason === "programmatic" || !__privateGet(this, _canvas).isOpen) {
+    return;
+  }
+  if (!__privateGet(this, _canvas).close()) {
+    __privateMethod(this, _AiChatbotComponent_instances, syncCanvasModal_fn).call(this);
+  }
+};
+canvasModal_get = function() {
+  const title = __privateGet(this, _canvas).content?.title ?? this.canvasTitle ?? "";
+  return html`
+      <forge-ai-modal
+        ${ref(__privateGet(this, _canvasModalRef))}
+        class="canvas-modal"
+        label=${title || "Canvas"}
+        @forge-ai-modal-close=${__privateMethod(this, _AiChatbotComponent_instances, handleCanvasModalClose_fn)}>
+        <forge-ai-canvas
+          ${ref(__privateGet(this, _canvasRef))}
+          class="canvas"
+          .titleText=${title}
+          .headingLevel=${this.headingLevel}
+          @forge-ai-canvas-close=${__privateMethod(this, _AiChatbotComponent_instances, handleCanvasCloseClick_fn)}>
+          <slot name="canvas-actions" slot="actions"></slot>
+          ${__privateGet(this, _canvas).content?.node ?? html`<slot name="canvas"></slot>`}
+        </forge-ai-canvas>
+      </forge-ai-modal>
+    `;
+};
+handleCanvasCloseClick_fn = function() {
+  __privateGet(this, _canvas).close();
+};
 handleConversationsDialogClose_fn = function() {
   window.removeEventListener("keydown", __privateGet(this, _boundEscapeHandler), { capture: true });
   this.conversationsOpen = false;
@@ -393,6 +490,9 @@ __decorateClass([
 __decorateClass([
   property({ type: String, attribute: "threads-error" })
 ], AiChatbotComponent.prototype, "threadsError", 2);
+__decorateClass([
+  property({ attribute: "canvas-title" })
+], AiChatbotComponent.prototype, "canvasTitle", 2);
 AiChatbotComponent = __decorateClass([
   customElement(AiChatbotComponentTagName)
 ], AiChatbotComponent);

package/dist/ai-chatbot/ai-chatbot.scss.mjs

@@ -1,4 +1,4 @@
-const styles = '/* prettier-ignore */\n/**\n * @license\n * Copyright Tyler Technologies, Inc.\n * License: Apache-2.0\n */\n@keyframes forge-dialog-zoom-in {\n  from {\n    opacity: var(--_dialog-zoom-opacity);\n    scale: var(--_dialog-zoom-scale);\n  }\n  to {\n    opacity: 1;\n    scale: 1;\n  }\n}\n@keyframes forge-dialog-zoom-out {\n  from {\n    opacity: 1;\n    scale: 1;\n  }\n  to {\n    opacity: var(--_dialog-zoom-opacity);\n    scale: var(--_dialog-zoom-scale);\n  }\n}\n@keyframes forge-dialog-fade-in {\n  from {\n    opacity: var(--_dialog-fade-opacity);\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes forge-dialog-fade-out {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: var(--_dialog-fade-opacity);\n  }\n}\n@keyframes forge-dialog-slide-in {\n  from {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n  to {\n    opacity: 1;\n    translate: 0 0;\n  }\n}\n@keyframes forge-dialog-slide-out {\n  from {\n    opacity: 1;\n    translate: 0 0;\n  }\n  to {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog {\n  --_dialog-background:var(--forge-dialog-background, var(--forge-theme-surface-bright, #ffffff));\n  --_dialog-shape:var(--forge-dialog-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));\n  --_dialog-elevation:var(--forge-dialog-elevation, 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12));\n  --_dialog-spacing:var(--forge-dialog-spacing, auto);\n  --_dialog-block-start-spacing:var(--forge-dialog-block-start-spacing, var(--_dialog-spacing));\n  --_dialog-block-end-spacing:var(--forge-dialog-block-end-spacing, var(--_dialog-spacing));\n  --_dialog-inline-start-spacing:var(--forge-dialog-inline-start-spacing, var(--_dialog-spacing));\n  --_dialog-inline-end-spacing:var(--forge-dialog-inline-end-spacing, var(--_dialog-spacing));\n  --_dialog-padding:var(--forge-dialog-padding, 0);\n  --_dialog-width:var(--forge-dialog-width, fit-content);\n  --_dialog-height:var(--forge-dialog-height, fit-content);\n  --_dialog-min-width:var(--forge-dialog-min-width, 0);\n  --_dialog-max-width:var(--forge-dialog-max-width, calc(100% - var(--forge-spacing-xxlarge, 48px)));\n  --_dialog-min-height:var(--forge-dialog-min-height, 0);\n  --_dialog-max-height:var(--forge-dialog-max-height, calc(100% - var(--forge-spacing-xxlarge, 48px)));\n  --_dialog-z-index:var(--forge-dialog-z-index, var(--forge-z-index-dialog, 8));\n  --_dialog-move-handle-color:var(--forge-dialog-move-handle-color, currentColor);\n  --_dialog-move-handle-size:var(--forge-dialog-move-handle-size, 24px);\n  --_dialog-move-handle-hover-cursor:var(--forge-dialog-move-handle-hover-cursor, grab);\n  --_dialog-move-handle-active-cursor:var(--forge-dialog-move-handle-active-cursor, grabbing);\n  --_dialog-move-handle-spacing:var(--forge-dialog-move-handle-spacing, calc(var(--forge-spacing-xxsmall, 4px) * -1) 0 0);\n  --_dialog-move-transition-duration:var(--forge-dialog-move-transition-duration, var(--forge-animation-duration-short4, 200ms));\n  --_dialog-move-transition-easing:var(--forge-dialog-move-transition-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_dialog-moving-opacity:var(--forge-dialog-moving-opacity, 0.54);\n  --_dialog-enter-animation-duration:var(--forge-dialog-enter-animation-duration, var(--forge-animation-duration-medium1, 250ms));\n  --_dialog-enter-animation-easing:var(--forge-dialog-enter-animation-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_dialog-exit-animation-duration:var(--forge-dialog-exit-animation-duration, var(--forge-animation-duration-short2, 100ms));\n  --_dialog-exit-animation-easing:var(--forge-dialog-exit-animation-easing, var(--forge-animation-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)));\n  --_dialog-zoom-opacity:var(--forge-dialog-zoom-opacity, 0);\n  --_dialog-zoom-scale:var(--forge-dialog-zoom-scale, 0.8);\n  --_dialog-fade-opacity:var(--forge-dialog-fade-opacity, 0);\n  --_dialog-slide-opacity:var(--forge-dialog-slide-opacity, 0);\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 0 -30%);\n  --_dialog-backdrop-opacity:var(--forge-dialog-backdrop-opacity, var(--forge-backdrop-opacity, 0.54));\n  --_dialog-nonmodal-elevation:var(--forge-dialog-nonmodal-elevation, 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));\n  --_dialog-fullscreen-enter-animation-duration:var(--forge-dialog-fullscreen-enter-animation-duration, var(--forge-animation-duration-medium1, 250ms));\n  --_dialog-fullscreen-exit-animation-duration:var(--forge-dialog-fullscreen-exit-animation-duration, var(--forge-animation-duration-short2, 100ms));\n  --_dialog-position-x:var(--forge-dialog-position-x, 0);\n  --_dialog-position-y:var(--forge-dialog-position-y, 0);\n  --_dialog-preset-sheet-enter-animation-duration:var(--forge-dialog-preset-sheet-enter-animation-duration, var(--forge-animation-duration-medium1, 250ms));\n  --_dialog-preset-sheet-exit-animation-duration:var(--forge-dialog-preset-sheet-exit-animation-duration, var(--forge-animation-duration-short3, 150ms));\n  --_backdrop-background:var(--forge-backdrop-background, #000);\n  --_backdrop-opacity:var(--forge-backdrop-opacity, 0.54);\n  --_backdrop-z-index:var(--forge-backdrop-z-index, var(--forge-z-index-backdrop, 7));\n  --_backdrop-enter-animation-duration:var(--forge-backdrop-enter-animation-duration, var(--forge-animation-duration-short4, 200ms));\n  --_backdrop-enter-animation-easing:var(--forge-backdrop-enter-animation-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_backdrop-exit-animation-duration:var(--forge-backdrop-exit-animation-duration, var(--forge-animation-duration-short1, 50ms));\n  --_backdrop-exit-animation-easing:var(--forge-backdrop-exit-animation-easing, var(--forge-animation-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)));\n  --forge-theme-surface: var(--forge-theme-surface-bright, #ffffff);\n}\n\n.forge-dialog {\n  position: fixed;\n  inset: 0;\n  z-index: var(--_dialog-z-index);\n  background-color: rgba(0, 0, 0, 0);\n  color: inherit;\n  border: none;\n  width: auto;\n  height: auto;\n  padding: 0;\n  margin: 0;\n  overflow: visible;\n  max-width: 100%;\n  max-height: 100%;\n  box-sizing: border-box;\n  position: absolute;\n  inset: 0;\n  display: flex;\n  background: var(--_dialog-background);\n  box-shadow: var(--_dialog-elevation);\n  z-index: var(--_dialog-z-index);\n  overflow: hidden;\n  border-radius: var(--_dialog-shape);\n  margin-block-start: var(--_dialog-block-start-spacing);\n  margin-block-end: var(--_dialog-block-end-spacing);\n  margin-inline-start: var(--_dialog-inline-start-spacing);\n  margin-inline-end: var(--_dialog-inline-end-spacing);\n  padding: var(--_dialog-padding);\n  width: var(--_dialog-width);\n  height: var(--_dialog-height);\n  min-width: var(--_dialog-min-width);\n  max-width: var(--_dialog-max-width);\n  min-height: var(--_dialog-min-height);\n  max-height: var(--_dialog-max-height);\n  box-sizing: border-box;\n  animation-duration: var(--_dialog-exit-animation-duration);\n  animation-timing-function: var(--_dialog-exit-animation-easing);\n  position: fixed;\n  transition-property: display, opacity, overlay, scale;\n  transition-behavior: allow-discrete;\n}\n\n.forge-dialog > forge-scaffold {\n  height: auto;\n}\n\n.forge-dialog--fullscreen {\n  --_dialog-enter-animation-duration:var(--_dialog-fullscreen-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-fullscreen-exit-animation-duration);\n  height: 100%;\n  width: 100%;\n  max-width: none;\n  max-height: none;\n  border-radius: 0;\n  box-shadow: none;\n}\n\n.forge-dialog:not(:modal) {\n  --_dialog-elevation:var(--_dialog-nonmodal-elevation);\n  pointer-events: all;\n}\n\n.forge-dialog--moveable {\n  user-select: none;\n  transition-property: opacity;\n  transition-duration: var(--_dialog-move-transition-duration);\n  transition-timing-function: var(--_dialog-move-transition-easing);\n}\n\n.forge-dialog--moved {\n  margin: 0;\n}\n\n.forge-dialog--moving {\n  opacity: var(--_dialog-moving-opacity);\n}\n\n.forge-dialog__move-handle {\n  fill: var(--_dialog-move-handle-color);\n  height: var(--_dialog-move-handle-size);\n  width: var(--_dialog-move-handle-size);\n  margin: var(--_dialog-move-handle-spacing);\n  touch-action: none;\n}\n\n.forge-dialog__move-handle:hover {\n  cursor: var(--_dialog-move-handle-hover-cursor);\n}\n\n.forge-dialog__move-handle:active {\n  cursor: var(--_dialog-move-handle-active-cursor);\n}\n\n.forge-dialog__move-handle-container {\n  position: absolute;\n  top: 0;\n  z-index: 1;\n  display: flex;\n  justify-content: center;\n  width: 100%;\n}\n\n.forge-dialog--top {\n  --_dialog-block-start-spacing:var(--forge-dialog-block-start-spacing, 0);\n  top: 0;\n  bottom: auto;\n}\n\n.forge-dialog--top-right {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: 0;\n  left: auto;\n  right: 0;\n  bottom: auto;\n}\n\n.forge-dialog--top-left {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: 0;\n  left: 0;\n  right: auto;\n  bottom: auto;\n}\n\n.forge-dialog--bottom {\n  --_dialog-block-end-spacing:var(--forge-dialog-block-end-spacing, 0);\n  top: auto;\n  bottom: 0;\n}\n\n.forge-dialog--bottom-right {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: auto;\n  right: 0;\n  bottom: 0;\n}\n\n.forge-dialog--bottom-left {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: 0;\n  right: auto;\n  bottom: 0;\n}\n\n.forge-dialog--right {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: auto;\n  right: 0;\n  bottom: auto;\n}\n\n.forge-dialog--left {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: 0;\n  right: auto;\n  bottom: auto;\n}\n\n.forge-dialog--custom {\n  margin: 0;\n  top: var(--_dialog-position-x);\n  left: var(--_dialog-position-y);\n}\n\n.forge-dialog--bottom-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 0 100%);\n}\n\n.forge-dialog--bottom-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--bottom-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--bottom-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--bottom-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--left-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  left: 0;\n  bottom: 0;\n  top: 0;\n  height: 100%;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, -100% 0);\n}\n\n.forge-dialog--left-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--left-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--left-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--left-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--right-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  right: 0;\n  bottom: 0;\n  top: 0;\n  height: 100%;\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 100% 0);\n}\n\n.forge-dialog--right-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--right-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--right-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--right-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--top-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  top: 0;\n  left: 0;\n  right: 0;\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 0 -100%);\n}\n\n.forge-dialog--top-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--top-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--top-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--top-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog::backdrop {\n  --forge-backdrop-opacity: var(--_backdrop-opacity);\n  --forge-backdrop-enter-animation-duration: var(--_backdrop-enter-animation-duration);\n  --forge-backdrop-enter-animation-easing: var(--_backdrop-enter-animation-easing);\n  --forge-backdrop-exit-animation-duration: var(--_backdrop-exit-animation-duration);\n  --forge-backdrop-exit-animation-easing: var(--_backdrop-exit-animation-easing);\n  position: absolute;\n  inset: 0;\n  z-index: var(--_backdrop-z-index);\n  background: var(--_backdrop-background);\n  opacity: 0;\n  animation-fill-mode: forwards;\n  transition-property: display, opacity, overlay;\n}\n\n.forge-dialog[open] {\n  opacity: 1;\n  scale: 1;\n  transition-duration: var(--_dialog-enter-animation-duration);\n  transition-timing-function: var(--_dialog-enter-animation-easing);\n}\n\n@starting-style {\n  .forge-dialog[open] {\n    opacity: var(--_dialog-zoom-opacity);\n    scale: var(--_dialog-zoom-scale);\n  }\n}\n.forge-dialog[open]::backdrop {\n  opacity: var(--_backdrop-opacity);\n  transition-duration: var(--_backdrop-enter-animation-duration);\n  transition-timing-function: var(--_backdrop-enter-animation-easing);\n}\n\n@starting-style {\n  .forge-dialog[open]::backdrop {\n    opacity: 0;\n  }\n}\n.forge-dialog:not([open]) {\n  animation-duration: var(--_dialog-enter-animation-duration);\n  animation-timing-function: var(--_dialog-enter-animation-easing);\n  display: none;\n  opacity: var(--_dialog-zoom-opacity);\n  scale: var(--_dialog-zoom-scale);\n  transition-duration: var(--_dialog-exit-animation-duration);\n  transition-timing-function: var(--_dialog-exit-animation-easing);\n}\n\n.forge-dialog:not([open])::backdrop {\n  transition-duration: var(--_backdrop-exit-animation-duration);\n  transition-timing-function: var(--_backdrop-exit-animation-easing);\n}\n\n.forge-dialog--animation-fade.forge-dialog {\n  transition-property: display, opacity, overlay;\n}\n\n@starting-style {\n  .forge-dialog--animation-fade.forge-dialog[open] {\n    opacity: var(--_dialog-fade-opacity);\n  }\n}\n.forge-dialog--animation-fade.forge-dialog:not([open]) {\n  opacity: var(--_dialog-fade-opacity);\n  scale: 1;\n}\n\n.forge-dialog--animation-slide.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--animation-slide.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--animation-slide.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--animation-slide.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--animation-none {\n  --_dialog-enter-animation-duration:var(--forge-dialog-enter-animation-duration, 0s);\n  --_dialog-exit-animation-duration:var(--forge-dialog-exit-animation-duration, 0s);\n  --_backdrop-enter-animation-duration:var(--forge-backdrop-enter-animation-duration, 0s);\n  --_backdrop-exit-animation-duration:var(--forge-backdrop-exit-animation-duration, 0s);\n}\n\n@media (prefers-reduced-motion) {\n  .forge-dialog.forge-dialog {\n    transition-property: display, opacity, overlay;\n  }\n  @starting-style {\n    .forge-dialog.forge-dialog[open] {\n      opacity: var(--_dialog-fade-opacity);\n    }\n  }\n  .forge-dialog.forge-dialog:not([open]) {\n    opacity: var(--_dialog-fade-opacity);\n    scale: 1;\n  }\n}\n:host {\n  display: block;\n  width: 100%;\n  height: 100%;\n  --_ai-chatbot-icon-shape: var(--forge-ai-chatbot-icon-shape, 0);\n}\n\n.chatbot-container {\n  position: relative;\n  display: grid;\n  height: 100%;\n  overflow: hidden;\n  border-radius: inherit;\n}\n\nforge-ai-chat-interface::part(messages) {\n  overflow: hidden;\n}\nforge-ai-chat-interface forge-ai-message-thread {\n  min-height: 0;\n}\n\nforge-ai-chat-header {\n  --forge-ai-chat-header-title-color: var(--forge-ai-chatbot-header-title-color, currentColor);\n}\n\n.disclaimer {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-label1-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n  font-size: var(--forge-typography-label1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, 0.75)));\n  font-weight: var(--forge-typography-label1-font-weight, 400);\n  line-height: var(--forge-typography-label1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));\n  letter-spacing: var(--forge-typography-label1-letter-spacing, 0.0357142857em);\n  text-transform: var(--forge-typography-label1-text-transform, inherit);\n  text-decoration: var(--forge-typography-label1-text-decoration, inherit);\n  color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));\n  text-align: center;\n  margin-block-start: var(--forge-spacing-xxsmall, 4px);\n  margin-block-end: calc(var(--forge-spacing-small, 12px) * -1);\n}\n\n.suggestions-container {\n  width: 100%;\n  align-self: start;\n}\n\n::slotted([slot=empty-state-icon]) {\n  height: 200px;\n  width: 200px;\n  border-radius: var(--_ai-chatbot-icon-shape);\n}\n\n.conversations-backdrop {\n  position: absolute;\n  inset: 0;\n  background-color: transparent;\n  z-index: 1;\n}\n\n.conversations-dialog {\n  display: grid;\n  width: min(90%, 360px);\n  padding: 0;\n  border: 0;\n  position: absolute;\n  z-index: 2;\n  --forge-dialog-shape: 0;\n  --forge-dialog-nonmodal-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n}';
+const styles = '/* prettier-ignore */\n/**\n * @license\n * Copyright Tyler Technologies, Inc.\n * License: Apache-2.0\n */\n@keyframes forge-dialog-zoom-in {\n  from {\n    opacity: var(--_dialog-zoom-opacity);\n    scale: var(--_dialog-zoom-scale);\n  }\n  to {\n    opacity: 1;\n    scale: 1;\n  }\n}\n@keyframes forge-dialog-zoom-out {\n  from {\n    opacity: 1;\n    scale: 1;\n  }\n  to {\n    opacity: var(--_dialog-zoom-opacity);\n    scale: var(--_dialog-zoom-scale);\n  }\n}\n@keyframes forge-dialog-fade-in {\n  from {\n    opacity: var(--_dialog-fade-opacity);\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes forge-dialog-fade-out {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: var(--_dialog-fade-opacity);\n  }\n}\n@keyframes forge-dialog-slide-in {\n  from {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n  to {\n    opacity: 1;\n    translate: 0 0;\n  }\n}\n@keyframes forge-dialog-slide-out {\n  from {\n    opacity: 1;\n    translate: 0 0;\n  }\n  to {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog {\n  --_dialog-background:var(--forge-dialog-background, var(--forge-theme-surface-bright, #ffffff));\n  --_dialog-shape:var(--forge-dialog-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));\n  --_dialog-elevation:var(--forge-dialog-elevation, 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12));\n  --_dialog-spacing:var(--forge-dialog-spacing, auto);\n  --_dialog-block-start-spacing:var(--forge-dialog-block-start-spacing, var(--_dialog-spacing));\n  --_dialog-block-end-spacing:var(--forge-dialog-block-end-spacing, var(--_dialog-spacing));\n  --_dialog-inline-start-spacing:var(--forge-dialog-inline-start-spacing, var(--_dialog-spacing));\n  --_dialog-inline-end-spacing:var(--forge-dialog-inline-end-spacing, var(--_dialog-spacing));\n  --_dialog-padding:var(--forge-dialog-padding, 0);\n  --_dialog-width:var(--forge-dialog-width, fit-content);\n  --_dialog-height:var(--forge-dialog-height, fit-content);\n  --_dialog-min-width:var(--forge-dialog-min-width, 0);\n  --_dialog-max-width:var(--forge-dialog-max-width, calc(100% - var(--forge-spacing-xxlarge, 48px)));\n  --_dialog-min-height:var(--forge-dialog-min-height, 0);\n  --_dialog-max-height:var(--forge-dialog-max-height, calc(100% - var(--forge-spacing-xxlarge, 48px)));\n  --_dialog-z-index:var(--forge-dialog-z-index, var(--forge-z-index-dialog, 8));\n  --_dialog-move-handle-color:var(--forge-dialog-move-handle-color, currentColor);\n  --_dialog-move-handle-size:var(--forge-dialog-move-handle-size, 24px);\n  --_dialog-move-handle-hover-cursor:var(--forge-dialog-move-handle-hover-cursor, grab);\n  --_dialog-move-handle-active-cursor:var(--forge-dialog-move-handle-active-cursor, grabbing);\n  --_dialog-move-handle-spacing:var(--forge-dialog-move-handle-spacing, calc(var(--forge-spacing-xxsmall, 4px) * -1) 0 0);\n  --_dialog-move-transition-duration:var(--forge-dialog-move-transition-duration, var(--forge-animation-duration-short4, 200ms));\n  --_dialog-move-transition-easing:var(--forge-dialog-move-transition-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_dialog-moving-opacity:var(--forge-dialog-moving-opacity, 0.54);\n  --_dialog-enter-animation-duration:var(--forge-dialog-enter-animation-duration, var(--forge-animation-duration-medium1, 250ms));\n  --_dialog-enter-animation-easing:var(--forge-dialog-enter-animation-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_dialog-exit-animation-duration:var(--forge-dialog-exit-animation-duration, var(--forge-animation-duration-short2, 100ms));\n  --_dialog-exit-animation-easing:var(--forge-dialog-exit-animation-easing, var(--forge-animation-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)));\n  --_dialog-zoom-opacity:var(--forge-dialog-zoom-opacity, 0);\n  --_dialog-zoom-scale:var(--forge-dialog-zoom-scale, 0.8);\n  --_dialog-fade-opacity:var(--forge-dialog-fade-opacity, 0);\n  --_dialog-slide-opacity:var(--forge-dialog-slide-opacity, 0);\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 0 -30%);\n  --_dialog-backdrop-opacity:var(--forge-dialog-backdrop-opacity, var(--forge-backdrop-opacity, 0.54));\n  --_dialog-nonmodal-elevation:var(--forge-dialog-nonmodal-elevation, 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));\n  --_dialog-fullscreen-enter-animation-duration:var(--forge-dialog-fullscreen-enter-animation-duration, var(--forge-animation-duration-medium1, 250ms));\n  --_dialog-fullscreen-exit-animation-duration:var(--forge-dialog-fullscreen-exit-animation-duration, var(--forge-animation-duration-short2, 100ms));\n  --_dialog-position-x:var(--forge-dialog-position-x, 0);\n  --_dialog-position-y:var(--forge-dialog-position-y, 0);\n  --_dialog-preset-sheet-enter-animation-duration:var(--forge-dialog-preset-sheet-enter-animation-duration, var(--forge-animation-duration-medium1, 250ms));\n  --_dialog-preset-sheet-exit-animation-duration:var(--forge-dialog-preset-sheet-exit-animation-duration, var(--forge-animation-duration-short3, 150ms));\n  --_backdrop-background:var(--forge-backdrop-background, #000);\n  --_backdrop-opacity:var(--forge-backdrop-opacity, 0.54);\n  --_backdrop-z-index:var(--forge-backdrop-z-index, var(--forge-z-index-backdrop, 7));\n  --_backdrop-enter-animation-duration:var(--forge-backdrop-enter-animation-duration, var(--forge-animation-duration-short4, 200ms));\n  --_backdrop-enter-animation-easing:var(--forge-backdrop-enter-animation-easing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_backdrop-exit-animation-duration:var(--forge-backdrop-exit-animation-duration, var(--forge-animation-duration-short1, 50ms));\n  --_backdrop-exit-animation-easing:var(--forge-backdrop-exit-animation-easing, var(--forge-animation-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)));\n  --forge-theme-surface: var(--forge-theme-surface-bright, #ffffff);\n}\n\n.forge-dialog {\n  position: fixed;\n  inset: 0;\n  z-index: var(--_dialog-z-index);\n  background-color: rgba(0, 0, 0, 0);\n  color: inherit;\n  border: none;\n  width: auto;\n  height: auto;\n  padding: 0;\n  margin: 0;\n  overflow: visible;\n  max-width: 100%;\n  max-height: 100%;\n  box-sizing: border-box;\n  position: absolute;\n  inset: 0;\n  display: flex;\n  background: var(--_dialog-background);\n  box-shadow: var(--_dialog-elevation);\n  z-index: var(--_dialog-z-index);\n  overflow: hidden;\n  border-radius: var(--_dialog-shape);\n  margin-block-start: var(--_dialog-block-start-spacing);\n  margin-block-end: var(--_dialog-block-end-spacing);\n  margin-inline-start: var(--_dialog-inline-start-spacing);\n  margin-inline-end: var(--_dialog-inline-end-spacing);\n  padding: var(--_dialog-padding);\n  width: var(--_dialog-width);\n  height: var(--_dialog-height);\n  min-width: var(--_dialog-min-width);\n  max-width: var(--_dialog-max-width);\n  min-height: var(--_dialog-min-height);\n  max-height: var(--_dialog-max-height);\n  box-sizing: border-box;\n  animation-duration: var(--_dialog-exit-animation-duration);\n  animation-timing-function: var(--_dialog-exit-animation-easing);\n  position: fixed;\n  transition-property: display, opacity, overlay, scale;\n  transition-behavior: allow-discrete;\n}\n\n.forge-dialog > forge-scaffold {\n  height: auto;\n}\n\n.forge-dialog--fullscreen {\n  --_dialog-enter-animation-duration:var(--_dialog-fullscreen-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-fullscreen-exit-animation-duration);\n  height: 100%;\n  width: 100%;\n  max-width: none;\n  max-height: none;\n  border-radius: 0;\n  box-shadow: none;\n}\n\n.forge-dialog:not(:modal) {\n  --_dialog-elevation:var(--_dialog-nonmodal-elevation);\n  pointer-events: all;\n}\n\n.forge-dialog--moveable {\n  user-select: none;\n  transition-property: opacity;\n  transition-duration: var(--_dialog-move-transition-duration);\n  transition-timing-function: var(--_dialog-move-transition-easing);\n}\n\n.forge-dialog--moved {\n  margin: 0;\n}\n\n.forge-dialog--moving {\n  opacity: var(--_dialog-moving-opacity);\n}\n\n.forge-dialog__move-handle {\n  fill: var(--_dialog-move-handle-color);\n  height: var(--_dialog-move-handle-size);\n  width: var(--_dialog-move-handle-size);\n  margin: var(--_dialog-move-handle-spacing);\n  touch-action: none;\n}\n\n.forge-dialog__move-handle:hover {\n  cursor: var(--_dialog-move-handle-hover-cursor);\n}\n\n.forge-dialog__move-handle:active {\n  cursor: var(--_dialog-move-handle-active-cursor);\n}\n\n.forge-dialog__move-handle-container {\n  position: absolute;\n  top: 0;\n  z-index: 1;\n  display: flex;\n  justify-content: center;\n  width: 100%;\n}\n\n.forge-dialog--top {\n  --_dialog-block-start-spacing:var(--forge-dialog-block-start-spacing, 0);\n  top: 0;\n  bottom: auto;\n}\n\n.forge-dialog--top-right {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: 0;\n  left: auto;\n  right: 0;\n  bottom: auto;\n}\n\n.forge-dialog--top-left {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: 0;\n  left: 0;\n  right: auto;\n  bottom: auto;\n}\n\n.forge-dialog--bottom {\n  --_dialog-block-end-spacing:var(--forge-dialog-block-end-spacing, 0);\n  top: auto;\n  bottom: 0;\n}\n\n.forge-dialog--bottom-right {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: auto;\n  right: 0;\n  bottom: 0;\n}\n\n.forge-dialog--bottom-left {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: 0;\n  right: auto;\n  bottom: 0;\n}\n\n.forge-dialog--right {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: auto;\n  right: 0;\n  bottom: auto;\n}\n\n.forge-dialog--left {\n  --_dialog-spacing:var(--forge-dialog-spacing, 0);\n  top: auto;\n  left: 0;\n  right: auto;\n  bottom: auto;\n}\n\n.forge-dialog--custom {\n  margin: 0;\n  top: var(--_dialog-position-x);\n  left: var(--_dialog-position-y);\n}\n\n.forge-dialog--bottom-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 0 100%);\n}\n\n.forge-dialog--bottom-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--bottom-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--bottom-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--bottom-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--left-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  left: 0;\n  bottom: 0;\n  top: 0;\n  height: 100%;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, -100% 0);\n}\n\n.forge-dialog--left-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--left-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--left-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--left-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--right-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  right: 0;\n  bottom: 0;\n  top: 0;\n  height: 100%;\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 100% 0);\n}\n\n.forge-dialog--right-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--right-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--right-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--right-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--top-sheet {\n  --_dialog-enter-animation-duration:var(--_dialog-preset-sheet-enter-animation-duration);\n  --_dialog-exit-animation-duration:var(--_dialog-preset-sheet-exit-animation-duration);\n  --_dialog-max-width:var(--forge-dialog-max-width, none);\n  --_dialog-max-height:var(--forge-dialog-max-height, none);\n  inset: auto;\n  display: inline-flex;\n  top: 0;\n  left: 0;\n  right: 0;\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n  --_dialog-slide-translate:var(--forge-dialog-slide-translate, 0 -100%);\n}\n\n.forge-dialog--top-sheet.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--top-sheet.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--top-sheet.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--top-sheet.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog::backdrop {\n  --forge-backdrop-opacity: var(--_backdrop-opacity);\n  --forge-backdrop-enter-animation-duration: var(--_backdrop-enter-animation-duration);\n  --forge-backdrop-enter-animation-easing: var(--_backdrop-enter-animation-easing);\n  --forge-backdrop-exit-animation-duration: var(--_backdrop-exit-animation-duration);\n  --forge-backdrop-exit-animation-easing: var(--_backdrop-exit-animation-easing);\n  position: absolute;\n  inset: 0;\n  z-index: var(--_backdrop-z-index);\n  background: var(--_backdrop-background);\n  opacity: 0;\n  animation-fill-mode: forwards;\n  transition-property: display, opacity, overlay;\n}\n\n.forge-dialog[open] {\n  opacity: 1;\n  scale: 1;\n  transition-duration: var(--_dialog-enter-animation-duration);\n  transition-timing-function: var(--_dialog-enter-animation-easing);\n}\n\n@starting-style {\n  .forge-dialog[open] {\n    opacity: var(--_dialog-zoom-opacity);\n    scale: var(--_dialog-zoom-scale);\n  }\n}\n.forge-dialog[open]::backdrop {\n  opacity: var(--_backdrop-opacity);\n  transition-duration: var(--_backdrop-enter-animation-duration);\n  transition-timing-function: var(--_backdrop-enter-animation-easing);\n}\n\n@starting-style {\n  .forge-dialog[open]::backdrop {\n    opacity: 0;\n  }\n}\n.forge-dialog:not([open]) {\n  animation-duration: var(--_dialog-enter-animation-duration);\n  animation-timing-function: var(--_dialog-enter-animation-easing);\n  display: none;\n  opacity: var(--_dialog-zoom-opacity);\n  scale: var(--_dialog-zoom-scale);\n  transition-duration: var(--_dialog-exit-animation-duration);\n  transition-timing-function: var(--_dialog-exit-animation-easing);\n}\n\n.forge-dialog:not([open])::backdrop {\n  transition-duration: var(--_backdrop-exit-animation-duration);\n  transition-timing-function: var(--_backdrop-exit-animation-easing);\n}\n\n.forge-dialog--animation-fade.forge-dialog {\n  transition-property: display, opacity, overlay;\n}\n\n@starting-style {\n  .forge-dialog--animation-fade.forge-dialog[open] {\n    opacity: var(--_dialog-fade-opacity);\n  }\n}\n.forge-dialog--animation-fade.forge-dialog:not([open]) {\n  opacity: var(--_dialog-fade-opacity);\n  scale: 1;\n}\n\n.forge-dialog--animation-slide.forge-dialog {\n  transition-property: display, opacity, overlay, translate;\n}\n\n.forge-dialog--animation-slide.forge-dialog[open] {\n  translate: 0 0;\n}\n\n@starting-style {\n  .forge-dialog--animation-slide.forge-dialog[open] {\n    opacity: var(--_dialog-slide-opacity);\n    translate: var(--_dialog-slide-translate);\n  }\n}\n.forge-dialog--animation-slide.forge-dialog:not([open]) {\n  opacity: var(--_dialog-slide-opacity);\n  scale: 1;\n  translate: var(--_dialog-slide-translate);\n}\n\n.forge-dialog--animation-none {\n  --_dialog-enter-animation-duration:var(--forge-dialog-enter-animation-duration, 0s);\n  --_dialog-exit-animation-duration:var(--forge-dialog-exit-animation-duration, 0s);\n  --_backdrop-enter-animation-duration:var(--forge-backdrop-enter-animation-duration, 0s);\n  --_backdrop-exit-animation-duration:var(--forge-backdrop-exit-animation-duration, 0s);\n}\n\n@media (prefers-reduced-motion) {\n  .forge-dialog.forge-dialog {\n    transition-property: display, opacity, overlay;\n  }\n  @starting-style {\n    .forge-dialog.forge-dialog[open] {\n      opacity: var(--_dialog-fade-opacity);\n    }\n  }\n  .forge-dialog.forge-dialog:not([open]) {\n    opacity: var(--_dialog-fade-opacity);\n    scale: 1;\n  }\n}\n:host {\n  display: block;\n  width: 100%;\n  height: 100%;\n  --_ai-chatbot-icon-shape: var(--forge-ai-chatbot-icon-shape, 0);\n}\n\n.chatbot-container {\n  position: relative;\n  display: grid;\n  height: 100%;\n  overflow: hidden;\n  border-radius: inherit;\n}\n\nforge-ai-chat-interface::part(messages) {\n  overflow: hidden;\n}\nforge-ai-chat-interface forge-ai-message-thread {\n  min-height: 0;\n}\n\nforge-ai-chat-header {\n  --forge-ai-chat-header-title-color: var(--forge-ai-chatbot-header-title-color, currentColor);\n}\n\n.disclaimer {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-label1-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n  font-size: var(--forge-typography-label1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, 0.75)));\n  font-weight: var(--forge-typography-label1-font-weight, 400);\n  line-height: var(--forge-typography-label1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));\n  letter-spacing: var(--forge-typography-label1-letter-spacing, 0.0357142857em);\n  text-transform: var(--forge-typography-label1-text-transform, inherit);\n  text-decoration: var(--forge-typography-label1-text-decoration, inherit);\n  color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));\n  text-align: center;\n  margin-block-start: var(--forge-spacing-xxsmall, 4px);\n  margin-block-end: calc(var(--forge-spacing-small, 12px) * -1);\n}\n\n.suggestions-container {\n  width: 100%;\n  align-self: start;\n}\n\n::slotted([slot=empty-state-icon]) {\n  height: 200px;\n  width: 200px;\n  border-radius: var(--_ai-chatbot-icon-shape);\n}\n\n.conversations-backdrop {\n  position: absolute;\n  inset: 0;\n  background-color: transparent;\n  z-index: 1;\n}\n\n.conversations-dialog {\n  display: grid;\n  width: min(90%, 360px);\n  padding: 0;\n  border: 0;\n  position: absolute;\n  z-index: 2;\n  --forge-dialog-shape: 0;\n  --forge-dialog-nonmodal-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n}\n\n.canvas-modal {\n  --forge-ai-modal-width: var(--forge-ai-chatbot-canvas-width, 80vw);\n  --forge-ai-modal-height: var(--forge-ai-chatbot-canvas-height, 80vh);\n}\n\n.canvas {\n  --forge-ai-canvas-border-inline-start: none;\n  flex: 1;\n  min-inline-size: 0;\n}';
 export {
   styles as default
 };

package/dist/ai-chatbot/create-tool-renderer.d.ts

@@ -1,9 +1,9 @@
-import { ToolCall, ToolRenderer } from './types.js';
+import { ToolRenderFunction, ToolRenderer } from './types.js';
 export interface CreateToolRendererElementConfig {
     elementTag: keyof HTMLElementTagNameMap;
 }
-export interface CreateToolRendererFunctionConfig {
-    render: (toolCall: ToolCall) => HTMLElement | DocumentFragment;
+export interface CreateToolRendererFunctionConfig<TArgs = Record<string, unknown>, TResult = unknown> {
+    render: ToolRenderFunction<TArgs, TResult>;
 }
-export type CreateToolRendererConfig = CreateToolRendererElementConfig | CreateToolRendererFunctionConfig;
-export declare function createToolRenderer(config: CreateToolRendererConfig): ToolRenderer;
+export type CreateToolRendererConfig<TArgs = Record<string, unknown>, TResult = unknown> = CreateToolRendererElementConfig | CreateToolRendererFunctionConfig<TArgs, TResult>;
+export declare function createToolRenderer<TArgs = Record<string, unknown>, TResult = unknown>(config: CreateToolRendererConfig<TArgs, TResult>): ToolRenderer<TArgs, TResult>;

package/dist/ai-chatbot/index.d.ts

@@ -3,13 +3,14 @@ export { AiChatbotComponent, AiChatbotComponentTagName } from './ai-chatbot.js';
 export type { ForgeAiChatbotMessageEventData, ForgeAiChatbotToolCallEventData, ForgeAiChatbotErrorEventData, ForgeAiChatbotResponseFeedbackEventData, ForgeAiChatbotAgentChangeEventData, ForgeAiChatbotFileSelectEventData, ForgeAiChatbotFileRemoveEventData } from './ai-chatbot.js';
 export { AiChatbotToolCallComponent, AiChatbotToolCallComponentTagName } from './ai-chatbot-tool-call.js';
 export type { Suggestion } from '../ai-suggestions/index.js';
-export { AgentAdapter, type MessageStartEvent, type MessageDeltaEvent, type MessageEndEvent, type ToolCallEvent, type ToolCallStartEvent, type ToolCallArgsEvent, type ToolCallEndEvent, type FileUploadEvent, type FileRemoveEvent, type AdapterState, type ErrorEvent, type CustomAgentEvent, type RawAgentEvent, type RunStartedAgentEvent, type StepStartedAgentEvent, type StepFinishedAgentEvent, type StateSnapshotAgentEvent, type StateDeltaAgentEvent, type ActivitySnapshotAgentEvent, type ActivityDeltaAgentEvent } from './agent-adapter.js';
-export type { Agent, ChatMessage, ClientMessageAction, ClientMessageInput, ClientMessageKind, ContextItem, ToolDefinition, ToolCall, ToolRenderer, IToolRenderer, HandlerContext, ToolStartContext, ToolDeltaContext, ToolEndContext, FileAttachment, UploadedFileMetadata, FileUploadCallbacks, FileUploadHandler, FileRemoveCallbacks, ThreadState, FeedbackType, ResponseFeedback, MessageItem, ForgeAiChatbotContextRemoveEventData, ForgeAiChatbotThreadSelectEventData, ForgeAiChatbotThreadSearchEventData, ForgeAiChatbotThreadLoadMoreEventData, ForgeAiChatbotThreadRenameEventData, ForgeAiChatbotThreadDeleteEventData } from './types.js';
+export { AgentAdapter, type MessageStartEvent, type MessageDeltaEvent, type MessageEndEvent, type ToolCallEvent, type ToolCallStartEvent, type ToolCallArgsEvent, type ToolCallEndEvent, type FileUploadEvent, type FileRemoveEvent, type AdapterState, type ErrorEvent, type CustomAgentEvent, type RawAgentEvent, type RunStartedAgentEvent, type StepStartedAgentEvent, type StepFinishedAgentEvent, type StateSnapshotAgentEvent, type StateDeltaAgentEvent, type ActivitySnapshotAgentEvent, type ActivityDeltaAgentEvent, type McpUiResourceEvent, type McpToolCallParams, type McpResourceReadParams, type McpAppResourceResolveParams, type McpModelContextUpdateParams, type ToolResultEvent } from './agent-adapter.js';
+export type { Agent, ChatMessage, ClientMessageAction, ClientMessageInput, ClientMessageKind, ContextItem, ToolDefinition, AnyToolDefinition, ToolCall, ToolCallStatus, ToolRenderer, ToolPresentation, ToolCanvas, ToolRenderContext, ToolRenderFunction, ToolCanvasConfig, ToolCanvasInline, ToolCanvasIcon, ToolCanvasActionLabel, ToolCallMapper, ToolCallValue, IToolRenderer, HandlerContext, ToolStartContext, ToolDeltaContext, ToolEndContext, FileAttachment, UploadedFileMetadata, FileUploadCallbacks, FileUploadHandler, FileRemoveCallbacks, ThreadState, FeedbackType, ResponseFeedback, MessageItem, ForgeAiChatbotContextRemoveEventData, ForgeAiChatbotThreadSelectEventData, ForgeAiChatbotThreadSearchEventData, ForgeAiChatbotThreadLoadMoreEventData, ForgeAiChatbotThreadRenameEventData, ForgeAiChatbotThreadDeleteEventData, McpAppUiResource, McpAppUiResourceStatus, McpAppResourceCsp, McpAppResourcePermissions, McpAppHostContext, McpAppHostStyles, McpAppHostCapabilities, McpAppContainerDimensions, McpAppContentModalities, McpAppToolInfo, McpAppSandboxCapabilities, McpAppDisplayMode, McpToolResult } from './types.js';
 export * from './ag-ui-adapter.js';
 export * from './http-agent-with-credentials.js';
 export * from './event-emitter.js';
 export * from './agent-runner.js';
 export * from './create-tool-renderer.js';
+export { requestCanvasOpen, requestCanvasClose, type ForgeAiCanvasOpenRequestEventData, type ForgeAiCanvasCloseRequestEventData } from './tool-canvas.js';
 export { MessageStateController, type MessageStateControllerConfig } from './message-state-controller.js';
 export { FileUploadManager, type FileUploadManagerConfig } from './file-upload-manager.js';
 export { MarkdownStreamController } from './markdown-stream-controller.js';

package/dist/ai-chatbot/index.mjs

@@ -7,6 +7,7 @@ import { HttpAgentWithCredentials } from "./http-agent-with-credentials.mjs";
 import { EventEmitter, SubscriptionManager } from "./event-emitter.mjs";
 import { AgentRunner } from "./agent-runner.mjs";
 import { createToolRenderer } from "./create-tool-renderer.mjs";
+import { requestCanvasClose, requestCanvasOpen } from "./tool-canvas.mjs";
 import { MessageStateController } from "./message-state-controller.mjs";
 import { FileUploadManager } from "./file-upload-manager.mjs";
 import { MarkdownStreamController } from "./markdown-stream-controller.mjs";
@@ -32,6 +33,8 @@ export {
   generateId,
   renderInlineMarkdown,
   renderMarkdown,
+  requestCanvasClose,
+  requestCanvasOpen,
   toRequestMessages,
   toRequestToolCall
 };

package/dist/ai-chatbot/message-state-controller.d.ts

@@ -34,6 +34,10 @@ export declare class MessageStateController implements ReactiveController {
     appendTextDelta(messageId: string, delta: string): void;
     markTextComplete(messageId: string): void;
     addToolCallToResponse(toolCall: ToolCall): void;
+    /**
+     * Applies `updates` to a tool call wherever it is rendered: the in-progress response,
+     * an already finalized/restored response, or a top-level tool-call item.
+     */
     updateToolCallInResponse(toolCallId: string, updates: Partial<ToolCall>): void;
     completeToolCallInResponse(toolCallId: string, result: unknown, event?: ToolResultEvent): void;
     tryFinalizeResponse(): void;
@@ -52,10 +56,15 @@ export declare class MessageStateController implements ReactiveController {
     updateMessageContent(id: string, content: string): void;
     removeMessageItem(index: number): void;
     clearMessages(): void;
-    removeMessageItemsFrom(index: number): void;
+    /** Tool call ids rendered at or after `index`, inside assistant responses or as top-level items. */
+    getToolCallIdsFrom(index: number): string[];
+    /** Removes items from `index` onward and returns the ids of the tool calls they held. */
+    removeMessageItemsFrom(index: number): string[];
     /**
      * Reconstructs the message hierarchy for API compatibility.
      * Converts assistant responses back to ChatMessage format with tool calls.
+     * MCP-app `uiResource`/`uiResourceStatus` are stripped: resources are re-resolved via the
+     * adapter on restore, never persisted or sent back to the agent.
      */
     getMessages(): ChatMessage[];
     setMessages(messages: ChatMessage[]): void;