igniteui-webcomponents 6.3.0-beta.0 → 6.3.0

package/components/chat/chat-state.js

@@ -1,8 +1,12 @@
-import { enterKey } from '../common/controllers/key-bindings.js';
 import { IgcChatResourceStringEN } from '../common/i18n/chat.resources.js';
 import { isEmpty, nanoid } from '../common/util.js';
-import { parseAcceptedFileTypes } from './utils.js';
+import IgcToastComponent from '../toast/toast.js';
+import IgcTooltipComponent from '../tooltip/tooltip.js';
+import { isImageAttachment, parseAcceptedFileTypes, } from './utils.js';
 export class ChatState {
+    get host() {
+        return this._host;
+    }
     get acceptedFileTypes() {
         return this._acceptedTypesCache;
     }
@@ -20,22 +24,17 @@ export class ChatState {
     }
     set options(value) {
         this._options = value;
+        this._setAcceptedTypesCache();
         this._contextUpdateFn.call(this._host);
     }
     get currentUserId() {
         return this._options?.currentUserId ?? 'user';
     }
     get suggestionsPosition() {
-        return this._options?.suggestionsPosition ?? this._suggestionsPosition;
+        return this._options?.suggestionsPosition ?? 'below-messages';
     }
     get stopTypingDelay() {
-        return this._options?.stopTypingDelay ?? this._stopTypingDelay;
-    }
-    get textArea() {
-        return this._textArea;
-    }
-    set textArea(value) {
-        this._textArea = value;
+        return this._options?.stopTypingDelay ?? 3000;
     }
     get inputAttachments() {
         return this._inputAttachments;
@@ -52,35 +51,26 @@ export class ChatState {
         this._userInputContextUpdateFn.call(this._host);
     }
     get hasInputValue() {
-        return this._inputValue.trim() !== '';
+        return !!this._inputValue.trim();
     }
     get hasInputAttachments() {
         return !isEmpty(this._inputAttachments);
     }
     constructor(chat, contextUpdateFn, userInputContextUpdateFn) {
-        this._textArea = null;
         this._messages = [];
         this._inputAttachments = [];
         this._inputValue = '';
         this._acceptedTypesCache = null;
-        this._suggestionsPosition = 'below-messages';
-        this._stopTypingDelay = 3000;
         this._isTyping = false;
         this._lastTyped = Date.now();
         this.resourceStrings = IgcChatResourceStringEN;
-        this.handleKeyDown = (e) => {
-            if (e.key.toLowerCase() === enterKey.toLowerCase() && !e.shiftKey) {
-                e.preventDefault();
-                this.sendMessage();
-            }
-            else {
-                this._lastTyped = Date.now();
-                if (!this._isTyping) {
-                    this.emitEvent('igcTypingChange', {
-                        detail: { isTyping: true },
-                    });
-                    this._isTyping = true;
-                }
+        this.handleKeyDown = (_) => {
+            this._lastTyped = Date.now();
+            if (!this._isTyping) {
+                this.emitEvent('igcTypingChange', {
+                    detail: { isTyping: true },
+                });
+                this._isTyping = true;
                 const stopTypingDelay = this.stopTypingDelay;
                 setTimeout(() => {
                     if (this._isTyping &&
@@ -94,36 +84,6 @@ export class ChatState {
                 }, stopTypingDelay);
             }
         };
-        this.sendMessage = () => {
-            if (!this.inputValue.trim() && this.inputAttachments.length === 0)
-                return;
-            this.addMessage({
-                text: this.inputValue,
-                attachments: this.inputAttachments,
-            });
-            this.inputValue = '';
-            if (this._textArea) {
-                this._textArea.style.height = 'auto';
-            }
-            this._host.updateComplete.then(() => {
-                this._textArea?.focus();
-            });
-        };
-        this.removeAttachment = (index) => {
-            const allowed = this.emitEvent('igcAttachmentChange', {
-                detail: this.inputAttachments.filter((_, i) => i !== index),
-                cancelable: true,
-            });
-            if (allowed) {
-                this.inputAttachments = this.inputAttachments.filter((_, i) => i !== index);
-            }
-        };
-        this.handleSuggestionClick = (suggestion) => {
-            this.addMessage({ text: suggestion });
-            if (this.textArea) {
-                this.textArea.focus();
-            }
-        };
         this._host = chat;
         this._contextUpdateFn = contextUpdateFn;
         this._userInputContextUpdateFn = userInputContextUpdateFn;
@@ -134,63 +94,94 @@ export class ChatState {
     emitEvent(name, args) {
         return this._host.emitEvent(name, args);
     }
-    addMessage(message) {
-        const newMessage = {
+    emitMessageCreated(message) {
+        return this._host.emitEvent('igcMessageCreated', {
+            detail: message,
+            cancelable: true,
+        });
+    }
+    emitAttachmentsAdded(attachments) {
+        return this._host.emitEvent('igcAttachmentAdded', {
+            detail: attachments,
+            cancelable: true,
+        });
+    }
+    emitAttachmentRemoved(attachment) {
+        return this._host.emitEvent('igcAttachmentRemoved', {
+            detail: attachment,
+            cancelable: true,
+        });
+    }
+    emitMessageReaction(reaction) {
+        return this._host.emitEvent('igcMessageReact', { detail: reaction });
+    }
+    showActionsTooltip(target, message) {
+        if (!this._actionsTooltip) {
+            this._actionsTooltip = document.createElement(IgcTooltipComponent.tagName);
+            this._actionsTooltip.hideTriggers = 'pointerleave,click,blur';
+            this._actionsTooltip.hideDelay = 100;
+            this._host.renderRoot.appendChild(this._actionsTooltip);
+        }
+        this._actionsTooltip.message = message;
+        this._actionsTooltip.show(target);
+    }
+    showActionToast(content) {
+        if (!this._actionToast) {
+            this._actionToast = document.createElement(IgcToastComponent.tagName);
+            this._actionToast.displayTime = 3000;
+            this._host.renderRoot.appendChild(this._actionToast);
+        }
+        this._actionToast.textContent = content;
+        this._actionToast.show();
+    }
+    _setAcceptedTypesCache() {
+        this._acceptedTypesCache = this.options?.acceptedFiles
+            ? parseAcceptedFileTypes(this.options.acceptedFiles)
+            : null;
+    }
+    _createMessage(message) {
+        return {
             id: message.id ?? nanoid(),
             text: message.text ?? '',
             sender: message.sender ?? this.currentUserId,
-            timestamp: message.timestamp ?? new Date(),
+            timestamp: message.timestamp ?? Date.now().toString(),
             attachments: message.attachments || [],
         };
-        const allowed = this.emitEvent('igcMessageCreated', {
-            detail: newMessage,
-            cancelable: true,
-        });
-        if (allowed) {
-            if (!this.messages.some((msg) => msg.id === newMessage.id)) {
-                this.messages = [...this.messages, newMessage];
-            }
-            this._host.requestUpdate('messages');
+    }
+    addMessage(message) {
+        this.messages.push(this._createMessage(message));
+        this._host.requestUpdate('messages');
+    }
+    addMessageWithEvent(message) {
+        const newMessage = this._createMessage(message);
+        if (this.emitMessageCreated(newMessage)) {
+            this.addMessage(newMessage);
             this.inputValue = '';
             this.inputAttachments = [];
         }
     }
-    attachFiles(files) {
+    attachFilesWithEvent(files) {
         const newAttachments = [];
         const fileNames = new Set(this.inputAttachments.map((attachment) => attachment.file?.name ?? ''));
         for (const file of files) {
             if (fileNames.has(file.name)) {
                 continue;
             }
-            const isImage = file.type.startsWith('image/');
             const url = URL.createObjectURL(file);
-            newAttachments.push({
+            const attachment = {
                 id: nanoid(),
                 url,
                 name: file.name,
                 file,
-                thumbnail: isImage ? url : undefined,
-            });
+            };
+            if (isImageAttachment(file)) {
+                attachment.thumbnail = url;
+            }
+            newAttachments.push(attachment);
         }
-        const allowed = this.emitEvent('igcAttachmentChange', {
-            detail: [...this.inputAttachments, ...newAttachments],
-            cancelable: true,
-        });
-        if (allowed) {
+        if (this.emitAttachmentsAdded(newAttachments)) {
             this.inputAttachments = [...this.inputAttachments, ...newAttachments];
         }
     }
-    isImageAttachment(attachment) {
-        return (attachment.type === 'image' ||
-            !!attachment.file?.type.startsWith('image/'));
-    }
-    updateOptions(options) {
-        this.options = { ...this.options, ...options };
-    }
-    updateAcceptedTypesCache() {
-        this._acceptedTypesCache = this.options?.acceptedFiles
-            ? parseAcceptedFileTypes(this.options.acceptedFiles)
-            : null;
-    }
 }
 //# sourceMappingURL=chat-state.js.map

package/components/chat/chat-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"chat-state.js","sourceRoot":"","sources":["../../../src/components/chat/chat-state.ts"],"names":[],"mappings":"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","sourcesContent":["import { enterKey } from '../common/controllers/key-bindings.js';\nimport { IgcChatResourceStringEN } from '../common/i18n/chat.resources.js';\nimport { isEmpty, nanoid } from '../common/util.js';\nimport type IgcTextareaComponent from '../textarea/textarea.js';\nimport type IgcChatComponent from './chat.js';\nimport type { IgcChatComponentEventMap } from './chat.js';\nimport type {\n  IgcChatOptions,\n  IgcMessage,\n  IgcMessageAttachment,\n} from './types.js';\nimport { type ChatAcceptedFileTypes, parseAcceptedFileTypes } from './utils.js';\n\n/**\n * Internal state manager for the `<igc-chat>` component.\n *\n * Manages messages, input value, attachments, options, and event emissions.\n */\nexport class ChatState {\n  //#region Internal properties and state /** The host `<igc-chat>` component instance */\n  private readonly _host: IgcChatComponent;\n\n  private readonly _contextUpdateFn: () => unknown;\n  private readonly _userInputContextUpdateFn: () => unknown;\n\n  /** Reference to the text area input component */\n  private _textArea: IgcTextareaComponent | null = null;\n  /** The current list of messages */\n  private _messages: IgcMessage[] = [];\n  /** Chat options/configuration */\n  private _options?: IgcChatOptions;\n\n  /** List of current input attachments */\n  private _inputAttachments: IgcMessageAttachment[] = [];\n  /** Current input text */\n  private _inputValue = '';\n  /**\n   * Cache of accepted file types, organized into extensions, mimeTypes, and wildcardTypes\n   */\n  private _acceptedTypesCache: ChatAcceptedFileTypes | null = null;\n  /** Default position of the suggestions */\n  private _suggestionsPosition: 'below-input' | 'below-messages' =\n    'below-messages';\n  /** Default time in milliseconds before dispatching stop typing event */\n  private _stopTypingDelay = 3000;\n\n  public _isTyping = false;\n  private _lastTyped = Date.now();\n\n  public resourceStrings = IgcChatResourceStringEN;\n\n  //#endregion\n\n  //#region Public properties\n\n  public get acceptedFileTypes() {\n    return this._acceptedTypesCache;\n  }\n\n  public get disableAutoScroll(): boolean {\n    return this._options?.disableAutoScroll ?? false;\n  }\n\n  /**\n   * Gets the list of chat messages.\n   */\n  public get messages(): IgcMessage[] {\n    return this._messages;\n  }\n\n  /**\n   * Sets the list of chat messages.\n   */\n  public set messages(value: IgcMessage[]) {\n    this._messages = value;\n  }\n\n  /**\n   * Gets current chat options.\n   */\n  public get options(): IgcChatOptions | undefined {\n    return this._options;\n  }\n\n  /**\n   * Sets chat options and requests host update.\n   */\n  public set options(value: IgcChatOptions) {\n    this._options = value;\n    this._contextUpdateFn.call(this._host);\n  }\n\n  /**\n   * Gets the current user ID from options or returns 'user' as fallback.\n   */\n  public get currentUserId(): string {\n    return this._options?.currentUserId ?? 'user';\n  }\n\n  /**\n   * Gets the current suggestionsPosition from options or returns the default value 'below-messages'.\n   */\n  public get suggestionsPosition(): string {\n    return this._options?.suggestionsPosition ?? this._suggestionsPosition;\n  }\n\n  /**\n   * Gets the current stopTypingDelay from options or returns the default value `3000`.\n   */\n  public get stopTypingDelay(): number {\n    return this._options?.stopTypingDelay ?? this._stopTypingDelay;\n  }\n\n  /**\n   * Gets the text area component.\n   */\n  public get textArea(): IgcTextareaComponent | null {\n    return this._textArea;\n  }\n\n  /**\n   * Sets the text area component.\n   */\n  public set textArea(value: IgcTextareaComponent) {\n    this._textArea = value;\n  }\n\n  /**\n   * Gets the list of attachments currently attached to input.\n   */\n  public get inputAttachments(): IgcMessageAttachment[] {\n    return this._inputAttachments;\n  }\n\n  /**\n   * Sets the input attachments and requests host update.\n   */\n  public set inputAttachments(value: IgcMessageAttachment[]) {\n    this._inputAttachments = value;\n    this._userInputContextUpdateFn.call(this._host);\n  }\n\n  /**\n   * Gets the current input value.\n   */\n  public get inputValue(): string {\n    return this._inputValue;\n  }\n\n  /**\n   * Sets the current input value and requests host update.\n   */\n  public set inputValue(value: string) {\n    this._inputValue = value;\n    this._userInputContextUpdateFn.call(this._host);\n  }\n\n  public get hasInputValue(): boolean {\n    return this._inputValue.trim() !== '';\n  }\n\n  public get hasInputAttachments(): boolean {\n    return !isEmpty(this._inputAttachments);\n  }\n\n  //#endregion\n\n  constructor(\n    chat: IgcChatComponent,\n    contextUpdateFn: () => unknown,\n    userInputContextUpdateFn: () => unknown\n  ) {\n    this._host = chat;\n    this._contextUpdateFn = contextUpdateFn;\n    this._userInputContextUpdateFn = userInputContextUpdateFn;\n  }\n\n  public isCurrentUserMessage(message?: IgcMessage): boolean {\n    return this.currentUserId === message?.sender;\n  }\n\n  //#region Event handlers\n\n  public emitEvent(name: keyof IgcChatComponentEventMap, args?: any): boolean {\n    return this._host.emitEvent(name, args);\n  }\n\n  //#endregion\n\n  //#region Public API\n\n  /**\n   * Adds a new chat message.\n   * Emits 'igcMessageCreated' event which can be canceled to prevent adding.\n   * Clears input value and attachments on success.\n   * @param message Partial message object with optional id, sender, timestamp\n   */\n  public addMessage(message: Partial<IgcMessage>): void {\n    const newMessage: IgcMessage = {\n      id: message.id ?? nanoid(),\n      text: message.text ?? '',\n      sender: message.sender ?? this.currentUserId,\n      timestamp: message.timestamp ?? new Date(),\n      attachments: message.attachments || [],\n    };\n\n    const allowed = this.emitEvent('igcMessageCreated', {\n      detail: newMessage,\n      cancelable: true,\n    });\n\n    if (allowed) {\n      if (!this.messages.some((msg) => msg.id === newMessage.id)) {\n        this.messages = [...this.messages, newMessage];\n      }\n      this._host.requestUpdate('messages');\n\n      this.inputValue = '';\n      this.inputAttachments = [];\n    }\n  }\n\n  /**\n   * Adds files as attachments to the input.\n   * Emits 'igcAttachmentChange' event which can be canceled to prevent adding.\n   * @param files Array of File objects to attach\n   */\n  public attachFiles(files: File[]) {\n    const newAttachments: IgcMessageAttachment[] = [];\n    const fileNames = new Set(\n      this.inputAttachments.map((attachment) => attachment.file?.name ?? '')\n    );\n\n    for (const file of files) {\n      if (fileNames.has(file.name)) {\n        continue;\n      }\n\n      const isImage = file.type.startsWith('image/');\n      const url = URL.createObjectURL(file);\n\n      newAttachments.push({\n        id: nanoid(),\n        url,\n        name: file.name,\n        file,\n        thumbnail: isImage ? url : undefined,\n      });\n    }\n\n    const allowed = this.emitEvent('igcAttachmentChange', {\n      detail: [...this.inputAttachments, ...newAttachments],\n      cancelable: true,\n    });\n    if (allowed) {\n      this.inputAttachments = [...this.inputAttachments, ...newAttachments];\n    }\n  }\n\n  public isImageAttachment(attachment: IgcMessageAttachment): boolean {\n    return (\n      attachment.type === 'image' ||\n      !!attachment.file?.type.startsWith('image/')\n    );\n  }\n\n  public handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key.toLowerCase() === enterKey.toLowerCase() && !e.shiftKey) {\n      e.preventDefault();\n      this.sendMessage();\n    } else {\n      this._lastTyped = Date.now();\n      if (!this._isTyping) {\n        this.emitEvent('igcTypingChange', {\n          detail: { isTyping: true },\n        });\n        this._isTyping = true;\n      }\n\n      const stopTypingDelay = this.stopTypingDelay;\n      setTimeout(() => {\n        if (\n          this._isTyping &&\n          stopTypingDelay &&\n          this._lastTyped + stopTypingDelay < Date.now()\n        ) {\n          this.emitEvent('igcTypingChange', {\n            detail: { isTyping: false },\n          });\n          this._isTyping = false;\n        }\n      }, stopTypingDelay);\n    }\n  };\n\n  public sendMessage = () => {\n    if (!this.inputValue.trim() && this.inputAttachments.length === 0) return;\n\n    this.addMessage({\n      text: this.inputValue,\n      attachments: this.inputAttachments,\n    });\n    this.inputValue = '';\n\n    if (this._textArea) {\n      this._textArea.style.height = 'auto';\n    }\n\n    this._host.updateComplete.then(() => {\n      this._textArea?.focus();\n    });\n  };\n\n  /**\n   * Removes an attachment by index.\n   * Emits 'igcAttachmentChange' event which can be canceled to prevent removal.\n   * @param index Index of the attachment to remove\n   */\n  public removeAttachment = (index: number): void => {\n    const allowed = this.emitEvent('igcAttachmentChange', {\n      detail: this.inputAttachments.filter((_, i) => i !== index),\n      cancelable: true,\n    });\n    if (allowed) {\n      this.inputAttachments = this.inputAttachments.filter(\n        (_, i) => i !== index\n      );\n    }\n  };\n\n  /**\n   * Handles when a suggestion is clicked.\n   * Adds the suggestion as a new message and focuses the text area.\n   * @param suggestion The suggestion string clicked\n   */\n  public handleSuggestionClick = (suggestion: string): void => {\n    this.addMessage({ text: suggestion });\n    if (this.textArea) {\n      this.textArea.focus();\n    }\n  };\n\n  /**\n   * Updates the chat options partially.\n   * @param options Partial options to merge with current options\n   */\n  public updateOptions(options: Partial<IgcChatOptions>): void {\n    this.options = { ...this.options, ...options };\n  }\n\n  /**\n   * Updates the internal cache for accepted file types.\n   * Parses the acceptedFiles string option into extensions, mimeTypes, and wildcard types.\n   */\n  public updateAcceptedTypesCache(): void {\n    this._acceptedTypesCache = this.options?.acceptedFiles\n      ? parseAcceptedFileTypes(this.options.acceptedFiles)\n      : null;\n  }\n\n  //#endregion\n}\n"]}
+{"version":3,"file":"chat-state.js","sourceRoot":"","sources":["../../../src/components/chat/chat-state.ts"],"names":[],"mappings":"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","sourcesContent":["import { IgcChatResourceStringEN } from '../common/i18n/chat.resources.js';\nimport { isEmpty, nanoid } from '../common/util.js';\nimport IgcToastComponent from '../toast/toast.js';\nimport IgcTooltipComponent from '../tooltip/tooltip.js';\nimport type IgcChatComponent from './chat.js';\nimport type { IgcChatComponentEventMap } from './chat.js';\nimport type {\n  ChatSuggestionsPosition,\n  IgcChatMessage,\n  IgcChatMessageAttachment,\n  IgcChatMessageReaction,\n  IgcChatOptions,\n} from './types.js';\nimport {\n  type ChatAcceptedFileTypes,\n  isImageAttachment,\n  parseAcceptedFileTypes,\n} from './utils.js';\n\n/**\n * Internal state manager for the `<igc-chat>` component.\n *\n * Manages messages, input value, attachments, options, and event emissions.\n */\nexport class ChatState {\n  //#region Internal properties and state /** The host `<igc-chat>` component instance */\n  private readonly _host: IgcChatComponent;\n\n  private readonly _contextUpdateFn: () => unknown;\n  private readonly _userInputContextUpdateFn: () => unknown;\n\n  private _actionsTooltip?: IgcTooltipComponent;\n  private _actionToast?: IgcToastComponent;\n\n  /** The current list of messages */\n  private _messages: IgcChatMessage[] = [];\n  /** Chat options/configuration */\n  private _options?: IgcChatOptions;\n\n  /** List of current input attachments */\n  private _inputAttachments: IgcChatMessageAttachment[] = [];\n  /** Current input text */\n  private _inputValue = '';\n  /**\n   * Cache of accepted file types, organized into extensions, mimeTypes, and wildcardTypes\n   */\n  private _acceptedTypesCache: ChatAcceptedFileTypes | null = null;\n\n  public _isTyping = false;\n  private _lastTyped = Date.now();\n\n  public resourceStrings = IgcChatResourceStringEN;\n\n  //#endregion\n\n  //#region Public properties\n\n  public get host(): IgcChatComponent {\n    return this._host;\n  }\n\n  public get acceptedFileTypes(): ChatAcceptedFileTypes | null {\n    return this._acceptedTypesCache;\n  }\n\n  public get disableAutoScroll(): boolean {\n    return this._options?.disableAutoScroll ?? false;\n  }\n\n  /**\n   * Gets the list of chat messages.\n   */\n  public get messages(): IgcChatMessage[] {\n    return this._messages;\n  }\n\n  /**\n   * Sets the list of chat messages.\n   */\n  public set messages(value: IgcChatMessage[]) {\n    this._messages = value;\n  }\n\n  /**\n   * Gets current chat options.\n   */\n  public get options(): IgcChatOptions | undefined {\n    return this._options;\n  }\n\n  /**\n   * Sets chat options and requests host update.\n   */\n  public set options(value: IgcChatOptions) {\n    this._options = value;\n    this._setAcceptedTypesCache();\n    this._contextUpdateFn.call(this._host);\n  }\n\n  /**\n   * Gets the current user ID from options or returns 'user' as fallback.\n   */\n  public get currentUserId(): string {\n    return this._options?.currentUserId ?? 'user';\n  }\n\n  /**\n   * Gets the current suggestionsPosition from options or returns the default value 'below-messages'.\n   */\n  public get suggestionsPosition(): ChatSuggestionsPosition {\n    return this._options?.suggestionsPosition ?? 'below-messages';\n  }\n\n  /**\n   * Gets the current stopTypingDelay from options or returns the default value `3000`.\n   */\n  public get stopTypingDelay(): number {\n    return this._options?.stopTypingDelay ?? 3000;\n  }\n\n  /**\n   * Gets the list of attachments currently attached to input.\n   */\n  public get inputAttachments(): IgcChatMessageAttachment[] {\n    return this._inputAttachments;\n  }\n\n  /**\n   * Sets the input attachments and requests host update.\n   */\n  public set inputAttachments(value: IgcChatMessageAttachment[]) {\n    this._inputAttachments = value;\n    this._userInputContextUpdateFn.call(this._host);\n  }\n\n  /**\n   * Gets the current input value.\n   */\n  public get inputValue(): string {\n    return this._inputValue;\n  }\n\n  /**\n   * Sets the current input value and requests host update.\n   */\n  public set inputValue(value: string) {\n    this._inputValue = value;\n    this._userInputContextUpdateFn.call(this._host);\n  }\n\n  /**\n   * Returns whether the default chat input textarea has a trimmed value payload.\n   * @internal\n   */\n  public get hasInputValue(): boolean {\n    return !!this._inputValue.trim();\n  }\n\n  /**\n   * Returns whether the default file input of the chat has any attached files.\n   * @internal\n   */\n  public get hasInputAttachments(): boolean {\n    return !isEmpty(this._inputAttachments);\n  }\n\n  //#endregion\n\n  constructor(\n    chat: IgcChatComponent,\n    contextUpdateFn: () => unknown,\n    userInputContextUpdateFn: () => unknown\n  ) {\n    this._host = chat;\n    this._contextUpdateFn = contextUpdateFn;\n    this._userInputContextUpdateFn = userInputContextUpdateFn;\n  }\n\n  public isCurrentUserMessage(message?: IgcChatMessage): boolean {\n    return this.currentUserId === message?.sender;\n  }\n\n  //#region Event handlers\n\n  public emitEvent(name: keyof IgcChatComponentEventMap, args?: any): boolean {\n    return this._host.emitEvent(name, args);\n  }\n\n  /** @internal */\n  public emitMessageCreated(message: IgcChatMessage): boolean {\n    return this._host.emitEvent('igcMessageCreated', {\n      detail: message,\n      cancelable: true,\n    });\n  }\n\n  /** @internal */\n  public emitAttachmentsAdded(\n    attachments: IgcChatMessageAttachment[]\n  ): boolean {\n    return this._host.emitEvent('igcAttachmentAdded', {\n      detail: attachments,\n      cancelable: true,\n    });\n  }\n\n  /** @internal */\n  public emitAttachmentRemoved(attachment: IgcChatMessageAttachment): boolean {\n    return this._host.emitEvent('igcAttachmentRemoved', {\n      detail: attachment,\n      cancelable: true,\n    });\n  }\n\n  /** @internal */\n  public emitMessageReaction(reaction: IgcChatMessageReaction): boolean {\n    return this._host.emitEvent('igcMessageReact', { detail: reaction });\n  }\n\n  /**\n   * @internal\n   */\n  public showActionsTooltip(target: Element, message: string): void {\n    if (!this._actionsTooltip) {\n      this._actionsTooltip = document.createElement(\n        IgcTooltipComponent.tagName\n      );\n      this._actionsTooltip.hideTriggers = 'pointerleave,click,blur';\n      this._actionsTooltip.hideDelay = 100;\n      this._host.renderRoot.appendChild(this._actionsTooltip);\n    }\n    this._actionsTooltip.message = message;\n    this._actionsTooltip.show(target);\n  }\n\n  /**\n   * @internal\n   */\n  public showActionToast(content: string): void {\n    if (!this._actionToast) {\n      this._actionToast = document.createElement(IgcToastComponent.tagName);\n      this._actionToast.displayTime = 3000;\n      this._host.renderRoot.appendChild(this._actionToast);\n    }\n    this._actionToast.textContent = content;\n    this._actionToast.show();\n  }\n\n  //#endregion\n\n  /**\n   * Updates the internal cache for accepted file types.\n   * Parses the acceptedFiles string option into extensions, mimeTypes, and wildcard types.\n   */\n  private _setAcceptedTypesCache(): void {\n    this._acceptedTypesCache = this.options?.acceptedFiles\n      ? parseAcceptedFileTypes(this.options.acceptedFiles)\n      : null;\n  }\n\n  protected _createMessage(message: Partial<IgcChatMessage>): IgcChatMessage {\n    return {\n      id: message.id ?? nanoid(),\n      text: message.text ?? '',\n      sender: message.sender ?? this.currentUserId,\n      timestamp: message.timestamp ?? Date.now().toString(),\n      attachments: message.attachments || [],\n    };\n  }\n\n  public addMessage(message: Partial<IgcChatMessage>) {\n    this.messages.push(this._createMessage(message));\n    this._host.requestUpdate('messages');\n  }\n\n  //#region Public API\n\n  /**\n   * Adds a new chat message.\n   * Emits 'igcMessageCreated' event which can be canceled to prevent adding.\n   * Clears input value and attachments on success.\n   * @internal\n   */\n  public addMessageWithEvent(message: Partial<IgcChatMessage>): void {\n    const newMessage = this._createMessage(message);\n\n    if (this.emitMessageCreated(newMessage)) {\n      this.addMessage(newMessage);\n      this.inputValue = '';\n      this.inputAttachments = [];\n    }\n  }\n\n  /**\n   * Adds files as attachments to the input.\n   * Emits 'igcAttachmentChange' event which can be canceled to prevent adding.\n   * @internal\n   */\n  public attachFilesWithEvent(files: File[]): void {\n    const newAttachments: IgcChatMessageAttachment[] = [];\n    const fileNames = new Set(\n      this.inputAttachments.map((attachment) => attachment.file?.name ?? '')\n    );\n\n    for (const file of files) {\n      if (fileNames.has(file.name)) {\n        continue;\n      }\n\n      const url = URL.createObjectURL(file);\n      const attachment: IgcChatMessageAttachment = {\n        id: nanoid(),\n        url,\n        name: file.name,\n        file,\n      };\n\n      if (isImageAttachment(file)) {\n        attachment.thumbnail = url;\n      }\n      newAttachments.push(attachment);\n    }\n\n    if (this.emitAttachmentsAdded(newAttachments)) {\n      this.inputAttachments = [...this.inputAttachments, ...newAttachments];\n    }\n  }\n\n  public handleKeyDown = (_: KeyboardEvent) => {\n    this._lastTyped = Date.now();\n    if (!this._isTyping) {\n      this.emitEvent('igcTypingChange', {\n        detail: { isTyping: true },\n      });\n      this._isTyping = true;\n\n      const stopTypingDelay = this.stopTypingDelay;\n      setTimeout(() => {\n        if (\n          this._isTyping &&\n          stopTypingDelay &&\n          this._lastTyped + stopTypingDelay < Date.now()\n        ) {\n          this.emitEvent('igcTypingChange', {\n            detail: { isTyping: false },\n          });\n          this._isTyping = false;\n        }\n      }, stopTypingDelay);\n    }\n  };\n\n  //#endregion\n}\n"]}

package/components/chat/chat.d.ts

@@ -1,6 +1,6 @@
 import { LitElement, type PropertyValues } from 'lit';
 import type { Constructor } from '../common/mixins/constructor.js';
-import type { IgcChatOptions, IgcMessage, IgcMessageAttachment } from './types.js';
+import type { IgcChatMessage, IgcChatMessageAttachment, IgcChatMessageReaction, IgcChatOptions } from './types.js';
 /**
  * Defines the custom events dispatched by the `<igc-chat>` component.
  */
@@ -8,22 +8,24 @@ export interface IgcChatComponentEventMap {
     /**
      * Dispatched when a new chat message is created (sent).
      */
-    igcMessageCreated: CustomEvent<IgcMessage>;
+    igcMessageCreated: CustomEvent<IgcChatMessage>;
     /**
      * Dispatched when a message is reacted to.
      */
-    igcMessageReact: CustomEvent<{
-        message: IgcMessage;
-        reaction: string;
-    }>;
+    igcMessageReact: CustomEvent<IgcChatMessageReaction>;
     /**
      * Dispatched when a chat message attachment is clicked.
      */
-    igcAttachmentClick: CustomEvent<IgcMessageAttachment>;
+    igcAttachmentClick: CustomEvent<IgcChatMessageAttachment>;
     /**
-     * Dispatched when an attachment is changed (e.g., updated or removed).
+     * Dispatched when attachment(s) are added either through drag & drop or through
+     * the default file input.
      */
-    igcAttachmentChange: CustomEvent<IgcMessageAttachment>;
+    igcAttachmentAdded: CustomEvent<IgcChatMessageAttachment[]>;
+    /**
+     * Dispatched when an attachment is removed by the user.
+     */
+    igcAttachmentRemoved: CustomEvent<IgcChatMessageAttachment>;
     /**
      * Dispatched during an attachment drag operation.
      */
@@ -58,7 +60,8 @@ declare const IgcChatComponent_base: Constructor<import("../common/mixins/event-
  * @fires igcMessageCreated - Dispatched when a new chat message is created (sent).
  * @fires igcMessageReact - Dispatched when a message is reacted to.
  * @fires igcAttachmentClick - Dispatched when a chat message attachment is clicked.
- * @fires igcAttachmentChange - Dispatched when a message attachment is changed (e.g., updated or removed).
+ * @fires igcAttachmentAdded - Dispatched when attachment(s) are added either through drag & drop or through the default file input.
+ * @fires igcAttachmentRemoved - Dispatched when an attachment is removed by the user.
  * @fires igcAttachmentDrag - Dispatched during an attachment drag operation.
  * @fires igcAttachmentDrop - Dispatched when an attachment is dropped (e.g., in a drag-and-drop operation).
  * @fires igcTypingChange - Dispatched when the typing status changes (e.g., user starts or stops typing).
@@ -75,39 +78,85 @@ declare const IgcChatComponent_base: Constructor<import("../common/mixins/event-
  * @slot suggestion - Slot for rendering a single suggestion item.
  * @slot empty-state - Slot shown when there are no messages.
  *
- * @csspart header - Styles the header container.
- * @csspart prefix - Styles the element before the title (e.g., avatar).
+ * @csspart chat-container - Styles the main chat container.
+ * @csspart header - Styles the chat header container.
+ * @csspart prefix - Styles the element before the chat title (e.g., avatar).
  * @csspart title - Styles the chat header title.
- * @csspart suggestions - Styles the suggestion container.
+ *
+ * @csspart message-area-container - Styles the container holding the messages and (optional) suggestions.
+ * @csspart message-list - Styles the message list container.
+ * @csspart message-item - Styles each message wrapper.
+ * @csspart typing-indicator - Styles the typing indicator container.
+ * @csspart typing-dot - Styles individual typing indicator dots.
+ *
+ * @csspart suggestions-container - Styles the container holding all suggestions.
+ * @csspart suggestions-header - Styles the suggestions header.
  * @csspart suggestion - Styles each suggestion item.
+ * @csspart suggestion-prefix - Styles the icon or prefix in a suggestion.
+ * @csspart suggestion-title - Styles the text/title of a suggestion.
+ *
+ * @csspart empty-state - Styles the empty state container when there are no messages.
+ *
+ * @csspart input-area-container - Styles the wrapper around the chat input area.
+ * @csspart input-container - Styles the main input container.
+ * @csspart input-attachments-container - Styles the container for attachments in the input.
+ * @csspart input-attachment-container - Styles a single attachment in the input area.
+ * @csspart input-attachment-name - Styles the file name of an attachment.
+ * @csspart input-attachment-icon - Styles the icon of an attachment.
+ * @csspart text-input - Styles the text input field for typing messages.
+ * @csspart input-actions-container - Styles the container for input actions.
+ * @csspart input-actions-start - Styles the group of actions at the start of the input after the default file upload.
+ * @csspart input-actions-end - Styles the group of actions at the end of the input.
+ * @csspart file-upload-container - Styles the container for the file upload input.
+ * @csspart file-upload - Styles the file upload input itself.
+ * @csspart send-button-container - Styles the container around the send button.
+ * @csspart send-button - Styles the send button.
+ *
+ * @csspart message-container - Styles the container of a single message.
+ * @csspart message-list (forwarded) - Styles the internal list of messages.
+ * @csspart message-header - Styles the header of a message (e.g., sender, timestamp).
+ * @csspart message-content - Styles the text content of a message.
+ * @csspart message-attachments-container - Styles the container for message attachments.
+ * @csspart message-attachment - Styles a single message attachment.
+ * @csspart message-actions-container - Styles the container holding message actions.
+ * @csspart message-sent - Styles messages marked as sent by the current user.
+ * @csspart attachment-header - Styles the header of an attachment block.
+ * @csspart attachment-content - Styles the content of an attachment block.
+ * @csspart attachment-icon - Styles the icon of an attachment.
+ * @csspart file-name - Styles the file name shown in an attachment.
  */
 export default class IgcChatComponent extends IgcChatComponent_base {
     static readonly tagName = "igc-chat";
     static styles: import("lit").CSSResult[];
     static register(): void;
     private readonly _state;
+    private readonly _defaults;
     private readonly _slots;
     private readonly _context;
     private readonly _userInputContext;
+    private readonly _input?;
+    private readonly _typingIndicator?;
+    private readonly _suggestionsContainer?;
+    private readonly _scrollContainer;
     private _updateContext;
     private _updateUserInputContext;
     /**
      * The list of chat messages currently displayed.
      * Use this property to set or update the message history.
      */
-    set messages(value: IgcMessage[]);
-    get messages(): IgcMessage[];
+    set messages(value: IgcChatMessage[]);
+    get messages(): IgcChatMessage[];
     /**
      * The chat message currently being composed but not yet sent.
      * Includes the draft text and any attachments.
      */
     set draftMessage(value: {
         text: string;
-        attachments?: IgcMessageAttachment[];
+        attachments?: IgcChatMessageAttachment[];
     });
     get draftMessage(): {
         text: string;
-        attachments?: IgcMessageAttachment[];
+        attachments?: IgcChatMessageAttachment[];
     };
     /**
      * Controls the chat behavior and appearance through a configuration object.
@@ -120,17 +169,12 @@ export default class IgcChatComponent extends IgcChatComponent_base {
      */
     resourceStrings: import("../common/i18n/chat.resources.js").IgcChatResourceStrings;
     constructor();
-    protected contextChanged(): void;
+    private _getRenderer;
+    private _handleSuggestionClick;
     /**
      * Scrolls the view to a specific message by id.
-     * @param messageId - The id of the message to scroll to
      */
     scrollToMessage(messageId: string): void;
-    /**
-     * Updates the context value to notify all consumers that the chat state has changed.
-     * This ensures that components consuming the chat context will re-render.
-     */
-    updateContextValue(): void;
     protected updated(properties: PropertyValues<this>): void;
     private _scrollToBottom;
     private _renderHeader;