@botonic/webchat-lit 2.34.0

package/src/lib/debug-event/debug-event.css.js

@@ -0,0 +1,331 @@
+import { css } from 'lit';
+export const debugEventStyles = css `
+  @layer components {
+    :host {
+      display: block;
+      box-sizing: border-box;
+      width: 100%;
+    }
+
+    .debug-root {
+      display: flex;
+      flex-direction: column;
+      align-items: stretch;
+      justify-content: space-between;
+      gap: var(--spacing-s);
+
+      background-color: var(
+        --botonic-debug-event-bg,
+        var(--surface-foreground)
+      );
+      border-radius: var(--radius-s);
+      font-family: var(--font-family);
+      box-sizing: border-box;
+      width: fit-content;
+    }
+
+    .debug-root.is-collapsible {
+      cursor: pointer;
+    }
+
+    .debug-root.is-collapsible:hover {
+      background-color: var(
+        --botonic-debug-event-hover-bg,
+        var(--color-neutral-50)
+      );
+    }
+
+    .debug-header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: var(--spacing-xxs);
+      box-sizing: border-box;
+      user-select: none;
+      border-radius: var(--radius-s);
+      padding: var(--spacing-xs) var(--spacing-xs);
+      width: 100%;
+    }
+
+    .debug-arrow {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      width: 16px;
+      height: 16px;
+      flex-shrink: 0;
+    }
+
+    .debug-arrow svg {
+      width: 100%;
+      height: 100%;
+    }
+
+    .debug-icon {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      width: 14px;
+      height: 14px;
+      margin-right: var(--spacing-xs);
+      flex-shrink: 0;
+    }
+
+    .debug-icon svg {
+      width: 100%;
+      height: 100%;
+    }
+
+    .debug-title {
+      flex: 1;
+      min-width: 0;
+      overflow: hidden;
+      display: flex;
+      align-items: center;
+
+      font-weight: var(--font-weight-bold);
+      font-size: var(--font-size-xs);
+      color: var(--botonic-debug-event-text, var(--text-base));
+      line-height: 1.5;
+      white-space: nowrap;
+      gap: var(--spacing-xxs);
+    }
+
+    .debug-title span {
+      font-weight: var(--font-weight-regular);
+    }
+
+    .debug-content {
+      display: flex;
+      flex-direction: column;
+      position: relative;
+      width: 100%;
+      min-width: 0;
+      overflow: hidden;
+
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+      color: var(--botonic-debug-event-text, var(--text-base));
+    }
+
+    .debug-detail {
+      display: flex;
+      flex-direction: column;
+      gap: var(--spacing-xxs);
+      padding: 0 calc(var(--spacing-ml) + var(--spacing-xxs));
+      line-height: 1.5;
+      width: 100%;
+      min-width: 0;
+      overflow: hidden;
+      box-sizing: border-box;
+    }
+
+    .debug-label {
+      color: var(--botonic-debug-event-text, var(--text-base));
+      font-weight: var(--font-weight-regular);
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+    }
+
+    .debug-value {
+      font-weight: var(--font-weight-bold);
+      font-size: var(--font-size-xs);
+      color: var(--botonic-debug-event-text, var(--text-base));
+      line-height: 1.5;
+      width: 100%;
+      overflow-wrap: break-word;
+      word-break: break-word;
+    }
+
+    .debug-value > svg {
+      width: 14px;
+      height: 14px;
+      min-width: 14px;
+      min-height: 14px;
+      flex-shrink: 0;
+      display: inline-block;
+      vertical-align: middle;
+      margin-right: var(--spacing-xs);
+    }
+
+    .debug-item-with-icon {
+      display: flex;
+      align-items: center;
+      gap: var(--spacing-xs);
+      padding: 0;
+      font-weight: var(--font-weight-bold);
+      font-size: var(--font-size-xs);
+      color: var(--botonic-debug-event-text, var(--text-base));
+      line-height: 1.5;
+      min-width: 0;
+      width: 100%;
+    }
+
+    .debug-item-with-icon:not(:last-child) {
+      margin-bottom: var(--spacing-xxs);
+    }
+
+    .debug-item-with-icon > svg {
+      width: 14px;
+      height: 14px;
+      min-width: 14px;
+      min-height: 14px;
+      flex-shrink: 0;
+      display: block;
+    }
+
+    .debug-metadata {
+      margin-top: var(--spacing-xs);
+      padding-top: var(--spacing-s);
+      border-top: 1px solid
+        var(
+          --botonic-debug-event-border,
+          var(--surface-foreground-border-color)
+        );
+      color: var(--botonic-debug-event-text, var(--text-base));
+      font-size: var(--font-size-xs);
+      padding-left: calc(var(--spacing-ml) + var(--spacing-xxs));
+    }
+
+    .debug-metadata > div {
+      margin-top: 6px;
+      font-weight: var(--font-weight-regular);
+    }
+
+    .debug-content-wrapper {
+      display: flex;
+      flex-direction: column;
+      gap: var(--spacing-sm);
+      position: relative;
+      width: 100%;
+      min-width: 0;
+      overflow: hidden;
+      padding-bottom: var(--spacing-xs);
+    }
+
+    .debug-content-wrapper::before {
+      content: '';
+      position: absolute;
+      left: 13px;
+      width: 1px;
+      background-color: var(
+        --botonic-debug-event-connector,
+        var(--surface-foreground-border-color)
+      );
+      top: 0;
+      height: var(--last-label-bottom, 100%);
+    }
+
+    .debug-root.is-collapsible:hover .debug-content-wrapper::before {
+      background-color: var(
+        --botonic-debug-event-connector-hover,
+        var(--color-neutral-200)
+      );
+    }
+
+    .see-info-button {
+      border: 1px solid
+        var(--botonic-debug-event-button-border, var(--color-neutral-200));
+      border-radius: var(--radius-s);
+      padding: var(--spacing-xs);
+      height: calc(var(--spacing-ml) + var(--spacing-xxs));
+      background-color: transparent;
+      color: var(--botonic-debug-event-button-text, var(--color-neutral-800));
+      font-family: var(--font-family);
+      font-size: var(--font-size-xs);
+      font-weight: var(--font-weight-medium);
+      line-height: 1.5;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: fit-content;
+    }
+
+    .see-info-button:hover {
+      background-color: var(
+        --botonic-debug-event-button-hover-bg,
+        var(--color-neutral-100)
+      );
+    }
+
+    .guardrail-item {
+      display: flex;
+      align-items: center;
+      gap: var(--spacing-xs);
+      padding-left: calc(var(--spacing-ml) + var(--spacing-xxs));
+      margin-bottom: var(--spacing-xs);
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+      color: var(--botonic-debug-event-text, var(--text-base));
+    }
+
+    .guardrail-item.is-last {
+      margin-bottom: 0;
+    }
+
+    .guardrail-item svg {
+      width: 14px;
+      height: 14px;
+      flex-shrink: 0;
+    }
+
+    .guardrail-label {
+      font-weight: var(--font-weight-bold);
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+      color: var(--botonic-debug-event-text, var(--text-base));
+    }
+
+    .guardrail-value {
+      font-weight: var(--font-weight-regular);
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+      color: var(--botonic-debug-event-text, var(--text-base));
+    }
+
+    .source-value {
+      font-weight: var(--font-weight-bold);
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+      color: var(--botonic-debug-event-text, var(--text-base));
+    }
+
+    .file-source-value {
+      font-weight: var(--font-weight-bold);
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+      color: var(--botonic-debug-event-text, var(--text-base));
+      display: block;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      min-width: 0;
+      flex: 1;
+    }
+
+    .url-source-value {
+      font-weight: var(--font-weight-bold);
+      font-size: var(--font-size-xs);
+      line-height: 1.5;
+      color: var(--botonic-debug-event-text, var(--text-base));
+      text-decoration: none;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      min-width: 0;
+      width: 0;
+      flex: 1 1 0%;
+    }
+
+    .url-source-value:hover {
+      text-decoration: underline;
+      color: var(--botonic-debug-event-link-hover, var(--primary-500));
+    }
+
+    .url-source-value:visited {
+      color: var(--botonic-debug-event-text, var(--text-base));
+    }
+  }
+`;
+//# sourceMappingURL=debug-event.css.js.map

