@digipair/skill-web-chatbot 0.91.0-0 → 0.91.0

package/src/lib/digipair.element.ts

@@ -1,446 +0,0 @@
-import { fetchEventSource } from '@microsoft/fetch-event-source';
-import '@ui5/webcomponents-icons/dist/AllIcons';
-import '@ui5/webcomponents/dist/BusyIndicator';
-import '@ui5/webcomponents/dist/Icon';
-import { html, LitElement, TemplateResult } from 'lit';
-import { customElement, property, query, state } from 'lit/decorators.js';
-import { executePinsList } from '@digipair/engine';
-import './chat.element';
-import { ChatElement } from './chat.element';
-import { styles } from './digipair.data';
-import getCssSelector from './tools/css-selector';
-import { _config } from './config';
-import { Message } from './message.interface';
-
-@customElement('digipair-chatbot')
-export class ChatbotElement extends LitElement {
-  @property()
-  code = 'common';
-
-  @property()
-  firstOpenDelay = 60000;
-
-  @property()
-  apiUrl = _config.API_URL;
-
-  @property()
-  userId: string | null = null;
-
-  @state()
-  private boosters: any[] = [];
-
-  @state()
-  private loading = false;
-
-  @state()
-  private resultState = 'open';
-
-  @state()
-  private currentBoost: any = null;
-
-  @state()
-  private messages: Message[] = [];
-
-  @state()
-  private loadingStep = '';
-
-  @query('digipair-chatbot-chat')
-  private chatbot!: ChatElement;
-  private alreadyOpened = false;
-  private isDigipairLoading = false;
-  private newUser!: boolean;
-  private metadata!: {
-    id: string;
-    config: { VERSIONS: { [key: string]: string } };
-    variables: { [key: string]: any };
-    avatar: string;
-    primary: string;
-    secondary: string;
-    textPrimary: string;
-    textSecondary: string;
-  };
-
-  private CHAT_COMMAND(digipair: string, reasoning: string) {
-    return {
-      library: '@digipair/actions-chatbot',
-      element: 'executeRemoteReasoning',
-      properties: {
-        digipair,
-        reasoning: reasoning ?? 'conversation',
-        apiUrl: this.apiUrl,
-      },
-    };
-  }
-
-  private blurEvent = (event: Event) => {
-    const path = event.composedPath();
-    if (!path.includes(this)) {
-      // L'événement a été déclenché en dehors du composant
-      this.closeResult();
-    }
-  };
-
-  override connectedCallback(): void {
-    super.connectedCallback();
-
-    this.loadUser();
-    this.boostListener();
-    this.externalBoostListener();
-    this.initializeSSE();
-    document.addEventListener('click', this.blurEvent);
-  }
-
-  override disconnectedCallback(): void {
-    document.removeEventListener('click', this.blurEvent);
-  }
-
-  private externalBoostListener() {
-    this.addEventListener('executeBoost', ({ detail }: any) => {
-      setTimeout(() => this.executeBoost({ context: {}, ...detail }), 1);
-    });
-  }
-
-  private initializeSSE() {
-    const digipair = this.code;
-    const reasoning = 'notification';
-
-    fetchEventSource(`${this.apiUrl}/${digipair}/${reasoning}`, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      onmessage: (message: any) => {
-        if (message.event !== 'message') {
-          return;
-        }
-
-        const data = JSON.parse(message.data);
-
-        if (data.type === 'step') {
-          this.loadingStep = data.content;
-        }
-
-        if (data.type === 'message') {
-          this.pushMessage(data.content);
-        }
-      },
-      body: JSON.stringify({
-        userId: this.userId,
-      }),
-      onerror(err) {
-        console.error('[Digipair] SSE Error:', err);
-      },
-    });
-  }
-
-  private loadUser(): void {
-    this.newUser = false;
-
-    if (this.userId) {
-      return;
-    }
-
-    this.userId = localStorage.getItem('digipair-user');
-    if (!this.userId) {
-      // set uuid
-      this.userId = Math.random().toString(36).substring(2, 15);
-      localStorage.setItem('digipair-user', this.userId);
-
-      this.newUser = true;
-    }
-  }
-
-  private async boostListener() {
-    const boosts = (await this.executeScene('boosts'))
-      .map((boost: any) => ({
-        ...boost,
-        checkUrl: new RegExp(boost.url),
-      }))
-      .filter((boost: any) => boost.selector);
-    let lastSelectedBoosts: any[] | null = [];
-
-    document.addEventListener(
-      'mouseover',
-      (event: any) => {
-        lastSelectedBoosts = event.target.closest('digipair-chatbot')
-          ? null
-          : this.getBoostsFromTarget(event.target, boosts);
-
-        setTimeout(async () => {
-          // si on est sur le chatbot, on ne fait rien
-          if (!lastSelectedBoosts) {
-            return;
-          }
-
-          const selectedBoosts = this.getBoostsFromTarget(event.target, boosts);
-
-          // garder les boosts communs entre les deux listes
-          this.boosters = selectedBoosts
-            .filter(boost => lastSelectedBoosts?.includes(boost))
-            .map(boost => ({
-              ...boost,
-              context: {
-                ...(boost.context || {}),
-                element: getCssSelector(event.target.closest(boost.selector)),
-              },
-            }));
-        }, 1000);
-      },
-      true,
-    );
-  }
-
-  private getBoostsFromTarget(target: any, boosts: any[]): any[] {
-    return boosts.filter(
-      boost => boost.checkUrl.test(window.location.href) && !!target.closest(boost.selector),
-    );
-  }
-
-  private async loadDigipair(): Promise<void> {
-    this.isDigipairLoading = true;
-
-    const digipair = this.code;
-    const reasoning = 'metadata';
-    const metadata = await this.executeScene(reasoning);
-
-    this.metadata = { ...metadata, id: digipair, config: { VERSIONS: metadata.config.VERSIONS } };
-    await this.loadHistory();
-
-    setTimeout(() => {
-      this.scrollDown();
-      setTimeout(() => {
-        this.closeResult();
-      }, 1);
-    }, 1);
-
-    this.isDigipairLoading = false;
-
-    if (this.newUser) {
-      this.manageNewUser();
-    }
-  }
-
-  private manageNewUser(): void {
-    if (!this.firstOpenDelay) {
-      return;
-    }
-
-    setTimeout(() => {
-      if (this.alreadyOpened) {
-        return;
-      }
-
-      this.openResult();
-    }, this.firstOpenDelay);
-  }
-
-  private async loadHistory(): Promise<void> {
-    const userId = this.userId;
-    const reasoning = 'history';
-    const messages = (
-      await this.executeScene(reasoning, {
-        userId,
-      })
-    ).map((message: any) => ({
-      ...message,
-      boost: message.boost
-        ? {
-            ...message.boost,
-            checkUrl: message.boost.url ? new RegExp(message.boost.url) : null,
-          }
-        : null,
-    }));
-
-    if (messages.length > 0) {
-      this.messages = messages;
-    }
-  }
-
-  private scrollDown(): void {
-    const container = (this.shadowRoot as unknown as HTMLElement).querySelector(
-      '.container',
-    ) as HTMLElement;
-    container.scrollTop = container.scrollHeight;
-  }
-
-  async execute(boost: any, message?: string): Promise<void> {
-    this.loadingStep = '';
-    this.loading = true;
-
-    if (message || boost?.command?.properties?.input?.prompt) {
-      this.messages.push({
-        role: 'user',
-        content: message || boost.command.properties.input.prompt,
-      });
-    }
-    this.chatbot.requestUpdate();
-
-    const command = boost?.command ? boost.command : this.CHAT_COMMAND(this.code, boost?.reasoning);
-    try {
-      const pins = JSON.parse(JSON.stringify(command));
-      pins.properties = pins.properties || {};
-      pins.properties.input = {
-        ...(pins.properties.input || {}),
-        prompt: message || pins.properties.input?.prompt,
-        inputs: this.chatbot.inputs,
-        userId: this.userId,
-        step: boost?.step,
-        parent_history: boost?.parent_history,
-        parent_conversation: boost?.parent_conversation,
-        context: boost?.context || {},
-      };
-
-      const detail = await executePinsList(
-        [pins],
-        {
-          config: {
-            VERSIONS: this.metadata.config.VERSIONS,
-          },
-        },
-        'boost',
-      );
-      this.currentBoost = detail.boost
-        ? {
-            parent_history: detail.uuid,
-            parent_conversation: detail.parent_conversation || detail.uuid,
-            ...detail.boost,
-          }
-        : null;
-      this.pushMessage({
-        role: 'assistant',
-        content: detail.assistant,
-        uuid: detail.uuid,
-        boost: detail.boost,
-        boosts: detail.boosts,
-        sources: detail.sources,
-        parent_conversation: detail.parent_conversation,
-        parent_history: detail.parent_history,
-      });
-
-      if (detail.command && detail.command.length > 0) {
-        await executePinsList(
-          detail.command,
-          { config: { VERSIONS: this.metadata.config.VERSIONS } },
-          'boost.command',
-        );
-      }
-    } catch (error) {
-      this.pushMessage({
-        role: 'assistant',
-        content: 'Oops...',
-      });
-    }
-
-    this.loadingStep = '';
-    this.loading = false;
-  }
-
-  private executeBoost(boost: any): void {
-    this.execute(boost);
-    this.openResult();
-
-    setTimeout(() => {
-      (this.chatbot?.shadowRoot?.querySelector('#messageInput') as any).focus();
-    }, 1);
-  }
-
-  private pushMessage(message: Message): void {
-    this.openResult();
-    this.messages.push(message);
-    this.chatbot.requestUpdate();
-  }
-
-  private openResult(): void {
-    this.resultState = 'open';
-    setTimeout(() => {
-      (this.chatbot?.shadowRoot?.querySelector('#messageInput') as any).focus();
-      this.chatbot.requestUpdate();
-    }, 1);
-
-    this.alreadyOpened = true;
-  }
-
-  private closeResult(): void {
-    this.resultState = 'closed';
-  }
-
-  private setBoost(boost: any): void {
-    this.currentBoost = boost;
-    this.boosters = [];
-  }
-
-  private executeScene = async (reasoning: string, input: any = {}): Promise<any> => {
-    const digipair = this.code;
-    const response = await fetch(`${this.apiUrl}/${digipair}/${reasoning}`, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(input),
-    });
-
-    return await response.json();
-  };
-
-  static override styles = styles;
-  override render(): TemplateResult {
-    if (this.metadata?.id !== this.code) {
-      if (!this.isDigipairLoading) {
-        this.loadDigipair();
-      }
-      return html``;
-    }
-
-    return html`
-      <style>
-        @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
-        font-family: 'Poppins', sans-serif;
-        font-weight: 300;
-        font-style: normal;
-
-        --digipair-color-primary: ${this.metadata.primary};
-        --digipair-color-text-primary: ${this.metadata.textPrimary};
-        --digipair-color-secondary: ${this.metadata.secondary};
-        --digipair-color-text-secondary: ${this.metadata.textSecondary};
-      </style>
-
-      <section class="container result-${this.resultState}">
-        <section class="result" style="border: 1px solid var(--digipair-color-primary, #52DFDB)">
-          <digipair-chatbot-chat
-            ?loading=${this.loading}
-            .messages=${this.messages}
-            .currentBoost=${this.currentBoost}
-            .context=${{ config: this.metadata.config, variables: this.metadata.variables }}
-            loadingStep=${this.loadingStep}
-            @prompt=${(event: any) => this.execute(this.currentBoost, event.detail.prompt)}
-            @executeboost=${(event: any) => this.executeBoost(event.detail)}
-            @boost=${(event: any) => this.setBoost(event.detail)}
-          ></digipair-chatbot-chat>
-        </section>
-
-        <section class="actions ${this.loading ? 'loading' : ''}">
-          ${this.boosters.map(
-            boost => html`
-              <span
-                class="action"
-                style="border: 1px solid var(--digipair-color-primary, #52DFDB)"
-                @click=${() => this.executeBoost(boost)}
-                >${boost.summary}</span
-              >
-            `,
-          )}
-        </section>
-
-        <section
-          class="panel"
-          style="border: 1px solid var(--digipair-color-primary, #52DFDB)"
-        ></section>
-        <img
-          @click=${() => (this.resultState !== 'closed' ? this.closeResult() : this.openResult())}
-          class="logo ${this.loading ? 'loading' : ''}"
-          src=${this.metadata.avatar}
-        />
-      </section>
-    `;
-  }
-}

