ngx-lottie - npm Package Compare versions

Comparing version 7.0.3 to 7.0.4-beta

bundles/ngx-lottie-server.umd.js

@@ -72,2 +72,3 @@ (function (global, factory) {
     }());
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     LottieServerModule.decorators = [
@@ -74,0 +75,0 @@ { type: core.NgModule }

bundles/ngx-lottie.umd.js

@@ -376,6 +376,13 @@ (function (global, factory) {
     }());
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     AnimationLoader.decorators = [
         { type: i0.Injectable }
     ];
-    /** @nocollapse */
+    /**
+     * @type {function(): !Array<(null|{
+     *   type: ?,
+     *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+     * })>}
+     * @nocollapse
+     */
     AnimationLoader.ctorParameters = function () { return [
@@ -502,6 +509,13 @@ { type: i0.NgZone },
     }());
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     BaseDirective.decorators = [
         { type: i0.Directive, args: [{ selector: '[lottie]' },] }
     ];
-    /** @nocollapse */
+    /**
+     * @type {function(): !Array<(null|{
+     *   type: ?,
+     *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+     * })>}
+     * @nocollapse
+     */
     BaseDirective.ctorParameters = function () { return [
@@ -512,2 +526,3 @@ { type: i0.NgZone },
     ]; };
+    /** @type {!Object<string, !Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
     BaseDirective.propDecorators = {
@@ -541,6 +556,13 @@ options: [{ type: i0.Input }],
     }(BaseDirective));
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     LottieDirective.decorators = [
         { type: i0.Directive, args: [{ selector: '[lottie]' },] }
     ];
-    /** @nocollapse */
+    /**
+     * @type {function(): !Array<(null|{
+     *   type: ?,
+     *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+     * })>}
+     * @nocollapse
+     */
     LottieDirective.ctorParameters = function () { return [
@@ -567,2 +589,3 @@ { type: i0.NgZone },
     }(BaseDirective));
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     LottieComponent.decorators = [
@@ -575,3 +598,9 @@ { type: i0.Component, args: [{
     ];
-    /** @nocollapse */
+    /**
+     * @type {function(): !Array<(null|{
+     *   type: ?,
+     *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+     * })>}
+     * @nocollapse
+     */
     LottieComponent.ctorParameters = function () { return [
@@ -582,2 +611,3 @@ { type: i0.NgZone },
     ]; };
+    /** @type {!Object<string, !Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
     LottieComponent.propDecorators = {
@@ -606,2 +636,3 @@ width: [{ type: i0.Input }],
     }());
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     LottieModule.decorators = [
@@ -638,3 +669,4 @@ { type: i0.NgModule, args: [{
                 animationItem.addEventListener('config_ready', function () {
-                    _this.cache.set(options.path, animationItem['animationData']);
+                    // See the comments below on why we're storing the animation data as a string.
+                    _this.cache.set(options.path, JSON.stringify(animationItem['animationData']));
                 });
@@ -645,3 +677,8 @@ }
             if (this.isAnimationConfigWithPath(options) && this.cache.has(options.path)) {
-                return Object.assign(Object.assign({}, options), { path: undefined, animationData: this.cache.get(options.path) });
+                return Object.assign(Object.assign({}, options), { path: undefined,
+                    // Caretaker note: `lottie-web` cannot re-use the `animationData` object between animations, and we
+                    // have to retrieve a new object each time an animation is created.
+                    // https://github.com/airbnb/lottie-web#html
+                    // See comments for the `animationData` property.
+                    animationData: JSON.parse(this.cache.get(options.path)) });
             }
@@ -657,2 +694,3 @@ else {
     }(AnimationLoader));
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     CacheableAnimationLoader.decorators = [
@@ -678,2 +716,3 @@ { type: i0.Injectable }
     }());
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     LottieCacheModule.decorators = [
@@ -700,6 +739,13 @@ { type: i0.NgModule }
     /** @nocollapse */ LottieTransferState.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function LottieTransferState_Factory() { return new LottieTransferState(i0__namespace.ɵɵinject(i1__namespace.TransferState)); }, token: LottieTransferState, providedIn: "root" });
+    /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
     LottieTransferState.decorators = [
         { type: i0.Injectable, args: [{ providedIn: 'root' },] }
     ];
-    /** @nocollapse */
+    /**
+     * @type {function(): !Array<(null|{
+     *   type: ?,
+     *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+     * })>}
+     * @nocollapse
+     */
     LottieTransferState.ctorParameters = function () { return [
@@ -706,0 +752,0 @@ { type: i1.TransferState }

esm2015/lib/animation-loader.js

@@ -35,6 +35,13 @@ import { Injectable, NgZone, Inject } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 AnimationLoader.decorators = [
     { type: Injectable }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 AnimationLoader.ctorParameters = () => [
@@ -41,0 +48,0 @@ { type: NgZone },

esm2015/lib/base.directive.js

@@ -113,6 +113,13 @@ import { Directive, Input, Output, Inject, PLATFORM_ID, NgZone, } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 BaseDirective.decorators = [
     { type: Directive, args: [{ selector: '[lottie]' },] }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 BaseDirective.ctorParameters = () => [
@@ -123,2 +130,3 @@ { type: NgZone },
 ];
+/** @type {!Object<string, !Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
 BaseDirective.propDecorators = {
@@ -125,0 +133,0 @@ options: [{ type: Input }],

esm2015/lib/cacheable-animation-loader/cacheable-animation-loader.js

@@ -23,3 +23,4 @@ import { Injectable } from '@angular/core';
             animationItem.addEventListener('config_ready', () => {
-                this.cache.set(options.path, animationItem['animationData']);
+                // See the comments below on why we're storing the animation data as a string.
+                this.cache.set(options.path, JSON.stringify(animationItem['animationData']));
             });
@@ -30,3 +31,8 @@ }
         if (this.isAnimationConfigWithPath(options) && this.cache.has(options.path)) {
-            return Object.assign(Object.assign({}, options), { path: undefined, animationData: this.cache.get(options.path) });
+            return Object.assign(Object.assign({}, options), { path: undefined, 
+                // Caretaker note: `lottie-web` cannot re-use the `animationData` object between animations, and we
+                // have to retrieve a new object each time an animation is created.
+                // https://github.com/airbnb/lottie-web#html
+                // See comments for the `animationData` property.
+                animationData: JSON.parse(this.cache.get(options.path)) });
         }
@@ -41,2 +47,3 @@ else {
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 CacheableAnimationLoader.decorators = [
@@ -43,0 +50,0 @@ { type: Injectable }

esm2015/lib/cacheable-animation-loader/lottie-cache.module.js

@@ -17,2 +17,3 @@ import { NgModule } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieCacheModule.decorators = [
@@ -19,0 +20,0 @@ { type: NgModule }

esm2015/lib/lottie.component.js

@@ -15,2 +15,3 @@ import { Component, ChangeDetectionStrategy, Input, Inject, ElementRef, ViewChild, PLATFORM_ID, NgZone, } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieComponent.decorators = [
@@ -31,3 +32,9 @@ { type: Component, args: [{
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 LottieComponent.ctorParameters = () => [
@@ -38,2 +45,3 @@ { type: NgZone },
 ];
+/** @type {!Object<string, !Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
 LottieComponent.propDecorators = {
@@ -40,0 +48,0 @@ width: [{ type: Input }],

esm2015/lib/lottie.directive.js

@@ -13,6 +13,13 @@ import { Directive, Inject, Self, ElementRef, PLATFORM_ID, NgZone, } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieDirective.decorators = [
     { type: Directive, args: [{ selector: '[lottie]' },] }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 LottieDirective.ctorParameters = () => [
@@ -19,0 +26,0 @@ { type: NgZone },

esm2015/lib/lottie.module.js

@@ -22,2 +22,3 @@ import { NgModule } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieModule.decorators = [
@@ -24,0 +25,0 @@ { type: NgModule, args: [{

esm2015/lib/transfer-state.js

@@ -17,6 +17,13 @@ import { Injectable } from '@angular/core';
 /** @nocollapse */ LottieTransferState.ɵprov = i0.ɵɵdefineInjectable({ factory: function LottieTransferState_Factory() { return new LottieTransferState(i0.ɵɵinject(i1.TransferState)); }, token: LottieTransferState, providedIn: "root" });
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieTransferState.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 LottieTransferState.ctorParameters = () => [
@@ -23,0 +30,0 @@ { type: TransferState }

esm2015/server/lottie-server.module.js

@@ -24,2 +24,3 @@ import { NgModule, InjectionToken, APP_INITIALIZER } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieServerModule.decorators = [
@@ -26,0 +27,0 @@ { type: NgModule }

fesm2015/ngx-lottie-server.js

@@ -65,2 +65,3 @@ import { InjectionToken, APP_INITIALIZER, NgModule } from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieServerModule.decorators = [
@@ -67,0 +68,0 @@ { type: NgModule }

fesm2015/ngx-lottie.js

@@ -41,6 +41,13 @@ import * as i0 from '@angular/core';
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 AnimationLoader.decorators = [
     { type: Injectable }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 AnimationLoader.ctorParameters = () => [
@@ -158,6 +165,13 @@ { type: NgZone },
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 BaseDirective.decorators = [
     { type: Directive, args: [{ selector: '[lottie]' },] }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 BaseDirective.ctorParameters = () => [
@@ -168,2 +182,3 @@ { type: NgZone },
 ];
+/** @type {!Object<string, !Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
 BaseDirective.propDecorators = {
@@ -194,6 +209,13 @@ options: [{ type: Input }],
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieDirective.decorators = [
     { type: Directive, args: [{ selector: '[lottie]' },] }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 LottieDirective.ctorParameters = () => [
@@ -217,2 +239,3 @@ { type: NgZone },
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieComponent.decorators = [
@@ -233,3 +256,9 @@ { type: Component, args: [{
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 LottieComponent.ctorParameters = () => [
@@ -240,2 +269,3 @@ { type: NgZone },
 ];
+/** @type {!Object<string, !Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
 LottieComponent.propDecorators = {
@@ -261,2 +291,3 @@ width: [{ type: Input }],
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieModule.decorators = [
@@ -289,3 +320,4 @@ { type: NgModule, args: [{
             animationItem.addEventListener('config_ready', () => {
-                this.cache.set(options.path, animationItem['animationData']);
+                // See the comments below on why we're storing the animation data as a string.
+                this.cache.set(options.path, JSON.stringify(animationItem['animationData']));
             });
@@ -296,3 +328,8 @@ }
         if (this.isAnimationConfigWithPath(options) && this.cache.has(options.path)) {
-            return Object.assign(Object.assign({}, options), { path: undefined, animationData: this.cache.get(options.path) });
+            return Object.assign(Object.assign({}, options), { path: undefined, 
+                // Caretaker note: `lottie-web` cannot re-use the `animationData` object between animations, and we
+                // have to retrieve a new object each time an animation is created.
+                // https://github.com/airbnb/lottie-web#html
+                // See comments for the `animationData` property.
+                animationData: JSON.parse(this.cache.get(options.path)) });
         }
@@ -307,2 +344,3 @@ else {
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 CacheableAnimationLoader.decorators = [
@@ -325,2 +363,3 @@ { type: Injectable }
 }
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieCacheModule.decorators = [
@@ -346,6 +385,13 @@ { type: NgModule }
 /** @nocollapse */ LottieTransferState.ɵprov = i0.ɵɵdefineInjectable({ factory: function LottieTransferState_Factory() { return new LottieTransferState(i0.ɵɵinject(i1.TransferState)); }, token: LottieTransferState, providedIn: "root" });
+/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
 LottieTransferState.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
-/** @nocollapse */
+/**
+ * @type {function(): !Array<(null|{
+ *   type: ?,
+ *   decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
+ * })>}
+ * @nocollapse
+ */
 LottieTransferState.ctorParameters = () => [
@@ -352,0 +398,0 @@ { type: TransferState }

package.json

 {
   "name": "ngx-lottie",
-  "version": "7.0.3",
+  "version": "7.0.4-beta+exp.sha.4334b8f",
   "repository": {
@@ -46,4 +46,4 @@ "type": "git",
   "dependencies": {
-    "tslib": "^2.1.0"
+    "tslib": "^2.2.0"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

239023

increased by3.21%

Lines of code

2008

increased by7.55%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• Updatedtslib@^2.2.0