@aarsteinmedia/dotlottie-player 5.2.2 → 5.2.4

package/CHANGELOG.md

@@ -7,7 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 Changelog was only added since [3.2.3], so it's not exhaustive. [Please report any missing noteable changes to us](https://github.com/aarsteinmedia/dotlottie-player/issues), and we'll add them promptly.
 
-## [5.2.2] - 11-06-2025
+## [5.2.4] - 11-06-2025
 
 ### Changed
 
@@ -289,6 +289,7 @@ Changelog was only added since [3.2.3], so it's not exhaustive. [Please report a
 - Removed dependencies
   - `@lit`
 
+[5.2.4]: https://www.npmjs.com/package/@aarsteinmedia/dotlottie-player/v/5.2.4
 [5.2.0]: https://www.npmjs.com/package/@aarsteinmedia/dotlottie-player/v/5.2.0
 [5.1.13]: https://www.npmjs.com/package/@aarsteinmedia/dotlottie-player/v/5.1.13
 [5.1.11]: https://www.npmjs.com/package/@aarsteinmedia/dotlottie-player/v/5.1.11

package/custom-elements.json

@@ -368,6 +368,16 @@
               ],
               "description": "Handles click and drag actions on the progress track."
             },
+            {
+              "kind": "method",
+              "name": "_handleSettingsClick",
+              "parameters": [
+                {
+                  "name": "{ target }"
+                }
+              ],
+              "description": "Handle settings click event."
+            },
             {
               "kind": "method",
               "name": "_addEventListeners",
@@ -586,10 +596,6 @@
               },
               "default": "[]"
             },
