npm - @c8y/ngx-components - Versions diffs - 1022.33.0 → 1022.35.1 - Mend

@c8y/ngx-components 1022.33.0 → 1022.35.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (82) hide show

package/fesm2022/c8y-ngx-components-static-assets-modal.mjs CHANGED Viewed

@@ -1,53 +1,155 @@
 import * as i0 from '@angular/core';
-import { Input, Component } from '@angular/core';
-import * as i1 from 'ngx-bootstrap/modal';
-import { Subject, merge, from } from 'rxjs';
-import * as i2 from '@c8y/ngx-components/static-assets/data';
-import { shareReplay, map, tap, first } from 'rxjs/operators';
-import { NgFor, NgIf, AsyncPipe, DatePipe } from '@angular/common';
-import * as i3 from '@c8y/ngx-components';
-import { gettext, CoreModule } from '@c8y/ngx-components';
-import * as i4 from 'ngx-bootstrap/popover';
-import { PopoverModule } from 'ngx-bootstrap/popover';
-import * as i5 from 'ngx-bootstrap/collapse';
+import { Pipe, output, input, viewChild, inject, Component, Input } from '@angular/core';
+import * as i1$1 from 'ngx-bootstrap/modal';
+import { DropAreaComponent, AlertService, DatePipe, BytesPipe, LoadingComponent, C8yTranslatePipe, C8yTranslateDirective, MessagesComponent, ListGroupComponent, ListItemComponent, ListItemIconComponent, ListItemBodyComponent, IconDirective, ModalComponent } from '@c8y/ngx-components';
+import { gettext } from '@c8y/ngx-components/gettext';
+import { NgForOf, NgIf, AsyncPipe, NgStyle, NgClass, NgSwitch, NgSwitchCase, NgSwitchDefault } from '@angular/common';
+import * as i1 from 'ngx-bootstrap/collapse';
 import { CollapseModule } from 'ngx-bootstrap/collapse';
