@tylertech/forge-ai 0.6.1 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/custom-elements.json +1959 -1365
  2. package/dist/ai-actions-toolbar/ai-actions-toolbar.mjs +1 -0
  3. package/dist/ai-assistant-response/ai-assistant-response.d.ts +45 -0
  4. package/dist/ai-assistant-response/ai-assistant-response.mjs +211 -0
  5. package/dist/ai-assistant-response/ai-assistant-response.scss.mjs +4 -0
  6. package/dist/ai-assistant-response/index.d.ts +1 -0
  7. package/dist/ai-assistant-response/index.mjs +5 -0
  8. package/dist/ai-chat-interface/ai-chat-interface.mjs +4 -1
  9. package/dist/ai-chatbot/ag-ui-adapter.mjs +44 -1
  10. package/dist/ai-chatbot/agent-adapter.d.ts +68 -0
  11. package/dist/ai-chatbot/agent-adapter.mjs +64 -1
  12. package/dist/ai-chatbot/ai-chatbot-tool-call.mjs +14 -12
  13. package/dist/ai-chatbot/ai-chatbot-tool-call.scss.mjs +1 -1
  14. package/dist/ai-chatbot/ai-chatbot.d.ts +3 -0
  15. package/dist/ai-chatbot/ai-chatbot.mjs +50 -60
  16. package/dist/ai-chatbot/ai-chatbot.scss.mjs +1 -1
  17. package/dist/ai-chatbot/index.d.ts +1 -1
  18. package/dist/ai-chatbot/message-state-controller.d.ts +16 -11
  19. package/dist/ai-chatbot/message-state-controller.mjs +216 -112
  20. package/dist/ai-chatbot/types.d.ts +19 -0
  21. package/dist/ai-fab/ai-fab.scss.mjs +1 -1
  22. package/dist/ai-message-thread/ai-message-thread.mjs +35 -17
  23. package/dist/ai-response-message/ai-response-message.d.ts +1 -20
  24. package/dist/ai-response-message/ai-response-message.mjs +4 -112
  25. package/dist/ai-response-message/ai-response-message.scss.mjs +1 -1
  26. package/dist/core/tooltip/tooltip.d.ts +1 -0
  27. package/dist/core/tooltip/tooltip.mjs +6 -0
  28. package/dist/index.d.ts +1 -0
  29. package/dist/index.mjs +3 -0
  30. package/dist/tools/ai-data-table/ai-data-table-definition.mjs +1 -1
  31. package/package.json +1 -1
