@rt-tools/ui-kit-v2 0.16.0 → 0.18.0

package/fesm2022/rt-tools-ui-kit-v2-rich-editor.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { viewChild, signal, computed, input, output, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Component, inject, booleanAttribute, numberAttribute, model, effect, TemplateRef, Directive, Pipe, contentChild, afterRenderEffect } from '@angular/core';
+import { viewChild, signal, computed, input, output, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Component, inject, booleanAttribute, numberAttribute, model, effect, TemplateRef, Directive, Pipe, DestroyRef, contentChild, afterRenderEffect } from '@angular/core';
 import { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';
 import { RtFormControlBase, coerceQuillDeltaOutput, rtKitLabel, RT_KIT_LABELS, RtFileCardComponent, RtIconButtonComponent, RT_KIT_LOCALE, RtButtonDirective, RtConfirmDirective, RtDeltaViewComponent, RtFileDropComponent, RtIconComponent, RtMenuComponent, RtNoteComponent, RtSkeletonWrapperComponent, RtSpinnerComponent, RtToolbarComponent, RtToolbarLeftDirective, RtToolbarRightDirective, fileNameFromUrl } from '@rt-tools/ui-kit-v2';
 import { CdkTextareaAutosize } from '@angular/cdk/text-field';
@@ -393,7 +393,7 @@ class RtMessageComposerComponent {
                 // cdk
                 CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: 
                 // standalone components / directives
-                RtFileCardComponent, selector: "rt-file-card", inputs: ["name", "sizeBytes", "size", "showDownload", "showRemove", "showRename", "disabled"], outputs: ["download", "removed", "rename"] }, { kind: "component", type: RtIconButtonComponent, selector: "rt-icon-button", inputs: ["icon", "ariaLabel", "variant", "iconColor", "iconFill", "size", "iconSize", "type", "tooltip", "tabIndex", "loading", "disabled", "active", "indicator"], outputs: ["clicked"] }, { kind: "component", type: RtRichEditorComponent, selector: "rt-rich-editor", inputs: ["placeholder", "toolbar"], outputs: ["enterPressed"] }, { kind: "directive", type: BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }, { kind: "directive", type: ModDirective, selector: "[rtMod]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+                RtFileCardComponent, selector: "rt-file-card", inputs: ["name", "sizeBytes", "size", "showDownload", "showRemove", "showRename", "disabled"], outputs: ["download", "removed", "rename"] }, { kind: "component", type: RtIconButtonComponent, selector: "rt-icon-button", inputs: ["icon", "glyph", "ariaLabel", "variant", "iconColor", "iconFill", "size", "iconSize", "type", "tooltip", "tabIndex", "loading", "disabled", "active", "indicator"], outputs: ["clicked"] }, { kind: "component", type: RtRichEditorComponent, selector: "rt-rich-editor", inputs: ["placeholder", "toolbar"], outputs: ["enterPressed"] }, { kind: "directive", type: BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }, { kind: "directive", type: ModDirective, selector: "[rtMod]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtMessageComposerComponent, decorators: [{
             type: Component,
@@ -572,33 +572,84 @@ function nextAtBottom(previous, lastScrollTop, metrics) {
     return metrics.scrollTop < lastScrollTop - 1 ? nearBottom : previous || nearBottom;
 }
 
+/** Пауза без ввода, после которой отрезок набора считается законченным. */
+const RT_CHAT_TYPING_PAUSE_MS = 3000;
+/**
+ * Текст поля ответа из узла, где случился ввод. Поле обычного режима — textarea, поле с
+ * оформлением — редактируемый узел; всё прочее, например выбор файла, набором не считается и
+ * даёт `null`.
+ */
+function typingDraft(target) {
+    if (target instanceof HTMLTextAreaElement) {
+        return target.value;
+    }
+    const editor = target instanceof HTMLElement ? target.closest('[contenteditable="true"]') : null;
+    return editor === null ? null : (editor.textContent ?? '');
+}
+/**
+ * Отрезок набора: одно «начал» и одно «перестал» на отрезок, а не событие на каждую клавишу.
+ * Отрезок кончается пустым полем, отправкой или паузой без ввода. Создаётся в контексте
+ * внедрения: таймер паузы снимается вместе с компонентом, и выход уничтоженного компонента не
+ * зовётся.
+ */
+class RtChatTypingTracker {
+    #typing = false;
+    #timer = null;
+    #notify;
+    #pauseMs;
+    constructor(notify, pauseMs = RT_CHAT_TYPING_PAUSE_MS) {
+        this.#notify = notify;
+        this.#pauseMs = pauseMs;
+        inject(DestroyRef).onDestroy(() => this.#clearTimer());
+    }
+    /** Ввод в поле ответа с его текущим текстом: пустой текст кончает отрезок. */
+    input(draft) {
+        if (draft.trim().length === 0) {
+            this.stop();
+            return;
+        }
+        if (!this.#typing) {
+            this.#typing = true;
+            this.#notify(true);
+        }
+        this.#clearTimer();
+        this.#timer = setTimeout(() => this.stop(), this.#pauseMs);
+    }
+    /** Конец отрезка; отрезок, который уже кончился, ничего не шлёт. */
+    stop() {
+        this.#clearTimer();
+        if (this.#typing) {
+            this.#typing = false;
+            this.#notify(false);
+        }
+    }
+    #clearTimer() {
+        if (this.#timer !== null) {
+            clearTimeout(this.#timer);
+            this.#timer = null;
+        }
+    }
+}
+
 const BEM_BLOCK = 'rt-chat';
 /** Ключ заглушки имени вложения, когда домен не отдал `fileName` (только URL). */
 const ATTACHMENT_FALLBACK_KEY = 'chatAttachmentFallback';
 /**
- * Общий презентационный чат: тред сообщений + композер. Никакого data-access/api — история
- * приходит готовым массивом `IRtChat.Message[]`, отправка/обновление/скачивание уходят наружу
- * через outputs, а стор и blob-загрузка остаются в feature-компоненте каждого домена.
- *
- * Композер держит свой `FormGroup` — наружу торчит только `send`. Полноэкранный
- * режим (expand) — overlay внутри самого компонента (`--expanded`), потребителю
- * лишь опционально сообщается через `expandedChange`.
- *
- * Шапка (тулбар «Чат» + refresh/expand) рендерится только когда включена хотя бы
- * одна из иконок (`showRefresh`/`showExpand`): в диалогах своя header-обёртка,
- * туда тулбар не нужен.
+ * Общий презентационный чат: тред сообщений + композер. История приходит готовым массивом
+ * `IRtChat.Message[]`, отправка, обновление, скачивание и набор текста уходят наружу выходами;
+ * стор и blob-загрузка остаются у потребителя. Композер держит свой `FormGroup`. Полноэкранный
+ * режим — overlay внутри компонента (`--expanded`). Шапка рисуется, только когда включена хотя бы
+ * одна из иконок `showRefresh`/`showExpand`: в диалогах своя header-обёртка.
  */
 class RtChatComponent {
-    /**
-     * Пользователь у нижнего края треда. Плоское поле (не сигнал), чтобы
-     * afterRenderEffect не перезапускался на каждый scroll — обновляется в
-     * обработчике scroll и читается при автоскролле.
-     */
+    /** Читатель у нижнего края. Плоское поле, не сигнал: afterRenderEffect не перезапускается на scroll. */
     #atBottom;
     /** Прошлый scrollTop треда — для различения прокрутки вверх и роста контента. */
     #lastScrollTop;
     /** One-shot: своё отправленное сообщение всегда прокручивает тред вниз. */
     #forceScroll;
+    /** Отрезок набора в поле ответа: наружу уходит одно «начал» и одно «перестал» на отрезок. */
+    #typingTracker;
     /** Текущее значение композера — источник реактивности для `canSend`. */
     #formValue;
     #defaultTitle;
@@ -606,25 +657,20 @@ class RtChatComponent {
     #defaultEmptyHint;
     constructor() {
         /**
-         * Дата сообщения форматируется по активной локали приложения, а не по
-         * `LOCALE_ID`: тот вычисляется на подъёме приложения и там, где язык
-         * переключают на ходу, оставил бы часы в прежнем формате до перезагрузки.
-         *
-         * Данные локали для `DatePipe` регистрирует приложение: без них пайп падает
-         * `Missing locale data`, и кит за это не отвечает.
+         * Дата форматируется по активной локали приложения, а не по `LOCALE_ID`: тот вычисляется на
+         * подъёме и при смене языка на ходу оставил бы прежний формат. Данные локали для `DatePipe`
+         * регистрирует приложение: без них пайп падает `Missing locale data`.
          */
         this.t = inject(RT_KIT_LABELS);
         this.locale = inject(RT_KIT_LOCALE);
-        /**
-         * Пользователь у нижнего края треда. Плоское поле (не сигнал), чтобы
-         * afterRenderEffect не перезапускался на каждый scroll — обновляется в
-         * обработчике scroll и читается при автоскролле.
-         */
+        /** Читатель у нижнего края. Плоское поле, не сигнал: afterRenderEffect не перезапускается на scroll. */
         this.#atBottom = true;
         /** Прошлый scrollTop треда — для различения прокрутки вверх и роста контента. */
         this.#lastScrollTop = 0;
         /** One-shot: своё отправленное сообщение всегда прокручивает тред вниз. */
         this.#forceScroll = false;
+        /** Отрезок набора в поле ответа: наружу уходит одно «начал» и одно «перестал» на отрезок. */
+        this.#typingTracker = new RtChatTypingTracker((typing) => this.typing.emit(typing));
         /**
          * Скролл-контейнер треда — для автопрокрутки к последнему сообщению.
          * `viewChild` не работает на ES-private (`#`) поле, поэтому `protected`.
@@ -763,11 +809,15 @@ class RtChatComponent {
         this.send = output();
         /** Клик refresh — consumer перетягивает тред. */
         this.refresh = output();
-        /** Клик по вложению — consumer качает blob своим api. Шаблон зовёт выход прямо: релей-метод,
-         * который только повторял `emit`, ничего не добавлял, а файл при этом рос. */
+        /** Клик по вложению — consumer качает blob своим api; шаблон зовёт выход прямо, без релея. */
         this.downloadFile = output();
         /** Клик по карточке вложения из `attachments[]` — консюмер качает по `publicId`. */
         this.downloadAttachment = output();
+        /** Набор текста в поле ответа: `true` — отрезок начался, `false` — кончился. */
+        this.typing = output();
+        /** Строка о том, что печатает вторая сторона, поверх низа ленты; пустая прячет плашку. */
+        this.typingText = input('', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "typingText" }] : /* istanbul ignore next */ []));
         /** Смена fullscreen-состояния. */
         this.expandedChange = output();
         this.deleteMessage = output();
@@ -784,12 +834,8 @@ class RtChatComponent {
         this.#formValue = toSignal(this.replyForm.valueChanges, {
             initialValue: this.replyForm.value,
         });
-        // Поведение мессенджера: после каждого рендера, зависящего от треда
-        // (новые сообщения, окончание загрузки, fullscreen), прокручиваем к
-        // последнему сообщению — но только если это своё сообщение (forceScroll)
-        // или пользователь уже у нижнего края. Если он ушёл вверх читать историю,
-        // входящее сообщение его не дёргает. afterRenderEffect гарантирует, что DOM
-        // уже обновлён и scrollHeight посчитан по реальной высоте.
+        // После рендера, зависящего от треда, лента прокручивается к последнему сообщению — если оно
+        // своё (forceScroll) или читатель у нижнего края; ушедшего читать историю входящее не дёргает.
         afterRenderEffect(() => {
             this.messages();
             this.loading();
@@ -829,6 +875,7 @@ class RtChatComponent {
         const files = this.replyForm.controls.files.value;
         // Своё сообщение всегда прокручивает тред вниз — независимо от позиции.
         this.#forceScroll = true;
+        this.#typingTracker.stop();
         this.send.emit({ text, files: this.attachments() ? files : undefined });
         this.replyForm.reset({ message: '', files: [] });
     }
@@ -842,12 +889,20 @@ class RtChatComponent {
     onComposerSubmit(payload) {
         // Своё сообщение всегда прокручивает тред вниз — независимо от позиции.
         this.#forceScroll = true;
+        this.#typingTracker.stop();
         this.send.emit({
             text: payload.text,
             files: this.attachments() ? payload.files : undefined,
             delta: payload.delta,
         });
     }
+    /** Ввод в поле ответа любого из двух режимов; выбор файла набором не считается. */
+    onReplyInput(event) {
+        const draft = typingDraft(event.target);
+        if (draft !== null) {
+            this.#typingTracker.input(draft);
+        }
+    }
     /**
      * Файлы выброшены в обёртку чата: в rich-режиме отдаём массив композеру через
      * input, в классическом — добавляем к уже выбранным в собственном `replyForm`.
@@ -908,11 +963,11 @@ class RtChatComponent {
         this.expandedChange.emit(next);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: RtChatComponent, isStandalone: true, selector: "rt-chat", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, fetching: { classPropertyName: "fetching", publicName: "fetching", isSignal: true, isRequired: false, transformFunction: null }, canReply: { classPropertyName: "canReply", publicName: "canReply", isSignal: true, isRequired: false, transformFunction: null }, replyBlockReason: { classPropertyName: "replyBlockReason", publicName: "replyBlockReason", isSignal: true, isRequired: false, transformFunction: null }, sending: { classPropertyName: "sending", publicName: "sending", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, emptyHint: { classPropertyName: "emptyHint", publicName: "emptyHint", isSignal: true, isRequired: false, transformFunction: null }, hasThread: { classPropertyName: "hasThread", publicName: "hasThread", isSignal: true, isRequired: false, transformFunction: null }, attachments: { classPropertyName: "attachments", publicName: "attachments", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, richComposer: { classPropertyName: "richComposer", publicName: "richComposer", isSignal: true, isRequired: false, transformFunction: null }, formatting: { classPropertyName: "formatting", publicName: "formatting", isSignal: true, isRequired: false, transformFunction: null }, formattingToolbar: { classPropertyName: "formattingToolbar", publicName: "formattingToolbar", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, showRefresh: { classPropertyName: "showRefresh", publicName: "showRefresh", isSignal: true, isRequired: false, transformFunction: null }, showExpand: { classPropertyName: "showExpand", publicName: "showExpand", isSignal: true, isRequired: false, transformFunction: null }, messageHasActions: { classPropertyName: "messageHasActions", publicName: "messageHasActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { send: "send", refresh: "refresh", downloadFile: "downloadFile", downloadAttachment: "downloadAttachment", expandedChange: "expandedChange", deleteMessage: "deleteMessage", retryMessage: "retryMessage" }, host: { properties: { "class.rt-chat--expanded": "expanded()", "class.rt-chat--fill": "fill()" }, classAttribute: "rt-chat" }, queries: [{ propertyName: "messageActions", first: true, predicate: RtChatMessageActionsDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "thread", first: true, predicate: ["thread"], descendants: true, isSignal: true }, { propertyName: "composerFileEl", first: true, predicate: ["composerFileEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container rtBlock=\"rt-chat\">\n    <rt-file-drop\n        [overlayLabel]=\"t().chatDropOverlay\"\n        [accept]=\"accept()\"\n        [disabled]=\"dropDisabled()\"\n        (filesDropped)=\"onFilesDropped($event)\">\n        @if (showHeader()) {\n            <rt-toolbar rtElem=\"header\" dense>\n                <ng-template rtToolbarLeft>\n                    <h3 rtElem=\"title\" qa-dataid=\"chat-title\">{{ title() }}</h3>\n                </ng-template>\n                <ng-template rtToolbarRight>\n                    @if (showRefresh()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-refresh\"\n                            icon=\"sync\"\n                            variant=\"ghost\"\n                            [ariaLabel]=\"t().chatRefreshAria\"\n                            [tooltip]=\"t().chatRefreshTooltip\"\n                            [loading]=\"fetching()\"\n                            [disabled]=\"!hasThread()\"\n                            (clicked)=\"refresh.emit()\" />\n                    }\n                    @if (showExpand()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-expand\"\n                            variant=\"ghost\"\n                            [icon]=\"expanded() ? 'window-minimize' : 'window-maximize'\"\n                            [ariaLabel]=\"expandLabel()\"\n                            [tooltip]=\"expandLabel()\"\n                            (clicked)=\"toggleExpand()\" />\n                    }\n                    <ng-content select=\"[rtChatHeaderActions]\" />\n                </ng-template>\n            </rt-toolbar>\n        }\n\n        @if (!hasThread()) {\n            <rt-note qa-dataid=\"chat-empty-hint\">{{ emptyHint() }}</rt-note>\n        } @else {\n            <div rtElem=\"thread-viewport\" qa-dataid=\"chat-thread-viewport\">\n                @if (loading()) {\n                    <!-- \u0421\u043A\u0435\u043B\u0435\u0442\u043E\u043D \u043F\u043E\u0432\u0442\u043E\u0440\u044F\u0435\u0442 \u0441\u0442\u0440\u0443\u043A\u0442\u0443\u0440\u0443 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u044F (\u0430\u0432\u0442\u043E\u0440 \u2192 \u0442\u0435\u043A\u0441\u0442 \u2192 \u0434\u0430\u0442\u0430),\n                 \u0447\u0435\u0440\u0435\u0434\u0443\u044F \u0432\u044B\u0440\u0430\u0432\u043D\u0438\u0432\u0430\u043D\u0438\u0435, \u0447\u0442\u043E\u0431\u044B \u0442\u0440\u0435\u0434 \u043D\u0435 \u00AB\u043F\u0440\u044B\u0433\u0430\u043B\u00BB \u043F\u0440\u0438 \u043F\u043E\u0434\u043C\u0435\u043D\u0435 \u043D\u0430 \u0440\u0435\u0430\u043B\u044C\u043D\u044B\u0435. -->\n                    <div rtElem=\"thread\" qa-dataid=\"chat-thread-skeleton\">\n                        @for (row of skeletonRows; track row; let even = $even) {\n                            <div rtElem=\"message-skeleton\" qa-dataid=\"chat-message-skeleton\" [rtMod]=\"{ own: even }\">\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"72px\" height=\"10px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"100%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"55%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"56px\" height=\"10px\" [isLoading]=\"true\" />\n                            </div>\n                        }\n                    </div>\n                } @else {\n                    <div\n                        #thread\n                        rtElem=\"thread\"\n                        qa-dataid=\"chat-thread\"\n                        [rtMod]=\"{ frozen: fetching() }\"\n                        [attr.aria-busy]=\"fetching() ? 'true' : null\"\n                        (scroll)=\"onThreadScroll()\">\n                        @for (m of messages(); track m.id) {\n                            <div\n                                rtElem=\"message-row\"\n                                qa-dataid=\"chat-message\"\n                                [attr.data-own]=\"m.own\"\n                                [attr.data-status]=\"m.status || null\"\n                                [attr.data-deleted]=\"m.deleted || null\"\n                                [rtMod]=\"{ own: m.own }\">\n                                @if (m.canDelete && !m.deleted) {\n                                    @if (m.deleteConfirm) {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            [rtConfirm]=\"m.deleteConfirm\"\n                                            (confirmed)=\"deleteMessage.emit(m)\" />\n                                    } @else {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            (clicked)=\"deleteMessage.emit(m)\" />\n                                    }\n                                }\n                                @if (messageActions()?.template; as actionsTpl) {\n                                    @if (m | rtChatMessageHasActions: messageHasActions()) {\n                                        <div rtElem=\"message-actions\" qa-dataid=\"chat-message-actions\">\n                                            <rt-menu>\n                                                <ng-container\n                                                    [ngTemplateOutlet]=\"actionsTpl\"\n                                                    [ngTemplateOutletContext]=\"{ $implicit: m }\" />\n                                            </rt-menu>\n                                        </div>\n                                    }\n                                }\n                                <div rtElem=\"message\" [rtMod]=\"{ own: m.own, deleted: m.deleted }\">\n                                    <p rtElem=\"message-author\" qa-dataid=\"chat-message-author\">{{ m.author }}</p>\n                                    @if (m.deleted) {\n                                        <p rtElem=\"message-text\" qa-dataid=\"chat-message-deleted\" rtMod=\"deleted\">\n                                            {{ t().chatMessageDeleted }}\n                                        </p>\n                                    } @else {\n                                        @if (m.delta) {\n                                            <rt-delta-view rtElem=\"message-text\" qa-dataid=\"chat-message-text\" [delta]=\"m.delta\" />\n                                        } @else {\n                                            <p rtElem=\"message-text\" qa-dataid=\"chat-message-text\">{{ m.text }}</p>\n                                        }\n                                        @if (m.attachments?.length) {\n                                            @for (att of m.attachments; track att.id) {\n                                                <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                    <rt-file-card\n                                                        showDownload\n                                                        size=\"sm\"\n                                                        [name]=\"att.name || attachmentFallbackName()\"\n                                                        (download)=\"downloadAttachment.emit(att)\" />\n                                                </span>\n                                            }\n                                        } @else if (m.fileUrl) {\n                                            <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                <rt-file-card\n                                                    showDownload\n                                                    size=\"sm\"\n                                                    [name]=\"m.fileName || attachmentFallbackName()\"\n                                                    (download)=\"downloadFile.emit(m)\" />\n                                            </span>\n                                        }\n                                        @if (m.deepLink) {\n                                            <span rtElem=\"message-deeplink\">\n                                                <a\n                                                    rtButton\n                                                    qa-dataid=\"chat-message-deeplink\"\n                                                    appearance=\"outlined\"\n                                                    icon=\"send\"\n                                                    rel=\"noopener\"\n                                                    target=\"_blank\"\n                                                    [href]=\"m.deepLink\"\n                                                    [label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"\n                                                    [attr.aria-label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"></a>\n                                            </span>\n                                        }\n                                    }\n                                    <span rtElem=\"message-footer\">\n                                        <span rtElem=\"message-date\" qa-dataid=\"chat-message-date\">\n                                            {{ m.createdAt | date: 'short' : undefined : locale() }}\n                                        </span>\n                                        @if (m.status) {\n                                            <span\n                                                rtElem=\"message-status\"\n                                                qa-dataid=\"chat-message-status\"\n                                                [attr.data-status]=\"m.status\"\n                                                [rtMod]=\"{ status: m.status }\"\n                                                [attr.aria-label]=\"m.status | rtChatStatusLabel\">\n                                                @if (m.status === MessageStatus.Failed) {\n                                                    <rt-icon rtElem=\"status-icon\" name=\"exclamation-circle\" size=\"sm\" />\n                                                    <rt-icon-button\n                                                        qa-dataid=\"chat-message-retry\"\n                                                        icon=\"sync\"\n                                                        variant=\"ghost\"\n                                                        [ariaLabel]=\"t().chatRetryAria\"\n                                                        [tooltip]=\"t().chatRetryTooltip\"\n                                                        (clicked)=\"retryMessage.emit(m)\" />\n                                                } @else {\n                                                    <!-- \u0427\u0430\u0441\u044B, \u043F\u043E\u043A\u0430 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u0432 \u043F\u0443\u0442\u0438; \u0434\u0430\u043B\u044C\u0448\u0435 \u0434\u0432\u043E\u0439\u043D\u043E\u0439 \u0447\u0435\u043A, \u0446\u0432\u0435\u0442 \u043A\u043E\u0442\u043E\u0440\u043E\u0433\u043E\n                                                         (\u0441\u0435\u0440\u044B\u0439/\u0441\u0438\u043D\u0438\u0439) \u0440\u0430\u0437\u043B\u0438\u0447\u0430\u0435\u0442 \u0434\u043E\u0441\u0442\u0430\u0432\u043B\u0435\u043D\u043E \u0438 \u043F\u0440\u043E\u0447\u0438\u0442\u0430\u043D\u043E. -->\n                                                    <rt-icon\n                                                        rtElem=\"status-icon\"\n                                                        size=\"sm\"\n                                                        [name]=\"m.status === MessageStatus.Sending ? 'clock' : 'check-double'\" />\n                                                }\n                                            </span>\n                                        }\n                                    </span>\n                                </div>\n                            </div>\n                        } @empty {\n                            <rt-note qa-dataid=\"chat-empty-thread\">{{ t().chatEmptyThread }}</rt-note>\n                        }\n                    </div>\n                }\n                @if (!loading() && fetching()) {\n                    <div rtElem=\"thread-overlay\" qa-dataid=\"chat-thread-overlay\" role=\"status\" [attr.aria-label]=\"t().chatRefreshAria\">\n                        <rt-spinner diameter=\"32\" />\n                    </div>\n                }\n            </div>\n\n            @if (canReply()) {\n                @if (richComposer()) {\n                    <rt-message-composer\n                        rtElem=\"composer-rich\"\n                        qa-dataid=\"chat-composer-rich\"\n                        [placeholder]=\"placeholder()\"\n                        [accept]=\"accept()\"\n                        [attachments]=\"attachments()\"\n                        [formatting]=\"formatting()\"\n                        [toolbar]=\"formattingToolbar()\"\n                        [sending]=\"sending()\"\n                        [disabled]=\"loading() || fetching()\"\n                        [droppedFiles]=\"droppedFiles()\"\n                        (submitted)=\"onComposerSubmit($event)\" />\n                } @else {\n                    <form rtElem=\"composer\" qa-dataid=\"chat-composer\" [formGroup]=\"replyForm\" (ngSubmit)=\"onSubmit()\">\n                        @if (attachments() && selectedFiles().length > 0) {\n                            <div rtElem=\"composer-files\" qa-dataid=\"chat-composer-files\">\n                                @for (file of selectedFiles(); track $index) {\n                                    <rt-file-card\n                                        showRemove\n                                        qa-dataid=\"chat-composer-file\"\n                                        size=\"sm\"\n                                        [name]=\"file.name\"\n                                        [sizeBytes]=\"file.size\"\n                                        [disabled]=\"composerDisabled()\"\n                                        (removed)=\"removeFile($index)\" />\n                                }\n                            </div>\n                        }\n                        <div rtElem=\"composer-field\" [rtMod]=\"{ attach: attachments() }\">\n                            @if (attachments()) {\n                                <input\n                                    #composerFileEl\n                                    qa-dataid=\"chat-composer-file-input\"\n                                    type=\"file\"\n                                    hidden\n                                    multiple\n                                    [attr.accept]=\"accept() || null\"\n                                    (change)=\"onFilesPicked($event)\" />\n                                <rt-icon-button\n                                    qa-dataid=\"chat-composer-attach\"\n                                    icon=\"paperclip\"\n                                    variant=\"ghost\"\n                                    [ariaLabel]=\"t().chatAttachAria\"\n                                    [tooltip]=\"t().chatAttachTooltip\"\n                                    [disabled]=\"composerDisabled()\"\n                                    (clicked)=\"openFilePicker()\" />\n                            }\n                            <textarea\n                                rtElem=\"composer-input\"\n                                qa-dataid=\"chat-composer-input\"\n                                cdkTextareaAutosize\n                                formControlName=\"message\"\n                                cdkAutosizeMinRows=\"1\"\n                                cdkAutosizeMaxRows=\"4\"\n                                [attr.aria-label]=\"t().chatComposerAria\"\n                                [placeholder]=\"placeholder()\"\n                                (keydown)=\"onComposerKeydown($event)\"></textarea>\n                        </div>\n                        <button\n                            rtButton\n                            rtElem=\"composer-send\"\n                            qa-dataid=\"chat-composer-send\"\n                            type=\"submit\"\n                            theme=\"primary\"\n                            appearance=\"filled\"\n                            [label]=\"t().chatSendLabel\"\n                            [attr.aria-label]=\"t().chatSendAria\"\n                            [loading]=\"sending()\"\n                            [disabled]=\"!canSend()\"></button>\n                    </form>\n                }\n            } @else if (replyBlockReason()) {\n                <rt-note rtElem=\"reply-block\" qa-dataid=\"chat-reply-block\">{{ replyBlockReason() }}</rt-note>\n            }\n\n            <!-- \u0421\u043B\u043E\u0442 \u0434\u043E\u043C\u0435\u043D\u043D\u044B\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u043F\u043E\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043B\u044F \u043F\u043E\u0434 \u043A\u043E\u043C\u043F\u043E\u0437\u0435\u0440\u043E\u043C: \u0432 fullscreen\n                 \u043F\u043E\u043F\u0430\u0434\u0430\u0435\u0442 \u0432\u043D\u0443\u0442\u0440\u044C overlay, \u043F\u043E\u044D\u0442\u043E\u043C\u0443 \u043A\u043D\u043E\u043F\u043A\u0438 \u043E\u0441\u0442\u0430\u044E\u0442\u0441\u044F \u0432\u0438\u0434\u043D\u044B. -->\n            <div rtElem=\"footer-slot\" qa-dataid=\"chat-footer\" [rtMod]=\"{ blocked: fetching() }\" [attr.inert]=\"fetching() ? '' : null\">\n                <ng-content select=\"[rtChatFooter]\" />\n            </div>\n        }\n    </rt-file-drop>\n</ng-container>\n", styles: ["@layer rt-kit.components{.rt-chat{--rt-chat-bubble-radius: var(--rt-radius-lg);--rt-chat-message-border-width: var(--rt-border-width-thin);--rt-chat-transition-duration: var(--rt-duration-fast);display:flex;flex-direction:column}.rt-chat>.rt-file-drop{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0}.rt-chat--expanded{position:fixed;z-index:var(--rt-z-modal);box-sizing:border-box;padding:var(--rt-space-md);background:var(--rt-color-bg-surface);inset:0}.rt-chat--expanded>.rt-file-drop{block-size:100%}@media(width>=1441px){.rt-chat--expanded>.rt-file-drop{inline-size:1000px;margin-inline:auto;max-inline-size:100%}}.rt-chat--expanded .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--expanded .rt-chat__thread{max-height:none}.rt-chat--fill{block-size:100%}.rt-chat--fill .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--fill .rt-chat__thread{max-height:none}.rt-chat__title{margin:0;color:var(--rt-color-text-primary);font-family:var(--rt-font-family-sans);font-size:var(--rt-text-md);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__thread-viewport{position:relative;display:flex;flex-direction:column;contain:inline-size;min-block-size:0}.rt-chat__thread{display:flex;max-height:280px;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0;overflow-y:auto}.rt-chat__thread--frozen{overflow-y:hidden}.rt-chat__thread-overlay{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--rt-color-bg-surface) 60%,transparent);inset:0}.rt-chat__footer-slot{display:flex;flex-direction:column}.rt-chat__footer-slot:empty{display:none}.rt-chat__footer-slot--blocked{opacity:.6;pointer-events:none}.rt-chat__message-row{display:flex;max-width:min(80%,480px);align-items:center;align-self:flex-start;gap:var(--rt-space-2)}.rt-chat__message-row--own{align-self:flex-end}.rt-chat__message-row:hover .rt-chat__message-delete,.rt-chat__message-row:focus-within .rt-chat__message-delete,.rt-chat__message-row:hover .rt-chat__message-actions,.rt-chat__message-row:focus-within .rt-chat__message-actions{opacity:1;pointer-events:auto}.rt-chat__message{display:flex;min-width:0;flex:0 1 auto;flex-direction:column;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-2)}.rt-chat__message--own{border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__message--deleted{border:var(--rt-chat-message-border-width) dashed var(--rt-color-border-default);background:transparent}.rt-chat__message-author{margin:0;color:var(--rt-chat-bubble-in-author);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__message--own .rt-chat__message-author{color:var(--rt-chat-bubble-own-author)}.rt-chat__message-text{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-xs);font-weight:var(--rt-font-weight-regular);line-height:var(--rt-leading-snug);white-space:pre-wrap}.rt-chat__message-text--deleted{color:var(--rt-color-text-muted);font-style:italic}.rt-chat__message-delete,.rt-chat__message-actions{flex:0 0 auto;opacity:0;pointer-events:none;transition:opacity var(--rt-chat-transition-duration) ease}.rt-chat__message-attachment{display:block}.rt-chat__message-footer{display:flex;align-items:center;gap:var(--rt-space-1)}.rt-chat__message-date{color:var(--rt-chat-bubble-date);font-size:var(--rt-text-xs);line-height:var(--rt-leading-none)}.rt-chat__message-status{display:inline-flex;align-items:center;color:var(--rt-color-text-muted);gap:var(--rt-space-0-5)}.rt-chat__message-status--status--read{color:var(--rt-chat-status-read)}.rt-chat__message-status--status--failed{color:var(--rt-color-state-danger)}.rt-chat__status-icon{font-size:var(--rt-text-sm)}.rt-chat__message-skeleton{display:flex;max-width:min(80%,480px);flex-direction:column;align-self:flex-start;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-1)}.rt-chat__message-skeleton--own{align-self:flex-end;border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__skeleton-line{display:block}.rt-chat__message-deeplink{display:flex;justify-content:flex-start;margin-top:var(--rt-space-1)}.rt-chat__composer,.rt-chat__composer-rich,.rt-chat__reply-block{margin-top:var(--rt-space-4)}.rt-chat__composer{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-chat__composer-files{display:flex;flex-wrap:wrap;gap:var(--rt-space-2)}.rt-chat__composer-field{display:flex;box-sizing:border-box;align-items:center;border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-input-radius);background-color:var(--rt-input-color-bg);gap:var(--rt-space-1);min-block-size:var(--rt-input-height);padding-inline:var(--rt-input-padding-x);transition:var(--rt-input-transition)}.rt-chat__composer-field:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow)}.rt-chat__composer-field--attach{padding-inline-start:var(--rt-space-1)}.rt-chat__composer-input{box-sizing:content-box;flex:1 1 auto;border:0;background:transparent;color:var(--rt-input-color-text);font-family:inherit;font-size:var(--rt-input-font-size);inline-size:100%;line-height:var(--rt-textarea-line-height);padding-block:var(--rt-space-2);resize:none}.rt-chat__composer-input::placeholder{color:var(--rt-input-color-text-placeholder);opacity:1}.rt-chat__composer-input:focus-visible{outline:none}.rt-chat__composer-input:disabled{cursor:not-allowed}.rt-chat__composer-send{inline-size:100%}}\n"], dependencies: [{ kind: "directive", type: 
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: RtChatComponent, isStandalone: true, selector: "rt-chat", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, fetching: { classPropertyName: "fetching", publicName: "fetching", isSignal: true, isRequired: false, transformFunction: null }, canReply: { classPropertyName: "canReply", publicName: "canReply", isSignal: true, isRequired: false, transformFunction: null }, replyBlockReason: { classPropertyName: "replyBlockReason", publicName: "replyBlockReason", isSignal: true, isRequired: false, transformFunction: null }, sending: { classPropertyName: "sending", publicName: "sending", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, emptyHint: { classPropertyName: "emptyHint", publicName: "emptyHint", isSignal: true, isRequired: false, transformFunction: null }, hasThread: { classPropertyName: "hasThread", publicName: "hasThread", isSignal: true, isRequired: false, transformFunction: null }, attachments: { classPropertyName: "attachments", publicName: "attachments", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, richComposer: { classPropertyName: "richComposer", publicName: "richComposer", isSignal: true, isRequired: false, transformFunction: null }, formatting: { classPropertyName: "formatting", publicName: "formatting", isSignal: true, isRequired: false, transformFunction: null }, formattingToolbar: { classPropertyName: "formattingToolbar", publicName: "formattingToolbar", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, showRefresh: { classPropertyName: "showRefresh", publicName: "showRefresh", isSignal: true, isRequired: false, transformFunction: null }, showExpand: { classPropertyName: "showExpand", publicName: "showExpand", isSignal: true, isRequired: false, transformFunction: null }, typingText: { classPropertyName: "typingText", publicName: "typingText", isSignal: true, isRequired: false, transformFunction: null }, messageHasActions: { classPropertyName: "messageHasActions", publicName: "messageHasActions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { send: "send", refresh: "refresh", downloadFile: "downloadFile", downloadAttachment: "downloadAttachment", typing: "typing", expandedChange: "expandedChange", deleteMessage: "deleteMessage", retryMessage: "retryMessage" }, host: { properties: { "class.rt-chat--expanded": "expanded()", "class.rt-chat--fill": "fill()" }, classAttribute: "rt-chat" }, queries: [{ propertyName: "messageActions", first: true, predicate: RtChatMessageActionsDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "thread", first: true, predicate: ["thread"], descendants: true, isSignal: true }, { propertyName: "composerFileEl", first: true, predicate: ["composerFileEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container rtBlock=\"rt-chat\">\n    <rt-file-drop\n        [overlayLabel]=\"t().chatDropOverlay\"\n        [accept]=\"accept()\"\n        [disabled]=\"dropDisabled()\"\n        (filesDropped)=\"onFilesDropped($event)\">\n        @if (showHeader()) {\n            <rt-toolbar rtElem=\"header\" dense>\n                <ng-template rtToolbarLeft>\n                    <h3 rtElem=\"title\" qa-dataid=\"chat-title\">{{ title() }}</h3>\n                </ng-template>\n                <ng-template rtToolbarRight>\n                    @if (showRefresh()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-refresh\"\n                            icon=\"sync\"\n                            variant=\"ghost\"\n                            [ariaLabel]=\"t().chatRefreshAria\"\n                            [tooltip]=\"t().chatRefreshTooltip\"\n                            [loading]=\"fetching()\"\n                            [disabled]=\"!hasThread()\"\n                            (clicked)=\"refresh.emit()\" />\n                    }\n                    @if (showExpand()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-expand\"\n                            variant=\"ghost\"\n                            [icon]=\"expanded() ? 'window-minimize' : 'window-maximize'\"\n                            [ariaLabel]=\"expandLabel()\"\n                            [tooltip]=\"expandLabel()\"\n                            (clicked)=\"toggleExpand()\" />\n                    }\n                    <ng-content select=\"[rtChatHeaderActions]\" />\n                </ng-template>\n            </rt-toolbar>\n        }\n\n        @if (!hasThread()) {\n            <rt-note qa-dataid=\"chat-empty-hint\">{{ emptyHint() }}</rt-note>\n        } @else {\n            <div rtElem=\"thread-viewport\" qa-dataid=\"chat-thread-viewport\">\n                @if (loading()) {\n                    <!-- \u0421\u043A\u0435\u043B\u0435\u0442\u043E\u043D \u043F\u043E\u0432\u0442\u043E\u0440\u044F\u0435\u0442 \u0441\u0442\u0440\u0443\u043A\u0442\u0443\u0440\u0443 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u044F (\u0430\u0432\u0442\u043E\u0440 \u2192 \u0442\u0435\u043A\u0441\u0442 \u2192 \u0434\u0430\u0442\u0430),\n                 \u0447\u0435\u0440\u0435\u0434\u0443\u044F \u0432\u044B\u0440\u0430\u0432\u043D\u0438\u0432\u0430\u043D\u0438\u0435, \u0447\u0442\u043E\u0431\u044B \u0442\u0440\u0435\u0434 \u043D\u0435 \u00AB\u043F\u0440\u044B\u0433\u0430\u043B\u00BB \u043F\u0440\u0438 \u043F\u043E\u0434\u043C\u0435\u043D\u0435 \u043D\u0430 \u0440\u0435\u0430\u043B\u044C\u043D\u044B\u0435. -->\n                    <div rtElem=\"thread\" qa-dataid=\"chat-thread-skeleton\">\n                        @for (row of skeletonRows; track row; let even = $even) {\n                            <div rtElem=\"message-skeleton\" qa-dataid=\"chat-message-skeleton\" [rtMod]=\"{ own: even }\">\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"72px\" height=\"10px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"100%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"55%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"56px\" height=\"10px\" [isLoading]=\"true\" />\n                            </div>\n                        }\n                    </div>\n                } @else {\n                    <div\n                        #thread\n                        rtElem=\"thread\"\n                        qa-dataid=\"chat-thread\"\n                        [rtMod]=\"{ frozen: fetching() }\"\n                        [attr.aria-busy]=\"fetching() ? 'true' : null\"\n                        (scroll)=\"onThreadScroll()\">\n                        @for (m of messages(); track m.id) {\n                            <div\n                                rtElem=\"message-row\"\n                                qa-dataid=\"chat-message\"\n                                [attr.data-own]=\"m.own\"\n                                [attr.data-status]=\"m.status || null\"\n                                [attr.data-deleted]=\"m.deleted || null\"\n                                [rtMod]=\"{ own: m.own }\">\n                                @if (m.canDelete && !m.deleted) {\n                                    @if (m.deleteConfirm) {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            [rtConfirm]=\"m.deleteConfirm\"\n                                            (confirmed)=\"deleteMessage.emit(m)\" />\n                                    } @else {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            (clicked)=\"deleteMessage.emit(m)\" />\n                                    }\n                                }\n                                @if (messageActions()?.template; as actionsTpl) {\n                                    @if (m | rtChatMessageHasActions: messageHasActions()) {\n                                        <div rtElem=\"message-actions\" qa-dataid=\"chat-message-actions\">\n                                            <rt-menu>\n                                                <ng-container\n                                                    [ngTemplateOutlet]=\"actionsTpl\"\n                                                    [ngTemplateOutletContext]=\"{ $implicit: m }\" />\n                                            </rt-menu>\n                                        </div>\n                                    }\n                                }\n                                <div rtElem=\"message\" [rtMod]=\"{ own: m.own, deleted: m.deleted }\">\n                                    <p rtElem=\"message-author\" qa-dataid=\"chat-message-author\">{{ m.author }}</p>\n                                    @if (m.deleted) {\n                                        <p rtElem=\"message-text\" qa-dataid=\"chat-message-deleted\" rtMod=\"deleted\">\n                                            {{ t().chatMessageDeleted }}\n                                        </p>\n                                    } @else {\n                                        @if (m.delta) {\n                                            <rt-delta-view rtElem=\"message-text\" qa-dataid=\"chat-message-text\" [delta]=\"m.delta\" />\n                                        } @else {\n                                            <p rtElem=\"message-text\" qa-dataid=\"chat-message-text\">{{ m.text }}</p>\n                                        }\n                                        @if (m.attachments?.length) {\n                                            @for (att of m.attachments; track att.id) {\n                                                <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                    <rt-file-card\n                                                        showDownload\n                                                        size=\"sm\"\n                                                        [name]=\"att.name || attachmentFallbackName()\"\n                                                        (download)=\"downloadAttachment.emit(att)\" />\n                                                </span>\n                                            }\n                                        } @else if (m.fileUrl) {\n                                            <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                <rt-file-card\n                                                    showDownload\n                                                    size=\"sm\"\n                                                    [name]=\"m.fileName || attachmentFallbackName()\"\n                                                    (download)=\"downloadFile.emit(m)\" />\n                                            </span>\n                                        }\n                                        @if (m.deepLink) {\n                                            <span rtElem=\"message-deeplink\">\n                                                <a\n                                                    rtButton\n                                                    qa-dataid=\"chat-message-deeplink\"\n                                                    appearance=\"outlined\"\n                                                    icon=\"send\"\n                                                    rel=\"noopener\"\n                                                    target=\"_blank\"\n                                                    [href]=\"m.deepLink\"\n                                                    [label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"\n                                                    [attr.aria-label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"></a>\n                                            </span>\n                                        }\n                                    }\n                                    <span rtElem=\"message-footer\">\n                                        <span rtElem=\"message-date\" qa-dataid=\"chat-message-date\">\n                                            {{ m.createdAt | date: 'short' : undefined : locale() }}\n                                        </span>\n                                        @if (m.status) {\n                                            <span\n                                                rtElem=\"message-status\"\n                                                qa-dataid=\"chat-message-status\"\n                                                [attr.data-status]=\"m.status\"\n                                                [rtMod]=\"{ status: m.status }\"\n                                                [attr.aria-label]=\"m.status | rtChatStatusLabel\">\n                                                @if (m.status === MessageStatus.Failed) {\n                                                    <rt-icon rtElem=\"status-icon\" name=\"exclamation-circle\" size=\"sm\" />\n                                                    <rt-icon-button\n                                                        qa-dataid=\"chat-message-retry\"\n                                                        icon=\"sync\"\n                                                        variant=\"ghost\"\n                                                        [ariaLabel]=\"t().chatRetryAria\"\n                                                        [tooltip]=\"t().chatRetryTooltip\"\n                                                        (clicked)=\"retryMessage.emit(m)\" />\n                                                } @else {\n                                                    <!-- \u0427\u0430\u0441\u044B, \u043F\u043E\u043A\u0430 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u0432 \u043F\u0443\u0442\u0438; \u0434\u0430\u043B\u044C\u0448\u0435 \u0434\u0432\u043E\u0439\u043D\u043E\u0439 \u0447\u0435\u043A, \u0446\u0432\u0435\u0442 \u043A\u043E\u0442\u043E\u0440\u043E\u0433\u043E\n                                                         (\u0441\u0435\u0440\u044B\u0439/\u0441\u0438\u043D\u0438\u0439) \u0440\u0430\u0437\u043B\u0438\u0447\u0430\u0435\u0442 \u0434\u043E\u0441\u0442\u0430\u0432\u043B\u0435\u043D\u043E \u0438 \u043F\u0440\u043E\u0447\u0438\u0442\u0430\u043D\u043E. -->\n                                                    <rt-icon\n                                                        rtElem=\"status-icon\"\n                                                        size=\"sm\"\n                                                        [name]=\"m.status === MessageStatus.Sending ? 'clock' : 'check-double'\" />\n                                                }\n                                            </span>\n                                        }\n                                    </span>\n                                </div>\n                            </div>\n                        } @empty {\n                            <rt-note qa-dataid=\"chat-empty-thread\">{{ t().chatEmptyThread }}</rt-note>\n                        }\n                    </div>\n                }\n                @if (!loading() && fetching()) {\n                    <div rtElem=\"thread-overlay\" qa-dataid=\"chat-thread-overlay\" role=\"status\" [attr.aria-label]=\"t().chatRefreshAria\">\n                        <rt-spinner diameter=\"32\" />\n                    </div>\n                }\n                <div rtElem=\"typing\" qa-dataid=\"chat-typing\" aria-live=\"polite\" [rtMod]=\"{ shown: typingText() !== '' }\">\n                    {{ typingText() }}\n                </div>\n            </div>\n\n            @if (canReply()) {\n                @if (richComposer()) {\n                    <rt-message-composer\n                        rtElem=\"composer-rich\"\n                        qa-dataid=\"chat-composer-rich\"\n                        [placeholder]=\"placeholder()\"\n                        [accept]=\"accept()\"\n                        [attachments]=\"attachments()\"\n                        [formatting]=\"formatting()\"\n                        [toolbar]=\"formattingToolbar()\"\n                        [sending]=\"sending()\"\n                        [disabled]=\"loading() || fetching()\"\n                        [droppedFiles]=\"droppedFiles()\"\n                        (submitted)=\"onComposerSubmit($event)\"\n                        (input)=\"onReplyInput($event)\" />\n                } @else {\n                    <form\n                        rtElem=\"composer\"\n                        qa-dataid=\"chat-composer\"\n                        [formGroup]=\"replyForm\"\n                        (ngSubmit)=\"onSubmit()\"\n                        (input)=\"onReplyInput($event)\">\n                        @if (attachments() && selectedFiles().length > 0) {\n                            <div rtElem=\"composer-files\" qa-dataid=\"chat-composer-files\">\n                                @for (file of selectedFiles(); track $index) {\n                                    <rt-file-card\n                                        showRemove\n                                        qa-dataid=\"chat-composer-file\"\n                                        size=\"sm\"\n                                        [name]=\"file.name\"\n                                        [sizeBytes]=\"file.size\"\n                                        [disabled]=\"composerDisabled()\"\n                                        (removed)=\"removeFile($index)\" />\n                                }\n                            </div>\n                        }\n                        <div rtElem=\"composer-field\" [rtMod]=\"{ attach: attachments() }\">\n                            @if (attachments()) {\n                                <input\n                                    #composerFileEl\n                                    qa-dataid=\"chat-composer-file-input\"\n                                    type=\"file\"\n                                    hidden\n                                    multiple\n                                    [attr.accept]=\"accept() || null\"\n                                    (change)=\"onFilesPicked($event)\" />\n                                <rt-icon-button\n                                    qa-dataid=\"chat-composer-attach\"\n                                    icon=\"paperclip\"\n                                    variant=\"ghost\"\n                                    [ariaLabel]=\"t().chatAttachAria\"\n                                    [tooltip]=\"t().chatAttachTooltip\"\n                                    [disabled]=\"composerDisabled()\"\n                                    (clicked)=\"openFilePicker()\" />\n                            }\n                            <textarea\n                                rtElem=\"composer-input\"\n                                qa-dataid=\"chat-composer-input\"\n                                cdkTextareaAutosize\n                                formControlName=\"message\"\n                                cdkAutosizeMinRows=\"1\"\n                                cdkAutosizeMaxRows=\"4\"\n                                [attr.aria-label]=\"t().chatComposerAria\"\n                                [placeholder]=\"placeholder()\"\n                                (keydown)=\"onComposerKeydown($event)\"></textarea>\n                        </div>\n                        <button\n                            rtButton\n                            rtElem=\"composer-send\"\n                            qa-dataid=\"chat-composer-send\"\n                            type=\"submit\"\n                            theme=\"primary\"\n                            appearance=\"filled\"\n                            [label]=\"t().chatSendLabel\"\n                            [attr.aria-label]=\"t().chatSendAria\"\n                            [loading]=\"sending()\"\n                            [disabled]=\"!canSend()\"></button>\n                    </form>\n                }\n            } @else if (replyBlockReason()) {\n                <rt-note rtElem=\"reply-block\" qa-dataid=\"chat-reply-block\">{{ replyBlockReason() }}</rt-note>\n            }\n\n            <!-- \u0421\u043B\u043E\u0442 \u0434\u043E\u043C\u0435\u043D\u043D\u044B\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u043F\u043E\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043B\u044F \u043F\u043E\u0434 \u043A\u043E\u043C\u043F\u043E\u0437\u0435\u0440\u043E\u043C: \u0432 fullscreen\n                 \u043F\u043E\u043F\u0430\u0434\u0430\u0435\u0442 \u0432\u043D\u0443\u0442\u0440\u044C overlay, \u043F\u043E\u044D\u0442\u043E\u043C\u0443 \u043A\u043D\u043E\u043F\u043A\u0438 \u043E\u0441\u0442\u0430\u044E\u0442\u0441\u044F \u0432\u0438\u0434\u043D\u044B. -->\n            <div rtElem=\"footer-slot\" qa-dataid=\"chat-footer\" [rtMod]=\"{ blocked: fetching() }\" [attr.inert]=\"fetching() ? '' : null\">\n                <ng-content select=\"[rtChatFooter]\" />\n            </div>\n        }\n    </rt-file-drop>\n</ng-container>\n", styles: ["@layer rt-kit.components{.rt-chat{--rt-chat-bubble-radius: var(--rt-radius-lg);--rt-chat-message-border-width: var(--rt-border-width-thin);--rt-chat-transition-duration: var(--rt-duration-fast);--rt-chat-typing-radius: var(--rt-radius-full);--rt-chat-typing-shadow: var(--rt-shadow-sm);display:flex;flex-direction:column}.rt-chat>.rt-file-drop{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0}.rt-chat--expanded{position:fixed;z-index:var(--rt-z-modal);box-sizing:border-box;padding:var(--rt-space-md);background:var(--rt-color-bg-surface);inset:0}.rt-chat--expanded>.rt-file-drop{block-size:100%}@media(width>=1441px){.rt-chat--expanded>.rt-file-drop{inline-size:1000px;margin-inline:auto;max-inline-size:100%}}.rt-chat--expanded .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--expanded .rt-chat__thread{max-height:none}.rt-chat--fill{block-size:100%}.rt-chat--fill .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--fill .rt-chat__thread{max-height:none}.rt-chat__title{margin:0;color:var(--rt-color-text-primary);font-family:var(--rt-font-family-sans);font-size:var(--rt-text-md);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__thread-viewport{position:relative;display:flex;flex-direction:column;contain:inline-size;min-block-size:0}.rt-chat__thread{display:flex;max-height:280px;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0;overflow-y:auto}.rt-chat__thread--frozen{overflow-y:hidden}.rt-chat__thread-overlay{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--rt-color-bg-surface) 60%,transparent);inset:0}.rt-chat__typing{position:absolute;z-index:1;bottom:var(--rt-space-1);left:var(--rt-space-2);box-sizing:border-box;color:var(--rt-color-text-muted);font-size:var(--rt-text-xs);max-inline-size:calc(100% - 2 * var(--rt-space-2));overflow-wrap:anywhere;pointer-events:none}.rt-chat__typing--shown{padding:var(--rt-space-0-5) var(--rt-space-2);border-radius:var(--rt-chat-typing-radius);background:var(--rt-color-bg-surface);box-shadow:var(--rt-chat-typing-shadow)}.rt-chat__footer-slot{display:flex;flex-direction:column}.rt-chat__footer-slot:empty{display:none}.rt-chat__footer-slot--blocked{opacity:.6;pointer-events:none}.rt-chat__message-row{display:flex;max-width:min(80%,480px);align-items:center;align-self:flex-start;gap:var(--rt-space-2)}.rt-chat__message-row--own{align-self:flex-end}.rt-chat__message-row:hover .rt-chat__message-delete,.rt-chat__message-row:focus-within .rt-chat__message-delete,.rt-chat__message-row:hover .rt-chat__message-actions,.rt-chat__message-row:focus-within .rt-chat__message-actions{opacity:1;pointer-events:auto}.rt-chat__message{display:flex;min-width:0;flex:0 1 auto;flex-direction:column;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-2)}.rt-chat__message--own{border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__message--deleted{border:var(--rt-chat-message-border-width) dashed var(--rt-color-border-default);background:transparent}.rt-chat__message-author{margin:0;color:var(--rt-chat-bubble-in-author);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__message--own .rt-chat__message-author{color:var(--rt-chat-bubble-own-author)}.rt-chat__message-text{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-xs);font-weight:var(--rt-font-weight-regular);line-height:var(--rt-leading-snug);white-space:pre-wrap}.rt-chat__message-text--deleted{color:var(--rt-color-text-muted);font-style:italic}.rt-chat__message-delete,.rt-chat__message-actions{flex:0 0 auto;opacity:0;pointer-events:none;transition:opacity var(--rt-chat-transition-duration) ease}.rt-chat__message-attachment{display:block}.rt-chat__message-footer{display:flex;align-items:center;gap:var(--rt-space-1)}.rt-chat__message-date{color:var(--rt-chat-bubble-date);font-size:var(--rt-text-xs);line-height:var(--rt-leading-none)}.rt-chat__message-status{display:inline-flex;align-items:center;color:var(--rt-color-text-muted);gap:var(--rt-space-0-5)}.rt-chat__message-status--status--read{color:var(--rt-chat-status-read)}.rt-chat__message-status--status--failed{color:var(--rt-color-state-danger)}.rt-chat__status-icon{font-size:var(--rt-text-sm)}.rt-chat__message-skeleton{display:flex;max-width:min(80%,480px);flex-direction:column;align-self:flex-start;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-1)}.rt-chat__message-skeleton--own{align-self:flex-end;border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__skeleton-line{display:block}.rt-chat__message-deeplink{display:flex;justify-content:flex-start;margin-top:var(--rt-space-1)}.rt-chat__composer,.rt-chat__composer-rich,.rt-chat__reply-block{margin-top:var(--rt-space-4)}.rt-chat__composer{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-chat__composer-files{display:flex;flex-wrap:wrap;gap:var(--rt-space-2)}.rt-chat__composer-field{display:flex;box-sizing:border-box;align-items:center;border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-input-radius);background-color:var(--rt-input-color-bg);gap:var(--rt-space-1);min-block-size:var(--rt-input-height);padding-inline:var(--rt-input-padding-x);transition:var(--rt-input-transition)}.rt-chat__composer-field:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow)}.rt-chat__composer-field--attach{padding-inline-start:var(--rt-space-1)}.rt-chat__composer-input{box-sizing:content-box;flex:1 1 auto;border:0;background:transparent;color:var(--rt-input-color-text);font-family:inherit;font-size:var(--rt-input-font-size);inline-size:100%;line-height:var(--rt-textarea-line-height);padding-block:var(--rt-space-2);resize:none}.rt-chat__composer-input::placeholder{color:var(--rt-input-color-text-placeholder);opacity:1}.rt-chat__composer-input:focus-visible{outline:none}.rt-chat__composer-input:disabled{cursor:not-allowed}.rt-chat__composer-send{inline-size:100%}}\n"], dependencies: [{ kind: "directive", type: 
                 // Angular
                 CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: 
                 // standalone components / directives
-                RtButtonDirective, selector: "button[rtButton], a[rtButton]", inputs: ["label", "icon", "iconPos", "theme", "appearance", "size", "loading", "loadingIcon", "pressed"] }, { kind: "directive", type: RtConfirmDirective, selector: "[rtConfirm]", inputs: ["rtConfirm", "rtConfirmTitle", "rtConfirmLabel", "rtConfirmCancelLabel", "rtConfirmTone", "rtConfirmDisabled"], outputs: ["confirmed"], exportAs: ["rtConfirm"] }, { kind: "component", type: RtDeltaViewComponent, selector: "rt-delta-view", inputs: ["delta"] }, { kind: "component", type: RtFileCardComponent, selector: "rt-file-card", inputs: ["name", "sizeBytes", "size", "showDownload", "showRemove", "showRename", "disabled"], outputs: ["download", "removed", "rename"] }, { kind: "component", type: RtFileDropComponent, selector: "rt-file-drop", inputs: ["disabled", "overlayLabel", "zones", "accept"], outputs: ["filesDropped", "zoneFilesDropped", "draggingChange"] }, { kind: "component", type: RtIconButtonComponent, selector: "rt-icon-button", inputs: ["icon", "ariaLabel", "variant", "iconColor", "iconFill", "size", "iconSize", "type", "tooltip", "tabIndex", "loading", "disabled", "active", "indicator"], outputs: ["clicked"] }, { kind: "component", type: RtIconComponent, selector: "rt-icon", inputs: ["name", "size", "color", "fill", "rotate"] }, { kind: "component", type: RtMenuComponent, selector: "rt-menu", inputs: ["icon", "ariaLabel", "align", "panelClass", "size", "disabled"], outputs: ["openedChange"] }, { kind: "component", type: RtMessageComposerComponent, selector: "rt-message-composer", inputs: ["placeholder", "accept", "hint", "attachments", "sending", "stoppable", "disabled", "formatting", "toolbar", "minRows", "maxRows", "droppedFiles", "text"], outputs: ["submitted", "textChange", "stopped"] }, { kind: "component", type: RtNoteComponent, selector: "rt-note" }, { kind: "component", type: RtSkeletonWrapperComponent, selector: "rt-skeleton-wrapper", inputs: ["width", "height", "shape", "size", "radius", "animation", "isLoading"] }, { kind: "component", type: RtSpinnerComponent, selector: "rt-spinner", inputs: ["diameter", "color"] }, { kind: "component", type: RtToolbarComponent, selector: "rt-toolbar", inputs: ["dense"] }, { kind: "directive", type: RtToolbarLeftDirective, selector: "[rtToolbarLeft]" }, { kind: "directive", type: RtToolbarRightDirective, selector: "[rtToolbarRight]" }, { kind: "directive", type: BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }, { kind: "directive", type: ModDirective, selector: "[rtMod]" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: RtChatStatusLabelPipe, name: "rtChatStatusLabel" }, { kind: "pipe", type: RtChatMessageHasActionsPipe, name: "rtChatMessageHasActions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+                RtButtonDirective, selector: "button[rtButton], a[rtButton]", inputs: ["label", "icon", "iconPos", "theme", "appearance", "size", "loading", "loadingIcon", "loadingLabel", "pressed"] }, { kind: "directive", type: RtConfirmDirective, selector: "[rtConfirm]", inputs: ["rtConfirm", "rtConfirmTitle", "rtConfirmLabel", "rtConfirmCancelLabel", "rtConfirmTone", "rtConfirmDisabled"], outputs: ["confirmed"], exportAs: ["rtConfirm"] }, { kind: "component", type: RtDeltaViewComponent, selector: "rt-delta-view", inputs: ["delta"] }, { kind: "component", type: RtFileCardComponent, selector: "rt-file-card", inputs: ["name", "sizeBytes", "size", "showDownload", "showRemove", "showRename", "disabled"], outputs: ["download", "removed", "rename"] }, { kind: "component", type: RtFileDropComponent, selector: "rt-file-drop", inputs: ["disabled", "overlayLabel", "zones", "accept"], outputs: ["filesDropped", "zoneFilesDropped", "draggingChange"] }, { kind: "component", type: RtIconButtonComponent, selector: "rt-icon-button", inputs: ["icon", "glyph", "ariaLabel", "variant", "iconColor", "iconFill", "size", "iconSize", "type", "tooltip", "tabIndex", "loading", "disabled", "active", "indicator"], outputs: ["clicked"] }, { kind: "component", type: RtIconComponent, selector: "rt-icon", inputs: ["name", "glyph", "size", "color", "fill", "spin", "rotate"] }, { kind: "component", type: RtMenuComponent, selector: "rt-menu", inputs: ["icon", "ariaLabel", "align", "panelClass", "size", "disabled"], outputs: ["openedChange"] }, { kind: "component", type: RtMessageComposerComponent, selector: "rt-message-composer", inputs: ["placeholder", "accept", "hint", "attachments", "sending", "stoppable", "disabled", "formatting", "toolbar", "minRows", "maxRows", "droppedFiles", "text"], outputs: ["submitted", "textChange", "stopped"] }, { kind: "component", type: RtNoteComponent, selector: "rt-note" }, { kind: "component", type: RtSkeletonWrapperComponent, selector: "rt-skeleton-wrapper", inputs: ["width", "height", "shape", "size", "radius", "animation", "isLoading"] }, { kind: "component", type: RtSpinnerComponent, selector: "rt-spinner", inputs: ["diameter", "color", "appearance", "overlay", "backdrop", "plate"] }, { kind: "component", type: RtToolbarComponent, selector: "rt-toolbar", inputs: ["dense"] }, { kind: "directive", type: RtToolbarLeftDirective, selector: "[rtToolbarLeft]" }, { kind: "directive", type: RtToolbarRightDirective, selector: "[rtToolbarRight]" }, { kind: "directive", type: BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }, { kind: "directive", type: ModDirective, selector: "[rtMod]" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: RtChatStatusLabelPipe, name: "rtChatStatusLabel" }, { kind: "pipe", type: RtChatMessageHasActionsPipe, name: "rtChatMessageHasActions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtChatComponent, decorators: [{
             type: Component,
@@ -947,8 +1002,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
                         class: BEM_BLOCK,
                         '[class.rt-chat--expanded]': 'expanded()',
                         '[class.rt-chat--fill]': 'fill()',
-                    }, template: "<ng-container rtBlock=\"rt-chat\">\n    <rt-file-drop\n        [overlayLabel]=\"t().chatDropOverlay\"\n        [accept]=\"accept()\"\n        [disabled]=\"dropDisabled()\"\n        (filesDropped)=\"onFilesDropped($event)\">\n        @if (showHeader()) {\n            <rt-toolbar rtElem=\"header\" dense>\n                <ng-template rtToolbarLeft>\n                    <h3 rtElem=\"title\" qa-dataid=\"chat-title\">{{ title() }}</h3>\n                </ng-template>\n                <ng-template rtToolbarRight>\n                    @if (showRefresh()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-refresh\"\n                            icon=\"sync\"\n                            variant=\"ghost\"\n                            [ariaLabel]=\"t().chatRefreshAria\"\n                            [tooltip]=\"t().chatRefreshTooltip\"\n                            [loading]=\"fetching()\"\n                            [disabled]=\"!hasThread()\"\n                            (clicked)=\"refresh.emit()\" />\n                    }\n                    @if (showExpand()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-expand\"\n                            variant=\"ghost\"\n                            [icon]=\"expanded() ? 'window-minimize' : 'window-maximize'\"\n                            [ariaLabel]=\"expandLabel()\"\n                            [tooltip]=\"expandLabel()\"\n                            (clicked)=\"toggleExpand()\" />\n                    }\n                    <ng-content select=\"[rtChatHeaderActions]\" />\n                </ng-template>\n            </rt-toolbar>\n        }\n\n        @if (!hasThread()) {\n            <rt-note qa-dataid=\"chat-empty-hint\">{{ emptyHint() }}</rt-note>\n        } @else {\n            <div rtElem=\"thread-viewport\" qa-dataid=\"chat-thread-viewport\">\n                @if (loading()) {\n                    <!-- \u0421\u043A\u0435\u043B\u0435\u0442\u043E\u043D \u043F\u043E\u0432\u0442\u043E\u0440\u044F\u0435\u0442 \u0441\u0442\u0440\u0443\u043A\u0442\u0443\u0440\u0443 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u044F (\u0430\u0432\u0442\u043E\u0440 \u2192 \u0442\u0435\u043A\u0441\u0442 \u2192 \u0434\u0430\u0442\u0430),\n                 \u0447\u0435\u0440\u0435\u0434\u0443\u044F \u0432\u044B\u0440\u0430\u0432\u043D\u0438\u0432\u0430\u043D\u0438\u0435, \u0447\u0442\u043E\u0431\u044B \u0442\u0440\u0435\u0434 \u043D\u0435 \u00AB\u043F\u0440\u044B\u0433\u0430\u043B\u00BB \u043F\u0440\u0438 \u043F\u043E\u0434\u043C\u0435\u043D\u0435 \u043D\u0430 \u0440\u0435\u0430\u043B\u044C\u043D\u044B\u0435. -->\n                    <div rtElem=\"thread\" qa-dataid=\"chat-thread-skeleton\">\n                        @for (row of skeletonRows; track row; let even = $even) {\n                            <div rtElem=\"message-skeleton\" qa-dataid=\"chat-message-skeleton\" [rtMod]=\"{ own: even }\">\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"72px\" height=\"10px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"100%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"55%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"56px\" height=\"10px\" [isLoading]=\"true\" />\n                            </div>\n                        }\n                    </div>\n                } @else {\n                    <div\n                        #thread\n                        rtElem=\"thread\"\n                        qa-dataid=\"chat-thread\"\n                        [rtMod]=\"{ frozen: fetching() }\"\n                        [attr.aria-busy]=\"fetching() ? 'true' : null\"\n                        (scroll)=\"onThreadScroll()\">\n                        @for (m of messages(); track m.id) {\n                            <div\n                                rtElem=\"message-row\"\n                                qa-dataid=\"chat-message\"\n                                [attr.data-own]=\"m.own\"\n                                [attr.data-status]=\"m.status || null\"\n                                [attr.data-deleted]=\"m.deleted || null\"\n                                [rtMod]=\"{ own: m.own }\">\n                                @if (m.canDelete && !m.deleted) {\n                                    @if (m.deleteConfirm) {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            [rtConfirm]=\"m.deleteConfirm\"\n                                            (confirmed)=\"deleteMessage.emit(m)\" />\n                                    } @else {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            (clicked)=\"deleteMessage.emit(m)\" />\n                                    }\n                                }\n                                @if (messageActions()?.template; as actionsTpl) {\n                                    @if (m | rtChatMessageHasActions: messageHasActions()) {\n                                        <div rtElem=\"message-actions\" qa-dataid=\"chat-message-actions\">\n                                            <rt-menu>\n                                                <ng-container\n                                                    [ngTemplateOutlet]=\"actionsTpl\"\n                                                    [ngTemplateOutletContext]=\"{ $implicit: m }\" />\n                                            </rt-menu>\n                                        </div>\n                                    }\n                                }\n                                <div rtElem=\"message\" [rtMod]=\"{ own: m.own, deleted: m.deleted }\">\n                                    <p rtElem=\"message-author\" qa-dataid=\"chat-message-author\">{{ m.author }}</p>\n                                    @if (m.deleted) {\n                                        <p rtElem=\"message-text\" qa-dataid=\"chat-message-deleted\" rtMod=\"deleted\">\n                                            {{ t().chatMessageDeleted }}\n                                        </p>\n                                    } @else {\n                                        @if (m.delta) {\n                                            <rt-delta-view rtElem=\"message-text\" qa-dataid=\"chat-message-text\" [delta]=\"m.delta\" />\n                                        } @else {\n                                            <p rtElem=\"message-text\" qa-dataid=\"chat-message-text\">{{ m.text }}</p>\n                                        }\n                                        @if (m.attachments?.length) {\n                                            @for (att of m.attachments; track att.id) {\n                                                <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                    <rt-file-card\n                                                        showDownload\n                                                        size=\"sm\"\n                                                        [name]=\"att.name || attachmentFallbackName()\"\n                                                        (download)=\"downloadAttachment.emit(att)\" />\n                                                </span>\n                                            }\n                                        } @else if (m.fileUrl) {\n                                            <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                <rt-file-card\n                                                    showDownload\n                                                    size=\"sm\"\n                                                    [name]=\"m.fileName || attachmentFallbackName()\"\n                                                    (download)=\"downloadFile.emit(m)\" />\n                                            </span>\n                                        }\n                                        @if (m.deepLink) {\n                                            <span rtElem=\"message-deeplink\">\n                                                <a\n                                                    rtButton\n                                                    qa-dataid=\"chat-message-deeplink\"\n                                                    appearance=\"outlined\"\n                                                    icon=\"send\"\n                                                    rel=\"noopener\"\n                                                    target=\"_blank\"\n                                                    [href]=\"m.deepLink\"\n                                                    [label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"\n                                                    [attr.aria-label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"></a>\n                                            </span>\n                                        }\n                                    }\n                                    <span rtElem=\"message-footer\">\n                                        <span rtElem=\"message-date\" qa-dataid=\"chat-message-date\">\n                                            {{ m.createdAt | date: 'short' : undefined : locale() }}\n                                        </span>\n                                        @if (m.status) {\n                                            <span\n                                                rtElem=\"message-status\"\n                                                qa-dataid=\"chat-message-status\"\n                                                [attr.data-status]=\"m.status\"\n                                                [rtMod]=\"{ status: m.status }\"\n                                                [attr.aria-label]=\"m.status | rtChatStatusLabel\">\n                                                @if (m.status === MessageStatus.Failed) {\n                                                    <rt-icon rtElem=\"status-icon\" name=\"exclamation-circle\" size=\"sm\" />\n                                                    <rt-icon-button\n                                                        qa-dataid=\"chat-message-retry\"\n                                                        icon=\"sync\"\n                                                        variant=\"ghost\"\n                                                        [ariaLabel]=\"t().chatRetryAria\"\n                                                        [tooltip]=\"t().chatRetryTooltip\"\n                                                        (clicked)=\"retryMessage.emit(m)\" />\n                                                } @else {\n                                                    <!-- \u0427\u0430\u0441\u044B, \u043F\u043E\u043A\u0430 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u0432 \u043F\u0443\u0442\u0438; \u0434\u0430\u043B\u044C\u0448\u0435 \u0434\u0432\u043E\u0439\u043D\u043E\u0439 \u0447\u0435\u043A, \u0446\u0432\u0435\u0442 \u043A\u043E\u0442\u043E\u0440\u043E\u0433\u043E\n                                                         (\u0441\u0435\u0440\u044B\u0439/\u0441\u0438\u043D\u0438\u0439) \u0440\u0430\u0437\u043B\u0438\u0447\u0430\u0435\u0442 \u0434\u043E\u0441\u0442\u0430\u0432\u043B\u0435\u043D\u043E \u0438 \u043F\u0440\u043E\u0447\u0438\u0442\u0430\u043D\u043E. -->\n                                                    <rt-icon\n                                                        rtElem=\"status-icon\"\n                                                        size=\"sm\"\n                                                        [name]=\"m.status === MessageStatus.Sending ? 'clock' : 'check-double'\" />\n                                                }\n                                            </span>\n                                        }\n                                    </span>\n                                </div>\n                            </div>\n                        } @empty {\n                            <rt-note qa-dataid=\"chat-empty-thread\">{{ t().chatEmptyThread }}</rt-note>\n                        }\n                    </div>\n                }\n                @if (!loading() && fetching()) {\n                    <div rtElem=\"thread-overlay\" qa-dataid=\"chat-thread-overlay\" role=\"status\" [attr.aria-label]=\"t().chatRefreshAria\">\n                        <rt-spinner diameter=\"32\" />\n                    </div>\n                }\n            </div>\n\n            @if (canReply()) {\n                @if (richComposer()) {\n                    <rt-message-composer\n                        rtElem=\"composer-rich\"\n                        qa-dataid=\"chat-composer-rich\"\n                        [placeholder]=\"placeholder()\"\n                        [accept]=\"accept()\"\n                        [attachments]=\"attachments()\"\n                        [formatting]=\"formatting()\"\n                        [toolbar]=\"formattingToolbar()\"\n                        [sending]=\"sending()\"\n                        [disabled]=\"loading() || fetching()\"\n                        [droppedFiles]=\"droppedFiles()\"\n                        (submitted)=\"onComposerSubmit($event)\" />\n                } @else {\n                    <form rtElem=\"composer\" qa-dataid=\"chat-composer\" [formGroup]=\"replyForm\" (ngSubmit)=\"onSubmit()\">\n                        @if (attachments() && selectedFiles().length > 0) {\n                            <div rtElem=\"composer-files\" qa-dataid=\"chat-composer-files\">\n                                @for (file of selectedFiles(); track $index) {\n                                    <rt-file-card\n                                        showRemove\n                                        qa-dataid=\"chat-composer-file\"\n                                        size=\"sm\"\n                                        [name]=\"file.name\"\n                                        [sizeBytes]=\"file.size\"\n                                        [disabled]=\"composerDisabled()\"\n                                        (removed)=\"removeFile($index)\" />\n                                }\n                            </div>\n                        }\n                        <div rtElem=\"composer-field\" [rtMod]=\"{ attach: attachments() }\">\n                            @if (attachments()) {\n                                <input\n                                    #composerFileEl\n                                    qa-dataid=\"chat-composer-file-input\"\n                                    type=\"file\"\n                                    hidden\n                                    multiple\n                                    [attr.accept]=\"accept() || null\"\n                                    (change)=\"onFilesPicked($event)\" />\n                                <rt-icon-button\n                                    qa-dataid=\"chat-composer-attach\"\n                                    icon=\"paperclip\"\n                                    variant=\"ghost\"\n                                    [ariaLabel]=\"t().chatAttachAria\"\n                                    [tooltip]=\"t().chatAttachTooltip\"\n                                    [disabled]=\"composerDisabled()\"\n                                    (clicked)=\"openFilePicker()\" />\n                            }\n                            <textarea\n                                rtElem=\"composer-input\"\n                                qa-dataid=\"chat-composer-input\"\n                                cdkTextareaAutosize\n                                formControlName=\"message\"\n                                cdkAutosizeMinRows=\"1\"\n                                cdkAutosizeMaxRows=\"4\"\n                                [attr.aria-label]=\"t().chatComposerAria\"\n                                [placeholder]=\"placeholder()\"\n                                (keydown)=\"onComposerKeydown($event)\"></textarea>\n                        </div>\n                        <button\n                            rtButton\n                            rtElem=\"composer-send\"\n                            qa-dataid=\"chat-composer-send\"\n                            type=\"submit\"\n                            theme=\"primary\"\n                            appearance=\"filled\"\n                            [label]=\"t().chatSendLabel\"\n                            [attr.aria-label]=\"t().chatSendAria\"\n                            [loading]=\"sending()\"\n                            [disabled]=\"!canSend()\"></button>\n                    </form>\n                }\n            } @else if (replyBlockReason()) {\n                <rt-note rtElem=\"reply-block\" qa-dataid=\"chat-reply-block\">{{ replyBlockReason() }}</rt-note>\n            }\n\n            <!-- \u0421\u043B\u043E\u0442 \u0434\u043E\u043C\u0435\u043D\u043D\u044B\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u043F\u043E\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043B\u044F \u043F\u043E\u0434 \u043A\u043E\u043C\u043F\u043E\u0437\u0435\u0440\u043E\u043C: \u0432 fullscreen\n                 \u043F\u043E\u043F\u0430\u0434\u0430\u0435\u0442 \u0432\u043D\u0443\u0442\u0440\u044C overlay, \u043F\u043E\u044D\u0442\u043E\u043C\u0443 \u043A\u043D\u043E\u043F\u043A\u0438 \u043E\u0441\u0442\u0430\u044E\u0442\u0441\u044F \u0432\u0438\u0434\u043D\u044B. -->\n            <div rtElem=\"footer-slot\" qa-dataid=\"chat-footer\" [rtMod]=\"{ blocked: fetching() }\" [attr.inert]=\"fetching() ? '' : null\">\n                <ng-content select=\"[rtChatFooter]\" />\n            </div>\n        }\n    </rt-file-drop>\n</ng-container>\n", styles: ["@layer rt-kit.components{.rt-chat{--rt-chat-bubble-radius: var(--rt-radius-lg);--rt-chat-message-border-width: var(--rt-border-width-thin);--rt-chat-transition-duration: var(--rt-duration-fast);display:flex;flex-direction:column}.rt-chat>.rt-file-drop{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0}.rt-chat--expanded{position:fixed;z-index:var(--rt-z-modal);box-sizing:border-box;padding:var(--rt-space-md);background:var(--rt-color-bg-surface);inset:0}.rt-chat--expanded>.rt-file-drop{block-size:100%}@media(width>=1441px){.rt-chat--expanded>.rt-file-drop{inline-size:1000px;margin-inline:auto;max-inline-size:100%}}.rt-chat--expanded .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--expanded .rt-chat__thread{max-height:none}.rt-chat--fill{block-size:100%}.rt-chat--fill .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--fill .rt-chat__thread{max-height:none}.rt-chat__title{margin:0;color:var(--rt-color-text-primary);font-family:var(--rt-font-family-sans);font-size:var(--rt-text-md);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__thread-viewport{position:relative;display:flex;flex-direction:column;contain:inline-size;min-block-size:0}.rt-chat__thread{display:flex;max-height:280px;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0;overflow-y:auto}.rt-chat__thread--frozen{overflow-y:hidden}.rt-chat__thread-overlay{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--rt-color-bg-surface) 60%,transparent);inset:0}.rt-chat__footer-slot{display:flex;flex-direction:column}.rt-chat__footer-slot:empty{display:none}.rt-chat__footer-slot--blocked{opacity:.6;pointer-events:none}.rt-chat__message-row{display:flex;max-width:min(80%,480px);align-items:center;align-self:flex-start;gap:var(--rt-space-2)}.rt-chat__message-row--own{align-self:flex-end}.rt-chat__message-row:hover .rt-chat__message-delete,.rt-chat__message-row:focus-within .rt-chat__message-delete,.rt-chat__message-row:hover .rt-chat__message-actions,.rt-chat__message-row:focus-within .rt-chat__message-actions{opacity:1;pointer-events:auto}.rt-chat__message{display:flex;min-width:0;flex:0 1 auto;flex-direction:column;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-2)}.rt-chat__message--own{border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__message--deleted{border:var(--rt-chat-message-border-width) dashed var(--rt-color-border-default);background:transparent}.rt-chat__message-author{margin:0;color:var(--rt-chat-bubble-in-author);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__message--own .rt-chat__message-author{color:var(--rt-chat-bubble-own-author)}.rt-chat__message-text{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-xs);font-weight:var(--rt-font-weight-regular);line-height:var(--rt-leading-snug);white-space:pre-wrap}.rt-chat__message-text--deleted{color:var(--rt-color-text-muted);font-style:italic}.rt-chat__message-delete,.rt-chat__message-actions{flex:0 0 auto;opacity:0;pointer-events:none;transition:opacity var(--rt-chat-transition-duration) ease}.rt-chat__message-attachment{display:block}.rt-chat__message-footer{display:flex;align-items:center;gap:var(--rt-space-1)}.rt-chat__message-date{color:var(--rt-chat-bubble-date);font-size:var(--rt-text-xs);line-height:var(--rt-leading-none)}.rt-chat__message-status{display:inline-flex;align-items:center;color:var(--rt-color-text-muted);gap:var(--rt-space-0-5)}.rt-chat__message-status--status--read{color:var(--rt-chat-status-read)}.rt-chat__message-status--status--failed{color:var(--rt-color-state-danger)}.rt-chat__status-icon{font-size:var(--rt-text-sm)}.rt-chat__message-skeleton{display:flex;max-width:min(80%,480px);flex-direction:column;align-self:flex-start;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-1)}.rt-chat__message-skeleton--own{align-self:flex-end;border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__skeleton-line{display:block}.rt-chat__message-deeplink{display:flex;justify-content:flex-start;margin-top:var(--rt-space-1)}.rt-chat__composer,.rt-chat__composer-rich,.rt-chat__reply-block{margin-top:var(--rt-space-4)}.rt-chat__composer{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-chat__composer-files{display:flex;flex-wrap:wrap;gap:var(--rt-space-2)}.rt-chat__composer-field{display:flex;box-sizing:border-box;align-items:center;border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-input-radius);background-color:var(--rt-input-color-bg);gap:var(--rt-space-1);min-block-size:var(--rt-input-height);padding-inline:var(--rt-input-padding-x);transition:var(--rt-input-transition)}.rt-chat__composer-field:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow)}.rt-chat__composer-field--attach{padding-inline-start:var(--rt-space-1)}.rt-chat__composer-input{box-sizing:content-box;flex:1 1 auto;border:0;background:transparent;color:var(--rt-input-color-text);font-family:inherit;font-size:var(--rt-input-font-size);inline-size:100%;line-height:var(--rt-textarea-line-height);padding-block:var(--rt-space-2);resize:none}.rt-chat__composer-input::placeholder{color:var(--rt-input-color-text-placeholder);opacity:1}.rt-chat__composer-input:focus-visible{outline:none}.rt-chat__composer-input:disabled{cursor:not-allowed}.rt-chat__composer-send{inline-size:100%}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { thread: [{ type: i0.ViewChild, args: ['thread', { isSignal: true }] }], composerFileEl: [{ type: i0.ViewChild, args: ['composerFileEl', { isSignal: true }] }], messageActions: [{ type: i0.ContentChild, args: [i0.forwardRef(() => RtChatMessageActionsDirective), { isSignal: true }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], fetching: [{ type: i0.Input, args: [{ isSignal: true, alias: "fetching", required: false }] }], canReply: [{ type: i0.Input, args: [{ isSignal: true, alias: "canReply", required: false }] }], replyBlockReason: [{ type: i0.Input, args: [{ isSignal: true, alias: "replyBlockReason", required: false }] }], sending: [{ type: i0.Input, args: [{ isSignal: true, alias: "sending", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], emptyHint: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyHint", required: false }] }], hasThread: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasThread", required: false }] }], attachments: [{ type: i0.Input, args: [{ isSignal: true, alias: "attachments", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], richComposer: [{ type: i0.Input, args: [{ isSignal: true, alias: "richComposer", required: false }] }], formatting: [{ type: i0.Input, args: [{ isSignal: true, alias: "formatting", required: false }] }], formattingToolbar: [{ type: i0.Input, args: [{ isSignal: true, alias: "formattingToolbar", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], showRefresh: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRefresh", required: false }] }], showExpand: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExpand", required: false }] }], send: [{ type: i0.Output, args: ["send"] }], refresh: [{ type: i0.Output, args: ["refresh"] }], downloadFile: [{ type: i0.Output, args: ["downloadFile"] }], downloadAttachment: [{ type: i0.Output, args: ["downloadAttachment"] }], expandedChange: [{ type: i0.Output, args: ["expandedChange"] }], deleteMessage: [{ type: i0.Output, args: ["deleteMessage"] }], retryMessage: [{ type: i0.Output, args: ["retryMessage"] }], messageHasActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "messageHasActions", required: false }] }] } });
+                    }, template: "<ng-container rtBlock=\"rt-chat\">\n    <rt-file-drop\n        [overlayLabel]=\"t().chatDropOverlay\"\n        [accept]=\"accept()\"\n        [disabled]=\"dropDisabled()\"\n        (filesDropped)=\"onFilesDropped($event)\">\n        @if (showHeader()) {\n            <rt-toolbar rtElem=\"header\" dense>\n                <ng-template rtToolbarLeft>\n                    <h3 rtElem=\"title\" qa-dataid=\"chat-title\">{{ title() }}</h3>\n                </ng-template>\n                <ng-template rtToolbarRight>\n                    @if (showRefresh()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-refresh\"\n                            icon=\"sync\"\n                            variant=\"ghost\"\n                            [ariaLabel]=\"t().chatRefreshAria\"\n                            [tooltip]=\"t().chatRefreshTooltip\"\n                            [loading]=\"fetching()\"\n                            [disabled]=\"!hasThread()\"\n                            (clicked)=\"refresh.emit()\" />\n                    }\n                    @if (showExpand()) {\n                        <rt-icon-button\n                            qa-dataid=\"chat-expand\"\n                            variant=\"ghost\"\n                            [icon]=\"expanded() ? 'window-minimize' : 'window-maximize'\"\n                            [ariaLabel]=\"expandLabel()\"\n                            [tooltip]=\"expandLabel()\"\n                            (clicked)=\"toggleExpand()\" />\n                    }\n                    <ng-content select=\"[rtChatHeaderActions]\" />\n                </ng-template>\n            </rt-toolbar>\n        }\n\n        @if (!hasThread()) {\n            <rt-note qa-dataid=\"chat-empty-hint\">{{ emptyHint() }}</rt-note>\n        } @else {\n            <div rtElem=\"thread-viewport\" qa-dataid=\"chat-thread-viewport\">\n                @if (loading()) {\n                    <!-- \u0421\u043A\u0435\u043B\u0435\u0442\u043E\u043D \u043F\u043E\u0432\u0442\u043E\u0440\u044F\u0435\u0442 \u0441\u0442\u0440\u0443\u043A\u0442\u0443\u0440\u0443 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u044F (\u0430\u0432\u0442\u043E\u0440 \u2192 \u0442\u0435\u043A\u0441\u0442 \u2192 \u0434\u0430\u0442\u0430),\n                 \u0447\u0435\u0440\u0435\u0434\u0443\u044F \u0432\u044B\u0440\u0430\u0432\u043D\u0438\u0432\u0430\u043D\u0438\u0435, \u0447\u0442\u043E\u0431\u044B \u0442\u0440\u0435\u0434 \u043D\u0435 \u00AB\u043F\u0440\u044B\u0433\u0430\u043B\u00BB \u043F\u0440\u0438 \u043F\u043E\u0434\u043C\u0435\u043D\u0435 \u043D\u0430 \u0440\u0435\u0430\u043B\u044C\u043D\u044B\u0435. -->\n                    <div rtElem=\"thread\" qa-dataid=\"chat-thread-skeleton\">\n                        @for (row of skeletonRows; track row; let even = $even) {\n                            <div rtElem=\"message-skeleton\" qa-dataid=\"chat-message-skeleton\" [rtMod]=\"{ own: even }\">\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"72px\" height=\"10px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"100%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"55%\" height=\"13px\" [isLoading]=\"true\" />\n                                <rt-skeleton-wrapper rtElem=\"skeleton-line\" width=\"56px\" height=\"10px\" [isLoading]=\"true\" />\n                            </div>\n                        }\n                    </div>\n                } @else {\n                    <div\n                        #thread\n                        rtElem=\"thread\"\n                        qa-dataid=\"chat-thread\"\n                        [rtMod]=\"{ frozen: fetching() }\"\n                        [attr.aria-busy]=\"fetching() ? 'true' : null\"\n                        (scroll)=\"onThreadScroll()\">\n                        @for (m of messages(); track m.id) {\n                            <div\n                                rtElem=\"message-row\"\n                                qa-dataid=\"chat-message\"\n                                [attr.data-own]=\"m.own\"\n                                [attr.data-status]=\"m.status || null\"\n                                [attr.data-deleted]=\"m.deleted || null\"\n                                [rtMod]=\"{ own: m.own }\">\n                                @if (m.canDelete && !m.deleted) {\n                                    @if (m.deleteConfirm) {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            [rtConfirm]=\"m.deleteConfirm\"\n                                            (confirmed)=\"deleteMessage.emit(m)\" />\n                                    } @else {\n                                        <rt-icon-button\n                                            rtElem=\"message-delete\"\n                                            qa-dataid=\"chat-message-delete\"\n                                            icon=\"trash\"\n                                            variant=\"ghost\"\n                                            [ariaLabel]=\"t().chatDeleteAria\"\n                                            [tooltip]=\"t().chatDeleteTooltip\"\n                                            (clicked)=\"deleteMessage.emit(m)\" />\n                                    }\n                                }\n                                @if (messageActions()?.template; as actionsTpl) {\n                                    @if (m | rtChatMessageHasActions: messageHasActions()) {\n                                        <div rtElem=\"message-actions\" qa-dataid=\"chat-message-actions\">\n                                            <rt-menu>\n                                                <ng-container\n                                                    [ngTemplateOutlet]=\"actionsTpl\"\n                                                    [ngTemplateOutletContext]=\"{ $implicit: m }\" />\n                                            </rt-menu>\n                                        </div>\n                                    }\n                                }\n                                <div rtElem=\"message\" [rtMod]=\"{ own: m.own, deleted: m.deleted }\">\n                                    <p rtElem=\"message-author\" qa-dataid=\"chat-message-author\">{{ m.author }}</p>\n                                    @if (m.deleted) {\n                                        <p rtElem=\"message-text\" qa-dataid=\"chat-message-deleted\" rtMod=\"deleted\">\n                                            {{ t().chatMessageDeleted }}\n                                        </p>\n                                    } @else {\n                                        @if (m.delta) {\n                                            <rt-delta-view rtElem=\"message-text\" qa-dataid=\"chat-message-text\" [delta]=\"m.delta\" />\n                                        } @else {\n                                            <p rtElem=\"message-text\" qa-dataid=\"chat-message-text\">{{ m.text }}</p>\n                                        }\n                                        @if (m.attachments?.length) {\n                                            @for (att of m.attachments; track att.id) {\n                                                <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                    <rt-file-card\n                                                        showDownload\n                                                        size=\"sm\"\n                                                        [name]=\"att.name || attachmentFallbackName()\"\n                                                        (download)=\"downloadAttachment.emit(att)\" />\n                                                </span>\n                                            }\n                                        } @else if (m.fileUrl) {\n                                            <span rtElem=\"message-attachment\" qa-dataid=\"chat-message-attachment\">\n                                                <rt-file-card\n                                                    showDownload\n                                                    size=\"sm\"\n                                                    [name]=\"m.fileName || attachmentFallbackName()\"\n                                                    (download)=\"downloadFile.emit(m)\" />\n                                            </span>\n                                        }\n                                        @if (m.deepLink) {\n                                            <span rtElem=\"message-deeplink\">\n                                                <a\n                                                    rtButton\n                                                    qa-dataid=\"chat-message-deeplink\"\n                                                    appearance=\"outlined\"\n                                                    icon=\"send\"\n                                                    rel=\"noopener\"\n                                                    target=\"_blank\"\n                                                    [href]=\"m.deepLink\"\n                                                    [label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"\n                                                    [attr.aria-label]=\"m.deepLinkLabel || t().uiSubscribeNotifications\"></a>\n                                            </span>\n                                        }\n                                    }\n                                    <span rtElem=\"message-footer\">\n                                        <span rtElem=\"message-date\" qa-dataid=\"chat-message-date\">\n                                            {{ m.createdAt | date: 'short' : undefined : locale() }}\n                                        </span>\n                                        @if (m.status) {\n                                            <span\n                                                rtElem=\"message-status\"\n                                                qa-dataid=\"chat-message-status\"\n                                                [attr.data-status]=\"m.status\"\n                                                [rtMod]=\"{ status: m.status }\"\n                                                [attr.aria-label]=\"m.status | rtChatStatusLabel\">\n                                                @if (m.status === MessageStatus.Failed) {\n                                                    <rt-icon rtElem=\"status-icon\" name=\"exclamation-circle\" size=\"sm\" />\n                                                    <rt-icon-button\n                                                        qa-dataid=\"chat-message-retry\"\n                                                        icon=\"sync\"\n                                                        variant=\"ghost\"\n                                                        [ariaLabel]=\"t().chatRetryAria\"\n                                                        [tooltip]=\"t().chatRetryTooltip\"\n                                                        (clicked)=\"retryMessage.emit(m)\" />\n                                                } @else {\n                                                    <!-- \u0427\u0430\u0441\u044B, \u043F\u043E\u043A\u0430 \u0441\u043E\u043E\u0431\u0449\u0435\u043D\u0438\u0435 \u0432 \u043F\u0443\u0442\u0438; \u0434\u0430\u043B\u044C\u0448\u0435 \u0434\u0432\u043E\u0439\u043D\u043E\u0439 \u0447\u0435\u043A, \u0446\u0432\u0435\u0442 \u043A\u043E\u0442\u043E\u0440\u043E\u0433\u043E\n                                                         (\u0441\u0435\u0440\u044B\u0439/\u0441\u0438\u043D\u0438\u0439) \u0440\u0430\u0437\u043B\u0438\u0447\u0430\u0435\u0442 \u0434\u043E\u0441\u0442\u0430\u0432\u043B\u0435\u043D\u043E \u0438 \u043F\u0440\u043E\u0447\u0438\u0442\u0430\u043D\u043E. -->\n                                                    <rt-icon\n                                                        rtElem=\"status-icon\"\n                                                        size=\"sm\"\n                                                        [name]=\"m.status === MessageStatus.Sending ? 'clock' : 'check-double'\" />\n                                                }\n                                            </span>\n                                        }\n                                    </span>\n                                </div>\n                            </div>\n                        } @empty {\n                            <rt-note qa-dataid=\"chat-empty-thread\">{{ t().chatEmptyThread }}</rt-note>\n                        }\n                    </div>\n                }\n                @if (!loading() && fetching()) {\n                    <div rtElem=\"thread-overlay\" qa-dataid=\"chat-thread-overlay\" role=\"status\" [attr.aria-label]=\"t().chatRefreshAria\">\n                        <rt-spinner diameter=\"32\" />\n                    </div>\n                }\n                <div rtElem=\"typing\" qa-dataid=\"chat-typing\" aria-live=\"polite\" [rtMod]=\"{ shown: typingText() !== '' }\">\n                    {{ typingText() }}\n                </div>\n            </div>\n\n            @if (canReply()) {\n                @if (richComposer()) {\n                    <rt-message-composer\n                        rtElem=\"composer-rich\"\n                        qa-dataid=\"chat-composer-rich\"\n                        [placeholder]=\"placeholder()\"\n                        [accept]=\"accept()\"\n                        [attachments]=\"attachments()\"\n                        [formatting]=\"formatting()\"\n                        [toolbar]=\"formattingToolbar()\"\n                        [sending]=\"sending()\"\n                        [disabled]=\"loading() || fetching()\"\n                        [droppedFiles]=\"droppedFiles()\"\n                        (submitted)=\"onComposerSubmit($event)\"\n                        (input)=\"onReplyInput($event)\" />\n                } @else {\n                    <form\n                        rtElem=\"composer\"\n                        qa-dataid=\"chat-composer\"\n                        [formGroup]=\"replyForm\"\n                        (ngSubmit)=\"onSubmit()\"\n                        (input)=\"onReplyInput($event)\">\n                        @if (attachments() && selectedFiles().length > 0) {\n                            <div rtElem=\"composer-files\" qa-dataid=\"chat-composer-files\">\n                                @for (file of selectedFiles(); track $index) {\n                                    <rt-file-card\n                                        showRemove\n                                        qa-dataid=\"chat-composer-file\"\n                                        size=\"sm\"\n                                        [name]=\"file.name\"\n                                        [sizeBytes]=\"file.size\"\n                                        [disabled]=\"composerDisabled()\"\n                                        (removed)=\"removeFile($index)\" />\n                                }\n                            </div>\n                        }\n                        <div rtElem=\"composer-field\" [rtMod]=\"{ attach: attachments() }\">\n                            @if (attachments()) {\n                                <input\n                                    #composerFileEl\n                                    qa-dataid=\"chat-composer-file-input\"\n                                    type=\"file\"\n                                    hidden\n                                    multiple\n                                    [attr.accept]=\"accept() || null\"\n                                    (change)=\"onFilesPicked($event)\" />\n                                <rt-icon-button\n                                    qa-dataid=\"chat-composer-attach\"\n                                    icon=\"paperclip\"\n                                    variant=\"ghost\"\n                                    [ariaLabel]=\"t().chatAttachAria\"\n                                    [tooltip]=\"t().chatAttachTooltip\"\n                                    [disabled]=\"composerDisabled()\"\n                                    (clicked)=\"openFilePicker()\" />\n                            }\n                            <textarea\n                                rtElem=\"composer-input\"\n                                qa-dataid=\"chat-composer-input\"\n                                cdkTextareaAutosize\n                                formControlName=\"message\"\n                                cdkAutosizeMinRows=\"1\"\n                                cdkAutosizeMaxRows=\"4\"\n                                [attr.aria-label]=\"t().chatComposerAria\"\n                                [placeholder]=\"placeholder()\"\n                                (keydown)=\"onComposerKeydown($event)\"></textarea>\n                        </div>\n                        <button\n                            rtButton\n                            rtElem=\"composer-send\"\n                            qa-dataid=\"chat-composer-send\"\n                            type=\"submit\"\n                            theme=\"primary\"\n                            appearance=\"filled\"\n                            [label]=\"t().chatSendLabel\"\n                            [attr.aria-label]=\"t().chatSendAria\"\n                            [loading]=\"sending()\"\n                            [disabled]=\"!canSend()\"></button>\n                    </form>\n                }\n            } @else if (replyBlockReason()) {\n                <rt-note rtElem=\"reply-block\" qa-dataid=\"chat-reply-block\">{{ replyBlockReason() }}</rt-note>\n            }\n\n            <!-- \u0421\u043B\u043E\u0442 \u0434\u043E\u043C\u0435\u043D\u043D\u044B\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u043F\u043E\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043B\u044F \u043F\u043E\u0434 \u043A\u043E\u043C\u043F\u043E\u0437\u0435\u0440\u043E\u043C: \u0432 fullscreen\n                 \u043F\u043E\u043F\u0430\u0434\u0430\u0435\u0442 \u0432\u043D\u0443\u0442\u0440\u044C overlay, \u043F\u043E\u044D\u0442\u043E\u043C\u0443 \u043A\u043D\u043E\u043F\u043A\u0438 \u043E\u0441\u0442\u0430\u044E\u0442\u0441\u044F \u0432\u0438\u0434\u043D\u044B. -->\n            <div rtElem=\"footer-slot\" qa-dataid=\"chat-footer\" [rtMod]=\"{ blocked: fetching() }\" [attr.inert]=\"fetching() ? '' : null\">\n                <ng-content select=\"[rtChatFooter]\" />\n            </div>\n        }\n    </rt-file-drop>\n</ng-container>\n", styles: ["@layer rt-kit.components{.rt-chat{--rt-chat-bubble-radius: var(--rt-radius-lg);--rt-chat-message-border-width: var(--rt-border-width-thin);--rt-chat-transition-duration: var(--rt-duration-fast);--rt-chat-typing-radius: var(--rt-radius-full);--rt-chat-typing-shadow: var(--rt-shadow-sm);display:flex;flex-direction:column}.rt-chat>.rt-file-drop{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0}.rt-chat--expanded{position:fixed;z-index:var(--rt-z-modal);box-sizing:border-box;padding:var(--rt-space-md);background:var(--rt-color-bg-surface);inset:0}.rt-chat--expanded>.rt-file-drop{block-size:100%}@media(width>=1441px){.rt-chat--expanded>.rt-file-drop{inline-size:1000px;margin-inline:auto;max-inline-size:100%}}.rt-chat--expanded .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--expanded .rt-chat__thread{max-height:none}.rt-chat--fill{block-size:100%}.rt-chat--fill .rt-chat__thread-viewport{flex:1 1 auto;min-block-size:0}.rt-chat--fill .rt-chat__thread{max-height:none}.rt-chat__title{margin:0;color:var(--rt-color-text-primary);font-family:var(--rt-font-family-sans);font-size:var(--rt-text-md);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__thread-viewport{position:relative;display:flex;flex-direction:column;contain:inline-size;min-block-size:0}.rt-chat__thread{display:flex;max-height:280px;flex:1 1 auto;flex-direction:column;gap:var(--rt-space-4);min-block-size:0;overflow-y:auto}.rt-chat__thread--frozen{overflow-y:hidden}.rt-chat__thread-overlay{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--rt-color-bg-surface) 60%,transparent);inset:0}.rt-chat__typing{position:absolute;z-index:1;bottom:var(--rt-space-1);left:var(--rt-space-2);box-sizing:border-box;color:var(--rt-color-text-muted);font-size:var(--rt-text-xs);max-inline-size:calc(100% - 2 * var(--rt-space-2));overflow-wrap:anywhere;pointer-events:none}.rt-chat__typing--shown{padding:var(--rt-space-0-5) var(--rt-space-2);border-radius:var(--rt-chat-typing-radius);background:var(--rt-color-bg-surface);box-shadow:var(--rt-chat-typing-shadow)}.rt-chat__footer-slot{display:flex;flex-direction:column}.rt-chat__footer-slot:empty{display:none}.rt-chat__footer-slot--blocked{opacity:.6;pointer-events:none}.rt-chat__message-row{display:flex;max-width:min(80%,480px);align-items:center;align-self:flex-start;gap:var(--rt-space-2)}.rt-chat__message-row--own{align-self:flex-end}.rt-chat__message-row:hover .rt-chat__message-delete,.rt-chat__message-row:focus-within .rt-chat__message-delete,.rt-chat__message-row:hover .rt-chat__message-actions,.rt-chat__message-row:focus-within .rt-chat__message-actions{opacity:1;pointer-events:auto}.rt-chat__message{display:flex;min-width:0;flex:0 1 auto;flex-direction:column;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-2)}.rt-chat__message--own{border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__message--deleted{border:var(--rt-chat-message-border-width) dashed var(--rt-color-border-default);background:transparent}.rt-chat__message-author{margin:0;color:var(--rt-chat-bubble-in-author);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-bold);letter-spacing:var(--rt-letter-spacing-wide);line-height:var(--rt-leading-snug)}.rt-chat__message--own .rt-chat__message-author{color:var(--rt-chat-bubble-own-author)}.rt-chat__message-text{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-xs);font-weight:var(--rt-font-weight-regular);line-height:var(--rt-leading-snug);white-space:pre-wrap}.rt-chat__message-text--deleted{color:var(--rt-color-text-muted);font-style:italic}.rt-chat__message-delete,.rt-chat__message-actions{flex:0 0 auto;opacity:0;pointer-events:none;transition:opacity var(--rt-chat-transition-duration) ease}.rt-chat__message-attachment{display:block}.rt-chat__message-footer{display:flex;align-items:center;gap:var(--rt-space-1)}.rt-chat__message-date{color:var(--rt-chat-bubble-date);font-size:var(--rt-text-xs);line-height:var(--rt-leading-none)}.rt-chat__message-status{display:inline-flex;align-items:center;color:var(--rt-color-text-muted);gap:var(--rt-space-0-5)}.rt-chat__message-status--status--read{color:var(--rt-chat-status-read)}.rt-chat__message-status--status--failed{color:var(--rt-color-state-danger)}.rt-chat__status-icon{font-size:var(--rt-text-sm)}.rt-chat__message-skeleton{display:flex;max-width:min(80%,480px);flex-direction:column;align-self:flex-start;padding:var(--rt-space-2);border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0;background:var(--rt-chat-bubble-in-bg);gap:var(--rt-space-1)}.rt-chat__message-skeleton--own{align-self:flex-end;border-radius:var(--rt-chat-bubble-radius) var(--rt-chat-bubble-radius) 0 var(--rt-chat-bubble-radius);background:var(--rt-chat-bubble-own-bg)}.rt-chat__skeleton-line{display:block}.rt-chat__message-deeplink{display:flex;justify-content:flex-start;margin-top:var(--rt-space-1)}.rt-chat__composer,.rt-chat__composer-rich,.rt-chat__reply-block{margin-top:var(--rt-space-4)}.rt-chat__composer{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-chat__composer-files{display:flex;flex-wrap:wrap;gap:var(--rt-space-2)}.rt-chat__composer-field{display:flex;box-sizing:border-box;align-items:center;border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-input-radius);background-color:var(--rt-input-color-bg);gap:var(--rt-space-1);min-block-size:var(--rt-input-height);padding-inline:var(--rt-input-padding-x);transition:var(--rt-input-transition)}.rt-chat__composer-field:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow)}.rt-chat__composer-field--attach{padding-inline-start:var(--rt-space-1)}.rt-chat__composer-input{box-sizing:content-box;flex:1 1 auto;border:0;background:transparent;color:var(--rt-input-color-text);font-family:inherit;font-size:var(--rt-input-font-size);inline-size:100%;line-height:var(--rt-textarea-line-height);padding-block:var(--rt-space-2);resize:none}.rt-chat__composer-input::placeholder{color:var(--rt-input-color-text-placeholder);opacity:1}.rt-chat__composer-input:focus-visible{outline:none}.rt-chat__composer-input:disabled{cursor:not-allowed}.rt-chat__composer-send{inline-size:100%}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { thread: [{ type: i0.ViewChild, args: ['thread', { isSignal: true }] }], composerFileEl: [{ type: i0.ViewChild, args: ['composerFileEl', { isSignal: true }] }], messageActions: [{ type: i0.ContentChild, args: [i0.forwardRef(() => RtChatMessageActionsDirective), { isSignal: true }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], fetching: [{ type: i0.Input, args: [{ isSignal: true, alias: "fetching", required: false }] }], canReply: [{ type: i0.Input, args: [{ isSignal: true, alias: "canReply", required: false }] }], replyBlockReason: [{ type: i0.Input, args: [{ isSignal: true, alias: "replyBlockReason", required: false }] }], sending: [{ type: i0.Input, args: [{ isSignal: true, alias: "sending", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], emptyHint: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyHint", required: false }] }], hasThread: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasThread", required: false }] }], attachments: [{ type: i0.Input, args: [{ isSignal: true, alias: "attachments", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], richComposer: [{ type: i0.Input, args: [{ isSignal: true, alias: "richComposer", required: false }] }], formatting: [{ type: i0.Input, args: [{ isSignal: true, alias: "formatting", required: false }] }], formattingToolbar: [{ type: i0.Input, args: [{ isSignal: true, alias: "formattingToolbar", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], showRefresh: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRefresh", required: false }] }], showExpand: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExpand", required: false }] }], send: [{ type: i0.Output, args: ["send"] }], refresh: [{ type: i0.Output, args: ["refresh"] }], downloadFile: [{ type: i0.Output, args: ["downloadFile"] }], downloadAttachment: [{ type: i0.Output, args: ["downloadAttachment"] }], typing: [{ type: i0.Output, args: ["typing"] }], typingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "typingText", required: false }] }], expandedChange: [{ type: i0.Output, args: ["expandedChange"] }], deleteMessage: [{ type: i0.Output, args: ["deleteMessage"] }], retryMessage: [{ type: i0.Output, args: ["retryMessage"] }], messageHasActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "messageHasActions", required: false }] }] } });
 
 /**
  * Статус уже сохранённого своего сообщения: сервер знает только, дошло ли оно до