@aarsteinmedia/dotlottie-player 6.6.2 → 6.6.4

package/custom-elements.json

@@ -58,7 +58,7 @@
           ],
           "superclass": {
             "name": "DotLottiePlayerBase",
-            "module": "/dist/chunks/DotLottiePlayerBase-1cqXX2jB.js"
+            "module": "/dist/chunks/DotLottiePlayerBase-CREYTonO.js"
           },
           "tagName": "tagName",
           "customElement": true

package/dist/canvas.d.ts

@@ -1,5 +1,5 @@
-import { D as DotLottiePlayerCanvas } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
-export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
+import { D as DotLottiePlayerCanvas } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
+export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
 import '@aarsteinmedia/lottie-web';
 import '@aarsteinmedia/lottie-web/utils';
 import './utilities.js';

package/dist/canvas.js

@@ -1,6 +1,6 @@
 import { RendererType, isServer } from '@aarsteinmedia/lottie-web/utils';
 import { loadAnimation } from '@aarsteinmedia/lottie-web/canvas';
-import { D as DotLottiePlayerBase } from './chunks/DotLottiePlayerBase-1cqXX2jB.js';
+import { D as DotLottiePlayerBase } from './chunks/DotLottiePlayerBase-CREYTonO.js';
 import { t as tagName } from './chunks/utilities-CC4oA5Yh.js';
 import '@aarsteinmedia/lottie-web/dotlottie';
 

package/dist/chunks/{DotLottiePlayerBase-1cqXX2jB.js → DotLottiePlayerBase-CREYTonO.js}

@@ -10,7 +10,7 @@ function loadControlsModule() {
 
 let modulePromise = null;
 function loadErrorModule() {
-    modulePromise = modulePromise ?? import('./errorScreen-DcJ2haCJ.js');
+    modulePromise = modulePromise ?? import('./errorScreen-Bq5V84Fj.js');
     return modulePromise;
 }
 
@@ -512,21 +512,7 @@ class ScrollElement extends BaseElement {
             if (!this.playOnVisible && this.playerState === PlayerState.Frozen && !(this.autoplay && reducedMotionQuery?.matches)) {
                 this.play();
             }
-            if (!this.playOnVisible || reducedMotionQuery?.matches) {
-                return;
-            }
-            if (this.playerState === PlayerState.Completed && !this.once) {
-                this.playerState = PlayerState.Playing;
-                this._lottieInstance?.goToAndPlay(this.direction === 1 ? 0 : this._lottieInstance.totalFrames);
-                return;
-            }
-            this._playerState.playTimeout = setTimeout(()=>{
-                this.play();
-            }, this.delay);
-            if (this.playerState !== PlayerState.Playing) {
-                return;
-            }
-            clearTimeout(this._playerState.playTimeout);
+            this._playOnVisible();
         });
         this._observeIntersectionTarget();
     }
@@ -583,6 +569,23 @@ class ScrollElement extends BaseElement {
         // use overflow-* (IO / layout interaction quirks).
         this._intersectionObserver.observe(this._container);
     }
+    _playOnVisible() {
+        if (!this.playOnVisible || reducedMotionQuery?.matches) {
+            return;
+        }
+        if (this.playerState === PlayerState.Completed && !this.once) {
+            this.playerState = PlayerState.Playing;
+            this._lottieInstance?.goToAndPlay(this.direction === 1 ? 0 : this._lottieInstance.totalFrames);
+            return;
+        }
+        this._playerState.playTimeout = setTimeout(()=>{
+            this.play();
+        }, this.delay);
+        if (this.playerState !== PlayerState.Playing) {
+            return;
+        }
+        clearTimeout(this._playerState.playTimeout);
+    }
     constructor(...args){
         super(...args), this.isIntersecting = false, this._useGeometricScroll = false;
     }
