@progress/kendo-angular-conversational-ui/esm2022/chat/chat-file.component.mjs

Kendo UI for Angular Conversational UI components

/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
/* eslint-disable @typescript-eslint/no-empty-function */
import { Component, forwardRef, Input, Output, EventEmitter } from '@angular/core';
import { ChatItem } from './chat-item';
import { fileGroupClass, fileSVGGroupIcon, getTotalFilesSizeMessage } from '@progress/kendo-angular-upload';
import { IconWrapperComponent } from '@progress/kendo-angular-icons';
import { moreVerticalIcon, xIcon } from '@progress/kendo-svg-icons';
import { ButtonComponent, DropDownButtonComponent } from '@progress/kendo-angular-buttons';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import * as i0 from "@angular/core";
import * as i1 from "@progress/kendo-angular-l10n";
/**
 * @hidden
 */
export class ChatFileComponent extends ChatItem {
    localization;
    chatFile;
    removable = false;
    fileActions;
    remove = new EventEmitter();
    actionClick = new EventEmitter();
    actionsToggle = new EventEmitter();
    actionButtonClick = new EventEmitter();
    deleteIcon = xIcon;
    moreIcon = moreVerticalIcon;
    constructor(localization) {
        super();
        this.localization = localization;
    }
    fileThumbnail(extension) {
        return fileSVGGroupIcon(extension);
    }
    fileGroupClass(extension) {
        return fileGroupClass(extension);
    }
    getTotalFilesSizeMessage(file) {
        return getTotalFilesSizeMessage([file]);
    }
    textFor(key) {
        return this.localization.get(key);
    }
    focus() { }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChatFileComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ChatFileComponent, isStandalone: true, selector: "li[chatFile]", inputs: { chatFile: "chatFile", removable: "removable", fileActions: "fileActions" }, outputs: { remove: "remove", actionClick: "actionClick", actionsToggle: "actionsToggle", actionButtonClick: "actionButtonClick" }, providers: [{
                provide: ChatItem,
                useExisting: forwardRef(() => ChatFileComponent)
            }], usesInheritance: true, ngImport: i0, template: `
        <kendo-icon-wrapper
          size="xlarge"
          [name]="fileGroupClass(chatFile.extension)"
          [svgIcon]="fileThumbnail(chatFile.extension)"
          >
        </kendo-icon-wrapper>
        <div class="k-chat-file-info">
          <span class="k-chat-file-name">{{chatFile.name}}</span>
          <span class="k-chat-file-size">{{getTotalFilesSizeMessage(chatFile)}}</span>
        </div>
        @if (removable) {
          <button
            kendoButton
            [attr.title]="textFor('removeFileTitle')"
            [svgIcon]="deleteIcon"
            (click)="remove.emit(chatFile)"
            fillMode="flat"
          ></button>
        }
        @if (fileActions && fileActions.length > 0) {
          <kendo-dropdownbutton
            [data]="fileActions"
            [attr.title]="textFor('fileActionsTitle')"
            fillMode="flat"
            icon="more-vertical"
            [svgIcon]="moreIcon"
            (itemClick)="actionClick.emit($event)"
            (click)="$event.preventDefault()"
            (open)="actionsToggle.emit(true)"
            (close)="actionsToggle.emit(false)"
          ></kendo-dropdownbutton>
        }
        `, isInline: true, dependencies: [{ kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: DropDownButtonComponent, selector: "kendo-dropdownbutton", inputs: ["arrowIcon", "icon", "svgIcon", "iconClass", "imageUrl", "textField", "data", "size", "rounded", "fillMode", "themeColor", "buttonAttributes"], outputs: ["itemClick", "focus", "blur"], exportAs: ["kendoDropDownButton"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChatFileComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'li[chatFile]',
                    providers: [{
                            provide: ChatItem,
                            useExisting: forwardRef(() => ChatFileComponent)
                        }],
                    template: `
        <kendo-icon-wrapper
          size="xlarge"
          [name]="fileGroupClass(chatFile.extension)"
          [svgIcon]="fileThumbnail(chatFile.extension)"
          >
        </kendo-icon-wrapper>
        <div class="k-chat-file-info">
          <span class="k-chat-file-name">{{chatFile.name}}</span>
          <span class="k-chat-file-size">{{getTotalFilesSizeMessage(chatFile)}}</span>
        </div>
        @if (removable) {
          <button
            kendoButton
            [attr.title]="textFor('removeFileTitle')"
            [svgIcon]="deleteIcon"
            (click)="remove.emit(chatFile)"
            fillMode="flat"
          ></button>
        }
        @if (fileActions && fileActions.length > 0) {
          <kendo-dropdownbutton
            [data]="fileActions"
            [attr.title]="textFor('fileActionsTitle')"
            fillMode="flat"
            icon="more-vertical"
            [svgIcon]="moreIcon"
            (itemClick)="actionClick.emit($event)"
            (click)="$event.preventDefault()"
            (open)="actionsToggle.emit(true)"
            (close)="actionsToggle.emit(false)"
          ></kendo-dropdownbutton>
        }
        `,
                    standalone: true,
                    imports: [IconWrapperComponent, ButtonComponent, DropDownButtonComponent]
                }]
        }], ctorParameters: () => [{ type: i1.LocalizationService }], propDecorators: { chatFile: [{
                type: Input
            }], removable: [{
                type: Input
            }], fileActions: [{
                type: Input
            }], remove: [{
                type: Output
            }], actionClick: [{
                type: Output
            }], actionsToggle: [{
                type: Output
            }], actionButtonClick: [{
                type: Output
            }] } });