package/src/lib/debug-event/debug-event.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"debug-event.css.js","sourceRoot":"","sources":["../../../../../../../libs/botonic/webchat-lit/src/lib/debug-event/debug-event.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwUlC,CAAA"}

package/src/lib/debug-event/debug-event.d.ts

@@ -0,0 +1,23 @@
+import { LitElement } from 'lit';
+import type { DebugEvent, DebugEventAction } from './types';
+export declare class BotonicDebugEvent extends LitElement {
+    action: DebugEventAction;
+    data: DebugEvent;
+    noteContent?: string;
+    private _expanded;
+    private _hasBeenOpened;
+    private _lineEndElements;
+    static styles: import("lit").CSSResult[];
+    connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private _maybeRequestNote;
+    private _updateConnectorLine;
+    private get _config();
+    private get _isCollapsible();
+    private _handleHeaderClick;
+    private _handleSeeChunks;
+    private _handleSeeToolDetails;
+    private _renderCtx;
+    private _renderContent;
+    render(): import("lit").TemplateResult<1>;
+}

package/src/lib/debug-event/debug-event.js

@@ -0,0 +1,157 @@
+import { __decorate, __metadata } from "tslib";
+import { EventAction } from '@botonic/shared';
+import { html, LitElement, nothing } from 'lit';
+import { property, queryAll, state } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { resetStyles } from '../shared/base-styles';
+import { debugEventStyles } from './debug-event.css';
+import { EVENT_CONFIG } from './event-config';
+import { caretDownIcon, caretUpIcon } from './icons';
+export class BotonicDebugEvent extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.data = {};
+        this._expanded = false;
+        this._hasBeenOpened = false;
+        this._handleSeeChunks = () => {
+            const d = this.data;
+            this.dispatchEvent(new CustomEvent('open-chunks', {
+                detail: { chunksWithSources: d.knowledge_base_chunks_with_sources },
+                bubbles: true,
+                composed: true,
+            }));
+        };
+        this._handleSeeToolDetails = (tool) => {
+            var _a;
+            this.dispatchEvent(new CustomEvent('open-tool-results', {
+                detail: {
+                    toolName: tool.tool_name,
+                    toolArguments: (_a = tool.tool_arguments) !== null && _a !== void 0 ? _a : {},
+                    toolResults: tool.tool_results,
+                    knowledgebaseSourcesIds: tool.knowledgebase_sources_ids,
+                    knowledgebaseChunksIds: tool.knowledgebase_chunks_ids,
+                },
+                bubbles: true,
+                composed: true,
+            }));
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setAttribute('role', 'system-message');
+    }
+    updated(changed) {
+        super.updated(changed);
+        this._maybeRequestNote(changed);
+        this._updateConnectorLine();
+    }
+    _maybeRequestNote(changed) {
+        if (!changed.has('data') && !changed.has('noteContent'))
+            return;
+        if (this.action !== EventAction.HandoffSuccess)
+            return;
+        const data = this.data;
+        if (data.handoff_note_id && this.noteContent === undefined) {
+            this.dispatchEvent(new CustomEvent('load-note', {
+                detail: { noteId: data.handoff_note_id },
+                bubbles: true,
+                composed: true,
+            }));
+        }
+    }
+    _updateConnectorLine() {
+        const elements = [...this._lineEndElements];
+        const last = elements[elements.length - 1];
+        if (last) {
+            const bottom = last.offsetTop + last.offsetHeight;
+            const wrapper = this.renderRoot.querySelector('.debug-content-wrapper');
+            if (wrapper instanceof HTMLElement) {
+                wrapper.style.setProperty('--last-label-bottom', `${bottom}px`);
+            }
+        }
+    }
+    get _config() {
+        return EVENT_CONFIG[this.action];
+    }
+    get _isCollapsible() {
+        var _a;
+        return Boolean((_a = this._config) === null || _a === void 0 ? void 0 : _a.renderContent);
+    }
+    _handleHeaderClick() {
+        if (!this._isCollapsible)
+            return;
+        this._expanded = !this._expanded;
+        if (this._expanded && !this._hasBeenOpened) {
+            this._hasBeenOpened = true;
+            this.dispatchEvent(new CustomEvent('event-opened', {
+                detail: { action: this.action },
+                bubbles: true,
+                composed: true,
+            }));
+        }
+    }
+    _renderCtx() {
+        return {
+            noteContent: this.noteContent,
+            onSeeChunks: this._handleSeeChunks,
+            onSeeToolDetails: this._handleSeeToolDetails,
+        };
+    }
+    _renderContent() {
+        var _a, _b, _c;
+        if (!this._expanded)
+            return nothing;
+        return ((_c = (_b = (_a = this._config) === null || _a === void 0 ? void 0 : _a.renderContent) === null || _b === void 0 ? void 0 : _b.call(_a, this.data, this._renderCtx())) !== null && _c !== void 0 ? _c : nothing);
+    }
+    render() {
+        const config = this._config;
+        const collapsible = this._isCollapsible;
+        return html `
+      <div
+        class=${classMap({ 'debug-root': true, 'is-collapsible': collapsible })}
+      >
+        <div class="debug-header" @click=${this._handleHeaderClick}>
+          <div class="debug-title">
+            <span class="debug-icon">${config === null || config === void 0 ? void 0 : config.icon()}</span>
+            ${config === null || config === void 0 ? void 0 : config.renderTitle(this.data)}
+          </div>
+          ${collapsible
+            ? html `
+                <span class="debug-arrow">
+                  ${this._expanded ? caretUpIcon() : caretDownIcon()}
+                </span>
+              `
+            : nothing}
+        </div>
+        ${this._expanded
+            ? html `<div class="debug-content">${this._renderContent()}</div>`
+            : nothing}
+      </div>
+    `;
+    }
+}
+BotonicDebugEvent.styles = [resetStyles, debugEventStyles];
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], BotonicDebugEvent.prototype, "action", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], BotonicDebugEvent.prototype, "data", void 0);
+__decorate([
+    property({ attribute: 'note-content' }),
+    __metadata("design:type", String)
+], BotonicDebugEvent.prototype, "noteContent", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], BotonicDebugEvent.prototype, "_expanded", void 0);
+__decorate([
+    queryAll('[data-line-end]'),
+    __metadata("design:type", Object)
+], BotonicDebugEvent.prototype, "_lineEndElements", void 0);
+if (!customElements.get('botonic-debug-event')) {
+    customElements.define('botonic-debug-event', BotonicDebugEvent);
+}
+//# sourceMappingURL=debug-event.js.map