+import { PopoverDirective } from 'ngx-bootstrap/popover';
+import { Subject, merge, combineLatest, firstValueFrom } from 'rxjs';
+import { switchMap, shareReplay, map, tap, first } from 'rxjs/operators';
+import { StaticAssetsService } from '@c8y/ngx-components/static-assets/data';
+import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { TranslateService } from '@ngx-translate/core';
-class StaticAssetsModalComponent {
-    constructor(modalRef, staticAssets) {
-        this.modalRef = modalRef;
-        this.staticAssets = staticAssets;
-        this.assetType = 'branding';
-        this.supportedFileExtensions = [];
-        this.modalTitle = gettext('Select asset');
-        this.layout = 'grid';
-        this.accept = '';
+class StaticAssetMainTypePipe {
+    constructor() {
+        this.supportedTypes = ['image', 'font'];
+    }
+    transform(value) {
+        if (!value?.type) {
+            return 'unknown';
+        }
+        const typePrefix = value.type.replace(/\/.*$/, '');
+        if (this.supportedTypes.includes(typePrefix)) {
+            return typePrefix;
+        }
+        return 'unknown';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetMainTypePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetMainTypePipe, isStandalone: true, name: "staticAssetMainType" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetMainTypePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'staticAssetMainType',
+                    pure: true,
+                    standalone: true
+                }]
+        }] });
+class StaticAssetsFileListComponent {
+    constructor() {
+        this.itemSelected = output();
+        this.inModalView = input(false);
+        this.assetType = input('branding');
+        this.supportedFileExtensions = input([]);
+        this.layout = input('grid');
         this.isExpanded = false;
         this._filesUpdate$ = new Subject();
-        this.result = new Promise((resolve, reject) => {
-            this.resolve = resolve;
-            this.reject = reject;
-        });
-    }
-    ngOnInit() {
-        this._unfilteredFiles$ = merge(this._filesUpdate$, from(this.staticAssets.listFiles(this.assetType))).pipe(shareReplay(1));
-        this.files$ = this._unfilteredFiles$.pipe(map(files => this.supportedFileExtensions
-            ? files.filter(tmp => this.supportedFileExtensions.includes(tmp.extension.toLowerCase()))
+        this.styleTagId = `static-assets-font-faces`;
+        this.dropArea = viewChild(DropAreaComponent);
+        this.alert = inject(AlertService);
+        this.translate = inject(TranslateService);
+        this.staticAssets = inject(StaticAssetsService);
+        this._unfilteredFiles$ = merge(toObservable(this.assetType).pipe(switchMap(assetType => this.staticAssets.listFiles(assetType))), this._filesUpdate$).pipe(shareReplay({ bufferSize: 1, refCount: true }));
+        this.files$ = combineLatest([
+            this._unfilteredFiles$,
+            toObservable(this.supportedFileExtensions)
+        ]).pipe(map(([files, supportedFileExtensions]) => supportedFileExtensions?.length
+            ? files.filter(tmp => supportedFileExtensions.includes(tmp.extension.toLowerCase()))
             : files), map(files => files.sort((a, b) => (a.addedAt < b.addedAt ? 1 : a.addedAt > b.addedAt ? -1 : 0))), tap(files => {
             if (!files.length) {
                 this.isExpanded = true;
             }
-        }));
-        if (this.supportedFileExtensions) {
-            this.accept = this.supportedFileExtensions.join(',');
-        }
+        }), shareReplay({ bufferSize: 1, refCount: true }));
+        this.accept$ = toObservable(this.supportedFileExtensions).pipe(map(exts => exts.join(',')));
+        this.files$.pipe(takeUntilDestroyed()).subscribe(files => this.applyStylesForFiles(files));
+    }
+    ngOnDestroy() {
+        this.removeStyleTag();
     }
     async addFiles(files) {
         if (!files?.length) {
             return;
         }
-        const existingFiles = await this._unfilteredFiles$.pipe(first()).toPromise();
-        const newFiles = await this.staticAssets.addFilesToStaticAssets(this.assetType, files, existingFiles);
-        this._filesUpdate$.next(newFiles);
+        this.dropArea().loading = true;
+        try {
+            const existingFiles = await firstValueFrom(this._unfilteredFiles$.pipe(first()));
+            const updatedFiles = await this.staticAssets.addFilesToStaticAssets(this.assetType(), files, existingFiles);
+            this._filesUpdate$.next(updatedFiles);
+        }
+        catch (e) {
+            this.alert.danger(this.translate.instant(gettext('Failed to upload asset.')), e?.message);
+        }
+        this.dropArea().files = null;
+        this.dropArea().loading = false;
+    }
+    select(asset) {
+        this.itemSelected.emit(asset);
+    }
+    applyStylesForFiles(files) {
+        this.removeStyleTag();
+        const styles = files
+            .filter(file => file.type.startsWith('font/'))
+            .map(file => `@font-face { font-family: '${file.hashSum}'; src: url('${file.path}'); }`)
+            .join('\n');
+        if (!styles) {
+            return;
+        }
+        const styleTag = document.createElement('style');
+        styleTag.id = this.styleTagId;
+        styleTag.innerHTML = styles;
+        styleTag.type = 'text/css';
+        document.body.appendChild(styleTag);
+    }
+    removeStyleTag() {
+        document.getElementById(this.styleTagId)?.remove();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetsFileListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.15", type: StaticAssetsFileListComponent, isStandalone: true, selector: "c8y-static-assets-file-list", inputs: { inModalView: { classPropertyName: "inModalView", publicName: "inModalView", isSignal: true, isRequired: false, transformFunction: null }, assetType: { classPropertyName: "assetType", publicName: "assetType", isSignal: true, isRequired: false, transformFunction: null }, supportedFileExtensions: { classPropertyName: "supportedFileExtensions", publicName: "supportedFileExtensions", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelected: "itemSelected" }, viewQueries: [{ propertyName: "dropArea", first: true, predicate: DropAreaComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container *ngIf=\"files$ | async as assets; else loading\">\n  <div\n    class=\"text-center sticky-top separator-bottom bg-component\"\n    style=\"z-index: 1001\"\n  >\n    <p\n      class=\"m-0 p-16\"\n      *ngIf=\"assets.length\"\n    >\n      {{ 'Select from the list below or`first part, followed by upload a new asset`' | translate }}\n      <button\n        class=\"btn-link\"\n        aria-controls=\"collapseUpload\"\n        [attr.aria-expanded]=\"isExpanded\"\n        (click)=\"isExpanded = !isExpanded\"\n      >\n        {{ 'upload a new asset' | translate }}\n      </button>\n    </p>\n    <div\n      class=\"collapse\"\n      id=\"collapseUpload\"\n      [isAnimated]=\"true\"\n      [collapse]=\"!isExpanded\"\n    >\n      <div class=\"p-t-24 p-l-24 p-r-24 bg-level-1 separator-top-bottom p-b-32\">\n        <c8y-drop-area\n          class=\"drop-area-sm m-b-8\"\n          [icon]=\"'upload'\"\n          [accept]=\"accept$ | async\"\n          (dropped)=\"addFiles($event)\"\n        ></c8y-drop-area>\n        <c8y-messages\n          [helpMessage]=\"\n            'After uploading, the asset will be visible in the list below.' | translate\n          \"\n        ></c8y-messages>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"assets.length\">\n    <c8y-list-group\n      class=\"m-b-0\"\n      *ngIf=\"layout() != 'grid'\"\n    >\n      <c8y-list-item *ngFor=\"let asset of assets\">\n        <c8y-list-item-icon icon=\"file\"></c8y-list-item-icon>\n\n        <c8y-list-item-body>\n          <div class=\"row\">\n            <div class=\"col-md-3 col-xs-12 d-flex a-i-center\">\n              <div\n                class=\"text-truncate\"\n                title=\"{{ asset.fileName }}\"\n              >\n                {{ asset.fileName }}\n              </div>\n              <button\n                class=\"btn-dot m-l-4\"\n                [title]=\"'Preview' | translate\"\n                [popover]=\"preview\"\n                placement=\"end\"\n                triggers=\"focus\"\n                container=\"body\"\n                [adaptivePosition]=\"false\"\n              >\n                <i [c8yIcon]=\"'eye'\"></i>\n              </button>\n              <ng-template #preview>\n                <div class=\"bg-checkered\">\n                  <img\n                    class=\"fit-w\"\n                    [alt]=\"asset.fileName\"\n                    [src]=\"asset.path\"\n                  />\n                </div>\n              </ng-template>\n            </div>\n            <div class=\"col-md-3 col-xs-12 text-muted\">\n              <code class=\"text-10\">{{ asset.type }}</code>\n            </div>\n            <div class=\"col-md-2 col-xs-12 text-muted\">\n              <span class=\"small\">{{ asset.size | bytes }}</span>\n            </div>\n            <div\n              class=\"col-md-2 col-xs-12 text-muted\"\n              [title]=\"asset.addedAt | c8yDate\"\n            >\n              <div class=\"icon-flex small\">\n                <i\n                  class=\"m-r-4\"\n                  [c8yIcon]=\"'calendar'\"\n                ></i>\n                <span>{{ asset.addedAt | c8yDate }}</span>\n              </div>\n            </div>\n            <div class=\"col-md-2 col-xs-12 d-flex\">\n              <button\n                class=\"btn btn-default btn-sm m-l-auto showOnHover\"\n                (click)=\"select(asset)\"\n                translate\n              >\n                Select\n              </button>\n            </div>\n          </div>\n        </c8y-list-item-body>\n      </c8y-list-item>\n    </c8y-list-group>\n    <div\n      class=\"card-group-block interact-grid\"\n      *ngIf=\"layout() === 'grid'\"\n    >\n      <button\n        class=\"card btn-clean interact pointer\"\n        [ngClass]=\"{\n          'col-md-3 col-sm-4 col-xs-12': inModalView(),\n          'col-md-1 col-sm-3 col-xs-12': !inModalView()\n        }\"\n        *ngFor=\"let asset of assets\"\n        (click)=\"select(asset)\"\n      >\n        <div class=\"card-block\">\n          <ng-container [ngSwitch]=\"asset | staticAssetMainType\">\n            <div\n              class=\"bg-checkered\"\n              *ngSwitchCase=\"'image'\"\n            >\n              <img\n                class=\"img-responsive m-auto img-square\"\n                [alt]=\"asset.fileName\"\n                [src]=\"asset.path\"\n              />\n            </div>\n            <div\n              class=\"bg-checkered\"\n              *ngSwitchCase=\"'font'\"\n            >\n              <div\n                class=\"img-responsive m-auto img-square\"\n                [ngStyle]=\"{ 'font-family': asset.hashSum }\"\n              >\n                <p class=\"fit-h text-balance text-truncate-wrap\">\n                  <!-- intentionally not translated -->\n                  The quick brown fox jumps over the lazy dog.\n                </p>\n              </div>\n            </div>\n            <div\n              class=\"bg-checkered\"\n              *ngSwitchDefault\n            >\n              <div class=\"img-responsive m-auto img-square d-flex a-i-center j-c-center\">\n                <i\n                  class=\"icon-2x\"\n                  [c8yIcon]=\"'file'\"\n                ></i>\n              </div>\n            </div>\n          </ng-container>\n          <p\n            class=\"text-medium text-truncate-wrap m-t-8\"\n            [title]=\"asset.fileName\"\n          >\n            <a\n              [href]=\"asset.path\"\n              download\n              (click)=\"$event.stopPropagation()\"\n            >\n              <i [c8yIcon]=\"'download'\"></i>\n              {{ asset.fileName }}\n            </a>\n          </p>\n          <p class=\"m-b-4\">\n            <code class=\"text-10\">{{ asset.type }}</code>\n          </p>\n          <p class=\"small text-muted d-flex flex-wrap a-i-center\">\n            {{ asset.size | bytes }}\n            <span class=\"m-l-auto\">\n              <i\n                class=\"m-r-4\"\n                [c8yIcon]=\"'calendar'\"\n              ></i>\n              <span>{{ asset.addedAt | c8yDate }}</span>\n            </span>\n          </p>\n        </div>\n      </button>\n    </div>\n  </div>\n</ng-container>\n\n<ng-template #loading>\n  <div class=\"p-24\">\n    <c8y-loading></c8y-loading>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }, { kind: "pipe", type: BytesPipe, name: "bytes" }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: DropAreaComponent, selector: "c8y-drop-area", inputs: ["formControl", "title", "message", "icon", "loadingMessage", "forceHideList", "alwaysShow", "clickToOpen", "loading", "progress", "maxAllowedFiles", "files", "maxFileSizeInMegaBytes", "accept"], outputs: ["dropped"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "directive", type: PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: i1.CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: StaticAssetMainTypePipe, name: "staticAssetMainType" }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetsFileListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'c8y-static-assets-file-list', standalone: true, imports: [
+                        NgForOf,
+                        NgIf,
+                        AsyncPipe,
+                        DatePipe,
+                        BytesPipe,
+                        LoadingComponent,
+                        DropAreaComponent,
+                        C8yTranslatePipe,
+                        C8yTranslateDirective,
+                        MessagesComponent,
+                        ListGroupComponent,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        ListItemBodyComponent,
+                        PopoverDirective,
+                        CollapseModule,
+                        NgStyle,
+                        NgClass,
+                        IconDirective,
+                        StaticAssetMainTypePipe,
+                        NgSwitch,
+                        NgSwitchCase,
+                        NgSwitchDefault
+                    ], template: "<ng-container *ngIf=\"files$ | async as assets; else loading\">\n  <div\n    class=\"text-center sticky-top separator-bottom bg-component\"\n    style=\"z-index: 1001\"\n  >\n    <p\n      class=\"m-0 p-16\"\n      *ngIf=\"assets.length\"\n    >\n      {{ 'Select from the list below or`first part, followed by upload a new asset`' | translate }}\n      <button\n        class=\"btn-link\"\n        aria-controls=\"collapseUpload\"\n        [attr.aria-expanded]=\"isExpanded\"\n        (click)=\"isExpanded = !isExpanded\"\n      >\n        {{ 'upload a new asset' | translate }}\n      </button>\n    </p>\n    <div\n      class=\"collapse\"\n      id=\"collapseUpload\"\n      [isAnimated]=\"true\"\n      [collapse]=\"!isExpanded\"\n    >\n      <div class=\"p-t-24 p-l-24 p-r-24 bg-level-1 separator-top-bottom p-b-32\">\n        <c8y-drop-area\n          class=\"drop-area-sm m-b-8\"\n          [icon]=\"'upload'\"\n          [accept]=\"accept$ | async\"\n          (dropped)=\"addFiles($event)\"\n        ></c8y-drop-area>\n        <c8y-messages\n          [helpMessage]=\"\n            'After uploading, the asset will be visible in the list below.' | translate\n          \"\n        ></c8y-messages>\n      </div>\n    </div>\n  </div>\n  <div *ngIf=\"assets.length\">\n    <c8y-list-group\n      class=\"m-b-0\"\n      *ngIf=\"layout() != 'grid'\"\n    >\n      <c8y-list-item *ngFor=\"let asset of assets\">\n        <c8y-list-item-icon icon=\"file\"></c8y-list-item-icon>\n\n        <c8y-list-item-body>\n          <div class=\"row\">\n            <div class=\"col-md-3 col-xs-12 d-flex a-i-center\">\n              <div\n                class=\"text-truncate\"\n                title=\"{{ asset.fileName }}\"\n              >\n                {{ asset.fileName }}\n              </div>\n              <button\n                class=\"btn-dot m-l-4\"\n                [title]=\"'Preview' | translate\"\n                [popover]=\"preview\"\n                placement=\"end\"\n                triggers=\"focus\"\n                container=\"body\"\n                [adaptivePosition]=\"false\"\n              >\n                <i [c8yIcon]=\"'eye'\"></i>\n              </button>\n              <ng-template #preview>\n                <div class=\"bg-checkered\">\n                  <img\n                    class=\"fit-w\"\n                    [alt]=\"asset.fileName\"\n                    [src]=\"asset.path\"\n                  />\n                </div>\n              </ng-template>\n            </div>\n            <div class=\"col-md-3 col-xs-12 text-muted\">\n              <code class=\"text-10\">{{ asset.type }}</code>\n            </div>\n            <div class=\"col-md-2 col-xs-12 text-muted\">\n              <span class=\"small\">{{ asset.size | bytes }}</span>\n            </div>\n            <div\n              class=\"col-md-2 col-xs-12 text-muted\"\n              [title]=\"asset.addedAt | c8yDate\"\n            >\n              <div class=\"icon-flex small\">\n                <i\n                  class=\"m-r-4\"\n                  [c8yIcon]=\"'calendar'\"\n                ></i>\n                <span>{{ asset.addedAt | c8yDate }}</span>\n              </div>\n            </div>\n            <div class=\"col-md-2 col-xs-12 d-flex\">\n              <button\n                class=\"btn btn-default btn-sm m-l-auto showOnHover\"\n                (click)=\"select(asset)\"\n                translate\n              >\n                Select\n              </button>\n            </div>\n          </div>\n        </c8y-list-item-body>\n      </c8y-list-item>\n    </c8y-list-group>\n    <div\n      class=\"card-group-block interact-grid\"\n      *ngIf=\"layout() === 'grid'\"\n    >\n      <button\n        class=\"card btn-clean interact pointer\"\n        [ngClass]=\"{\n          'col-md-3 col-sm-4 col-xs-12': inModalView(),\n          'col-md-1 col-sm-3 col-xs-12': !inModalView()\n        }\"\n        *ngFor=\"let asset of assets\"\n        (click)=\"select(asset)\"\n      >\n        <div class=\"card-block\">\n          <ng-container [ngSwitch]=\"asset | staticAssetMainType\">\n            <div\n              class=\"bg-checkered\"\n              *ngSwitchCase=\"'image'\"\n            >\n              <img\n                class=\"img-responsive m-auto img-square\"\n                [alt]=\"asset.fileName\"\n                [src]=\"asset.path\"\n              />\n            </div>\n            <div\n              class=\"bg-checkered\"\n              *ngSwitchCase=\"'font'\"\n            >\n              <div\n                class=\"img-responsive m-auto img-square\"\n                [ngStyle]=\"{ 'font-family': asset.hashSum }\"\n              >\n                <p class=\"fit-h text-balance text-truncate-wrap\">\n                  <!-- intentionally not translated -->\n                  The quick brown fox jumps over the lazy dog.\n                </p>\n              </div>\n            </div>\n            <div\n              class=\"bg-checkered\"\n              *ngSwitchDefault\n            >\n              <div class=\"img-responsive m-auto img-square d-flex a-i-center j-c-center\">\n                <i\n                  class=\"icon-2x\"\n                  [c8yIcon]=\"'file'\"\n                ></i>\n              </div>\n            </div>\n          </ng-container>\n          <p\n            class=\"text-medium text-truncate-wrap m-t-8\"\n            [title]=\"asset.fileName\"\n          >\n            <a\n              [href]=\"asset.path\"\n              download\n              (click)=\"$event.stopPropagation()\"\n            >\n              <i [c8yIcon]=\"'download'\"></i>\n              {{ asset.fileName }}\n            </a>\n          </p>\n          <p class=\"m-b-4\">\n            <code class=\"text-10\">{{ asset.type }}</code>\n          </p>\n          <p class=\"small text-muted d-flex flex-wrap a-i-center\">\n            {{ asset.size | bytes }}\n            <span class=\"m-l-auto\">\n              <i\n                class=\"m-r-4\"\n                [c8yIcon]=\"'calendar'\"\n              ></i>\n              <span>{{ asset.addedAt | c8yDate }}</span>\n            </span>\n          </p>\n        </div>\n      </button>\n    </div>\n  </div>\n</ng-container>\n\n<ng-template #loading>\n  <div class=\"p-24\">\n    <c8y-loading></c8y-loading>\n  </div>\n</ng-template>\n" }]
+        }], ctorParameters: () => [] });
+class StaticAssetsModalComponent {
+    constructor(modalRef) {
+        this.modalRef = modalRef;
+        this.assetType = 'branding';
+        this.supportedFileExtensions = [];
+        this.modalTitle = gettext('Select asset');
+        this.layout = 'grid';
+        this.result = new Promise((resolve, reject) => {
+            this.resolve = resolve;
+            this.reject = reject;
+        });
     }
     select(asset) {
         this.modalRef.hide();
@@ -57,13 +159,13 @@ class StaticAssetsModalComponent {
         this.modalRef.hide();
         this.reject();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetsModalComponent, deps: [{ token: i1.BsModalRef }, { token: i2.StaticAssetsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: StaticAssetsModalComponent, isStandalone: true, selector: "c8y-static-assets-modal", inputs: { assetType: "assetType", supportedFileExtensions: "supportedFileExtensions", modalTitle: "modalTitle", layout: "layout" }, ngImport: i0, template: "<c8y-modal\n  [title]=\"modalTitle\"\n  (onDismiss)=\"cancel()\"\n  [headerClasses]=\"'dialog-header'\"\n  [labels]=\"{ cancel: 'Cancel' }\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'select-all'\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"files$ | async as assets; else loading\">\n    <div class=\"text-center sticky-top separator-bottom bg-component\" style=\"z-index: 1001;\">\n      <p *ngIf=\"assets.length\" class=\"m-0 p-16\">\n        {{ 'Select from the list below or`first part, followed by upload a new asset`' | translate }}\n        <button\n          class=\"btn-link\"\n          aria-controls=\"collapseUpload\"\n          [attr.aria-expanded]=\"isExpanded\"\n          (click)=\"isExpanded = !isExpanded\"\n        >\n          {{ 'upload a new asset' | translate }}\n        </button>\n      </p>\n      <div\n        class=\"collapse\"\n        id=\"collapseUpload\"\n        [isAnimated]=\"true\"\n        [collapse]=\"!isExpanded\"\n      >\n        <div class=\"p-t-24 p-l-24 p-r-24 bg-level-1 separator-top-bottom p-b-32\">\n          <c8y-drop-area\n            class=\"drop-area-sm m-b-8\"\n            [icon]=\"'upload'\"\n            [accept]=\"accept\"\n            (dropped)=\"addFiles($event)\"\n          ></c8y-drop-area>\n          <c8y-messages\n            [helpMessage]=\"\n              'After uploading, the asset will be visible in the list below.' | translate\n            \"\n          ></c8y-messages>\n        </div>\n      </div>\n    </div>\n    <div *ngIf=\"assets.length\">\n      <c8y-list-group\n        class=\"m-b-0\"\n        *ngIf=\"layout != 'grid'\"\n      >\n        <c8y-list-item *ngFor=\"let asset of assets\">\n          <c8y-list-item-icon icon=\"file\"></c8y-list-item-icon>\n\n          <c8y-list-item-body>\n            <div class=\"row\">\n              <div class=\"col-md-3 col-xs-12 d-flex a-i-center\">\n                <div\n                  class=\"text-truncate\"\n                  title=\"{{ asset.fileName }}\"\n                >\n                  {{ asset.fileName }}\n                </div>\n                <button\n                  class=\"btn-dot m-l-4\"\n                  [title]=\"'Preview' | translate\"\n                  [popover]=\"preview\"\n                  placement=\"end\"\n                  triggers=\"focus\"\n                  container=\"body\"\n                  [adaptivePosition]=\"false\"\n                >\n                  <i c8yIcon=\"eye\"></i>\n                </button>\n                <ng-template #preview>\n                  <div class=\"bg-checkered\">\n                    <img\n                      class=\"fit-w\"\n                      [alt]=\"asset.fileName\"\n                      [src]=\"asset.path\"\n                    />\n                  </div>\n                </ng-template>\n              </div>\n              <div class=\"col-md-3 col-xs-12 text-muted\">\n                <code class=\"text-10\">{{ asset.type }}</code>\n              </div>\n              <div class=\"col-md-2 col-xs-12 text-muted\">\n                <span class=\"small\">{{ asset.size | bytes }}</span>\n              </div>\n              <div\n                class=\"col-md-2 col-xs-12 text-muted\"\n                [title]=\"asset.addedAt | date\"\n              >\n                <div class=\"icon-flex small\">\n                  <i\n                    class=\"m-r-4\"\n                    c8yIcon=\"calendar\"\n                  ></i>\n                  <span>{{ asset.addedAt | date }}</span>\n                </div>\n              </div>\n              <div class=\"col-md-2 col-xs-12 d-flex\">\n                <button\n                  class=\"btn btn-default btn-sm m-l-auto showOnHover\"\n                  (click)=\"select(asset)\"\n                  translate\n                >\n                  Select\n                </button>\n              </div>\n            </div>\n          </c8y-list-item-body>\n        </c8y-list-item>\n      </c8y-list-group>\n      <div\n        class=\"card-group-block interact-grid\"\n        *ngIf=\"layout === 'grid'\"\n      >\n        <button\n          class=\"col-md-3 col-sm-4 col-xs-12 card btn-clean interact pointer\"\n          *ngFor=\"let asset of assets\"\n          (click)=\"select(asset)\"\n        >\n          <div class=\"card-block\">\n            <div class=\"bg-checkered\">\n              <img\n                class=\"img-responsive m-auto img-square\"\n                [alt]=\"asset.fileName\"\n                [src]=\"asset.path\"\n              />\n            </div>\n            <p\n              class=\"text-medium text-truncate-wrap m-t-8\"\n              title=\"{{ asset.fileName }}\"\n            >\n              {{ asset.fileName }}\n            </p>\n            <p class=\"m-b-4\">\n              <code class=\"text-10\">{{ asset.type }}</code>\n            </p>\n            <p class=\"small text-muted d-flex a-i-center\">\n              {{ asset.size | bytes }}\n              <span class=\"m-l-auto\">\n                <i\n                  class=\"m-r-4\"\n                  c8yIcon=\"calendar\"\n                ></i>\n                <span>{{ asset.addedAt | date }}</span>\n              </span>\n            </p>\n          </div>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-template #loading>\n    <div class=\"p-24\">\n      <c8y-loading></c8y-loading>\n    </div>\n  </ng-template>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i3.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i3.C8yTranslatePipe, name: "translate" }, { kind: "directive", type: i3.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: i3.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: i3.BytesPipe, name: "bytes" }, { kind: "component", type: i3.DropAreaComponent, selector: "c8y-drop-area", inputs: ["formControl", "title", "message", "icon", "loadingMessage", "forceHideList", "alwaysShow", "clickToOpen", "loading", "progress", "maxAllowedFiles", "files", "maxFileSizeInMegaBytes", "accept"], outputs: ["dropped"] }, { kind: "component", type: i3.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i3.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "component", type: i3.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i3.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i3.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i3.ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "directive", type: i4.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: i5.CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetsModalComponent, deps: [{ token: i1$1.BsModalRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: StaticAssetsModalComponent, isStandalone: true, selector: "c8y-static-assets-modal", inputs: { assetType: "assetType", supportedFileExtensions: "supportedFileExtensions", modalTitle: "modalTitle", layout: "layout" }, ngImport: i0, template: "<c8y-modal\n  [title]=\"modalTitle\"\n  (onDismiss)=\"cancel()\"\n  [headerClasses]=\"'dialog-header'\"\n  [labels]=\"{ cancel: 'Cancel' }\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'select-all'\"></span>\n  </ng-container>\n  <c8y-static-assets-file-list\n    (itemSelected)=\"select($event)\"\n    [assetType]=\"assetType\"\n    [supportedFileExtensions]=\"supportedFileExtensions\"\n    [layout]=\"layout\"\n    [inModalView]=\"true\"\n  ></c8y-static-assets-file-list>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: StaticAssetsFileListComponent, selector: "c8y-static-assets-file-list", inputs: ["inModalView", "assetType", "supportedFileExtensions", "layout"], outputs: ["itemSelected"] }, { kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: StaticAssetsModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-static-assets-modal', imports: [NgFor, NgIf, AsyncPipe, DatePipe, CoreModule, PopoverModule, CollapseModule], standalone: true, template: "<c8y-modal\n  [title]=\"modalTitle\"\n  (onDismiss)=\"cancel()\"\n  [headerClasses]=\"'dialog-header'\"\n  [labels]=\"{ cancel: 'Cancel' }\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'select-all'\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"files$ | async as assets; else loading\">\n    <div class=\"text-center sticky-top separator-bottom bg-component\" style=\"z-index: 1001;\">\n      <p *ngIf=\"assets.length\" class=\"m-0 p-16\">\n        {{ 'Select from the list below or`first part, followed by upload a new asset`' | translate }}\n        <button\n          class=\"btn-link\"\n          aria-controls=\"collapseUpload\"\n          [attr.aria-expanded]=\"isExpanded\"\n          (click)=\"isExpanded = !isExpanded\"\n        >\n          {{ 'upload a new asset' | translate }}\n        </button>\n      </p>\n      <div\n        class=\"collapse\"\n        id=\"collapseUpload\"\n        [isAnimated]=\"true\"\n        [collapse]=\"!isExpanded\"\n      >\n        <div class=\"p-t-24 p-l-24 p-r-24 bg-level-1 separator-top-bottom p-b-32\">\n          <c8y-drop-area\n            class=\"drop-area-sm m-b-8\"\n            [icon]=\"'upload'\"\n            [accept]=\"accept\"\n            (dropped)=\"addFiles($event)\"\n          ></c8y-drop-area>\n          <c8y-messages\n            [helpMessage]=\"\n              'After uploading, the asset will be visible in the list below.' | translate\n            \"\n          ></c8y-messages>\n        </div>\n      </div>\n    </div>\n    <div *ngIf=\"assets.length\">\n      <c8y-list-group\n        class=\"m-b-0\"\n        *ngIf=\"layout != 'grid'\"\n      >\n        <c8y-list-item *ngFor=\"let asset of assets\">\n          <c8y-list-item-icon icon=\"file\"></c8y-list-item-icon>\n\n          <c8y-list-item-body>\n            <div class=\"row\">\n              <div class=\"col-md-3 col-xs-12 d-flex a-i-center\">\n                <div\n                  class=\"text-truncate\"\n                  title=\"{{ asset.fileName }}\"\n                >\n                  {{ asset.fileName }}\n                </div>\n                <button\n                  class=\"btn-dot m-l-4\"\n                  [title]=\"'Preview' | translate\"\n                  [popover]=\"preview\"\n                  placement=\"end\"\n                  triggers=\"focus\"\n                  container=\"body\"\n                  [adaptivePosition]=\"false\"\n                >\n                  <i c8yIcon=\"eye\"></i>\n                </button>\n                <ng-template #preview>\n                  <div class=\"bg-checkered\">\n                    <img\n                      class=\"fit-w\"\n                      [alt]=\"asset.fileName\"\n                      [src]=\"asset.path\"\n                    />\n                  </div>\n                </ng-template>\n              </div>\n              <div class=\"col-md-3 col-xs-12 text-muted\">\n                <code class=\"text-10\">{{ asset.type }}</code>\n              </div>\n              <div class=\"col-md-2 col-xs-12 text-muted\">\n                <span class=\"small\">{{ asset.size | bytes }}</span>\n              </div>\n              <div\n                class=\"col-md-2 col-xs-12 text-muted\"\n                [title]=\"asset.addedAt | date\"\n              >\n                <div class=\"icon-flex small\">\n                  <i\n                    class=\"m-r-4\"\n                    c8yIcon=\"calendar\"\n                  ></i>\n                  <span>{{ asset.addedAt | date }}</span>\n                </div>\n              </div>\n              <div class=\"col-md-2 col-xs-12 d-flex\">\n                <button\n                  class=\"btn btn-default btn-sm m-l-auto showOnHover\"\n                  (click)=\"select(asset)\"\n                  translate\n                >\n                  Select\n                </button>\n              </div>\n            </div>\n          </c8y-list-item-body>\n        </c8y-list-item>\n      </c8y-list-group>\n      <div\n        class=\"card-group-block interact-grid\"\n        *ngIf=\"layout === 'grid'\"\n      >\n        <button\n          class=\"col-md-3 col-sm-4 col-xs-12 card btn-clean interact pointer\"\n          *ngFor=\"let asset of assets\"\n          (click)=\"select(asset)\"\n        >\n          <div class=\"card-block\">\n            <div class=\"bg-checkered\">\n              <img\n                class=\"img-responsive m-auto img-square\"\n                [alt]=\"asset.fileName\"\n                [src]=\"asset.path\"\n              />\n            </div>\n            <p\n              class=\"text-medium text-truncate-wrap m-t-8\"\n              title=\"{{ asset.fileName }}\"\n            >\n              {{ asset.fileName }}\n            </p>\n            <p class=\"m-b-4\">\n              <code class=\"text-10\">{{ asset.type }}</code>\n            </p>\n            <p class=\"small text-muted d-flex a-i-center\">\n              {{ asset.size | bytes }}\n              <span class=\"m-l-auto\">\n                <i\n                  class=\"m-r-4\"\n                  c8yIcon=\"calendar\"\n                ></i>\n                <span>{{ asset.addedAt | date }}</span>\n              </span>\n            </p>\n          </div>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-template #loading>\n    <div class=\"p-24\">\n      <c8y-loading></c8y-loading>\n    </div>\n  </ng-template>\n</c8y-modal>\n" }]
-        }], ctorParameters: () => [{ type: i1.BsModalRef }, { type: i2.StaticAssetsService }], propDecorators: { assetType: [{
+            args: [{ selector: 'c8y-static-assets-modal', imports: [StaticAssetsFileListComponent, ModalComponent, IconDirective], standalone: true, template: "<c8y-modal\n  [title]=\"modalTitle\"\n  (onDismiss)=\"cancel()\"\n  [headerClasses]=\"'dialog-header'\"\n  [labels]=\"{ cancel: 'Cancel' }\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'select-all'\"></span>\n  </ng-container>\n  <c8y-static-assets-file-list\n    (itemSelected)=\"select($event)\"\n    [assetType]=\"assetType\"\n    [supportedFileExtensions]=\"supportedFileExtensions\"\n    [layout]=\"layout\"\n    [inModalView]=\"true\"\n  ></c8y-static-assets-file-list>\n</c8y-modal>\n" }]
+        }], ctorParameters: () => [{ type: i1$1.BsModalRef }], propDecorators: { assetType: [{
                 type: Input
             }], supportedFileExtensions: [{
                 type: Input
@@ -77,5 +179,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
  * Generated bundle index. Do not edit.
  */
-export { StaticAssetsModalComponent };
+export { StaticAssetsFileListComponent, StaticAssetsModalComponent };
 //# sourceMappingURL=c8y-ngx-components-static-assets-modal.mjs.map

package/fesm2022/c8y-ngx-components-static-assets-modal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"c8y-ngx-components-static-assets-modal.mjs","sources":["../../static-assets/modal/static-assets-modal.component.ts","../../static-assets/modal/static-assets-modal.component.html","../../static-assets/modal/c8y-ngx-components-static-assets-modal.ts"],"sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport type { StaticAsset, StaticAssetType } from '@c8y/ngx-components/static-assets/data';\nimport { BsModalRef } from 'ngx-bootstrap/modal';\nimport { Observable, Subject, from, merge } from 'rxjs';\nimport { StaticAssetsService } from '@c8y/ngx-components/static-assets/data';\nimport { first, shareReplay, map, tap } from 'rxjs/operators';\nimport { AsyncPipe, DatePipe, NgFor, NgIf } from '@angular/common';\nimport { CoreModule, DroppedFile, gettext } from '@c8y/ngx-components';\nimport { PopoverModule } from 'ngx-bootstrap/popover';\nimport { CollapseModule } from 'ngx-bootstrap/collapse';\n\n@Component({\n selector: 'c8y-static-assets-modal',\n templateUrl: './static-assets-modal.component.html',\n imports: [NgFor, NgIf, AsyncPipe, DatePipe, CoreModule, PopoverModule, CollapseModule],\n standalone: true\n})\nexport class StaticAssetsModalComponent implements OnInit {\n @Input() assetType: StaticAssetType = 'branding';\n @Input() supportedFileExtensions: string[] = [];\n @Input() modalTitle: string = gettext('Select asset');\n @Input() layout: 'list' \| 'grid' = 'grid';\n result: Promise<StaticAsset>;\n files$: Observable<StaticAsset[]>;\n accept = '';\n isExpanded = false;\n private _unfilteredFiles$: Observable<StaticAsset[]>;\n private _filesUpdate$ = new Subject<StaticAsset[]>();\n private resolve: (res: StaticAsset) => void;\n private reject: (err?: unknown) => void;\n\n constructor(\n private modalRef: BsModalRef,\n private staticAssets: StaticAssetsService\n ) {\n this.result = new Promise<StaticAsset>((resolve, reject) => {\n this.resolve = resolve;\n this.reject = reject;\n });\n }\n\n ngOnInit() {\n this._unfilteredFiles$ = merge(\n this._filesUpdate$,\n from(this.staticAssets.listFiles(this.assetType))\n ).pipe(shareReplay(1));\n this.files$ = this._unfilteredFiles$.pipe(\n map(files =>\n this.supportedFileExtensions\n ? files.filter(tmp => this.supportedFileExtensions.includes(tmp.extension.toLowerCase()))\n : files\n ),\n map(files =>\n files.sort((a, b) => (a.addedAt < b.addedAt ? 1 : a.addedAt > b.addedAt ? -1 : 0))\n ),\n tap(files => {\n if (!files.length) {\n this.isExpanded = true;\n }\n })\n );\n if (this.supportedFileExtensions) {\n this.accept = this.supportedFileExtensions.join(',');\n }\n }\n\n async addFiles(files: DroppedFile[]) {\n if (!files?.length) {\n return;\n }\n const existingFiles = await this._unfilteredFiles$.pipe(first()).toPromise();\n const newFiles = await this.staticAssets.addFilesToStaticAssets(\n this.assetType,\n files,\n existingFiles\n );\n this._filesUpdate$.next(newFiles);\n }\n\n select(asset: StaticAsset) {\n this.modalRef.hide();\n this.resolve(asset);\n }\n\n cancel() {\n this.modalRef.hide();\n this.reject();\n }\n}\n","<c8y-modal\n [title]=\"modalTitle\"\n (onDismiss)=\"cancel()\"\n [headerClasses]=\"'dialog-header'\"\n [labels]=\"{ cancel: 'Cancel' }\"\n>\n <ng-container c8y-modal-title>\n <span [c8yIcon]=\"'select-all'\"></span>\n </ng-container>\n <ng-container ngIf=\"files$ \| async as assets; else loading\">\n <div class=\"text-center sticky-top separator-bottom bg-component\" style=\"z-index: 1001;\">\n <p ngIf=\"assets.length\" class=\"m-0 p-16\">\n {{ 'Select from the list below or`first part, followed by upload a new asset`' \| translate }}\n <button\n class=\"btn-link\"\n aria-controls=\"collapseUpload\"\n [attr.aria-expanded]=\"isExpanded\"\n (click)=\"isExpanded = !isExpanded\"\n >\n {{ 'upload a new asset' \| translate }}\n </button>\n </p>\n <div\n class=\"collapse\"\n id=\"collapseUpload\"\n [isAnimated]=\"true\"\n [collapse]=\"!isExpanded\"\n >\n <div class=\"p-t-24 p-l-24 p-r-24 bg-level-1 separator-top-bottom p-b-32\">\n <c8y-drop-area\n class=\"drop-area-sm m-b-8\"\n [icon]=\"'upload'\"\n [accept]=\"accept\"\n (dropped)=\"addFiles($event)\"\n ></c8y-drop-area>\n <c8y-messages\n [helpMessage]=\"\n 'After uploading, the asset will be visible in the list below.' \| translate\n \"\n ></c8y-messages>\n </div>\n </div>\n </div>\n <div ngIf=\"assets.length\">\n <c8y-list-group\n class=\"m-b-0\"\n ngIf=\"layout != 'grid'\"\n >\n <c8y-list-item ngFor=\"let asset of assets\">\n <c8y-list-item-icon icon=\"file\"></c8y-list-item-icon>\n\n <c8y-list-item-body>\n <div class=\"row\">\n <div class=\"col-md-3 col-xs-12 d-flex a-i-center\">\n <div\n class=\"text-truncate\"\n title=\"{{ asset.fileName }}\"\n >\n {{ asset.fileName }}\n </div>\n <button\n class=\"btn-dot m-l-4\"\n [title]=\"'Preview' \| translate\"\n [popover]=\"preview\"\n placement=\"end\"\n triggers=\"focus\"\n container=\"body\"\n [adaptivePosition]=\"false\"\n >\n <i c8yIcon=\"eye\"></i>\n </button>\n <ng-template #preview>\n <div class=\"bg-checkered\">\n <img\n class=\"fit-w\"\n [alt]=\"asset.fileName\"\n [src]=\"asset.path\"\n />\n </div>\n </ng-template>\n </div>\n <div class=\"col-md-3 col-xs-12 text-muted\">\n <code class=\"text-10\">{{ asset.type }}</code>\n </div>\n <div class=\"col-md-2 col-xs-12 text-muted\">\n <span class=\"small\">{{ asset.size \| bytes }}</span>\n </div>\n <div\n class=\"col-md-2 col-xs-12 text-muted\"\n [title]=\"asset.addedAt \| date\"\n >\n <div class=\"icon-flex small\">\n <i\n class=\"m-r-4\"\n c8yIcon=\"calendar\"\n ></i>\n <span>{{ asset.addedAt \| date }}</span>\n </div>\n </div>\n <div class=\"col-md-2 col-xs-12 d-flex\">\n <button\n class=\"btn btn-default btn-sm m-l-auto showOnHover\"\n (click)=\"select(asset)\"\n translate\n >\n Select\n </button>\n </div>\n </div>\n </c8y-list-item-body>\n </c8y-list-item>\n </c8y-list-group>\n <div\n class=\"card-group-block interact-grid\"\n ngIf=\"layout === 'grid'\"\n >\n <button\n class=\"col-md-3 col-sm-4 col-xs-12 card btn-clean interact pointer\"\n ngFor=\"let asset of assets\"\n (click)=\"select(asset)\"\n >\n <div class=\"card-block\">\n <div class=\"bg-checkered\">\n <img\n class=\"img-responsive m-auto img-square\"\n [alt]=\"asset.fileName\"\n [src]=\"asset.path\"\n />\n </div>\n <p\n class=\"text-medium text-truncate-wrap m-t-8\"\n title=\"{{ asset.fileName }}\"\n >\n {{ asset.fileName }}\n </p>\n <p class=\"m-b-4\">\n <code class=\"text-10\">{{ asset.type }}</code>\n </p>\n <p class=\"small text-muted d-flex a-i-center\">\n {{ asset.size \| bytes }}\n <span class=\"m-l-auto\">\n <i\n class=\"m-r-4\"\n c8yIcon=\"calendar\"\n ></i>\n <span>{{ asset.addedAt \| date }}</span>\n </span>\n </p>\n </div>\n </button>\n </div>\n </div>\n </ng-container>\n\n <ng-template #loading>\n <div class=\"p-24\">\n <c8y-loading></c8y-loading>\n </div>\n </ng-template>\n</c8y-modal>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"c8y-ngx-components-static-assets-modal.mjs","sources":["../../static-assets/modal/static-asset-main-type.pipe.ts","../../static-assets/modal/static-assets-file-list/static-assets-file-list.component.ts","../../static-assets/modal/static-assets-file-list/static-assets-file-list.component.html","../../static-assets/modal/static-assets-modal.component.ts","../../static-assets/modal/static-assets-modal.component.html","../../static-assets/modal/c8y-ngx-components-static-assets-modal.ts"],"sourcesContent":["import { Pipe, PipeTransform } from '@angular/core';\nimport { StaticAsset } from '@c8y/ngx-components/static-assets/data';\n\n@Pipe({\n name: 'staticAssetMainType',\n pure: true,\n standalone: true\n})\nexport class StaticAssetMainTypePipe implements PipeTransform {\n supportedTypes = ['image', 'font'];\n\n transform(value: Pick<StaticAsset, 'type'> \| StaticAsset): string {\n if (!value?.type) {\n return 'unknown';\n }\n\n const typePrefix = value.type.replace(/\\/.$/, '');\n\n if (this.supportedTypes.includes(typePrefix)) {\n return typePrefix;\n }\n\n return 'unknown';\n }\n}\n","import {\n AsyncPipe,\n NgClass,\n NgForOf,\n NgIf,\n NgStyle,\n NgSwitch,\n NgSwitchCase,\n NgSwitchDefault\n} from '@angular/common';\nimport { Component, inject, input, OnDestroy, output, viewChild } from '@angular/core';\nimport {\n AlertService,\n BytesPipe,\n C8yTranslateDirective,\n C8yTranslatePipe,\n DatePipe,\n DropAreaComponent,\n DroppedFile,\n IconDirective,\n ListGroupComponent,\n ListItemBodyComponent,\n ListItemComponent,\n ListItemIconComponent,\n LoadingComponent,\n MessagesComponent\n} from '@c8y/ngx-components';\nimport { gettext } from '@c8y/ngx-components/gettext';\nimport { CollapseModule } from 'ngx-bootstrap/collapse';\nimport { PopoverDirective } from 'ngx-bootstrap/popover';\nimport { combineLatest, firstValueFrom, merge, Observable, Subject } from 'rxjs';\nimport { first, map, shareReplay, switchMap, tap } from 'rxjs/operators';\nimport {\n StaticAsset,\n StaticAssetsService,\n StaticAssetType\n} from '@c8y/ngx-components/static-assets/data';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\nimport { StaticAssetMainTypePipe } from '../static-asset-main-type.pipe';\nimport { TranslateService } from '@ngx-translate/core';\n\n@Component({\n selector: 'c8y-static-assets-file-list',\n templateUrl: './static-assets-file-list.component.html',\n standalone: true,\n imports: [\n NgForOf,\n NgIf,\n AsyncPipe,\n DatePipe,\n BytesPipe,\n LoadingComponent,\n DropAreaComponent,\n C8yTranslatePipe,\n C8yTranslateDirective,\n MessagesComponent,\n ListGroupComponent,\n ListItemComponent,\n ListItemIconComponent,\n ListItemBodyComponent,\n PopoverDirective,\n CollapseModule,\n NgStyle,\n NgClass,\n IconDirective,\n StaticAssetMainTypePipe,\n NgSwitch,\n NgSwitchCase,\n NgSwitchDefault\n ]\n})\nexport class StaticAssetsFileListComponent implements OnDestroy {\n itemSelected = output<StaticAsset>();\n inModalView = input<boolean>(false);\n assetType = input<StaticAssetType>('branding');\n supportedFileExtensions = input<string[]>([]);\n layout = input<'list' \| 'grid'>('grid');\n files$: Observable<StaticAsset[]>;\n accept$: Observable<string>;\n isExpanded = false;\n private _unfilteredFiles$: Observable<StaticAsset[]>;\n private _filesUpdate$ = new Subject<StaticAsset[]>();\n private styleTagId = `static-assets-font-faces`;\n private dropArea = viewChild(DropAreaComponent);\n private alert = inject(AlertService);\n private translate = inject(TranslateService);\n private staticAssets = inject(StaticAssetsService);\n\n constructor() {\n this._unfilteredFiles$ = merge(\n toObservable(this.assetType).pipe(\n switchMap(assetType => this.staticAssets.listFiles(assetType))\n ),\n this._filesUpdate$\n ).pipe(shareReplay({ bufferSize: 1, refCount: true }));\n\n this.files$ = combineLatest([\n this._unfilteredFiles$,\n toObservable(this.supportedFileExtensions)\n ]).pipe(\n map(([files, supportedFileExtensions]) =>\n supportedFileExtensions?.length\n ? files.filter(tmp => supportedFileExtensions.includes(tmp.extension.toLowerCase()))\n : files\n ),\n map(files =>\n files.sort((a, b) => (a.addedAt < b.addedAt ? 1 : a.addedAt > b.addedAt ? -1 : 0))\n ),\n tap(files => {\n if (!files.length) {\n this.isExpanded = true;\n }\n }),\n shareReplay({ bufferSize: 1, refCount: true })\n );\n\n this.accept$ = toObservable(this.supportedFileExtensions).pipe(map(exts => exts.join(',')));\n this.files$.pipe(takeUntilDestroyed()).subscribe(files => this.applyStylesForFiles(files));\n }\n\n ngOnDestroy(): void {\n this.removeStyleTag();\n }\n\n async addFiles(files: DroppedFile[]) {\n if (!files?.length) {\n return;\n }\n this.dropArea().loading = true;\n try {\n const existingFiles = await firstValueFrom(this._unfilteredFiles$.pipe(first()));\n const updatedFiles = await this.staticAssets.addFilesToStaticAssets(\n this.assetType(),\n files,\n existingFiles\n );\n this._filesUpdate$.next(updatedFiles);\n } catch (e) {\n this.alert.danger(this.translate.instant(gettext('Failed to upload asset.')), e?.message);\n }\n\n this.dropArea().files = null;\n this.dropArea().loading = false;\n }\n\n select(asset: StaticAsset) {\n this.itemSelected.emit(asset);\n }\n\n private applyStylesForFiles(files: StaticAsset[]) {\n this.removeStyleTag();\n const styles = files\n .filter(file => file.type.startsWith('font/'))\n .map(file => `@font-face { font-family: '${file.hashSum}'; src: url('${file.path}'); }`)\n .join('\\n');\n\n if (!styles) {\n return;\n }\n const styleTag = document.createElement('style');\n styleTag.id = this.styleTagId;\n styleTag.innerHTML = styles;\n styleTag.type = 'text/css';\n document.body.appendChild(styleTag);\n }\n\n private removeStyleTag() {\n document.getElementById(this.styleTagId)?.remove();\n }\n}\n","<ng-container ngIf=\"files$ \| async as assets; else loading\">\n <div\n class=\"text-center sticky-top separator-bottom bg-component\"\n style=\"z-index: 1001\"\n >\n <p\n class=\"m-0 p-16\"\n ngIf=\"assets.length\"\n >\n {{ 'Select from the list below or`first part, followed by upload a new asset`' \| translate }}\n <button\n class=\"btn-link\"\n aria-controls=\"collapseUpload\"\n [attr.aria-expanded]=\"isExpanded\"\n (click)=\"isExpanded = !isExpanded\"\n >\n {{ 'upload a new asset' \| translate }}\n </button>\n </p>\n <div\n class=\"collapse\"\n id=\"collapseUpload\"\n [isAnimated]=\"true\"\n [collapse]=\"!isExpanded\"\n >\n <div class=\"p-t-24 p-l-24 p-r-24 bg-level-1 separator-top-bottom p-b-32\">\n <c8y-drop-area\n class=\"drop-area-sm m-b-8\"\n [icon]=\"'upload'\"\n [accept]=\"accept$ \| async\"\n (dropped)=\"addFiles($event)\"\n ></c8y-drop-area>\n <c8y-messages\n [helpMessage]=\"\n 'After uploading, the asset will be visible in the list below.' \| translate\n \"\n ></c8y-messages>\n </div>\n </div>\n </div>\n <div ngIf=\"assets.length\">\n <c8y-list-group\n class=\"m-b-0\"\n ngIf=\"layout() != 'grid'\"\n >\n <c8y-list-item ngFor=\"let asset of assets\">\n <c8y-list-item-icon icon=\"file\"></c8y-list-item-icon>\n\n <c8y-list-item-body>\n <div class=\"row\">\n <div class=\"col-md-3 col-xs-12 d-flex a-i-center\">\n <div\n class=\"text-truncate\"\n title=\"{{ asset.fileName }}\"\n >\n {{ asset.fileName }}\n </div>\n <button\n class=\"btn-dot m-l-4\"\n [title]=\"'Preview' \| translate\"\n [popover]=\"preview\"\n placement=\"end\"\n triggers=\"focus\"\n container=\"body\"\n [adaptivePosition]=\"false\"\n >\n <i [c8yIcon]=\"'eye'\"></i>\n </button>\n <ng-template #preview>\n <div class=\"bg-checkered\">\n <img\n class=\"fit-w\"\n [alt]=\"asset.fileName\"\n [src]=\"asset.path\"\n />\n </div>\n </ng-template>\n </div>\n <div class=\"col-md-3 col-xs-12 text-muted\">\n <code class=\"text-10\">{{ asset.type }}</code>\n </div>\n <div class=\"col-md-2 col-xs-12 text-muted\">\n <span class=\"small\">{{ asset.size \| bytes }}</span>\n </div>\n <div\n class=\"col-md-2 col-xs-12 text-muted\"\n [title]=\"asset.addedAt \| c8yDate\"\n >\n <div class=\"icon-flex small\">\n <i\n class=\"m-r-4\"\n [c8yIcon]=\"'calendar'\"\n ></i>\n <span>{{ asset.addedAt \| c8yDate }}</span>\n </div>\n </div>\n <div class=\"col-md-2 col-xs-12 d-flex\">\n <button\n class=\"btn btn-default btn-sm m-l-auto showOnHover\"\n (click)=\"select(asset)\"\n translate\n >\n Select\n </button>\n </div>\n </div>\n </c8y-list-item-body>\n </c8y-list-item>\n </c8y-list-group>\n <div\n class=\"card-group-block interact-grid\"\n ngIf=\"layout() === 'grid'\"\n >\n <button\n class=\"card btn-clean interact pointer\"\n [ngClass]=\"{\n 'col-md-3 col-sm-4 col-xs-12': inModalView(),\n 'col-md-1 col-sm-3 col-xs-12': !inModalView()\n }\"\n ngFor=\"let asset of assets\"\n (click)=\"select(asset)\"\n >\n <div class=\"card-block\">\n <ng-container [ngSwitch]=\"asset \| staticAssetMainType\">\n <div\n class=\"bg-checkered\"\n ngSwitchCase=\"'image'\"\n >\n <img\n class=\"img-responsive m-auto img-square\"\n [alt]=\"asset.fileName\"\n [src]=\"asset.path\"\n />\n </div>\n <div\n class=\"bg-checkered\"\n ngSwitchCase=\"'font'\"\n >\n <div\n class=\"img-responsive m-auto img-square\"\n [ngStyle]=\"{ 'font-family': asset.hashSum }\"\n >\n <p class=\"fit-h text-balance text-truncate-wrap\">\n <!-- intentionally not translated -->\n The quick brown fox jumps over the lazy dog.\n </p>\n </div>\n </div>\n <div\n class=\"bg-checkered\"\n ngSwitchDefault\n >\n <div class=\"img-responsive m-auto img-square d-flex a-i-center j-c-center\">\n <i\n class=\"icon-2x\"\n [c8yIcon]=\"'file'\"\n ></i>\n </div>\n </div>\n </ng-container>\n <p\n class=\"text-medium text-truncate-wrap m-t-8\"\n [title]=\"asset.fileName\"\n >\n <a\n [href]=\"asset.path\"\n download\n (click)=\"$event.stopPropagation()\"\n >\n <i [c8yIcon]=\"'download'\"></i>\n {{ asset.fileName }}\n </a>\n </p>\n <p class=\"m-b-4\">\n <code class=\"text-10\">{{ asset.type }}</code>\n </p>\n <p class=\"small text-muted d-flex flex-wrap a-i-center\">\n {{ asset.size \| bytes }}\n <span class=\"m-l-auto\">\n <i\n class=\"m-r-4\"\n [c8yIcon]=\"'calendar'\"\n ></i>\n <span>{{ asset.addedAt \| c8yDate }}</span>\n </span>\n </p>\n </div>\n </button>\n </div>\n </div>\n</ng-container>\n\n<ng-template #loading>\n <div class=\"p-24\">\n <c8y-loading></c8y-loading>\n </div>\n</ng-template>\n","import { Component, Input } from '@angular/core';\nimport type { StaticAsset, StaticAssetType } from '@c8y/ngx-components/static-assets/data';\nimport { BsModalRef } from 'ngx-bootstrap/modal';\nimport { IconDirective, ModalComponent } from '@c8y/ngx-components';\nimport { gettext } from '@c8y/ngx-components/gettext';\nimport { StaticAssetsFileListComponent } from './static-assets-file-list/static-assets-file-list.component';\n\n@Component({\n selector: 'c8y-static-assets-modal',\n templateUrl: './static-assets-modal.component.html',\n imports: [StaticAssetsFileListComponent, ModalComponent, IconDirective],\n standalone: true\n})\nexport class StaticAssetsModalComponent {\n @Input() assetType: StaticAssetType = 'branding';\n @Input() supportedFileExtensions: string[] = [];\n @Input() modalTitle: string = gettext('Select asset');\n @Input() layout: 'list' \| 'grid' = 'grid';\n result: Promise<StaticAsset>;\n private resolve: (res: StaticAsset) => void;\n private reject: (err?: unknown) => void;\n\n constructor(private modalRef: BsModalRef) {\n this.result = new Promise<StaticAsset>((resolve, reject) => {\n this.resolve = resolve;\n this.reject = reject;\n });\n }\n\n select(asset: StaticAsset) {\n this.modalRef.hide();\n this.resolve(asset);\n }\n\n cancel() {\n this.modalRef.hide();\n this.reject();\n }\n}\n","<c8y-modal\n [title]=\"modalTitle\"\n (onDismiss)=\"cancel()\"\n [headerClasses]=\"'dialog-header'\"\n [labels]=\"{ cancel: 'Cancel' }\"\n>\n <ng-container c8y-modal-title>\n <span [c8yIcon]=\"'select-all'\"></span>\n </ng-container>\n <c8y-static-assets-file-list\n (itemSelected)=\"select($event)\"\n [assetType]=\"assetType\"\n [supportedFileExtensions]=\"supportedFileExtensions\"\n [layout]=\"layout\"\n [inModalView]=\"true\"\n ></c8y-static-assets-file-list>\n</c8y-modal>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["i1"],"mappings":"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"}