@justeattakeaway/pie-lottie-player 0.4.3 → 0.4.5

package/dist/index.js

@@ -6,7 +6,7 @@ const d = class d extends m {
     this.getAttribute("v") || this.setAttribute("v", d.v);
   }
 };
-d.v = "0.4.3";
+d.v = "0.4.5";
 let p = d;
 const A = ["forward", "reverse"], l = {
   loopDisabled: !1,
@@ -24,7 +24,7 @@ let i = class extends p {
     super(...arguments), this._animationSrc = "", this._autoPlayDisabled = l.autoPlayDisabled, this._loopDisabled = l.loopDisabled, this._speed = l.speed, this._direction = l.direction;
   }
   async firstUpdated() {
-    const t = await import("./lottie_light_canvas.min-BoHyO1GA.js").then((e) => e.l);
+    const t = await import("./lottie_light_canvas.min-CNFOaiJT.js").then((e) => e.l);
     t && t.default && (this._lottie = t.default, this._loadAnimation());
   }
   disconnectedCallback() {

package/dist/{lottie_light_canvas.min-BoHyO1GA.js → lottie_light_canvas.min-CNFOaiJT.js}

@@ -19,10 +19,10 @@ function fa(Tt) {
 }
 var ze = { exports: {} }, ca = ze.exports, Mi;
 function da() {
-  return Mi || (Mi = 1, function(Tt, Oe) {
-    typeof document < "u" && typeof navigator < "u" && function(ie, It) {
+  return Mi || (Mi = 1, (function(Tt, Oe) {
+    typeof document < "u" && typeof navigator < "u" && (function(ie, It) {
       Tt.exports = It();
-    }(ca, function() {
+    })(ca, (function() {
       var ie = "", It = !1, Jt = -999999, dt = function() {
         return ie;
       };
@@ -38,7 +38,7 @@ function da() {
         }
         return e.prototype = t, e;
       }
-      var Ei = function() {
+      var Ei = (function() {
         function t(e) {
           this.audios = [], this.audioFactory = e, this._volume = 1, this._isMuted = !1;
         }
@@ -78,7 +78,7 @@ function da() {
         } }, function() {
           return new t();
         };
-      }(), ht = /* @__PURE__ */ function() {
+      })(), ht = /* @__PURE__ */ (function() {
         function t(e, s) {
           var i, a = 0, r = [];
           switch (e) {
@@ -95,7 +95,7 @@ function da() {
         return typeof Uint8ClampedArray == "function" && typeof Float32Array == "function" ? function(e, s) {
           return e === "float32" ? new Float32Array(s) : e === "int16" ? new Int16Array(s) : e === "uint8c" ? new Uint8ClampedArray(s) : t(e, s);
         } : t;
-      }();
+      })();
       function K(t) {
         return Array.apply(null, { length: t });
       }
@@ -197,7 +197,7 @@ function da() {
           return e && typeof Symbol == "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
         }, hs(t);
       }
-      var Ce = /* @__PURE__ */ function() {
+      var Ce = /* @__PURE__ */ (function() {
         var t, e, s = 1, i = [], a = { onmessage: function() {
         }, postMessage: function(y) {
           t({ data: y });
@@ -212,8 +212,8 @@ function da() {
           return t = y, a;
         }
         function n() {
-          e || (e = h(function(y) {
-            if (r.dataManager || (r.dataManager = function() {
+          e || (e = h((function(y) {
+            if (r.dataManager || (r.dataManager = (function() {
               function d(x, T) {
                 var M, _, D, w, P, R, O = x.length;
                 for (_ = 0; _ < O; _ += 1) if ("ks" in (M = x[_]) && !M.completed) {
@@ -226,13 +226,13 @@ function da() {
                 }
               }
               function c(x, T) {
-                var M = function(_, D) {
+                var M = (function(_, D) {
                   for (var w = 0, P = D.length; w < P; ) {
                     if (D[w].id === _) return D[w];
                     w += 1;
                   }
                   return null;
-                }(x, T);
+                })(x, T);
                 return M ? M.layers.__used ? JSON.parse(JSON.stringify(M.layers)) : (M.layers.__used = !0, M.layers) : null;
               }
               function m(x) {
@@ -249,7 +249,7 @@ function da() {
                 var M = T ? T.split(".") : [100, 100, 100];
                 return x[0] > M[0] || !(M[0] > x[0]) && (x[1] > M[1] || !(M[1] > x[1]) && (x[2] > M[2] || !(M[2] > x[2]) && null));
               }
-              var p, u = /* @__PURE__ */ function() {
+              var p, u = /* @__PURE__ */ (function() {
                 var x = [4, 4, 14];
                 function T(M) {
                   var _, D, w, P = M.length;
@@ -261,7 +261,7 @@ function da() {
                     for (_ = 0; _ < D; _ += 1) M.assets[_].layers && T(M.assets[_].layers);
                   }
                 };
-              }(), v = (p = [4, 7, 99], function(x) {
+              })(), v = (p = [4, 7, 99], function(x) {
                 if (x.chars && !f(p, x.v)) {
                   var T, M = x.chars.length;
                   for (T = 0; T < M; T += 1) {
@@ -269,7 +269,7 @@ function da() {
                     _.data && _.data.shapes && (m(_.data.shapes), _.data.ip = 0, _.data.op = 99999, _.data.st = 0, _.data.sr = 1, _.data.ks = { p: { k: [0, 0], a: 0 }, s: { k: [100, 100], a: 0 }, a: { k: [0, 0], a: 0 }, r: { k: 0, a: 0 }, o: { k: 100, a: 0 } }, x.chars[T].t || (_.data.shapes.push({ ty: "no" }), _.data.shapes[0].it.push({ p: { k: [0, 0], a: 0 }, s: { k: [100, 100], a: 0 }, a: { k: [0, 0], a: 0 }, r: { k: 0, a: 0 }, o: { k: 100, a: 0 }, sk: { k: 0, a: 0 }, sa: { k: 0, a: 0 }, ty: "tr" })));
                   }
                 }
-              }), k = /* @__PURE__ */ function() {
+              }), k = /* @__PURE__ */ (function() {
                 var x = [5, 7, 15];
                 function T(M) {
                   var _, D, w = M.length;
@@ -281,7 +281,7 @@ function da() {
                     for (_ = 0; _ < D; _ += 1) M.assets[_].layers && T(M.assets[_].layers);
                   }
                 };
-              }(), C = /* @__PURE__ */ function() {
+              })(), C = /* @__PURE__ */ (function() {
                 var x = [4, 1, 9];
                 function T(_) {
                   var D, w, P, R = _.length;
@@ -299,7 +299,7 @@ function da() {
                     for (D = 0; D < w; D += 1) _.assets[D].layers && M(_.assets[D].layers);
                   }
                 };
-              }(), A = /* @__PURE__ */ function() {
+              })(), A = /* @__PURE__ */ (function() {
                 var x = [4, 4, 18];
                 function T(_) {
                   var D, w, P;
@@ -324,20 +324,20 @@ function da() {
                     for (D = 0; D < w; D += 1) _.assets[D].layers && M(_.assets[D].layers);
                   }
                 };
-              }();
+              })();
               function F(x) {
                 x.t.a.length === 0 && x.t.p;
               }
               var I = { completeData: function(x) {
-                x.__complete || (C(x), u(x), v(x), k(x), A(x), d(x.layers, x.assets), function(T, M) {
+                x.__complete || (C(x), u(x), v(x), k(x), A(x), d(x.layers, x.assets), (function(T, M) {
                   if (T) {
                     var _ = 0, D = T.length;
                     for (_ = 0; _ < D; _ += 1) T[_].t === 1 && (T[_].data.layers = c(T[_].data.refId, M), d(T[_].data.layers, M));
                   }
-                }(x.chars, x.assets), x.__complete = !0);
+                })(x.chars, x.assets), x.__complete = !0);
               } };
               return I.checkColors = C, I.checkChars = v, I.checkPathProperties = k, I.checkShapes = A, I.completeLayers = d, I;
-            }()), r.assetLoader || (r.assetLoader = /* @__PURE__ */ function() {
+            })()), r.assetLoader || (r.assetLoader = /* @__PURE__ */ (function() {
               function d(c) {
                 var m = c.getResponseHeader("content-type");
                 return m && c.responseType === "json" && m.indexOf("json") !== -1 || c.response && hs(c.response) === "object" ? c.response : c.response && typeof c.response == "string" ? JSON.parse(c.response) : c.responseText ? JSON.parse(c.responseText) : null;
@@ -363,20 +363,20 @@ function da() {
                 }
                 u.send();
               } };
-            }()), y.data.type === "loadAnimation") r.assetLoader.load(y.data.path, y.data.fullPath, function(d) {
+            })()), y.data.type === "loadAnimation") r.assetLoader.load(y.data.path, y.data.fullPath, (function(d) {
               r.dataManager.completeData(d), r.postMessage({ id: y.data.id, payload: d, status: "success" });
-            }, function() {
+            }), (function() {
               r.postMessage({ id: y.data.id, status: "error" });
-            });
+            }));
             else if (y.data.type === "complete") {
               var o = y.data.animation;
               r.dataManager.completeData(o), r.postMessage({ id: y.data.id, payload: o, status: "success" });
-            } else y.data.type === "loadData" && r.assetLoader.load(y.data.path, y.data.fullPath, function(d) {
+            } else y.data.type === "loadData" && r.assetLoader.load(y.data.path, y.data.fullPath, (function(d) {
               r.postMessage({ id: y.data.id, payload: d, status: "success" });
-            }, function() {
+            }), (function() {
               r.postMessage({ id: y.data.id, status: "error" });
-            });
-          }), e.onmessage = function(y) {
+            }));
+          })), e.onmessage = function(y) {
             var o = y.data, d = o.id, c = i[d];
             i[d] = null, o.status === "success" ? c.onComplete(o.payload) : c.onError && c.onError();
           });
@@ -398,13 +398,13 @@ function da() {
           var c = g(o, d);
           e.postMessage({ type: "complete", animation: y, id: c });
         } };
-      }(), zi = function() {
-        var t = function() {
+      })(), zi = (function() {
+        var t = (function() {
           var n = Pt("canvas");
           n.width = 1, n.height = 1;
           var g = n.getContext("2d");
           return g.fillStyle = "rgba(0,0,0,0)", g.fillRect(0, 0, 1, 1), n;
-        }();
+        })();
         function e() {
           this.loadedAssets += 1, this.loadedAssets === this.totalImages && this.loadedFootagesCount === this.totalFootages && this.imagesLoadedCb && this.imagesLoadedCb(null);
         }
@@ -474,7 +474,7 @@ function da() {
         }, imageLoaded: e, footageLoaded: s, setCacheType: function(n, g) {
           n === "svg" ? (this._elementHelper = g, this._createImageData = this.createImageData.bind(this)) : this._createImageData = this.createImgData.bind(this);
         } }, h;
-      }();
+      })();
       function Bs() {
       }
       Bs.prototype = { triggerEvent: function(t, e) {
@@ -491,7 +491,7 @@ function da() {
           }
         } else this._cbs[t] = null;
       } };
-      var Oi = /* @__PURE__ */ function() {
+      var Oi = /* @__PURE__ */ (function() {
         function t(e) {
           for (var s, i = e.split(`\r
 `), a = {}, r = 0, h = 0; h < i.length; h += 1) (s = i[h].split(":")).length === 2 && (a[s[0]] = s[1].trim(), r += 1);
@@ -514,7 +514,7 @@ function da() {
           }
           return s;
         };
-      }(), Ni = /* @__PURE__ */ function() {
+      })(), Ni = /* @__PURE__ */ (function() {
         function t(e) {
           this.compositions.push(e);
         }
@@ -528,7 +528,7 @@ function da() {
           }
           return e.compositions = [], e.currentFrame = 0, e.registerComposition = t, e;
         };
-      }(), xe = {};
+      })(), xe = {};
       function We(t) {
         return We = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
           return typeof e;
@@ -552,11 +552,11 @@ function da() {
       }, V.prototype.setData = function(t, e) {
         e && We(e) !== "object" && (e = JSON.parse(e));
         var s = { wrapper: t, animationData: e }, i = t.attributes;
-        s.path = i.getNamedItem("data-animation-path") ? i.getNamedItem("data-animation-path").value : i.getNamedItem("data-bm-path") ? i.getNamedItem("data-bm-path").value : i.getNamedItem("bm-path") ? i.getNamedItem("bm-path").value : "", s.animType = i.getNamedItem("data-anim-type") ? i.getNamedItem("data-anim-type").value : i.getNamedItem("data-bm-type") ? i.getNamedItem("data-bm-type").value : i.getNamedItem("bm-type") ? i.getNamedItem("bm-type").value : i.getNamedItem("data-bm-renderer") ? i.getNamedItem("data-bm-renderer").value : i.getNamedItem("bm-renderer") ? i.getNamedItem("bm-renderer").value : function() {
+        s.path = i.getNamedItem("data-animation-path") ? i.getNamedItem("data-animation-path").value : i.getNamedItem("data-bm-path") ? i.getNamedItem("data-bm-path").value : i.getNamedItem("bm-path") ? i.getNamedItem("bm-path").value : "", s.animType = i.getNamedItem("data-anim-type") ? i.getNamedItem("data-anim-type").value : i.getNamedItem("data-bm-type") ? i.getNamedItem("data-bm-type").value : i.getNamedItem("bm-type") ? i.getNamedItem("bm-type").value : i.getNamedItem("data-bm-renderer") ? i.getNamedItem("data-bm-renderer").value : i.getNamedItem("bm-renderer") ? i.getNamedItem("bm-renderer").value : (function() {
           if (xe.canvas) return "canvas";
           for (var h in xe) if (xe[h]) return h;
           return "";
-        }() || "canvas";
+        })() || "canvas";
         var a = i.getNamedItem("data-anim-loop") ? i.getNamedItem("data-anim-loop").value : i.getNamedItem("data-bm-loop") ? i.getNamedItem("data-bm-loop").value : i.getNamedItem("bm-loop") ? i.getNamedItem("bm-loop").value : "";
         a === "false" ? s.loop = !1 : a === "true" ? s.loop = !0 : a !== "" && (s.loop = parseInt(a, 10));
         var r = i.getNamedItem("data-anim-autoplay") ? i.getNamedItem("data-anim-autoplay").value : i.getNamedItem("data-bm-autoplay") ? i.getNamedItem("data-bm-autoplay").value : !i.getNamedItem("bm-autoplay") || i.getNamedItem("bm-autoplay").value;
@@ -748,7 +748,7 @@ function da() {
         var e = new Vi(t, this.currentFrame);
         this.triggerEvent("error", e), this.onError && this.onError.call(this, e);
       };
-      var lt = function() {
+      var lt = (function() {
         var t = {}, e = [], s = 0, i = 0, a = 0, r = !0, h = !1;
         function n(f) {
           for (var p = 0, u = f.target; p < i; ) e[p].animation === u && (e.splice(p, 1), p -= 1, i -= 1, u.isPaused || o()), p += 1;
@@ -840,7 +840,7 @@ function da() {
           for (f = 0; f < p; f += 1) u.push(e[f].animation);
           return u;
         }, t;
-      }(), ke = function() {
+      })(), ke = (function() {
         var t = { getBezierEasing: function(d, c, m, l, f) {
           var p = f || ("bez_" + d + "_" + c + "_" + m + "_" + l).replace(/\./g, "p");
           if (e[p]) return e[p];
@@ -876,22 +876,22 @@ function da() {
         }, _getTForX: function(d) {
           for (var c = this._p[0], m = this._p[2], l = this._mSampleValues, f = 0, p = 1, u = s - 1; p !== u && l[p] <= d; ++p) f += i;
           var v = f + (d - l[--p]) / (l[p + 1] - l[p]) * i, k = y(v, c, m);
-          return k >= 1e-3 ? function(C, A, F, I) {
+          return k >= 1e-3 ? (function(C, A, F, I) {
             for (var x = 0; x < 4; ++x) {
               var T = y(A, F, I);
               if (T === 0) return A;
               A -= (g(A, F, I) - C) / T;
             }
             return A;
-          }(d, v, c, m) : k === 0 ? v : function(C, A, F, I, x) {
+          })(d, v, c, m) : k === 0 ? v : (function(C, A, F, I, x) {
             var T, M, _ = 0;
             do
               (T = g(M = A + (F - A) / 2, I, x) - C) > 0 ? F = M : A = M;
             while (Math.abs(T) > 1e-7 && ++_ < 10);
             return M;
-          }(d, f, f + i, c, m);
+          })(d, f, f + i, c, m);
         } }, t;
-      }(), Ws = { double: function(t) {
+      })(), Ws = { double: function(t) {
         return t.concat(K(t.length));
       } }, je = function(t, e, s) {
         var i = 0, a = t, r = K(a);
@@ -900,15 +900,15 @@ function da() {
         }, release: function(h) {
           i === a && (r = Ws.double(r), a *= 2), s && s(h), r[i] = h, i += 1;
         } };
-      }, js = je(8, function() {
+      }, js = je(8, (function() {
         return { addedLength: 0, percents: ht("float32", Be()), lengths: ht("float32", Be()) };
-      }), Js = je(8, function() {
+      })), Js = je(8, (function() {
         return { lengths: [], totalLength: 0 };
-      }, function(t) {
+      }), (function(t) {
         var e, s = t.lengths.length;
         for (e = 0; e < s; e += 1) js.release(t.lengths[e]);
         t.lengths.length = 0;
-      }), Vt = function() {
+      })), Vt = (function() {
         var t = Math;
         function e(y, o, d, c, m, l) {
           var f = y * c + o * m + d * l - m * c - l * y - d * o;
@@ -969,7 +969,7 @@ function da() {
           var v, k = t.sqrt(t.pow(c - y, 2) + t.pow(m - o, 2) + t.pow(l - d, 2)), C = t.sqrt(t.pow(f - y, 2) + t.pow(p - o, 2) + t.pow(u - d, 2)), A = t.sqrt(t.pow(f - c, 2) + t.pow(p - m, 2) + t.pow(u - l, 2));
           return (v = k > C ? k > A ? k - C - A : A - C - k : A > C ? A - C - k : C - k - A) > -1e-4 && v < 1e-4;
         } };
-      }(), ae = Jt, Ys = Math.abs;
+      })(), ae = Jt, Ys = Math.abs;
       function Xs(t, e) {
         var s, i = this.offsetTime;
         this.propType === "multidimensional" && (s = ht("float32", this.pv.length));
@@ -1014,10 +1014,10 @@ function da() {
           else if (t <= D) s[0] = a.s[0], s[1] = a.s[1], s[2] = a.s[2];
           else {
             var $ = Hs(a.s), Q = Hs(u);
-            v = s, k = function(J, tt, j) {
+            v = s, k = (function(J, tt, j) {
               var Y, ct, bt, rt, nt, at = [], q = J[0], Ht = J[1], Gt = J[2], jt = J[3], _t = tt[0], kt = tt[1], ot = tt[2], St = tt[3];
               return (ct = q * _t + Ht * kt + Gt * ot + jt * St) < 0 && (ct = -ct, _t = -_t, kt = -kt, ot = -ot, St = -St), 1 - ct > 1e-6 ? (Y = Math.acos(ct), bt = Math.sin(Y), rt = Math.sin((1 - j) * Y) / bt, nt = Math.sin(j * Y) / bt) : (rt = 1 - j, nt = j), at[0] = rt * q + nt * _t, at[1] = rt * Ht + nt * kt, at[2] = rt * Gt + nt * ot, at[3] = rt * jt + nt * St, at;
-            }($, Q, (t - D) / (_ - D)), C = k[0], A = k[1], F = k[2], I = k[3], x = Math.atan2(2 * A * I - 2 * C * F, 1 - 2 * A * A - 2 * F * F), T = Math.asin(2 * C * A + 2 * F * I), M = Math.atan2(2 * C * I - 2 * A * F, 1 - 2 * C * C - 2 * F * F), v[0] = x / et, v[1] = T / et, v[2] = M / et;
+            })($, Q, (t - D) / (_ - D)), C = k[0], A = k[1], F = k[2], I = k[3], x = Math.atan2(2 * A * I - 2 * C * F, 1 - 2 * A * A - 2 * F * F), T = Math.asin(2 * C * A + 2 * F * I), M = Math.atan2(2 * C * I - 2 * A * F, 1 - 2 * C * C - 2 * F * F), v[0] = x / et, v[1] = T / et, v[2] = M / et;
           }
           else for (l = 0; l < f; l += 1) a.h !== 1 && (t >= _ ? y = 1 : t < D ? y = 0 : (a.o.x.constructor === Array ? (h.__fnct || (h.__fnct = []), h.__fnct[l] ? c = h.__fnct[l] : (b = a.o.x[l] === void 0 ? a.o.x[0] : a.o.x[l], S = a.o.y[l] === void 0 ? a.o.y[0] : a.o.y[l], L = a.i.x[l] === void 0 ? a.i.x[0] : a.i.x[l], N = a.i.y[l] === void 0 ? a.i.y[0] : a.i.y[l], c = ke.getBezierEasing(b, S, L, N).get, h.__fnct[l] = c)) : h.__fnct ? c = h.__fnct : (b = a.o.x, S = a.o.y, L = a.i.x, N = a.i.y, c = ke.getBezierEasing(b, S, L, N).get, a.keyframeMetadata = c), y = c((t - D) / (_ - D)))), u = r.s || a.e, U = a.h === 1 ? a.s[l] : a.s[l] + (u[l] - a.s[l]) * y, this.propType === "multidimensional" ? s[l] = U : s = U;
         }
@@ -1102,9 +1102,9 @@ function da() {
       }, initDynamicPropertyContainer: function(t) {
         this.container = t, this.dynamicProperties = [], this._mdf = !1, this._isAnimated = !1;
       } };
-      var re = je(8, function() {
+      var re = je(8, (function() {
         return ht("float32", 2);
-      });
+      }));
       function Yt() {
         this.c = !1, this._length = 0, this._maxLength = 8, this.v = K(this._maxLength), this.o = K(this._maxLength), this.i = K(this._maxLength);
       }
@@ -1145,13 +1145,13 @@ function da() {
       }, Yt.prototype.length = function() {
         return this._length;
       };
-      var ls, yt = ((ls = je(4, function() {
+      var ls, yt = ((ls = je(4, (function() {
         return new Yt();
-      }, function(t) {
+      }), (function(t) {
         var e, s = t._length;
         for (e = 0; e < s; e += 1) re.release(t.v[e]), re.release(t.i[e]), re.release(t.o[e]), t.v[e] = null, t.i[e] = null, t.o[e] = null;
         t._length = 0, t.c = !1;
-      })).clone = function(t) {
+      }))).clone = function(t) {
         var e, s = ls.newElement(), i = t._length === void 0 ? t.v.length : t._length;
         for (s.setLength(i), s.c = t.c, e = 0; e < i; e += 1) s.setTripleAt(t.v[e][0], t.v[e][1], t.o[e][0], t.o[e][1], t.i[e][0], t.i[e][1], e);
         return s;
@@ -1172,7 +1172,7 @@ function da() {
         var e, s = t._length;
         for (e = 0; e < s; e += 1) yt.release(t.shapes[e]);
         t._length = 0, fe === fs && (Pe = Ws.double(Pe), fs *= 2), Pe[fe] = t, fe += 1;
-      } }, fe = 0, Pe = K(fs = 4), Ks), de = function() {
+      } }, fe = 0, Pe = K(fs = 4), Ks), de = (function() {
         var t = -999999;
         function e(m, l, f) {
           var p, u, v, k, C, A, F, I, x, T = f.lastIndex, M = this.keyframes;
@@ -1233,7 +1233,7 @@ function da() {
           this.v = yt.newElement(), this.v.setPathData(this.keyframes[0].s[0].c, p), this.pv = yt.clone(this.v), this.localShapeCollection = ce.newShapeCollection(), this.paths = this.localShapeCollection, this.paths.addShape(this.v), this.lastFrame = t, this.reset = i, this._caching = { lastFrame: t, lastIndex: 0 }, this.effectsSequence = [s.bind(this)];
         }
         h.prototype.interpolateShape = e, h.prototype.getValue = r, h.prototype.setVValue = a, h.prototype.addEffect = n, g.prototype.getValue = r, g.prototype.interpolateShape = e, g.prototype.setVValue = a, g.prototype.addEffect = n;
-        var y = function() {
+        var y = (function() {
           var m = Kt;
           function l(f, p) {
             this.v = yt.newElement(), this.v.setPathData(!0, 4), this.localShapeCollection = ce.newShapeCollection(), this.paths = this.localShapeCollection, this.localShapeCollection.addShape(this.v), this.d = p.d, this.elem = f, this.comp = f.comp, this.frameId = -1, this.initDynamicPropertyContainer(f), this.p = E.getProp(f, p.p, 1, 0, this), this.s = E.getProp(f, p.s, 1, 0, this), this.dynamicProperties.length ? this.k = !0 : (this.k = !1, this.convertEllToPath());
@@ -1244,7 +1244,7 @@ function da() {
             var f = this.p.v[0], p = this.p.v[1], u = this.s.v[0] / 2, v = this.s.v[1] / 2, k = this.d !== 3, C = this.v;
             C.v[0][0] = f, C.v[0][1] = p - v, C.v[1][0] = k ? f + u : f - u, C.v[1][1] = p, C.v[2][0] = f, C.v[2][1] = p + v, C.v[3][0] = k ? f - u : f + u, C.v[3][1] = p, C.i[0][0] = k ? f - u * m : f + u * m, C.i[0][1] = p - v, C.i[1][0] = k ? f + u : f - u, C.i[1][1] = p - v * m, C.i[2][0] = k ? f + u * m : f - u * m, C.i[2][1] = p + v, C.i[3][0] = k ? f - u : f + u, C.i[3][1] = p + v * m, C.o[0][0] = k ? f + u * m : f - u * m, C.o[0][1] = p - v, C.o[1][0] = k ? f + u : f - u, C.o[1][1] = p + v * m, C.o[2][0] = k ? f - u * m : f + u * m, C.o[2][1] = p + v, C.o[3][0] = k ? f - u : f + u, C.o[3][1] = p - v * m;
           } }, W([ut], l), l;
-        }(), o = function() {
+        })(), o = (function() {
           function m(l, f) {
             this.v = yt.newElement(), this.v.setPathData(!0, 0), this.elem = l, this.comp = l.comp, this.data = f, this.frameId = -1, this.d = f.d, this.initDynamicPropertyContainer(l), f.sy === 1 ? (this.ir = E.getProp(l, f.ir, 0, 0, this), this.is = E.getProp(l, f.is, 0, 0.01, this), this.convertToPath = this.convertStarToPath) : this.convertToPath = this.convertPolygonToPath, this.pt = E.getProp(l, f.pt, 0, 0, this), this.p = E.getProp(l, f.p, 1, 0, this), this.r = E.getProp(l, f.r, 0, et, this), this.or = E.getProp(l, f.or, 0, 0, this), this.os = E.getProp(l, f.os, 0, 0.01, this), this.localShapeCollection = ce.newShapeCollection(), this.localShapeCollection.addShape(this.v), this.paths = this.localShapeCollection, this.dynamicProperties.length ? this.k = !0 : (this.k = !1, this.convertToPath());
           }
@@ -1267,7 +1267,7 @@ function da() {
             }
             this.paths.length = 0, this.paths[0] = this.v;
           } }, W([ut], m), m;
-        }(), d = function() {
+        })(), d = (function() {
           function m(l, f) {
             this.v = yt.newElement(), this.v.c = !0, this.localShapeCollection = ce.newShapeCollection(), this.localShapeCollection.addShape(this.v), this.paths = this.localShapeCollection, this.elem = l, this.comp = l.comp, this.frameId = -1, this.d = f.d, this.initDynamicPropertyContainer(l), this.p = E.getProp(l, f.p, 1, 0, this), this.s = E.getProp(l, f.s, 1, 0, this), this.r = E.getProp(l, f.r, 0, 0, this), this.dynamicProperties.length ? this.k = !0 : (this.k = !1, this.convertRectToPath());
           }
@@ -1277,7 +1277,7 @@ function da() {
           }, getValue: function() {
             this.elem.globalData.frameId !== this.frameId && (this.frameId = this.elem.globalData.frameId, this.iterateDynamicProperties(), this._mdf && this.convertRectToPath());
           }, reset: i }, W([ut], m), m;
-        }(), c = { getShapeProp: function(m, l, f) {
+        })(), c = { getShapeProp: function(m, l, f) {
           var p;
           return f === 3 || f === 4 ? p = (f === 3 ? l.pt : l.ks).k.length ? new g(m, l, f) : new h(m, l, f) : f === 5 ? p = new d(m, l) : f === 6 ? p = new y(m, l) : f === 7 && (p = new o(m, l)), p.k && m.addDynamicProperty(p), p;
         }, getConstructorFunction: function() {
@@ -1286,7 +1286,7 @@ function da() {
           return g;
         } };
         return c;
-      }(), st = /* @__PURE__ */ function() {
+      })(), st = /* @__PURE__ */ (function() {
         var t = Math.cos, e = Math.sin, s = Math.tan, i = Math.round;
         function a() {
           return this.props[0] = 1, this.props[1] = 0, this.props[2] = 0, this.props[3] = 0, this.props[4] = 0, this.props[5] = 1, this.props[6] = 0, this.props[7] = 0, this.props[8] = 0, this.props[9] = 0, this.props[10] = 1, this.props[11] = 0, this.props[12] = 0, this.props[13] = 0, this.props[14] = 0, this.props[15] = 1, this;
@@ -1414,7 +1414,7 @@ function da() {
         return function() {
           this.reset = a, this.rotate = r, this.rotateX = h, this.rotateY = n, this.rotateZ = g, this.skew = o, this.skewFromAxis = d, this.shear = y, this.scale = c, this.setTransform = m, this.translate = l, this.transform = f, this.multiply = p, this.applyToPoint = A, this.applyToX = F, this.applyToY = I, this.applyToZ = x, this.applyToPointArray = w, this.applyToTriplePoints = D, this.applyToPointStringified = P, this.toCSS = R, this.to2dCSS = B, this.clone = k, this.cloneFromProps = C, this.equals = v, this.inversePoints = _, this.inversePoint = M, this.getInverseMatrix = T, this._t = this.transform, this.isIdentity = u, this._identity = !0, this._identityCalculated = !1, this.props = ht("float32", 16), this.reset();
         };
-      }();
+      })();
       function cs(t) {
         return cs = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
           return typeof e;
@@ -1470,29 +1470,29 @@ function da() {
       var Zs = "";
       {
         var $s = document.getElementsByTagName("script"), Qs = $s[$s.length - 1] || { src: "" };
-        Zs = Qs.src ? Qs.src.replace(/^[^\?]+\??/, "") : "", function(t) {
+        Zs = Qs.src ? Qs.src.replace(/^[^\?]+\??/, "") : "", (function(t) {
           for (var e = Zs.split("&"), s = 0; s < e.length; s += 1) {
             var i = e[s].split("=");
             if (decodeURIComponent(i[0]) == t) return decodeURIComponent(i[1]);
           }
           return null;
-        }("renderer");
+        })("renderer");
       }
-      var Ji = setInterval(function() {
+      var Ji = setInterval((function() {
         document.readyState === "complete" && (clearInterval(Ji), Us());
-      }, 100);
+      }), 100);
       try {
         cs(Oe) === "object" || (window.bodymovin = H);
       } catch {
       }
-      var zt = function() {
+      var zt = (function() {
         var t = {}, e = {};
         return t.registerModifier = function(s, i) {
           e[s] || (e[s] = i);
         }, t.getModifier = function(s, i, a) {
           return new e[s](i, a);
         }, t;
-      }();
+      })();
       function At() {
       }
       function Ft() {
@@ -1614,7 +1614,7 @@ function da() {
         }
         this.dynamicProperties.length || (this._mdf = !1);
       };
-      var He = function() {
+      var He = (function() {
         var t = [0, 0];
         function e(s, i, a) {
           if (this.elem = s, this.frameId = -1, this.propType = "transform", this.data = i, this.v = new st(), this.pre = new st(), this.appliedTransformations = 0, this.initDynamicPropertyContainer(a || s), i.p && i.p.s ? (this.px = E.getProp(s, i.p.x, 0, 0, this), this.py = E.getProp(s, i.p.y, 0, 0, this), i.p.z && (this.pz = E.getProp(s, i.p.z, 0, 0, this))) : this.p = E.getProp(s, i.p || { k: [0, 0, 0] }, 1, 0, this), i.rx) {
@@ -1661,7 +1661,7 @@ function da() {
         }, e.prototype._addDynamicProperty = ut.prototype.addDynamicProperty, { getTransformProperty: function(s, i, a) {
           return new e(s, i, a);
         } };
-      }();
+      })();
       function Ot() {
       }
       function Se() {
@@ -1695,7 +1695,7 @@ function da() {
           var a = i;
           i = s, s = a;
         }
-        for (var r = function(g, y, o) {
+        for (var r = (function(g, y, o) {
           if (g === 0) return [];
           var d = y * y - 4 * g * o;
           if (d < 0) return [];
@@ -1703,7 +1703,7 @@ function da() {
           if (d === 0) return [c];
           var m = Math.sqrt(d) / (2 * g);
           return [c - m, c + m];
-        }(3 * t.a[e], 2 * t.b[e], t.c[e]), h = 0; h < r.length; h += 1) if (r[h] > 0 && r[h] < 1) {
+        })(3 * t.a[e], 2 * t.b[e], t.c[e]), h = 0; h < r.length; h += 1) if (r[h] > 0 && r[h] < 1) {
           var n = t.point(r[h])[e];
           n < s ? s = n : n > i && (i = n);
         }
@@ -1913,9 +1913,9 @@ function da() {
         var e = -0.5 * (this.a[1] * this.c[0] - this.a[0] * this.c[1]) / t, s = e * e - 1 / 3 * (this.b[1] * this.c[0] - this.b[0] * this.c[1]) / t;
         if (s < 0) return [];
         var i = Math.sqrt(s);
-        return ds(i) ? i > 0 && i < 1 ? [e] : [] : [e - i, e + i].filter(function(a) {
+        return ds(i) ? i > 0 && i < 1 ? [e] : [] : [e - i, e + i].filter((function(a) {
           return a > 0 && a < 1;
-        });
+        }));
       }, it.prototype.split = function(t) {
         if (t <= 0) return [si(this.points[0]), this];
         if (t >= 1) return [this, si(this.points[this.points.length - 1])];
@@ -1962,10 +1962,10 @@ function da() {
         var y = [];
         for (r = 0; r < g; r += 1) n = it.shapeSegment(t, r), y.push(pi(n, e));
         if (!t.c) for (r = g - 1; r >= 0; r -= 1) n = it.shapeSegmentInverted(t, r), y.push(pi(n, e));
-        y = function(m) {
+        y = (function(m) {
           for (var l, f = 1; f < m.length; f += 1) l = li(m[f - 1], m[f]), m[f - 1] = l[0], m[f] = l[1];
           return m.length > 1 && (l = li(m[m.length - 1], m[0]), m[m.length - 1] = l[0], m[0] = l[1]), m;
-        }(y);
+        })(y);
         var o = null, d = null;
         for (r = 0; r < y.length; r += 1) {
           var c = y[r];
@@ -1980,7 +1980,7 @@ function da() {
         }
         this.dynamicProperties.length || (this._mdf = !1);
       };
-      var ne = function() {
+      var ne = (function() {
         var t = { w: 0, size: 0, shapes: [], data: { shapes: [] } }, e = [];
         e = e.concat([2304, 2305, 2306, 2307, 2362, 2363, 2364, 2364, 2366, 2367, 2368, 2369, 2370, 2371, 2372, 2373, 2374, 2375, 2376, 2377, 2378, 2379, 2380, 2381, 2382, 2383, 2387, 2388, 2389, 2390, 2391, 2402, 2403]);
         var s = 127988, i = ["d83cdffb", "d83cdffc", "d83cdffd", "d83cdffe", "d83cdfff"];
@@ -1990,11 +1990,11 @@ function da() {
           var m = Pt("span");
           m.innerText = "giItT1WQy@!-/#", c.style.position = "absolute", c.style.left = "-10000px", c.style.top = "-10000px", c.style.fontSize = "300px", c.style.fontVariant = "normal", c.style.fontStyle = "normal", c.style.fontWeight = "normal", c.style.letterSpacing = "0", c.appendChild(m), document.body.appendChild(c);
           var l = m.offsetWidth;
-          return m.style.fontFamily = function(f) {
+          return m.style.fontFamily = (function(f) {
             var p, u = f.split(","), v = u.length, k = [];
             for (p = 0; p < v; p += 1) u[p] !== "sans-serif" && u[p] !== "monospace" && k.push(u[p]);
             return k.join(",");
-          }(o) + ", " + d, { node: m, w: l, parent: c };
+          })(o) + ", " + d, { node: m, w: l, parent: c };
         }
         function r(o, d) {
           var c, m = document.body && d ? "svg" : "canvas", l = fi(o);
@@ -2058,9 +2058,9 @@ function da() {
         }, addFonts: function(o, d) {
           if (o) {
             if (this.chars) return this.isLoaded = !0, void (this.fonts = o.list);
-            if (!document.body) return this.isLoaded = !0, o.list.forEach(function(F) {
+            if (!document.body) return this.isLoaded = !0, o.list.forEach((function(F) {
               F.helper = r(F), F.cache = {};
-            }), void (this.fonts = o.list);
+            })), void (this.fonts = o.list);
             var c, m = o.list, l = m.length, f = l;
             for (c = 0; c < l; c += 1) {
               var p, u, v = !0;
@@ -2118,7 +2118,7 @@ function da() {
           this.isLoaded = !0;
         } };
         return g.prototype = y, g;
-      }();
+      })();
       function ci(t) {
         this.animationData = t;
       }
@@ -2367,9 +2367,9 @@ function da() {
         }
         return t.length === 0 ? e : e.getElementByPath(t);
       }, mt.prototype.setupGlobalData = function(t, e) {
-        this.globalData.fontManager = new ne(), this.globalData.slotManager = function(s) {
+        this.globalData.fontManager = new ne(), this.globalData.slotManager = (function(s) {
           return new ci(s);
-        }(t), this.globalData.fontManager.addChars(t.chars), this.globalData.fontManager.addFonts(t.fonts, e), this.globalData.getAssetData = this.animationItem.getAssetData.bind(this.animationItem), this.globalData.getAssetsPath = this.animationItem.getAssetsPath.bind(this.animationItem), this.globalData.imageLoader = this.animationItem.imagePreloader, this.globalData.audioController = this.animationItem.audioController, this.globalData.frameId = 0, this.globalData.frameRate = t.fr, this.globalData.nm = t.nm, this.globalData.compSize = { w: t.w, h: t.h };
+        })(t), this.globalData.fontManager.addChars(t.chars), this.globalData.fontManager.addFonts(t.fonts, e), this.globalData.getAssetData = this.animationItem.getAssetData.bind(this.animationItem), this.globalData.getAssetsPath = this.animationItem.getAssetsPath.bind(this.animationItem), this.globalData.imageLoader = this.animationItem.imagePreloader, this.globalData.audioController = this.animationItem.audioController, this.globalData.frameId = 0, this.globalData.frameRate = t.fr, this.globalData.nm = t.nm, this.globalData.compSize = { w: t.w, h: t.h };
       };
       var mi = "transformEFfect";
       function Nt() {
@@ -2467,7 +2467,7 @@ function da() {
       }, Qt.prototype.destroy = function() {
         this.element = null, this.globalData = null, this.maskElement = null, this.data = null, this.masksProperties = null;
       };
-      var Fe = function() {
+      var Fe = (function() {
         var t = {};
         return t.createFilter = function(e, s) {
           var i = z("filter");
@@ -2476,10 +2476,10 @@ function da() {
           var e = z("feColorMatrix");
           return e.setAttribute("type", "matrix"), e.setAttribute("color-interpolation-filters", "sRGB"), e.setAttribute("values", "0 0 0 1 0  0 0 0 1 0  0 0 0 1 0  0 0 0 1 1"), e;
         }, t;
-      }(), $e = function() {
+      })(), $e = (function() {
         var t = { maskType: !0, svgLumaHidden: !0, offscreenCanvas: typeof OffscreenCanvas < "u" };
         return (/MSIE 10/i.test(navigator.userAgent) || /MSIE 9/i.test(navigator.userAgent) || /rv:11.0/i.test(navigator.userAgent) || /Edge\/\d./i.test(navigator.userAgent)) && (t.maskType = !1), /firefox/i.test(navigator.userAgent) && (t.svgLumaHidden = !1), t;
-      }(), ys = {}, gi = "filter_result_";
+      })(), ys = {}, gi = "filter_result_";
       function vs(t) {
         var e, s, i = "SourceGraphic", a = t.data.ef ? t.data.ef.length : 0, r = Ct(), h = Fe.createFilter(r, !0), n = 0;
         for (this.filters = [], e = 0; e < a; e += 1) {
@@ -2714,7 +2714,7 @@ function da() {
         var a, r = t.o, h = t.i, n = t.v, g = " M" + i.applyToPointStringified(n[0][0], n[0][1]);
         for (a = 1; a < e; a += 1) g += " C" + i.applyToPointStringified(r[a - 1][0], r[a - 1][1]) + " " + i.applyToPointStringified(h[a][0], h[a][1]) + " " + i.applyToPointStringified(n[a][0], n[a][1]);
         return s && e && (g += " C" + i.applyToPointStringified(r[a - 1][0], r[a - 1][1]) + " " + i.applyToPointStringified(h[0][0], h[0][1]) + " " + i.applyToPointStringified(n[0][0], n[0][1]), g += "z"), g;
-      }, aa = function() {
+      }, aa = (function() {
         var t = new st(), e = new st();
         function s(y, o, d) {
           (d || o.transform.op._mdf) && o.transform.container.setAttribute("opacity", o.transform.op.v), (d || o.transform.mProps._mdf) && o.transform.container.setAttribute("transform", o.transform.mProps.v.to2dCSS());
@@ -2797,7 +2797,7 @@ function da() {
               return null;
           }
         } };
-      }();
+      })();
       function Z(t, e, s) {
         this.shapes = [], this.shapesData = t.shapes, this.stylesList = [], this.shapeModifiers = [], this.itemsData = [], this.processedElements = [], this.animatedContents = [], this.initElement(t, e, s), this.prevViewData = [];
       }
@@ -2966,7 +2966,7 @@ function da() {
       }, vt.prototype.setMinimumFontSize = function(t) {
         this.minimumFontSize = Math.floor(t) || 1, this.recalculate(this.keysIndex), this.elem.addDynamicProperty(this);
       };
-      var ra = function() {
+      var ra = (function() {
         var t = Math.max, e = Math.min, s = Math.floor;
         function i(a, r) {
           this._currentTextLength = -1, this.k = !1, this.data = r, this.elem = a, this.comp = a.comp, this.finalS = 0, this.finalE = 0, this.initDynamicPropertyContainer(a), this.s = E.getProp(a, r.s || { k: 0 }, 0, 0, this), this.e = "e" in r ? E.getProp(a, r.e, 0, 0, this) : { v: 100 }, this.o = E.getProp(a, r.o || { k: 0 }, 0, 0, this), this.xe = E.getProp(a, r.xe || { k: 0 }, 0, 0, this), this.ne = E.getProp(a, r.ne || { k: 0 }, 0, 0, this), this.sm = E.getProp(a, r.sm || { k: 100 }, 0, 0, this), this.a = E.getProp(a, r.a, 0, 0.01, this), this.dynamicProperties.length || this.getValue();
@@ -3005,7 +3005,7 @@ function da() {
         } }, W([ut], i), { getTextSelectorProp: function(a, r, h) {
           return new i(a, r);
         } };
-      }();
+      })();
       function na(t, e, s) {
         var i = { propType: !1 }, a = E.getProp, r = e.a;
         this.a = { r: r.r ? a(t, r.r, 0, et, s) : i, rx: r.rx ? a(t, r.rx, 0, et, s) : i, ry: r.ry ? a(t, r.ry, 0, et, s) : i, sk: r.sk ? a(t, r.sk, 0, et, s) : i, sa: r.sa ? a(t, r.sa, 0, et, s) : i, s: r.s ? a(t, r.s, 1, 0.01, s) : i, a: r.a ? a(t, r.a, 1, 0, s) : i, o: r.o ? a(t, r.o, 0, 0.01, s) : i, p: r.p ? a(t, r.p, 1, 0, s) : i, sw: r.sw ? a(t, r.sw, 0, 0, s) : i, sc: r.sc ? a(t, r.sc, 1, 0, s) : i, fc: r.fc ? a(t, r.fc, 1, 0, s) : i, fh: r.fh ? a(t, r.fh, 0, 0, s) : i, fs: r.fs ? a(t, r.fs, 0, 0.01, s) : i, fb: r.fb ? a(t, r.fb, 0, 0.01, s) : i, t: r.t ? a(t, r.t, 0, 0, s) : i }, this.s = ra.getTextSelectorProp(t, e.s, s), this.s.t = e.s.t;
@@ -3842,8 +3842,8 @@ function da() {
       }, W([X], As), As.prototype.createComp = function(t) {
         return new _e(t, this.globalData, this);
       }, Si = As, xe.canvas = Si, zt.registerModifier("tm", Ft), zt.registerModifier("pb", De), zt.registerModifier("rp", Ot), zt.registerModifier("rd", Se), zt.registerModifier("zz", we), zt.registerModifier("op", Me), H;
-    });
-  }(ze, ze.exports)), ze.exports;
+    }));
+  })(ze, ze.exports)), ze.exports;
 }
 var Ti = /* @__PURE__ */ da();
 const ua = /* @__PURE__ */ fa(Ti), ma = /* @__PURE__ */ pa({

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-lottie-player",
   "description": "PIE Design System Lottie Player built using Web Components",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "repository": {
     "type": "git",
     "url": "https://github.com/justeattakeaway/pie",
@@ -26,30 +26,27 @@
   },
   "scripts": {
     "build": "run -T vite build",
-    "build:react-wrapper": "npx build-react-wrapper",
+    "build:react-wrapper": "run -T build-react-wrapper",
     "create:manifest": "run -T cem analyze --litelement",
     "lint:scripts": "run -T eslint .",
     "lint:scripts:fix": "yarn lint:scripts --fix",
     "watch": "run -T vite build --watch",
-    "test:browsers": "npx playwright test -c ./playwright-lit.config.ts",
+    "test:browsers": "run -T playwright test -c ./playwright-lit.config.ts",
     "test:browsers:ci": "yarn test:browsers",
-    "test:visual": "run -T cross-env-shell PERCY_TOKEN=${PERCY_TOKEN_PIE_LOTTIE_PLAYER} percy exec --allowed-hostname cloudfront.net -- npx playwright test -c ./playwright-lit-visual.config.ts",
+    "test:visual": "run -T cross-env-shell PERCY_TOKEN=${PERCY_TOKEN_PIE_LOTTIE_PLAYER} percy exec --allowed-hostname cloudfront.net -- run -T playwright test -c ./playwright-lit-visual.config.ts",
     "test:visual:ci": "yarn test:visual"
   },
   "author": "Just Eat Takeaway.com - Design System Team",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@justeattakeaway/pie-components-config": "0.21.2",
-    "@justeattakeaway/pie-css": "1.1.1",
-    "@justeattakeaway/pie-monorepo-utils": "0.9.1"
+    "@justeattakeaway/pie-components-config": "0.21.3",
+    "@justeattakeaway/pie-css": "1.2.0",
+    "@justeattakeaway/pie-monorepo-utils": "0.9.5"
   },
   "dependencies": {
-    "@justeattakeaway/pie-webc-core": "14.0.1",
+    "@justeattakeaway/pie-webc-core": "15.0.0",
     "lottie-web": "5.13.0"
   },
-  "volta": {
-    "extends": "../../../package.json"
-  },
   "customElements": "custom-elements.json",
   "sideEffects": [
     "dist/*.js"