Refactoring.

dist/js/splide.cjs.js

@@ -598,7 +598,7 @@ const ORIENTATION_MAP = {
   right: ["bottom", "left"],
   x: ["y"],
   X: ["Y"],
-  pageX: ["pageY"],
+  Y: ["X"],
   ArrowLeft: ["ArrowUp", "ArrowRight"],
   ArrowRight: ["ArrowDown", "ArrowLeft"]
 };
@@ -852,8 +852,9 @@ function Slide$1(Splide2, index, slideIndex, slide) {
     }
   }
   function updateVisibility(visible) {
-    setAttribute(slide, ARIA_HIDDEN, !visible || null);
-    setAttribute(slide, TAB_INDEX, visible && options.slideFocus ? 0 : null);
+    const ariaHidden = !visible && !isActive();
+    setAttribute(slide, ARIA_HIDDEN, ariaHidden || null);
+    setAttribute(slide, TAB_INDEX, !ariaHidden && options.slideFocus ? 0 : null);
     if (visible !== hasClass(slide, CLASS_VISIBLE)) {
       toggleClass(slide, CLASS_VISIBLE, visible);
       emit(visible ? EVENT_VISIBLE : EVENT_HIDDEN, this);
@@ -1009,7 +1010,6 @@ function Clones(Splide2, Components2, options) {
   const { resolve } = Components2.Direction;
   const clones = [];
   let cloneCount;
-  let cloneIndex;
   function mount() {
     init();
     on(EVENT_REFRESH, refresh);
@@ -1037,23 +1037,22 @@ function Clones(Splide2, Components2, options) {
     const slides = Slides.get().slice();
     const { length } = slides;
     if (length) {
-      cloneIndex = 0;
       while (slides.length < count) {
         push(slides, slides);
       }
-      slides.slice(-count).concat(slides.slice(0, count)).forEach((Slide, index) => {
+      push(slides.slice(-count), slides.slice(0, count)).forEach((Slide, index) => {
         const isHead = index < count;
-        const clone = cloneDeep(Slide.slide);
+        const clone = cloneDeep(Slide.slide, index);
         isHead ? before(clone, slides[0].slide) : append(Elements.list, clone);
         push(clones, clone);
         Slides.register(clone, index - count + (isHead ? 0 : length), Slide.index);
       });
     }
   }
-  function cloneDeep(elm) {
+  function cloneDeep(elm, index) {
     const clone = elm.cloneNode(true);
     addClass(clone, options.classes.clone);
-    clone.id = `${Splide2.root.id}-clone${pad(++cloneIndex)}`;
+    clone.id = `${Splide2.root.id}-clone${pad(index + 1)}`;
     return clone;
   }
   function computeCloneCount() {
@@ -1079,7 +1078,7 @@ function Layout(Splide2, Components2, options) {
   const { Slides } = Components2;
   const { ruleBy } = Components2.Style;
   const { resolve } = Components2.Direction;
-  const { root, track, list } = Components2.Elements;
+  const { track, list } = Components2.Elements;
   const { getAt } = Slides;
   const vertical = options.direction === TTB;
   function mount() {
@@ -1089,7 +1088,7 @@ function Layout(Splide2, Components2, options) {
     on(EVENT_RESIZE, resize);
   }
   function init() {
-    ruleBy(root, "maxWidth", unit(options.width));
+    ruleBy(Splide2.root, "maxWidth", unit(options.width));
     ruleBy(track, resolve("paddingLeft"), cssPadding(false));
     ruleBy(track, resolve("paddingRight"), cssPadding(true));
     Slides.rule(resolve("marginRight"), unit(options.gap));
@@ -1163,7 +1162,7 @@ function Layout(Splide2, Components2, options) {
   }
   function getGap() {
     const Slide = getAt(0);
-    return Slide ? parseFloat(style(Slide.slide, resolve("marginRight"))) || 0 : 0;
+    return Slide && parseFloat(style(Slide.slide, resolve("marginRight"))) || 0;
   }
   function getPadding(right) {
     return parseFloat(style(track, resolve(`padding${right ? "Right" : "Left"}`, true))) || 0;
@@ -1199,7 +1198,7 @@ function Move(Splide2, Components2, options) {
       if (!options[resolve("fixedWidth")] && !options[resolve("autoWidth")]) {
         translate(listSize() * positionRate);
       }
-      if (isExceededMax(currPosition)) {
+      if (exceededLimit(true)) {
         translate(getLimit(true));
       } else {
         snap(SNAP_THRESHOLD);
@@ -1250,8 +1249,8 @@ function Move(Splide2, Components2, options) {
   function loop(position) {
     if (!looping && Splide2.is(LOOP)) {
       const diff = position - currPosition;
-      const exceededMin = isExceededMin(position);
-      const exceededMax = isExceededMax(position);
+      const exceededMin = exceededLimit(false, position);
+      const exceededMax = exceededLimit(true, position);
       if (exceededMin && diff > 0 || exceededMax && diff < 0) {
         position += orient(sliderSize() * (exceededMin ? 1 : -1));
       }
@@ -1306,14 +1305,10 @@ function Move(Splide2, Components2, options) {
   function isBusy() {
     return !!(looping || waiting);
   }
-  function isExceededMin(position, offset2) {
-    return orient(position) + (offset2 || 0) < orient(getLimit(false));
-  }
-  function isExceededMax(position, offset2) {
-    return orient(position) + (offset2 || 0) > orient(getLimit(true));
-  }
-  function isExceeded() {
-    return isExceededMin(currPosition) || isExceededMax(currPosition);
+  function exceededLimit(max, position = currPosition) {
+    const exceededMin = max !== true && orient(position) < orient(getLimit(false));
+    const exceededMax = max !== false && orient(position) > orient(getLimit(true));
+    return exceededMin || exceededMax;
   }
   return {
     mount,
@@ -1326,9 +1321,7 @@ function Move(Splide2, Components2, options) {
     getPosition,
     getLimit,
     isBusy,
-    isExceededMin,
-    isExceededMax,
-    isExceeded
+    exceededLimit
   };
 }
 
@@ -1394,7 +1387,8 @@ function Controller(Splide2, Components2, options) {
     return getAdjacent(true, destination);
   }
   function getAdjacent(prev, destination) {
-    const dest = computeDestIndex(currIndex + getPerMove() * (prev ? -1 : 1), currIndex);
+    const number = perMove || hasFocus() ? 1 : perPage;
+    const dest = computeDestIndex(currIndex + number * (prev ? -1 : 1), currIndex);
     return destination ? dest : loop(dest);
   }
   function computeDestIndex(dest, from, incremental) {
@@ -1445,9 +1439,6 @@ function Controller(Splide2, Components2, options) {
     }
     return index;
   }
-  function getPerMove() {
-    return perMove || hasFocus() ? 1 : perPage;
-  }
   function setIndex(index) {
     if (index !== currIndex) {
       prevIndex = currIndex;
@@ -1482,7 +1473,6 @@ function Arrows(Splide2, Components2, options) {
   const { on, bind, emit } = EventInterface(Splide2);
   const { classes, i18n } = options;
   const { Elements, Controller } = Components2;
-  const { slider, track } = Elements;
   let wrapper = Elements.arrows;
   let prev = Elements.prev;
   let next = Elements.next;
@@ -1500,8 +1490,9 @@ function Arrows(Splide2, Components2, options) {
     }
     if (prev && next) {
       if (!arrows.prev) {
-        setAttribute(prev, ARIA_CONTROLS, track.id);
-        setAttribute(next, ARIA_CONTROLS, track.id);
+        const { id } = Elements.track;
+        setAttribute(prev, ARIA_CONTROLS, id);
+        setAttribute(next, ARIA_CONTROLS, id);
         arrows.prev = prev;
         arrows.next = next;
         listen();
@@ -1530,13 +1521,12 @@ function Arrows(Splide2, Components2, options) {
     });
   }
   function createArrows() {
-    const parent = options.arrows === "slider" && slider ? slider : Splide2.root;
     wrapper = create("div", classes.arrows);
     prev = createArrow(true);
     next = createArrow(false);
     created = true;
     append(wrapper, [prev, next]);
-    before(wrapper, child(parent));
+    before(wrapper, child(options.arrows === "slider" && Elements.slider || Splide2.root));
   }
   function createArrow(prev2) {
     const arrow = `<button class="${classes.arrow} ${prev2 ? classes.prev : classes.next}" type="button"><svg xmlns="${XML_NAME_SPACE}" viewBox="0 0 ${SIZE} ${SIZE}" width="${SIZE}" height="${SIZE}"><path d="${options.arrowPath || PATH}" />`;
@@ -1563,7 +1553,7 @@ function Arrows(Splide2, Components2, options) {
 
 function Autoplay(Splide2, Components2, options) {
   const { on, bind, emit } = EventInterface(Splide2);
-  const { root, track, bar, play: playButton, pause: pauseButton } = Components2.Elements;
+  const { Elements } = Components2;
   const interval = RequestInterval(options.interval, Splide2.go.bind(Splide2, ">"), update);
   const { isPaused } = interval;
   let hovered;
@@ -1581,17 +1571,19 @@ function Autoplay(Splide2, Components2, options) {
     }
   }
   function initButton(forPause) {
-    const button = forPause ? pauseButton : playButton;
+    const prop = forPause ? "pause" : "play";
+    const button = Elements[prop];
     if (button) {
       if (!isHTMLButtonElement(button)) {
         setAttribute(button, ROLE, "button");
       }
-      setAttribute(button, ARIA_CONTROLS, track.id);
-      setAttribute(button, ARIA_LABEL, options.i18n[forPause ? "pause" : "play"]);
+      setAttribute(button, ARIA_CONTROLS, Elements.track.id);
+      setAttribute(button, ARIA_LABEL, options.i18n[prop]);
       bind(button, "click", forPause ? pause : play);
     }
   }
   function listen() {
+    const { root } = Elements;
     if (options.pauseOnHover) {
       bind(root, "mouseenter mouseleave", (e) => {
         hovered = e.type === "mouseenter";
@@ -1631,10 +1623,11 @@ function Autoplay(Splide2, Components2, options) {
     }
   }
   function update(rate) {
-    emit(EVENT_AUTOPLAY_PLAYING, rate);
+    const { bar } = Elements;
     if (bar) {
       style(bar, { width: `${rate * 100}%` });
     }
+    emit(EVENT_AUTOPLAY_PLAYING, rate);
   }
   return {
     mount,
@@ -1685,7 +1678,7 @@ const MIN_DURATION = 800;
 function Scroll(Splide2, Components2, options) {
   const { on, emit } = EventInterface(Splide2);
   const { Move } = Components2;
-  const { getPosition, getLimit } = Move;
+  const { getPosition, getLimit, exceededLimit } = Move;
   let interval;
   function mount() {
     on(EVENT_MOVE, clear);
@@ -1701,10 +1694,10 @@ function Scroll(Splide2, Components2, options) {
       const target = start + (destination - start) * easing(rate);
       const diff = (target - getPosition()) * friction;
       Move.translate(position + diff);
-      if (Splide2.is(SLIDE) && !suppressConstraint && Move.isExceeded()) {
+      if (Splide2.is(SLIDE) && !suppressConstraint && exceededLimit()) {
         friction *= FRICTION_FACTOR;
         if (abs(diff) < BOUNCE_DIFF_THRESHOLD) {
-          bounce(Move.isExceededMin(getPosition()));
+          bounce(exceededLimit(false));
         }
       }
     }, 1);
@@ -1744,119 +1737,124 @@ function Scroll(Splide2, Components2, options) {
 }
 
 const FRICTION = 5;
-const SAMPLING_INTERVAL = 50;
+const LOG_INTERVAL = 50;
 const POINTER_DOWN_EVENTS = "touchstart mousedown";
 const POINTER_MOVE_EVENTS = "touchmove mousemove";
 const POINTER_UP_EVENTS = "touchend touchcancel mouseup mouseleave";
 
 function Drag(Splide2, Components2, options) {
-  const { emit, bind, unbind } = EventInterface(Splide2);
+  const { on, emit, bind, unbind } = EventInterface(Splide2);
+  const { Move, Scroll, Controller } = Components2;
   const { track } = Components2.Elements;
   const { resolve, orient } = Components2.Direction;
-  const { listSize } = Components2.Layout;
-  const { go, getEnd } = Components2.Controller;
-  const { Move, Scroll } = Components2;
-  const { translate, toIndex, getPosition, isExceeded } = Move;
+  const { getPosition, exceededLimit } = Move;
   const isSlide = Splide2.is(SLIDE);
   const isFade = Splide2.is(FADE);
-  const isFree = options.drag === "free";
-  let startCoord;
-  let lastTime;
   let basePosition;
-  let baseCoord;
-  let baseTime;
+  let baseEvent;
+  let prevBaseEvent;
   let lastEvent;
-  let moving;
+  let isFree;
+  let isDragging;
   let isMouse;
+  let hasExceeded = false;
+  let clickPrevented;
+  let disabled;
   let target;
-  let exceeded;
   function mount() {
-    if (options.drag) {
-      bind(track, POINTER_DOWN_EVENTS, onPointerDown);
-      bind(track, "click", (e) => {
-        prevent(e, true);
-      });
-    }
+    bind(track, POINTER_DOWN_EVENTS, onPointerDown);
+    bind(track, "click", onClick, { capture: true });
+    on([EVENT_MOUNTED, EVENT_UPDATED], init);
+  }
+  function init() {
+    const { drag } = options;
+    disable(!drag);
+    isFree = drag === "free";
   }
   function onPointerDown(e) {
-    isMouse = e.type === "mousedown";
-    target = isMouse ? window : track;
-    if (!(isMouse && e.button)) {
-      bind(target, POINTER_MOVE_EVENTS, onPointerMove);
-      bind(target, POINTER_UP_EVENTS, onPointerUp);
-      Move.cancel();
-      Scroll.cancel();
-      startCoord = getCoord(e);
+    if (!disabled) {
+      isMouse = e.type === "mousedown";
+      if (!Move.isBusy() && (!isMouse || !e.button)) {
+        target = isMouse ? window : track;
+        prevBaseEvent = null;
+        lastEvent = null;
+        clickPrevented = false;
+        bind(target, POINTER_MOVE_EVENTS, onPointerMove);
+        bind(target, POINTER_UP_EVENTS, onPointerUp);
+        Move.cancel();
+        Scroll.cancel();
+        save(e);
+      }
     }
   }
   function onPointerMove(e) {
-    console.log(`${Date.now()}: ${e.cancelable}`);
-    if (e.cancelable) {
-      const min2 = options.dragMinThreshold || 2;
-      if (isMouse || abs(getCoord(e) - startCoord) > min2) {
-        moving = true;
-        onDrag();
+    if (!lastEvent) {
+      clickPrevented = true;
+      emit(EVENT_DRAG);
+    }
+    lastEvent = e;
+    if (!e.cancelable) {
+      return;
+    }
+    if (isDragging) {
+      const expired = timeOf(e) - timeOf(baseEvent) > LOG_INTERVAL;
+      const exceeded = hasExceeded !== (hasExceeded = exceededLimit());
+      if (expired || exceeded) {
+        save(e);
       }
-      if (moving) {
-        onDragging(e);
+      if (!isFade) {
+        Move.translate(basePosition + constrain(coordOf(e) - coordOf(baseEvent)));
       }
-      prevent(e, true);
+      emit(EVENT_DRAGGING);
+      prevent(e);
     } else {
-      onPointerUp(e);
+      const threshold = options.dragMinThreshold || 15;
+      isDragging = isMouse || abs(coordOf(e) - coordOf(baseEvent)) > threshold;
+      if (isSliderDirection()) {
+        prevent(e);
+      }
     }
   }
   function onPointerUp(e) {
     unbind(target, `${POINTER_MOVE_EVENTS} ${POINTER_UP_EVENTS}`);
-    moving = false;
     if (lastEvent) {
-      onDragged(e);
-      lastEvent = null;
+      if (isDragging || e.cancelable && isSliderDirection()) {
+        const velocity = computeVelocity(e);
+        const destination = computeDestination(velocity);
+        if (isFree) {
+          Scroll.scroll(destination);
+        } else if (isFade) {
+          Controller.go(Splide2.index + orient(sign(velocity)));
+        } else {
+          Controller.go(computeIndex(destination), true);
+        }
+        prevent(e);
+      }
+      emit(EVENT_DRAGGED);
     }
+    isDragging = false;
+  }
+  function save(e) {
+    prevBaseEvent = baseEvent;
+    baseEvent = e;
+    basePosition = getPosition();
   }
-  function onDrag() {
-    bind(track, "click", (e) => {
-      unbind(track, "click");
+  function onClick(e) {
+    if (!disabled && clickPrevented) {
       prevent(e, true);
-    }, { capture: true });
-    emit(EVENT_DRAG);
-  }
-  function onDragging(e) {
-    const { timeStamp } = e;
-    const expired = !lastTime || timeStamp - lastTime > SAMPLING_INTERVAL;
-    if (expired || isExceeded() !== exceeded) {
-      basePosition = getPosition();
-      baseCoord = getCoord(e);
-      baseTime = timeStamp;
-    }
-    exceeded = isExceeded();
-    lastTime = timeStamp;
-    lastEvent = e;
-    if (!isFade) {
-      translate(basePosition + constrain(getCoord(e) - baseCoord));
     }
-    emit(EVENT_DRAGGING);
   }
-  function onDragged(e) {
-    const velocity = computeVelocity(e);
-    if (isFade) {
-      go(Splide2.index + orient(sign(velocity)));
-    } else {
-      const destination = computeDestination(velocity);
-      if (isFree) {
-        Scroll.scroll(destination);
-        console.log(velocity);
-      } else {
-        go(computeIndex(destination), true);
-      }
-    }
-    lastTime = 0;
-    emit(EVENT_DRAGGED);
+  function isSliderDirection() {
+    const diffX = abs(coordOf(lastEvent) - coordOf(baseEvent));
+    const diffY = abs(coordOf(lastEvent, true) - coordOf(baseEvent, true));
+    return diffX > diffY;
   }
   function computeVelocity(e) {
-    if (Splide2.is(LOOP) || !isExceeded()) {
-      const diffCoord = getCoord(lastEvent) - baseCoord;
-      const diffTime = lastEvent.timeStamp - baseTime;
-      const isFlick = e.timeStamp - lastTime < SAMPLING_INTERVAL;
+    if (Splide2.is(LOOP) || !hasExceeded) {
+      const base = baseEvent === lastEvent && prevBaseEvent || baseEvent;
+      const diffCoord = coordOf(lastEvent) - coordOf(base);
+      const diffTime = timeOf(e) - timeOf(base);
+      const isFlick = timeOf(e) - timeOf(lastEvent) < LOG_INTERVAL;
       if (diffTime && isFlick) {
         return diffCoord / diffTime;
       }
@@ -1864,21 +1862,28 @@ function Drag(Splide2, Components2, options) {
     return 0;
   }
   function computeDestination(velocity) {
-    const flickPower = options.flickPower || 600;
-    return getPosition() + sign(velocity) * min(abs(velocity) * flickPower, isFree ? Infinity : listSize() * (options.flickMaxPages || 1));
+    return getPosition() + sign(velocity) * min(abs(velocity) * (options.flickPower || 600), isFree ? Infinity : Components2.Layout.listSize() * (options.flickMaxPages || 1));
   }
   function computeIndex(destination) {
-    const dest = toIndex(destination);
-    return isSlide ? clamp(dest, 0, getEnd()) : dest;
+    const dest = Move.toIndex(destination);
+    return isSlide ? clamp(dest, 0, Controller.getEnd()) : dest;
+  }
+  function coordOf(e, orthogonal) {
+    const prop = `page${resolve(orthogonal ? "Y" : "X")}`;
+    return (isMouse ? e : e.touches[0])[prop];
   }
-  function getCoord(e) {
-    return (isMouse ? e : e.touches[0])[resolve("pageX")];
+  function timeOf(e) {
+    return e.timeStamp;
   }
   function constrain(diff) {
-    return diff / (exceeded && isSlide ? FRICTION : 1);
+    return diff / (hasExceeded && isSlide ? FRICTION : 1);
+  }
+  function disable(value) {
+    disabled = value;
   }
   return {
-    mount
+    mount,
+    disable
   };
 }
 
@@ -2023,7 +2028,7 @@ function LazyLoad(Splide2, Components2, options) {
 
 function Pagination(Splide2, Components2, options) {
   const { on, emit, bind, unbind } = EventInterface(Splide2);
-  const { Slides } = Components2;
+  const { Slides, Elements } = Components2;
   const { go, toPage, hasFocus, getIndex } = Components2.Controller;
   const items = [];
   let list;
@@ -2053,8 +2058,7 @@ function Pagination(Splide2, Components2, options) {
   function createPagination() {
     const { length } = Splide2;
     const { classes, i18n, perPage } = options;
-    const { slider, root } = Components2.Elements;
-    const parent = options.pagination === "slider" && slider ? slider : root;
+    const parent = options.pagination === "slider" && Elements.slider || Elements.root;
     const max = hasFocus() ? length : ceil(length / perPage);
     list = create("ul", classes.pagination, parent);
     for (let i = 0; i < max; i++) {
@@ -2302,25 +2306,24 @@ const _Splide = class {
     merge(merge(this._options, DEFAULTS), options || {});
   }
   mount(Extensions, Transition) {
-    this.state.set(CREATED);
+    const { state, Components: Components2 } = this;
+    assert(state.is([CREATED, DESTROYED]), "Already mounted.");
+    state.set(CREATED);
+    this._Components = Components2;
     this._Transition = Transition || this._Transition || (this.is(FADE) ? Fade : Slide);
     this._Extensions = Extensions || this._Extensions;
     const Constructors = assign({}, ComponentConstructors, this._Extensions, { Transition: this._Transition });
-    const { Components: Components2 } = this;
     forOwn(Constructors, (Component, key) => {
-      const component = Component(this, this.Components, this._options);
+      const component = Component(this, Components2, this._options);
       Components2[key] = component;
       component.setup && component.setup();
     });
     forOwn(Components2, (component) => {
       component.mount && component.mount();
     });
-    forOwn(Components2, (component) => {
-      component.mounted && component.mounted();
-    });
     this.emit(EVENT_MOUNTED);
     addClass(this.root, CLASS_INITIALIZED);
-    this.state.set(IDLE);
+    state.set(IDLE);
     this.emit(EVENT_READY);
     return this;
   }
@@ -2330,7 +2333,7 @@ const _Splide = class {
     return this;
   }
   go(control) {
-    this.Components.Controller.go(control);
+    this._Components.Controller.go(control);
   }
   on(events, callback) {
     this.event.on(events, callback, null, DEFAULT_USER_EVENT_PRIORITY);
@@ -2345,11 +2348,11 @@ const _Splide = class {
     return this;
   }
   add(slides, index) {
-    this.Components.Slides.add(slides, index);
+    this._Components.Slides.add(slides, index);
     return this;
   }
   remove(matcher) {
-    this.Components.Slides.remove(matcher);
+    this._Components.Slides.remove(matcher);
     return this;
   }
   is(type) {
@@ -2364,7 +2367,7 @@ const _Splide = class {
     if (state.is(CREATED)) {
       event.on(EVENT_READY, this.destroy.bind(this, completely), this);
     } else {
-      forOwn(this.Components, (component) => {
+      forOwn(this._Components, (component) => {
         component.destroy && component.destroy(completely);
       });
       event.emit(EVENT_DESTROY);
@@ -2385,10 +2388,10 @@ const _Splide = class {
     }
   }
   get length() {
-    return this.Components.Slides.getLength(true);
+    return this._Components.Slides.getLength(true);
   }
   get index() {
-    return this.Components.Controller.getIndex();
+    return this._Components.Controller.getIndex();
   }
 };
 let Splide = _Splide;

dist/js/splide.esm.js

@@ -594,7 +594,7 @@ const ORIENTATION_MAP = {
   right: ["bottom", "left"],
   x: ["y"],
   X: ["Y"],
-  pageX: ["pageY"],
+  Y: ["X"],
   ArrowLeft: ["ArrowUp", "ArrowRight"],
   ArrowRight: ["ArrowDown", "ArrowLeft"]
 };
@@ -848,8 +848,9 @@ function Slide$1(Splide2, index, slideIndex, slide) {
     }
   }
   function updateVisibility(visible) {
-    setAttribute(slide, ARIA_HIDDEN, !visible || null);
-    setAttribute(slide, TAB_INDEX, visible && options.slideFocus ? 0 : null);
+    const ariaHidden = !visible && !isActive();
+    setAttribute(slide, ARIA_HIDDEN, ariaHidden || null);
+    setAttribute(slide, TAB_INDEX, !ariaHidden && options.slideFocus ? 0 : null);
     if (visible !== hasClass(slide, CLASS_VISIBLE)) {
       toggleClass(slide, CLASS_VISIBLE, visible);
       emit(visible ? EVENT_VISIBLE : EVENT_HIDDEN, this);
@@ -1005,7 +1006,6 @@ function Clones(Splide2, Components2, options) {
   const { resolve } = Components2.Direction;
   const clones = [];
   let cloneCount;
-  let cloneIndex;
   function mount() {
     init();
     on(EVENT_REFRESH, refresh);
@@ -1033,23 +1033,22 @@ function Clones(Splide2, Components2, options) {
     const slides = Slides.get().slice();
     const { length } = slides;
     if (length) {
-      cloneIndex = 0;
       while (slides.length < count) {
         push(slides, slides);
       }
-      slides.slice(-count).concat(slides.slice(0, count)).forEach((Slide, index) => {
+      push(slides.slice(-count), slides.slice(0, count)).forEach((Slide, index) => {
         const isHead = index < count;
-        const clone = cloneDeep(Slide.slide);
+        const clone = cloneDeep(Slide.slide, index);
         isHead ? before(clone, slides[0].slide) : append(Elements.list, clone);
         push(clones, clone);
         Slides.register(clone, index - count + (isHead ? 0 : length), Slide.index);
       });
     }
   }
-  function cloneDeep(elm) {
+  function cloneDeep(elm, index) {
     const clone = elm.cloneNode(true);
     addClass(clone, options.classes.clone);
-    clone.id = `${Splide2.root.id}-clone${pad(++cloneIndex)}`;
+    clone.id = `${Splide2.root.id}-clone${pad(index + 1)}`;
     return clone;
   }
   function computeCloneCount() {
@@ -1075,7 +1074,7 @@ function Layout(Splide2, Components2, options) {
   const { Slides } = Components2;
   const { ruleBy } = Components2.Style;
   const { resolve } = Components2.Direction;
-  const { root, track, list } = Components2.Elements;
+  const { track, list } = Components2.Elements;
   const { getAt } = Slides;
   const vertical = options.direction === TTB;
   function mount() {
@@ -1085,7 +1084,7 @@ function Layout(Splide2, Components2, options) {
     on(EVENT_RESIZE, resize);
   }
   function init() {
-    ruleBy(root, "maxWidth", unit(options.width));
+    ruleBy(Splide2.root, "maxWidth", unit(options.width));
     ruleBy(track, resolve("paddingLeft"), cssPadding(false));
     ruleBy(track, resolve("paddingRight"), cssPadding(true));
     Slides.rule(resolve("marginRight"), unit(options.gap));
@@ -1159,7 +1158,7 @@ function Layout(Splide2, Components2, options) {
   }
   function getGap() {
     const Slide = getAt(0);
-    return Slide ? parseFloat(style(Slide.slide, resolve("marginRight"))) || 0 : 0;
+    return Slide && parseFloat(style(Slide.slide, resolve("marginRight"))) || 0;
   }
   function getPadding(right) {
     return parseFloat(style(track, resolve(`padding${right ? "Right" : "Left"}`, true))) || 0;
@@ -1195,7 +1194,7 @@ function Move(Splide2, Components2, options) {
       if (!options[resolve("fixedWidth")] && !options[resolve("autoWidth")]) {
         translate(listSize() * positionRate);
       }
-      if (isExceededMax(currPosition)) {
+      if (exceededLimit(true)) {
         translate(getLimit(true));
       } else {
         snap(SNAP_THRESHOLD);
@@ -1246,8 +1245,8 @@ function Move(Splide2, Components2, options) {
   function loop(position) {
     if (!looping && Splide2.is(LOOP)) {
       const diff = position - currPosition;
-      const exceededMin = isExceededMin(position);
-      const exceededMax = isExceededMax(position);
+      const exceededMin = exceededLimit(false, position);
+      const exceededMax = exceededLimit(true, position);
       if (exceededMin && diff > 0 || exceededMax && diff < 0) {
         position += orient(sliderSize() * (exceededMin ? 1 : -1));
       }
@@ -1302,14 +1301,10 @@ function Move(Splide2, Components2, options) {
   function isBusy() {
     return !!(looping || waiting);
   }
-  function isExceededMin(position, offset2) {
-    return orient(position) + (offset2 || 0) < orient(getLimit(false));
-  }
-  function isExceededMax(position, offset2) {
-    return orient(position) + (offset2 || 0) > orient(getLimit(true));
-  }
-  function isExceeded() {
-    return isExceededMin(currPosition) || isExceededMax(currPosition);
+  function exceededLimit(max, position = currPosition) {
+    const exceededMin = max !== true && orient(position) < orient(getLimit(false));
+    const exceededMax = max !== false && orient(position) > orient(getLimit(true));
+    return exceededMin || exceededMax;
   }
   return {
     mount,
@@ -1322,9 +1317,7 @@ function Move(Splide2, Components2, options) {
     getPosition,
     getLimit,
     isBusy,
-    isExceededMin,
-    isExceededMax,
-    isExceeded
+    exceededLimit
   };
 }
 
@@ -1390,7 +1383,8 @@ function Controller(Splide2, Components2, options) {
     return getAdjacent(true, destination);
   }
   function getAdjacent(prev, destination) {
-    const dest = computeDestIndex(currIndex + getPerMove() * (prev ? -1 : 1), currIndex);
+    const number = perMove || hasFocus() ? 1 : perPage;
+    const dest = computeDestIndex(currIndex + number * (prev ? -1 : 1), currIndex);
     return destination ? dest : loop(dest);
   }
   function computeDestIndex(dest, from, incremental) {
@@ -1441,9 +1435,6 @@ function Controller(Splide2, Components2, options) {
     }
     return index;
   }
-  function getPerMove() {
-    return perMove || hasFocus() ? 1 : perPage;
-  }
   function setIndex(index) {
     if (index !== currIndex) {
       prevIndex = currIndex;
@@ -1478,7 +1469,6 @@ function Arrows(Splide2, Components2, options) {
   const { on, bind, emit } = EventInterface(Splide2);
   const { classes, i18n } = options;
   const { Elements, Controller } = Components2;
-  const { slider, track } = Elements;
   let wrapper = Elements.arrows;
   let prev = Elements.prev;
   let next = Elements.next;
@@ -1496,8 +1486,9 @@ function Arrows(Splide2, Components2, options) {
     }
     if (prev && next) {
       if (!arrows.prev) {
-        setAttribute(prev, ARIA_CONTROLS, track.id);
-        setAttribute(next, ARIA_CONTROLS, track.id);
+        const { id } = Elements.track;
+        setAttribute(prev, ARIA_CONTROLS, id);
+        setAttribute(next, ARIA_CONTROLS, id);
         arrows.prev = prev;
         arrows.next = next;
         listen();
@@ -1526,13 +1517,12 @@ function Arrows(Splide2, Components2, options) {
     });
   }
   function createArrows() {
-    const parent = options.arrows === "slider" && slider ? slider : Splide2.root;
     wrapper = create("div", classes.arrows);
     prev = createArrow(true);
     next = createArrow(false);
     created = true;
     append(wrapper, [prev, next]);
-    before(wrapper, child(parent));
+    before(wrapper, child(options.arrows === "slider" && Elements.slider || Splide2.root));
   }
   function createArrow(prev2) {
     const arrow = `<button class="${classes.arrow} ${prev2 ? classes.prev : classes.next}" type="button"><svg xmlns="${XML_NAME_SPACE}" viewBox="0 0 ${SIZE} ${SIZE}" width="${SIZE}" height="${SIZE}"><path d="${options.arrowPath || PATH}" />`;
@@ -1559,7 +1549,7 @@ function Arrows(Splide2, Components2, options) {
 
 function Autoplay(Splide2, Components2, options) {
   const { on, bind, emit } = EventInterface(Splide2);
-  const { root, track, bar, play: playButton, pause: pauseButton } = Components2.Elements;
+  const { Elements } = Components2;
   const interval = RequestInterval(options.interval, Splide2.go.bind(Splide2, ">"), update);
   const { isPaused } = interval;
   let hovered;
@@ -1577,17 +1567,19 @@ function Autoplay(Splide2, Components2, options) {
     }
   }
   function initButton(forPause) {
-    const button = forPause ? pauseButton : playButton;
+    const prop = forPause ? "pause" : "play";
+    const button = Elements[prop];
     if (button) {
       if (!isHTMLButtonElement(button)) {
         setAttribute(button, ROLE, "button");
       }
-      setAttribute(button, ARIA_CONTROLS, track.id);
-      setAttribute(button, ARIA_LABEL, options.i18n[forPause ? "pause" : "play"]);
+      setAttribute(button, ARIA_CONTROLS, Elements.track.id);
+      setAttribute(button, ARIA_LABEL, options.i18n[prop]);
       bind(button, "click", forPause ? pause : play);
     }
   }
   function listen() {
+    const { root } = Elements;
     if (options.pauseOnHover) {
       bind(root, "mouseenter mouseleave", (e) => {
         hovered = e.type === "mouseenter";
@@ -1627,10 +1619,11 @@ function Autoplay(Splide2, Components2, options) {
     }
   }
   function update(rate) {
-    emit(EVENT_AUTOPLAY_PLAYING, rate);
+    const { bar } = Elements;
     if (bar) {
       style(bar, { width: `${rate * 100}%` });
     }
+    emit(EVENT_AUTOPLAY_PLAYING, rate);
   }
   return {
     mount,
@@ -1681,7 +1674,7 @@ const MIN_DURATION = 800;
 function Scroll(Splide2, Components2, options) {
   const { on, emit } = EventInterface(Splide2);
   const { Move } = Components2;
-  const { getPosition, getLimit } = Move;
+  const { getPosition, getLimit, exceededLimit } = Move;
   let interval;
   function mount() {
     on(EVENT_MOVE, clear);
@@ -1697,10 +1690,10 @@ function Scroll(Splide2, Components2, options) {
       const target = start + (destination - start) * easing(rate);
       const diff = (target - getPosition()) * friction;
       Move.translate(position + diff);
-      if (Splide2.is(SLIDE) && !suppressConstraint && Move.isExceeded()) {
+      if (Splide2.is(SLIDE) && !suppressConstraint && exceededLimit()) {
         friction *= FRICTION_FACTOR;
         if (abs(diff) < BOUNCE_DIFF_THRESHOLD) {
-          bounce(Move.isExceededMin(getPosition()));
+          bounce(exceededLimit(false));
         }
       }
     }, 1);
@@ -1740,119 +1733,124 @@ function Scroll(Splide2, Components2, options) {
 }
 
 const FRICTION = 5;
-const SAMPLING_INTERVAL = 50;
+const LOG_INTERVAL = 50;
 const POINTER_DOWN_EVENTS = "touchstart mousedown";
 const POINTER_MOVE_EVENTS = "touchmove mousemove";
 const POINTER_UP_EVENTS = "touchend touchcancel mouseup mouseleave";
 
 function Drag(Splide2, Components2, options) {
-  const { emit, bind, unbind } = EventInterface(Splide2);
+  const { on, emit, bind, unbind } = EventInterface(Splide2);
+  const { Move, Scroll, Controller } = Components2;
   const { track } = Components2.Elements;
   const { resolve, orient } = Components2.Direction;
-  const { listSize } = Components2.Layout;
-  const { go, getEnd } = Components2.Controller;
-  const { Move, Scroll } = Components2;
-  const { translate, toIndex, getPosition, isExceeded } = Move;
+  const { getPosition, exceededLimit } = Move;
   const isSlide = Splide2.is(SLIDE);
   const isFade = Splide2.is(FADE);
-  const isFree = options.drag === "free";
-  let startCoord;
-  let lastTime;
   let basePosition;
-  let baseCoord;
-  let baseTime;
+  let baseEvent;
+  let prevBaseEvent;
   let lastEvent;
-  let moving;
+  let isFree;
+  let isDragging;
   let isMouse;
+  let hasExceeded = false;
+  let clickPrevented;
+  let disabled;
   let target;
-  let exceeded;
   function mount() {
-    if (options.drag) {
-      bind(track, POINTER_DOWN_EVENTS, onPointerDown);
-      bind(track, "click", (e) => {
-        prevent(e, true);
-      });
-    }
+    bind(track, POINTER_DOWN_EVENTS, onPointerDown);
+    bind(track, "click", onClick, { capture: true });
+    on([EVENT_MOUNTED, EVENT_UPDATED], init);
+  }
+  function init() {
+    const { drag } = options;
+    disable(!drag);
+    isFree = drag === "free";
   }
   function onPointerDown(e) {
-    isMouse = e.type === "mousedown";
-    target = isMouse ? window : track;
-    if (!(isMouse && e.button)) {
-      bind(target, POINTER_MOVE_EVENTS, onPointerMove);
-      bind(target, POINTER_UP_EVENTS, onPointerUp);
-      Move.cancel();
-      Scroll.cancel();
-      startCoord = getCoord(e);
+    if (!disabled) {
+      isMouse = e.type === "mousedown";
+      if (!Move.isBusy() && (!isMouse || !e.button)) {
+        target = isMouse ? window : track;
+        prevBaseEvent = null;
+        lastEvent = null;
+        clickPrevented = false;
+        bind(target, POINTER_MOVE_EVENTS, onPointerMove);
+        bind(target, POINTER_UP_EVENTS, onPointerUp);
+        Move.cancel();
+        Scroll.cancel();
+        save(e);
+      }
     }
   }
   function onPointerMove(e) {
-    console.log(`${Date.now()}: ${e.cancelable}`);
-    if (e.cancelable) {
-      const min2 = options.dragMinThreshold || 2;
-      if (isMouse || abs(getCoord(e) - startCoord) > min2) {
-        moving = true;
-        onDrag();
+    if (!lastEvent) {
+      clickPrevented = true;
+      emit(EVENT_DRAG);
+    }
+    lastEvent = e;
+    if (!e.cancelable) {
+      return;
+    }
+    if (isDragging) {
+      const expired = timeOf(e) - timeOf(baseEvent) > LOG_INTERVAL;
+      const exceeded = hasExceeded !== (hasExceeded = exceededLimit());
+      if (expired || exceeded) {
+        save(e);
       }
-      if (moving) {
-        onDragging(e);
+      if (!isFade) {
+        Move.translate(basePosition + constrain(coordOf(e) - coordOf(baseEvent)));
       }
-      prevent(e, true);
+      emit(EVENT_DRAGGING);
+      prevent(e);
     } else {
-      onPointerUp(e);
+      const threshold = options.dragMinThreshold || 15;
+      isDragging = isMouse || abs(coordOf(e) - coordOf(baseEvent)) > threshold;
+      if (isSliderDirection()) {
+        prevent(e);
+      }
     }
   }
   function onPointerUp(e) {
     unbind(target, `${POINTER_MOVE_EVENTS} ${POINTER_UP_EVENTS}`);
-    moving = false;
     if (lastEvent) {
-      onDragged(e);
-      lastEvent = null;
+      if (isDragging || e.cancelable && isSliderDirection()) {
+        const velocity = computeVelocity(e);
+        const destination = computeDestination(velocity);
+        if (isFree) {
+          Scroll.scroll(destination);
+        } else if (isFade) {
+          Controller.go(Splide2.index + orient(sign(velocity)));
+        } else {
+          Controller.go(computeIndex(destination), true);
+        }
+        prevent(e);
+      }
+      emit(EVENT_DRAGGED);
     }
+    isDragging = false;
+  }
+  function save(e) {
+    prevBaseEvent = baseEvent;
+    baseEvent = e;
+    basePosition = getPosition();
   }
-  function onDrag() {
-    bind(track, "click", (e) => {
-      unbind(track, "click");
+  function onClick(e) {
+    if (!disabled && clickPrevented) {
       prevent(e, true);
-    }, { capture: true });
-    emit(EVENT_DRAG);
-  }
-  function onDragging(e) {
-    const { timeStamp } = e;
-    const expired = !lastTime || timeStamp - lastTime > SAMPLING_INTERVAL;
-    if (expired || isExceeded() !== exceeded) {
-      basePosition = getPosition();
-      baseCoord = getCoord(e);
-      baseTime = timeStamp;
-    }
-    exceeded = isExceeded();
-    lastTime = timeStamp;
-    lastEvent = e;
-    if (!isFade) {
-      translate(basePosition + constrain(getCoord(e) - baseCoord));
     }
-    emit(EVENT_DRAGGING);
   }
-  function onDragged(e) {
-    const velocity = computeVelocity(e);
-    if (isFade) {
-      go(Splide2.index + orient(sign(velocity)));
-    } else {
-      const destination = computeDestination(velocity);
-      if (isFree) {
-        Scroll.scroll(destination);
-        console.log(velocity);
-      } else {
-        go(computeIndex(destination), true);
-      }
-    }
-    lastTime = 0;
-    emit(EVENT_DRAGGED);
+  function isSliderDirection() {
+    const diffX = abs(coordOf(lastEvent) - coordOf(baseEvent));
+    const diffY = abs(coordOf(lastEvent, true) - coordOf(baseEvent, true));
+    return diffX > diffY;
   }
   function computeVelocity(e) {
-    if (Splide2.is(LOOP) || !isExceeded()) {
-      const diffCoord = getCoord(lastEvent) - baseCoord;
-      const diffTime = lastEvent.timeStamp - baseTime;
-      const isFlick = e.timeStamp - lastTime < SAMPLING_INTERVAL;
+    if (Splide2.is(LOOP) || !hasExceeded) {
+      const base = baseEvent === lastEvent && prevBaseEvent || baseEvent;
+      const diffCoord = coordOf(lastEvent) - coordOf(base);
+      const diffTime = timeOf(e) - timeOf(base);
+      const isFlick = timeOf(e) - timeOf(lastEvent) < LOG_INTERVAL;
       if (diffTime && isFlick) {
         return diffCoord / diffTime;
       }
@@ -1860,21 +1858,28 @@ function Drag(Splide2, Components2, options) {
     return 0;
   }
   function computeDestination(velocity) {
-    const flickPower = options.flickPower || 600;
-    return getPosition() + sign(velocity) * min(abs(velocity) * flickPower, isFree ? Infinity : listSize() * (options.flickMaxPages || 1));
+    return getPosition() + sign(velocity) * min(abs(velocity) * (options.flickPower || 600), isFree ? Infinity : Components2.Layout.listSize() * (options.flickMaxPages || 1));
   }
   function computeIndex(destination) {
-    const dest = toIndex(destination);
-    return isSlide ? clamp(dest, 0, getEnd()) : dest;
+    const dest = Move.toIndex(destination);
+    return isSlide ? clamp(dest, 0, Controller.getEnd()) : dest;
+  }
+  function coordOf(e, orthogonal) {
+    const prop = `page${resolve(orthogonal ? "Y" : "X")}`;
+    return (isMouse ? e : e.touches[0])[prop];
   }
-  function getCoord(e) {
-    return (isMouse ? e : e.touches[0])[resolve("pageX")];
+  function timeOf(e) {
+    return e.timeStamp;
   }
   function constrain(diff) {
-    return diff / (exceeded && isSlide ? FRICTION : 1);
+    return diff / (hasExceeded && isSlide ? FRICTION : 1);
+  }
+  function disable(value) {
+    disabled = value;
   }
   return {
-    mount
+    mount,
+    disable
   };
 }
 
@@ -2019,7 +2024,7 @@ function LazyLoad(Splide2, Components2, options) {
 
 function Pagination(Splide2, Components2, options) {
   const { on, emit, bind, unbind } = EventInterface(Splide2);
-  const { Slides } = Components2;
+  const { Slides, Elements } = Components2;
   const { go, toPage, hasFocus, getIndex } = Components2.Controller;
   const items = [];
   let list;
@@ -2049,8 +2054,7 @@ function Pagination(Splide2, Components2, options) {
   function createPagination() {
     const { length } = Splide2;
     const { classes, i18n, perPage } = options;
-    const { slider, root } = Components2.Elements;
-    const parent = options.pagination === "slider" && slider ? slider : root;
+    const parent = options.pagination === "slider" && Elements.slider || Elements.root;
     const max = hasFocus() ? length : ceil(length / perPage);
     list = create("ul", classes.pagination, parent);
     for (let i = 0; i < max; i++) {
@@ -2298,25 +2302,24 @@ const _Splide = class {
     merge(merge(this._options, DEFAULTS), options || {});
   }
   mount(Extensions, Transition) {
-    this.state.set(CREATED);
+    const { state, Components: Components2 } = this;
+    assert(state.is([CREATED, DESTROYED]), "Already mounted.");
+    state.set(CREATED);
+    this._Components = Components2;
     this._Transition = Transition || this._Transition || (this.is(FADE) ? Fade : Slide);
     this._Extensions = Extensions || this._Extensions;
     const Constructors = assign({}, ComponentConstructors, this._Extensions, { Transition: this._Transition });
-    const { Components: Components2 } = this;
     forOwn(Constructors, (Component, key) => {
-      const component = Component(this, this.Components, this._options);
+      const component = Component(this, Components2, this._options);
       Components2[key] = component;
       component.setup && component.setup();
     });
     forOwn(Components2, (component) => {
       component.mount && component.mount();
     });
-    forOwn(Components2, (component) => {
-      component.mounted && component.mounted();
-    });
     this.emit(EVENT_MOUNTED);
     addClass(this.root, CLASS_INITIALIZED);
-    this.state.set(IDLE);
+    state.set(IDLE);
     this.emit(EVENT_READY);
     return this;
   }
@@ -2326,7 +2329,7 @@ const _Splide = class {
     return this;
   }
   go(control) {
-    this.Components.Controller.go(control);
+    this._Components.Controller.go(control);
   }
   on(events, callback) {
     this.event.on(events, callback, null, DEFAULT_USER_EVENT_PRIORITY);
@@ -2341,11 +2344,11 @@ const _Splide = class {
     return this;
   }
   add(slides, index) {
-    this.Components.Slides.add(slides, index);
+    this._Components.Slides.add(slides, index);
     return this;
   }
   remove(matcher) {
-    this.Components.Slides.remove(matcher);
+    this._Components.Slides.remove(matcher);
     return this;
   }
   is(type) {
@@ -2360,7 +2363,7 @@ const _Splide = class {
     if (state.is(CREATED)) {
       event.on(EVENT_READY, this.destroy.bind(this, completely), this);
     } else {
-      forOwn(this.Components, (component) => {
+      forOwn(this._Components, (component) => {
         component.destroy && component.destroy(completely);
       });
       event.emit(EVENT_DESTROY);
@@ -2381,10 +2384,10 @@ const _Splide = class {
     }
   }
   get length() {
-    return this.Components.Slides.getLength(true);
+    return this._Components.Slides.getLength(true);
   }
   get index() {
-    return this.Components.Controller.getIndex();
+    return this._Components.Controller.getIndex();
   }
 };
 let Splide = _Splide;

dist/js/splide.js

@@ -987,8 +987,9 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }
 
     function updateVisibility(visible) {
-      setAttribute(slide, ARIA_HIDDEN, !visible || null);
-      setAttribute(slide, TAB_INDEX, visible && options.slideFocus ? 0 : null);
+      var ariaHidden = !visible && !isActive();
+      setAttribute(slide, ARIA_HIDDEN, ariaHidden || null);
+      setAttribute(slide, TAB_INDEX, !ariaHidden && options.slideFocus ? 0 : null);
 
       if (visible !== hasClass(slide, CLASS_VISIBLE)) {
         toggleClass(slide, CLASS_VISIBLE, visible);
@@ -1190,7 +1191,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     var resolve = Components2.Direction.resolve;
     var clones = [];
     var cloneCount;
-    var cloneIndex;
 
     function mount() {
       init();
@@ -1225,15 +1225,13 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       var length = slides.length;
 
       if (length) {
-        cloneIndex = 0;
-
         while (slides.length < count) {
           push(slides, slides);
         }
 
-        slides.slice(-count).concat(slides.slice(0, count)).forEach(function (Slide, index) {
+        push(slides.slice(-count), slides.slice(0, count)).forEach(function (Slide, index) {
           var isHead = index < count;
-          var clone = cloneDeep(Slide.slide);
+          var clone = cloneDeep(Slide.slide, index);
           isHead ? before(clone, slides[0].slide) : append(Elements.list, clone);
           push(clones, clone);
           Slides.register(clone, index - count + (isHead ? 0 : length), Slide.index);
@@ -1241,10 +1239,10 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       }
     }
 
-    function cloneDeep(elm) {
+    function cloneDeep(elm, index) {
       var clone = elm.cloneNode(true);
       addClass(clone, options.classes.clone);
-      clone.id = Splide2.root.id + "-clone" + pad(++cloneIndex);
+      clone.id = Splide2.root.id + "-clone" + pad(index + 1);
       return clone;
     }
 
@@ -1279,7 +1277,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     var ruleBy = Components2.Style.ruleBy;
     var resolve = Components2.Direction.resolve;
     var _Components2$Elements2 = Components2.Elements,
-        root = _Components2$Elements2.root,
         track = _Components2$Elements2.track,
         list = _Components2$Elements2.list;
     var getAt = Slides.getAt;
@@ -1293,7 +1290,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }
 
     function init() {
-      ruleBy(root, "maxWidth", unit(options.width));
+      ruleBy(Splide2.root, "maxWidth", unit(options.width));
       ruleBy(track, resolve("paddingLeft"), cssPadding(false));
       ruleBy(track, resolve("paddingRight"), cssPadding(true));
       Slides.rule(resolve("marginRight"), unit(options.gap));
@@ -1440,7 +1437,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
           translate(listSize() * positionRate);
         }
 
-        if (isExceededMax(currPosition)) {
+        if (exceededLimit(true)) {
           translate(getLimit(true));
         } else {
           snap(SNAP_THRESHOLD);
@@ -1500,8 +1497,8 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     function loop(position) {
       if (!looping && Splide2.is(LOOP)) {
         var diff = position - currPosition;
-        var exceededMin = isExceededMin(position);
-        var exceededMax = isExceededMax(position);
+        var exceededMin = exceededLimit(false, position);
+        var exceededMax = exceededLimit(true, position);
 
         if (exceededMin && diff > 0 || exceededMax && diff < 0) {
           position += orient(sliderSize() * (exceededMin ? 1 : -1));
@@ -1573,16 +1570,14 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       return !!(looping || waiting);
     }
 
-    function isExceededMin(position, offset2) {
-      return orient(position) + (offset2 || 0) < orient(getLimit(false));
-    }
-
-    function isExceededMax(position, offset2) {
-      return orient(position) + (offset2 || 0) > orient(getLimit(true));
-    }
+    function exceededLimit(max, position) {
+      if (position === void 0) {
+        position = currPosition;
+      }
 
-    function isExceeded() {
-      return isExceededMin(currPosition) || isExceededMax(currPosition);
+      var exceededMin = max !== true && orient(position) < orient(getLimit(false));
+      var exceededMax = max !== false && orient(position) > orient(getLimit(true));
+      return exceededMin || exceededMax;
     }
 
     return {
@@ -1596,9 +1591,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       getPosition: getPosition,
       getLimit: getLimit,
       isBusy: isBusy,
-      isExceededMin: isExceededMin,
-      isExceededMax: isExceededMax,
-      isExceeded: isExceeded
+      exceededLimit: exceededLimit
     };
   }
 
@@ -1683,7 +1676,8 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }
 
     function getAdjacent(prev, destination) {
-      var dest = computeDestIndex(currIndex + getPerMove() * (prev ? -1 : 1), currIndex);
+      var number = perMove || hasFocus() ? 1 : perPage;
+      var dest = computeDestIndex(currIndex + number * (prev ? -1 : 1), currIndex);
       return destination ? dest : loop(dest);
     }
 
@@ -1746,10 +1740,6 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       return index;
     }
 
-    function getPerMove() {
-      return perMove || hasFocus() ? 1 : perPage;
-    }
-
     function setIndex(index) {
       if (index !== currIndex) {
         prevIndex = currIndex;
@@ -2046,7 +2036,8 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
     var Move = Components2.Move;
     var getPosition = Move.getPosition,
-        getLimit = Move.getLimit;
+        getLimit = Move.getLimit,
+        exceededLimit = Move.exceededLimit;
     var interval;
 
     function mount() {
@@ -2065,11 +2056,11 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
         var diff = (target - getPosition()) * friction;
         Move.translate(position + diff);
 
-        if (Splide2.is(SLIDE) && !suppressConstraint && Move.isExceeded()) {
+        if (Splide2.is(SLIDE) && !suppressConstraint && exceededLimit()) {
           friction *= FRICTION_FACTOR;
 
           if (abs(diff) < BOUNCE_DIFF_THRESHOLD) {
-            bounce(Move.isExceededMin(getPosition()));
+            bounce(exceededLimit(false));
           }
         }
       }, 1);
@@ -2136,7 +2127,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
         resolve = _Components2$Directio2.resolve,
         orient = _Components2$Directio2.orient;
     var getPosition = Move.getPosition,
-        isExceeded = Move.isExceeded;
+        exceededLimit = Move.exceededLimit;
     var isSlide = Splide2.is(SLIDE);
     var isFade = Splide2.is(FADE);
     var basePosition;
@@ -2197,7 +2188,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
       if (isDragging) {
         var expired = timeOf(e) - timeOf(baseEvent) > LOG_INTERVAL;
-        var exceeded = hasExceeded !== (hasExceeded = isExceeded());
+        var exceeded = hasExceeded !== (hasExceeded = exceededLimit());
 
         if (expired || exceeded) {
           save(e);
@@ -2848,27 +2839,27 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     _proto.mount = function mount(Extensions, Transition) {
       var _this3 = this;
 
-      this.state.set(CREATED);
+      var state = this.state,
+          Components2 = this.Components;
+      assert(state.is([CREATED, DESTROYED]), "Already mounted.");
+      state.set(CREATED);
+      this._Components = Components2;
       this._Transition = Transition || this._Transition || (this.is(FADE) ? Fade : Slide);
       this._Extensions = Extensions || this._Extensions;
       var Constructors = assign({}, ComponentConstructors, this._Extensions, {
         Transition: this._Transition
       });
-      var Components2 = this.Components;
       forOwn(Constructors, function (Component, key) {
-        var component = Component(_this3, _this3.Components, _this3._options);
+        var component = Component(_this3, Components2, _this3._options);
         Components2[key] = component;
         component.setup && component.setup();
       });
       forOwn(Components2, function (component) {
         component.mount && component.mount();
       });
-      forOwn(Components2, function (component) {
-        component.mounted && component.mounted();
-      });
       this.emit(EVENT_MOUNTED);
       addClass(this.root, CLASS_INITIALIZED);
-      this.state.set(IDLE);
+      state.set(IDLE);
       this.emit(EVENT_READY);
       return this;
     };
@@ -2880,7 +2871,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     };
 
     _proto.go = function go(control) {
-      this.Components.Controller.go(control);
+      this._Components.Controller.go(control);
     };
 
     _proto.on = function on(events, callback) {
@@ -2906,12 +2897,14 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     };
 
     _proto.add = function add(slides, index) {
-      this.Components.Slides.add(slides, index);
+      this._Components.Slides.add(slides, index);
+
       return this;
     };
 
     _proto.remove = function remove(matcher) {
-      this.Components.Slides.remove(matcher);
+      this._Components.Slides.remove(matcher);
+
       return this;
     };
 
@@ -2931,7 +2924,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
       if (state.is(CREATED)) {
         event.on(EVENT_READY, this.destroy.bind(this, completely), this);
       } else {
-        forOwn(this.Components, function (component) {
+        forOwn(this._Components, function (component) {
           component.destroy && component.destroy(completely);
         });
         event.emit(EVENT_DESTROY);
@@ -2959,12 +2952,12 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }, {
       key: "length",
       get: function get() {
-        return this.Components.Slides.getLength(true);
+        return this._Components.Slides.getLength(true);
       }
     }, {
       key: "index",
       get: function get() {
-        return this.Components.Controller.getIndex();
+        return this._Components.Controller.getIndex();
       }
     }]);
 

dist/types/components/Arrows/Arrows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Arrows.d.ts","sourceRoot":"","sources":["Arrows.ts"],"names":[],"mappings":"AAWA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD,MAAM,EAAE;QAAE,IAAI,CAAC,EAAE,iBAAiB,CAAC;QAAC,IAAI,CAAC,EAAE,iBAAiB,CAAA;KAAE,CAAC;CAChE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,MAAM,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,eAAe,CA8IlG"}
+{"version":3,"file":"Arrows.d.ts","sourceRoot":"","sources":["Arrows.ts"],"names":[],"mappings":"AAWA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD,MAAM,EAAE;QAAE,IAAI,CAAC,EAAE,iBAAiB,CAAC;QAAC,IAAI,CAAC,EAAE,iBAAiB,CAAA;KAAE,CAAC;CAChE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,MAAM,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,eAAe,CA6IlG"}

dist/types/components/Autoplay/Autoplay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Autoplay.d.ts","sourceRoot":"","sources":["Autoplay.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIjE;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,aAAa;IACtD,IAAI,IAAI,IAAI,CAAC;IACb,KAAK,IAAI,IAAI,CAAC;IACd,QAAQ,IAAI,OAAO,CAAC;CACrB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,iBAAiB,CA2ItG"}
+{"version":3,"file":"Autoplay.d.ts","sourceRoot":"","sources":["Autoplay.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIjE;;;;GAIG;AACH,MAAM,WAAW,iBAAkB,SAAQ,aAAa;IACtD,IAAI,IAAI,IAAI,CAAC;IACb,KAAK,IAAI,IAAI,CAAC;IACd,QAAQ,IAAI,OAAO,CAAC;CACrB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,iBAAiB,CAgJtG"}

dist/types/components/Clones/Clones.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Clones.d.ts","sourceRoot":"","sources":["Clones.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIjE;;;;GAIG;AACH,MAAM,WAAW,cAAe,SAAQ,aAAa;CACpD;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,MAAM,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,cAAc,CA8HjG"}
+{"version":3,"file":"Clones.d.ts","sourceRoot":"","sources":["Clones.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIjE;;;;GAIG;AACH,MAAM,WAAW,cAAe,SAAQ,aAAa;CACpD;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,MAAM,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,cAAc,CA4HjG"}

dist/types/components/Controller/Controller.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Controller.d.ts","sourceRoot":"","sources":["Controller.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIjE;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,aAAa;IACxD,EAAE,CAAE,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,cAAc,CAAC,EAAE,OAAO,GAAI,IAAI,CAAC;IAC/D,OAAO,CAAE,WAAW,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACzC,OAAO,CAAE,WAAW,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACzC,MAAM,IAAI,MAAM,CAAC;IACjB,QAAQ,CAAE,KAAK,EAAE,MAAM,GAAI,IAAI,CAAC;IAChC,QAAQ,CAAE,IAAI,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACnC,OAAO,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM,CAAC;IAChC,MAAM,CAAE,KAAK,EAAE,MAAM,GAAI,MAAM,CAAC;IAChC,QAAQ,IAAI,OAAO,CAAC;CACrB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,mBAAmB,CAuS1G"}
+{"version":3,"file":"Controller.d.ts","sourceRoot":"","sources":["Controller.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIjE;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,aAAa;IACxD,EAAE,CAAE,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,cAAc,CAAC,EAAE,OAAO,GAAI,IAAI,CAAC;IAC/D,OAAO,CAAE,WAAW,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACzC,OAAO,CAAE,WAAW,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACzC,MAAM,IAAI,MAAM,CAAC;IACjB,QAAQ,CAAE,KAAK,EAAE,MAAM,GAAI,IAAI,CAAC;IAChC,QAAQ,CAAE,IAAI,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACnC,OAAO,CAAE,IAAI,EAAE,MAAM,GAAI,MAAM,CAAC;IAChC,MAAM,CAAE,KAAK,EAAE,MAAM,GAAI,MAAM,CAAC;IAChC,QAAQ,IAAI,OAAO,CAAC;CACrB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,mBAAmB,CA+R1G"}

dist/types/components/Direction/Direction.d.ts

@@ -25,7 +25,7 @@ export declare const ORIENTATION_MAP: {
     right: string[];
     x: string[];
     X: string[];
-    pageX: string[];
+    Y: string[];
     ArrowLeft: string[];
     ArrowRight: string[];
 };

dist/types/components/Drag/Drag.d.ts

@@ -6,6 +6,7 @@ import { BaseComponent, Components, Options } from '../../types';
  * @since 3.0.0
  */
 export interface DragComponent extends BaseComponent {
+    disable(disabled: boolean): void;
 }
 /**
  * The component for dragging the slider.

dist/types/components/Drag/Drag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Drag.d.ts","sourceRoot":"","sources":["Drag.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,aAAa;CACnD;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,IAAI,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,aAAa,CA+Q9F"}
+{"version":3,"file":"Drag.d.ts","sourceRoot":"","sources":["Drag.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,OAAO,CAAE,QAAQ,EAAE,OAAO,GAAI,IAAI,CAAA;CACnC;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,IAAI,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,aAAa,CAyT9F"}

dist/types/components/Drag/constants.d.ts

@@ -9,7 +9,7 @@ export declare const FRICTION = 5;
  *
  * @since 3.0.0
  */
-export declare const SAMPLING_INTERVAL = 50;
+export declare const LOG_INTERVAL = 50;
 /**
  * Start events for dragging.
  *

dist/types/components/Drag/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["constants.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,QAAQ,IAAI,CAAC;AAE1B;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,KAAK,CAAC;AAEpC;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,yBAAyB,CAAC;AAE1D;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,wBAAwB,CAAC;AAEzD;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,4CAA4C,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["constants.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,QAAQ,IAAI,CAAC;AAE1B;;;;GAIG;AACH,eAAO,MAAM,YAAY,KAAK,CAAC;AAE/B;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,yBAAyB,CAAC;AAE1D;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,wBAAwB,CAAC;AAEzD;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,4CAA4C,CAAC"}

dist/types/components/Move/Move.d.ts

@@ -15,9 +15,7 @@ export interface MoveComponent extends BaseComponent {
     getPosition(): number;
     getLimit(max: boolean): number;
     isBusy(): boolean;
-    isExceeded(): boolean;
-    isExceededMin(position: number, offset?: number): boolean;
-    isExceededMax(position: number, offset?: number): boolean;
+    exceededLimit(max?: boolean | undefined, position?: number): boolean;
 }
 /**
  * The component for moving the slider.

dist/types/components/Move/Move.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Move.d.ts","sourceRoot":"","sources":["Move.ts"],"names":[],"mappings":"AAYA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,IAAI,CAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAI,IAAI,CAAC;IACxD,IAAI,CAAE,KAAK,EAAE,MAAM,GAAI,IAAI,CAAC;IAC5B,SAAS,CAAE,QAAQ,EAAE,MAAM,GAAI,IAAI,CAAC;IACpC,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,CAAE,QAAQ,EAAE,MAAM,GAAI,MAAM,CAAC;IACpC,UAAU,CAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACxD,WAAW,IAAI,MAAM,CAAC;IACtB,QAAQ,CAAE,GAAG,EAAE,OAAO,GAAI,MAAM,CAAC;IACjC,MAAM,IAAI,OAAO,CAAC;IAClB,UAAU,IAAI,OAAO,CAAC;IACtB,aAAa,CAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAI,OAAO,CAAC;IAC5D,aAAa,CAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAI,OAAO,CAAC;CAC7D;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,IAAI,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,aAAa,CAwT9F"}
+{"version":3,"file":"Move.d.ts","sourceRoot":"","sources":["Move.ts"],"names":[],"mappings":"AAYA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,aAAa;IAClD,IAAI,CAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAI,IAAI,CAAC;IACxD,IAAI,CAAE,KAAK,EAAE,MAAM,GAAI,IAAI,CAAC;IAC5B,SAAS,CAAE,QAAQ,EAAE,MAAM,GAAI,IAAI,CAAC;IACpC,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,CAAE,QAAQ,EAAE,MAAM,GAAI,MAAM,CAAC;IACpC,UAAU,CAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,GAAI,MAAM,CAAC;IACxD,WAAW,IAAI,MAAM,CAAC;IACtB,QAAQ,CAAE,GAAG,EAAE,OAAO,GAAI,MAAM,CAAC;IACjC,MAAM,IAAI,OAAO,CAAC;IAClB,aAAa,CAAE,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAI,OAAO,CAAC;CACxE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,IAAI,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,aAAa,CAqU9F"}

dist/types/components/Pagination/Pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["Pagination.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,aAAa;IACxD,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,CAAE,KAAK,EAAE,MAAM,GAAI,cAAc,CAAC;CACxC;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,aAAa,CAAC;IAClB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,mBAAmB,CAmH1G"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["Pagination.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAKjE;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,aAAa;IACxD,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,KAAK,CAAE,KAAK,EAAE,MAAM,GAAI,cAAc,CAAC;CACxC;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,aAAa,CAAC;IAClB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAI,mBAAmB,CAkH1G"}

dist/types/components/Slides/Slide.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Slide.d.ts","sourceRoot":"","sources":["Slide.ts"],"names":[],"mappings":"AAiCA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAmB5C;;;;GAIG;AACH,MAAM,WAAY,cAAe,SAAQ,aAAa;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,WAAW,CAAC;IACnB,SAAS,EAAE,WAAW,CAAC;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,YAAY,CAAC,EAAE,OAAO,GAAI,IAAI,CAAA;IAC1E,QAAQ,CAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAI,OAAO,CAAC;CACrD;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,GAAI,cAAc,CAqM7G"}
+{"version":3,"file":"Slide.d.ts","sourceRoot":"","sources":["Slide.ts"],"names":[],"mappings":"AAiCA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAmB5C;;;;GAIG;AACH,MAAM,WAAY,cAAe,SAAQ,aAAa;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,WAAW,CAAC;IACnB,SAAS,EAAE,WAAW,CAAC;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,YAAY,CAAC,EAAE,OAAO,GAAI,IAAI,CAAA;IAC1E,QAAQ,CAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAI,OAAO,CAAC;CACrD;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,GAAI,cAAc,CAuM7G"}

dist/types/core/Splide/Splide.d.ts

@@ -45,6 +45,10 @@ export declare class Splide {
      * The collection of options.
      */
     private readonly _options;
+    /**
+     * The collection of all components.
+     */
+    private _Components;
     /**
      * The collection of extensions.
      */

dist/types/core/Splide/Splide.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Splide.d.ts","sourceRoot":"","sources":["Splide.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAO9D,OAAO,EAAY,gBAAgB,EAAE,cAAc,EAAS,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEpG,OAAO,EAAE,oBAAoB,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIxE;;;;GAIG;AACH,qBAAa,MAAM;IACjB;;OAEG;IACH,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAM;IAE9B;;OAEG;IACH,MAAM,CAAC,QAAQ,CAAC,MAAM;;;;;;MAAU;IAEhC;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,WAAW,CAAC;IAE3B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,cAAc,CAAc;IAE5C;;OAEG;IACH,QAAQ,CAAC,UAAU,EAAE,UAAU,CAAoB;IAEnD;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAoB;IAE/C;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,MAAM,EAAE,CAAM;IAEhC;;OAEG;IACH,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAe;IAExC;;OAEG;IACH,OAAO,CAAC,WAAW,CAA4C;IAE/D;;OAEG;IACH,OAAO,CAAC,WAAW,CAAuB;IAE1C;;;;;OAKG;gBACU,MAAM,EAAE,MAAM,GAAG,WAAW,EAAE,OAAO,CAAC,EAAE,OAAO;IAU5D;;;;;;;OAOG;IACH,KAAK,CAAE,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,GAAI,IAAI;IAkCnG;;;;;;;;;;;;;;;;;OAiBG;IACH,IAAI,CAAE,MAAM,EAAE,MAAM,GAAI,IAAI;IAM5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAiCG;IACH,EAAE,CAAE,OAAO,EAAE,MAAM,GAAG,MAAM,GAAI,IAAI;IAIpC;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,EAAE,CAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,gBAAgB,GAAI,IAAI;IAKtD;;;;;;;;;;;;;;;;;;OAkBG;IACH,GAAG,CAAE,MAAM,EAAE,MAAM,GAAI,IAAI;IAK3B;;;;;;;OAOG;IACH,IAAI,CAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,GAAI,IAAI;IAK3C;;;;;;;;;;;;;;;;;;;OAmBG;IACH,GAAG,CAAE,MAAM,EAAE,MAAM,GAAG,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,GAAI,IAAI;IAKvF;;;;;OAKG;IACH,MAAM,CAAE,OAAO,EAAE,YAAY,GAAI,IAAI;IAKrC;;;;;;OAMG;IACH,EAAE,CAAE,IAAI,EAAE,MAAM,GAAI,OAAO;IAI3B;;;;OAIG;IACH,OAAO,IAAI,IAAI;IAKf;;;;;;OAMG;IACH,OAAO,CAAE,UAAU,CAAC,EAAE,OAAO,GAAI,IAAI;IAoBrC;;;;OAIG;IACH,IAAI,OAAO,IAAI,OAAO,CAErB;IAED;;;;OAIG;IACH,IAAI,OAAO,CAAE,OAAO,EAAE,OAAO,EAO5B;IAED;;;;OAIG;IACH,IAAI,MAAM,IAAI,MAAM,CAEnB;IAED;;;;OAIG;IACH,IAAI,KAAK,IAAI,MAAM,CAElB;CACF"}
+{"version":3,"file":"Splide.d.ts","sourceRoot":"","sources":["Splide.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAO9D,OAAO,EAAY,gBAAgB,EAAE,cAAc,EAAS,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEpG,OAAO,EAAE,oBAAoB,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAIxE;;;;GAIG;AACH,qBAAa,MAAM;IACjB;;OAEG;IACH,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAM;IAE9B;;OAEG;IACH,MAAM,CAAC,QAAQ,CAAC,MAAM;;;;;;MAAU;IAEhC;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,WAAW,CAAC;IAE3B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,cAAc,CAAc;IAE5C;;OAEG;IACH,QAAQ,CAAC,UAAU,EAAE,UAAU,CAAoB;IAEnD;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAoB;IAE/C;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,MAAM,EAAE,CAAM;IAEhC;;OAEG;IACH,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAe;IAExC;;OAEG;IACH,OAAO,CAAC,WAAW,CAAa;IAEhC;;OAEG;IACH,OAAO,CAAC,WAAW,CAA4C;IAE/D;;OAEG;IACH,OAAO,CAAC,WAAW,CAAuB;IAE1C;;;;;OAKG;gBACU,MAAM,EAAE,MAAM,GAAG,WAAW,EAAE,OAAO,CAAC,EAAE,OAAO;IAU5D;;;;;;;OAOG;IACH,KAAK,CAAE,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,CAAC,EAAE,UAAU,CAAC,EAAE,oBAAoB,GAAI,IAAI;IAgCnG;;;;;;;;;;;;;;;;;OAiBG;IACH,IAAI,CAAE,MAAM,EAAE,MAAM,GAAI,IAAI;IAM5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAiCG;IACH,EAAE,CAAE,OAAO,EAAE,MAAM,GAAG,MAAM,GAAI,IAAI;IAIpC;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,EAAE,CAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,gBAAgB,GAAI,IAAI;IAKtD;;;;;;;;;;;;;;;;;;OAkBG;IACH,GAAG,CAAE,MAAM,EAAE,MAAM,GAAI,IAAI;IAK3B;;;;;;;OAOG;IACH,IAAI,CAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,GAAI,IAAI;IAK3C;;;;;;;;;;;;;;;;;;;OAmBG;IACH,GAAG,CAAE,MAAM,EAAE,MAAM,GAAG,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,WAAW,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,GAAI,IAAI;IAKvF;;;;;OAKG;IACH,MAAM,CAAE,OAAO,EAAE,YAAY,GAAI,IAAI;IAKrC;;;;;;OAMG;IACH,EAAE,CAAE,IAAI,EAAE,MAAM,GAAI,OAAO;IAI3B;;;;OAIG;IACH,OAAO,IAAI,IAAI;IAKf;;;;;;OAMG;IACH,OAAO,CAAE,UAAU,CAAC,EAAE,OAAO,GAAI,IAAI;IAoBrC;;;;OAIG;IACH,IAAI,OAAO,IAAI,OAAO,CAErB;IAED;;;;OAIG;IACH,IAAI,OAAO,CAAE,OAAO,EAAE,OAAO,EAO5B;IAED;;;;OAIG;IACH,IAAI,MAAM,IAAI,MAAM,CAEnB;IAED;;;;OAIG;IACH,IAAI,KAAK,IAAI,MAAM,CAElB;CACF"}

dist/types/types/general.d.ts

@@ -21,7 +21,6 @@ export declare type ComponentConstructor = (Splide: Splide, Components: Componen
 export interface BaseComponent {
     setup?(): void;
     mount?(): void;
-    mounted?(): void;
     destroy?(completely?: boolean): void;
 }
 /**

dist/types/types/general.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"general.d.ts","sourceRoot":"","sources":["general.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC;;;;GAIG;AACH,oBAAY,WAAW,GAAG,CAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAM,GAAG,CAAC;AAEpD;;;;GAIG;AACH,oBAAY,oBAAoB,GAAG,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,KAAM,aAAa,CAAC;AAEjH;;;;GAIG;AACH,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,IAAI,IAAI,CAAC;IACf,KAAK,CAAC,IAAI,IAAI,CAAC;IACf,OAAO,CAAC,IAAI,IAAI,CAAC;IACjB,OAAO,CAAC,CAAE,UAAU,CAAC,EAAE,OAAO,GAAI,IAAI,CAAC;CACxC;AAED;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,aAAa;IACxD,KAAK,CAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,IAAI,GAAI,IAAI,CAAC;IAC/C,MAAM,IAAI,IAAI,CAAC;CAChB;AAED;;;;GAIG;AACH,oBAAY,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,GAClD,OAAO,CAAC;KACN,CAAC,IAAI,MAAM,OAAO,cAAc,GAAI,UAAU,CAAC,OAAO,cAAc,CAAE,CAAC,CAAE,CAAC;CAC7E,CAAC,GACA;IAAE,UAAU,EAAE,mBAAmB,CAAA;CAAE,CAAA"}
+{"version":3,"file":"general.d.ts","sourceRoot":"","sources":["general.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC;;;;GAIG;AACH,oBAAY,WAAW,GAAG,CAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAM,GAAG,CAAC;AAEpD;;;;GAIG;AACH,oBAAY,oBAAoB,GAAG,CAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,KAAM,aAAa,CAAC;AAEjH;;;;GAIG;AACH,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,IAAI,IAAI,CAAC;IACf,KAAK,CAAC,IAAI,IAAI,CAAC;IACf,OAAO,CAAC,CAAE,UAAU,CAAC,EAAE,OAAO,GAAI,IAAI,CAAC;CACxC;AAED;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,aAAa;IACxD,KAAK,CAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,IAAI,GAAI,IAAI,CAAC;IAC/C,MAAM,IAAI,IAAI,CAAC;CAChB;AAED;;;;GAIG;AACH,oBAAY,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,GAClD,OAAO,CAAC;KACN,CAAC,IAAI,MAAM,OAAO,cAAc,GAAI,UAAU,CAAC,OAAO,cAAc,CAAE,CAAC,CAAE,CAAC;CAC7E,CAAC,GACA;IAAE,UAAU,EAAE,mBAAmB,CAAA;CAAE,CAAA"}

package.json

@@ -59,6 +59,7 @@
     "build:types": "tsc --emitDeclarationOnly",
     "build:css": "node scripts/build-css.js",
     "build:all": "npm run build:js && npm run build:module && npm run build:css && npm run build:types",
+    "check:types": "tsc --noEmit",
     "jest": "jest --clearCache && jest",
     "eslint": "eslint src",
     "stylelint": "npx stylelint --fix ./src/css/**/*.scss"

scripts/build-script.js

@@ -10,10 +10,10 @@ const zlib     = require( 'zlib' );
 const name     = 'splide';
 
 
-function buildScript( compress ) {
+async function buildScript( compress ) {
   const file = `./dist/js/${ name }${ compress ? '.min' : '' }.js`;
 
-  return rollup( {
+  const bundle = await rollup( {
     input: './src/js/build/default.ts',
     plugins: [
       resolve(),
@@ -24,31 +24,29 @@ function buildScript( compress ) {
       } ),
       compress ? minify() : false,
     ]
-  } ).then( bundle => {
-    return bundle.write( {
-      banner,
-      file,
-      format   : 'umd',
-      name     : 'Splide',
-      sourcemap: ! compress,
-    } );
-  } ).then( () => {
-    if ( compress ) {
-      return fs.readFile( file ).then( content => {
-        return new Promise( ( resolve, reject ) => {
-          zlib.gzip( content, ( err, binary ) => {
-            if ( err ) {
-              return reject( err );
-            }
-
-            fs.writeFile( `${ file }.gz`, binary ).then( resolve, reject );
-          } );
+  } );
+
+  await bundle.write( {
+    banner,
+    file,
+    format   : 'umd',
+    name     : 'Splide',
+    sourcemap: ! compress,
+  } );
+
+  if ( compress ) {
+    await fs.readFile( file ).then( content => {
+      return new Promise( ( resolve, reject ) => {
+        zlib.gzip( content, ( err, binary ) => {
+          if ( err ) {
+            return reject( err );
+          }
+
+          fs.writeFile( `${ file }.gz`, binary ).then( resolve, reject );
         } );
       } );
-    }
-  } ).catch( e => {
-    console.error( e );
-  } );
+    } );
+  }
 }
 
 Promise.all( [ buildScript(), buildScript( true ) ] ).catch( e => console.error( e ) );

src/js/components/Clones/Clones.ts

@@ -29,17 +29,16 @@ export function Clones( Splide: Splide, Components: Components, options: Options
   const { on, emit } = EventInterface( Splide );
   const { Elements, Slides } = Components;
   const { resolve } = Components.Direction;
-  const clones: HTMLElement[] = [];
 
   /**
-   * Keeps the current number of clones.
+   * Stores all cloned elements.
    */
-  let cloneCount: number;
+  const clones: HTMLElement[] = [];
 
   /**
-   * The index used for generating IDs.
+   * Keeps the current number of clones.
    */
-  let cloneIndex: number;
+  let cloneCount: number;
 
   /**
    * Called when the component is mounted.
@@ -95,15 +94,13 @@ export function Clones( Splide: Splide, Components: Components, options: Options
     const { length } = slides;
 
     if ( length ) {
-      cloneIndex = 0;
-
       while ( slides.length < count ) {
         push( slides, slides );
       }
 
-      slides.slice( -count ).concat( slides.slice( 0, count ) ).forEach( ( Slide, index ) => {
+      push( slides.slice( -count ), slides.slice( 0, count ) ).forEach( ( Slide, index ) => {
         const isHead = index < count;
-        const clone  = cloneDeep( Slide.slide );
+        const clone  = cloneDeep( Slide.slide, index );
         isHead ? before( clone, slides[ 0 ].slide ) : append( Elements.list, clone );
         push( clones, clone );
         Slides.register( clone, index - count + ( isHead ? 0 : length ), Slide.index );
@@ -114,14 +111,15 @@ export function Clones( Splide: Splide, Components: Components, options: Options
   /**
    * Deeply clones the provided element with removing the ID attribute.
    *
-   * @param elm - An element to clone.
+   * @param elm   - An element to clone.
+   * @param index - An index of the clone.
    *
    * @return A cloned element.
    */
-  function cloneDeep( elm: HTMLElement ): HTMLElement {
+  function cloneDeep( elm: HTMLElement, index: number ): HTMLElement {
     const clone = elm.cloneNode( true ) as HTMLElement;
     addClass( clone, options.classes.clone );
-    clone.id = `${ Splide.root.id }-clone${ pad( ++cloneIndex ) }`;
+    clone.id = `${ Splide.root.id }-clone${ pad( index + 1 ) }`;
     return clone;
   }
 

src/js/components/Controller/Controller.ts

@@ -174,7 +174,8 @@ export function Controller( Splide: Splide, Components: Components, options: Opt
    * @return An adjacent index if available, or otherwise `-1`.
    */
   function getAdjacent( prev: boolean, destination?: boolean ): number {
-    const dest = computeDestIndex( currIndex + getPerMove() * ( prev ? -1 : 1 ), currIndex );
+    const number = perMove || hasFocus() ? 1 : perPage;
+    const dest   = computeDestIndex( currIndex + number * ( prev ? -1 : 1 ), currIndex );
     return destination ? dest : loop( dest );
   }
 
@@ -278,15 +279,6 @@ export function Controller( Splide: Splide, Components: Components, options: Opt
     return index;
   }
 
-  /**
-   * Returns the number of slides to move for '>' and '<'.
-   *
-   * @return The number of slides to move.
-   */
-  function getPerMove(): number {
-    return perMove || hasFocus() ? 1 : perPage;
-  }
-
   /**
    * Sets a new index and retains old one.
    *

src/js/components/Drag/Drag.ts

@@ -32,7 +32,7 @@ export function Drag( Splide: Splide, Components: Components, options: Options )
   const { Move, Scroll, Controller } = Components;
   const { track } = Components.Elements;
   const { resolve, orient } = Components.Direction;
-  const { getPosition, isExceeded } = Move;
+  const { getPosition, exceededLimit } = Move;
   const isSlide = Splide.is( SLIDE );
   const isFade  = Splide.is( FADE );
 
@@ -154,7 +154,7 @@ export function Drag( Splide: Splide, Components: Components, options: Options )
 
     if ( isDragging ) {
       const expired  = timeOf( e ) - timeOf( baseEvent ) > LOG_INTERVAL;
-      const exceeded = hasExceeded !== ( hasExceeded = isExceeded() );
+      const exceeded = hasExceeded !== ( hasExceeded = exceededLimit() );
 
       if ( expired || exceeded ) {
         save( e );

src/js/components/Layout/Layout.ts

@@ -35,7 +35,7 @@ export function Layout( Splide: Splide, Components: Components, options: Options
   const { Slides } = Components;
   const { ruleBy } = Components.Style;
   const { resolve } = Components.Direction;
-  const { root, track, list } = Components.Elements;
+  const { track, list } = Components.Elements;
   const { getAt } = Slides;
   const vertical = options.direction === TTB;
 
@@ -55,7 +55,7 @@ export function Layout( Splide: Splide, Components: Components, options: Options
    * Uses `max-width` for the root to prevent the slider from exceeding the parent element.
    */
   function init(): void {
-    ruleBy( root, 'maxWidth', unit( options.width ) );
+    ruleBy( Splide.root, 'maxWidth', unit( options.width ) );
     ruleBy( track, resolve( 'paddingLeft' ), cssPadding( false ) );
     ruleBy( track, resolve( 'paddingRight' ), cssPadding( true ) );
 

src/js/components/Move/Move.ts

@@ -31,9 +31,7 @@ export interface MoveComponent extends BaseComponent {
   getPosition(): number;
   getLimit( max: boolean ): number;
   isBusy(): boolean;
-  isExceeded(): boolean;
-  isExceededMin( position: number, offset?: number ): boolean;
-  isExceededMax( position: number, offset?: number ): boolean;
+  exceededLimit( max?: boolean | undefined, position?: number ): boolean;
 }
 
 /**
@@ -92,7 +90,7 @@ export function Move( Splide: Splide, Components: Components, options: Options )
         translate( listSize() * positionRate );
       }
 
-      if ( isExceededMax( currPosition ) ) {
+      if ( exceededLimit( true ) ) {
         translate( getLimit( true ) );
       } else {
         snap( SNAP_THRESHOLD );
@@ -190,8 +188,8 @@ export function Move( Splide: Splide, Components: Components, options: Options )
   function loop( position: number ): number {
     if ( ! looping && Splide.is( LOOP ) ) {
       const diff        = position - currPosition;
-      const exceededMin = isExceededMin( position );
-      const exceededMax = isExceededMax( position );
+      const exceededMin = exceededLimit( false, position );
+      const exceededMax = exceededLimit( true, position );
 
       if ( ( exceededMin && diff > 0 ) || ( exceededMax && diff < 0 ) ) {
         position += orient( sliderSize() * ( exceededMin ? 1 : -1 ) );
@@ -312,37 +310,49 @@ export function Move( Splide: Splide, Components: Components, options: Options )
   }
 
   /**
-   * Checks if the provided position exceeds the minimum limit or not.
+   * Checks if the provided position exceeds the minimum or maximum limit or not.
    *
-   * @param position - A position to test.
-   * @param offset   - Optional. Offsets the limit in pixel.
+   * @param max      - Optional. `true` for testing max, `false` for min, and `undefined` for both.
+   * @param position - Optional. A position to test. If omitted, tests the current position.
    *
    * @return `true` if the position exceeds the limit, or otherwise `false`.
    */
-  function isExceededMin( position: number, offset?: number ): boolean {
-    return orient( position ) + ( offset || 0 ) < orient( getLimit( false ) );
+  function exceededLimit( max?: boolean | undefined, position = currPosition ): boolean {
+    const exceededMin = max !== true && orient( position ) < orient( getLimit( false ) );
+    const exceededMax = max !== false && orient( position ) > orient( getLimit( true ) );
+    return exceededMin || exceededMax;
   }
 
-  /**
-   * Checks if the provided position exceeds the maximum limit or not.
-   *
-   * @param position - A position to test.
-   * @param offset   - Optional. Offsets the limit in pixel.
-   *
-   * @return `true` if the position exceeds the limit, or otherwise `false`.
-   */
-  function isExceededMax( position: number, offset?: number ): boolean {
-    return orient( position ) + ( offset || 0 ) > orient( getLimit( true ) );
-  }
-
-  /**
-   * Checks if the slider position exceeds borders or not.
-   *
-   * @return `true` if the position is over borders, or otherwise `false`.
-   */
-  function isExceeded(): boolean {
-    return isExceededMin( currPosition ) || isExceededMax( currPosition );
-  }
+  // /**
+  //  * Checks if the provided position exceeds the minimum limit or not.
+  //  *
+  //  * @param position - A position to test.
+  //  *
+  //  * @return `true` if the position exceeds the limit, or otherwise `false`.
+  //  */
+  // function isExceededMin( position: number ): boolean {
+  //   return orient( position ) < orient( getLimit( false ) );
+  // }
+  //
+  // /**
+  //  * Checks if the provided position exceeds the maximum limit or not.
+  //  *
+  //  * @param position - A position to test.
+  //  *
+  //  * @return `true` if the position exceeds the limit, or otherwise `false`.
+  //  */
+  // function isExceededMax( position: number ): boolean {
+  //   return orient( position ) > orient( getLimit( true ) );
+  // }
+  //
+  // /**
+  //  * Checks if the slider position exceeds borders or not.
+  //  *
+  //  * @return `true` if the position is over borders, or otherwise `false`.
+  //  */
+  // function isExceeded(): boolean {
+  //   return isExceededMin( currPosition ) || isExceededMax( currPosition );
+  // }
 
   return {
     mount,
@@ -355,8 +365,9 @@ export function Move( Splide: Splide, Components: Components, options: Options )
     getPosition,
     getLimit,
     isBusy,
-    isExceededMin,
-    isExceededMax,
-    isExceeded,
+    exceededLimit,
+    // isExceededMin,
+    // isExceededMax,
+    // isExceeded,
   };
 }

src/js/components/Move/test/general.test.ts

@@ -91,15 +91,35 @@ describe( 'Move', () => {
   } );
 
   test( 'can check the position exceeds bounds or not.', () => {
-    const splide    = init( { width: 200, height: 100 } );
-    const totalSize = 200 * splide.length;
+    const width     = 200;
+    const splide    = init( { width, height: 100 } );
+    const totalSize = width * splide.length;
+    const { Move }  = splide.Components;
+
+    expect( Move.exceededLimit( false, -10 ) ).toBe( false );
+    expect( Move.exceededLimit( false, 10 ) ).toBe( true );
+
+    expect( Move.exceededLimit( true, - ( totalSize - width ) + 10 ) ).toBe( false );
+    expect( Move.exceededLimit( true, - ( totalSize - width ) - 10 ) ).toBe( true );
+
+    Move.translate( 10 );
+
+    expect( Move.exceededLimit() ).toBe( true );
+
+    splide.destroy();
+  } );
+
+  test( 'can loop the slider when the position exceeds bounds.', () => {
+    const width     = 200;
+    const splide    = init( { type: 'loop', width, height: 100 } );
+    const totalSize = width * splide.length;
     const { Move }  = splide.Components;
 
-    expect( Move.isExceededMin( -10 ) ).toBe( false );
-    expect( Move.isExceededMin( 10 ) ).toBe( true );
+    Move.translate( 10 );
+    expect( Move.getPosition() ).toBe( - ( totalSize - 10 ) );
 
-    expect( Move.isExceededMax( - ( totalSize - 200 ) + 10 ) ).toBe( false );
-    expect( Move.isExceededMax( - ( totalSize - 200 ) - 10 ) ).toBe( true );
+    Move.translate( - totalSize - 10 );
+    expect( Move.getPosition() ).toBe( -10 );
 
     splide.destroy();
   } );

src/js/components/Scroll/Scroll.ts

@@ -31,7 +31,7 @@ export interface ScrollComponent extends BaseComponent {
 export function Scroll( Splide: Splide, Components: Components, options: Options ): ScrollComponent {
   const { on, emit } = EventInterface( Splide );
   const { Move } = Components;
-  const { getPosition, getLimit } = Move;
+  const { getPosition, getLimit, exceededLimit } = Move;
 
   /**
    * Retains the active RequestInterval object.
@@ -67,11 +67,11 @@ export function Scroll( Splide: Splide, Components: Components, options: Options
 
       Move.translate( position + diff );
 
-      if ( Splide.is( SLIDE ) && ! suppressConstraint && Move.isExceeded() ) {
+      if ( Splide.is( SLIDE ) && ! suppressConstraint && exceededLimit() ) {
         friction *= FRICTION_FACTOR;
 
         if ( abs( diff ) < BOUNCE_DIFF_THRESHOLD ) {
-          bounce( Move.isExceededMin( getPosition() ) );
+          bounce( exceededLimit( false ) );
         }
       }
     }, 1 );

src/js/components/Slides/Slide.ts

@@ -197,8 +197,10 @@ export function Slide( Splide: Splide, index: number, slideIndex: number, slide:
    * @param visible - Set `true` if the slide is visible.
    */
   function updateVisibility( this: SlideComponent, visible: boolean ): void {
-    setAttribute( slide, ARIA_HIDDEN, ! visible || null );
-    setAttribute( slide, TAB_INDEX, visible && options.slideFocus ? 0 : null );
+    const ariaHidden = ! visible && ! isActive();
+
+    setAttribute( slide, ARIA_HIDDEN, ariaHidden || null );
+    setAttribute( slide, TAB_INDEX, ! ariaHidden && options.slideFocus ? 0 : null );
 
     if ( visible !== hasClass( slide, CLASS_VISIBLE ) ) {
       toggleClass( slide, CLASS_VISIBLE, visible );

src/js/components/Slides/test/slide.test.ts

@@ -248,9 +248,9 @@ describe( 'Slide', () => {
             expect( Slide.index ).toBe( 1 );
             callback();
           } );
-        }
-      }
-    }
+        },
+      };
+    };
 
     splide.mount( { component } );
     expect( callback ).toHaveBeenCalled();

src/js/core/Splide/Splide.ts

@@ -58,6 +58,11 @@ export class Splide {
    */
   private readonly _options: Options = {};
 
+  /**
+   * The collection of all components.
+   */
+  private _Components: Components;
+
   /**
    * The collection of extensions.
    */
@@ -93,16 +98,19 @@ export class Splide {
    * @return `this`
    */
   mount( Extensions?: Record<string, ComponentConstructor>, Transition?: ComponentConstructor ): this {
-    this.state.set( CREATED );
+    const { state, Components } = this;
+    assert( state.is( [ CREATED, DESTROYED ] ), 'Already mounted.' );
+
+    state.set( CREATED );
 
+    this._Components = Components;
     this._Transition = Transition || this._Transition || ( this.is( FADE ) ? Fade : Slide );
     this._Extensions = Extensions || this._Extensions;
 
     const Constructors = assign( {}, ComponentConstructors, this._Extensions, { Transition: this._Transition } );
-    const { Components } = this;
 
     forOwn( Constructors, ( Component, key ) => {
-      const component = Component( this, this.Components, this._options );
+      const component = Component( this, Components, this._options );
       Components[ key ] = component;
       component.setup && component.setup();
     } );
@@ -111,16 +119,11 @@ export class Splide {
       component.mount && component.mount();
     } );
 
-    // todo unnecessary anymore
-    forOwn( Components, component => {
-      component.mounted && component.mounted();
-    } );
-
     this.emit( EVENT_MOUNTED );
 
     addClass( this.root, CLASS_INITIALIZED );
 
-    this.state.set( IDLE );
+    state.set( IDLE );
     this.emit( EVENT_READY );
 
     return this;
@@ -185,7 +188,7 @@ export class Splide {
    * @param control
    */
   go( control: number | string ): void {
-    this.Components.Controller.go( control );
+    this._Components.Controller.go( control );
   }
 
   /**
@@ -273,7 +276,7 @@ export class Splide {
    * @return `this`
    */
   add( slides: string | HTMLElement | Array<string | HTMLElement>, index?: number ): this {
-    this.Components.Slides.add( slides, index );
+    this._Components.Slides.add( slides, index );
     return this;
   }
 
@@ -284,7 +287,7 @@ export class Splide {
    * @param matcher - An index, an array with indices, a selector string, or an iteratee function.
    */
   remove( matcher: SlideMatcher ): this {
-    this.Components.Slides.remove( matcher );
+    this._Components.Slides.remove( matcher );
     return this;
   }
 
@@ -323,7 +326,7 @@ export class Splide {
       // Postpones destruction requested before the slider becomes ready.
       event.on( EVENT_READY, this.destroy.bind( this, completely ), this );
     } else {
-      forOwn( this.Components, component => {
+      forOwn( this._Components, component => {
         component.destroy && component.destroy( completely );
       } );
 
@@ -365,7 +368,7 @@ export class Splide {
    * @return The number of slides.
    */
   get length(): number {
-    return this.Components.Slides.getLength( true );
+    return this._Components.Slides.getLength( true );
   }
 
   /**
@@ -374,7 +377,7 @@ export class Splide {
    * @return The active slide index.
    */
   get index(): number {
-    return this.Components.Controller.getIndex();
+    return this._Components.Controller.getIndex();
   }
 }
 

src/js/types/general.ts

@@ -25,7 +25,6 @@ export type ComponentConstructor = ( Splide: Splide, Components: Components, opt
 export interface BaseComponent {
   setup?(): void;
   mount?(): void;
-  mounted?(): void;
   destroy?( completely?: boolean ): void;
 }
 

src/js/utils/dom/style/style.ts

@@ -35,7 +35,7 @@ export function style(
 export function style<K extends CSSStyleProperties>(
   elms: HTMLElement | HTMLElement[],
   styles: Record<string, string | number> | K
-): CSSStyleDeclaration[ K ] | void {
+): CSSStyleDeclaration[ K ] | string | void {
   if ( isString( styles ) ) {
     return isArray( elms ) ? null : getComputedStyle( elms )[ styles ];
   }