package/src/lib/inputs.element.ts

@@ -1,46 +0,0 @@
-import { LitElement, html, noChange, nothing } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import { until } from 'lit/directives/until.js';
-import { generateElementFromPins } from '@digipair/engine';
-
-@customElement('digipair-chatbot-inputs')
-export class InputsElement extends LitElement {
-  @property({ type: Array })
-  inputs: any[] = [];
-
-  @property({ type: Object })
-  context: any = {};
-
-  private cache = '';
-
-  get values(): { [key: string]: any }[] {
-    return Array.from((this.shadowRoot as unknown as HTMLElement).children).map((el: any) => ({
-      value: el.value,
-      content: el.content,
-      required: el.required,
-    }));
-  }
-
-  override render() {
-    const cache = JSON.stringify(this.inputs);
-
-    if (this.cache === cache) {
-      return noChange;
-    }
-    this.cache = cache;
-
-    return html`
-      ${(this.inputs || []).map(
-        (pins: PinsSettings) =>
-          html`${until(
-            generateElementFromPins(pins, null, this.context).then((el: Element) => {
-              setTimeout(() => this.dispatchEvent(new CustomEvent('change')), 1);
-              el.addEventListener('change', () => this.dispatchEvent(new CustomEvent('change')));
-              return el;
-            }),
-            nothing,
-          )}`,
-      )}
-    `;
-  }
-}

