@dataclouder/ngx-agent-cards 0.0.90 → 0.1.1

package/lib/components/chat-container/chat-container.component.d.ts

@@ -3,9 +3,9 @@ import { MicSettings } from '@dataclouder/ngx-mic';
 import { ChatMessage, ChatUserSettings, IAgentCard, IConversationSettings, IMiniAgentCard } from '../../models/agent.models';
 import * as i0 from "@angular/core";
 export declare class DCChatComponent implements OnInit, OnDestroy {
-    private conversationBuilder;
     private dialogService;
     private conversationService;
+    private evaluationService;
     private userDataExchange;
     chatUserSettings: ChatUserSettings;
     conversationSettings: IConversationSettings;
@@ -15,10 +15,12 @@ export declare class DCChatComponent implements OnInit, OnDestroy {
         [key: string]: string;
     }>;
     readonly sendMessage: import("@angular/core").OutputEmitterRef<string>;
+    readonly goalCompleted: import("@angular/core").OutputEmitterRef<void>;
+    messages: import("@angular/core").WritableSignal<ChatMessage[]>;
     micSettings: MicSettings;
     isInfoVisible: boolean;
     isAdmin: boolean;
-    messages: import("@angular/core").WritableSignal<ChatMessage[]>;
+    constructor();
     ngOnInit(): Promise<void>;
     ngOnDestroy(): void;
     /**
@@ -34,5 +36,5 @@ export declare class DCChatComponent implements OnInit, OnDestroy {
      */
     restartConversation(conversation?: IAgentCard | null): Promise<void>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DCChatComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DCChatComponent, "dc-chat", never, { "chatUserSettings": { "alias": "chatUserSettings"; "required": false; }; "conversationSettings": { "alias": "conversationSettings"; "required": false; }; "agentCard": { "alias": "agentCard"; "required": false; }; "evaluatorAgentCard": { "alias": "evaluatorAgentCard"; "required": false; "isSignal": true; }; "parseDict": { "alias": "parseDict"; "required": false; "isSignal": true; }; }, { "sendMessage": "sendMessage"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DCChatComponent, "dc-chat", never, { "chatUserSettings": { "alias": "chatUserSettings"; "required": false; }; "conversationSettings": { "alias": "conversationSettings"; "required": false; }; "agentCard": { "alias": "agentCard"; "required": false; }; "evaluatorAgentCard": { "alias": "evaluatorAgentCard"; "required": false; "isSignal": true; }; "parseDict": { "alias": "parseDict"; "required": false; "isSignal": true; }; }, { "sendMessage": "sendMessage"; "goalCompleted": "goalCompleted"; }, never, never, true, never>;
 }

package/lib/components/chat-container/chat-footer/chat-footer.component.d.ts

@@ -1,7 +1,6 @@
 import { FormControl } from '@angular/forms';
-import { MicSettings } from '@dataclouder/ngx-mic';
+import { MicSettings, AudioRecording } from '@dataclouder/ngx-mic';
 import { ChatMessage, IMiniAgentCard } from '../../../models/agent.models';
-import { AudioRecording } from '@dataclouder/ngx-core';
 import * as i0 from "@angular/core";
 export declare class ChatFooterComponent {
     private conversationService;
@@ -14,7 +13,14 @@ export declare class ChatFooterComponent {
     readonly textInputChanged: import("@angular/core").OutputEmitterRef<string>;
     isGettingTranscription: boolean;
     isUserTalking: boolean;
+    micStatus: string;
+    private shouldResumeMic;
     chatInputControl: FormControl;
+    constructor();
+    /**
+     * Method used by the template to determine if the mic should continue listening
+     */
+    shouldContinueListening(): boolean;
     score: import("@angular/core").Signal<number>;
     /**
      * Sets the input text in the textarea
@@ -35,6 +41,14 @@ export declare class ChatFooterComponent {
      */
     private evaluateConversation;
     handleAudioRecorded(event: AudioRecording): void;
+    /**
+     * Handles the mic status changed event
+     * @param event The status event from the mic component
+     */
+    handleMicStatusChanged(event: {
+        status: string;
+        description: string;
+    }): void;
     onMicFinished(eventBlob: Blob | any): Promise<void>;
     static ɵfac: i0.ɵɵFactoryDeclaration<ChatFooterComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ChatFooterComponent, "dc-chat-footer", never, { "isAIThinking": { "alias": "isAIThinking"; "required": false; "isSignal": true; }; "evaluatorAgentCard": { "alias": "evaluatorAgentCard"; "required": false; "isSignal": true; }; "micSettings": { "alias": "micSettings"; "required": false; "isSignal": true; }; }, { "sendMessage": "sendMessage"; "textInputChanged": "textInputChanged"; }, never, never, true, never>;

package/lib/components/chat-container/chat-messages-list/chat-messages-list.component.d.ts

@@ -3,12 +3,12 @@ import { ChatMessage, ChatUserSettings } from '../../../models/agent.models';
 import * as i0 from "@angular/core";
 export declare class ChatMessagesListComponent implements AfterViewInit {
     readonly chatUserSettings: import("@angular/core").InputSignal<ChatUserSettings>;
-    aiIcon: string;
-    private conversationService;
     inputMessages: import("@angular/core").InputSignal<ChatMessage[]>;
+    private conversationService;
     private elementRef;
-    messages: import("@angular/core").Signal<ChatMessage[]>;
+    aiIcon: string;
     isThinking: import("@angular/core").Signal<boolean>;
+    messages: import("@angular/core").Signal<ChatMessage[]>;
     constructor();
     ngAfterViewInit(): void;
     scrollToBottom(): void;

package/lib/components/chat-container/chat-messages-list/message-orchestrator/message-orchestrator.component.d.ts

@@ -2,11 +2,11 @@ import { OnInit } from '@angular/core';
 import { ChatRole, MessageAudio } from '../../../../models/agent.models';
 import * as i0 from "@angular/core";
 export declare class MessageOrchestratorComponent implements OnInit {
-    private agentCardService;
     private conversationService;
     messages: import("@angular/core").InputSignal<MessageAudio[]>;
     messageRole: import("@angular/core").InputSignal<ChatRole>;
     messagesSignal: import("@angular/core").WritableSignal<MessageAudio[]>;
+    private messagesEffect;
     readonly playAudio: import("@angular/core").OutputEmitterRef<MessageAudio>;
     readonly audioCompleted: import("@angular/core").OutputEmitterRef<MessageAudio>;
     private audioQueue;

package/lib/components/{chat-settings → chat-container/chat-settings}/dc-conversation-userchat-settings.component.d.ts

@@ -1,5 +1,5 @@
 import { OnInit, TemplateRef } from '@angular/core';
-import { TextEngines } from '../../models/conversation-enums';
+import { TextEngines } from '../../../models/conversation-enums';
 import * as i0 from "@angular/core";
 export declare class DCConversationUserChatSettingsComponent implements OnInit {
     private dialogRef;

package/lib/models/agent.models.d.ts

@@ -29,7 +29,7 @@ export interface IAIModel {
 export interface ITTS {
     voice: string;
     secondaryVoice: string;
-    speed: string;
+    speed: AudioSpeed;
     speedRate: number;
 }
 export interface IAgentMetadata {
@@ -79,6 +79,20 @@ export interface IAgentCard {
     metaApp?: IAgentMetadata;
     accounts?: Array<IAccounts>;
 }
+export interface ISimpleAgent {
+    systemPrompt: string;
+    model: IAIModel;
+}
+export interface ISimpleTask {
+    task: string;
+}
+export interface IMiniAgentCard {
+    task: string;
+    messages: ChatMessage[];
+    expectedResponseType: string;
+    model: IAIModel;
+    sources: string[];
+}
 export declare enum EAccountsPlatform {
     Tiktok = "tiktok",
     Instagram = "instagram",
@@ -91,13 +105,6 @@ export interface IAccounts {
     authMethod: string;
     pass: string;
 }
-export interface IMiniAgentCard {
-    task: string;
-    messages: ChatMessage[];
-    expectedResponseType: string;
-    model: IAIModel;
-    sources: string[];
-}
 export type TranscriptionsWhisper = {
     text: string;
     task: string;
@@ -121,8 +128,9 @@ export declare class MessageAudio {
     content?: string;
     voice?: string;
     shouldPlayAudio?: boolean;
-    messageId?: string | number;
+    messageId?: string;
     tag?: string;
+    imgUrl?: string;
 }
 export declare enum ChatRole {
     System = "system",

package/lib/models/user-data-exchange.d.ts

@@ -1,18 +1,25 @@
 import { InjectionToken, Provider, Type } from '@angular/core';
 import { ChatUserSettings } from './agent.models';
 export interface UserDataExchange {
+    imgUrl: string;
     name: string;
     gender: string;
     age: number;
     baseLang?: string;
     targetLang?: string;
 }
-export declare const USER_DATA_EXCHANGE: InjectionToken<UserDataExchange>;
+export declare const USER_DATA_EXCHANGE: InjectionToken<UserDataExchangeAbstractService>;
 export declare function provideUserDataExchange(serviceImplementation: Type<UserDataExchangeAbstractService>): Provider[];
 export declare abstract class UserDataExchangeAbstractService {
     abstract getUserDataExchange(): UserDataExchange;
+    abstract getUserDataDescriptions(): {
+        key: string;
+        value: any;
+        description: string;
+    }[];
     abstract getParseDict(): {
         [key: string]: string;
     };
     abstract getUserChatSettings(): ChatUserSettings;
+    abstract getUserDataInformation(): string;
 }

package/lib/services/conversation.service.d.ts

@@ -10,15 +10,26 @@ export declare class ConversationService {
     private isThinkingSignal;
     private conversationSettingsSignal;
     private isDestroyedSignal;
+    micStatusSignal: import("@angular/core").WritableSignal<"error" | "ready" | "recording" | "listening" | "initializing" | "inactive" | "paused">;
+    currentAudioStatus: import("@angular/core").WritableSignal<{
+        message: MessageAudio;
+        completed: boolean;
+    }>;
+    private avatarImages;
     getMessagesSignal(): Signal<ChatMessage[]>;
-    addMessage(message: ChatMessage): void;
+    addMessage(message: ChatMessage): string;
+    updateMessage(messageId: string, updatedMessage: Partial<ChatMessage>): boolean;
     isThinking(): Signal<boolean>;
     setDestroyed(value: boolean): void;
-    setupConversationWithAgentCard(agentCard: IAgentCard): void;
+    setupConversationWithAgentCard(agentCard: IAgentCard, parseDict?: {
+        [key: string]: string;
+    }): void;
     initConversationWithSettings(conversationSettings: IConversationSettings): Promise<void>;
     private initConversation;
-    initConversationWithAgentCard(agentCard: IAgentCard): Promise<void>;
-    sendUserMessage(message: ChatMessage): Promise<void>;
+    initConversationWithAgentCard(agentCard: IAgentCard, parseDict?: {
+        [key: string]: string;
+    }): Promise<void>;
+    sendUserMessage(message: ChatMessage, updateId?: string): Promise<void>;
     sendCurrentConversation(): Promise<void>;
     resetConversation(agentCard?: IAgentCard): Promise<void>;
     getTTSFile(message: MessageAudio): Promise<AudioGenerated>;

package/lib/services/evaluation.service.d.ts

@@ -3,13 +3,12 @@ import { ChatMessage, IMiniAgentCard } from '../models/agent.models';
 import * as i0 from "@angular/core";
 export declare class EvaluationService {
     private agentCardService;
+    private toastService;
     private scoreSignal;
     private evaluationResultSignal;
-    /** Inserted by Angular inject() migration for backwards compatibility */
-    constructor(...args: unknown[]);
     getScore(): Signal<number>;
     getEvaluationResult(): Signal<any>;
-    evaluateConversation(messages: ChatMessage[], evaluator: IMiniAgentCard): Promise<void>;
+    evaluateConversation(messages: ChatMessage[], evaluator: IMiniAgentCard): Promise<any>;
     private updateScore;
     resetScore(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<EvaluationService, never>;

package/lib/services/message-processing.service.d.ts

@@ -1,11 +1,15 @@
 import { ChatMessage, IConversationSettings } from '../models/agent.models';
 import * as i0 from "@angular/core";
+interface ExtraData {
+    userImg: string;
+    assistantImg: string;
+}
 export declare class MessageProcessingService {
-    constructor();
-    processMessage(message: ChatMessage, conversationSettings: IConversationSettings): ChatMessage;
+    processMessage(message: ChatMessage, conversationSettings: IConversationSettings, extraData?: ExtraData): ChatMessage;
     private processMultiMessages;
     subsItalicsByTag(text: string, voiceId?: string, tagName?: string): string;
     getVoice(voice_value: string, targetLang?: string): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<MessageProcessingService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<MessageProcessingService>;
 }
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dataclouder/ngx-agent-cards",
-  "version": "0.0.90",
+  "version": "0.1.1",
   "peerDependencies": {
     "@angular/common": ">=18.0.0",
     "@angular/core": ">=18.0.0",

package/public-api.d.ts

@@ -17,4 +17,4 @@ export * from './lib/components/chat-container/chat.models';
 export * from './lib/components/text-highlighter/text-highlighter';
 export * from './lib/components/chat-container/chat-messages-list/chat-message/chat-message.utils';
 export * from './lib/components/chat-container/chat-messages-list/message-orchestrator/message-orchestrator.component';
-export * from './lib/components/extraction.regex';
+export * from './lib/utils/icons/extraction.regex';

package/README.md

@@ -1,324 +0,0 @@
-# Description
-
-This is library for Chatting with AI Agents.
-
-The library introduces a new concept: Agent Card.
-
-This is general structure that Can handle all kind of conversation: character cards, situations, scenarios, and more.
-
-Uses the concept of Character Specifications V2, since is the most popular so far.
-https://github.com/malfoyslastname/character-card-spec-v2
-
-but improves with this new concept called of Agent cards Conversations.
-
-## Settings
-
-The library depends on your own connections with LLMs, so you need to provide a service that implements the specifications.
-
-Any model works well.
-
-Provide this service in your `main.ts` using the function `provideChatAIService`:
-
-```typescript
-import { provideChatAIService } from '@dataclouder/ngx-agent-cards';
-
-provideChatAIService(AgentCardsService);
-```
-
-Create your own service implementing the interface:
-
-```typescript
-import { AgentCardsAbstractService } from '@dataclouder/ngx-agent-cards';
-
-export class AgentCardsService implements AgentCardsAbstractService {
-  constructor(private httpService: HttpService, private userService: UserService) {}
-
-  public async callChatCompletion(conversation: ConversationPromptSettings): Promise<any> {
-    // Implementation here
-  }
-}
-```
-
-### Dependencies
-
-1. Angular Core
-
-2. Angular cdk only for internal dialog, dont forget to include css
-   @import '@angular/cdk/overlay-prebuilt.css';
-
-3. @dataclouder/storage-uploader to upload to GCP
-
-```
-    "@angular/common": ">=18.0.0",
-    "@angular/core": ">=18.0.0",
-    "@angular/cdk": ">=18.0.0",
-    "@dataclouder/storage-uploader": ">=0.0.4"
-```
-
-### Implementing Abstract Service
-
-in order to make this library compatible with your own logic you have provide a service implemeting AgentCardsAbstractService.
-
-```
-
-export abstract class AgentCardsAbstractService {
-  // call the llm to implement the completion
-  abstract callChatCompletion(conversation: ConversationDTO): Promise<any>;
-  // get the id of your card
-  abstract findConversationCard(id: string): Promise<IAgentCard>;
-  // get all conversation cards
-  abstract getAllConversationCards(): Promise<IAgentCard[]>;
-
-  abstract saveConversationCard(conversation: IAgentCard): Promise<IAgentCard>;
-
-  abstract deleteConversationCard(id: string): Promise<IAgentCard>;
-
-  abstract getTextAudioFile(tts: any): Promise<any>;
-
-  abstract getConversationUserSettings(): Promise<ChatUserSettings>;
-
-  abstract getConversationChatSettings(): Promise<ConversationPromptSettings>;
-
-  // strategy to save converstionUserSettings.
-  abstract saveConversationUserChatSettings(conversation: ChatUserSettings): Promise<ChatUserSettings>;
-}
-```
-
-### Components
-
-![Component Diagram](./docs/componentes_diagram.jpg)
-
-- **AgentCardListComponent**: Connects with backends shows availible conversations.
-
-- **DcAgentCardDetailsComponent**: Visualize Conversation Card details and start a conversation.
-
-- **DCChatComponent**: Start a conversation:
-
-<div style="display: flex; align-items: flex-start; gap: 20px;">
-  <div style="flex: 1">
-    <strong> *DCAgentCardFormComponent</strong>: This component is used to manage the conversation card data.
-  </div>
-  <div style="flex: 1">
-    <img src="./docs/conversation-form.png" alt="Component Diagram">
-  </div>
-</div>
-
-<div style="display: flex; align-items: flex-start; gap: 20px;">
-  <div style="flex: 1">
-    <strong> *DCChatSettingsComponent</strong>: this is use to change chat settings
-  </div>
-  <div style="flex: 1">
-    <img src="./docs/chat-settings.png" alt="Component Diagram">
-  </div>
-</div>
-- **ChatMessageComponent**
-
-## Changing CSS components.
-
-There are 3 options, to custom a DC component.
-
-1. HARD: totaly custom: need to know the libraries, import the raw components and rewrite the logic, or copy same logic just change what you need.
-2. Pass the component you want to substitude. WIP
-
-3. EASY: Pass the CSS.
-
-## About conversations tecnical explanation
-
-Character AI is evolving quickly, but there is no clear path on who is leading or proposing new standards.
-
-For now, all implementations contain V2 of character AI.
-
-This project contains better explanations about a Char.
-
-https://github.com/Bronya-Rand/Prom-Spec-V3
-
-This project goes beyond that, providing a new abstraction that can contain one or multiple characters and more conditions for the characters' interactions.
-
-I call this:
-
-Conversation AI V1
-
-Here are the specs for V1:
-
-This first version can only have one character. I need to understand a little bit more to create conversations with multiple characters, which I'll include in the second version.
-
-```typescript
-export interface IAgentCard {
-  version: string;
-  id: string;
-  title: string;
-
-  characterCard: CharaCard;
-
-  textEngine: TextEngines;
-  conversationType: ScenarioType;
-  lang: string;
-
-  tts: {
-    voice: string;
-    secondaryVoice: string;
-    speed: string;
-    speedRate: number;
-  };
-
-  metaApp: {
-    isPublished: boolean;
-    isPublic: any;
-    authorId: string;
-    authorEmail: string;
-    createdAt: Date;
-    updatedAt: Date;
-    takenCount: number;
-  };
-}
-```
-
-`characterCard`: The card you want to use to talk.
-
-`textEngine`: In order to read text, there are multiple formats in markdown. Depending on your format, the engine needs to read and highlight in different ways. Also, the app itself can create its own engine to add more functionalities.
-
-`conversationType`: This can be general purpose just to tag it, or the app can modify the conversation depending on the type.
-
-`lang`: The main language where the app is intended to operate.
-
-`tts`: Extra functionalities to add TTS. I need to think more on this. In the future, voices will probably be free or downloadable. For now, it is only the ID of the voice. There are only two voices in the first approach.
-
-`metaApp`: Everything your app needs to work. Audit data, how many times your app has been used, if the conversation is a challenge type, you can count how many passed or failed, etc.
-
-### How works
-
-multiple systems need to use chats, and add functionalities for chatting.
-
-This functionality is usually the same.
-
-Conversation Types
-
-- General
-- Reflextion:
-- Role Play
-- Role Play With Narrador
-- Challenge
-
-### How User and Chat Settings works.
-
-This is one of the biggest problems, app need to handle this an provide a service that is able to retrive this settings.
-
-There are multiple ways to use the chat, and there are
-functionalities availible, Users can save this functions and thats why you need the object ChatUserSettings,
-Chat are settings that does not depend on the user but in the application.
-
-Check the object.
-
-#### ChatUserSettings
-
-Conversation Chat User Settings.
-This is an implementation app can handle, it can be locally settings by defult saving on browers or DB.
-basically user have the object ChatUserSettings
-
-```typescript
-export class ChatUserSettings {
-  realTime: boolean;
-  repeatRecording: boolean;
-  fixGrammar: boolean;
-  superHearing: boolean;
-  voice: string;
-  autoTranslate: boolean;
-  highlightWords: boolean;
-  synthVoice: boolean;
-  modelName: string;
-  provider: string;
-  speed: string;
-  speedRate: number; // temporal
-}
-```
-
-#### ConversationPromptSettings
-
-```typescript
-export class ConversationPromptSettings {
-  messages?: ChatMessage[];
-  last_prompt?: string;
-  conversationType?: ConversationType;
-  textEngine?: string;
-  voice?: string; // first voice
-  secondaryVoice?: string; // apply for narrator
-  overrideConversationSettings?: Partial<ChatUserSettings>;
-}
-```
-
-Those are object to need to think how to store, create and pass to the chat.
-
-### How to parse conversation instructions.
-
-In order to adapt the conversartion to the current user, Character Cards use some wild words that are parsed before conversation start, so LLM is aware of name age and other data to make a custum conversation.
-
-Silly tarvern called this macros.
-https://docs.sillytavern.app/usage/core-concepts/macros/#general-macros
-
-wilds, macros, parse dict, will reference to the same.
-
-{{user}}:
-{{bot}}:
-
-You have to create your custom function when you want to parse,
-
-Exmaple: Polilan add more wilds for the same porpuse that helps to add context of learning languages.
-
-{{word}}: is the words the user is studing
-{{targe}}: is the language the user wants to learn
-{{base}}: is the user native language
-
-##### Build messages to start a conversation
-
-- conversation need attached all the data from the character card.
-- this is my format.
-
-![Component Diagram](./docs/parsing_conversation.png)
-
-### Componentes in details
-
-1. **DCDCAgentCardFormComponent**
-
-#### Inputs:
-
-**conversationCardId**: string; is the id for the conversation to modify will look up for this in api otherwise is empty card. if is not passed will look for the id in the URL.
-
-**storageSettings**: StorageSettings: you can override the default setting for cropping:
-{ cropImageSettings: { path: '', fileName: '', resizeToWidth: 450 }, ratioType: AspectType.Vertical_9_16, resolutions: [ResolutionType.MediumLarge], };
-
-#### Outputs
-
-onImageLoaded: when the image is loaded in the storage.
-
-onSave: when user click save
-
-2. **ChatComponent**
-
-### Inputs
-
-**chatUserSettings** : if you want to hardcode the settings, otherwise will use the provided AgentCardsAbstractService
-
-**conversationCardId**:
-
-### Outputs
-
-### How to add TTS.
-
-There are multiple services that impruve Speaking App Capabilities, i think in future backend will handle all of them and front will only send the settings.
-
-For now backend need to implement a service. tts.
-
-### How to build and publish new version of this library
-
-the component need the cropper as dependency, make sure you already installed or compile that library.
-inside the angular
-is required to build first the dependencies locally
-
-npm run build:storage-uploader
-npm run build:core-components
-npm run publish:conversations
-
-after that i recommend to remove /dist folder, why ? becouse project path is linked to dist folder first if exits, and the to the source code. so in order to code easier i recommend to remove the dist folder.
-
-- npm run build
-- npm run publish