@@ -143,6 +143,7 @@ let AiActionsToolbarComponent = class extends LitElement {
143
143
  .anchor=${this._thumbsDownButton ?? null}
144
144
  placement="bottom"
145
145
  .shift=${true}
146
+ flip
146
147
  arrow
147
148
  @forge-ai-popover-toggle=${this._handlePopoverToggle}>
148
149
  ${this._feedbackFormTemplate}
@@ -0,0 +1,45 @@
1
+ import { LitElement, TemplateResult } from 'lit';
2
+ import { AssistantResponse, ToolDefinition } from '../ai-chatbot/types.js';
3
+ declare global {
4
+ interface HTMLElementTagNameMap {
5
+ 'forge-ai-assistant-response': AiAssistantResponseComponent;
6
+ }
7
+ interface HTMLElementEventMap {
8
+ 'forge-ai-assistant-response-copy': CustomEvent<{
9
+ responseId: string;
10
+ }>;
11
+ 'forge-ai-assistant-response-refresh': CustomEvent<{
12
+ responseId: string;
13
+ }>;
14
+ 'forge-ai-assistant-response-thumbs-up': CustomEvent<{
15
+ responseId: string;
16
+ }>;
17
+ 'forge-ai-assistant-response-thumbs-down': CustomEvent<{
18
+ responseId: string;
19
+ }>;
20
+ }
21
+ }
22
+ export declare const AiAssistantResponseComponentTagName: keyof HTMLElementTagNameMap;
23
+ /**
24
+ * @tag forge-ai-assistant-response
25
+ *
26
+ * @summary Renders a complete assistant response with interleaved text chunks and tool calls.
27
+ *
28
+ * @event {CustomEvent<{ responseId: string }>} forge-ai-assistant-response-copy - Fired when copy action is clicked
29
+ * @event {CustomEvent<{ responseId: string }>} forge-ai-assistant-response-refresh - Fired when refresh action is clicked
30
+ * @event {CustomEvent<{ responseId: string }>} forge-ai-assistant-response-thumbs-up - Fired when thumbs up is clicked
31
+ * @event {CustomEvent<{ responseId: string }>} forge-ai-assistant-response-thumbs-down - Fired when thumbs down is clicked
32
+ */
33
+ export declare class AiAssistantResponseComponent extends LitElement {
34
+ #private;
35
+ static styles: import('lit').CSSResult;
36
+ response: AssistantResponse;
37
+ tools?: Map<string, ToolDefinition>;
38
+ enableReactions: boolean;
39
+ debugMode: boolean;
40
+ private _debugPopoverOpen;
41
+ private _debugButton?;
42
+ connectedCallback(): void;
43
+ willUpdate(): void;
44
+ render(): TemplateResult;
45
+ }
@@ -0,0 +1,211 @@
1
+ import { unsafeCSS, LitElement, html, nothing } from "lit";
2
+ import { property, state, query, customElement } from "lit/decorators.js";
3
+ import { unsafeHTML } from "lit/directives/unsafe-html.js";
4
+ import { MarkdownStreamController } from "../ai-chatbot/markdown-stream-controller.mjs";
5
+ import "../ai-actions-toolbar/ai-actions-toolbar.mjs";
6
+ import "../ai-chatbot/ai-chatbot-tool-call.mjs";
7
+ import "../ai-event-stream-viewer/ai-event-stream-viewer.mjs";
8
+ import "../core/popover/popover.mjs";
9
+ import "../core/tooltip/tooltip.mjs";
10
+ import styles from "./ai-assistant-response.scss.mjs";
11
+ var __defProp = Object.defineProperty;
12
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
13
+ var __typeError = (msg) => {
14
+ throw TypeError(msg);
15
+ };
16
+ var __decorateClass = (decorators, target, key, kind) => {
17
+ var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
18
+ for (var i = decorators.length - 1, decorator; i >= 0; i--)
19
+ if (decorator = decorators[i])
20
+ result = (kind ? decorator(target, key, result) : decorator(result)) || result;
21
+ if (kind && result) __defProp(target, key, result);
22
+ return result;
23
+ };
24
+ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
25
+ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
26
+ 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);
27
+ var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
28
+ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
29
+ var _internals, _markdownController, _debugIcon, _AiAssistantResponseComponent_instances, hasVisibleContent_get, updateEmptyState_fn, renderTextChunk_fn, renderToolCall_fn, children_get, handleToolbarAction_fn, handleDebugClick_fn, handleDebugPopoverToggle_fn, debugButton_get, debugPopover_get, toolbar_get;
30
+ const AiAssistantResponseComponentTagName = "forge-ai-assistant-response";
31
+ let AiAssistantResponseComponent = class extends LitElement {
32
+ constructor() {
33
+ super(...arguments);
34
+ __privateAdd(this, _AiAssistantResponseComponent_instances);
35
+ this.enableReactions = false;
36
+ this.debugMode = false;
37
+ this._debugPopoverOpen = false;
38
+ __privateAdd(this, _internals, this.attachInternals());
39
+ __privateAdd(this, _markdownController);
40
+ __privateAdd(this, _debugIcon, html`
41
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
42
+ <path
43
+ d="M14 12h-4v-2h4m0 6h-4v-2h4m6-6h-2.81a6 6 0 0 0-1.82-1.96L17 4.41 15.59 3l-2.17 2.17a6 6 0 0 0-2.83 0L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20z" />
44
+ </svg>
45
+ `);
46
+ }
47
+ connectedCallback() {
48
+ super.connectedCallback();
49
+ __privateSet(this, _markdownController, new MarkdownStreamController(this));
50
+ }
51
+ willUpdate() {
52
+ __privateMethod(this, _AiAssistantResponseComponent_instances, updateEmptyState_fn).call(this);
53
+ }
54
+ render() {
55
+ return html`
56
+ <div class="assistant-response" ?data-complete=${this.response.status === "complete"}>
57
+ ${__privateGet(this, _AiAssistantResponseComponent_instances, children_get)} ${__privateGet(this, _AiAssistantResponseComponent_instances, toolbar_get)}
58
+ </div>
59
+ ${__privateGet(this, _AiAssistantResponseComponent_instances, debugPopover_get)}
60
+ `;
61
+ }
62
+ };
63
+ _internals = /* @__PURE__ */ new WeakMap();
64
+ _markdownController = /* @__PURE__ */ new WeakMap();
65
+ _debugIcon = /* @__PURE__ */ new WeakMap();
66
+ _AiAssistantResponseComponent_instances = /* @__PURE__ */ new WeakSet();
67
+ hasVisibleContent_get = function() {
68
+ return this.response.children.some((child) => {
69
+ if (child.type === "text") {
70
+ return child.content.trim().length > 0;
71
+ }
72
+ if (this.debugMode) {
73
+ return true;
74
+ }
75
+ const toolDef = this.tools?.get(child.data.name);
76
+ return !!toolDef?.renderer && child.data.status === "complete";
77
+ });
78
+ };
79
+ updateEmptyState_fn = function() {
80
+ const isEmpty = !__privateGet(this, _AiAssistantResponseComponent_instances, hasVisibleContent_get) && this.response.status !== "complete";
81
+ if (isEmpty) {
82
+ __privateGet(this, _internals).states.add("empty");
83
+ } else {
84
+ __privateGet(this, _internals).states.delete("empty");
85
+ }
86
+ };
87
+ renderTextChunk_fn = function(child) {
88
+ if (!child.content.trim()) {
89
+ return nothing;
90
+ }
91
+ const renderedHtml = __privateGet(this, _markdownController).getCachedHtml(child.messageId, child.content);
92
+ return html`<div class="text-chunk">${unsafeHTML(renderedHtml)}</div>`;
93
+ };
94
+ renderToolCall_fn = function(toolCall) {
95
+ const toolDefinition = this.tools?.get(toolCall.name);
96
+ if (!this.debugMode) {
97
+ if (!toolDefinition?.renderer || toolCall.status !== "complete") {
98
+ return nothing;
99
+ }
100
+ }
101
+ return html`<forge-ai-chatbot-tool-call
102
+ .toolCall=${toolCall}
103
+ .toolDefinition=${toolDefinition}
104
+ ?debug-mode=${this.debugMode}></forge-ai-chatbot-tool-call>`;
105
+ };
106
+ children_get = function() {
107
+ return this.response.children.map((child) => {
108
+ if (child.type === "text") {
109
+ return __privateMethod(this, _AiAssistantResponseComponent_instances, renderTextChunk_fn).call(this, child);
110
+ } else {
111
+ return __privateMethod(this, _AiAssistantResponseComponent_instances, renderToolCall_fn).call(this, child.data);
112
+ }
113
+ });
114
+ };
115
+ handleToolbarAction_fn = function(event) {
116
+ const action = event.detail.action;
117
+ const eventType = `forge-ai-assistant-response-${action}`;
118
+ const bubbleEvent = new CustomEvent(eventType, {
119
+ detail: { responseId: this.response.id },
120
+ bubbles: true,
121
+ composed: true
122
+ });
123
+ this.dispatchEvent(bubbleEvent);
124
+ };
125
+ handleDebugClick_fn = function() {
126
+ this._debugPopoverOpen = !this._debugPopoverOpen;
127
+ };
128
+ handleDebugPopoverToggle_fn = function(event) {
129
+ this._debugPopoverOpen = event.detail.open;
130
+ };
131
+ debugButton_get = function() {
132
+ const hasDebugData = this.debugMode && (this.response.eventStream?.length ?? 0) > 0;
133
+ if (!hasDebugData) {
134
+ return nothing;
135
+ }
136
+ return html`
137
+ <button
138
+ id="debug-btn"
139
+ aria-label="View event stream"
140
+ class="forge-icon-button forge-icon-button--tonal forge-icon-button--small debug-button"
141
+ @click=${__privateMethod(this, _AiAssistantResponseComponent_instances, handleDebugClick_fn)}>
142
+ ${__privateGet(this, _debugIcon)}
143
+ </button>
144
+ <forge-ai-tooltip for="debug-btn" placement="bottom">Event Stream</forge-ai-tooltip>
145
+ `;
146
+ };
147
+ debugPopover_get = function() {
148
+ const hasDebugData = this.debugMode && this.response.eventStream;
149
+ if (!hasDebugData) {
150
+ return nothing;
151
+ }
152
+ return html`
153
+ <forge-ai-popover
154
+ .anchor=${this._debugButton}
155
+ .open=${this._debugPopoverOpen}
156
+ id="debug-popover"
157
+ placement="right"
158
+ .flip=${true}
159
+ .shift=${true}
160
+ @forge-ai-popover-toggle=${__privateMethod(this, _AiAssistantResponseComponent_instances, handleDebugPopoverToggle_fn)}>
161
+ <forge-ai-event-stream-viewer
162
+ .events=${this.response.eventStream}></forge-ai-event-stream-viewer>
163
+ </forge-ai-popover>
164
+ `;
165
+ };
166
+ toolbar_get = function() {
167
+ if (this.response.status !== "complete") {
168
+ return nothing;
169
+ }
170
+ const hasTextContent = this.response.children.some(
171
+ (child) => child.type === "text" && child.content.trim().length > 0
172
+ );
173
+ if (!hasTextContent) {
174
+ return nothing;
175
+ }
176
+ return html`
177
+ <div class="toolbar-container">
178
+ <forge-ai-actions-toolbar
179
+ ?enable-reactions=${this.enableReactions}
180
+ @forge-ai-actions-toolbar-action=${__privateMethod(this, _AiAssistantResponseComponent_instances, handleToolbarAction_fn)}>
181
+ </forge-ai-actions-toolbar>
182
+ ${__privateGet(this, _AiAssistantResponseComponent_instances, debugButton_get)}
183
+ </div>
184
+ `;
185
+ };
186
+ AiAssistantResponseComponent.styles = unsafeCSS(styles);
187
+ __decorateClass([
188
+ property({ attribute: false })
189
+ ], AiAssistantResponseComponent.prototype, "response", 2);
190
+ __decorateClass([
191
+ property({ attribute: false })
192
+ ], AiAssistantResponseComponent.prototype, "tools", 2);
193
+ __decorateClass([
194
+ property({ type: Boolean, attribute: "enable-reactions" })
195
+ ], AiAssistantResponseComponent.prototype, "enableReactions", 2);
196
+ __decorateClass([
197
+ property({ type: Boolean, attribute: "debug-mode" })
198
+ ], AiAssistantResponseComponent.prototype, "debugMode", 2);
199
+ __decorateClass([
200
+ state()
201
+ ], AiAssistantResponseComponent.prototype, "_debugPopoverOpen", 2);
202
+ __decorateClass([
203
+ query("#debug-btn")
204
+ ], AiAssistantResponseComponent.prototype, "_debugButton", 2);
205
+ AiAssistantResponseComponent = __decorateClass([
206
+ customElement(AiAssistantResponseComponentTagName)
207
+ ], AiAssistantResponseComponent);
208
+ export {
209
+ AiAssistantResponseComponent,
210
+ AiAssistantResponseComponentTagName
211
+ };
@@ -0,0 +1,4 @@
1
+ const styles = '/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n.forge-icon-button {\n --_icon-button-display: var(--forge-icon-button-display, inline-flex);\n --_icon-button-size: var(--forge-icon-button-size, 48px);\n --_icon-button-gap: var(--forge-icon-button-gap, 0);\n --_icon-button-icon-color: var(--forge-icon-button-icon-color, currentColor);\n --_icon-button-background-color: var(--forge-icon-button-background-color, none);\n --_icon-button-icon-size: var(--forge-icon-button-icon-size, calc(var(--forge-typography-font-size, 1rem) * 1.5));\n --_icon-button-cursor: var(--forge-icon-button-cursor, pointer);\n --_icon-button-padding: var(--forge-icon-button-padding, var(--forge-spacing-xxsmall, 4px));\n --_icon-button-border: var(--forge-icon-button-border, none);\n --_icon-button-shadow: var(--forge-icon-button-shadow, none);\n --_icon-button-transition-duration: var(--forge-icon-button-transition-duration, var(--forge-animation-duration-short3, 150ms));\n --_icon-button-transition-timing: var(--forge-icon-button-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n --_icon-button-shape: var(--forge-icon-button-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));\n --_icon-button-shape-start-start: var(--forge-icon-button-shape-start-start, var(--_icon-button-shape));\n --_icon-button-shape-start-end: var(--forge-icon-button-shape-start-end, var(--_icon-button-shape));\n --_icon-button-shape-end-start: var(--forge-icon-button-shape-end-start, var(--_icon-button-shape));\n --_icon-button-shape-end-end: var(--forge-icon-button-shape-end-end, var(--_icon-button-shape));\n --_icon-button-shape-squared: var(--forge-icon-button-shape-squared, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));\n --_icon-button-outlined-border-width: var(--forge-icon-button-outlined-border-width, 1px);\n --_icon-button-outlined-border-style: var(--forge-icon-button-outlined-border-style, solid);\n --_icon-button-outlined-border-color: var(--forge-icon-button-outlined-border-color, var(--_icon-button-icon-color));\n --_icon-button-tonal-icon-color: var(--forge-icon-button-tonal-icon-color, var(--forge-theme-on-primary-container, #222c62));\n --_icon-button-tonal-background-color: var(--forge-icon-button-tonal-background-color, var(--forge-theme-primary-container, #d1d5ed));\n --_icon-button-filled-icon-color: var(--forge-icon-button-filled-icon-color, var(--forge-theme-on-primary, #ffffff));\n --_icon-button-filled-background-color: var(--forge-icon-button-filled-background-color, var(--forge-theme-primary, #3f51b5));\n --_icon-button-raised-shadow: var(--forge-icon-button-raised-shadow, 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12));\n --_icon-button-raised-hover-shadow: var(--forge-icon-button-raised-hover-shadow, 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 --_icon-button-raised-active-shadow: var(--forge-icon-button-raised-active-shadow, 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12));\n --_icon-button-raised-disabled-shadow: var(--forge-icon-button-raised-disabled-shadow, none);\n --_icon-button-density-small-size: var(--forge-icon-button-density-small-size, 24px);\n --_icon-button-density-small-padding: var(--forge-icon-button-density-small-padding, var(--forge-spacing-xxxsmall, 2px));\n --_icon-button-density-small-icon-size: var(--forge-icon-button-density-small-icon-size, calc(var(--forge-typography-font-size, 1rem) * 1.125));\n --_icon-button-density-medium-size: var(--forge-icon-button-density-medium-size, 36px);\n --_icon-button-density-medium-padding: var(--forge-icon-button-density-medium-padding, var(--forge-spacing-xxsmall, 4px));\n --_icon-button-density-large-size: var(--forge-icon-button-density-large-size, var(--_icon-button-size));\n --_icon-button-toggle-on-background-color: var(--forge-icon-button-toggle-on-background-color, var(--forge-theme-primary-container, #d1d5ed));\n --_icon-button-toggle-on-icon-color: var(--forge-icon-button-toggle-on-icon-color, var(--forge-theme-primary, #3f51b5));\n --_icon-button-outlined-toggle-on-background-color: var(--forge-icon-button-outlined-toggle-on-background-color, var(--forge-theme-primary-container, #d1d5ed));\n --_icon-button-outlined-toggle-on-icon-color: var(--forge-icon-button-outlined-toggle-on-icon-color, var(--forge-theme-primary, #3f51b5));\n --_icon-button-tonal-toggle-background-color: var(--forge-icon-button-tonal-toggle-background-color, var(--forge-theme-surface-container-low, #ebebeb));\n --_icon-button-tonal-toggle-on-background-color: var(--forge-icon-button-tonal-toggle-on-background-color, var(--forge-theme-primary-container, #d1d5ed));\n --_icon-button-tonal-toggle-on-icon-color: var(--forge-icon-button-tonal-toggle-on-icon-color, var(--forge-theme-primary, #3f51b5));\n --_icon-button-filled-toggle-background-color: var(--forge-icon-button-filled-toggle-background-color, var(--forge-theme-surface-container-low, #ebebeb));\n --_icon-button-filled-toggle-icon-color: var(--forge-icon-button-filled-toggle-icon-color, var(--forge-theme-primary, #3f51b5));\n --_icon-button-filled-toggle-on-background-color: var(--forge-icon-button-filled-toggle-on-background-color, var(--forge-theme-primary, #3f51b5));\n --_icon-button-filled-toggle-on-icon-color: var(--forge-icon-button-filled-toggle-on-icon-color, var(--forge-theme-on-primary, #ffffff));\n --_icon-button-disabled-cursor: var(--forge-icon-button-disabled-cursor, not-allowed);\n --_icon-button-disabled-opacity: var(--forge-icon-button-disabled-opacity, 0.38);\n --_icon-button-popover-icon-padding: var(--forge-icon-button-popover-icon-padding, var(--forge-spacing-xsmall, 8px));\n --_icon-button-focus-indicator-color: var(--forge-icon-button-focus-indicator-color, var(--forge-theme-primary, #3f51b5));\n}\n\n.forge-icon-button {\n display: var(--_icon-button-display);\n position: relative;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n z-index: 0;\n display: var(--_icon-button-display);\n align-items: center;\n justify-content: center;\n gap: var(--_icon-button-gap);\n box-sizing: border-box;\n height: var(--_icon-button-density-large-size);\n min-width: var(--_icon-button-density-large-size);\n border: var(--_icon-button-border);\n border-start-start-radius: var(--_icon-button-shape-start-start);\n border-start-end-radius: var(--_icon-button-shape-start-end);\n border-end-start-radius: var(--_icon-button-shape-end-start);\n border-end-end-radius: var(--_icon-button-shape-end-end);\n padding: var(--_icon-button-padding);\n box-shadow: var(--_icon-button-shadow);\n color: var(--_icon-button-icon-color);\n background: var(--_icon-button-background-color);\n font-size: var(--_icon-button-icon-size);\n cursor: var(--_icon-button-cursor);\n user-select: none;\n transition-property: box-shadow, background;\n transition-duration: var(--_icon-button-transition-duration);\n transition-timing-function: var(--_icon-button-transition-timing);\n}\n\n.forge-icon-button img,\n.forge-icon-button svg {\n height: var(--_icon-button-icon-size);\n width: var(--_icon-button-icon-size);\n}\n\n.forge-icon-button svg {\n fill: currentColor;\n}\n\n.forge-icon-button:not(:disabled) {\n --_state-layer-display: var(--forge-state-layer-display, flex);\n --_state-layer-color: var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));\n --_state-layer-hover-color: var(--forge-state-layer-hover-color, var(--_state-layer-color));\n --_state-layer-hover-opacity: var(--forge-state-layer-hover-opacity, 0.08);\n --_state-layer-pressed-color: var(--forge-state-layer-pressed-color, var(--_state-layer-color));\n --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.12);\n --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 15ms);\n --_state-layer-pressed-duration: var(--forge-state-layer-pressed-duration, 105ms);\n --_state-layer-animation-duration: var(--forge-state-layer-animation-duration, 375ms);\n}\n\n.forge-icon-button:not(:disabled)::before {\n opacity: 0;\n position: absolute;\n backface-visibility: hidden;\n transform: translateZ(0);\n background-color: var(--_state-layer-hover-color);\n inset: 0;\n transition: opacity var(--_state-layer-hover-duration) linear, background-color var(--_state-layer-hover-duration) linear;\n --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 100ms);\n content: "";\n opacity: 0;\n border-radius: inherit;\n}\n\n.forge-icon-button:not(:disabled):hover::before {\n background-color: var(--_state-layer-hover-color);\n opacity: var(--_state-layer-hover-opacity);\n}\n\n.forge-icon-button:not(:disabled):active::before {\n opacity: var(--_state-layer-pressed-opacity);\n transition-duration: var(--_state-layer-pressed-duration);\n --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.18);\n}\n\n.forge-icon-button:not(:disabled) {\n --forge-state-layer-color: var(--_icon-button-icon-color);\n}\n\n@keyframes forge-focus-indicator-outward-grow {\n from {\n outline-width: 0;\n }\n to {\n outline-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-outward-shrink {\n from {\n outline-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-inward-grow {\n from {\n border-width: 0;\n }\n to {\n border-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-inward-shrink {\n from {\n border-width: var(--_focus-indicator-active-width);\n }\n}\n.forge-icon-button:not(:disabled) {\n outline: none;\n}\n\n.forge-icon-button:not(:disabled):focus-visible::after {\n --_focus-indicator-display: var(--forge-focus-indicator-display, flex);\n --_focus-indicator-width: var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));\n --_focus-indicator-active-width: var(--forge-focus-indicator-active-width, 6px);\n --_focus-indicator-color: var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));\n --_focus-indicator-shape: var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));\n --_focus-indicator-duration: var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));\n --_focus-indicator-easing: var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));\n --_focus-indicator-shape-start-start: var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));\n --_focus-indicator-shape-start-end: var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));\n --_focus-indicator-shape-end-end: var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));\n --_focus-indicator-shape-end-start: var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));\n --_focus-indicator-outward-offset: var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));\n --_focus-indicator-inward-offset: var(--forge-focus-indicator-inward-offset, 0px);\n --_focus-indicator-offset-block: var(--forge-focus-indicator-offset-block, 0);\n --_focus-indicator-offset-inline: var(--forge-focus-indicator-offset-inline, 0);\n}\n\n.forge-icon-button:not(:disabled):focus-visible::after {\n animation-delay: 0s, calc(var(--_focus-indicator-duration) * 0.25);\n animation-duration: calc(var(--_focus-indicator-duration) * 0.25), calc(var(--_focus-indicator-duration) * 0.75);\n animation-timing-function: var(--_focus-indicator-easing);\n box-sizing: border-box;\n color: var(--_focus-indicator-color);\n display: none;\n pointer-events: none;\n position: absolute;\n margin-block: var(--_focus-indicator-offset-block);\n margin-inline: var(--_focus-indicator-offset-inline);\n animation-name: forge-focus-indicator-outward-grow, forge-focus-indicator-outward-shrink;\n border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));\n border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));\n border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));\n border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));\n inset: calc(-1 * var(--_focus-indicator-outward-offset));\n outline: var(--_focus-indicator-width) solid currentColor;\n content: "";\n display: block;\n}\n\n.forge-icon-button:not(:disabled) {\n --forge-focus-indicator-color: var(--_icon-button-focus-indicator-color);\n --forge-focus-indicator-shape: var(--_icon-button-shape);\n}\n\n.forge-icon-button:not(:disabled):where(.forge-icon-button--text,\n:not(:where(.forge-icon-button--outlined, .forge-icon-button--tonal, .forge-icon-button--filled, .forge-icon-button--raised))) {\n --forge-focus-indicator-outward-offset: 0px;\n}\n\n.forge-icon-button--outlined {\n border-width: var(--_icon-button-outlined-border-width);\n border-style: var(--_icon-button-outlined-border-style);\n border-color: var(--_icon-button-outlined-border-color);\n}\n\n.forge-icon-button--tonal {\n --_icon-button-icon-color: var(--_icon-button-tonal-icon-color);\n --_icon-button-background-color: var(--_icon-button-tonal-background-color);\n}\n\n.forge-icon-button--filled, .forge-icon-button--raised {\n --_icon-button-icon-color: var(--_icon-button-filled-icon-color);\n --_icon-button-background-color: var(--_icon-button-filled-background-color);\n}\n\n.forge-icon-button--raised {\n --_icon-button-shadow: var(--_icon-button-raised-shadow);\n}\n\n.forge-icon-button--raised:hover {\n --_icon-button-raised-shadow: var(--_icon-button-raised-hover-shadow);\n}\n\n.forge-icon-button--raised:active {\n --_icon-button-raised-shadow: var(--_icon-button-raised-active-shadow);\n}\n\n.forge-icon-button--squared {\n --_icon-button-shape: var(--_icon-button-shape-squared);\n}\n\n.forge-icon-button--small {\n --_icon-button-size: var(--_icon-button-density-small-size);\n --_icon-button-icon-size: var(--_icon-button-density-small-icon-size);\n --_icon-button-padding: var(--_icon-button-density-small-padding);\n}\n\n.forge-icon-button--small > * {\n font-size: var(--_icon-button-density-small-icon-size);\n}\n\n.forge-icon-button--medium {\n --_icon-button-size: var(--_icon-button-density-medium-size);\n --_icon-button-padding: var(--_icon-button-density-medium-padding);\n}\n\n.forge-icon-button:disabled {\n pointer-events: none;\n opacity: var(--_icon-button-disabled-opacity);\n pointer-events: auto;\n cursor: not-allowed;\n}\n\n.forge-icon-button forge-circular-progress {\n --forge-circular-progress-indicator-color: var(--_icon-button-icon-color);\n --forge-circular-progress-track-color: transparent;\n --forge-circular-progress-size: 1em;\n}\n\n:host {\n display: block;\n box-sizing: border-box;\n}\n\n:host(:state(empty)) {\n display: none;\n}\n\n.assistant-response {\n position: relative;\n margin-inline-end: var(--forge-spacing-xxlarge, 48px);\n}\n\n.text-chunk {\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n font-family: var(--forge-typography-body1-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n font-size: var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 0.875)));\n font-weight: var(--forge-typography-body1-font-weight, 400);\n line-height: var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));\n letter-spacing: var(--forge-typography-body1-letter-spacing, 0.0357142857em);\n text-transform: var(--forge-typography-body1-text-transform, inherit);\n text-decoration: var(--forge-typography-body1-text-decoration, inherit);\n color: var(--forge-theme-on-surface, #000000);\n overflow-wrap: break-word;\n}\n.text-chunk h1,\n.text-chunk h2,\n.text-chunk h3,\n.text-chunk h4,\n.text-chunk h5,\n.text-chunk h6 {\n margin: 1.75rem 0 var(--forge-spacing-small, 12px);\n}\n.text-chunk strong {\n font-weight: 500;\n}\n.text-chunk a {\n color: var(--forge-theme-primary, #3f51b5);\n}\n.text-chunk hr {\n border: none;\n border-top: 1px solid var(--forge-theme-outline, #e0e0e0);\n}\n.text-chunk code {\n color: var(--forge-theme-on-surface-container-low, #000000);\n background-color: var(--forge-theme-surface-container-low, #ebebeb);\n border-radius: calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1));\n padding: var(--forge-spacing-xxxsmall, 2px) var(--forge-spacing-xxsmall, 4px);\n font-size: 0.75rem;\n}\n.text-chunk pre {\n border: 1px solid var(--forge-theme-outline, #e0e0e0);\n border-radius: calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1));\n margin-block: var(--forge-spacing-medium, 16px) 0;\n}\n.text-chunk pre code {\n display: block;\n padding: var(--forge-spacing-xsmall, 8px) var(--forge-spacing-small, 12px);\n color: var(--forge-theme-on-surface-container-minimum, #000000);\n background: var(--forge-theme-surface-container-minimum, #f5f5f5);\n overflow-x: auto;\n}\n.text-chunk > p:has(+ ol),\n.text-chunk > p:has(+ ul) {\n margin-block-end: var(--forge-spacing-small, 12px);\n}\n.text-chunk > ul {\n list-style-type: disc;\n padding-inline-start: 1.6875rem;\n}\n.text-chunk > ol {\n padding-inline-start: 1.75rem;\n}\n.text-chunk > ol,\n.text-chunk > ul {\n margin: var(--forge-spacing-xsmall, 8px) 0;\n margin-block-end: var(--forge-spacing-medium, 16px);\n}\n.text-chunk > :first-child {\n margin-block-start: 0;\n}\n.text-chunk > p {\n margin-block-end: var(--forge-spacing-medium, 16px);\n overflow-wrap: anywhere;\n line-height: 1.5;\n}\n\n.toolbar-container {\n position: absolute;\n bottom: -32px;\n left: 0;\n transition: opacity 200ms ease-in-out, transform 200ms ease-in-out;\n display: flex;\n gap: var(--forge-spacing-xxsmall, 4px);\n opacity: 0;\n transform: translateY(-8px);\n pointer-events: none;\n z-index: 1;\n}\n\n.assistant-response[data-complete]:hover .toolbar-container,\n.assistant-response[data-complete] .toolbar-container:focus-within {\n opacity: 1;\n transform: translateY(0);\n pointer-events: auto;\n}\n\n:host(:not(:last-of-type)) .assistant-response[data-complete]::after {\n content: "";\n position: absolute;\n bottom: -40px;\n left: 0;\n right: 0;\n height: 40px;\n}\n\n:host(:last-of-type) .assistant-response[data-complete] .toolbar-container {\n opacity: 1;\n transform: translateY(0);\n pointer-events: auto;\n}\n\n.debug-button {\n color: var(--forge-theme-on-error-container-low, #5f0011);\n --forge-icon-button-focus-indicator-color: var(--forge-theme-error, #b00020);\n --forge-icon-button-tonal-background-color: var(--forge-theme-error-container-low, #f6e0e4);\n}';
2
+ export {
3
+ styles as default
4
+ };
@@ -0,0 +1 @@
1
+ export * from './ai-assistant-response';
@@ -0,0 +1,5 @@
1
+ import { AiAssistantResponseComponent, AiAssistantResponseComponentTagName } from "./ai-assistant-response.mjs";
2
+ export {
3
+ AiAssistantResponseComponent,
4
+ AiAssistantResponseComponentTagName
5
+ };
@@ -42,7 +42,10 @@ let AiChatInterfaceComponent = class extends LitElement {
42
42
  return html`
43
43
  <div class="ai-chat-interface">
44
44
  ${__privateGet(this, _headerSlot)} ${__privateGet(this, _AiChatInterfaceComponent_instances, messagesContainer_get)} ${__privateGet(this, _AiChatInterfaceComponent_instances, suggestions_get)} ${__privateGet(this, _AiChatInterfaceComponent_instances, attachments_get)}
45
- <div class="prompt-container">${__privateGet(this, _AiChatInterfaceComponent_instances, prompt_get)}</div>
45
+ <div class="prompt-container">
46
+ ${__privateGet(this, _AiChatInterfaceComponent_instances, prompt_get)}
47
+ <slot name="disclaimer"></slot>
48
+ </div>
46
49
  </div>
47
50
  `;
48
51
  }
@@ -90,7 +90,16 @@ class AgUiAdapter extends AgentAdapter {
90
90
  onToolCallResultEvent: this.#handleToolCallResult.bind(this),
91
91
  onRunFinishedEvent: this.#handleRunFinished.bind(this),
92
92
  onRunErrorEvent: this.#handleRunError.bind(this),
93
- onRunFailed: this.#handleRunFailed.bind(this)
93
+ onRunFailed: this.#handleRunFailed.bind(this),
94
+ onCustomEvent: this.#handleCustomEvent.bind(this),
95
+ onRawEvent: this.#handleRawEvent.bind(this),
96
+ onRunStartedEvent: this.#handleRunStartedEvent.bind(this),
97
+ onStepStartedEvent: this.#handleStepStartedEvent.bind(this),
98
+ onStepFinishedEvent: this.#handleStepFinishedEvent.bind(this),
99
+ onStateSnapshotEvent: this.#handleStateSnapshotEvent.bind(this),
100
+ onStateDeltaEvent: this.#handleStateDeltaEvent.bind(this),
101
+ onActivitySnapshotEvent: this.#handleActivitySnapshotEvent.bind(this),
102
+ onActivityDeltaEvent: this.#handleActivityDeltaEvent.bind(this)
94
103
  };
95
104
  this.#agent.subscribe(subscriber);
96
105
  }
@@ -221,6 +230,40 @@ class AgUiAdapter extends AgentAdapter {
221
230
  this.#clearRunState();
222
231
  this._emitError("An unexpected error occurred. Please try again.");
223
232
  }
233
+ #handleCustomEvent({ event }) {
234
+ this._emitCustomEvent(event.name, event.value, event);
235
+ }
236
+ #handleRawEvent({ event }) {
237
+ this._emitRawEvent(event.event, event);
238
+ }
239
+ #handleRunStartedEvent({ event }) {
240
+ this._emitRunStartedEvent(event.threadId, event.runId, event);
241
+ }
242
+ #handleStepStartedEvent({ event }) {
243
+ this._emitStepStarted(event.stepName, event);
244
+ }
245
+ #handleStepFinishedEvent({ event }) {
246
+ this._emitStepFinished(event.stepName, event);
247
+ }
248
+ #handleStateSnapshotEvent({ event }) {
249
+ this._emitStateSnapshot(event.snapshot, event);
250
+ }
251
+ #handleStateDeltaEvent({ event }) {
252
+ this._emitStateDelta(event.delta, event);
253
+ }
254
+ #handleActivitySnapshotEvent({
255
+ event,
256
+ activityMessage,
257
+ existingMessage
258
+ }) {
259
+ this._emitActivitySnapshot(event.content, activityMessage, existingMessage, event);
260
+ }
261
+ #handleActivityDeltaEvent({
262
+ event,
263
+ activityMessage
264
+ }) {
265
+ this._emitActivityDelta(event.patch, activityMessage, event);
266
+ }
224
267
  #processTextDelta(messageId, buffer, isFinal) {
225
268
  const previousBuffer = this.#textBuffers.get(messageId) ?? "";
226
269
  const delta = buffer.slice(previousBuffer.length);
@@ -63,6 +63,47 @@ export interface FileRemoveEvent {
63
63
  export interface ErrorEvent {
64
64
  message: string;
65
65
  }
66
+ export interface CustomAgentEvent {
67
+ name: string;
68
+ value: unknown;
69
+ rawEvent?: unknown;
70
+ }
71
+ export interface RawAgentEvent {
72
+ event: unknown;
73
+ rawEvent?: unknown;
74
+ }
75
+ export interface RunStartedAgentEvent {
76
+ threadId: string;
77
+ runId: string;
78
+ rawEvent?: unknown;
79
+ }
80
+ export interface StepStartedAgentEvent {
81
+ stepName: string;
82
+ rawEvent?: unknown;
83
+ }
84
+ export interface StepFinishedAgentEvent {
85
+ stepName: string;
86
+ rawEvent?: unknown;
87
+ }
88
+ export interface StateSnapshotAgentEvent {
89
+ state: unknown;
90
+ rawEvent?: unknown;
91
+ }
92
+ export interface StateDeltaAgentEvent {
93
+ delta: unknown[];
94
+ rawEvent?: unknown;
95
+ }
96
+ export interface ActivitySnapshotAgentEvent {
97
+ activity: unknown;
98
+ activityMessage?: unknown;
99
+ existingMessage?: unknown;
100
+ rawEvent?: unknown;
101
+ }
102
+ export interface ActivityDeltaAgentEvent {
103
+ delta: unknown;
104
+ activityMessage?: unknown;
105
+ rawEvent?: unknown;
106
+ }
66
107
  export declare abstract class AgentAdapter {
67
108
  protected _state: AdapterState;
68
109
  protected _tools: ToolDefinition[];
@@ -82,6 +123,15 @@ export declare abstract class AgentAdapter {
82
123
  fileRemove: EventEmitter<FileRemoveEvent>;
83
124
  error: EventEmitter<ErrorEvent>;
84
125
  stateChange: EventEmitter<AdapterState>;
126
+ customEvent: EventEmitter<CustomAgentEvent>;
127
+ rawEvent: EventEmitter<RawAgentEvent>;
128
+ runStartedEvent: EventEmitter<RunStartedAgentEvent>;
129
+ stepStarted: EventEmitter<StepStartedAgentEvent>;
130
+ stepFinished: EventEmitter<StepFinishedAgentEvent>;
131
+ stateSnapshot: EventEmitter<StateSnapshotAgentEvent>;
132
+ stateDelta: EventEmitter<StateDeltaAgentEvent>;
133
+ activitySnapshot: EventEmitter<ActivitySnapshotAgentEvent>;
134
+ activityDelta: EventEmitter<ActivityDeltaAgentEvent>;
85
135
  };
86
136
  abstract connect(): Promise<void>;
87
137
  abstract disconnect(): Promise<void>;
@@ -112,6 +162,15 @@ export declare abstract class AgentAdapter {
112
162
  onFileRemove(callback: (event: FileRemoveEvent) => void): Subscription;
113
163
  onError(callback: (event: ErrorEvent) => void): Subscription;
114
164
  onStateChange(callback: (state: AdapterState) => void): Subscription;
165
+ onCustomEvent(callback: (event: CustomAgentEvent) => void): Subscription;
166
+ onRawEvent(callback: (event: RawAgentEvent) => void): Subscription;
167
+ onRunStartedEvent(callback: (event: RunStartedAgentEvent) => void): Subscription;
168
+ onStepStarted(callback: (event: StepStartedAgentEvent) => void): Subscription;
169
+ onStepFinished(callback: (event: StepFinishedAgentEvent) => void): Subscription;
170
+ onStateSnapshot(callback: (event: StateSnapshotAgentEvent) => void): Subscription;
171
+ onStateDelta(callback: (event: StateDeltaAgentEvent) => void): Subscription;
172
+ onActivitySnapshot(callback: (event: ActivitySnapshotAgentEvent) => void): Subscription;
173
+ onActivityDelta(callback: (event: ActivityDeltaAgentEvent) => void): Subscription;
115
174
  protected _emitRunStarted(): void;
116
175
  protected _emitRunFinished(): void;
117
176
  protected _emitRunAborted(): void;
@@ -129,5 +188,14 @@ export declare abstract class AgentAdapter {
129
188
  onError: (error: string) => void;
130
189
  }): void;
131
190
  protected _emitError(message: string): void;
191
+ protected _emitCustomEvent(name: string, value: unknown, rawEvent?: unknown): void;
192
+ protected _emitRawEvent(event: unknown, rawEvent?: unknown): void;
193
+ protected _emitRunStartedEvent(threadId: string, runId: string, rawEvent?: unknown): void;
194
+ protected _emitStepStarted(stepName: string, rawEvent?: unknown): void;
195
+ protected _emitStepFinished(stepName: string, rawEvent?: unknown): void;
196
+ protected _emitStateSnapshot(state: unknown, rawEvent?: unknown): void;
197
+ protected _emitStateDelta(delta: unknown[], rawEvent?: unknown): void;
198
+ protected _emitActivitySnapshot(activity: unknown, activityMessage?: unknown, existingMessage?: unknown, rawEvent?: unknown): void;
199
+ protected _emitActivityDelta(delta: unknown, activityMessage?: unknown, rawEvent?: unknown): void;
132
200
  protected _updateState(updates: Partial<AdapterState>): void;
133
201
  }
@@ -18,7 +18,16 @@ class AgentAdapter {
18
18
  fileUpload: new EventEmitter(),
19
19
  fileRemove: new EventEmitter(),
20
20
  error: new EventEmitter(),
21
- stateChange: new EventEmitter()
21
+ stateChange: new EventEmitter(),
22
+ customEvent: new EventEmitter(),
23
+ rawEvent: new EventEmitter(),
24
+ runStartedEvent: new EventEmitter(),
25
+ stepStarted: new EventEmitter(),
26
+ stepFinished: new EventEmitter(),
27
+ stateSnapshot: new EventEmitter(),
28
+ stateDelta: new EventEmitter(),
29
+ activitySnapshot: new EventEmitter(),
30
+ activityDelta: new EventEmitter()
22
31
  };
23
32
  }
