@nanoporetech-digital/components 5.5.3 → 5.7.0

package/dist/esm/nano-slides.entry.js

@@ -3871,8 +3871,8 @@ const Slides = class {
     this.parallax = async () => {
       const flkty = await this.flickity;
       const cells = flkty.cells;
-      cells.forEach((cell, i) => {
-        const ele = this.childrenEles[i];
+      cells.forEach((cell) => {
+        const ele = cell.element.children[0];
         let flkX = flkty.x;
         if (flkty.options.wrapAround && flkty.cells.length > 1) {
           flkX = modulo(flkX, flkty.slideableWidth);
@@ -3886,6 +3886,8 @@ const Slides = class {
           x = ((cell.target + (flkX + flkty.slideableWidth)) * -1) / 3;
         }
         ele.style.transform = 'translate3d(' + x + 'px, 0, 0)';
+        const animAmount = ((x * 3) / cell.size.width) * 100;
+        cell.element.style.setProperty('--animation-amount', animAmount.toString());
       });
     };
     this.handleFullscreen = (isFullScreen) => {
@@ -3953,6 +3955,16 @@ const Slides = class {
       });
       this.update();
     }
+    // was a custom animation
+    if (typeof oldAnim === 'function') {
+      flkty.off('scroll', oldAnim);
+    }
+    // is a custom animation
+    if (typeof this.animation === 'function') {
+      this.options = { fade: false, percentPosition: true };
+      flkty.on('scroll', this.animation);
+      return;
+    }
     // setup new stuff
     switch (this.animation) {
       case 'fade':