package/src/lib/debug-event/debug-event.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"debug-event.js","sourceRoot":"","sources":["../../../../../../../libs/botonic/webchat-lit/src/lib/debug-event/debug-event.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAC7C,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AAC/C,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAEtD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAEnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAQpD,MAAM,OAAO,iBAAkB,SAAQ,UAAU;IAAjD;;QAE8B,SAAI,GAAe,EAAgB,CAAA;QAG9C,cAAS,GAAG,KAAK,CAAA;QAC1B,mBAAc,GAAG,KAAK,CAAA;QAoEtB,qBAAgB,GAAG,GAAG,EAAE;YAC9B,MAAM,CAAC,GAAG,IAAI,CAAC,IAAwD,CAAA;YACvE,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;gBAC7B,MAAM,EAAE,EAAE,iBAAiB,EAAE,CAAC,CAAC,kCAAkC,EAAE;gBACnE,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CACH,CAAA;QACH,CAAC,CAAA;QAEO,0BAAqB,GAAG,CAAC,IAAkB,EAAE,EAAE;;YACrD,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,mBAAmB,EAAE;gBACnC,MAAM,EAAE;oBACN,QAAQ,EAAE,IAAI,CAAC,SAAS;oBACxB,aAAa,EAAE,MAAA,IAAI,CAAC,cAAc,mCAAI,EAAE;oBACxC,WAAW,EAAE,IAAI,CAAC,YAAY;oBAC9B,uBAAuB,EAAE,IAAI,CAAC,yBAAyB;oBACvD,sBAAsB,EAAE,IAAI,CAAC,wBAAwB;iBACtD;gBACD,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CACH,CAAA;QACH,CAAC,CAAA;IA2CH,CAAC;IAjIU,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAA;QACzB,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAA;IAC7C,CAAC;IAEQ,OAAO,CAAC,OAA6B;QAC5C,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;QACtB,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAA;QAC/B,IAAI,CAAC,oBAAoB,EAAE,CAAA;IAC7B,CAAC;IAEO,iBAAiB,CAAC,OAA6B;QACrD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC;YAAE,OAAM;QAC/D,IAAI,IAAI,CAAC,MAAM,KAAK,WAAW,CAAC,cAAc;YAAE,OAAM;QACtD,MAAM,IAAI,GAAG,IAAI,CAAC,IAAgC,CAAA;QAClD,IAAI,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,WAAW,KAAK,SAAS,EAAE,CAAC;YAC3D,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,WAAW,EAAE;gBAC3B,MAAM,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,eAAe,EAAE;gBACxC,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CACH,CAAA;QACH,CAAC;IACH,CAAC;IAEO,oBAAoB;QAC1B,MAAM,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,gBAAgB,CAAC,CAAA;QAC3C,MAAM,IAAI,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;QAC1C,IAAI,IAAI,EAAE,CAAC;YACT,MAAM,MAAM,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,YAAY,CAAA;YACjD,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,wBAAwB,CAAC,CAAA;YACvE,IAAI,OAAO,YAAY,WAAW,EAAE,CAAC;gBACnC,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,qBAAqB,EAAE,GAAG,MAAM,IAAI,CAAC,CAAA;YACjE,CAAC;QACH,CAAC;IACH,CAAC;IAED,IAAY,OAAO;QACjB,OAAO,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IAClC,CAAC;IAED,IAAY,cAAc;;QACxB,OAAO,OAAO,CAAC,MAAA,IAAI,CAAC,OAAO,0CAAE,aAAa,CAAC,CAAA;IAC7C,CAAC;IAEO,kBAAkB;QACxB,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,OAAM;QAChC,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAA;QAChC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YAC3C,IAAI,CAAC,cAAc,GAAG,IAAI,CAAA;YAC1B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,cAAc,EAAE;gBAC9B,MAAM,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE;gBAC/B,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CACH,CAAA;QACH,CAAC;IACH,CAAC;IA6BO,UAAU;QAChB,OAAO;YACL,WAAW,EAAE,IAAI,CAAC,WAAW;YAC7B,WAAW,EAAE,IAAI,CAAC,gBAAgB;YAClC,gBAAgB,EAAE,IAAI,CAAC,qBAAqB;SAC7C,CAAA;IACH,CAAC;IAEO,cAAc;;QACpB,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAO,OAAO,CAAA;QACnC,OAAO,CACL,MAAA,MAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,aAAa,mDAAG,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,mCAAI,OAAO,CACvE,CAAA;IACH,CAAC;IAEQ,MAAM;QACb,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAA;QAC3B,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,CAAA;QACvC,OAAO,IAAI,CAAA;;gBAEC,QAAQ,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAC;;2CAEpC,IAAI,CAAC,kBAAkB;;uCAE3B,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,EAAE;cACvC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;;YAEhC,WAAW;YACX,CAAC,CAAC,IAAI,CAAA;;oBAEE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,aAAa,EAAE;;eAErD;YACH,CAAC,CAAC,OAAO;;UAEX,IAAI,CAAC,SAAS;YACd,CAAC,CAAC,IAAI,CAAA,8BAA8B,IAAI,CAAC,cAAc,EAAE,QAAQ;YACjE,CAAC,CAAC,OAAO;;KAEd,CAAA;IACH,CAAC;;AAlIe,wBAAM,GAAG,CAAC,WAAW,EAAE,gBAAgB,CAAC,AAAlC,CAAkC;AAV5B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iDAA0B;AACzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+CAAoC;AACtB;IAAxC,QAAQ,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;;sDAAqB;AAE5C;IAAhB,KAAK,EAAE;;oDAA0B;AAI1B;IADP,QAAQ,CAAC,iBAAiB,CAAC;;2DACsB;AAuIpD,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,qBAAqB,CAAC,EAAE,CAAC;IAC/C,cAAc,CAAC,MAAM,CAAC,qBAAqB,EAAE,iBAAiB,CAAC,CAAA;AACjE,CAAC"}