@@ -1207,7 +1210,6 @@ var controls = /*#__PURE__*/Object.freeze({
         if (name === '_isSettingsOpen' && typeof value === 'boolean' && elements.popover && elements.convert && elements.snapshot) {
             elements.popover.hidden = !value;
             elements.convert.hidden = !this.canConvert;
-            elements.snapshot.hidden = this.renderer !== RendererType.SVG;
         }
     }
     /**
@@ -1307,24 +1309,36 @@ var controls = /*#__PURE__*/Object.freeze({
     }
     /**
    * Snapshot and download the current frame as SVG.
-   */ snapshot(shouldDownload = true, name = 'AM Lottie') {
+   */ async snapshot(shouldDownload = true, name = 'AM Lottie') {
         try {
             if (!this.shadowRoot || !this._lottieInstance) {
                 throw new Error('Unknown error');
             }
-            // Get SVG element and serialize markup
-            const svgElement = this.shadowRoot.querySelector('.animation svg');
-            if (!svgElement) {
+            let data = null;
+            // Get animation element and handle markup
+            const animationElement = this.shadowRoot.querySelector(`.animation ${this.renderer}`);
+            if (!animationElement) {
                 throw new Error('Could not retrieve animation from DOM');
             }
-            const data = svgElement instanceof Node ? new XMLSerializer().serializeToString(svgElement) : null;
+            const isSVG = this.renderer === RendererType.SVG;
+            if (isSVG) {
+                data = animationElement instanceof Node ? new XMLSerializer().serializeToString(animationElement) : null;
+            } else {
+                const blob = await new Promise((resolve)=>{
+                    if (animationElement instanceof HTMLCanvasElement) {
+                        animationElement.toBlob(resolve, 'image/png');
+                    }
+                });
+                data = await blob?.arrayBuffer() ?? null;
+            }
             if (!data) {
                 throw new Error('Could not serialize SVG element');
             }
+            const mimeType = isSVG ? 'image/svg+xml' : 'image/png', extension = isSVG ? 'svg' : 'png';
             if (shouldDownload) {
                 download(data, {
-                    mimeType: 'image/svg+xml',
-                    name: `${getFilename(this.src || name)}-${frameOutput(this._seeker * this._lottieInstance.totalFrames / 100)}.svg`
+                    mimeType,
+                    name: `${getFilename(this.src || name)}-${frameOutput(this._seeker * this._lottieInstance.totalFrames / 100)}.${extension}`
                 });
             }
             return data;
@@ -1602,7 +1616,7 @@ var controls = /*#__PURE__*/Object.freeze({
         this.devLog(error);
     }
     _handleInlineScript() {
-        const inlineScript = this.parentElement?.querySelector(':scope > script#aamd_inline_script');
+        const inlineScript = this.parentElement?.querySelector(':scope > script.aamd_inline_script');
         if (!inlineScript) {
             return;
         }

package/dist/chunks/{DotLottiePlayerCanvas.d-BuQAVERW.d.ts → DotLottiePlayerCanvas.d-DRzu-rar.d.ts}

@@ -102,6 +102,7 @@ declare abstract class ScrollElement extends BaseElement {
     private _getGeometricScrollProgress;
     private _getScrollProgress;
     private _observeIntersectionTarget;
+    private _playOnVisible;
 }
 
 declare abstract class DotLottiePlayerBase extends ScrollElement {
@@ -158,7 +159,7 @@ declare abstract class DotLottiePlayerBase extends ScrollElement {
     setSegment(segment: Vector2): void;
     setSpeed(value?: number): void;
     setSubframe(value: boolean): void;
-    snapshot(shouldDownload?: boolean, name?: string): string | null;
+    snapshot(shouldDownload?: boolean, name?: string): Promise<string | ArrayBuffer | null>;
     stop(): void;
     toggleBoomerang(): void;
     toggleLoop(): void;

package/dist/chunks/{errorScreen-DcJ2haCJ.js → errorScreen-Bq5V84Fj.js}

@@ -1,5 +1,5 @@
 import { PreserveAspectRatio, namespaceSVG } from '@aarsteinmedia/lottie-web/utils';
-import { e as escapeHTML } from './DotLottiePlayerBase-1cqXX2jB.js';
+import { e as escapeHTML } from './DotLottiePlayerBase-CREYTonO.js';
 import '@aarsteinmedia/lottie-web/dotlottie';
 import './utilities-CC4oA5Yh.js';
 

package/dist/full.d.ts

@@ -1,5 +1,5 @@
-import { b as DotLottiePlayer } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
-export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
+import { b as DotLottiePlayer } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
+export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
 import '@aarsteinmedia/lottie-web';
 import '@aarsteinmedia/lottie-web/utils';
 import './utilities.js';

package/dist/full.js

@@ -1,6 +1,6 @@
 import { RendererType, isServer } from '@aarsteinmedia/lottie-web/utils';
 import { loadAnimation } from '@aarsteinmedia/lottie-web';
-import { D as DotLottiePlayerBase, l as loadDotLottieTools } from './chunks/DotLottiePlayerBase-1cqXX2jB.js';
+import { D as DotLottiePlayerBase, l as loadDotLottieTools } from './chunks/DotLottiePlayerBase-CREYTonO.js';
 import { t as tagName } from './chunks/utilities-CC4oA5Yh.js';
 import '@aarsteinmedia/lottie-web/dotlottie';
 

package/dist/light.d.ts

@@ -1,5 +1,5 @@
-import { c as DotLottiePlayerLight } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
-export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
+import { c as DotLottiePlayerLight } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
+export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
 import '@aarsteinmedia/lottie-web';
 import '@aarsteinmedia/lottie-web/utils';
 import './utilities.js';

package/dist/light.js

@@ -1,6 +1,6 @@
 import { RendererType, isServer } from '@aarsteinmedia/lottie-web/utils';
 import { loadAnimation } from '@aarsteinmedia/lottie-web/light';
-import { D as DotLottiePlayerBase } from './chunks/DotLottiePlayerBase-1cqXX2jB.js';
+import { D as DotLottiePlayerBase } from './chunks/DotLottiePlayerBase-CREYTonO.js';
 import { t as tagName } from './chunks/utilities-CC4oA5Yh.js';
 import '@aarsteinmedia/lottie-web/dotlottie';
 

package/dist/svg.d.ts

@@ -1,5 +1,5 @@
-import { d as DotLottiePlayerSVG } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
-export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-BuQAVERW.js';
+import { d as DotLottiePlayerSVG } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
+export { a as DotLottiePlayerBase } from './chunks/DotLottiePlayerCanvas.d-DRzu-rar.js';
 import '@aarsteinmedia/lottie-web';
 import '@aarsteinmedia/lottie-web/utils';
 import './utilities.js';

package/dist/svg.js

@@ -1,6 +1,6 @@
 import { RendererType, isServer } from '@aarsteinmedia/lottie-web/utils';
 import { loadAnimation } from '@aarsteinmedia/lottie-web/svg';
-import { D as DotLottiePlayerBase } from './chunks/DotLottiePlayerBase-1cqXX2jB.js';
+import { D as DotLottiePlayerBase } from './chunks/DotLottiePlayerBase-CREYTonO.js';
 import { t as tagName } from './chunks/utilities-CC4oA5Yh.js';
 import '@aarsteinmedia/lottie-web/dotlottie';