@snabcentr/client-ui 0.0.22 → 0.0.24

package/fesm2020/snabcentr-client-ui.mjs

@@ -1,16 +1,16 @@
 import { __decorate } from 'tslib';
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Component, ChangeDetectionStrategy, ContentChildren, Input, Output, HostBinding, HostListener, NgModule, Inject, ChangeDetectorRef, Optional, Self, ViewChild } from '@angular/core';
+import { Injectable, EventEmitter, Component, ChangeDetectionStrategy, ContentChildren, Input, Output, HostBinding, HostListener, NgModule, Inject, ChangeDetectorRef, Optional, Self, ViewChild, Directive, forwardRef } from '@angular/core';
 import { untilDestroyed, UntilDestroy } from '@ngneat/until-destroy';
 import { interval, filter, map, switchMap, skip } from 'rxjs';
 import * as i1 from '@snabcentr/client-core';
-import { SC_URLS, SC_PATH_IMAGE_NOT_FOUND } from '@snabcentr/client-core';
+import { SC_URLS, SC_PATH_IMAGE_NOT_FOUND, ScIconTypesEnum } from '@snabcentr/client-core';
 import * as i2 from '@angular/common';
 import { CommonModule, formatDate } from '@angular/common';
 import * as i3 from '@taiga-ui/core';
 import { TuiButtonModule, TuiModeModule, tuiFormatNumber, TuiSvgModule, TuiLabelModule, TuiTextfieldControllerModule, TuiHintModule, TuiLoaderModule, TuiLinkModule } from '@taiga-ui/core';
 import * as i5 from '@taiga-ui/kit';
-import { TuiCarouselModule, TuiPaginationModule, TUI_NUMBER_VALUE_TRANSFORMER, TuiInputNumberComponent, TuiInputNumberModule, TuiFieldErrorPipeModule, TuiElasticContainerModule } from '@taiga-ui/kit';
+import { TuiCarouselModule, TuiPaginationModule, TUI_NUMBER_VALUE_TRANSFORMER, TuiInputNumberComponent, TuiInputNumberModule, TuiFieldErrorPipeModule, TuiElasticContainerModule, TuiTreeService, TuiTreeItemContentComponent, TUI_TREE_START, TUI_TREE_CONTENT, TUI_TREE_LOADING, TUI_TREE_LOADER, TuiTreeModule } from '@taiga-ui/kit';
 import * as i6 from '@taiga-ui/cdk';
 import { tuiCreateToken, AbstractTuiNullableControl } from '@taiga-ui/cdk';
 import { RouterModule } from '@angular/router';
@@ -20,7 +20,7 @@ import { NgControl, FormControl, FormsModule, ReactiveFormsModule } from '@angul
 import * as i7 from '@taiga-ui/addon-preview';
 import { TuiPreviewDialogService, TuiPreviewModule } from '@taiga-ui/addon-preview';
 import * as i8 from '@tinkoff/ng-polymorpheus';
-import { PolymorpheusModule } from '@tinkoff/ng-polymorpheus';
+import { PolymorpheusModule, PolymorpheusComponent } from '@tinkoff/ng-polymorpheus';
 import * as i2$1 from 'ngx-echarts';
 import { NgxEchartsModule } from 'ngx-echarts';
 import * as echarts from 'echarts/core';
@@ -1249,6 +1249,286 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 }]
         }] });
 
