@nanoporetech-digital/components 5.5.0 → 5.5.2

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

@@ -2758,6 +2758,11 @@ PrevNextButton.prototype._create = function () {
   const slot = document.createElement('slot');
   slot.name = this.isPrevious ? 'previous-icon' : 'next-icon';
   button.appendChild(slot);
+  slot.addEventListener('slotchange', () => {
+    slot.assignedElements({ flatten: true }).forEach((ele) => {
+      ele.removeAttribute('hidden');
+    });
+  });
 
   // create arrow
   var svg = this.createSVG();
@@ -3865,9 +3870,8 @@ const Slides = class {
     });
     this.parallax = async () => {
       const flkty = await this.flickity;
-      flkty.cells.forEach((el, i) => {
-        const cell = el;
-        const shiftedPos = cell.x + flkty.slideableWidth * cell.shift;
+      const cells = flkty.cells;
+      cells.forEach((cell, i) => {
         const ele = this.childrenEles[i];
         let flkX = flkty.x;
         if (flkty.options.wrapAround && flkty.cells.length > 1) {
@@ -3876,13 +3880,12 @@ const Slides = class {
         }
         let x = ((cell.target + flkX) * -1) / 3;
         if (cell.shift < 0) {
-          x = x + Math.abs(shiftedPos);
+          x = ((cell.target - flkty.slideableWidth + flkX) * -1) / 3;
         }
         else if (cell.shift > 0) {
-          x = ((cell.target + (flkX + shiftedPos)) * -1) / 3;
+          x = ((cell.target + (flkX + flkty.slideableWidth)) * -1) / 3;
         }
         ele.style.transform = 'translate3d(' + x + 'px, 0, 0)';
-        // 'translateX(' + x + 'px)';
       });
     };
     this.handleFullscreen = (isFullScreen) => {
@@ -3956,7 +3959,7 @@ const Slides = class {
         this.options = { fade: true, percentPosition: true };
         break;
       case 'parallax':
-        this.options = { fade: false, percentPosition: false };
+        this.options = { fade: false, percentPosition: true };
         flkty.on('scroll', this.parallax);
         break;
       default:
@@ -4065,9 +4068,7 @@ const Slides = class {
       this.options = { autoPlay: time };
     setTimeout(() => flickity.playPlayer());
   }
-  /**
-   * Stop auto play.
-   */
+  /** Stop auto play. */
   async stopAutoplay() {
     const flickity = await this.getflickity();
     flickity.stopPlayer();
@@ -4125,14 +4126,16 @@ const Slides = class {
     const finalOptions = this.normalizeOptions();
     // init flickity core
     await waitForSlides(this.host);
-    this.flickityEl.style.height =
-      this.flickityEl.getBoundingClientRect().height + 'px';
-    this.slidesReady = true;
     this.flickityEl =
       this.flickityEl || this._getRoot().querySelector('.flickity-container');
-    if (this.flickityEl &&
-      this.flickityEl.classList.contains('flickity-enabled'))
+    if (!this.flickityEl)
+      return;
+    this.slidesReady = true;
+    if (this.flickityEl.classList.contains('flickity-enabled')) {
       this.destroyflickity();
+    }
+    this.flickityEl.style.height =
+      this.flickityEl.getBoundingClientRect().height + 'px';
     setTimeout(() => {
       this.flickityEl.style.height = '';
       const flick = new flickity(this.flickityEl, finalOptions);
@@ -4270,6 +4273,7 @@ const waitForSlides = (host) => {
       if (!toLoadSlides.length) {
         resolve(allSlides);
         host.removeEventListener('nanoSlideReady', slideResolver);
+        host.removeEventListener('nano-slide-ready', slideResolver);
       }
     };
     host.addEventListener('nanoSlideReady', slideResolver);