package/src/lib/debug-event/event-config.d.ts

@@ -0,0 +1,9 @@
+import { type TemplateResult } from 'lit';
+import { type RenderCtx } from './content-renderers';
+import type { DebugEvent, DebugEventAction } from './types';
+export interface EventConfig {
+    icon: () => TemplateResult;
+    renderTitle: (data: DebugEvent) => TemplateResult;
+    renderContent?: (data: DebugEvent, ctx: RenderCtx) => TemplateResult;
+}
+export declare const EVENT_CONFIG: Record<DebugEventAction, EventConfig>;

package/src/lib/debug-event/event-config.js

@@ -0,0 +1,74 @@
+import { EventAction } from '@botonic/shared';
+import { html } from 'lit';
+import { renderAiAgentContent, renderAiAgentRouterContent, renderConditionalCustomContent, renderConditionalQueueStatusContent, renderHandoffContent, renderKnowledgeBaseContent, } from './content-renderers';
+import { aiRouterIcon, aiSpecialistIcon, arrowProgressIcon, brainIcon, codeIcon, headSetIcon, lifeRingIcon, quoteRightIcon, splitIcon, wandIcon, windowRestoreIcon, } from './icons';
+// Each entry is authored with a data type narrowed to its action key. The
+// outer `as` cast trades strict variance in the mapped type for readable
+// per-entry authoring — the component always looks up an entry by
+// `this.action`, so the concrete data type at the call site is guaranteed to
+// match by construction.
+export const EVENT_CONFIG = {
+    [EventAction.Keyword]: {
+        icon: quoteRightIcon,
+        renderTitle: (d) => html `Keyword matched <span>- "${d.nlu_keyword_name}"</span>`,
+    },
+    [EventAction.IntentSmart]: {
+        icon: brainIcon,
+        renderTitle: (d) => html `Smart intent triggered <span>- "${d.nlu_intent_smart_title}"</span>`,
+    },
+    [EventAction.Fallback]: {
+        icon: lifeRingIcon,
+        renderTitle: (d) => html `Fallback message triggered <span>- ${d.fallback_out} message</span>`,
+    },
+    [EventAction.BotAction]: {
+        icon: codeIcon,
+        renderTitle: (d) => html `Bot action triggered <span>- ${d.payload}</span>`,
+    },
+    [EventAction.HandoffSuccess]: {
+        icon: headSetIcon,
+        renderTitle: (d) => html `Handoff to agent <span>- ${d.handoff_queue_name}</span>`,
+        renderContent: renderHandoffContent,
+    },
+    [EventAction.RedirectFlow]: {
+        icon: arrowProgressIcon,
+        renderTitle: (d) => html `Redirected to flow <span>- ${d.flow_target_name}</span>`,
+    },
+    [EventAction.WebviewActionTriggered]: {
+        icon: windowRestoreIcon,
+        renderTitle: (d) => html `Webview action triggered <span>- ${d.webview_name}</span>`,
+    },
+    [EventAction.ConditionalChannel]: {
+        icon: splitIcon,
+        renderTitle: (d) => html `Channel checked <span>- ${d.channel}</span>`,
+    },
+    [EventAction.ConditionalCountry]: {
+        icon: splitIcon,
+        renderTitle: (d) => html `Country checked <span>- ${d.country}</span>`,
+    },
+    [EventAction.ConditionalCustom]: {
+        icon: splitIcon,
+        renderTitle: () => html `Custom condition`,
+        renderContent: renderConditionalCustomContent,
+    },
+    [EventAction.ConditionalQueueStatus]: {
+        icon: splitIcon,
+        renderTitle: (d) => html `Queue status checked <span>- ${d.queue_name}</span>`,
+        renderContent: renderConditionalQueueStatusContent,
+    },
+    [EventAction.Knowledgebase]: {
+        icon: wandIcon,
+        renderTitle: () => html `Knowledge Base triggered`,
+        renderContent: renderKnowledgeBaseContent,
+    },
+    [EventAction.AiAgent]: {
+        icon: aiSpecialistIcon,
+        renderTitle: (d) => html `Specialist triggered <span>- ${d.flow_node_content_id}</span>`,
+        renderContent: renderAiAgentContent,
+    },
+    [EventAction.AiAgentRouter]: {
+        icon: aiRouterIcon,
+        renderTitle: (d) => html `Router triggered <span>- ${d.flow_node_content_id}</span>`,
+        renderContent: (data) => renderAiAgentRouterContent(data),
+    },
+};
+//# sourceMappingURL=event-config.js.map

package/src/lib/debug-event/event-config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-config.js","sourceRoot":"","sources":["../../../../../../../libs/botonic/webchat-lit/src/lib/debug-event/event-config.ts"],"names":[],"mappings":"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"}

package/src/lib/debug-event/icons.d.ts

@@ -0,0 +1,19 @@
+export declare const aiSpecialistIcon: () => import("lit").TemplateResult<1>;
+export declare const aiRouterIcon: () => import("lit").TemplateResult<1>;
+export declare const wandIcon: () => import("lit").TemplateResult<1>;
+export declare const headSetIcon: () => import("lit").TemplateResult<1>;
+export declare const handIcon: () => import("lit").TemplateResult<1>;
+export declare const lifeRingIcon: () => import("lit").TemplateResult<1>;
+export declare const quoteRightIcon: () => import("lit").TemplateResult<1>;
+export declare const arrowProgressIcon: () => import("lit").TemplateResult<1>;
+export declare const splitIcon: () => import("lit").TemplateResult<1>;
+export declare const codeIcon: () => import("lit").TemplateResult<1>;
+export declare const windowRestoreIcon: () => import("lit").TemplateResult<1>;
+export declare const brainIcon: () => import("lit").TemplateResult<1>;
+export declare const screwdriverWrenchIcon: () => import("lit").TemplateResult<1>;
+export declare const circleCheckIcon: () => import("lit").TemplateResult<1>;
+export declare const filePdfIcon: () => import("lit").TemplateResult<1>;
+export declare const fileWordIcon: () => import("lit").TemplateResult<1>;
+export declare const linkIcon: () => import("lit").TemplateResult<1>;
+export declare const caretDownIcon: () => import("lit").TemplateResult<1>;
+export declare const caretUpIcon: () => import("lit").TemplateResult<1>;