package/src/lib/mermaid.d.ts

@@ -1 +0,0 @@
-declare module 'mermaid/dist/mermaid.esm.min.mjs';

package/src/lib/message.interface.ts

@@ -1,10 +0,0 @@
-export interface Message {
-  role: 'assistant' | 'user';
-  content: string;
-  uuid?: string;
-  boost?: any;
-  boosts?: any[];
-  sources?: any[];
-  parent_conversation?: string;
-  parent_history?: string;
-}

package/src/lib/pins/chatbot.actions.ts

@@ -1,32 +0,0 @@
-class DomService {
-  async executeRemoteReasoning(
-    { digipair, reasoning, input, apiUrl }: any,
-    _pinsSettingsList: PinsSettings[],
-    context: any,
-  ): Promise<any> {
-    const response = await fetch(`${apiUrl}/${digipair}/${reasoning}`, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify({
-        ...context.input,
-        ...input,
-      }),
-    });
-
-    const result = await response.json();
-
-    if (response.status >= 400) {
-      throw new Error(result.message);
-    }
-
-    return result;
-  }
-}
-
-export const executeRemoteReasoning = (
-  params: any,
-  pinsSettingsList: PinsSettings[],
-  context: any,
-) => new DomService().executeRemoteReasoning(params, pinsSettingsList, context);

package/src/lib/tools/css-selector.ts

@@ -1,12 +0,0 @@
-import getCssSelectorOrigin from 'css-selector-generator';
-
-function unescapeCSS(cssEscapedString: string) {
-  return cssEscapedString.replace(/\\([0-9A-Fa-f]{1,6})\s?/g, (_match: any, charCode: any) =>
-    String.fromCharCode(parseInt(charCode, 16))
-  ).replace(/\\/g, '');
-}
-
-export default function getCssSelector(element: any, options: any = {}) {
-  const selector = getCssSelectorOrigin(element, options);
-  return unescapeCSS(selector);
-}

package/tsconfig.json

@@ -1,13 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "../engine"
-    },
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ]
-}

package/tsconfig.lib.json

@@ -1,19 +0,0 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "rootDir": "src",
-    "outDir": "dist",
-    "tsBuildInfoFile": "dist/tsconfig.lib.tsbuildinfo",
-    "emitDeclarationOnly": true,
-    "module": "esnext",
-    "moduleResolution": "node",
-    "forceConsistentCasingInFileNames": true,
-    "types": ["node"]
-  },
-  "include": ["src/**/*.ts"],
-  "references": [
-    {
-      "path": "../engine/tsconfig.lib.json"
-    }
-  ]
-}