24
33
  setTools(tools) {
@@ -84,6 +93,33 @@ class AgentAdapter {
84
93
  onStateChange(callback) {
85
94
  return this._events.stateChange.subscribe(callback);
86
95
  }
96
+ onCustomEvent(callback) {
97
+ return this._events.customEvent.subscribe(callback);
98
+ }
99
+ onRawEvent(callback) {
100
+ return this._events.rawEvent.subscribe(callback);
101
+ }
102
+ onRunStartedEvent(callback) {
103
+ return this._events.runStartedEvent.subscribe(callback);
104
+ }
105
+ onStepStarted(callback) {
106
+ return this._events.stepStarted.subscribe(callback);
107
+ }
108
+ onStepFinished(callback) {
109
+ return this._events.stepFinished.subscribe(callback);
110
+ }
111
+ onStateSnapshot(callback) {
112
+ return this._events.stateSnapshot.subscribe(callback);
113
+ }
114
+ onStateDelta(callback) {
115
+ return this._events.stateDelta.subscribe(callback);
116
+ }
117
+ onActivitySnapshot(callback) {
118
+ return this._events.activitySnapshot.subscribe(callback);
119
+ }
120
+ onActivityDelta(callback) {
121
+ return this._events.activityDelta.subscribe(callback);
122
+ }
87
123
  _emitRunStarted() {
88
124
  this._events.runStarted.emit();
89
125
  }
@@ -126,6 +162,33 @@ class AgentAdapter {
126
162
  _emitError(message) {
127
163
  this._events.error.emit({ message });
128
164
  }
165
+ _emitCustomEvent(name, value, rawEvent) {
166
+ this._events.customEvent.emit({ name, value, rawEvent });
167
+ }
168
+ _emitRawEvent(event, rawEvent) {
169
+ this._events.rawEvent.emit({ event, rawEvent });
170
+ }
171
+ _emitRunStartedEvent(threadId, runId, rawEvent) {
172
+ this._events.runStartedEvent.emit({ threadId, runId, rawEvent });
173
+ }
174
+ _emitStepStarted(stepName, rawEvent) {
175
+ this._events.stepStarted.emit({ stepName, rawEvent });
176
+ }
177
+ _emitStepFinished(stepName, rawEvent) {
178
+ this._events.stepFinished.emit({ stepName, rawEvent });
179
+ }
180
+ _emitStateSnapshot(state, rawEvent) {
181
+ this._events.stateSnapshot.emit({ state, rawEvent });
182
+ }
183
+ _emitStateDelta(delta, rawEvent) {
184
+ this._events.stateDelta.emit({ delta, rawEvent });
185
+ }
186
+ _emitActivitySnapshot(activity, activityMessage, existingMessage, rawEvent) {
187
+ this._events.activitySnapshot.emit({ activity, activityMessage, existingMessage, rawEvent });
188
+ }
189
+ _emitActivityDelta(delta, activityMessage, rawEvent) {
190
+ this._events.activityDelta.emit({ delta, activityMessage, rawEvent });
191
+ }
129
192
  _updateState(updates) {
130
193
  this._state = { ...this._state, ...updates };
131
194
  this._events.stateChange.emit(this.getState());
@@ -79,17 +79,19 @@ let AiChatbotToolCallComponent = class extends LitElement {
79
79
  <div class="tool-call">
80
80
  <span class="status-icon">${__privateGet(this, _AiChatbotToolCallComponent_instances, statusIcon_get)}</span>
81
81
  <span class="tool-name">${this.toolDefinition?.displayName ?? this.toolCall.name}</span>
82
- ${isComplete ? html`
83
- <button
84
- class="forge-icon-button forge-icon-button--small info-button"
85
- type="button"
86
- aria-label="${this._popoverOpen ? "Hide" : "Show"} tool details"
87
- aria-expanded="${this._popoverOpen}"
88
- @click=${__privateMethod(this, _AiChatbotToolCallComponent_instances, handleButtonClick_fn)}>
89
- ${__privateGet(this, _infoIcon)}
90
- </button>
91
- ${__privateGet(this, _AiChatbotToolCallComponent_instances, debugButton_get)}
92
- ` : nothing}
82
+ <div class="tool-actions">
83
+ ${isComplete ? html`
84
+ <button
85
+ class="forge-icon-button forge-icon-button--small info-button"
86
+ type="button"
87
+ aria-label="${this._popoverOpen ? "Hide" : "Show"} tool details"
88
+ aria-expanded="${this._popoverOpen}"
89
+ @click=${__privateMethod(this, _AiChatbotToolCallComponent_instances, handleButtonClick_fn)}>
90
+ ${__privateGet(this, _infoIcon)}
91
+ </button>
92
+ ${__privateGet(this, _AiChatbotToolCallComponent_instances, debugButton_get)}
93
+ ` : nothing}
94
+ </div>
93
95
  </div>
94
96
  ${isComplete ? html`
95
97
  <forge-ai-popover
@@ -175,7 +177,6 @@ debugButton_get = function() {
175
177
  @click=${__privateMethod(this, _AiChatbotToolCallComponent_instances, handleDebugClick_fn)}>
176
178
  ${__privateGet(this, _debugIcon)}
177
179
  </button>
178
- ${this._debugPopoverOpen ? html`<forge-ai-tooltip for="debug-btn" placement="bottom">Event Stream</forge-ai-tooltip>` : nothing}
179
180
  `;
180
181
  };
181
182
  debugPopover_get = function() {
@@ -189,6 +190,7 @@ debugPopover_get = function() {
189
190
  .open=${this._debugPopoverOpen}
190
191
  id="debug-popover"
191
192
  placement="right"
193
+ flip
192
194
  @forge-ai-popover-toggle=${__privateMethod(this, _AiChatbotToolCallComponent_instances, handleDebugPopoverToggle_fn)}>
193
195
  <forge-ai-event-stream-viewer
194
196
  .events=${this.toolCall.eventStream}></forge-ai-event-stream-viewer>