+/**
+ * Сервис работающий с значками элементов дерева.
+ */
+class TreeIconService {
+    /**
+     * Назначает значок элементу дерева в зависимости от типа файла.
+     *
+     * @param info Объект пришедших данных о файле.
+     * @returns Возвращает название значка в виде строки.
+     */
+    getIconName(info) {
+        switch (info.getIcon()) {
+            case ScIconTypesEnum.iconImage:
+                return 'scIconImage';
+            case ScIconTypesEnum.iconPdfFile:
+                return 'scIconPdfFile';
+            case ScIconTypesEnum.iconWordFile:
+                return 'scIconWordFile';
+            case ScIconTypesEnum.iconExcelFile:
+                return 'scIconExcelFile';
+            case ScIconTypesEnum.iconFolder:
+                return 'scIconFolder';
+            default:
+                return 'scIconFile';
+        }
+    }
+    /**
+     * Проверяет на признак наличия дочерних элементов.
+     *
+     * @param info Объект пришедших данных о файле.
+     * @returns Возвращает true при наличии дочерних элементов и false при их отсутсвии.
+     */
+    hasChildren(info) {
+        return info.type === 'dir';
+    }
+}
+TreeIconService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeIconService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+TreeIconService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeIconService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeIconService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+/**
+ * Сервис для асинхронного раскрытия вложенности.
+ */
+class TreeLoaderService {
+    /**
+     * Инициализирует экземпляр класса {@link TreeLoaderService}
+     *
+     * @param filesService Сервис для получения файлов директории.
+     * @param iconService Сервис для определения и назначения значка элементу дерева.
+     */
+    constructor(filesService, iconService) {
+        this.filesService = filesService;
+        this.iconService = iconService;
+    }
+    /**
+     * Загружает дочерние элементы дерева.
+     *
+     * @param item Элемент дерева.
+     * @returns Массив дочерних элементов.
+     */
+    loadChildren(item) {
+        return item.id ? this.initData(item.id) : this.initData(undefined);
+    }
+    /**
+     * Проверяет указанный элемент дерева на наличие дочерних элементов и возвращает массив дочерних элементов, если они есть, либо пустой массив.
+     *
+     * @param node Элемент дерева.
+     * @returns Возвращает массив типа TreeNode[].
+     */
+    hasChildren(node) {
+        return node.hasChildren && !!node.id;
+    }
+    /**
+     * Загружает и заполняет массив дочерних элементов.
+     *
+     * @param id Идентификатор директории, чьи дочернии элементы загружаются.
+     * @returns Возвращает массив дочерних элементов.
+     */
+    initData(id) {
+        return this.filesService.getFiles(id).pipe(map((data) => data.map((item) => ({
+            text: item.name,
+            icon: this.iconService.getIconName(item),
+            hasChildren: this.iconService.hasChildren(item),
+            createdAt: item.createdAt,
+            id: item.id,
+            link: item.link,
+        }))));
+    }
+}
+TreeLoaderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeLoaderService, deps: [{ token: i1.ScFilesService }, { token: TreeIconService }], target: i0.ɵɵFactoryTarget.Injectable });
+TreeLoaderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeLoaderService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeLoaderService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1.ScFilesService }, { type: TreeIconService }]; } });
+
+/**
+ * Директива отвечающая за обработку действий над элементами дерева.
+ */
+class TreeDirective {
+    /**
+     * Инициализирует экземпляр класса {@link TreeDirective}.
+     *
+     * @param service Сервис для работы с деревом.
+     */
+    constructor(service) {
+        this.service = service;
+        /**
+         * Карта данных дерева.
+         */
+        this.map = new Map();
+        /**
+         * Проверяет указанный элемент дерева на наличие дочерних элементов и возвращает массив дочерних элементов, если они есть, либо пустой массив.
+         *
+         * @param node Элемент дерева.
+         * @returns Возвращает массив типа TreeNode[].
+         */
+        this.childrenHandler = (node) => (node.hasChildren ? this.service.getChildren(node) : []);
+    }
+    /**
+     * Обрабатывает нажатие на указанный элемент дерева.
+     *
+     * @param node Элемент дерева.
+     */
+    onToggled(node) {
+        this.service.loadChildren(node);
+    }
+}
+TreeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeDirective, deps: [{ token: i5.TuiTreeService }], target: i0.ɵɵFactoryTarget.Directive });
+TreeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: TreeDirective, selector: "[scTree]", providers: [TuiTreeService], exportAs: ["scTree"], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scTree]',
+                    exportAs: 'scTree',
+                    providers: [TuiTreeService],
+                }]
+        }], ctorParameters: function () { return [{ type: i5.TuiTreeService }]; } });
+
+/**
+ * Компонент для удаления стандартного значка элемента дерева.
+ */
+class FileTreeItemComponent extends TuiTreeItemContentComponent {
+}
+FileTreeItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileTreeItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+FileTreeItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FileTreeItemComponent, selector: "sc-file-tree-item", host: { listeners: { "click": "onClick()" } }, usesInheritance: true, ngImport: i0, template: "<ng-container [ngTemplateOutlet]=\"context.template\"></ng-container>\n", styles: [":host{position:relative;height:var(--tui-height-s);display:flex;align-items:center;padding:0 .5rem;border-radius:var(--tui-radius-xs);background:var(--tui-base-01)}:host:before,:host:after{content:\"\";position:absolute;left:-.75rem;z-index:-1}:host:before{width:1rem;border-bottom:1px solid var(--tui-base-04)}:host:after{top:-1rem;bottom:1rem;border-left:1px solid var(--tui-base-04)}:host._expandable:hover{cursor:pointer;background:var(--tui-base-02)}tui-svg{position:relative;background:inherit;z-index:1}\n"], dependencies: [{ kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FileTreeItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sc-file-tree-item', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '(click)': `onClick()`,
+                    }, template: "<ng-container [ngTemplateOutlet]=\"context.template\"></ng-container>\n", styles: [":host{position:relative;height:var(--tui-height-s);display:flex;align-items:center;padding:0 .5rem;border-radius:var(--tui-radius-xs);background:var(--tui-base-01)}:host:before,:host:after{content:\"\";position:absolute;left:-.75rem;z-index:-1}:host:before{width:1rem;border-bottom:1px solid var(--tui-base-04)}:host:after{top:-1rem;bottom:1rem;border-left:1px solid var(--tui-base-04)}:host._expandable:hover{cursor:pointer;background:var(--tui-base-02)}tui-svg{position:relative;background:inherit;z-index:1}\n"] }]
+        }] });
+
+/* eslint-disable @angular-eslint/no-input-rename */
+/**
+ * Директива отвечающая за корневые элементы дерева.
+ */
+class TreeTopDirective {
+    constructor() {
+        /**
+         * Отображаемое имя корневого элемента дерева.
+         */
+        this.text = '';
+    }
+}
+TreeTopDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeTopDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+TreeTopDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: TreeTopDirective, selector: "[scTopNodeText]", inputs: { text: ["scTopNodeText", "text"], icon: ["scTopNodeIcon", "icon"], link: ["scTopNodeLink", "link"], hasChildren: ["scTopNodeChilds", "hasChildren"], id: ["scTopNodeParent", "id"], createdAt: ["scTopNodeDate", "createdAt"] }, providers: [
+        {
+            provide: TUI_TREE_START,
+            useExisting: forwardRef(() => TreeTopDirective),
+        },
+        {
+            provide: TUI_TREE_CONTENT,
+            useValue: new PolymorpheusComponent(FileTreeItemComponent),
+        },
+    ], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TreeTopDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scTopNodeText]',
+                    providers: [
+                        {
+                            provide: TUI_TREE_START,
+                            useExisting: forwardRef(() => TreeTopDirective),
+                        },
+                        {
+                            provide: TUI_TREE_CONTENT,
+                            useValue: new PolymorpheusComponent(FileTreeItemComponent),
+                        },
+                    ],
+                }]
+        }], propDecorators: { text: [{
+                type: Input,
+                args: ['scTopNodeText']
+            }], icon: [{
+                type: Input,
+                args: ['scTopNodeIcon']
+            }], link: [{
+                type: Input,
+                args: ['scTopNodeLink']
+            }], hasChildren: [{
+                type: Input,
+                args: ['scTopNodeChilds']
+            }], id: [{
+                type: Input,
+                args: ['scTopNodeParent']
+            }], createdAt: [{
+                type: Input,
+                args: ['scTopNodeDate']
+            }] } });
+
+/**
+ * Компонент файлов и документов.
+ */
+class FilesAndDocumentsComponent {
+    /**
+     * Инициализирует экземпляр класса {@link FilesAndDocumentsComponent}.
+     *
+     * @param loading Объект отвечающий за значок загрузки, в момент раскрытия элемента дерева.
+     * @param iconService Сервис для определения и назначения значка элементу дерева.
+     * @param filesService Сервис для загрузки файлов.
+     */
+    constructor(loading, iconService, filesService) {
+        this.loading = loading;
+        this.iconService = iconService;
+        this.filesService = filesService;
+        /**
+         * Данные визуализации и их начальное получение.
+         */
+        this.data$ = this.filesService.getFiles().pipe(map((data) => data.map((item) => ({
+            text: item.name,
+            icon: this.iconService.getIconName(item),
+            hasChildren: this.iconService.hasChildren(item),
+            createdAt: item.createdAt,
+            id: item.id,
+            link: item.link,
+        }))));
+    }
+}
+FilesAndDocumentsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilesAndDocumentsComponent, deps: [{ token: TUI_TREE_LOADING }, { token: TreeIconService }, { token: i1.ScFilesService }], target: i0.ɵɵFactoryTarget.Component });
+FilesAndDocumentsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FilesAndDocumentsComponent, selector: "sc-files-and-documents", providers: [
+        {
+            provide: TUI_TREE_LOADER,
+            useClass: TreeLoaderService,
+        },
+    ], ngImport: i0, template: "<ng-container *ngIf=\"data$ | async as data; else skeleton\">\n    <tui-tree\n        *ngFor=\"let node of data\"\n        #tree=\"scTree\"\n        scTree\n        [scTopNodeText]=\"node.text\"\n        [scTopNodeIcon]=\"node.icon\"\n        [scTopNodeLink]=\"node.link\"\n        [scTopNodeChilds]=\"node.hasChildren\"\n        [scTopNodeParent]=\"node.id\"\n        [scTopNodeDate]=\"node.createdAt\"\n        [childrenHandler]=\"tree.childrenHandler\"\n        [content]=\"content\"\n        [map]=\"tree.map\"\n        [tuiTreeController]=\"false\"\n        [value]=\"tree.service.data$ | async\"\n        (toggled)=\"tree.onToggled($event)\"\n        class=\"overflow-hidden\"\n    ></tui-tree>\n</ng-container>\n\n<ng-template #content let-item>\n    <tui-loader *ngIf=\"item === loading; else text\" class=\"w-8 my-4\"></tui-loader>\n    <ng-template #text>\n        <tui-svg [src]=\"item.icon\" class=\"tui-space_right-2\"></tui-svg>\n        <a tuiLink [pseudo]=\"true\" *ngIf=\"item.link\" href=\"{{ item.link }}\" class=\"grow\">{{ item.text }}</a>\n        <p *ngIf=\"!item.link\" class=\"grow\">{{ item.text }}</p>\n        <p>{{ item.createdAt }}</p>\n    </ng-template>\n</ng-template>\n\n<ng-template #skeleton>\n    <div class=\"flex flex-col gap-2\">\n        <div *ngFor=\"let _ of [].constructor(7)\" class=\"flex items-center gap-2\">\n            <div class=\"tui-skeleton h-6 w-6\"></div>\n            <div class=\"tui-skeleton h-4 w-40\"></div>\n        </div>\n    </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.TuiTreeComponent, selector: "tui-tree[value]", inputs: ["value", "trackBy", "content"] }, { kind: "directive", type: i5.TuiTreeChildrenDirective, selector: "tui-tree[childrenHandler]", inputs: ["childrenHandler"] }, { kind: "directive", type: i5.TuiTreeControllerDirective, selector: "[tuiTreeController][map]", inputs: ["tuiTreeController", "map"], outputs: ["toggled"], exportAs: ["tuiTreeController"] }, { kind: "component", type: i3.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { kind: "component", type: i3.TuiLoaderComponent, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "component", type: i3.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { kind: "directive", type: TreeDirective, selector: "[scTree]", exportAs: ["scTree"] }, { kind: "directive", type: TreeTopDirective, selector: "[scTopNodeText]", inputs: ["scTopNodeText", "scTopNodeIcon", "scTopNodeLink", "scTopNodeChilds", "scTopNodeParent", "scTopNodeDate"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilesAndDocumentsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sc-files-and-documents', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: TUI_TREE_LOADER,
+                            useClass: TreeLoaderService,
+                        },
+                    ], template: "<ng-container *ngIf=\"data$ | async as data; else skeleton\">\n    <tui-tree\n        *ngFor=\"let node of data\"\n        #tree=\"scTree\"\n        scTree\n        [scTopNodeText]=\"node.text\"\n        [scTopNodeIcon]=\"node.icon\"\n        [scTopNodeLink]=\"node.link\"\n        [scTopNodeChilds]=\"node.hasChildren\"\n        [scTopNodeParent]=\"node.id\"\n        [scTopNodeDate]=\"node.createdAt\"\n        [childrenHandler]=\"tree.childrenHandler\"\n        [content]=\"content\"\n        [map]=\"tree.map\"\n        [tuiTreeController]=\"false\"\n        [value]=\"tree.service.data$ | async\"\n        (toggled)=\"tree.onToggled($event)\"\n        class=\"overflow-hidden\"\n    ></tui-tree>\n</ng-container>\n\n<ng-template #content let-item>\n    <tui-loader *ngIf=\"item === loading; else text\" class=\"w-8 my-4\"></tui-loader>\n    <ng-template #text>\n        <tui-svg [src]=\"item.icon\" class=\"tui-space_right-2\"></tui-svg>\n        <a tuiLink [pseudo]=\"true\" *ngIf=\"item.link\" href=\"{{ item.link }}\" class=\"grow\">{{ item.text }}</a>\n        <p *ngIf=\"!item.link\" class=\"grow\">{{ item.text }}</p>\n        <p>{{ item.createdAt }}</p>\n    </ng-template>\n</ng-template>\n\n<ng-template #skeleton>\n    <div class=\"flex flex-col gap-2\">\n        <div *ngFor=\"let _ of [].constructor(7)\" class=\"flex items-center gap-2\">\n            <div class=\"tui-skeleton h-6 w-6\"></div>\n            <div class=\"tui-skeleton h-4 w-40\"></div>\n        </div>\n    </div>\n</ng-template>\n" }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [TUI_TREE_LOADING]
+                }] }, { type: TreeIconService }, { type: i1.ScFilesService }]; } });
+
+/**
+ * Модуль файлов и документов.
+ */
+class FilesAndDocumentsModule {
+}
+FilesAndDocumentsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilesAndDocumentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+FilesAndDocumentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: FilesAndDocumentsModule, declarations: [FilesAndDocumentsComponent, TreeDirective, TreeTopDirective, FileTreeItemComponent], imports: [CommonModule, TuiTreeModule, TuiSvgModule, TuiLoaderModule, TuiLinkModule], exports: [FilesAndDocumentsComponent] });
+FilesAndDocumentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilesAndDocumentsModule, imports: [CommonModule, TuiTreeModule, TuiSvgModule, TuiLoaderModule, TuiLinkModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilesAndDocumentsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, TuiTreeModule, TuiSvgModule, TuiLoaderModule, TuiLinkModule],
+                    declarations: [FilesAndDocumentsComponent, TreeDirective, TreeTopDirective, FileTreeItemComponent],
+                    exports: [FilesAndDocumentsComponent],
+                }]
+        }] });
+
 /**
  * Список иконок.
  * TODO: TASK[#7779] Добавить иконки отдельных значков для соц. сетей после добавления их в кит дизайна.
@@ -1376,10 +1656,10 @@ class ScShareButtonComponent {
     }
 }
 ScShareButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScShareButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ScShareButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScShareButtonComponent, selector: "sc-share-button", inputs: { appearance: "appearance", size: "size" }, outputs: { clickShareEvent: "clickShareEvent" }, ngImport: i0, template: "<button tuiIconButton icon=\"scIconShare\" [appearance]=\"appearance\" [size]=\"size\" (click)=\"clickShareEvent.emit()\"></button>\n", dependencies: [{ kind: "component", type: i3.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ScShareButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScShareButtonComponent, selector: "sc-share-button", inputs: { appearance: "appearance", size: "size" }, outputs: { clickShareEvent: "clickShareEvent" }, ngImport: i0, template: "<button tuiIconButton icon=\"scIconShare\" [appearance]=\"appearance\" [size]=\"size\" (click)=\"$event.stopPropagation(); clickShareEvent.emit()\"></button>\n", dependencies: [{ kind: "component", type: i3.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScShareButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-share-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button tuiIconButton icon=\"scIconShare\" [appearance]=\"appearance\" [size]=\"size\" (click)=\"clickShareEvent.emit()\"></button>\n" }]
+            args: [{ selector: 'sc-share-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button tuiIconButton icon=\"scIconShare\" [appearance]=\"appearance\" [size]=\"size\" (click)=\"$event.stopPropagation(); clickShareEvent.emit()\"></button>\n" }]
         }], propDecorators: { appearance: [{
                 type: Input
             }], size: [{
@@ -1404,10 +1684,10 @@ class ScNewsCardComponent {
     }
 }
 ScNewsCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScNewsCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ScNewsCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScNewsCardComponent, selector: "sc-news-card", inputs: { news: "news" }, outputs: { clickCardEvent: "clickCardEvent", clickShareEvent: "clickShareEvent" }, ngImport: i0, template: "<div (click)=\"clickCardEvent.emit(news)\" class=\"block relative h-82 w-70 cursor-pointer shadow-sc-2 rounded-lg overflow-hidden bg-white\">\n    <div [style.background-image]=\"'url(' + news.image + ')'\" class=\"bg-no-repeat bg-center bg-cover bg-tui-base-02 w-full h-50\"></div>\n    <div class=\"px-6 py-4.5 h-32 w-full bg-white overflow-hidden\">\n        <div class=\"w-full flex justify-between align-baseline mb-2.5\">\n            <p class=\"text-sm text-tui-text-02\">{{ news.created_at }}</p>\n            <sc-share-button (clickShareEvent)=\"clickShareEvent.emit()\"></sc-share-button>\n        </div>\n        <p>\n            <a class=\"text-sm font-bold text-black line-clamp-3\">{{ news.subject }}</a>\n        </p>\n    </div>\n</div>\n", dependencies: [{ kind: "component", type: ScShareButtonComponent, selector: "sc-share-button", inputs: ["appearance", "size"], outputs: ["clickShareEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ScNewsCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScNewsCardComponent, selector: "sc-news-card", inputs: { news: "news" }, outputs: { clickCardEvent: "clickCardEvent", clickShareEvent: "clickShareEvent" }, ngImport: i0, template: "<div (click)=\"clickCardEvent.emit(news)\" class=\"block relative h-82 w-70 cursor-pointer shadow-sc-2 rounded-lg overflow-hidden bg-white\">\n    <div [style.background-image]=\"'url(' + news.image + ')'\" class=\"bg-no-repeat bg-center bg-cover bg-tui-base-02 w-full h-50\"></div>\n    <div class=\"px-6 py-4.5 h-32 w-full w-full flex justify-between align-baseline bg-white overflow-hidden\">\n        <div class=\"flex flex-col gap-2.5\">\n            <p class=\"text-sm text-tui-text-02\">{{ news.created_at }}</p>\n            <a class=\"text-sm font-bold text-black line-clamp-3\">{{ news.subject }}</a>\n        </div>\n        <sc-share-button (clickShareEvent)=\"clickShareEvent.emit()\"></sc-share-button>\n    </div>\n</div>\n", dependencies: [{ kind: "component", type: ScShareButtonComponent, selector: "sc-share-button", inputs: ["appearance", "size"], outputs: ["clickShareEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScNewsCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-news-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"clickCardEvent.emit(news)\" class=\"block relative h-82 w-70 cursor-pointer shadow-sc-2 rounded-lg overflow-hidden bg-white\">\n    <div [style.background-image]=\"'url(' + news.image + ')'\" class=\"bg-no-repeat bg-center bg-cover bg-tui-base-02 w-full h-50\"></div>\n    <div class=\"px-6 py-4.5 h-32 w-full bg-white overflow-hidden\">\n        <div class=\"w-full flex justify-between align-baseline mb-2.5\">\n            <p class=\"text-sm text-tui-text-02\">{{ news.created_at }}</p>\n            <sc-share-button (clickShareEvent)=\"clickShareEvent.emit()\"></sc-share-button>\n        </div>\n        <p>\n            <a class=\"text-sm font-bold text-black line-clamp-3\">{{ news.subject }}</a>\n        </p>\n    </div>\n</div>\n" }]
+            args: [{ selector: 'sc-news-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"clickCardEvent.emit(news)\" class=\"block relative h-82 w-70 cursor-pointer shadow-sc-2 rounded-lg overflow-hidden bg-white\">\n    <div [style.background-image]=\"'url(' + news.image + ')'\" class=\"bg-no-repeat bg-center bg-cover bg-tui-base-02 w-full h-50\"></div>\n    <div class=\"px-6 py-4.5 h-32 w-full w-full flex justify-between align-baseline bg-white overflow-hidden\">\n        <div class=\"flex flex-col gap-2.5\">\n            <p class=\"text-sm text-tui-text-02\">{{ news.created_at }}</p>\n            <a class=\"text-sm font-bold text-black line-clamp-3\">{{ news.subject }}</a>\n        </div>\n        <sc-share-button (clickShareEvent)=\"clickShareEvent.emit()\"></sc-share-button>\n    </div>\n</div>\n" }]
         }], propDecorators: { news: [{
                 type: Input
             }], clickCardEvent: [{
@@ -1565,5 +1845,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { SC_LINEAR_VALUES, SC_LINEAR_VALUES_TOKEN, ScBannerComponent, ScBannerModule, ScCartItemMobileComponent, ScCartModule, ScCatalogModule, ScCategoryCardComponent, ScFavoriteBtnComponent, ScInputQuantityComponent, ScNewsCardComponent, ScNewsCardSkeletonComponent, ScNewsModule, ScOrderItemMobileComponent, ScOrderModule, ScPriceCardComponent, ScPriceHistoryComponent, ScPriceWarehouseStockComponent, ScShareButtonComponent, ScShareButtonModule, scClientUiIconsName, stepValidator };
+export { FilesAndDocumentsComponent, FilesAndDocumentsModule, SC_LINEAR_VALUES, SC_LINEAR_VALUES_TOKEN, ScBannerComponent, ScBannerModule, ScCartItemMobileComponent, ScCartModule, ScCatalogModule, ScCategoryCardComponent, ScFavoriteBtnComponent, ScInputQuantityComponent, ScNewsCardComponent, ScNewsCardSkeletonComponent, ScNewsModule, ScOrderItemMobileComponent, ScOrderModule, ScPriceCardComponent, ScPriceHistoryComponent, ScPriceWarehouseStockComponent, ScShareButtonComponent, ScShareButtonModule, TreeDirective, TreeIconService, TreeLoaderService, TreeTopDirective, scClientUiIconsName, stepValidator };
 //# sourceMappingURL=snabcentr-client-ui.mjs.map