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

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

@@ -4,12 +4,13 @@ export type { ForgeAiChatbotMessageEventData, ForgeAiChatbotToolCallEventData, F
 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, 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, ToolCall, ToolCallStatus, ToolRenderer, IToolRenderer, HandlerContext, ToolStartContext, ToolDeltaContext, ToolEndContext, FileAttachment, UploadedFileMetadata, FileUploadCallbacks, FileUploadHandler, FileRemoveCallbacks, ThreadState, FeedbackType, ResponseFeedback, MessageItem, ForgeAiChatbotContextRemoveEventData, ForgeAiChatbotThreadSelectEventData, ForgeAiChatbotThreadSearchEventData, ForgeAiChatbotThreadLoadMoreEventData, ForgeAiChatbotThreadRenameEventData, ForgeAiChatbotThreadDeleteEventData, McpAppUiResource, McpAppResourceCsp, McpAppResourcePermissions, McpAppHostContext, McpAppHostStyles, McpAppHostCapabilities, McpAppContainerDimensions, McpAppContentModalities, McpAppToolInfo, McpAppSandboxCapabilities, McpAppDisplayMode, McpToolResult } from './types.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

@@ -63,8 +63,8 @@ export declare class MessageStateController implements ReactiveController {
     /**
      * Reconstructs the message hierarchy for API compatibility.
      * Converts assistant responses back to ChatMessage format with tool calls.
-     * MCP-app `uiResource`s are stripped: they are re-resolved via the adapter on restore,
-     * never persisted or sent back to the agent.
+     * 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;

package/dist/ai-chatbot/message-state-controller.mjs

@@ -1,13 +1,13 @@
 import { generateId } from "./utils.mjs";
-function withoutUiResource(toolCall) {
-  if (!toolCall.uiResource) {
+function withoutMcpAppResource(toolCall) {
+  if (!toolCall.uiResource && !toolCall.uiResourceStatus) {
     return toolCall;
   }
-  const { uiResource: _uiResource, ...rest } = toolCall;
+  const { uiResource: _uiResource, uiResourceStatus: _uiResourceStatus, ...rest } = toolCall;
   return rest;
 }
-function responseItemWithoutUiResource(item) {
-  return item.type === "toolCall" ? { type: "toolCall", data: withoutUiResource(item.data) } : item;
+function responseItemWithoutMcpAppResource(item) {
+  return item.type === "toolCall" ? { type: "toolCall", data: withoutMcpAppResource(item.data) } : item;
 }
 class MessageStateController {
   constructor(_host, _config) {
@@ -304,8 +304,8 @@ class MessageStateController {
   /**
    * Reconstructs the message hierarchy for API compatibility.
    * Converts assistant responses back to ChatMessage format with tool calls.
-   * MCP-app `uiResource`s are stripped: they are re-resolved via the adapter on restore,
-   * never persisted or sent back to the agent.
+   * MCP-app `uiResource`/`uiResourceStatus` are stripped: resources are re-resolved via the
+   * adapter on restore, never persisted or sent back to the agent.
    */
   getMessages() {
     const messages = [];
@@ -314,7 +314,7 @@ class MessageStateController {
         messages.push({ ...item.data, toolCalls: [] });
       } else if (item.type === "assistant") {
         const response = item.data;
-        const children = response.children.map(responseItemWithoutUiResource);
+        const children = response.children.map(responseItemWithoutMcpAppResource);
         const textContent = children.filter((c) => c.type === "text").map((c) => c.content).join("");
         const toolCalls = children.filter((c) => c.type === "toolCall").map((c) => c.data);
         const message = {
@@ -331,7 +331,7 @@ class MessageStateController {
       } else if (item.type === "toolCall") {
         const lastMsg = messages[messages.length - 1];
         if (lastMsg && lastMsg.role === "assistant") {
-          lastMsg.toolCalls = [...lastMsg.toolCalls || [], withoutUiResource(item.data)];
+          lastMsg.toolCalls = [...lastMsg.toolCalls || [], withoutMcpAppResource(item.data)];
         }
       }
     }
@@ -346,7 +346,7 @@ class MessageStateController {
         let children;
         if (msg.children?.length) {
           children = msg.children.map((child) => {
-            const restored = responseItemWithoutUiResource(child);
+            const restored = responseItemWithoutMcpAppResource(child);
             if (restored.type === "toolCall") {
               this._toolCalls.set(restored.data.id, restored.data);
             }
@@ -358,7 +358,7 @@ class MessageStateController {
             children.push({ type: "text", messageId: msg.id, content: msg.content, status: "complete" });
           }
           if (msg.toolCalls) {
-            for (const toolCall of msg.toolCalls.map(withoutUiResource)) {
+            for (const toolCall of msg.toolCalls.map(withoutMcpAppResource)) {
               children.push({ type: "toolCall", data: toolCall });
               this._toolCalls.set(toolCall.id, toolCall);
             }

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

@@ -0,0 +1,60 @@
+import { ToolCall, ToolCanvas, ToolCanvasInline, AnyToolDefinition, ToolPresentation } from './types.js';
+export interface ForgeAiCanvasOpenRequestEventData {
+    toolCallId: string;
+    toolName: string;
+    title?: string;
+    /** Set to true by the host once the tool call is showing in the canvas. */
+    handled?: boolean;
+}
+export interface ForgeAiCanvasCloseRequestEventData {
+    toolCallId: string;
+    /** Set to true by the host once the canvas has closed. */
+    handled?: boolean;
+}
+declare global {
+    interface HTMLElementEventMap {
+        'forge-ai-canvas-open-request': CustomEvent<ForgeAiCanvasOpenRequestEventData>;
+        'forge-ai-canvas-close-request': CustomEvent<ForgeAiCanvasCloseRequestEventData>;
+    }
+}
+/** State a canvas host shares with the tool calls rendered in its thread. */
+export interface ToolCanvasHostState {
+    /** Presentation assigned to inline renderers of canvas-enabled tools. */
+    presentation: ToolPresentation;
+    /** Tool call currently shown in the canvas, if any. */
+    openToolCallId?: string;
+}
+/**
+ * Provided by hosts that render tool calls next to a canvas panel. Without a provider, inline
+ * renderers get `inline`.
+ */
+export declare const toolCanvasHostContext: {
+    __context__: ToolCanvasHostState;
+};
+/**
+ * Asks the nearest canvas host to show the given tool call. Hosts without a canvas leave the event
+ * unhandled. Returns whether the tool call is now showing.
+ */
+export declare function requestCanvasOpen(target: EventTarget, detail: ForgeAiCanvasOpenRequestEventData): boolean;
+/** Asks the nearest canvas host to close the canvas if it is showing the given tool call. Returns whether it closed. */
+export declare function requestCanvasClose(target: EventTarget, detail: ForgeAiCanvasCloseRequestEventData): boolean;
+export interface CreateToolCanvasConfig {
+    available: boolean;
+    /** Read live by `toggle()`; `isOpen` on the result is a snapshot taken when the controls are built. */
+    isOpen: () => boolean;
+    open: (options?: {
+        title?: string;
+    }) => boolean;
+    close: () => boolean;
+}
+/** Builds the `canvas` controls a host injects into a tool renderer. */
+export declare function createToolCanvas({ available, isOpen, open, close }: CreateToolCanvasConfig): ToolCanvas;
+export declare function resolveToolCanvasTitle(toolCall: ToolCall, toolDefinition: AnyToolDefinition): string;
+export declare function resolveToolCanvasSubtitle(toolCall: ToolCall, toolDefinition: AnyToolDefinition): string | undefined;
+export declare function resolveToolCanvasActionLabel(toolCall: ToolCall, toolDefinition: AnyToolDefinition, active: boolean): string;
+/**
+ * Resolves the artifact card icon to a fresh `<svg>` element, or undefined for the card's default glyph.
+ * Markup strings are parsed and reduced to an allowlist of shape elements and presentation attributes.
+ */
+export declare function resolveToolCanvasIcon(toolCall: ToolCall, toolDefinition: AnyToolDefinition): SVGElement | undefined;
+export declare function resolveToolCanvasInline(toolDefinition: AnyToolDefinition): ToolCanvasInline;

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

@@ -0,0 +1,128 @@
+import { createContext } from "@lit/context";
+const toolCanvasHostContext = createContext(/* @__PURE__ */ Symbol("forge-ai-tool-canvas-host"));
+function requestCanvasOpen(target, detail) {
+  const request = { ...detail, handled: false };
+  target.dispatchEvent(
+    new CustomEvent("forge-ai-canvas-open-request", {
+      detail: request,
+      bubbles: true,
+      composed: true
+    })
+  );
+  return request.handled;
+}
+function requestCanvasClose(target, detail) {
+  const request = { ...detail, handled: false };
+  target.dispatchEvent(
+    new CustomEvent("forge-ai-canvas-close-request", {
+      detail: request,
+      bubbles: true,
+      composed: true
+    })
+  );
+  return request.handled;
+}
+function createToolCanvas({ available, isOpen, open, close }) {
+  return {
+    available,
+    isOpen: isOpen(),
+    open: (options) => available && open(options),
+    close: () => available && close(),
+    toggle: () => available && (isOpen() ? close() : open())
+  };
+}
+const DEFAULT_ACTION_LABEL = { open: "Open in canvas", collapse: "Collapse canvas" };
+function resolveToolCallValue(value, toolCall) {
+  if (typeof value === "function") {
+    return value(toolCall);
+  }
+  return value;
+}
+function resolveToolCanvasTitle(toolCall, toolDefinition) {
+  return resolveToolCallValue(toolDefinition.canvas?.title, toolCall) ?? toolDefinition.displayName ?? toolDefinition.name;
+}
+function resolveToolCanvasSubtitle(toolCall, toolDefinition) {
+  return resolveToolCallValue(toolDefinition.canvas?.subtitle, toolCall);
+}
+function resolveToolCanvasActionLabel(toolCall, toolDefinition, active) {
+  const labels = resolveToolCallValue(toolDefinition.canvas?.actionLabel, toolCall) ?? DEFAULT_ACTION_LABEL;
+  return active ? labels.collapse : labels.open;
+}
+function resolveToolCanvasIcon(toolCall, toolDefinition) {
+  const icon = resolveToolCallValue(toolDefinition.canvas?.icon, toolCall);
+  if (!icon) {
+    return void 0;
+  }
+  if (typeof icon !== "string") {
+    return icon.cloneNode(true);
+  }
+  const template = document.createElement("template");
+  template.innerHTML = icon;
+  const svg = template.content.querySelector("svg");
+  if (!svg) {
+    return void 0;
+  }
+  sanitizeSvg(svg);
+  return svg;
+}
+const SVG_ICON_ELEMENTS = /* @__PURE__ */ new Set(["svg", "g", "path", "circle", "ellipse", "rect", "line", "polyline", "polygon"]);
+const SVG_ICON_ATTRIBUTES = /* @__PURE__ */ new Set([
+  "xmlns",
+  "viewBox",
+  "width",
+  "height",
+  "d",
+  "fill",
+  "fill-rule",
+  "clip-rule",
+  "stroke",
+  "stroke-width",
+  "stroke-linecap",
+  "stroke-linejoin",
+  "opacity",
+  "transform",
+  "cx",
+  "cy",
+  "r",
+  "rx",
+  "ry",
+  "x",
+  "y",
+  "x1",
+  "y1",
+  "x2",
+  "y2",
+  "points",
+  "aria-hidden"
+]);
+function sanitizeSvg(svg) {
+  for (const element of [svg, ...svg.querySelectorAll("*")]) {
+    if (!SVG_ICON_ELEMENTS.has(element.localName)) {
+      element.remove();
+      continue;
+    }
+    for (const attribute of [...element.attributes]) {
+      if (!SVG_ICON_ATTRIBUTES.has(attribute.name)) {
+        element.removeAttribute(attribute.name);
+      }
+    }
+  }
+}
+function resolveToolCanvasInline(toolDefinition) {
+  const canvas = toolDefinition.canvas;
+  if (canvas?.inline) {
+    return canvas.inline;
+  }
+  return canvas?.open === "auto" ? "card" : "renderer";
+}
+export {
+  createToolCanvas,
+  requestCanvasClose,
+  requestCanvasOpen,
+  resolveToolCanvasActionLabel,
+  resolveToolCanvasIcon,
+  resolveToolCanvasInline,
+  resolveToolCanvasSubtitle,
+  resolveToolCanvasTitle,
+  toolCanvasHostContext
+};