-            {
-              "kind": "field",
-              "name": "_handleSettingsClick"
-            },
             {
               "kind": "field",
               "name": "template"

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import { RendererType } from '@aarsteinmedia/lottie-web/utils';
 export { PlayerEvents } from '@aarsteinmedia/lottie-web/utils';
 import { AnimationSettings, AnimationData, LottieManifest, AnimationDirection, AnimationItem, Vector2 } from '@aarsteinmedia/lottie-web';
 
@@ -84,11 +85,6 @@ declare enum PreserveAspectRatio {
     Initial = "none",
     None = "xMinYMin slice"
 }
-declare enum RendererType {
-    Canvas = "canvas",
-    HTML = "html",
-    SVG = "svg"
-}
 
 declare class DotLottiePlayer extends PropertyCallbackElement {
     static get observedAttributes(): string[];
@@ -196,7 +192,7 @@ declare class DotLottiePlayer extends PropertyCallbackElement {
     protected _freeze(): void;
     protected _handleBlur(): void;
     protected _handleSeekChange({ target }: Event): void;
-    protected _handleSettingsClick: ({ target }: Event) => void;
+    protected _handleSettingsClick({ target }: Event): void;
     private _addEventListeners;
     private _addIntersectionObserver;
     private _complete;

package/dist/index.js

@@ -1,4 +1,4 @@
-import { _isServer, createElementID, PreserveAspectRatio as PreserveAspectRatio$1, PlayerEvents } from '@aarsteinmedia/lottie-web/utils';
+import { isServer, createElementID, PreserveAspectRatio as PreserveAspectRatio$1, RendererType, PlayerEvents } from '@aarsteinmedia/lottie-web/utils';
 export { PlayerEvents } from '@aarsteinmedia/lottie-web/utils';
 import Lottie from '@aarsteinmedia/lottie-web';
 import { strToU8, zip, strFromU8, unzip as unzip$1 } from 'fflate';
@@ -6,7 +6,7 @@ import { strToU8, zip, strFromU8, unzip as unzip$1 } from 'fflate';
 /**
  * Credit to: Leonardo Favre https://github.com/leofavre/observed-properties.
  */ const updateOnConnected = Symbol('UPDATE_ON_CONNECTED');
-if (_isServer) {
+if (isServer) {
     // Mock HTMLElement for server-side rendering
     global.HTMLElement = // eslint-disable-next-line @typescript-eslint/no-extraneous-class
     class EmptyHTMLElement {
@@ -95,12 +95,6 @@ var PreserveAspectRatio = /*#__PURE__*/ function(PreserveAspectRatio) {
     PreserveAspectRatio["None"] = "xMinYMin slice";
     return PreserveAspectRatio;
 }({});
-var RendererType = /*#__PURE__*/ function(RendererType) {
-    RendererType["Canvas"] = "canvas";
-    RendererType["HTML"] = "html";
-    RendererType["SVG"] = "svg";
-    return RendererType;
-}({});
 
 /**
  * Render Controls.
@@ -258,13 +252,13 @@ const hasExt = (path)=>{
    *
    * @param str - Base64 encoded string.
    * @returns UTF-8/Latin-1 binary.
-   */ base64ToU8 = (str)=>strToU8(_isServer ? Buffer.from(parseBase64(str), 'base64').toString('binary') : atob(parseBase64(str)), true), getExtFromB64 = (str)=>{
+   */ base64ToU8 = (str)=>strToU8(isServer ? Buffer.from(parseBase64(str), 'base64').toString('binary') : atob(parseBase64(str)), true), getExtFromB64 = (str)=>{
     const mime = str.split(':')[1].split(';')[0], ext = mime.split('/')[1].split('+')[0];
     return ext;
 }, handleErrors = (err)=>{
     const res = {
         message: 'Unknown error',
-        status: _isServer ? 500 : 400
+        status: isServer ? 500 : 400
     };
     if (err && typeof err === 'object') {
         if ('message' in err && typeof err.message === 'string') {
@@ -474,7 +468,7 @@ async function resolveAssets(unzipped, assets) {
         }
         toResolve.push(new Promise((resolveAsset)=>{
             let assetB64;
-            if (_isServer) {
+            if (isServer) {
                 assetB64 = Buffer.from(u8).toString('base64');
             } else {
                 let result = '';
@@ -875,15 +869,7 @@ const generator = '@aarsteinmedia/dotlottie-player';
    * Which animation to show, if several.
    */ this._currentAnimation = 0, this._isBounce = false, this._isDotLottie = false, this._lottieInstance = null, /**
    * Multi-animation settings.
-   */ this._multiAnimationSettings = [], /**
-   * Handle settings click event.
-   */ this._handleSettingsClick = ({ target })=>{
-            this._toggleSettings();
-            // Because Safari does not add focus on click, we need to add it manually, so the onblur event will fire
-            if (target instanceof HTMLElement) {
-                target.focus();
-            }
-        };
+   */ this._multiAnimationSettings = [];
         this._complete = this._complete.bind(this);
         this._dataFailed = this._dataFailed.bind(this);
         this._dataReady = this._dataReady.bind(this);
@@ -899,6 +885,7 @@ const generator = '@aarsteinmedia/dotlottie-player';
         this._mouseLeave = this._mouseLeave.bind(this);
         this._onVisibilityChange = this._onVisibilityChange.bind(this);
         this._switchInstance = this._switchInstance.bind(this);
+        this._handleSettingsClick = this._handleSettingsClick.bind(this);
         this.togglePlay = this.togglePlay.bind(this);
         this.stop = this.stop.bind(this);
         this.prev = this.prev.bind(this);
@@ -1123,13 +1110,11 @@ const generator = '@aarsteinmedia/dotlottie-player';
     }
     /**
    * Get Multi-animation settings.
-   *
    */ getMultiAnimationSettings() {
         return this._multiAnimationSettings;
     }
     /**
    * Get playback segment.
-   *
    */ getSegment() {
         return this._segment;
     }
@@ -1512,6 +1497,15 @@ const generator = '@aarsteinmedia/dotlottie-player';
         this.seek(Math.round(Number(target.value) / 100 * this._lottieInstance.totalFrames));
     }
     /**
+   * Handle settings click event.
+   */ _handleSettingsClick({ target }) {
+        this._toggleSettings();
+        // Because Safari does not add focus on click, we need to add it manually, so the onblur event will fire
+        if (target instanceof HTMLElement) {
+            target.focus();
+        }
+    }
+    /**
    * Add event listeners.
    */ _addEventListeners() {
         this._toggleEventListeners('add');
@@ -1678,7 +1672,7 @@ const generator = '@aarsteinmedia/dotlottie-player';
         if (!this.animateOnScroll || !this._lottieInstance) {
             return;
         }
-        if (_isServer) {
+        if (isServer) {
             console.warn('DotLottie: Scroll animations might not work properly in a Server Side Rendering context. Try to wrap this in a client component.');
             return;
         }
@@ -1874,7 +1868,7 @@ const generator = '@aarsteinmedia/dotlottie-player';
  *
  */ globalThis.dotLottiePlayer = ()=>new DotLottiePlayer();
 const tagName = 'dotlottie-player';
-if (!_isServer) {
+if (!isServer) {
     customElements.define(tagName, DotLottiePlayer);
 }