Refactoring.

dist/js/splide.cjs.js

@@ -1026,7 +1026,7 @@ function Layout(Splide2, Components2, options) {
   const { Slides } = Components2;
   const { resolve } = Components2.Direction;
   const { root, track, list } = Components2.Elements;
-  const { getAt } = Slides;
+  const { getAt, style: styleSlides } = Slides;
   let vertical;
   let rootRect;
   function mount() {
@@ -1047,16 +1047,13 @@ function Layout(Splide2, Components2, options) {
     const newRect = rect(root);
     if (!rootRect || rootRect.width !== newRect.width || rootRect.height !== newRect.height) {
       style(track, "height", cssTrackHeight());
-      Slides.style(resolve("marginRight"), unit(options.gap));
-      Slides.style("width", cssSlideWidth() || null);
-      setSlidesHeight();
+      styleSlides(resolve("marginRight"), unit(options.gap));
+      styleSlides("width", cssSlideWidth() || null);
+      styleSlides("height", cssSlideHeight() || null, true);
       rootRect = newRect;
       emit(EVENT_RESIZED);
     }
   }
-  function setSlidesHeight() {
-    Slides.style("height", cssSlideHeight() || null, true);
-  }
   function cssPadding(right) {
     const { padding } = options;
     const prop = resolve(right ? "right" : "left");
@@ -1197,9 +1194,6 @@ function Move(Splide2, Components2, options) {
     Transition = Components2.Transition;
     on([EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition);
   }
-  function destroy() {
-    removeAttribute(list, "style");
-  }
   function reposition() {
     if (!isBusy()) {
       Components2.Scroll.cancel();
@@ -1307,7 +1301,6 @@ function Move(Splide2, Components2, options) {
   }
   return {
     mount,
-    destroy,
     move,
     jump,
     translate,

dist/js/splide.esm.js

@@ -1022,7 +1022,7 @@ function Layout(Splide2, Components2, options) {
   const { Slides } = Components2;
   const { resolve } = Components2.Direction;
   const { root, track, list } = Components2.Elements;
-  const { getAt } = Slides;
+  const { getAt, style: styleSlides } = Slides;
   let vertical;
   let rootRect;
   function mount() {
@@ -1043,16 +1043,13 @@ function Layout(Splide2, Components2, options) {
     const newRect = rect(root);
     if (!rootRect || rootRect.width !== newRect.width || rootRect.height !== newRect.height) {
       style(track, "height", cssTrackHeight());
-      Slides.style(resolve("marginRight"), unit(options.gap));
-      Slides.style("width", cssSlideWidth() || null);
-      setSlidesHeight();
+      styleSlides(resolve("marginRight"), unit(options.gap));
+      styleSlides("width", cssSlideWidth() || null);
+      styleSlides("height", cssSlideHeight() || null, true);
       rootRect = newRect;
       emit(EVENT_RESIZED);
     }
   }
-  function setSlidesHeight() {
-    Slides.style("height", cssSlideHeight() || null, true);
-  }
   function cssPadding(right) {
     const { padding } = options;
     const prop = resolve(right ? "right" : "left");
@@ -1193,9 +1190,6 @@ function Move(Splide2, Components2, options) {
     Transition = Components2.Transition;
     on([EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition);
   }
-  function destroy() {
-    removeAttribute(list, "style");
-  }
   function reposition() {
     if (!isBusy()) {
       Components2.Scroll.cancel();
@@ -1303,7 +1297,6 @@ function Move(Splide2, Components2, options) {
   }
   return {
     mount,
-    destroy,
     move,
     jump,
     translate,

dist/js/splide.js

@@ -1177,7 +1177,8 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
         root = _Components2$Elements2.root,
         track = _Components2$Elements2.track,
         list = _Components2$Elements2.list;
-    var getAt = Slides.getAt;
+    var getAt = Slides.getAt,
+        styleSlides = Slides.style;
     var vertical;
     var rootRect;
 
@@ -1202,18 +1203,14 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
       if (!rootRect || rootRect.width !== newRect.width || rootRect.height !== newRect.height) {
         style(track, "height", cssTrackHeight());
-        Slides.style(resolve("marginRight"), unit(options.gap));
-        Slides.style("width", cssSlideWidth() || null);
-        setSlidesHeight();
+        styleSlides(resolve("marginRight"), unit(options.gap));
+        styleSlides("width", cssSlideWidth() || null);
+        styleSlides("height", cssSlideHeight() || null, true);
         rootRect = newRect;
         emit(EVENT_RESIZED);
       }
     }
 
-    function setSlidesHeight() {
-      Slides.style("height", cssSlideHeight() || null, true);
-    }
-
     function cssPadding(right) {
       var padding = options.padding;
       var prop = resolve(right ? "right" : "left");
@@ -1400,10 +1397,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       on([EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition);
     }
 
-    function destroy() {
-      removeAttribute(list, "style");
-    }
-
     function reposition() {
       if (!isBusy()) {
         Components2.Scroll.cancel();
@@ -1535,7 +1528,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
     return {
       mount: mount,
-      destroy: destroy,
       move: move,
       jump: jump,
       translate: translate,

src/js/components/Layout/Layout.ts

@@ -35,7 +35,7 @@ export function Layout( Splide: Splide, Components: Components, options: Options
   const { Slides } = Components;
   const { resolve } = Components.Direction;
   const { root, track, list } = Components.Elements;
-  const { getAt } = Slides;
+  const { getAt, style: styleSlides } = Slides;
 
   /**
    * Indicates whether the slider direction is vertical or not.
@@ -81,22 +81,15 @@ export function Layout( Splide: Splide, Components: Components, options: Options
     if ( ! rootRect || rootRect.width !== newRect.width || rootRect.height !== newRect.height ) {
       style( track, 'height', cssTrackHeight() );
 
-      Slides.style( resolve( 'marginRight' ), unit( options.gap ) );
-      Slides.style( 'width', cssSlideWidth() || null );
-      setSlidesHeight();
+      styleSlides( resolve( 'marginRight' ), unit( options.gap ) );
+      styleSlides( 'width', cssSlideWidth() || null );
+      styleSlides( 'height', cssSlideHeight() || null, true );
 
       rootRect = newRect;
       emit( EVENT_RESIZED );
     }
   }
 
-  /**
-   * Updates the height of slides or their container elements if available.
-   */
-  function setSlidesHeight(): void {
-    Slides.style( 'height', cssSlideHeight() || null, true );
-  }
-
   /**
    * Parses the padding option and returns the value for each side.
    * This method returns `paddingTop` or `paddingBottom` for the vertical slider.

src/js/components/Move/Move.ts

@@ -13,7 +13,7 @@ import { FADE, LOOP, SLIDE } from '../../constants/types';
 import { EventInterface } from '../../constructors';
 import { Splide } from '../../core/Splide/Splide';
 import { AnyFunction, BaseComponent, Components, Options, TransitionComponent } from '../../types';
-import { abs, ceil, clamp, isUndefined, rect, removeAttribute } from '../../utils';
+import { abs, ceil, clamp, isUndefined, rect } from '../../utils';
 
 
 /**
@@ -65,13 +65,6 @@ export function Move( Splide: Splide, Components: Components, options: Options )
     on( [ EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH ], reposition );
   }
 
-  /**
-   * Destroys the component.
-   */
-  function destroy(): void {
-    removeAttribute( list, 'style' );
-  }
-
   /**
    * Repositions the slider.
    * - This must be called before the Slide component checks the visibility.
@@ -298,7 +291,6 @@ export function Move( Splide: Splide, Components: Components, options: Options )
 
   return {
     mount,
-    destroy,
     move,
     jump,
     translate,

src/js/test/php/examples/fade.php

@@ -20,7 +20,6 @@ $settings = get_settings();
     document.addEventListener( 'DOMContentLoaded', function () {
       var splide = new Splide( '#splide01', {
         width: 800,
-	      direction: 'rtl',
         type : 'fade',
 	      rewind: false,
 	      rewindByDrag: false,

src/js/test/php/examples/live-regions.php

@@ -19,11 +19,10 @@ $settings = get_settings();
   <script>
     document.addEventListener( 'DOMContentLoaded', function () {
       var splide = new Splide( '#splide01', {
-        width: 800,
-	      rewind: true,
-	      // autoplay: true,
-	      // live: false,
-	      slideFocus: false,
+	      width  : 800,
+	      rewind : true,
+	      perPage: 2,
+	      live   : true,
       } );
 
       splide.mount();