Socket
Socket
Sign inDemoInstall

@splidejs/splide

Package Overview
Dependencies
Maintainers
1
Versions
150
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@splidejs/splide - npm Package Compare versions

Comparing version 1.3.4 to 1.4.1

4

dist/js/splide.min.js
/*!
* Splide.js
* Version : 1.3.3
* Version : 1.4.1
* License : MIT
* Copyright: 2019 Naotoshi Fujita
*/!function(i){var e={};function o(t){if(e[t])return e[t].exports;var n=e[t]={i:t,l:!1,exports:{}};return i[t].call(n.exports,n,n.exports,o),n.l=!0,n.exports}o.m=i,o.c=e,o.d=function(t,n,i){o.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:i})},o.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},o.t=function(n,t){if(1&t&&(n=o(n)),8&t)return n;if(4&t&&"object"==typeof n&&n&&n.__esModule)return n;var i=Object.create(null);if(o.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:n}),2&t&&"string"!=typeof n)for(var e in n)o.d(i,e,function(t){return n[t]}.bind(null,e));return i},o.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return o.d(n,"a",n),n},o.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},o.p="",o(o.s=0)}([function(t,n,i){"use strict";i.r(n);var a={};function e(){return(e=Object.assign||function(t){for(var n=1;n<arguments.length;n++){var i=arguments[n];for(var e in i)Object.prototype.hasOwnProperty.call(i,e)&&(t[e]=i[e])}return t}).apply(this,arguments)}function v(i,e){Object.keys(i).some(function(t,n){return e(i[t],t,n)})}function s(n){return Object.keys(n).map(function(t){return n[t]})}function o(t){return"object"==typeof t}function u(t,n){var i=e({},t);return o(i)&&o(n)&&v(n,function(t,n){o(t)?(o(i[n])||(i[n]={}),i[n]=u(i[n],t)):i[n]=t}),i}i.r(a),i.d(a,"CREATED",function(){return C}),i.d(a,"MOUNTED",function(){return M}),i.d(a,"IDLE",function(){return O}),i.d(a,"MOVING",function(){return L});var r="splide",f={active:"is-active",visible:"is-visible",loading:"is-loading"},d={type:"slide",rewind:!1,speed:400,width:0,height:0,fixedWidth:0,fixedHeight:0,heightRatio:0,perPage:1,perMove:0,start:0,focus:!1,gap:0,padding:0,arrows:!0,arrowPath:"",pagination:!0,autoplay:!1,interval:5e3,pauseOnHover:!0,pauseOnFocus:!0,lazyLoad:!1,preloadPages:1,easing:"cubic-bezier(.42,.65,.27,.99)",keyboard:!0,drag:!0,flickThreshold:.6,flickPower:600,flickMaxPages:1,direction:"ltr",cover:!1,accessibility:!0,isNavigation:!1,trimSpace:!0,updateOnMove:!1,breakpoints:!1,classes:{root:r,slider:r+"__slider",track:r+"__track",list:r+"__list",slide:r+"__slide",container:r+"__slide__container",arrows:r+"__arrows",arrow:r+"__arrow",prev:r+"__arrow--prev",next:r+"__arrow--next",pagination:r+"__pagination",page:r+"__pagination__page",clone:r+"__slide--clone",progress:r+"__progress",bar:r+"__progress__bar",autoplay:r+"__autoplay",play:r+"__play",pause:r+"__pause",spinner:r+"__spinner",sr:r+"__sr"},i18n:{prev:"Previous slide",next:"Next slide",first:"Go to first slide",last:"Go to last slide",slideX:"Go to slide %s",pageX:"Go to page %s",play:"Start autoplay",pause:"Pause autoplay"}};function l(t,n){return t&&n?t.querySelector(n.split(" ")[0]):null}function c(t,n){if(t){var i=s(t.children);for(var e in i){var o=i[e];if(m(o,n.split(" ")[0]))return o}}return null}function h(t,n){var i=document.createElement(t);return v(n,function(t,n){return y(i,n,t)}),i}function W(i,t){i&&v(t,function(t,n){i.style[n]=t||""})}function g(n){if(n){for(var t=arguments.length,i=new Array(1<t?t-1:0),e=1;e<t;e++)i[e-1]=arguments[e];i.forEach(function(t){t&&n.classList.add(t)})}}function p(t,n){t&&t.classList.remove(n)}function m(t,n){return t&&t.classList.contains(n)}function y(t,n,i){t&&t.setAttribute(n,i)}function x(t,n){return t?t.getAttribute(n):null}function b(t,n){t&&t.removeAttribute(n)}function w(n,t,i,e){return void 0===e&&(e={}),n?t.split(" ").map(function(t){return n.addEventListener(t,i,e),function(){return n.removeEventListener(t,i)}}):[]}function S(o,t){var r,a;return{mount:function(){w(r=t.Elements.list,"transitionend",function(t){t.target===r&&a&&a()})},start:function(t,n,i,e){a=e,W(r,{transition:"transform "+o.options.speed+"ms "+o.options.easing,transform:"translate("+i.x+"px,"+i.y+"px)"})}}}function _(e,o){function r(t){var n=o.Slides.getSlide(t),i=e.options;n&&W(n.slide,{transition:"opacity "+i.speed+"ms "+i.easing})}return o.Options.fix({perPage:1,gap:0,padding:0}),o.Drag&&(o.Drag.required=!1),{mount:function(){r(e.index)},start:function(t,n,i,e){r(n),e()}}}var k="loop",P="fade";var E="[SPLIDE]";function I(t){console.error(E+" "+t)}function H(t,n){if(!t)throw new Error(n);return t}var C=1,M=2,O=3,L=4;function T(t,n){for(var i=0;i<n.length;i++){var e=n[i];e.enumerable=e.enumerable||!1,e.configurable=!0,"value"in e&&(e.writable=!0),Object.defineProperty(t,e.key,e)}}function A(t){var n=x(t.root,"data-splide");if(n)try{t.options=JSON.parse(n)}catch(t){I('"data-splide" must be a valid JSON.')}return{mount:function(){t.index=t.options.start},fix:function(i){var e=u(t.options,i),o=e.breakpoints;o&&v(o,function(t,n){e.breakpoints[n]=u(o[n],i)}),t.options=e}}}function j(i){var e=i.root,o=i.classes;if(!e.id){var t=window[z]||0;window[z]=++t,e.id="splide"+(t<10?"0"+t:t)}var r={mount:function(){var t="was not found.";this.slider=c(e,o.slider),this.track=l(e,"."+o.track),H(this.track,"A track "+t),this.list=c(this.track,o.list),H(this.list,"A list "+t),this.slides=s(this.list.children),H(this.slides.length,"A slide "+t);var n=a(o.arrows);this.arrows={prev:l(n,"."+o.prev),next:l(n,"."+o.next)};var i=a(o.autoplay);this.bar=l(a(o.progress),"."+o.bar),this.play=l(i,"."+o.play),this.pause=l(i,"."+o.pause),function(){r.track.id||(r.track.id=e.id+"-track");r.list.id||(r.list.id=e.id+"-list")}()},mounted:function(){var t=o.root,n=i.options;g(e,""+t,t+"--"+n.type,t+"--"+n.direction,n.drag?t+"--draggable":"",n.isNavigation?t+"--nav":"")}};function a(t){return c(e,t)||c(r.slider,t)}return r}var q=function(){function t(t,n,i){var r,e,o=this;void 0===n&&(n={}),void 0===i&&(i={}),this.root=t instanceof HTMLElement?t:l(document,t),H(this.root,"An invalid root element or selector was given."),this.Components={},this.Event=(r={},{on:function(t,n){t.split(" ").forEach(function(t){-1<t.indexOf(".")&&r[t]||(r[t]||(r[t]=[]),r[t].push(n))})},off:function(t){t.split(" ").forEach(function(t){return delete r[t]})},emit:function(e){for(var t=arguments.length,o=new Array(1<t?t-1:0),n=1;n<t;n++)o[n-1]=arguments[n];v(r,function(t,n){if(n.split(".")[0]===e&&t)for(var i in t)t[i].apply(t,o)})}}),this.State=(e=C,{set:function(t){e=t},is:function(t){return t===e}}),this.STATES=a,this._options=u(d,n),this._index=0,this._components=i,this.on("move drag",function(){return o.State.set(L)}).on("moved dragged",function(){return o.State.set(O)})}var n,i,e,o=t.prototype;return o.mount=function(t,n){var i,e,o,r,a=this;void 0===t&&(t={}),void 0===n&&(n=null),this.Components=(e=u((i=this)._components,t),o=n,r={},v(e,function(t,n){r[n]=t(i,r,n.toLowerCase())}),o=o||i.is(P)?_:S,r.Transition=o(i,r),r);try{v(this.Components,function(t,n){var i=t.required;void 0===i||i?t.mount&&t.mount():delete a.Components[n]})}catch(t){return I(t.message),null}return v(this.Components,function(t){t.mounted&&t.mounted()}),this.State.set(M),this.emit("mounted"),this.State.set(O),this.emit("ready"),W(this.root,{visibility:"visible"}),this},o.sync=function(t){return this.sibling=t,this},o.on=function(t,n){return this.Event.on(t,n),this},o.off=function(t){return this.Event.off(t),this},o.emit=function(t){for(var n,i=arguments.length,e=new Array(1<i?i-1:0),o=1;o<i;o++)e[o-1]=arguments[o];return(n=this.Event).emit.apply(n,[t].concat(e)),this},o.go=function(t,n){void 0===n&&(n=!0),(this.State.is(O)||this.State.is(L)&&!n)&&this.Components.Controller.go(t,!1)},o.is=function(t){return t===this._options.type},n=t,(i=[{key:"index",get:function(){return this._index},set:function(t){this._index=parseInt(t)}},{key:"length",get:function(){return this.Components.Slides.length}},{key:"options",get:function(){return this._options},set:function(t){this._options=u(this._options,t),this.State.is(C)||this.emit("updated",this._options)}},{key:"classes",get:function(){return this._options.classes}},{key:"i18n",get:function(){return this._options.i18n}}])&&T(n.prototype,i),e&&T(n,e),t}(),z="splideUid";function R(t,n,i){return Math.min(Math.max(t,i<n?i:n),i<n?n:i)}function D(t){for(var n=arguments.length,i=new Array(1<n?n-1:0),e=1;e<n;e++)i[e-1]=arguments[e];var o=0;return t.replace(/%s/g,function(){return i[o++]})}function N(t){var n=typeof t;return"string"==n?t:"number"==n&&0<t?parseFloat(t)+"px":""}function V(t,n){if("number"==typeof n)return n;var i=h("div",{});W(i,{position:"absolute",width:n}),t.appendChild(i);var e=i.clientWidth;return t.removeChild(i),e}function B(r,e){var o,n={mount:function(){o=r.options,r.on("move",function(t){r.index=t}).on("updated",function(t){o=t,r.index=n.rewind(n.trim(r.index))})},go:function(t,n){var i=this.trim(this.parse(t));e.Track.go(i,this.rewind(i),n)},parse:function(t){var n=r.index,i=String(t).match(/([+\-<>])(\d+)?/),e=i&&i[1]||"",o=i?parseInt(i[2]):0;switch(e){case"+":n+=o||1;break;case"-":n-=o||1;break;case">":n=this.pageToIndex(-1<o?o:this.indexToPage(n)+1);break;case"<":n=this.pageToIndex(-1<o?o:this.indexToPage(n)-1);break;default:n=parseInt(t)}return n},pageToIndex:function(t){if(a())return t;var n=r.length,i=o.perPage,e=t*i;return n-i<=(e-=(this.pageLength*i-n)*X(e/n))&&e<n&&(e=n-i),e},indexToPage:function(t){if(a())return t;var n=r.length,i=o.perPage;return X(n-i<=t&&t<n?(n-1)/i:t/i)},trim:function(t){return r.is(k)||(t=o.rewind?this.rewind(t):R(t,0,this.edgeIndex)),t},rewind:function(t){var n=this.edgeIndex;if(r.is(k)){for(;n<t;)t-=n+1;for(;t<0;)t+=n+1}else n<t?t=0:t<0&&(t=n);return t},isRtl:function(){return"rtl"===o.direction},get pageLength(){var t=r.length;return a()?t:Math.ceil(t/o.perPage)},get edgeIndex(){var t=r.length;return a()||o.isNavigation||r.is(k)?t-1:t-o.perPage},get prevIndex(){var t=r.index-1;return(r.is(k)||o.rewind)&&(t=this.rewind(t)),-1<t?t:-1},get nextIndex(){var t=r.index+1;return(r.is(k)||o.rewind)&&(t=this.rewind(t)),r.index<t&&t<=this.edgeIndex||0===t?t:-1}};function a(){return!1!==r.options.focus}return n}var X=Math.floor;function G(a,o){var i=[],s=[];return{mount:function(){for(var t in i=o.Elements.slides)this.register(parseInt(t),-1,i[t])},register:function(t,n,i){var u,e,o,d,r={slide:o=i,index:u=t,realIndex:e=n,container:l(o,"."+(d=a).classes.container),isClone:-1<e,init:function(){var t=this;if(!o.id&&!this.isClone){var n=u+1;o.id=d.root.id+"-slide"+(n<10?"0"+n:n)}var i="mounted updated "+(d.options.updateOnMove?"move":"moved");d.on(i,function(){t.update(t.isActive(),!1),t.update(t.isVisible(),!0)}).on("resize",function(){t.update(t.isVisible(),!0)})},update:function(t,n){var i=n?"visible":"active",e=f[i];t?(g(o,e),d.emit(i,this)):m(o,e)&&(p(o,e),d.emit(n?"hidden":"inactive",this))},isActive:function(){return d.index===u},isVisible:function(){var t=d.options,n=t.focus,i=t.trimSpace,e=d.index,o=d.length,r="center"===n,a=d.Components.Layout.numInView,s=r?a/2:parseInt(n)||0;if(i){if(e<s)return u<a;if(o-(a-s)<=e)return o-a<=u}return e-s+(r&&a%2==0?1:0)<=u&&u<e+a-s},isWithin:function(t,n){var i=Math.abs(t-u);return d.is("slide")||this.isClone||(i=Math.min(i,d.length-i)),i<n}};r.init(),s.push(r)},getSlide:function(n){return s.filter(function(t){return t.index===n})[0]},getSlides:function(t,n){return n?t?s:s.filter(function(t){return!t.isClone}):t?s.map(function(t){return t.slide}):i},getSlidesByPage:function(t){var i=o.Controller.pageToIndex(t),n=a.options,e=!1!==n.focus?1:n.perPage;return s.filter(function(t){var n=t.index;return i<=n&&n<i+e})},get length(){return i.length},get total(){return s.length}}}function F(l,f){var o,n,a=0,i="ttb"===l.options.direction;return{mount:function(){var r,a,s,u,d,c;o=f.Elements.list,n=i?(u=l,c=(d=f).Layout,{translate:function(t,n){W(t,{transform:"translateY("+n+"px)"})},toPosition:function(t){return-(t*(c.slideHeight+c.gap)+this.offset)},toIndex:function(t){return Math.round(-(t+this.offset)/(c.slideHeight+c.gap))},trim:function(t){return R(t,-(c.listHeight-(c.height+c.gap)),0)},get offset(){var t,n=c.height,i=c.slideHeight,e=c.gap,o=u.options.focus;return t="center"===o?(n-i)/2:(parseInt(o)||0)*(i+e),(i+e)*d.Clones.length/2-t}}):(r=l,s=(a=f).Layout,{translate:function(t,n){W(t,{transform:"translateX("+n+"px)"})},toPosition:function(t){return this.sign*(t*(s.slideWidth+s.gap)+this.offset)},toIndex:function(t){return Math.round((this.sign*t-this.offset)/(s.slideWidth+s.gap))},trim:function(t){return R(t,this.sign*(s.listWidth-(s.width+s.gap)),0)},get sign(){return a.Controller.isRtl()?1:-1},get offset(){var t,n=s.width,i=s.slideWidth,e=s.gap,o=r.options.focus;return t="center"===o?(n-i)/2:(parseInt(o)||0)*(i+e),(i+e)*a.Clones.length/2-t}})},mounted:function(){var t=this;l.is(P)||l.on("mounted resize updated",function(){t.jump(l.index)})},go:function(t,n,i){var e=this,o=this.trim(this.toPosition(t)),r=l.index;i||l.emit("move",n,r,t),1<=Math.abs(o-a)||l.is(P)?f.Transition.start(t,n,this.toCoord(o),function(){e.end(t,n,r,i)}):this.end(t,n,r,i)},end:function(t,n,i,e){W(o,{transition:""}),l.is(P)||this.jump(n),e||l.emit("moved",n,i,t)},jump:function(t){var n=this.trim(this.toPosition(t));this.translate(n)},translate:function(t){a=t,n.translate(o,t)},toPosition:function(t){return n.toPosition(t)},toIndex:function(t){return n.toIndex(t)},trim:function(t){return!l.options.trimSpace||l.is(k)?t:n.trim(t)},toCoord:function(t){return{x:i?0:t,y:i?t:0}},get position(){return a},get offset(){return n.offset}}}function U(c,l){var f=[];function p(t){var n=t.cloneNode(!0);return g(n,c.classes.clone),b(n,"id"),n}return{mount:function(){c.is(k)&&function(){var e=l.Slides,o=l.Elements.list,t=c.options,n=t.perPage,i=t.drag,r=t.flickMaxPages,a=void 0===r?1:r,s=e.length,u=n*(i?a+1:1)+(s<n?n:0),d=e.getSlides(!1,!1);for(;d.length<u;)d=d.concat(d);d.slice(0,u).forEach(function(t,n){var i=p(t);o.appendChild(i),f.push(i),e.register(n+s,n,i)}),d.slice(-u).forEach(function(t,n){var i=p(t);o.insertBefore(i,d[0]),f.push(i),e.register(n-u,n,i)})}()},get clones(){return f},get length(){return f.length}}}function J(n,i,e){function o(t){d||(s=(a=t-(r=r||t))/i,i<=a&&(r=0,s=1,n()),e&&e(s),u(o))}var r,a,s,u=window.requestAnimationFrame,d=!0;return{pause:function(){d=!0,r=0},play:function(){r=0,d&&(d=!1,u(o))}}}function Y(P,E){var a,I,C,M=P.root,O="ttb"===P.options.direction,n=E.Elements,s={mount:function(){var t;a=n.list,I=E.Slides.getSlides(!0,!0),t=function(t,n){var i=null;return function(){i=i||setTimeout(function(){t(),i=null},n)}}(function(){P.emit("resize")},50),w(window,"resize",t),P.on("mounted resize",L).on("updated",i),i()},get width(){return C.width},get height(){return C.height},get listWidth(){return C.listWidth},get listHeight(){return C.listHeight},get slideWidth(){return C.slideWidth},get slideHeight(){return C.slideHeight},get gap(){return C.gap},get padding(){return C.padding},get numInView(){return C.numInView}};function i(){var t,n,i,e,o,r,a,s,u,d,c,l,f,p,h,g,v,m,y,x,b,w,S=P.options;for(var _ in(C=O?(l=P,p=S,x=(f=E).Elements,b=l.root,w=x.track,{marginProp:"marginBottom",gap:V(b,p.gap),padding:(h=p.padding,g=h.top,v=void 0===g?h:g,m=h.bottom,y=void 0===m?h:m,{top:V(b,v),bottom:V(b,y)}),init:function(){W(w,{paddingTop:N(this.padding.top),paddingBottom:N(this.padding.bottom)})},get width(){return w.clientWidth},get height(){var t=p.height||this.width*p.heightRatio;return H(t,'"height" or "heightRatio" is missing.'),V(l.root,t)-this.padding.top-this.padding.bottom},get listWidth(){return this.width},get listHeight(){return(this.slideHeight+this.gap)*f.Slides.total},get slideWidth(){return V(l.root,p.fixedWidth||this.width)},get slideHeight(){var t=p.fixedHeight||(this.height+this.gap)/p.perPage-this.gap;return V(l.root,t)},get numInView(){return p.fixedHeight?Math.floor((this.height+this.gap)/(this.slideHeight+this.gap))||1:p.perPage}}):(t=P,i=S,u=(n=E).Elements,d=t.root,c=u.track,{marginProp:"rtl"===i.direction?"marginLeft":"marginRight",height:0,listHeight:0,gap:V(d,i.gap),padding:(e=i.padding,o=e.left,r=void 0===o?e:o,a=e.right,s=void 0===a?e:a,{left:V(d,r),right:V(d,s)}),init:function(){W(c,{paddingLeft:N(this.padding.left),paddingRight:N(this.padding.right)})},get width(){return c.clientWidth-this.padding.left-this.padding.right},get listWidth(){return(this.slideWidth+this.gap)*n.Slides.total},get slideWidth(){var t=i.fixedWidth||(this.width+this.gap)/i.perPage-this.gap;return V(d,t)},get slideHeight(){var t=i.height||i.fixedHeight||this.width*i.heightRatio;return V(d,t)},get numInView(){return i.fixedWidth?Math.floor((this.width+this.gap)/(this.slideWidth+this.gap))||1:i.perPage}})).init(),W(M,{maxWidth:N(S.width)}),I){var k;W(I[_].slide,((k={})[C.marginProp]=N(C.gap),k))}L()}function L(){W(a,{width:N(s.listWidth),height:N(s.listHeight)}),W(E.Elements.track,{height:N(s.height)});var t=N(C.slideWidth),n=N(C.slideHeight);for(var i in I){var e=I[i],o=e.slide,r=e.container;W(r,{height:n}),W(o,{width:t,height:r?"":n})}}return s}function K(u,d){var i,e,o,c=d.Track,l=d.Controller,r=!1,a="ttb"===u.options.direction,f=a?"y":"x",n={required:u.options.drag,disabled:!1,mount:function(){var t=d.Elements.list;w(t,"touchstart mousedown",s),w(t,"touchmove mousemove",p,{passive:!1}),w(t,"touchend touchcancel mouseleave mouseup dragend",h),v(t.querySelectorAll("img, a"),function(t){w(t,"dragstart",function(t){t.preventDefault()},{passive:!1})})}};function s(t){n.disabled||r||!u.State.is(O)||(i=c.toCoord(c.position),e=g(t,{}),o=e)}function p(t){if(e)if(o=g(t,e),r){t.cancelable&&t.preventDefault();var n=i[f]+o.offset[f];c.translate(function(t){if(!u.is(k)){var n=c.trim,i=c.toPosition,e=l.isRtl()?-1:1,o=e*n(i(0)),r=e*n(i(l.edgeIndex));o<(t*=e)?t=5*Math.log(t-o)+o:t<r&&(t=-5*Math.log(r-t)+r),t*=e}return t}(n))}else!function(t){var n=t.offset;if(u.State.is(O)){var i=180*Math.atan(Math.abs(n.y)/Math.abs(n.x))/Math.PI;return a&&(i=90-i),i<30}return}(o)||(u.emit("drag",e),r=!0)}function h(){e=null,r&&(u.emit("dragged",o),function(t){var n=t.velocity[f],i=Math.abs(n);if(0<i){var e=d.Layout,o=u.options,r=n<0?-1:1,a=c.position;i>o.flickThreshold&&Math.abs(t.offset[f])<150&&(a+=r*Math.min(i*o.flickPower,e.width*(o.flickMaxPages||1)));var s=c.toIndex(a);s===u.index&&(s+=l.isRtl()?r:-r),u.is(k)||(s=R(s,0,l.edgeIndex)),l.go(s,o.isNavigation)}}(o),r=!1)}function g(t,n){var i=t.timeStamp,e=t.touches,o=e?e[0]:t,r=o.clientX,a=o.clientY,s=n.to||{},u=s.x,d=void 0===u?r:u,c=s.y,l=void 0===c?a:c,f={x:r-d,y:a-l},p=i-(n.timeStamp||0);return{from:{x:d,y:l},to:{x:r,y:a},offset:f,timeStamp:i,velocity:{x:f.x/p,y:f.y/p}}}return n}function Q(o,r,a){var s,i=[],u={required:o.options.autoplay,mount:function(){var t=o.options,n=r.Elements,i=n.slides,e=n.bar;i.length>t.perPage&&(s=J(function(){o.go(">")},t.interval,function(t){o.emit(a+":playing",t),e&&W(e,{width:100*t+"%"})}),function(){var t=o.options,n=r.Elements,i=o.sub,e=[o.root,i?i.root:null];t.pauseOnHover&&(d(e,"mouseleave",nt,!0),d(e,"mouseenter",nt,!1));t.pauseOnFocus&&(d(e,"focusout",it,!0),d(e,"focusin",it,!1));w(n.play,"click",function(){u.play(it),u.play(et)}),d([n.pause],"click",et,!1),o.on("move",function(){u.play()})}(),this.play())},play:function(n){void 0===n&&(n=0),(i=i.filter(function(t){return t!==n})).length||(o.emit(a+":play"),s.play())},pause:function(t){void 0===t&&(t=0),s.pause(),-1===i.indexOf(t)&&i.push(t),1===i.length&&o.emit(a+":pause")}};function d(t,n,i,e){for(var o in t)w(t[o],n,function(){u[e?"play":"pause"](i)})}return u}function Z(s,u,d){var c,l=s.classes,f=s.root;function p(t){var n=h("button",{class:l.arrow+" "+(t?l.prev:l.next)});return n.innerHTML='<svg xmlns="http://www.w3.org/2000/svg"\tviewBox="0 0 40 40"\twidth="40"\theight="40"><path d="'+(s.options.arrowPath||"m15.5 0.932-4.3 4.38 14.5 14.6-14.5 14.5 4.3 4.4 14.6-14.6 4.4-4.3-4.4-4.4-14.6-14.6z")+'" /></svg>',n}return{required:s.options.arrows,mount:function(){var t,n,i,e=u.Elements,o=s.options.arrows;if((!(c=e.arrows).prev||!c.next)&&o){t=h("div",{class:l.arrows}),n=p(!0),i=p(!1),t.appendChild(n),t.appendChild(i),c={wrapper:t,prev:n,next:i};var r=e.slider,a="slider"===o&&r?r:f;a.insertBefore(c.wrapper,a.firstChild)}c&&(w(c.prev,"click",function(){var t=s.options.perMove;s.go(t?"-"+t:"<")}),w(c.next,"click",function(){var t=s.options.perMove;s.go(t?"+"+t:">")}),s.on("mounted move updated",function(){var t=c.prev,n=c.next,i=u.Controller,e=i.prevIndex,o=i.nextIndex,r=1<s.length;t.disabled=e<0||!r,n.disabled=o<0||!r,s.emit(d+":updated",t,n,e,o)})),this.arrows=c},mounted:function(){s.emit(d+":mounted",c.prev,c.next)}}}function $(s,e,o){var u,d={},c={required:s.options.pagination,mount:function(){var n,o,r,a,t;n=s.options,o=s.classes,r=h("ul",{class:o.pagination}),a=e.Slides,t=a.getSlides(!1,!0).filter(function(t){return!1!==n.focus||t.index%n.perPage==0}).map(function(t,n){var i=h("li",{}),e=h("button",{class:o.page});return i.appendChild(e),r.appendChild(i),w(e,"click",function(){s.go(">"+n)}),{li:i,button:e,page:n,Slides:a.getSlidesByPage(n)}}),d={list:r,items:t};var i=e.Elements.slider;(u="slider"===s.options.pagination&&i?i:s.root).appendChild(d.list),s.on(ot,l).on("updated.page",function(){c.destroy(),s.options.pagination&&(c.mount(),c.mounted())})},mounted:function(){var t=s.index;s.emit(o+":mounted",d,this.getItem(t)),l(t,-1)},destroy:function(){d&&d.list&&u.removeChild(d.list),s.off(ot),d=null},getItem:function(t){return d.items[e.Controller.indexToPage(t)]},get data(){return d}};function l(t,n){var i=c.getItem(n),e=c.getItem(t);i&&p(i.button,f.active),e&&g(e.button,f.active),s.emit(o+":updated",d,i,e)}return c}function tt(s,e){var u=s.i18n;function n(t,n){y(t,"aria-hidden",!n),y(t,"tabindex",n?0:-1)}function t(t,n){var i=e.Elements.track.id;y(t,ut,i),y(n,ut,i)}function o(t,n,i,e){var o=s.index,r=-1<i&&o<i?u.last:u.prev,a=-1<e&&e<o?u.first:u.next;y(t,dt,r),y(n,dt,a)}function r(t,n){n&&y(n.button,st,!0),t.items.forEach(function(t){var n=s.options,i=D(!1===n.focus&&1<n.perPage?u.pageX:u.slideX,t.page+1),e=t.button,o=[];t.Slides.forEach(function(t){o.push(t.slide.id)}),y(e,ut,o.join(" ")),y(e,dt,i)})}function a(t,n,i){n&&b(n.button,st),i&&y(i.button,st,!0)}function d(r){e.Slides.getSlides(!0,!0).forEach(function(t){var n=t.slide;l(n)||y(n,"role","button");var i=-1<t.realIndex?t.realIndex:t.index,e=D(u.slideX,i+1),o=r.Components.Slides.getSlide(i);y(n,dt,e),o&&y(n,ut,o.slide.id)})}function c(t,n){var i=t.slide;n?y(i,st,!0):b(i,st)}function l(t){return"button"===t.tagName.toLowerCase()}return{required:s.options.accessibility,mount:function(){var i;s.on("visible",function(t){n(t.slide,!0)}).on("hidden",function(t){n(t.slide,!1)}).on("arrows:mounted",t).on("arrows:updated",o).on("pagination:mounted",r).on("pagination:updated",a),s.options.isNavigation&&s.on("navigation:mounted",d).on("active",function(t){c(t,!0)}).on("inactive",function(t){c(t,!1)}),[(i=e.Elements).play,i.pause].forEach(function(t,n){t&&(l(t)||y(t,"role","button"),y(t,ut,i.track.id),y(t,dt,u[0===n?"play":"pause"]))})}}}var nt=1,it=2,et=3,ot="move.page",rt="data-splide-lazy",at={horizontal:{ArrowLeft:"<",ArrowRight:">",Left:"<",Right:">"},vertical:{ArrowUp:"<",ArrowDown:">",Up:"<",Down:">"}},st="aria-current",ut="aria-controls",dt="aria-label",ct="move.sync",lt=[" ","Enter","Spacebar"],ft={Options:A,Elements:j,Controller:B,Slides:G,Track:F,Clones:U,Layout:Y,Drag:K,Click:function(t,n){var i=!1;function e(t){i&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}return{required:t.options.drag&&!t.is(P),mount:function(){w(n.Elements.track,"click",e,{capture:!0}),t.on("drag",function(){i=!0}).on("moved",function(){i=!1})}}},Autoplay:Q,Cover:function(t,n){var i=t.options;function e(t){var n=t.parentElement;n&&(W(n,{background:'center/cover no-repeat url("'+t.src+'")'}),W(t,{display:"none"}))}return{required:i.cover&&(i.height||i.heightRatio||i.fixedHeight),mount:function(){n.Slides.getSlides(!0,!1).forEach(function(t){var n=l(t,"img");n&&n.src&&e(n)}),t.on("lazyload:loaded",function(t){e(t)})}}},Arrows:Z,Pagination:$,LazyLoad:function(o,t,r){var n=0,e=[],i=o.options.lazyLoad,a="sequential"===i;function s(n){var i=o.options;(e=e.filter(function(t){return!t.Slide.isWithin(n,i.perPage*(i.preloadPages+1))||(u(t.img,t.Slide),!1)})).length||o.off("moved."+r)}function u(t,n){g(n.slide,f.loading);var i=h("span",{class:o.classes.spinner});t.parentElement.appendChild(i),t.onload=function(){c(t,i,n,!1)},t.onerror=function(){c(t,i,n,!0)},y(t,"src",x(t,rt))}function d(){if(n<e.length){var t=e[n];u(t.img,t.Slide)}n++}function c(t,n,i,e){p(i.slide,f.loading),e||(t.parentElement.removeChild(n),W(t,{visibility:"visible"}),o.emit(r+":loaded",t)),a&&d()}return{required:i,mount:function(){t.Slides.getSlides(!0,!0).forEach(function(t){var n=l(t.slide,"["+rt+"]");n&&(e.push({img:n,Slide:t}),W(n,{visibility:"hidden"}))}),e.length&&(a?d():o.on("mounted",function(){s(o.index)}).on("moved."+r,function(t){s(t)}))}}},Keyboard:function(i){var t;return{mount:function(){var n=at["ttb"===i.options.direction?"vertical":"horizontal"];i.on("mounted updated",function(){t&&(t[0](),t=void 0),i.options.keyboard&&(t=w(i.root,"keydown",function(t){n[t.key]&&i.go(n[t.key])}))})}}},Sync:function(e){var o=e.sibling,t=o&&o.options.isNavigation;function r(){e.on(ct,function(t,n,i){o.off(ct).go(o.is(k)?i:t,!1),a()})}function a(){o.on(ct,function(t,n,i){e.off(ct).go(e.is(k)?i:t,!1),r()})}function i(t){e.State.is(O)&&o.go(t)}return{required:!!o,mount:function(){r(),a(),t&&o.Components.Slides.getSlides(!0,!0).forEach(function(n){var t=n.slide;w(t,"mouseup touchend",function(t){t.button&&0!==t.button||i(n.index)}),w(t,"keyup",function(t){-1<lt.indexOf(t.key)&&(t.preventDefault(),i(n.index))},{passive:!1})})},mounted:function(){t&&o.emit("navigation:mounted",e)}}},A11y:tt,Breakpoints:function(i){var e,o,r=i.options.breakpoints,a=[];return{required:r&&matchMedia,mount:function(){a=Object.keys(r).sort(function(t,n){return parseInt(t)-parseInt(n)}).map(function(t){return{point:t,mql:matchMedia("(max-width:"+t+"px)")}}),i.on("mounted resize",function(){var t,n=(t=a.filter(function(t){return t.mql.matches})[0])?t.point:-1;n!==o&&(i.options=r[n]||e,o=n)})},mounted:function(){e=i.options}}}};i.d(n,"Splide",function(){return pt});var pt=function(i){var t,n;function e(t,n){return i.call(this,t,n,ft)||this}return n=i,(t=e).prototype=Object.create(n.prototype),(t.prototype.constructor=t).__proto__=n,e}(q);window.Splide=pt}]);
*/!function(e){var i={};function o(t){if(i[t])return i[t].exports;var n=i[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,o),n.l=!0,n.exports}o.m=e,o.c=i,o.d=function(t,n,e){o.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:e})},o.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},o.t=function(n,t){if(1&t&&(n=o(n)),8&t)return n;if(4&t&&"object"==typeof n&&n&&n.__esModule)return n;var e=Object.create(null);if(o.r(e),Object.defineProperty(e,"default",{enumerable:!0,value:n}),2&t&&"string"!=typeof n)for(var i in n)o.d(e,i,function(t){return n[t]}.bind(null,i));return e},o.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return o.d(n,"a",n),n},o.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},o.p="",o(o.s=0)}([function(t,n,e){"use strict";e.r(n);var s={};e.r(s),e.d(s,"CREATED",function(){return D}),e.d(s,"MOUNTED",function(){return R}),e.d(s,"IDLE",function(){return N}),e.d(s,"MOVING",function(){return V});var i="splide",p={active:"is-active",visible:"is-visible",loading:"is-loading"},a={type:"slide",rewind:!1,speed:400,width:0,height:0,fixedWidth:0,fixedHeight:0,heightRatio:0,perPage:1,perMove:0,start:0,focus:!1,gap:0,padding:0,arrows:!0,arrowPath:"",pagination:!0,autoplay:!1,interval:5e3,pauseOnHover:!0,pauseOnFocus:!0,lazyLoad:!1,preloadPages:1,easing:"cubic-bezier(.42,.65,.27,.99)",keyboard:!0,drag:!0,flickThreshold:.6,flickPower:600,flickMaxPages:1,direction:"ltr",cover:!1,accessibility:!0,isNavigation:!1,trimSpace:!0,updateOnMove:!1,breakpoints:!1,classes:{root:i,slider:i+"__slider",track:i+"__track",list:i+"__list",slide:i+"__slide",container:i+"__slide__container",arrows:i+"__arrows",arrow:i+"__arrow",prev:i+"__arrow--prev",next:i+"__arrow--next",pagination:i+"__pagination",page:i+"__pagination__page",clone:i+"__slide--clone",progress:i+"__progress",bar:i+"__progress__bar",autoplay:i+"__autoplay",play:i+"__play",pause:i+"__pause",spinner:i+"__spinner",sr:i+"__sr"},i18n:{prev:"Previous slide",next:"Next slide",first:"Go to first slide",last:"Go to last slide",slideX:"Go to slide %s",pageX:"Go to page %s",play:"Start autoplay",pause:"Pause autoplay"}};function o(){return(o=Object.assign||function(t){for(var n=1;n<arguments.length;n++){var e=arguments[n];for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}return t}).apply(this,arguments)}function v(e,i){Object.keys(e).some(function(t,n){return i(e[t],t,n)})}function u(n){return Object.keys(n).map(function(t){return n[t]})}function r(t){return"object"==typeof t}function d(t,n){var e=o({},t);return r(e)&&r(n)&&v(n,function(t,n){r(t)?(r(e[n])||(e[n]={}),e[n]=d(e[n],t)):e[n]=t}),e}function c(t){return Array.isArray(t)?t:[t]}function m(t,n,e){return Math.min(Math.max(t,e<n?e:n),e<n?n:e)}function f(t,n){var e=0;return t.replace(/%s/g,function(){return c(n)[e++]})}function O(t){var n=typeof t;return"string"==n?t:"number"==n&&0<t?parseFloat(t)+"px":""}function W(t,n){if("number"==typeof n)return n;var e=g("div",{});return L(e,{position:"absolute",width:n}),x(t,e),n=e.clientWidth,b(e),n}function h(t,n){return t&&n?t.querySelector(n.split(" ")[0]):null}function l(t,n){return t&&u(t.children).filter(function(t){return k(t,n.split(" ")[0])})[0]||null}function g(t,n){var e=document.createElement(t);return v(n,function(t,n){return P(e,n,t)}),e}function y(t){var n=g("div",{});return n.innerHTML=t,n.firstChild}function b(t){c(t).forEach(function(t){t&&t.parentElement.removeChild(t)})}function x(t,n){t&&t.appendChild(n)}function w(t,n){t&&n&&n.parentElement&&n.parentElement.insertBefore(t,n)}function L(e,t){e&&v(t,function(t,n){e.style[n]=t||""})}function E(n,t,e){n&&c(t).forEach(function(t){t&&n.classList[e?"remove":"add"](t)})}function S(t,n){E(t,n,!1)}function _(t,n){E(t,n,!0)}function k(t,n){return!!t&&t.classList.contains(n)}function P(t,n,e){t&&t.setAttribute(n,e)}function I(t,n){return t?t.getAttribute(n):null}function A(n,t){n&&c(t).forEach(function(t){n.removeAttribute(t)})}function C(o,t){var r,s;return{mount:function(){r=t.Elements.list,o.on("transitionend",function(t){t.target===r&&s&&s()},r)},start:function(t,n,e,i){s=i,L(r,{transition:"transform "+o.options.speed+"ms "+o.options.easing,transform:"translate("+e.x+"px,"+e.y+"px)"})}}}function M(i,o){function r(t){var n=o.Slides.getSlide(t),e=i.options;n&&L(n.slide,{transition:"opacity "+e.speed+"ms "+e.easing})}return o.Options.fix({perPage:1,gap:0,padding:0}),o.Drag&&(o.Drag.required=!1),{mount:function(){r(i.index)},start:function(t,n,e,i){r(n),i()}}}var T="loop",H="fade";var j="[SPLIDE]";function q(t){console.error(j+" "+t)}function z(t,n){if(!t)throw new Error(n)}var D=1,R=2,N=3,V=4;function B(t,n){for(var e=0;e<n.length;e++){var i=n[e];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function X(t){var n=I(t.root,"data-splide");if(n)try{t.options=JSON.parse(n)}catch(t){q(t.message)}return{mount:function(){t.State.is(D)&&(t.index=t.options.start)},fix:function(e){var i=d(t.options,e),o=i.breakpoints;o&&v(o,function(t,n){i.breakpoints[n]=d(o[n],e)}),t.options=i}}}function G(e){var i=e.root,o=e.classes;if(!i.id){window.splide=window.splide||{};var t=window.splide.uid||0;window.splide.uid=++t,i.id="splide"+(t<10?"0"+t:t)}var r={mount:function(){var t="was not found.";this.slider=l(i,o.slider),this.track=h(i,"."+o.track),z(this.track,"A track "+t),this.list=l(this.track,o.list),z(this.list,"A list "+t),this.slides=u(this.list.children);var n=a(o.arrows);this.arrows={prev:h(n,"."+o.prev),next:h(n,"."+o.next)};var e=a(o.autoplay);this.bar=h(a(o.progress),"."+o.bar),this.play=h(e,"."+o.play),this.pause=h(e,"."+o.pause),r.track.id=r.track.id||i.id+"-track",r.list.id=r.list.id||i.id+"-list",S(i,s())},destroy:function(){_(i,s())},add:function(t,n){if("string"==typeof t&&(t=y(t)),t instanceof Element){var e=this.slides[n];e?(w(t,e),this.slides.splice(n,0,t)):(x(this.list,t),this.slides.push(t))}},remove:function(t){b(this.slides.splice(t,1)[0])}};function s(){var t=o.root,n=e.options;return[t+"--"+n.type,t+"--"+n.direction,n.drag?t+"--draggable":"",n.isNavigation?t+"--nav":""]}function a(t){return l(i,t)||l(r.slider,t)}return r}function F(r,i){var o,e,s={mount:function(){o=r.options,e=r.is(T),r.on("move",function(t){r.index=t}).on("updated",function(t){o=t;var n=m(r.index,0,s.edgeIndex);r.index=s.rewind(s.trim(n))})},go:function(t,n){var e=this.trim(this.parse(t));i.Track.go(e,this.rewind(e),n)},parse:function(t){var n=r.index,e=String(t).match(/([+\-<>])(\d+)?/),i=e&&e[1]||"",o=e?parseInt(e[2]):0;switch(i){case"+":n+=o||1;break;case"-":n-=o||1;break;case">":n=this.pageToIndex(-1<o?o:this.indexToPage(n)+1);break;case"<":n=this.pageToIndex(-1<o?o:this.indexToPage(n)-1);break;default:n=parseInt(t)}return n},pageToIndex:function(t){if(a())return t;var n=r.length,e=o.perPage,i=t*e;return n-e<=(i-=(this.pageLength*e-n)*Q(i/n))&&i<n&&(i=n-e),i},indexToPage:function(t){if(a())return t;var n=r.length,e=o.perPage;return Q(n-e<=t&&t<n?(n-1)/e:t/e)},trim:function(t){return e||(t=o.rewind?this.rewind(t):m(t,0,this.edgeIndex)),t},rewind:function(t){var n=this.edgeIndex;if(e){for(;n<t;)t-=n+1;for(;t<0;)t+=n+1}else n<t?t=0:t<0&&(t=n);return t},isRtl:function(){return"rtl"===o.direction},get pageLength(){var t=r.length;return a()?t:Math.ceil(t/o.perPage)},get edgeIndex(){var t=r.length;return t?a()||o.isNavigation||e?t-1:t-o.perPage:0},get prevIndex(){var t=r.index-1;return(e||o.rewind)&&(t=this.rewind(t)),-1<t?t:-1},get nextIndex(){var t=r.index+1;return(e||o.rewind)&&(t=this.rewind(t)),r.index<t&&t<=this.edgeIndex||0===t?t:-1}};function a(){return!1!==r.options.focus}return s}function U(l,o){var e=[],f=[],i={mount:function(){var t=this;n(),l.on("refresh",function(){t.destroy(),n()})},destroy:function(){f.forEach(function(t){t.destroy()}),f=[]},register:function(t,n,e){var u,i,o,d,r,s,a=(u=t,i=n,o=e,r=["mounted","updated","resize",(d=l).options.updateOnMove?"move":"moved"].reduce(function(t,n){return t+n+".slide "},"").trim(),s={slide:o,index:u,realIndex:i,container:h(o,"."+d.classes.container),isClone:-1<i,mount:function(){var t=this;if(!this.isClone){var n=u+1;o.id=d.root.id+"-slide"+(n<10?"0"+n:n)}d.on(r,function(){return t.update()}),d.State.is(D)||this.update()},destroy:function(){d.off(r),v(p,function(t){_(o,t)})},update:function(){c(this.isActive(),!1),c(this.isVisible(),!0)},isActive:function(){return d.index===u},isVisible:function(){var t=d.options,n=t.focus,e=t.trimSpace,i=d.index,o=d.length,r="center"===n,s=d.Components.Layout.numInView,a=r?s/2:parseInt(n)||0;if(e){if(i<a)return u<s;if(o-(s-a)<=i)return o-s<=u}return i-a+(r&&s%2==0?1:0)<=u&&u<i+s-a},isWithin:function(t,n){var e=Math.abs(t-u);return d.is("slide")||this.isClone||(e=Math.min(e,d.length-e)),e<n}});function c(t,n){var e=n?"visible":"active",i=p[e];t?(S(o,i),d.emit(e,s)):k(o,i)&&(_(o,i),d.emit(n?"hidden":"inactive",s))}a.mount(),f.push(a)},getSlide:function(n){return f.filter(function(t){return t.index===n})[0]},getSlides:function(t,n){return n?t?f:f.filter(function(t){return!t.isClone}):t?f.map(function(t){return t.slide}):e},getSlidesByPage:function(t){var e=o.Controller.pageToIndex(t),n=l.options,i=!1!==n.focus?1:n.perPage;return f.filter(function(t){var n=t.index;return e<=n&&n<e+i})},get length(){return e.length},get total(){return f.length}};function n(){(e=o.Elements.slides).forEach(function(t,n){i.register(n,-1,t)})}return i}function Y(l,f){var o,n,s=0,e="ttb"===l.options.direction,a=l.is(H);return{mount:function(){var r,s,a,u,d,c;o=f.Elements.list,n=e?(u=l,c=(d=f).Layout,{translate:function(t,n){L(t,{transform:"translateY("+n+"px)"})},toPosition:function(t){return-(t*(c.slideHeight+c.gap)+this.offset)},toIndex:function(t){return Math.round(-(t+this.offset)/(c.slideHeight+c.gap))},trim:function(t){return m(t,-(c.listHeight-(c.height+c.gap)),0)},get offset(){var t,n=c.height,e=c.slideHeight,i=c.gap,o=u.options.focus;return t="center"===o?(n-e)/2:(parseInt(o)||0)*(e+i),(e+i)*d.Clones.length/2-t}}):(r=l,a=(s=f).Layout,{translate:function(t,n){L(t,{transform:"translateX("+n+"px)"})},toPosition:function(t){return this.sign*(t*(a.slideWidth+a.gap)+this.offset)},toIndex:function(t){return Math.round((this.sign*t-this.offset)/(a.slideWidth+a.gap))},trim:function(t){return m(t,this.sign*(a.listWidth-(a.width+a.gap)),0)},get sign(){return s.Controller.isRtl()?1:-1},get offset(){var t,n=a.width,e=a.slideWidth,i=a.gap,o=r.options.focus;return t="center"===o?(n-e)/2:(parseInt(o)||0)*(e+i),(e+i)*s.Clones.length/2-t}})},mounted:function(){var t=this;a||l.on("mounted resize updated",function(){t.jump(l.index)})},go:function(t,n,e){var i=this,o=this.trim(this.toPosition(t)),r=l.index;e||l.emit("move",n,r,t),1<=Math.abs(o-s)||a?f.Transition.start(t,n,this.toCoord(o),function(){i.end(t,n,r,e)}):this.end(t,n,r,e)},end:function(t,n,e,i){L(o,{transition:""}),a||this.jump(n),i||l.emit("moved",n,e,t)},jump:function(t){var n=this.trim(this.toPosition(t));this.translate(n)},translate:function(t){s=t,n.translate(o,t)},toPosition:function(t){return n.toPosition(t)},toIndex:function(t){return n.toIndex(t)},trim:function(t){return!l.options.trimSpace||l.is(T)?t:n.trim(t)},toCoord:function(t){return{x:e?0:t,y:e?t:0}},get position(){return s},get offset(){return n.offset}}}function J(u,d){var c=[];function n(){var i=d.Slides,t=u.options,n=t.perPage,e=t.drag,o=t.flickMaxPages,r=i.length,s=n*(e?o+1:1)+(r<n?n:0);if(r){for(var a=i.getSlides(!1,!1);a.length<s;)a=a.concat(a);a.slice(0,s).forEach(function(t,n){var e=l(t);x(d.Elements.list,e),c.push(e),i.register(n+r,n,e)}),a.slice(-s).forEach(function(t,n){var e=l(t);w(e,a[0]),c.push(e),i.register(n-s,n,e)})}}function l(t){var n=t.cloneNode(!0);return S(n,u.classes.clone),A(n,"id"),n}return{mount:function(){var t=this;u.is(T)&&(n(),u.on("refresh",function(){t.destroy(),n()}))},destroy:function(){b(c),c=[]},get clones(){return c},get length(){return c.length}}}var K=function(){function t(t,n,e){var o,i,r=this;void 0===n&&(n={}),void 0===e&&(e={}),this.root=t instanceof Element?t:h(document,t),z(this.root,"An invalid root element or selector was given."),this.Components={},this.Event=(o=[],{on:function(t,n,e,i){void 0===e&&(e=null),void 0===i&&(i={}),t.split(" ").forEach(function(t){e&&e.addEventListener(t,n,i),o.push({event:t,handler:n,elm:e,options:i})})},off:function(t,i){void 0===i&&(i=null),t.split(" ").forEach(function(t){for(var n in o){var e=o[n];if(e&&e.event===t&&e.elm===i){i&&i.removeEventListener(t,e.handler,e.options),delete o[n];break}}})},emit:function(n){for(var t=arguments.length,e=new Array(1<t?t-1:0),i=1;i<t;i++)e[i-1]=arguments[i];o.forEach(function(t){t.elm||t.event.split(".")[0]!==n||t.handler.apply(t,e)})},destroy:function(){o.forEach(function(t){t.elm&&t.elm.removeEventListener(t.event,t.handler,t.options)}),o=[]}}),this.State=(i=D,{set:function(t){i=t},is:function(t){return t===i}}),this.STATES=s,this._o=d(a,n),this._i=0,this._c=e,this.on("move drag",function(){return r.State.set(V)}).on("moved dragged",function(){return r.State.set(N)})}var n,e,i,o=t.prototype;return o.mount=function(t,n){var e,i,o,r,s=this;void 0===t&&(t={}),void 0===n&&(n=null),this.Components=(i=d((e=this)._c,t),o=n,r={},v(i,function(t,n){r[n]=t(e,r,n.toLowerCase())}),o=o||e.is(H)?M:C,r.Transition=o(e,r),r);try{v(this.Components,function(t,n){var e=t.required;void 0===e||e?t.mount&&t.mount():delete s.Components[n]})}catch(t){return q(t.message),null}return v(this.Components,function(t){t.mounted&&t.mounted()}),this.State.set(R),this.emit("mounted"),this.State.set(N),L(this.root,{visibility:"visible"}),this.emit("ready"),this},o.sync=function(t){return this.sibling=t,this},o.on=function(t,n,e,i){return void 0===e&&(e=null),void 0===i&&(i={}),this.Event.on(t,n,e,i),this},o.off=function(t,n){return void 0===n&&(n=null),this.Event.off(t,n),this},o.emit=function(t){for(var n,e=arguments.length,i=new Array(1<e?e-1:0),o=1;o<e;o++)i[o-1]=arguments[o];return(n=this.Event).emit.apply(n,[t].concat(i)),this},o.go=function(t,n){return void 0===n&&(n=!0),(this.State.is(N)||this.State.is(V)&&!n)&&this.Components.Controller.go(t,!1),this},o.is=function(t){return t===this._o.type},o.add=function(t,n){return void 0===n&&(n=-1),this.Components.Elements.add(t,n),this.refresh(),this},o.remove=function(t){return this.Components.Elements.remove(t),this.refresh(),this},o.refresh=function(){return this.emit("refresh").emit("updated",this.options),this},o.destroy=function(){return u(this.Components).reverse().forEach(function(t){t.destroy&&t.destroy()}),this.emit("destroy"),this.Event.destroy(),delete this.Components,this.State.set(D),this},n=t,(e=[{key:"index",get:function(){return this._i},set:function(t){this._i=parseInt(t)}},{key:"length",get:function(){return this.Components.Slides.length}},{key:"options",get:function(){return this._o},set:function(t){this._o=d(this._o,t),this.State.is(D)||this.emit("updated",this._o)}},{key:"classes",get:function(){return this._o.classes}},{key:"i18n",get:function(){return this._o.i18n}}])&&B(n.prototype,e),i&&B(n,i),t}(),Q=Math.floor;function Z(n,e,i){function o(t){d||(a=(s=t-(r=r||t))/e,e<=s&&(r=0,a=1,n()),i&&i(a),u(o))}var r,s,a,u=window.requestAnimationFrame,d=!0;return{pause:function(){d=!0,r=0},play:function(){r=0,d&&(d=!1,u(o))}}}function $(S,_){var t,i,k,P,I=S.root,C="ttb"===S.options.direction,n=_.Elements,o={mount:function(){t=n.list,i=n.track,S.on("resize",function(t,n){var e=null;return function(){e=e||setTimeout(function(){t(),e=null},n)}}(function(){S.emit("resize")},50),window).on("mounted resize",M).on("updated",e),e()},destroy:function(){n.slides.concat([t,i]).forEach(function(t){A(t,"style")})},get width(){return P.width},get height(){return P.height},get listWidth(){return P.listWidth},get listHeight(){return P.listHeight},get slideWidth(){return P.slideWidth},get slideHeight(){return P.slideHeight},get gap(){return P.gap},get padding(){return P.padding},get numInView(){return P.numInView}};function e(){var t,n,e,i,o,r,s,a,u,d,c,l,f,p,h,g,v,m,y,b,x,w,E=S.options;k=_.Slides.getSlides(!0,!0),(P=C?(l=S,p=E,b=(f=_).Elements,x=l.root,w=b.track,{marginProp:"marginBottom",gap:W(x,p.gap),padding:(h=p.padding,g=h.top,v=void 0===g?h:g,m=h.bottom,y=void 0===m?h:m,{top:W(x,v),bottom:W(x,y)}),init:function(){L(w,{paddingTop:O(this.padding.top),paddingBottom:O(this.padding.bottom)})},get width(){return w.clientWidth},get height(){var t=p.height||this.width*p.heightRatio;return z(t,'"height" or "heightRatio" is missing.'),W(l.root,t)-this.padding.top-this.padding.bottom},get listWidth(){return this.width},get listHeight(){return(this.slideHeight+this.gap)*f.Slides.total},get slideWidth(){return W(l.root,p.fixedWidth||this.width)},get slideHeight(){var t=p.fixedHeight||(this.height+this.gap)/p.perPage-this.gap;return W(l.root,t)},get numInView(){return p.fixedHeight?Math.floor((this.height+this.gap)/(this.slideHeight+this.gap))||1:p.perPage}}):(t=S,e=E,u=(n=_).Elements,d=t.root,c=u.track,{marginProp:"rtl"===e.direction?"marginLeft":"marginRight",height:0,listHeight:0,gap:W(d,e.gap),padding:(i=e.padding,o=i.left,r=void 0===o?i:o,s=i.right,a=void 0===s?i:s,{left:W(d,r),right:W(d,a)}),init:function(){L(c,{paddingLeft:O(this.padding.left),paddingRight:O(this.padding.right)})},get width(){return c.clientWidth-this.padding.left-this.padding.right},get listWidth(){return(this.slideWidth+this.gap)*n.Slides.total},get slideWidth(){var t=e.fixedWidth||(this.width+this.gap)/e.perPage-this.gap;return W(d,t)},get slideHeight(){var t=e.height||e.fixedHeight||this.width*e.heightRatio;return W(d,t)},get numInView(){return e.fixedWidth?Math.floor((this.width+this.gap)/(this.slideWidth+this.gap))||1:e.perPage}})).init(),L(I,{maxWidth:O(E.width)}),k.forEach(function(t){var n;L(t.slide,((n={})[P.marginProp]=O(P.gap),n))}),M()}function M(){L(t,{width:O(o.listWidth),height:O(o.listHeight)}),L(i,{height:O(o.height)});var n=O(P.slideWidth),e=O(P.slideHeight);k.forEach(function(t){L(t.container,{height:e}),L(t.slide,{width:n,height:t.container?"":e})})}return o}function tt(u,d){var e,i,o,c=d.Track,l=d.Controller,r=!1,s="ttb"===u.options.direction,f=s?"y":"x",n={required:u.options.drag,disabled:!1,mount:function(){var t=d.Elements.list;u.on("touchstart mousedown",a,t).on("touchmove mousemove",p,t,{passive:!1}).on("touchend touchcancel mouseleave mouseup dragend",h,t),v(t.querySelectorAll("img, a"),function(t){u.on("dragstart",function(t){t.preventDefault()},t,{passive:!1})})}};function a(t){n.disabled||r||!u.State.is(N)||(e=c.toCoord(c.position),i=g(t,{}),o=i)}function p(t){if(i)if(o=g(t,i),r){t.cancelable&&t.preventDefault();var n=e[f]+o.offset[f];c.translate(function(t){if(!u.is(T)){var n=c.trim,e=c.toPosition,i=l.isRtl()?-1:1,o=i*n(e(0)),r=i*n(e(l.edgeIndex));o<(t*=i)?t=5*Math.log(t-o)+o:t<r&&(t=-5*Math.log(r-t)+r),t*=i}return t}(n))}else!function(t){var n=t.offset;if(u.State.is(N)){var e=180*Math.atan(Math.abs(n.y)/Math.abs(n.x))/Math.PI;return s&&(e=90-e),e<30}return}(o)||(u.emit("drag",i),r=!0)}function h(){i=null,r&&(u.emit("dragged",o),function(t){var n=t.velocity[f],e=Math.abs(n);if(0<e){var i=d.Layout,o=u.options,r=n<0?-1:1,s=c.position;e>o.flickThreshold&&Math.abs(t.offset[f])<150&&(s+=r*Math.min(e*o.flickPower,i.width*(o.flickMaxPages||1)));var a=c.toIndex(s);a===u.index&&(a+=l.isRtl()?r:-r),u.is(T)||(a=m(a,0,l.edgeIndex)),l.go(a,o.isNavigation)}}(o),r=!1)}function g(t,n){var e=t.timeStamp,i=t.touches,o=i?i[0]:t,r=o.clientX,s=o.clientY,a=n.to||{},u=a.x,d=void 0===u?r:u,c=a.y,l=void 0===c?s:c,f={x:r-d,y:s-l},p=e-(n.timeStamp||0);return{from:{x:d,y:l},to:{x:r,y:s},offset:f,timeStamp:e,velocity:{x:f.x/p,y:f.y/p}}}return n}function nt(r,o,s){var a,e=[],u={required:r.options.autoplay,mount:function(){var t=r.options,n=o.Elements,e=n.slides,i=n.bar;e.length>t.perPage&&(a=Z(function(){r.go(">")},t.interval,function(t){r.emit(s+":playing",t),i&&L(i,{width:100*t+"%"})}),function(){var t=r.options,n=o.Elements,e=r.sibling,i=[r.root,e?e.root:null];t.pauseOnHover&&(d(i,"mouseleave",rt,!0),d(i,"mouseenter",rt,!1));t.pauseOnFocus&&(d(i,"focusout",st,!0),d(i,"focusin",st,!1));r.on("click",function(){u.play(st),u.play(at)},n.play).on("move",function(){u.play()}).on("destroy",function(){u.pause()}),d([n.pause],"click",at,!1)}(),this.play())},play:function(n){void 0===n&&(n=0),(e=e.filter(function(t){return t!==n})).length||(r.emit(s+":play"),a.play())},pause:function(t){void 0===t&&(t=0),a.pause(),-1===e.indexOf(t)&&e.push(t),1===e.length&&r.emit(s+":pause")}};function d(t,n,e,i){for(var o in t)r.on(n,function(){u[i?"play":"pause"](e)},t[o])}return u}function et(o,r,s){var a,u,n,i=o.classes,d=o.root;function e(t){var n=o.options.perMove;o.go(n?(t?"-":"+")+n:t?"<":">")}function c(){var t=r.Controller,n=t.prevIndex,e=t.nextIndex,i=o.length>o.options.perPage;a.disabled=n<0||!i,u.disabled=e<0||!i,o.emit(s+":updated",a,u,n,e)}function l(t){return y('<button class="'+i.arrow+" "+(t?i.prev:i.next)+'"><svg xmlns="http://www.w3.org/2000/svg"\tviewBox="0 0 40 40"\twidth="40"\theight="40"><path d="'+(o.options.arrowPath||"m15.5 0.932-4.3 4.38 14.5 14.6-14.5 14.5 4.3 4.4 14.6-14.6 4.4-4.3-4.4-4.4-14.6-14.6z")+'" />')}return{required:o.options.arrows,mount:function(){var t=r.Elements;a=t.arrows.prev,u=t.arrows.next,a&&u||!o.options.arrows||(a=l(!0),u=l(!1),n=!0,function(){var t=g("div",{class:i.arrows});x(t,a),x(t,u);var n=r.Elements.slider,e="slider"===o.options.arrows&&n?n:d;w(t,e.firstElementChild)}()),a&&u&&o.on("click",function(){return e(!0)},a).on("click",function(){return e(!1)},u).on("mounted move updated",c),this.arrows={prev:a,next:u}},mounted:function(){o.emit(s+":mounted",a,u)},destroy:function(){[a,u].forEach(function(t){A(t,"disabled")}),n&&b(a.parentElement)}}}function it(a,i,r){var u={},d={required:a.options.pagination,mount:function(){var n,o,r,s,t;n=a.options,o=a.classes,r=g("ul",{class:o.pagination}),s=i.Slides,t=s.getSlides(!1,!0).filter(function(t){return!1!==n.focus||t.index%n.perPage==0}).map(function(t,n){var e=g("li",{}),i=g("button",{class:o.page});return x(e,i),x(r,e),a.on("click",function(){a.go(">"+n)},i),{li:e,button:i,page:n,Slides:s.getSlidesByPage(n)}}),u={list:r,items:t};var e=i.Elements.slider;x("slider"===a.options.pagination&&e?e:a.root,u.list),a.on(ut,c).on(dt,function(){d.destroy(),a.options.pagination&&(d.mount(),d.mounted())})},mounted:function(){var t=a.index;a.emit(r+":mounted",u,this.getItem(t)),c(t,-1)},destroy:function(){b(u.list),u.items&&u.items.forEach(function(t){a.off("click",t.button)}),a.off(ut).off(dt),u={}},getItem:function(t){return u.items[i.Controller.indexToPage(t)]},get data(){return u}};function c(t,n){var e=d.getItem(n),i=d.getItem(t),o=p.active;e&&_(e.button,o),i&&S(i.button,o),a.emit(r+":updated",u,e,i)}return d}function ot(a,i){var u=a.i18n;function n(t,n){P(t,gt,!n),P(t,vt,n?0:-1)}function t(t,n){var e=i.Elements.track.id;P(t,pt,e),P(n,pt,e)}function o(t,n,e,i){var o=a.index,r=-1<e&&o<e?u.last:u.prev,s=-1<i&&i<o?u.first:u.next;P(t,ht,r),P(n,ht,s)}function r(t,n){n&&P(n.button,ft,!0),t.items.forEach(function(t){var n=a.options,e=f(!1===n.focus&&1<n.perPage?u.pageX:u.slideX,t.page+1),i=t.button,o=t.Slides.map(function(t){return t.slide.id});P(i,pt,o.join(" ")),P(i,ht,e)})}function s(t,n,e){n&&A(n.button,ft),e&&P(e.button,ft,!0)}function d(r){i.Slides.getSlides(!0,!0).forEach(function(t){var n=t.slide;l(n)||P(n,"role","button");var e=-1<t.realIndex?t.realIndex:t.index,i=f(u.slideX,e+1),o=r.Components.Slides.getSlide(e);P(n,ht,i),o&&P(n,pt,o.slide.id)})}function c(t,n){var e=t.slide;n?P(e,ft,!0):A(e,ft)}function l(t){return"button"===t.tagName.toLowerCase()}return{required:a.options.accessibility,mount:function(){var e;a.on("visible",function(t){n(t.slide,!0)}).on("hidden",function(t){n(t.slide,!1)}).on("arrows:mounted",t).on("arrows:updated",o).on("pagination:mounted",r).on("pagination:updated",s),a.options.isNavigation&&a.on("navigation:mounted",d).on("active",function(t){c(t,!0)}).on("inactive",function(t){c(t,!1)}),[(e=i.Elements).play,e.pause].forEach(function(t,n){t&&(l(t)||P(t,"role","button"),P(t,pt,e.track.id),P(t,ht,u[0===n?"play":"pause"]))})},destroy:function(){var t=i.Elements,n=i.Arrows.arrows;t.slides.concat([n.prev,n.next,t.play,t.pause]).forEach(function(t){A(t,[gt,vt,pt,ht,ft,"role"])})}}}var rt=1,st=2,at=3,ut="move.page",dt="updated.page",ct="data-splide-lazy",lt={horizontal:{ArrowLeft:"<",ArrowRight:">",Left:"<",Right:">"},vertical:{ArrowUp:"<",ArrowDown:">",Up:"<",Down:">"}},ft="aria-current",pt="aria-controls",ht="aria-label",gt="aria-hidden",vt="tabindex",mt="move.sync",yt=[" ","Enter","Spacebar"],bt={Options:X,Elements:G,Controller:F,Slides:U,Track:Y,Clones:J,Layout:$,Drag:tt,Click:function(t,n){var e=!1;function i(t){e&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}return{required:t.options.drag&&!t.is(H),mount:function(){t.on("click",i,n.Elements.track,{capture:!0}).on("drag",function(){e=!0}).on("moved",function(){e=!1})}}},Autoplay:nt,Cover:function(t,n){function e(e){n.Slides.getSlides(!0,!1).forEach(function(t){var n=h(t,"img");n&&n.src&&i(n,e)})}function i(t,n){void 0===n&&(n=!1),L(t.parentElement,{background:n?"":'center/cover no-repeat url("'+t.src+'")'}),L(t,{display:n?"":"none"})}return{required:t.options.cover,mount:function(){e(!1),t.on("lazyload:loaded",function(t){i(t)}),t.on("updated",function(){return e(!1)})},destroy:function(){e(!0)}}},Arrows:et,Pagination:it,LazyLoad:function(o,t,r){var n=0,i=[],e=o.options.lazyLoad,s="sequential"===e,a=!1;function u(t,n){S(n.slide,p.loading);var e=g("span",{class:o.classes.spinner});x(t.parentElement,e),t.onload=function(){c(t,e,n,!1)},t.onerror=function(){c(t,e,n,!0)},P(t,"src",I(t,ct))}function d(){if(n<i.length){var t=i[n];u(t.img,t.Slide)}n++}function c(t,n,e,i){_(e.slide,p.loading),i||(b(n),L(t,{visibility:"visible"}),o.emit(r+":loaded",t)),s&&!a&&d()}return{required:e,mount:function(){t.Slides.getSlides(!0,!0).forEach(function(t){var n=h(t.slide,"["+ct+"]");n&&(i.push({img:n,Slide:t}),L(n,{visibility:"hidden"}))}),i.length&&(s?d():o.on("mounted moved."+r,function(t){var n,e;n=t||o.index,e=o.options,(i=i.filter(function(t){return!t.Slide.isWithin(n,e.perPage*(e.preloadPages+1))||(u(t.img,t.Slide),!1)})).length||o.off("moved."+r)}))},destroy:function(){a=!0}}},Keyboard:function(e){return{mount:function(){var n=lt["ttb"===e.options.direction?"vertical":"horizontal"];e.on("mounted updated",function(){e.off("keydown",e.root),e.options.keyboard&&e.on("keydown",function(t){n[t.key]&&e.go(n[t.key])},e.root)})}}},Sync:function(i){var o=i.sibling,t=o&&o.options.isNavigation;function r(){i.on(mt,function(t,n,e){o.off(mt).go(o.is(T)?e:t,!1),s()})}function s(){o.on(mt,function(t,n,e){i.off(mt).go(i.is(T)?e:t,!1),r()})}function a(t){i.State.is(N)&&o.go(t)}return{required:!!o,mount:function(){r(),s(),t&&o.Components.Slides.getSlides(!0,!0).forEach(function(t){var n=t.slide,e=t.index;i.on("mouseup touchend",function(t){t.button&&0!==t.button||a(e)},n),i.on("keyup",function(t){-1<yt.indexOf(t.key)&&(t.preventDefault(),a(e))},n,{passive:!1})})},mounted:function(){t&&o.emit("navigation:mounted",i)}}},A11y:ot,Breakpoints:function(e){var i,o,r=e.options.breakpoints,s=[];return{required:r&&matchMedia,mount:function(){s=Object.keys(r).sort(function(t,n){return parseInt(t)-parseInt(n)}).map(function(t){return{point:t,mql:matchMedia("(max-width:"+t+"px)")}}),e.on("mounted resize",function(){var t,n=(t=s.filter(function(t){return t.mql.matches})[0])?t.point:-1;n!==o&&(e.options=r[n]||i,o=n)})},mounted:function(){i=e.options}}}};e.d(n,"Splide",function(){return xt});var xt=function(e){var t,n;function i(t,n){return e.call(this,t,n,bt)||this}return n=e,(t=i).prototype=Object.create(n.prototype),(t.prototype.constructor=t).__proto__=n,i}(K);window.Splide=xt}]);

2

package.json
{
"name": "@splidejs/splide",
"version": "1.3.4",
"version": "1.4.1",
"description": "Splide is a lightweight and powerful slider without any dependencies.",

@@ -5,0 +5,0 @@ "author": "Naotoshi Fujita",

14

README.md

@@ -7,5 +7,11 @@ # Splide

## News
* Splide can be destroyed.
* Add or remove slides dynamically.
* [Video](https://splidejs.com/video/) extension is released.
* [URL Hash Navigation](https://splidejs.com/url-hash-navigation/) extension is released.
## Features
* Pure JavaScript without any dependencies
* Small size, less than 27kB(10kB gzipped)
* Small size, less than 28kB(11kB gzipped)
* Flexible and extensible

@@ -24,2 +30,3 @@ * Multiple slides

* Accessibility friendly, supporting keyboard control and ARIA attributes
* Dynamically adding/removing slides
* Internet Explorer 10

@@ -119,3 +126,4 @@

## Extensions
* [Video](https://github.com/Splidejs/splide-extension-video): Assign YouTube or Vimeo videos to slides.
* [Video](https://github.com/Splidejs/splide-extension-video): Assign HTML video, YouTube or Vimeo to slides.
* [URL Hash Navigation](https://github.com/Splidejs/splide-extension-url-hash): Listen to hash change and move a slider to a slide having the hash data attribute.

@@ -129,2 +137,2 @@ ## API and Extension

Splide is released under the MIT license.
© 2019 Naotoshi Fujita
© 2020 Naotoshi Fujita

18

src/js/components/a11y/index.js

@@ -63,2 +63,16 @@ /**

},
/**
* Destroy.
*/
destroy() {
const Elements = Components.Elements;
const arrows = Components.Arrows.arrows;
Elements.slides
.concat( [ arrows.prev, arrows.next, Elements.play, Elements.pause ] )
.forEach( elm => {
removeAttribute( elm, [ ARIA_HIDDEN, TAB_INDEX, ARIA_CONTROLS, ARIA_LABEL, ARIA_CURRENRT, 'role' ] );
} );
},
};

@@ -125,6 +139,4 @@

const button = item.button;
const controls = [];
const controls = item.Slides.map( Slide => Slide.slide.id );
item.Slides.forEach( Slide => { controls.push( Slide.slide.id ) } );
setAttribute( button, ARIA_CONTROLS, controls.join( ' ' ) );

@@ -131,0 +143,0 @@ setAttribute( button, ARIA_LABEL, label );

133

src/js/components/arrows/index.js

@@ -8,3 +8,3 @@ /**

import { create, subscribe } from '../../utils/dom';
import { create, append, before, domify, remove, removeAttribute } from '../../utils/dom';
import { XML_NAME_SPACE, PATH, SIZE } from './path';

@@ -24,9 +24,16 @@

/**
* Keep all created elements.
* Previous arrow element.
*
* @type {Object}
* @type {Element|undefined}
*/
let arrows;
let prev;
/**
* Next arrow element.
*
* @type {Element|undefined}
*/
let next;
/**
* Store the class list.

@@ -46,2 +53,9 @@ *

/**
* Whether arrows are created programmatically or not.
*
* @type {boolean}
*/
let created;
/**
* Arrows component object.

@@ -63,21 +77,22 @@ *

mount() {
const Elements = Components.Elements;
const arrowsOption = Splide.options.arrows;
const Elements = Components.Elements;
arrows = Elements.arrows;
// Attempt to get arrows from HTML source.
prev = Elements.arrows.prev;
next = Elements.arrows.next;
// If arrows were not found in HTML, let's generate them.
if ( ( ! arrows.prev || ! arrows.next ) && arrowsOption ) {
arrows = createArrows();
const slider = Elements.slider;
const parent = arrowsOption === 'slider' && slider ? slider : root;
parent.insertBefore( arrows.wrapper, parent.firstChild );
if ( ( ! prev || ! next ) && Splide.options.arrows ) {
prev = createArrow( true );
next = createArrow( false );
created = true;
appendArrows();
}
if ( arrows ) {
listen();
if ( prev && next ) {
bind();
}
this.arrows = arrows;
this.arrows = { prev, next };
},

@@ -89,51 +104,63 @@

mounted() {
Splide.emit( `${ name }:mounted`, arrows.prev, arrows.next );
Splide.emit( `${ name }:mounted`, prev, next );
},
/**
* Destroy.
*/
destroy() {
[ prev, next ].forEach( elm => { removeAttribute( elm, 'disabled' ) } );
if ( created ) {
remove( prev.parentElement );
}
},
};
/**
* Subscribe click events.
* Listen native and custom events.
*/
function listen() {
subscribe( arrows.prev, 'click', () => {
const perMove = Splide.options.perMove;
Splide.go( perMove ? `-${ perMove }` : '<' );
} );
function bind() {
Splide
.on( 'click', () => onClick( true ), prev )
.on( 'click', () => onClick( false ), next )
.on( 'mounted move updated', updateDisabled );
}
subscribe( arrows.next, 'click', () => {
const perMove = Splide.options.perMove;
Splide.go( perMove ? `+${ perMove }` : '>' );
} );
/**
* Called when an arrow is clicked.
*
* @param {boolean} prev - If true, the previous arrow is clicked.
*/
function onClick( prev ) {
const perMove = Splide.options.perMove;
Splide.go( perMove ? `${ prev ? '-' : '+' }${ perMove }` : ( prev ? '<' : '>' ) );
}
/**
* Update a disable attribute.
* Update a disabled attribute.
*/
function bind() {
Splide.on( 'mounted move updated', () => {
const { prev, next } = arrows;
const { prevIndex, nextIndex } = Components.Controller;
const hasSlides = Splide.length > 1;
function updateDisabled() {
const { prevIndex, nextIndex } = Components.Controller;
const isEnough = Splide.length > Splide.options.perPage;
prev.disabled = prevIndex < 0 || ! hasSlides;
next.disabled = nextIndex < 0 || ! hasSlides;
prev.disabled = prevIndex < 0 || ! isEnough;
next.disabled = nextIndex < 0 || ! isEnough;
Splide.emit( `${ name }:updated`, prev, next, prevIndex, nextIndex );
} );
Splide.emit( `${ name }:updated`, prev, next, prevIndex, nextIndex );
}
/**
* Create a wrapper and arrow elements.
*
* @return {Object} - An object contains created elements.
* Create a wrapper element and append arrows.
*/
function createArrows() {
function appendArrows() {
const wrapper = create( 'div', { class: classes.arrows } );
const prev = createArrow( true );
const next = createArrow( false );
wrapper.appendChild( prev );
wrapper.appendChild( next );
append( wrapper, prev );
append( wrapper, next );
return { wrapper, prev, next };
const slider = Components.Elements.slider;
const parent = Splide.options.arrows === 'slider' && slider ? slider : root;
before( wrapper, parent.firstElementChild );
}

@@ -144,16 +171,12 @@

*
* @param {boolean} isPrev - Determine to create a prev arrow or next arrow.
* @param {boolean} prev - Determine to create a prev arrow or next arrow.
*
* @return {Element} - A created arrow element.
*/
function createArrow( isPrev ) {
const arrow = create( 'button', {
class: `${ classes.arrow } ${ isPrev ? classes.prev : classes.next }`,
} );
function createArrow( prev ) {
const arrow = `<button class="${ classes.arrow } ${ prev ? classes.prev : classes.next }">`
+ `<svg xmlns="${ XML_NAME_SPACE }" viewBox="0 0 ${ SIZE } ${ SIZE }" width="${ SIZE }" height="${ SIZE }">`
+ `<path d="${ Splide.options.arrowPath || PATH }" />`;
arrow.innerHTML = `<svg xmlns="${ XML_NAME_SPACE }" viewBox="0 0 ${ SIZE } ${ SIZE }" width="${ SIZE }" height="${ SIZE }">`
+ `<path d="${ Splide.options.arrowPath || PATH }" />`
+ `</svg>`;
return arrow;
return domify( arrow );
}

@@ -160,0 +183,0 @@

34

src/js/components/autoplay/index.js

@@ -8,3 +8,3 @@ /**

import { applyStyle, subscribe } from '../../utils/dom';
import { applyStyle } from '../../utils/dom';
import { createInterval } from '../../utils/time';

@@ -70,3 +70,6 @@

Splide.emit( `${ name }:playing`, rate );
bar && applyStyle( bar, { width: `${ rate * 100 }%` } );
if ( bar ) {
applyStyle( bar, { width: `${ rate * 100 }%` } );
}
} );

@@ -118,4 +121,4 @@

const Elements = Components.Elements;
const sub = Splide.sub;
const elms = [ Splide.root, sub ? sub.root : null ];
const sibling = Splide.sibling;
const elms = [ Splide.root, sibling ? sibling.root : null ];

@@ -132,12 +135,17 @@ if ( options.pauseOnHover ) {

subscribe( Elements.play, 'click', () => {
// Need to be removed a focus flag at first.
Autoplay.play( PAUSE_FLAGS.FOCUS );
Autoplay.play( PAUSE_FLAGS.MANUAL );
} );
Splide
.on( 'click', () => {
// Need to be removed a focus flag at first.
Autoplay.play( PAUSE_FLAGS.FOCUS );
Autoplay.play( PAUSE_FLAGS.MANUAL );
}, Elements.play )
.on( 'move', () => {
// Rewind the timer when others move the slide.
Autoplay.play();
} )
.on( 'destroy', () => {
Autoplay.pause();
} );
switchOn( [ Elements.pause ], 'click', PAUSE_FLAGS.MANUAL, false );
// Rewind the timer when others move the slide.
Splide.on( 'move', () => { Autoplay.play() } );
}

@@ -155,3 +163,3 @@

for ( let i in elms ) {
subscribe( elms[ i ], event, () => { Autoplay[ play ? 'play' : 'pause' ]( flag ) } );
Splide.on( event, () => { Autoplay[ play ? 'play' : 'pause' ]( flag ) }, elms[ i ] );
}

@@ -158,0 +166,0 @@ }

2

src/js/components/breakpoints/index.js

@@ -98,3 +98,3 @@ /**

function getPoint() {
const item = map.filter( item => item.mql.matches )[ 0 ];
const item = map.filter( item => item.mql.matches )[0];
return item ? item.point : -1;

@@ -101,0 +101,0 @@ }

6

src/js/components/click/index.js

@@ -9,3 +9,2 @@ /**

import { FADE } from "../../constants/types";
import { subscribe } from "../../utils/dom";

@@ -47,5 +46,4 @@

mount() {
subscribe( Components.Elements.track, 'click', click, { capture: true } );
Splide
.on( 'click', onClick, Components.Elements.track, { capture: true } )
.on( 'drag', () => { disabled = true } )

@@ -61,3 +59,3 @@ .on( 'moved', () => { disabled = false } );

*/
function click( e ) {
function onClick( e ) {
if ( disabled ) {

@@ -64,0 +62,0 @@ e.preventDefault();

55

src/js/components/clones/index.js

@@ -9,3 +9,3 @@ /**

import { LOOP } from '../../constants/types';
import { addClass, removeAttribute } from '../../utils/dom';
import { addClass, removeAttribute, append, before, remove } from '../../utils/dom';

@@ -27,3 +27,3 @@

*/
const clones = [];
let clones = [];

@@ -42,2 +42,7 @@ /**

generateClones();
Splide.on( 'refresh', () => {
this.destroy();
generateClones();
} );
}

@@ -47,2 +52,10 @@ },

/**
* Destroy.
*/
destroy() {
remove( clones );
clones = [];
},
/**
* Return all clones.

@@ -73,28 +86,30 @@ *

function generateClones() {
const { Slides, Elements: { list } } = Components;
const { perPage, drag, flickMaxPages = 1 } = Splide.options;
const Slides = Components.Slides;
const { perPage, drag, flickMaxPages } = Splide.options;
const length = Slides.length;
const count = perPage * ( drag ? flickMaxPages + 1 : 1 ) + ( length < perPage ? perPage : 0 );
let slides = Slides.getSlides( false, false );
if ( length ) {
let slides = Slides.getSlides( false, false );
while ( slides.length < count ) {
slides = slides.concat( slides );
}
while ( slides.length < count ) {
slides = slides.concat( slides );
}
slides.slice( 0, count ).forEach( ( elm, index ) => {
const clone = cloneDeeply( elm );
list.appendChild( clone );
clones.push( clone );
slides.slice( 0, count ).forEach( ( elm, index ) => {
const clone = cloneDeeply( elm );
append( Components.Elements.list, clone );
clones.push( clone );
Slides.register( index + length, index, clone );
} );
Slides.register( index + length, index, clone );
} );
slides.slice( -count ).forEach( ( elm, index ) => {
const clone = cloneDeeply( elm );
list.insertBefore( clone, slides[0] );
clones.push( clone );
slides.slice( -count ).forEach( ( elm, index ) => {
const clone = cloneDeeply( elm );
before( clone, slides[0] );
clones.push( clone );
Slides.register( index - count, index, clone );
} );
Slides.register( index - count, index, clone );
} );
}
}

@@ -101,0 +116,0 @@

25

src/js/components/controller/index.js

@@ -32,2 +32,9 @@ /**

/**
* True if the slide is LOOP mode.
*
* @type {boolean}
*/
let isLoop;
/**
* Controller component object.

@@ -43,2 +50,3 @@ *

options = Splide.options;
isLoop = Splide.is( LOOP );
bind();

@@ -160,3 +168,3 @@ },

trim( index ) {
if ( ! Splide.is( LOOP ) ) {
if ( ! isLoop ) {
index = options.rewind ? this.rewind( index ) : between( index, 0, this.edgeIndex );

@@ -178,3 +186,3 @@ }

if ( Splide.is( LOOP ) ) {
if ( isLoop ) {
while( index > edge ) {

@@ -225,3 +233,7 @@ index -= edge + 1;

if ( hasFocus() || options.isNavigation || Splide.is( LOOP ) ) {
if ( ! length ) {
return 0;
}
if ( hasFocus() || options.isNavigation || isLoop ) {
return length - 1;

@@ -241,3 +253,3 @@ }

if ( Splide.is( LOOP ) || options.rewind ) {
if ( isLoop || options.rewind ) {
prev = this.rewind( prev );

@@ -257,3 +269,3 @@ }

if ( Splide.is( LOOP ) || options.rewind ) {
if ( isLoop || options.rewind ) {
next = this.rewind( next );

@@ -274,3 +286,4 @@ }

options = newOptions;
Splide.index = Controller.rewind( Controller.trim( Splide.index ) );
const index = between( Splide.index, 0, Controller.edgeIndex );
Splide.index = Controller.rewind( Controller.trim( index ) );
} );

@@ -277,0 +290,0 @@ }

47

src/js/components/cover/index.js

@@ -34,7 +34,7 @@ /**

/**
* To set an image as cover, the height option is required.
* Required only when "cover" option is true.
*
* @type {boolean}
*/
required: options.cover && ( options.height || options.heightRatio || options.fixedHeight ),
required: options.cover,

@@ -45,26 +45,37 @@ /**

mount() {
Components.Slides.getSlides( true, false ).forEach( slide => {
const img = find( slide, 'img' );
if ( img && img.src ) {
cover( img );
}
} );
apply( false );
Splide.on( 'lazyload:loaded', img => { cover( img ) } );
Splide.on( 'updated', () => apply( false ) );
},
/**
* Destroy.
*/
destroy() {
apply( true );
},
};
/**
* Apply "cover" to all slides.
*/
function apply( uncover ) {
Components.Slides.getSlides( true, false ).forEach( slide => {
const img = find( slide, 'img' );
if ( img && img.src ) {
cover( img, uncover );
}
} );
}
/**
* Set background image of the parent element, using source of the given image element.
*
* @param {Element} img - An image element.
* @param {Element} img - An image element.
* @param {boolean} uncover - Optional. Reset "cover".
*/
function cover( img ) {
const parent = img.parentElement;
if ( parent ) {
applyStyle( parent, { background: `center/cover no-repeat url("${ img.src }")` } );
applyStyle( img, { display: 'none' } );
}
function cover( img, uncover = false ) {
applyStyle( img.parentElement, { background: uncover ? '' : `center/cover no-repeat url("${ img.src }")` } );
applyStyle( img, { display: uncover ? '' : 'none' } );
}

@@ -71,0 +82,0 @@

10

src/js/components/drag/index.js

@@ -10,3 +10,2 @@ /**

import { TTB } from '../../constants/directions';
import { subscribe } from '../../utils/dom';
import { between } from '../../utils/utils';

@@ -132,9 +131,10 @@ import { IDLE } from '../../constants/states';

subscribe( list, 'touchstart mousedown', start );
subscribe( list, 'touchmove mousemove', move, { passive: false } );
subscribe( list, 'touchend touchcancel mouseleave mouseup dragend', end );
Splide
.on( 'touchstart mousedown', start, list )
.on( 'touchmove mousemove', move, list, { passive: false } )
.on( 'touchend touchcancel mouseleave mouseup dragend', end, list );
// Prevent dragging an image or anchor itself.
each( list.querySelectorAll( 'img, a' ), elm => {
subscribe( elm, 'dragstart', e => { e.preventDefault() }, { passive: false } );
Splide.on( 'dragstart', e => { e.preventDefault() }, elm, { passive: false } );
} );

@@ -141,0 +141,0 @@ },

104

src/js/components/elements/index.js
/**
* The component for the root element.
* The component for main elements.
*

@@ -8,3 +8,3 @@ * @author Naotoshi Fujita

import { find, addClass, child } from '../../utils/dom';
import { find, addClass, removeClass, child, remove, append, before, domify } from '../../utils/dom';
import { exist } from '../../utils/error';

@@ -18,7 +18,7 @@ import { values } from '../../utils/object';

*/
const UID_NAME = 'splideUid';
const UID_NAME = 'uid';
/**
* The component for the root element.
* The component for main elements.
*

@@ -49,4 +49,5 @@ * @param {Splide} Splide - A Splide instance.

if ( ! root.id ) {
let uid = window[ UID_NAME ] || 0;
window[ UID_NAME ] = ++uid;
window.splide = window.splide || {};
let uid = window.splide[ UID_NAME ] || 0;
window.splide[ UID_NAME ] = ++uid;
root.id = `splide${ uid < 10 ? '0' + uid : uid }`;

@@ -77,3 +78,2 @@ }

this.slides = values( this.list.children );
exist( this.slides.length, `A slide ${ message }` );

@@ -95,20 +95,72 @@ const arrows = findParts( classes.arrows );

/**
* Called after all components are mounted.
* Destroy.
*/
mounted() {
const rootClass = classes.root;
const options = Splide.options;
destroy() {
removeClass( root, getClasses() );
},
addClass(
root,
`${ rootClass }`,
`${ rootClass }--${ options.type }`,
`${ rootClass }--${ options.direction }`,
options.drag ? `${ rootClass }--draggable` : '',
options.isNavigation ? `${ rootClass }--nav` : ''
);
/**
* Insert a slide to a slider.
* Need to refresh Splide after adding a slide.
*
* @param {Node|string} slide - A slide element to be added.
* @param {number} index - A slide will be added at the position.
*/
add( slide, index ) {
if ( typeof slide === 'string' ) {
slide = domify( slide );
}
if ( slide instanceof Element ) {
const ref = this.slides[ index ];
if ( ref ) {
before( slide, ref );
this.slides.splice( index, 0, slide );
} else {
append( this.list, slide );
this.slides.push( slide );
}
}
},
/**
* Remove a slide from a slider.
* Need to refresh Splide after removing a slide.
*
* @param index - Slide index.
*/
remove( index ) {
const slides = this.slides.splice( index, 1 );
remove( slides[0] );
},
};
/**
* Initialization.
* Assign ID to some elements if it's not available.
*/
function init() {
Elements.track.id = Elements.track.id || `${ root.id }-track`;
Elements.list.id = Elements.list.id || `${ root.id }-list`;
addClass( root, getClasses() );
}
/**
* Return class names for the root element.
*/
function getClasses() {
const rootClass = classes.root;
const options = Splide.options;
return [
`${ rootClass }--${ options.type }`,
`${ rootClass }--${ options.direction }`,
options.drag ? `${ rootClass }--draggable` : '',
options.isNavigation ? `${ rootClass }--nav` : '',
];
}
/**
* Find parts only from children of the root or track.

@@ -122,17 +174,3 @@ *

/**
* Initialization.
* Assign ID to some elements if it's not available.
*/
function init() {
if ( ! Elements.track.id ) {
Elements.track.id = `${ root.id }-track`;
}
if ( ! Elements.list.id ) {
Elements.list.id = `${ root.id }-list`;
}
}
return Elements;
}

18

src/js/components/keyboard/index.js

@@ -8,4 +8,2 @@ /**

import { subscribe } from "../../utils/dom";
/**

@@ -42,9 +40,2 @@ * Map a key to a slide control.

export default ( Splide ) => {
/**
* Hold functions to remove event listener.
*
* @type {Array|undefined}
*/
let removers;
return {

@@ -58,13 +49,10 @@ /**

Splide.on( 'mounted updated', () => {
if ( removers ) {
removers[ 0 ]();
removers = undefined;
}
Splide.off( 'keydown', Splide.root );
if ( Splide.options.keyboard ) {
removers = subscribe( Splide.root, 'keydown', e => {
Splide.on( 'keydown', e => {
if ( map[ e.key ] ) {
Splide.go( map[ e.key ] );
}
} );
}, Splide.root );
}

@@ -71,0 +59,0 @@ } );

49

src/js/components/layout/index.js

@@ -13,3 +13,3 @@ /**

import { throttle } from '../../utils/time';
import { subscribe, applyStyle } from '../../utils/dom';
import { applyStyle, removeAttribute } from '../../utils/dom';

@@ -48,2 +48,9 @@ /**

/**
* Store the track element.
*
* @type {Element}
*/
let track;
/**
* Store all Slide objects.

@@ -85,4 +92,4 @@ *

mount() {
list = Elements.list;
Slides = Components.Slides.getSlides( true, true );
list = Elements.list;
track = Elements.track;

@@ -94,2 +101,11 @@ bind();

/**
* Destroy.
*/
destroy() {
Elements.slides
.concat( [ list, track ] )
.forEach( elm => { removeAttribute( elm, 'style' ) } );
},
/**
* Return slider width without padding.

@@ -184,2 +200,4 @@ *

Slides = Components.Slides.getSlides( true, true );
if ( isVertical ) {

@@ -195,5 +213,5 @@ Resolver = Vertical( Splide, Components, options );

for ( const i in Slides ) {
applyStyle( Slides[ i ].slide, { [ Resolver.marginProp ]: unit( Resolver.gap ) } )
}
Slides.forEach( Slide => {
applyStyle( Slide.slide, { [ Resolver.marginProp ]: unit( Resolver.gap ) } )
} );

@@ -208,5 +226,6 @@ resize();

function bind() {
const throttledResize = throttle( () => { Splide.emit( 'resize' ) }, THROTTLE );
subscribe( window, 'resize', throttledResize );
Splide.on( 'mounted resize', resize ).on( 'updated', init );
Splide
.on( 'resize', throttle( () => { Splide.emit( 'resize' ) }, THROTTLE ), window )
.on( 'mounted resize', resize )
.on( 'updated', init );
}

@@ -219,3 +238,3 @@

applyStyle( list, { width: unit( Layout.listWidth ), height: unit( Layout.listHeight ) } );
applyStyle( Components.Elements.track, { height: unit( Layout.height ) } );
applyStyle( track, { height: unit( Layout.height ) } );

@@ -225,8 +244,6 @@ const slideWidth = unit( Resolver.slideWidth );

for ( let i in Slides ) {
const { slide, container } = Slides[ i ];
applyStyle( container, { height: slideHeight } );
applyStyle( slide, { width: slideWidth, height: ! container ? slideHeight : '' } );
}
Slides.forEach( Slide => {
applyStyle( Slide.container, { height: slideHeight } );
applyStyle( Slide.slide, { width: slideWidth, height: ! Slide.container ? slideHeight : '' } );
} );
}

@@ -233,0 +250,0 @@

28

src/js/components/lazyload/index.js

@@ -9,3 +9,3 @@ /**

import { STATUS_CLASSES } from '../../constants/classes';
import { create, find, addClass, removeClass, setAttribute, getAttribute, applyStyle } from '../../utils/dom';
import { create, remove, append, find, addClass, removeClass, setAttribute, getAttribute, applyStyle } from '../../utils/dom';

@@ -59,2 +59,9 @@ /**

/**
* Whether to stop sequential load.
*
* @type {boolean}
*/
let stop = false;
/**
* Lazyload component object.

@@ -89,8 +96,13 @@ *

} else {
Splide
.on( 'mounted', () => { check( Splide.index ) } )
.on( `moved.${ name }`, index => { check( index ) } );
Splide.on( `mounted moved.${ name }`, index => { check( index || Splide.index ) } );
}
}
},
/**
* Destroy.
*/
destroy() {
stop = true;
},
};

@@ -100,3 +112,3 @@

* Check how close each image is from the active slide and
* determine whether to start loading or not according to the distance.
* determine whether to start loading or not, according to the distance.
*

@@ -134,3 +146,3 @@ * @param {number} index - Current index.

const spinner = create( 'span', { class: Splide.classes.spinner } );
img.parentElement.appendChild( spinner );
append( img.parentElement, spinner );

@@ -167,3 +179,3 @@ img.onload = () => { loaded( img, spinner, Slide, false ) };

if ( ! error ) {
img.parentElement.removeChild( spinner );
remove( spinner );
applyStyle( img, { visibility: 'visible' } );

@@ -173,3 +185,3 @@ Splide.emit( `${ name }:loaded`, img );

if ( isSequential ) {
if ( isSequential && ! stop ) {
loadNext();

@@ -176,0 +188,0 @@ }

7

src/js/components/options/index.js

@@ -11,2 +11,3 @@ /**

import { getAttribute } from "../../utils/dom";
import { CREATED } from "../../constants/states";

@@ -38,3 +39,3 @@ /**

} catch ( e ) {
error( '"data-splide" must be a valid JSON.' );
error( e.message );
}

@@ -48,3 +49,5 @@ }

mount() {
Splide.index = Splide.options.start;
if ( Splide.State.is( CREATED ) ) {
Splide.index = Splide.options.start;
}
},

@@ -51,0 +54,0 @@

35

src/js/components/pagination/index.js

@@ -8,4 +8,3 @@ /**

import { create, addClass, removeClass } from '../../utils/dom';
import { subscribe } from '../../utils/dom';
import { create, remove, append, addClass, removeClass } from '../../utils/dom';
import { STATUS_CLASSES } from '../../constants/classes';

@@ -75,3 +74,3 @@

parent = Splide.options.pagination === 'slider' && slider ? slider : Splide.root;
parent.appendChild( data.list );
append( parent, data.list );

@@ -86,3 +85,2 @@ bind();

const index = Splide.index;
Splide.emit( `${ name }:mounted`, data, this.getItem( index ) );

@@ -97,8 +95,10 @@ update( index, -1 );

destroy() {
if ( data && data.list ) {
parent.removeChild( data.list );
remove( data.list );
if ( data.items ) {
data.items.forEach( item => { Splide.off( 'click', item.button ) } );
}
Splide.off( ATTRIBUTES_UPDATE_EVENT );
data = null;
Splide.off( ATTRIBUTES_UPDATE_EVENT ).off( UPDATE_EVENT );
data = {};
},

@@ -150,11 +150,12 @@

function update( index, prevIndex ) {
const prev = Pagination.getItem( prevIndex );
const curr = Pagination.getItem( index );
const prev = Pagination.getItem( prevIndex );
const curr = Pagination.getItem( index );
const active = STATUS_CLASSES.active;
if ( prev ) {
removeClass( prev.button, STATUS_CLASSES.active );
removeClass( prev.button, active );
}
if ( curr ) {
addClass( curr.button, STATUS_CLASSES.active );
addClass( curr.button, active );
}

@@ -179,9 +180,9 @@

.map( ( Slide, page ) => {
const li = create( 'li', {} );
const button = create( 'button', { class: classes.page } );
const li = create( 'li', {} );
const button = create( 'button', { class: classes.page } );
li.appendChild( button );
list.appendChild( li );
append( li, button );
append( list, li );
subscribe( button, 'click', () => { Splide.go( `>${ page }` ) } );
Splide.on( 'click', () => { Splide.go( `>${ page }` ) }, button );

@@ -188,0 +189,0 @@ return { li, button, page, Slides: Slides.getSlidesByPage( page ) };

57

src/js/components/slides/index.js

@@ -28,9 +28,14 @@ /**

/**
* Store slide instances.
* Store Slide objects.
*
* @type {Array}
*/
let Slides = [];
let SlideObjects = [];
return {
/**
* Slides component object.
*
* @type {Object}
*/
const Slides = {
/**

@@ -40,10 +45,19 @@ * Called when the component is mounted.

mount() {
slides = Components.Elements.slides;
init();
for ( const i in slides ) {
this.register( parseInt( i ), -1, slides[ i ] );
}
Splide.on( 'refresh', () => {
this.destroy();
init();
} );
},
/**
* Destroy.
*/
destroy() {
SlideObjects.forEach( Slide => { Slide.destroy() } );
SlideObjects = [];
},
/**
* Register a slide to create a Slide object and handle its behavior.

@@ -56,5 +70,5 @@ *

register( index, realIndex, slide ) {
const slideObject = Slide( index, realIndex, slide, Splide );
slideObject.init();
Slides.push( slideObject );
const SlideObject = Slide( index, realIndex, slide, Splide );
SlideObject.mount();
SlideObjects.push( SlideObject );
},

@@ -64,2 +78,3 @@

* Return the Slide object designated by the index.
* Note that "find" is not supported by IE.
*

@@ -69,3 +84,3 @@ * @return {Object|undefined} - A Slide object if available. Undefined if not.

getSlide( index ) {
return Slides.filter( Slide => Slide.index === index )[ 0 ];
return SlideObjects.filter( Slide => Slide.index === index )[0];
},

@@ -83,6 +98,6 @@

if ( objects ) {
return includeClones ? Slides : Slides.filter( Slide => ! Slide.isClone );
return includeClones ? SlideObjects : SlideObjects.filter( Slide => ! Slide.isClone );
}
return includeClones ? Slides.map( Slide => Slide.slide ) : slides;
return includeClones ? SlideObjects.map( Slide => Slide.slide ) : slides;
},

@@ -102,3 +117,3 @@

return Slides.filter( ( { index } ) => idx <= index && index < idx + max );
return SlideObjects.filter( ( { index } ) => idx <= index && index < idx + max );
},

@@ -116,3 +131,3 @@

/**
* Return "Slides" length including clones.
* Return "SlideObjects" length including clones.
*

@@ -122,5 +137,15 @@ * @return {number} - Slide length including clones.

get total() {
return Slides.length;
return SlideObjects.length;
},
};
/**
* Initialization.
*/
function init() {
slides = Components.Elements.slides;
slides.forEach( ( slide, index ) => { Slides.register( index, -1, slide ) } );
}
return Slides;
}

88

src/js/components/slides/slide.js

@@ -11,2 +11,4 @@ /**

import { STATUS_CLASSES } from '../../constants/classes';
import { CREATED } from "../../constants/states";
import { each } from "../../utils/object";

@@ -24,4 +26,19 @@

*/
export default function Slide( index, realIndex, slide, Splide ) {
return {
export default ( index, realIndex, slide, Splide ) => {
/**
* Events when the slide status is updated.
* Append a namespace to remove listeners later.
*
* @type {string}
*/
const statusUpdateEvents = [
'mounted', 'updated', 'resize', Splide.options.updateOnMove ? 'move' : 'moved',
].reduce( ( acc, cur ) => acc + cur + '.slide ', '' ).trim();
/**
* Slide sub component object.
*
* @type {Object}
*/
const Slide = {
/**

@@ -65,4 +82,4 @@ * Slide element.

*/
init() {
if ( ! slide.id && ! this.isClone ) {
mount() {
if ( ! this.isClone ) {
const number = index + 1;

@@ -72,31 +89,24 @@ slide.id = `${ Splide.root.id }-slide${ number < 10 ? '0' + number : number }`;

const events = 'mounted updated ' + ( Splide.options.updateOnMove ? 'move' : 'moved' );
Splide.on( statusUpdateEvents, () => this.update() );
Splide
.on( events, () => {
this.update( this.isActive(), false );
this.update( this.isVisible(), true );
} )
.on( 'resize', () => { this.update( this.isVisible(), true ) } );
// Update status immediately on refresh.
if ( ! Splide.State.is( CREATED ) ) {
this.update();
}
},
/**
* Update classes for activity or visibility.
*
* @param {boolean} active - Is active/visible or not.
* @param {boolean} forVisibility - Toggle classes for activity or visibility.
* Destroy.
*/
update( active, forVisibility ) {
const type = forVisibility ? 'visible' : 'active';
const className = STATUS_CLASSES[ type ];
destroy() {
Splide.off( statusUpdateEvents );
each( STATUS_CLASSES, className => { removeClass( slide, className ) } );
},
if ( active ) {
addClass( slide, className );
Splide.emit( `${ type }`, this );
} else {
if ( hasClass( slide, className ) ) {
removeClass( slide, className );
Splide.emit( `${ forVisibility ? 'hidden' : 'inactive' }`, this );
}
}
/**
* Update active and visible status.
*/
update() {
update( this.isActive(), false );
update( this.isVisible(), true );
},

@@ -157,2 +167,26 @@

};
/**
* Update classes for activity or visibility.
*
* @param {boolean} active - Is active/visible or not.
* @param {boolean} forVisibility - Toggle classes for activity or visibility.
*/
function update( active, forVisibility ) {
const type = forVisibility ? 'visible' : 'active';
const className = STATUS_CLASSES[ type ];
if ( active ) {
addClass( slide, className );
Splide.emit( `${ type }`, Slide );
} else {
if ( hasClass( slide, className ) ) {
removeClass( slide, className );
Splide.emit( `${ forVisibility ? 'hidden' : 'inactive' }`, Slide );
}
}
}
return Slide;
}

24

src/js/components/sync/index.js

@@ -8,3 +8,2 @@ /**

import { subscribe } from '../../utils/dom';
import { LOOP } from '../../constants/types';

@@ -119,15 +118,12 @@ import { IDLE } from "../../constants/states";

Slides.forEach( Slide => {
const slide = Slide.slide;
Slides.forEach( ( { slide, index } ) => {
/*
* Listen mouseup and touchend events to handle click.
* Need to check "IDLE" status because slides can be moving by Drag component.
*/
subscribe( slide, 'mouseup touchend', e => {
Splide.on( 'mouseup touchend', e => {
// Ignore a middle or right click.
if ( ! e.button || e.button === 0 ) {
moveSibling( Slide.index );
moveSibling( index );
}
} );
}, slide );

@@ -138,11 +134,17 @@ /*

*/
subscribe( slide, 'keyup', e => {
Splide.on( 'keyup', e => {
if ( TRIGGER_KEYS.indexOf( e.key ) > -1 ) {
e.preventDefault();
moveSibling( Slide.index );
moveSibling( index );
}
}, { passive: false } );
}, slide, { passive: false } );
} );
}
/**
* Move the sibling to the given index.
* Need to check "IDLE" status because slides can be moving by Drag component.
*
* @param {number} index - Target index.
*/
function moveSibling( index ) {

@@ -149,0 +151,0 @@ if ( Splide.State.is( IDLE ) ) {

13

src/js/components/track/index.js

@@ -52,2 +52,9 @@ /**

/**
* Whether the slider type is FADE or not.
*
* @type {boolean}
*/
const isFade = Splide.is( FADE );
return {

@@ -67,3 +74,3 @@ /**

mounted() {
if ( ! Splide.is( FADE ) ) {
if ( ! isFade ) {
Splide.on( 'mounted resize updated', () => { this.jump( Splide.index ) } );

@@ -90,3 +97,3 @@ }

if ( Math.abs( newPosition - currPosition ) >= 1 || Splide.is( FADE ) ) {
if ( Math.abs( newPosition - currPosition ) >= 1 || isFade ) {
Components.Transition.start( destIndex, newIndex, this.toCoord( newPosition ), () => {

@@ -111,3 +118,3 @@ this.end( destIndex, newIndex, prevIndex, silently );

if ( ! Splide.is( FADE ) ) {
if ( ! isFade ) {
this.jump( newIndex );

@@ -114,0 +121,0 @@ }

77

src/js/core/event.js

@@ -8,5 +8,3 @@ /**

import { each } from "../utils/object";
/**

@@ -17,7 +15,7 @@ * The function for providing an Event object simply managing events.

/**
* Store all handlers.
* Store all event data.
*
* @type {Object}
* @type {Array}
*/
const handlers = {};
let data = [];

@@ -28,18 +26,15 @@ return {

*
* @param {string} event - An event name. Use space to separate multiple events.
* Also, namespace is accepted by dot, such as 'resize.{namespace}'.
* @param {function} handler - A callback function.
* @param {string} events - An event name. Use space to separate multiple events.
* Also, namespace is accepted by dot, such as 'resize.{namespace}'.
* @param {function} handler - A callback function.
* @param {Element} elm - Optional. Native event will be listened to when this arg is provided.
* @param {Object} options - Optional. Options for addEventListener.
*/
on( event, handler ) {
event.split( ' ' ).forEach( name => {
// Prevent an event with a namespace from being registered twice.
if ( name.indexOf( '.' ) > -1 && handlers[ name ] ) {
return;
on( events, handler, elm = null, options = {} ) {
events.split( ' ' ).forEach( event => {
if ( elm ) {
elm.addEventListener( event, handler, options );
}
if ( ! handlers[ name ] ) {
handlers[ name ] = [];
}
handlers[ name ].push( handler );
data.push( { event, handler, elm, options } );
} );

@@ -49,8 +44,22 @@ },

/**
* Unsubscribe the given event.
* Unsubscribe the given event(s).
*
* @param {string} event - A event name.
* @param {string} events - A event name or names split by space.
* @param {Element} elm - Optional. removeEventListener() will be called when this arg is provided.
*/
off( event ) {
event.split( ' ' ).forEach( name => delete handlers[ name ] );
off( events, elm = null ) {
events.split( ' ' ).forEach( event => {
for ( let i in data ) {
const item = data[ i ];
if ( item && item.event === event && item.elm === elm ) {
if ( elm ) {
elm.removeEventListener( event, item.handler, item.options );
}
delete data[ i ];
break;
}
}
} );
},

@@ -60,2 +69,3 @@

* Emit an event.
* This method is only for custom events.
*

@@ -66,13 +76,22 @@ * @param {string} event - An event name.

emit( event, ...args ) {
each( handlers, ( callbacks, name ) => {
if ( name.split( '.' )[ 0 ] === event ) {
if ( callbacks ) {
for ( const i in callbacks ) {
callbacks[ i ]( ...args );
}
}
data.forEach( item => {
if ( ! item.elm && item.event.split( '.' )[0] === event ) {
item.handler( ...args );
}
} );
},
/**
* Clear event data.
*/
destroy() {
data.forEach( item => {
if ( item.elm ) {
item.elm.removeEventListener( item.event, item.handler, item.options );
}
} );
data = [];
},
};
}

110

src/js/splide.js

@@ -16,3 +16,3 @@ /**

import { find } from './utils/dom';
import { merge, each } from './utils/object';
import { merge, each, values } from './utils/object';
import * as STATES from './constants/states';

@@ -36,3 +36,3 @@

constructor( root, options = {}, Components = {} ) {
this.root = root instanceof HTMLElement ? root : find( document, root );
this.root = root instanceof Element ? root : find( document, root );
exist( this.root, 'An invalid root element or selector was given.' );

@@ -45,5 +45,5 @@

this._options = merge( DEFAULTS, options );
this._index = 0;
this._components = Components;
this._o = merge( DEFAULTS, options );
this._i = 0;
this._c = Components;

@@ -64,3 +64,3 @@ this

mount( Extensions = {}, Transition = null ) {
this.Components = compose( this, merge( this._components, Extensions ), Transition );
this.Components = compose( this, merge( this._c, Extensions ), Transition );

@@ -90,6 +90,6 @@ try {

this.State.set( STATES.IDLE );
applyStyle( this.root, { visibility: 'visible' } );
this.emit( 'ready' );
applyStyle( this.root, { visibility: 'visible' } );
return this;

@@ -113,10 +113,12 @@ }

*
* @param {string} event - An event name. Use space to separate multiple events.
* Also, namespace is accepted by dot, such as 'resize.{namespace}'.
* @param {function} handler - A callback function.
* @param {string} events - An event name. Use space to separate multiple events.
* Also, namespace is accepted by dot, such as 'resize.{namespace}'.
* @param {function} handler - A callback function.
* @param {Element} elm - Optional. Native event will be listened to when this arg is provided.
* @param {Object} options - Optional. Options for addEventListener.
*
* @return {Splide} - This instance.
*/
on( event, handler ) {
this.Event.on( event, handler );
on( events, handler, elm = null, options = {} ) {
this.Event.on( events, handler, elm, options );
return this;

@@ -128,8 +130,9 @@ }

*
* @param {string} event - A event name.
* @param {string} events - A event name.
* @param {Element} elm - Optional. removeEventListener() will be called when this arg is provided.
*
* @return {Splide} - This instance.
*/
off( event ) {
this.Event.off( event );
off( events, elm = null ) {
this.Event.off( events, elm );
return this;

@@ -141,4 +144,4 @@ }

*
* @param {string} event - An event name.
* @param {*} args - Any number of arguments passed to handlers.
* @param {string} event - An event name.
* @param {*} args - Any number of arguments passed to handlers.
*/

@@ -160,2 +163,4 @@ emit( event, ...args ) {

}
return this;
}

@@ -171,12 +176,63 @@

is( type ) {
return type === this._options.type;
return type === this._o.type;
}
/**
* Insert a slide.
*
* @param {Element|string} slide - A slide element to be added.
* @param {number} index - A slide will be added at the position.
*/
add( slide, index = -1 ) {
this.Components.Elements.add( slide, index );
this.refresh();
return this;
}
/**
* Remove the slide designated by the index.
*
* @param {number} index - A slide index.
*/
remove( index ) {
this.Components.Elements.remove( index );
this.refresh();
return this;
}
/**
* Destroy all Slide objects and clones and recreate them again.
* And then call "updated" event.
*/
refresh() {
this.emit( 'refresh' ).emit( 'updated', this.options );
return this;
}
/**
* Destroy the Splide.
*/
destroy() {
values( this.Components ).reverse().forEach( component => {
component.destroy && component.destroy();
} );
this.emit( 'destroy' );
// Destroy all event handlers, including ones for native events.
this.Event.destroy();
delete this.Components;
this.State.set( STATES.CREATED );
return this;
}
/**
* Return the current slide index.
*
* @return {number} - The current slide index.
*/
// */
get index() {
return this._index;
return this._i;
}

@@ -190,3 +246,3 @@

set index( index ) {
this._index = parseInt( index );
this._i = parseInt( index );
}

@@ -210,3 +266,3 @@

get options() {
return this._options;
return this._o;
}

@@ -220,6 +276,6 @@

set options( options ) {
this._options = merge( this._options, options );
this._o = merge( this._o, options );
if ( ! this.State.is( STATES.CREATED ) ) {
this.emit( 'updated', this._options );
this.emit( 'updated', this._o );
}

@@ -235,3 +291,3 @@ }

get classes() {
return this._options.classes;
return this._o.classes;
}

@@ -246,4 +302,4 @@

get i18n() {
return this._options.i18n;
return this._o.i18n;
}
}

6

src/js/transitions/slide/index.js

@@ -8,3 +8,3 @@ /**

import { subscribe, applyStyle } from '../../utils/dom';
import { applyStyle } from '../../utils/dom';

@@ -42,7 +42,7 @@

subscribe( list, 'transitionend', e => {
Splide.on( 'transitionend', e => {
if ( e.target === list && endCallback ) {
endCallback();
}
} );
}, list );
},

@@ -49,0 +49,0 @@

132

src/js/utils/dom.js

@@ -9,3 +9,5 @@ /**

import { each, values } from './object';
import { toArray } from "./utils";
/**

@@ -21,3 +23,3 @@ * Find the first element matching the given selector.

export function find( elm, selector ) {
return elm && selector ? elm.querySelector( selector.split( ' ' )[ 0 ] ) : null;
return elm && selector ? elm.querySelector( selector.split( ' ' )[0] ) : null;
}

@@ -35,11 +37,5 @@

if ( parent ) {
const children = values( parent.children );
for ( let i in children ) {
const child = children[ i ];
if ( hasClass( child, className.split( ' ' )[ 0 ] ) ) {
return child;
}
}
return values( parent.children ).filter( child => {
return hasClass( child, className.split( ' ' )[0] );
} )[0] || null;
}

@@ -66,2 +62,49 @@

/**
* Convert HTML string to DOM node.
*
* @param {string} html - HTML string.
*
* @return {Node} - A created node.
*/
export function domify( html ) {
const div = create( 'div', {} );
div.innerHTML = html;
return div.firstChild;
}
/**
* Remove a given element from a DOM tree.
*
* @param {Element|Element[]} elms - Element(s) to be removed.
*/
export function remove( elms ) {
toArray( elms ).forEach( elm => { elm && elm.parentElement.removeChild( elm ) } );
}
/**
* Append a child to a given element.
*
* @param {Element} parent - A parent element.
* @param {Element} child - An element to be appended.
*/
export function append( parent, child ) {
if ( parent ) {
parent.appendChild( child );
}
}
/**
* Insert an element before the reference element.
*
* @param {Element|Node} ref - A reference element.
* @param {Element} elm - An element to be inserted.
*/
export function before( elm, ref ) {
if ( elm && ref && ref.parentElement ) {
ref.parentElement.insertBefore( elm, ref );
}
}
/**
* Apply styles to the given element.

@@ -81,12 +124,14 @@ *

/**
* Add classes to the element.
* Add or remove classes to/from the element.
* This function is for internal usage.
*
* @param {Element} elm - An element where classes are added.
* @param {string} classes - Class names being added.
* @param {Element} elm - An element where classes are added.
* @param {string|string[]} classes - Class names being added.
* @param {boolean} remove - Whether to remove or add classes.
*/
export function addClass( elm, ...classes ) {
function addOrRemoveClasses( elm, classes, remove ) {
if ( elm ) {
classes.forEach( name => {
toArray( classes ).forEach( name => {
if ( name ) {
elm.classList.add( name )
elm.classList[ remove ? 'remove' : 'add' ]( name );
}

@@ -98,11 +143,19 @@ } );

/**
* Add classes to the element.
*
* @param {Element} elm - An element where classes are added.
* @param {string|string[]} classes - Class names being added.
*/
export function addClass( elm, classes ) {
addOrRemoveClasses( elm, classes, false );
}
/**
* Remove a class from the element.
*
* @param {Element} elm - An element where classes are removed.
* @param {string} className - A class name being removed.
* @param {Element} elm - An element where classes are removed.
* @param {string|string[]} classes - A class name being removed.
*/
export function removeClass( elm, className ) {
if ( elm ) {
elm.classList.remove( className )
}
export function removeClass( elm, classes ) {
addOrRemoveClasses( elm, classes, true );
}

@@ -144,7 +197,3 @@

export function getAttribute( elm, name ) {
if ( elm ) {
return elm.getAttribute( name );
}
return null;
return elm ? elm.getAttribute( name ) : null;
}

@@ -155,30 +204,9 @@

*
* @param {Element} elm - An element where an attribute is removed.
* @param {string} name - Attribute name.
* @param {Element} elm - An element where an attribute is removed.
* @param {string|Array} names - Attribute name.
*/
export function removeAttribute( elm, name ) {
export function removeAttribute( elm, names ) {
if ( elm ) {
elm.removeAttribute( name );
toArray( names ).forEach( name => { elm.removeAttribute( name ) } );
}
}
/**
* Listen a native event.
*
* @param {Element|Window} elm - An element or window object.
* @param {string} event - An event name or event names separated with space.
* @param {function} handler - Callback function.
* @param {Object} options - Optional. Options.
*
* @return {function[]} - Functions to stop subscription.
*/
export function subscribe( elm, event, handler, options = {} ) {
if ( elm ) {
return event.split( ' ' ).map( e => {
elm.addEventListener( e, handler, options );
return () => elm.removeEventListener( e, handler );
} );
}
return [];
}

4

src/js/utils/error.js

@@ -32,4 +32,2 @@ /**

* @param {string} message - An error message.
*
* @return {*} - A given subject itself.
*/

@@ -40,4 +38,2 @@ export function exist( subject, message ) {

}
return subject;
}

28

src/js/utils/utils.js

@@ -8,4 +8,14 @@ /**

import { create, applyStyle } from "./dom";
import { create, append, remove, applyStyle } from "./dom";
/**
* Convert the given value to array.
*
* @param {*} value - Any value.
*
* @return {*[]} - Array containing the given value.
*/
export function toArray( value ) {
return Array.isArray( value ) ? value : [ value ];
}

@@ -29,10 +39,10 @@ /**

*
* @param {string} format - The string format.
* @param {string} replacements - Replacements accepting multiple arguments.
* @param {string} format - The string format.
* @param {string|Array} replacements - Replacements accepting multiple arguments.
*
* @returns {string} - Converted string.
*/
export function sprintf( format, ...replacements ) {
export function sprintf( format, replacements ) {
let i = 0;
return format.replace( /%s/g, () => replacements[ i++ ] );
return format.replace( /%s/g, () => toArray( replacements )[ i++ ] );
}

@@ -80,9 +90,9 @@

root.appendChild( div );
append( root, div );
const px = div.clientWidth;
value = div.clientWidth;
root.removeChild( div );
remove( div );
return px;
return value;
}
dist/js/splide.js

Sorry, the diff of this file is too big to display

dist/js/splide.min.js.gz

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc