@aarsteinmedia/dotlottie-player 3.0.3 → 3.0.5
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.
- package/dist/cjs/index.js +13 -8
- package/dist/custom-elements.json +1 -1
- package/dist/esm/index.js +13 -8
- package/dist/index.d.ts +2 -2
- package/dist/index.js +2 -2
- package/package.json +1 -1
package/dist/cjs/index.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var Lottie = require('lottie-web');
|
|
4
4
|
var fflate = require('fflate');
|
|
5
5
|
|
|
6
|
-
var name="@aarsteinmedia/dotlottie-player";var version="3.0.
|
|
6
|
+
var name="@aarsteinmedia/dotlottie-player";var version="3.0.5";var description="Web Component for playing Lottie animations in your web app. Previously @johanaarstein/dotlottie-player";var exports$1={".":{"import":"./dist/esm/index.js",node:"./dist/esm/index.js",require:"./dist/cjs/index.js",types:"./dist/index.d.ts"}};var main="./dist/esm/index.js";var unpkg="./dist/index.js";var module$1="./dist/esm/index.js";var types="./dist/index.d.ts";var type="module";var homepage="https://www.aarstein.media/en/dotlottie-player";var repository={url:"git+https://github.com/aarsteinmedia/dotlottie-player.git",type:"git"};var bugs="https://github.com/aarsteinmedia/dotlottie-player/issues";var author={name:"Johan Martin Aarstein",email:"johan@aarstein.media",url:"https://www.aarstein.media",organization:"Aarstein Media"};var contributors=[{name:"Anthony Colpron",email:"anthonycolpron@gmail.com",url:"https://github.com/anthony-colpron"}];var license="GPL-2.0-or-later";var scripts={build:"rimraf ./dist && rollup -c","build:types":"rimraf ./types && tsc","build:cem":"npx cem analyze --config cem.config.mjs",prod:"pnpm build:types && pnpm build && pnpm build:cem",dev:"rollup -c -w --environment NODE_ENV:development",lint:"tsc && eslint . --ext .ts","lint:fix":"eslint . --ext .ts --fix"};var dependencies={fflate:"^0.8.2","lottie-web":"^5.12.2"};var peerDependencies={"@types/react":">= 16.0.0"};var devDependencies={"@custom-elements-manifest/analyzer":"^0.10.3","@rollup/plugin-commonjs":"^26.0.1","@rollup/plugin-json":"^6.1.0","@rollup/plugin-node-resolve":"^15.2.3","@rollup/plugin-typescript":"^11.1.6","@swc/core":"^1.7.6","@types/node":"^22.1.0","@typescript-eslint/eslint-plugin":"^8.0.1","@typescript-eslint/parser":"^8.0.1",autoprefixer:"^10.4.20","esbuild-sass-plugin":"^3.3.1",eslint:"^8.57.0","eslint-config-prettier":"^9.1.0","eslint-import-resolver-typescript":"^3.6.1","eslint-plugin-import":"^2.29.1","eslint-plugin-jsdoc":"^48.11.0","eslint-plugin-prettier":"^5.2.1","postcss-flexbugs-fixes":"^5.0.2",prettier:"^3.3.3",rimraf:"^6.0.1",rollup:"^4.20.0","rollup-plugin-dts":"^6.1.1","rollup-plugin-html-literals":"^1.1.8","rollup-plugin-livereload":"^2.0.5","rollup-plugin-postcss":"^4.0.2","rollup-plugin-serve":"^1.1.1","rollup-plugin-summary":"^2.0.1","rollup-plugin-swc3":"^0.11.2",sass:"^1.77.8",tslib:"^2.6.3",typescript:"^5.5.4"};var customElements$1="dist/custom-elements.json";var files=["dist","README.md"];var keywords=["lottie","dotlottie","animation","web component","svg","vector","player"];var publishConfig={access:"public"};var engines={node:">= 8.17.0"};var funding={type:"paypal",url:"https://www.paypal.com/donate/?hosted_button_id=E7C7DMN8KSQ6A"};var pkg = {name:name,version:version,description:description,exports:exports$1,main:main,unpkg:unpkg,module:module$1,types:types,type:type,homepage:homepage,repository:repository,bugs:bugs,author:author,contributors:contributors,license:license,scripts:scripts,dependencies:dependencies,peerDependencies:peerDependencies,devDependencies:devDependencies,customElements:customElements$1,files:files,keywords:keywords,publishConfig:publishConfig,engines:engines,funding:funding};
|
|
7
7
|
|
|
8
8
|
var ObjectFit;
|
|
9
9
|
(function(ObjectFit) {
|
|
@@ -127,7 +127,7 @@ const addExt = (ext, str)=>{
|
|
|
127
127
|
}, createJSON = ({ animation, fileName, shouldDownload })=>{
|
|
128
128
|
try {
|
|
129
129
|
if (!animation) {
|
|
130
|
-
throw new Error(
|
|
130
|
+
throw new Error("Missing or malformed required parameter(s):\n - animation\n'");
|
|
131
131
|
}
|
|
132
132
|
const name = addExt('json', fileName) || `${useId()}.json`, jsonString = JSON.stringify(animation);
|
|
133
133
|
return shouldDownload ? download(jsonString, {
|
|
@@ -450,10 +450,6 @@ class DotLottiePlayer extends EnhancedElement {
|
|
|
450
450
|
if (!this._lottieInstance) {
|
|
451
451
|
return;
|
|
452
452
|
}
|
|
453
|
-
const toggleLoop = this.shadow.querySelector('.toggleLoop'), toggleBoomerang = this.shadow.querySelector('.toggleBoomerang');
|
|
454
|
-
if (!(toggleLoop instanceof HTMLButtonElement) || !(toggleBoomerang instanceof HTMLButtonElement)) {
|
|
455
|
-
return;
|
|
456
|
-
}
|
|
457
453
|
if (name === 'animateOnScroll') {
|
|
458
454
|
if (value === '' || Boolean(value)) {
|
|
459
455
|
this._lottieInstance.autoplay = false;
|
|
@@ -494,10 +490,19 @@ class DotLottiePlayer extends EnhancedElement {
|
|
|
494
490
|
this._container.removeEventListener('mouseleave', this._mouseLeave);
|
|
495
491
|
}
|
|
496
492
|
if (name === 'loop') {
|
|
497
|
-
toggleLoop
|
|
493
|
+
const toggleLoop = this.shadow.querySelector('.toggleLoop');
|
|
494
|
+
if (toggleLoop instanceof HTMLButtonElement) {
|
|
495
|
+
toggleLoop.dataset.active = value;
|
|
496
|
+
}
|
|
497
|
+
this._lottieInstance.setLoop(value === '' || Boolean(value));
|
|
498
498
|
}
|
|
499
499
|
if (name === 'mode') {
|
|
500
|
+
const toggleBoomerang = this.shadow.querySelector('.toggleBoomerang');
|
|
501
|
+
if (!(toggleBoomerang instanceof HTMLButtonElement)) {
|
|
502
|
+
return;
|
|
503
|
+
}
|
|
500
504
|
toggleBoomerang.dataset.active = (value === exports.PlayMode.Bounce).toString();
|
|
505
|
+
this._isBounce = value === exports.PlayMode.Bounce;
|
|
501
506
|
}
|
|
502
507
|
if (name === 'speed') {
|
|
503
508
|
const val = Number(value);
|
|
@@ -1481,8 +1486,8 @@ class DotLottiePlayer extends EnhancedElement {
|
|
|
1481
1486
|
}
|
|
1482
1487
|
};
|
|
1483
1488
|
this._complete = this._complete.bind(this);
|
|
1484
|
-
this._dataReady = this._dataReady.bind(this);
|
|
1485
1489
|
this._dataFailed = this._dataFailed.bind(this);
|
|
1490
|
+
this._dataReady = this._dataReady.bind(this);
|
|
1486
1491
|
this._DOMLoaded = this._DOMLoaded.bind(this);
|
|
1487
1492
|
this._enterFrame = this._enterFrame.bind(this);
|
|
1488
1493
|
this._freeze = this._freeze.bind(this);
|
package/dist/esm/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import Lottie from 'lottie-web';
|
|
2
2
|
import { strToU8, zip, strFromU8, unzip as unzip$1 } from 'fflate';
|
|
3
3
|
|
|
4
|
-
var name="@aarsteinmedia/dotlottie-player";var version="3.0.
|
|
4
|
+
var name="@aarsteinmedia/dotlottie-player";var version="3.0.5";var description="Web Component for playing Lottie animations in your web app. Previously @johanaarstein/dotlottie-player";var exports={".":{"import":"./dist/esm/index.js",node:"./dist/esm/index.js",require:"./dist/cjs/index.js",types:"./dist/index.d.ts"}};var main="./dist/esm/index.js";var unpkg="./dist/index.js";var module="./dist/esm/index.js";var types="./dist/index.d.ts";var type="module";var homepage="https://www.aarstein.media/en/dotlottie-player";var repository={url:"git+https://github.com/aarsteinmedia/dotlottie-player.git",type:"git"};var bugs="https://github.com/aarsteinmedia/dotlottie-player/issues";var author={name:"Johan Martin Aarstein",email:"johan@aarstein.media",url:"https://www.aarstein.media",organization:"Aarstein Media"};var contributors=[{name:"Anthony Colpron",email:"anthonycolpron@gmail.com",url:"https://github.com/anthony-colpron"}];var license="GPL-2.0-or-later";var scripts={build:"rimraf ./dist && rollup -c","build:types":"rimraf ./types && tsc","build:cem":"npx cem analyze --config cem.config.mjs",prod:"pnpm build:types && pnpm build && pnpm build:cem",dev:"rollup -c -w --environment NODE_ENV:development",lint:"tsc && eslint . --ext .ts","lint:fix":"eslint . --ext .ts --fix"};var dependencies={fflate:"^0.8.2","lottie-web":"^5.12.2"};var peerDependencies={"@types/react":">= 16.0.0"};var devDependencies={"@custom-elements-manifest/analyzer":"^0.10.3","@rollup/plugin-commonjs":"^26.0.1","@rollup/plugin-json":"^6.1.0","@rollup/plugin-node-resolve":"^15.2.3","@rollup/plugin-typescript":"^11.1.6","@swc/core":"^1.7.6","@types/node":"^22.1.0","@typescript-eslint/eslint-plugin":"^8.0.1","@typescript-eslint/parser":"^8.0.1",autoprefixer:"^10.4.20","esbuild-sass-plugin":"^3.3.1",eslint:"^8.57.0","eslint-config-prettier":"^9.1.0","eslint-import-resolver-typescript":"^3.6.1","eslint-plugin-import":"^2.29.1","eslint-plugin-jsdoc":"^48.11.0","eslint-plugin-prettier":"^5.2.1","postcss-flexbugs-fixes":"^5.0.2",prettier:"^3.3.3",rimraf:"^6.0.1",rollup:"^4.20.0","rollup-plugin-dts":"^6.1.1","rollup-plugin-html-literals":"^1.1.8","rollup-plugin-livereload":"^2.0.5","rollup-plugin-postcss":"^4.0.2","rollup-plugin-serve":"^1.1.1","rollup-plugin-summary":"^2.0.1","rollup-plugin-swc3":"^0.11.2",sass:"^1.77.8",tslib:"^2.6.3",typescript:"^5.5.4"};var customElements$1="dist/custom-elements.json";var files=["dist","README.md"];var keywords=["lottie","dotlottie","animation","web component","svg","vector","player"];var publishConfig={access:"public"};var engines={node:">= 8.17.0"};var funding={type:"paypal",url:"https://www.paypal.com/donate/?hosted_button_id=E7C7DMN8KSQ6A"};var pkg = {name:name,version:version,description:description,exports:exports,main:main,unpkg:unpkg,module:module,types:types,type:type,homepage:homepage,repository:repository,bugs:bugs,author:author,contributors:contributors,license:license,scripts:scripts,dependencies:dependencies,peerDependencies:peerDependencies,devDependencies:devDependencies,customElements:customElements$1,files:files,keywords:keywords,publishConfig:publishConfig,engines:engines,funding:funding};
|
|
5
5
|
|
|
6
6
|
var ObjectFit;
|
|
7
7
|
(function(ObjectFit) {
|
|
@@ -125,7 +125,7 @@ const addExt = (ext, str)=>{
|
|
|
125
125
|
}, createJSON = ({ animation, fileName, shouldDownload })=>{
|
|
126
126
|
try {
|
|
127
127
|
if (!animation) {
|
|
128
|
-
throw new Error(
|
|
128
|
+
throw new Error("Missing or malformed required parameter(s):\n - animation\n'");
|
|
129
129
|
}
|
|
130
130
|
const name = addExt('json', fileName) || `${useId()}.json`, jsonString = JSON.stringify(animation);
|
|
131
131
|
return shouldDownload ? download(jsonString, {
|
|
@@ -448,10 +448,6 @@ class DotLottiePlayer extends EnhancedElement {
|
|
|
448
448
|
if (!this._lottieInstance) {
|
|
449
449
|
return;
|
|
450
450
|
}
|
|
451
|
-
const toggleLoop = this.shadow.querySelector('.toggleLoop'), toggleBoomerang = this.shadow.querySelector('.toggleBoomerang');
|
|
452
|
-
if (!(toggleLoop instanceof HTMLButtonElement) || !(toggleBoomerang instanceof HTMLButtonElement)) {
|
|
453
|
-
return;
|
|
454
|
-
}
|
|
455
451
|
if (name === 'animateOnScroll') {
|
|
456
452
|
if (value === '' || Boolean(value)) {
|
|
457
453
|
this._lottieInstance.autoplay = false;
|
|
@@ -492,10 +488,19 @@ class DotLottiePlayer extends EnhancedElement {
|
|
|
492
488
|
this._container.removeEventListener('mouseleave', this._mouseLeave);
|
|
493
489
|
}
|
|
494
490
|
if (name === 'loop') {
|
|
495
|
-
toggleLoop
|
|
491
|
+
const toggleLoop = this.shadow.querySelector('.toggleLoop');
|
|
492
|
+
if (toggleLoop instanceof HTMLButtonElement) {
|
|
493
|
+
toggleLoop.dataset.active = value;
|
|
494
|
+
}
|
|
495
|
+
this._lottieInstance.setLoop(value === '' || Boolean(value));
|
|
496
496
|
}
|
|
497
497
|
if (name === 'mode') {
|
|
498
|
+
const toggleBoomerang = this.shadow.querySelector('.toggleBoomerang');
|
|
499
|
+
if (!(toggleBoomerang instanceof HTMLButtonElement)) {
|
|
500
|
+
return;
|
|
501
|
+
}
|
|
498
502
|
toggleBoomerang.dataset.active = (value === PlayMode.Bounce).toString();
|
|
503
|
+
this._isBounce = value === PlayMode.Bounce;
|
|
499
504
|
}
|
|
500
505
|
if (name === 'speed') {
|
|
501
506
|
const val = Number(value);
|
|
@@ -1479,8 +1484,8 @@ class DotLottiePlayer extends EnhancedElement {
|
|
|
1479
1484
|
}
|
|
1480
1485
|
};
|
|
1481
1486
|
this._complete = this._complete.bind(this);
|
|
1482
|
-
this._dataReady = this._dataReady.bind(this);
|
|
1483
1487
|
this._dataFailed = this._dataFailed.bind(this);
|
|
1488
|
+
this._dataReady = this._dataReady.bind(this);
|
|
1484
1489
|
this._DOMLoaded = this._DOMLoaded.bind(this);
|
|
1485
1490
|
this._enterFrame = this._enterFrame.bind(this);
|
|
1486
1491
|
this._freeze = this._freeze.bind(this);
|
package/dist/index.d.ts
CHANGED
|
@@ -75,7 +75,7 @@ interface AnimationSettings {
|
|
|
75
75
|
interface Animation extends AnimationSettings {
|
|
76
76
|
id: string;
|
|
77
77
|
}
|
|
78
|
-
interface
|
|
78
|
+
interface AnimationAttributes extends Animation {
|
|
79
79
|
url: string;
|
|
80
80
|
}
|
|
81
81
|
interface LottieManifest {
|
|
@@ -229,7 +229,7 @@ declare class DotLottiePlayer extends EnhancedElement {
|
|
|
229
229
|
private _handleScroll;
|
|
230
230
|
private _handleSeekChange;
|
|
231
231
|
private _isLottie;
|
|
232
|
-
addAnimation(configs:
|
|
232
|
+
addAnimation(configs: AnimationAttributes[], fileName?: string, shouldDownload?: boolean): Promise<void | ArrayBuffer>;
|
|
233
233
|
getLottie(): AnimationItem | null;
|
|
234
234
|
play(): Promise<void>;
|
|
235
235
|
pause(): void;
|