@firestitch/file - npm Package Compare versions

Comparing version 12.17.0 to 12.17.1

esm2015/app/components/fs-file-preview/fs-file-preview.component.js

@@ -81,3 +81,3 @@ import { ChangeDetectionStrategy, Component, ContentChildren, EventEmitter, Input, Output, QueryList, } from '@angular/core';
 FsFilePreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FsFilePreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FsFilePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FsFilePreviewComponent, selector: "fs-file-preview", inputs: { previewActions: "previewActions", showFilename: "showFilename", previewWidth: "previewWidth", previewHeight: "previewHeight", file: "file", url: "url", index: "index", showActionOn: "showActionOn" }, outputs: { remove: "remove" }, queries: [{ propertyName: "childrenPreviewActions", predicate: FsFilePreviewActionDirective }], usesOnChanges: true, ngImport: i0, template: "<div\n    [style.width.px]=\"previewWidth\"\n    [style.height.px]=\"previewHeight\"\n    class=\"preview-container\"\n    [ngClass]=\"{ \n      'has-actions': (childrenPreviewActions.length !== 0 || previewActions.length !== 0),  \n      'type-image': typeImage,\n      'loaded': loaded,\n      'show-action-always': showActionOn === 'always'\n    }\">\n  <!-- Image container -->\n  <ng-container \n      *ngIf=\"typeImage; else nonImage\">\n    <ng-container *ngIf=\"(file | fsFileSrc | async) as src\">\n      <img \n        [src]=\"src\" \n        (load)=\"previewLoaded()\">\n    </ng-container>\n   \n    <ng-container *ngIf=\"!loaded\">\n      <div class=\"loader\"></div>\n    </ng-container>\n  </ng-container>\n\n  <!-- Non image container -->\n  <ng-template #nonImage>\n    <div class=\"file-details\">\n      <div class=\"file-icon\">\n        <div \n            class=\"file-ext\"\n            [style.fontSize]=\"extensionFontSize + 'px'\">\n          {{file.extension}}\n        </div>\n        <mat-icon \n          [style.width]=\"iconDim + 'px'\" \n          [style.height]=\"iconDim + 'px'\"\n          [style.fontSize]=\"iconDim + 'px'\">insert_drive_file</mat-icon>\n      </div>\n      <ng-container *ngIf=\"showFilename && file.name\">\n        <a \n            class=\"file-name\" \n            [matTooltip]=\"file.name\">\n          {{file.name}}\n        </a>\n      </ng-container>\n    </div>\n  </ng-template>\n\n  <div class=\"actions\">\n    <ng-container *ngFor=\"let previewAction of previewActions\">\n      <ng-container \n        [ngTemplateOutlet]=\"previewActionTmpl\" \n        [ngTemplateOutletContext]=\"{ previewAction: previewAction}\">\n      </ng-container>\n    </ng-container>\n    <ng-container *ngFor=\"let previewAction of childrenPreviewActions\">\n      <ng-container \n        [ngTemplateOutlet]=\"previewActionTmpl\" \n        [ngTemplateOutletContext]=\"{ previewAction: previewAction }\">\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <div class=\"spinner\">\n    <mat-spinner *ngIf=\"file.progress\" [diameter]=\"30\"></mat-spinner>\n  </div>\n  <ng-content></ng-content>\n</div>\n\n<ng-template #previewActionTmpl let-previewAction=\"previewAction\">\n  <div\n      class=\"action mat-mini-fab mat-primary\"\n      *ngIf=\"!previewAction.hide\"\n      [class]=\"previewAction.placement\"\n      [matTooltip]=\"previewAction.tooltip\"\n      (click)=\"callAction($event, previewAction)\">\n    <span class=\"mat-button-wrapper\">\n      <ng-template [ngTemplateOutlet]=\"previewAction.templateRef\"></ng-template>\n    </span>\n  </div>\n</ng-template>", styles: [":host{border:1px #efefef solid;display:inline-block;position:relative;vertical-align:top;overflow:hidden;border-radius:3px}:host .file-details{flex-direction:column;display:flex;padding:5px;min-width:0}:host .file-details .file-icon{position:relative;display:flex;justify-content:center}:host .file-details .file-ext{font-weight:bold;text-align:center;text-transform:uppercase;font-size:20px;position:absolute;width:100%;bottom:25%;color:#fff}:host .file-details mat-icon{color:#ccc}:host .file-details .file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:5px;font-size:75%;text-align:center;width:100%;color:inherit;box-sizing:border-box}:host .preview-container.show-action-always .actions .action.top-left,:host .preview-container:hover .actions .action.top-left,:host .preview-container:focus .actions .action.top-left{top:8px;left:8px}:host .preview-container.show-action-always .actions .action.top-right,:host .preview-container:hover .actions .action.top-right,:host .preview-container:focus .actions .action.top-right{top:8px;right:8px}:host .preview-container.show-action-always .actions .action.bottom-left,:host .preview-container:hover .actions .action.bottom-left,:host .preview-container:focus .actions .action.bottom-left{bottom:8px;left:8px}:host .preview-container.show-action-always .actions .action.bottom-right,:host .preview-container:hover .actions .action.bottom-right,:host .preview-container:focus .actions .action.bottom-right{bottom:8px;right:8px}:host .preview-container{overflow:hidden;box-sizing:border-box;margin:auto;display:flex;align-items:center;flex-grow:1;height:100%;justify-content:center}:host .preview-container.type-image{background-image:linear-gradient(to right,rgba(255,255,255,.75),rgba(255,255,255,.75)),linear-gradient(to right,black 50%,white 50%),linear-gradient(to bottom,black 50%,white 50%);background-blend-mode:normal,difference,normal;background-size:20px 20px}:host .preview-container.type-image:not(.loaded){background:none}:host .preview-container.type-image:not(.loaded) .actions{display:none}:host .preview-container.loaded img{opacity:1}@media only screen and (max-width: 767.98px){:host .actions{display:block}}:host .actions .action.top-left{top:8px;left:8px}:host .actions .action.top-right{top:8px;right:8px}:host .actions .action.bottom-left{bottom:8px;left:8px}:host .actions .action.bottom-right{bottom:8px;right:8px}@media only screen and (min-width: 768px){:host .actions .action.top-left,:host .actions .action.top-right,:host .actions .action.bottom-left,:host .actions .action.bottom-right{transition:top .3s,bottom .3s,left .3s,right .3s}:host .actions .action.top-left{top:-50px;left:-50px}:host .actions .action.top-right{top:-50px;right:-50px}:host .actions .action.bottom-left{bottom:-50px;left:-50px}:host .actions .action.bottom-right{bottom:-50px;right:-50px}}:host .actions .action{position:absolute;cursor:pointer}:host .actions .action.hide{display:none}:host:hover .actions,:host:focus .actions{display:block}:host img{display:block;object-fit:cover;width:100%;height:100%}:host .mat-button-wrapper{padding:0;line-height:15px!important}:host .spinner{position:absolute;top:50%;left:50%;margin-left:-25%;margin-top:-25%}img{opacity:0}.loader{height:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-height:70px;aspect-ratio:1/1}.loader:after{content:\" \";display:block;width:100%;height:100%;border-radius:50%;border:6px solid #ccc;border-color:#ccc transparent #ccc transparent;animation:lds-dual-ring 1.2s linear infinite;box-sizing:border-box}@keyframes lds-dual-ring{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i3.AsyncPipe, "fsFileSrc": i5.FsFileSrcPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FsFilePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FsFilePreviewComponent, selector: "fs-file-preview", inputs: { previewActions: "previewActions", showFilename: "showFilename", previewWidth: "previewWidth", previewHeight: "previewHeight", file: "file", url: "url", index: "index", showActionOn: "showActionOn" }, outputs: { remove: "remove" }, queries: [{ propertyName: "childrenPreviewActions", predicate: FsFilePreviewActionDirective }], usesOnChanges: true, ngImport: i0, template: "<div\n    [style.width.px]=\"previewWidth\"\n    [style.height.px]=\"previewHeight\"\n    class=\"preview-container\"\n    [ngClass]=\"{ \n      'has-actions': (childrenPreviewActions.length !== 0 || previewActions.length !== 0),  \n      'type-image': typeImage,\n      'loaded': loaded,\n      'show-action-always': showActionOn === 'always'\n    }\">\n  <!-- Image container -->\n  <ng-container \n      *ngIf=\"typeImage; else nonImage\">\n    <ng-container *ngIf=\"(file | fsFileSrc | async) as src\">\n      <img \n        [src]=\"src\" \n        (load)=\"previewLoaded()\">\n    </ng-container>\n   \n    <ng-container *ngIf=\"!loaded\">\n      <div class=\"loader\"></div>\n    </ng-container>\n  </ng-container>\n\n  <!-- Non image container -->\n  <ng-template #nonImage>\n    <div class=\"file-details\">\n      <div class=\"file-icon\">\n        <div \n            class=\"file-ext\"\n            [style.fontSize]=\"extensionFontSize + 'px'\">\n          {{file.extension}}\n        </div>\n        <mat-icon \n          [style.width]=\"iconDim + 'px'\" \n          [style.height]=\"iconDim + 'px'\"\n          [style.fontSize]=\"iconDim + 'px'\">insert_drive_file</mat-icon>\n      </div>\n      <ng-container *ngIf=\"showFilename && file.name\">\n        <a \n            class=\"file-name\" \n            [matTooltip]=\"file.name\">\n          {{file.name}}\n        </a>\n      </ng-container>\n    </div>\n  </ng-template>\n\n  <div class=\"actions\">\n    <ng-container *ngFor=\"let previewAction of previewActions\">\n      <ng-container \n        [ngTemplateOutlet]=\"previewActionTmpl\" \n        [ngTemplateOutletContext]=\"{ previewAction: previewAction}\">\n      </ng-container>\n    </ng-container>\n    <ng-container *ngFor=\"let previewAction of childrenPreviewActions\">\n      <ng-container \n        [ngTemplateOutlet]=\"previewActionTmpl\" \n        [ngTemplateOutletContext]=\"{ previewAction: previewAction }\">\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <div class=\"spinner\">\n    <mat-spinner *ngIf=\"file.progress\" [diameter]=\"30\"></mat-spinner>\n  </div>\n  <ng-content></ng-content>\n</div>\n\n<ng-template #previewActionTmpl let-previewAction=\"previewAction\">\n  <div\n      class=\"action mat-mini-fab mat-primary\"\n      *ngIf=\"!previewAction.hide\"\n      [class]=\"previewAction.placement\"\n      [matTooltip]=\"previewAction.tooltip\"\n      (click)=\"callAction($event, previewAction)\">\n    <span class=\"mat-button-wrapper\">\n      <ng-template [ngTemplateOutlet]=\"previewAction.templateRef\"></ng-template>\n    </span>\n  </div>\n</ng-template>", styles: [":host{border:1px #efefef solid;display:inline-block;position:relative;vertical-align:top;overflow:hidden;border-radius:3px}:host .file-details{flex-direction:column;display:flex;padding:5px;min-width:0}:host .file-details .file-icon{position:relative;display:flex;justify-content:center}:host .file-details .file-ext{font-weight:bold;text-align:center;text-transform:uppercase;font-size:20px;position:absolute;width:100%;bottom:25%;color:#fff}:host .file-details mat-icon{color:#ccc}:host .file-details .file-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:5px;font-size:75%;text-align:center;width:100%;color:inherit;box-sizing:border-box}:host .preview-container.show-action-always .actions .action.top-left,:host .preview-container:hover .actions .action.top-left,:host .preview-container:focus .actions .action.top-left{top:8px;left:8px}:host .preview-container.show-action-always .actions .action.top-right,:host .preview-container:hover .actions .action.top-right,:host .preview-container:focus .actions .action.top-right{top:8px;right:8px}:host .preview-container.show-action-always .actions .action.bottom-left,:host .preview-container:hover .actions .action.bottom-left,:host .preview-container:focus .actions .action.bottom-left{bottom:8px;left:8px}:host .preview-container.show-action-always .actions .action.bottom-right,:host .preview-container:hover .actions .action.bottom-right,:host .preview-container:focus .actions .action.bottom-right{bottom:8px;right:8px}:host .preview-container{overflow:hidden;box-sizing:border-box;margin:auto;display:flex;align-items:center;flex-grow:1;height:100%;justify-content:center}:host .preview-container.type-image{background-image:linear-gradient(to right,rgba(255,255,255,.75),rgba(255,255,255,.75)),linear-gradient(to right,black 50%,white 50%),linear-gradient(to bottom,black 50%,white 50%);background-blend-mode:normal,difference,normal;background-size:20px 20px}:host .preview-container.type-image:not(.loaded){background:none}:host .preview-container.type-image:not(.loaded) .actions{display:none}:host .preview-container.loaded img{opacity:1}@media only screen and (max-width: 767.98px){:host .actions{display:block}}:host .actions .action.top-left{top:8px;left:8px}:host .actions .action.top-right{top:8px;right:8px}:host .actions .action.bottom-left{bottom:8px;left:8px}:host .actions .action.bottom-right{bottom:8px;right:8px}@media only screen and (min-width: 768px){:host .actions .action.top-left,:host .actions .action.top-right,:host .actions .action.bottom-left,:host .actions .action.bottom-right{transition:top .3s,bottom .3s,left .3s,right .3s}:host .actions .action.top-left{top:-50px;left:-50px}:host .actions .action.top-right{top:-50px;right:-50px}:host .actions .action.bottom-left{bottom:-50px;left:-50px}:host .actions .action.bottom-right{bottom:-50px;right:-50px}}:host .actions .action{position:absolute;cursor:pointer}:host .actions .action.hide{display:none}:host:hover .actions,:host:focus .actions{display:block}:host img{display:block;transform:translateZ(.1px);object-position:top;object-fit:cover;width:100%;height:100%}:host .mat-button-wrapper{padding:0;line-height:15px!important}:host .spinner{position:absolute;top:50%;left:50%;margin-left:-25%;margin-top:-25%}img{opacity:0}.loader{height:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);max-height:70px;aspect-ratio:1/1}.loader:after{content:\" \";display:block;width:100%;height:100%;border-radius:50%;border:6px solid #ccc;border-color:#ccc transparent #ccc transparent;animation:lds-dual-ring 1.2s linear infinite;box-sizing:border-box}@keyframes lds-dual-ring{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i3.AsyncPipe, "fsFileSrc": i5.FsFileSrcPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FsFilePreviewComponent, decorators: [{
@@ -84,0 +84,0 @@ type: Component,

package.json

 {
   "name": "@firestitch/file",
-  "version": "12.17.0",
+  "version": "12.17.1",
   "repository": {
@@ -5,0 +5,0 @@ "type": "git",

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

790803

increased by0.02%

Lines of code

6464

increased by0.03%

No dependency changes