embla-carousel - npm Package Compare versions

Comparing version 4.2.1 to 4.3.0

embla-carousel.esm.js

@@ -1268,3 +1268,2 @@ function _extends() {
   align: 'center',
-  autoResize: true,
   axis: 'x',
@@ -1285,2 +1284,20 @@ containScroll: '',
 
+function OptionsPseudo(node) {
+  var psuedoString = window.getComputedStyle(node, ':before').content;
+
+  function get() {
+    try {
+      return JSON.parse(psuedoString.slice(1, -1).replace(/\\/g, ''));
+    } catch (error) {} // eslint-disable-line no-empty
+
+
+    return {};
+  }
+
+  var self = {
+    get: get
+  };
+  return self;
+}
+
 function EventEmitter() {
@@ -1333,2 +1350,3 @@ var listeners = {};
 
+  var optionsPseudo;
   var rootNodeSize = 0;
@@ -1339,3 +1357,3 @@ var container;
 
-  function storeElements() {
+  function setupElements() {
     if (!sliderRoot) throw new Error('Missing root node 😢');
@@ -1346,15 +1364,13 @@ var sliderContainer = sliderRoot.querySelector('*');
     slides = Array.prototype.slice.call(container.children);
+    optionsPseudo = OptionsPseudo(sliderRoot);
   }
 
   function activate(partialOptions) {
-    storeElements();
-    options = _extends(options, partialOptions);
+    setupElements();
+    options = _extends(options, partialOptions, optionsPseudo.get());
     engine = Engine(sliderRoot, container, slides, options, events);
     eventStore.add(window, 'resize', debouncedResize);
     engine.translate.to(engine.location);
+    rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
 
-    if (options.autoResize) {
-      rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-    }
-
     if (options.loop) {
@@ -1409,7 +1425,7 @@ if (!engine.slideLooper.canLoop()) {
     var notInView = slidesNotInView(true);
-    notInView.forEach(function (i) {
-      return removeClass(slides[i], selectedClass);
+    notInView.forEach(function (index) {
+      return removeClass(slides[index], selectedClass);
     });
-    inView.forEach(function (i) {
-      return addClass(slides[i], selectedClass);
+    inView.forEach(function (index) {
+      return addClass(slides[index], selectedClass);
     });
@@ -1426,4 +1442,4 @@ }
     removeClass(sliderRoot, options.draggableClass);
-    slides.forEach(function (s) {
-      return removeClass(s, options.selectedClass);
+    slides.forEach(function (slide) {
+      return removeClass(slide, options.selectedClass);
     });
@@ -1458,8 +1474,4 @@ events.off('select', toggleSelectedClass);
     if (!activated) return;
-
-    if (options.autoResize) {
-      var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-      if (rootNodeSize !== size) reActivate();
-    }
-
+    var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
+    if (rootNodeSize !== size) reActivate();
     events.emit('resize');
@@ -1476,4 +1488,4 @@ }
     var inView = slidesInView(target);
-    return engine.slideIndexes.filter(function (i) {
-      return inView.indexOf(i) === -1;
+    return engine.slideIndexes.filter(function (index) {
+      return inView.indexOf(index) === -1;
     });
@@ -1480,0 +1492,0 @@ }

embla-carousel.js

@@ -1270,3 +1270,2 @@ 'use strict';
   align: 'center',
-  autoResize: true,
   axis: 'x',
@@ -1287,2 +1286,20 @@ containScroll: '',
 
+function OptionsPseudo(node) {
+  var psuedoString = window.getComputedStyle(node, ':before').content;
+
+  function get() {
+    try {
+      return JSON.parse(psuedoString.slice(1, -1).replace(/\\/g, ''));
+    } catch (error) {} // eslint-disable-line no-empty
+
+
+    return {};
+  }
+
+  var self = {
+    get: get
+  };
+  return self;
+}
+
 function EventEmitter() {
@@ -1335,2 +1352,3 @@ var listeners = {};
 
+  var optionsPseudo;
   var rootNodeSize = 0;
@@ -1341,3 +1359,3 @@ var container;
 
-  function storeElements() {
+  function setupElements() {
     if (!sliderRoot) throw new Error('Missing root node 😢');
@@ -1348,15 +1366,13 @@ var sliderContainer = sliderRoot.querySelector('*');
     slides = Array.prototype.slice.call(container.children);
+    optionsPseudo = OptionsPseudo(sliderRoot);
   }
 
   function activate(partialOptions) {
-    storeElements();
-    options = _extends(options, partialOptions);
+    setupElements();
+    options = _extends(options, partialOptions, optionsPseudo.get());
     engine = Engine(sliderRoot, container, slides, options, events);
     eventStore.add(window, 'resize', debouncedResize);
     engine.translate.to(engine.location);
+    rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
 
-    if (options.autoResize) {
-      rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-    }
-
     if (options.loop) {
@@ -1411,7 +1427,7 @@ if (!engine.slideLooper.canLoop()) {
     var notInView = slidesNotInView(true);
-    notInView.forEach(function (i) {
-      return removeClass(slides[i], selectedClass);
+    notInView.forEach(function (index) {
+      return removeClass(slides[index], selectedClass);
     });
-    inView.forEach(function (i) {
-      return addClass(slides[i], selectedClass);
+    inView.forEach(function (index) {
+      return addClass(slides[index], selectedClass);
     });
@@ -1428,4 +1444,4 @@ }
     removeClass(sliderRoot, options.draggableClass);
-    slides.forEach(function (s) {
-      return removeClass(s, options.selectedClass);
+    slides.forEach(function (slide) {
+      return removeClass(slide, options.selectedClass);
     });
@@ -1460,8 +1476,4 @@ events.off('select', toggleSelectedClass);
     if (!activated) return;
-
-    if (options.autoResize) {
-      var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-      if (rootNodeSize !== size) reActivate();
-    }
-
+    var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
+    if (rootNodeSize !== size) reActivate();
     events.emit('resize');
@@ -1478,4 +1490,4 @@ }
     var inView = slidesInView(target);
-    return engine.slideIndexes.filter(function (i) {
-      return inView.indexOf(i) === -1;
+    return engine.slideIndexes.filter(function (index) {
+      return inView.indexOf(index) === -1;
     });
@@ -1482,0 +1494,0 @@ }

embla-carousel.umd.js

@@ -1,1 +0,1 @@
-!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(n=n||self).EmblaCarousel=e()}(this,(function(){"use strict";function n(){return(n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n}).apply(this,arguments)}function e(n,e){var t={start:function(){return 0},center:function(n){return r(n)/2},end:r};function r(n){return e-n}return{measure:function(r){return"number"==typeof n?e*Number(n):t[n](r)}}}function t(n){return n?n/Math.abs(n):0}function r(n,e){return Math.abs(n-e)}function o(n,e){for(var t=[],r=0;r<n.length;r+=e)t.push(n.slice(r,r+e));return t}function i(n){return Object.keys(n).map(Number)}function u(n){return n[a(n)]}function a(n){return Math.max(0,n.length-1)}function c(n,e){var t=n.classList;e&&t.contains(e)&&t.remove(e)}function s(n,e){var t=n.classList;e&&!t.contains(e)&&t.add(e)}function f(){var n=[];var e={add:function(t,r,o,i){return void 0===i&&(i=!1),t.addEventListener(r,o,i),n.push((function(){return t.removeEventListener(r,o,i)})),e},removeAll:function(){return n=n.filter((function(n){return n()})),e}};return e}function d(n){var e=n;function t(n){return e/=n,o}function r(n){return"number"==typeof n?n:n.get()}var o={add:function(n){return e+=r(n),o},divide:t,get:function(){return e},multiply:function(n){return e*=n,o},normalize:function(){return 0!==e&&t(e),o},set:function(n){return e=r(n),o},subtract:function(n){return e-=r(n),o}};return o}function l(n,e,o,i,u,a,c,s,l,p,g,m,v,h){var x=n.scroll,y=n.cross,b=["INPUT","SELECT","TEXTAREA"],w=d(0),M=d(0),E=d(0),S=f(),A=f(),T={mouse:2.5,touch:3.5},C={mouse:5,touch:7},D=u?5:12,P=!1,B=!1,z=!1,I=!1;function L(n){if(!(I="mousedown"===n.type)||0===n.button){var e,t,u=r(i.get(),c.get())>=2,s=I||!u,f=(e=n.target,t=e.nodeName||"",!(b.indexOf(t)>-1)),d=u||I&&f;P=!0,a.pointerDown(n),E.set(i),i.set(c),p.useBaseMass().useSpeed(80),function(){var n=I?document:o;A.add(n,"touchmove",k).add(n,"touchend",O).add(n,"mousemove",k).add(n,"mouseup",O)}(),w.set(a.readPoint(n,x)),M.set(a.readPoint(n,y)),h.emit("pointerDown"),s&&(z=!1),d&&n.preventDefault()}}function k(n){if(!B&&!I){if(!n.cancelable)return O();var t=a.readPoint(n,x).get(),o=a.readPoint(n,y).get(),u=r(t,w.get()),c=r(o,M.get());if(!(B=u>c)&&!z)return O()}var f=a.pointerMove(n);!z&&f&&(z=!0),s.start(),i.add(e.applyTo(f)),n.preventDefault()}function O(){var n=a.pointerUp()*(u?C:T)[I?"mouse":"touch"],o=function(n){var e=!(g.byDistance(0,!1).index!==m.get())&&Math.abs(n)>4,r=n+c.get();if(e&&!u&&!v.reachedAny(r)){var o=m.clone().add(-1*t(n));return g.byIndex(o.get(),0).distance}return g.byDistance(n,!u).distance}(e.applyTo(n)),s=function(n,e){if(0===n||0===e)return 0;if(Math.abs(n)<=Math.abs(e))return 0;var t=r(Math.abs(n),Math.abs(e));return Math.abs(t/n)}(n,o);r(i.get(),E.get())>=.5&&!I&&(z=!0),B=!1,P=!1,A.removeAll(),p.useSpeed(D+D*s),l.distance(o,!u),I=!1,h.emit("pointerUp")}function N(n){z&&n.preventDefault()}return{addActivationEvents:function(){var n=o;S.add(n,"touchmove",(function(){})).add(n,"touchend",(function(){})).add(n,"touchstart",L).add(n,"mousedown",L).add(n,"touchcancel",O).add(n,"contextmenu",O).add(n,"click",N)},clickAllowed:function(){return!z},pointerDown:function(){return P},removeAllEvents:function(){S.removeAll(),A.removeAll()}}}function p(n,e){var t=Math.abs(n-e);function r(e){return e<n}function o(n){return n>e}function i(n){return r(n)||o(n)}return{constrain:function(t){return i(t)?r(t)?n:e:t},length:t,loop:function(t){return i(t)?r(t)?e:n:t},max:e,min:n,reachedAny:i,reachedMax:o,reachedMin:r,removeOffset:function(i){if(n===e)return i;for(;r(i);)i+=t;for(;o(i);)i-=t;return i}}}function g(n,e,r){var o,i,u=(o=2,i=Math.pow(10,o),function(n){return Math.round(n*i)/i}),a=d(0),c=d(0),s=d(0),f=0,l=e,p=r;function g(n){return l=n,v}function m(n){return p=n,v}var v={direction:function(){return f},seek:function(e){s.set(e).subtract(n);var r,o,i,u=(r=s.get(),(i=0)+(r-(o=0))/(100-o)*(l-i));return f=t(s.get()),s.normalize().multiply(u).subtract(a),function(n){n.divide(p),c.add(n)}(s),v},settle:function(e){var t=e.get()-n.get(),r=!u(t);return r&&n.set(e),r},update:function(){a.add(c),n.add(a),c.multiply(0)},useBaseMass:function(){return m(r)},useBaseSpeed:function(){return g(e)},useMass:m,useSpeed:g};return v}function m(n,e,t){var r=!1;return{constrain:function(o,i){if(function(t){return!r&&(!!n.reachedAny(t.get())&&!!n.reachedAny(e.get()))}(o)){var u=i?.7:.4,a=o.get()-e.get();o.subtract(a*u),!i&&Math.abs(a)<10&&(o.set(n.constrain(o.get())),t.useSpeed(10).useMass(3))}},toggleActive:function(n){r=!n}}}function v(n,e,t,r,o){var i=p(-e+n,t[0]),a=r.map(i.constrain);return{snapsContained:function(){if(e<=n)return[i.max];if("keepSnaps"===o)return a;var t=function(){var n=a[0],e=u(a),t=a.lastIndexOf(n),r=a.indexOf(e)+1;return p(t,r)}(),r=t.min,c=t.max;return a.slice(r,c)}()}}function h(n,e,t,r){var o=p(t.min+e.measure(.1),t.max+e.measure(.1)),i=o.reachedMin,u=o.reachedMax;return{loop:function(e,t){if(function(n){return 1===n?u(r.get()):-1===n&&i(r.get())}(t)){var o=n*(-1*t);e.forEach((function(n){return n.add(o)}))}}}}function x(n){var e=n.max,t=n.length;return{get:function(n){return(n-e)/-t}}}function y(n,e,t,r,i,a){var c,s,f=n.startEdge,d=n.endEdge,l=i.map((function(n){return r[f]-n[f]})).map(t.measure).map((function(n){return-Math.abs(n)})),p=(c=o(l,a).map((function(n){return n[0]})),s=o(i,a).map((function(n){return u(n)[d]-n[0][f]})).map(t.measure).map(Math.abs).map(e.measure),c.map((function(n,e){return n+s[e]})));return{snaps:l,snapsAligned:p}}function b(n,e,t,r,o,i){var u=o.reachedMax,a=o.reachedAny,c=o.removeOffset;function s(n,e){return Math.abs(n)<Math.abs(e)?n:e}function f(n,t){var o=n,i=n+r,u=n-r;if(!e)return o;if(!t)return s(s(o,i),u);var a=s(o,1===t?i:u);return Math.abs(a)*t}return{byDistance:function(r,o){var s=i.get()+r,d=function(n){var e=c(n);return{index:t.map((function(n){return n-e})).map((function(n){return f(n,0)})).map((function(n,e){return{diff:n,index:e}})).sort((function(n,e){return Math.abs(n.diff)-Math.abs(e.diff)}))[0].index,distance:e}}(s),l=function(t,r){if(!(!e&&a(t)))return r;var o=n.min,i=n.max;return u(t)?o:i}(s,d.index),p=!e&&a(s);return!o||p?{index:l,distance:r}:{index:l,distance:r+f(t[l]-d.distance,0)}},byIndex:function(n,e){return{index:n,distance:f(t[n]-i.get(),e)}},shortcut:f}}function w(n,e,t,r,o,u,a){var c,s=i(r),f=i(r).reverse(),d=(c=o[0]-1,g(p(f,c),"end")).concat(function(){var n=e-o[0]-1;return g(p(s,n),"start")}());function l(n,e){return n.reduce((function(n,e){return n-r[e]}),e)}function p(n,e){return n.reduce((function(n,t){return l(n,e)>0?n.concat([t]):n}),[])}function g(n,e){var r="start"===e,o=r?-t:t,i=u.findSlideBounds(o);return n.map((function(n){var e=r?0:-t,o=r?t:0,u=i.filter((function(e){return e.index===n}))[0][r?"end":"start"];return{point:u,getTarget:function(){return a.get()>u?e:o},index:n,location:-1}}))}return{canLoop:function(){return d.every((function(n){var t=n.index;return l(s.filter((function(n){return n!==t})),e)<=0}))},clear:function(e){d.forEach((function(t){var r=t.index;e[r].style[n.startEdge]=""}))},loop:function(e){d.forEach((function(t){var r=t.getTarget,o=t.location,i=t.index,u=r();u!==o&&(e[i].style[n.startEdge]=u+"%",t.location=u)}))},loopPoints:d}}function M(n,e,t){var r=f(),o=r.removeAll,i=0;function u(n){9===n.keyCode&&(i=(new Date).getTime())}function a(o,u){r.add(o,"focus",(function(){if(!((new Date).getTime()-i>10)){n.scrollLeft=0;var r=Math.floor(u/t);e.index(r,0)}}),!0)}return{addActivationEvents:function(n){r.add(document,"keydown",u,!1),n.forEach(a)},removeAllEvents:o}}function E(n,e,t){var r=t.style,o="x"===n.scroll?function(n){return"translate3d("+n+"%,0px,0px)"}:function(n){return"translate3d(0px,"+n+"%,0px)"},i=!1;return{clear:function(){r.transform=""},to:function(n){i||(r.transform=o(e.applyTo(n.get())))},toggleActive:function(n){i=!n}}}function S(n,r,o,c,s){var f,S=c.align,A=c.axis,T=c.direction,C=c.startIndex,D=c.inViewThreshold,P=c.loop,B=c.speed,z=c.dragFree,I=c.slidesToScroll,L=c.containScroll,k=r.getBoundingClientRect(),O=o.map((function(n){return n.getBoundingClientRect()})),N=function(n){var e="rtl"===n?-1:1;return{applyTo:function(n){return n*e}}}(T),F=function(n,e){var t="y"===n?"y":"x";return{scroll:t,cross:"y"===n?"x":"y",startEdge:"y"===t?"top":"rtl"===e?"right":"left",endEdge:"y"===t?"bottom":"rtl"===e?"left":"right",measureSize:function(n){var e=n.width,r=n.height;return"x"===t?e:r}}}(A,T),R=(f=F.measureSize(k),{measure:function(n){return 0===f?0:n/f*100},totalPercent:100}),U=R.totalPercent,V=e(S,U),H=function(n,e,t,r,o){var i=n.measureSize,c=n.startEdge,s=n.endEdge,f=r.map(i);return{slideSizes:f.map(e.measure),slideSizesWithGaps:r.map((function(n,e,r){var i=e===a(r),d=window.getComputedStyle(u(t)),l=parseFloat(d.getPropertyValue("margin-"+s));return i?f[e]+(o?l:0):r[e+1][c]-n[c]})).map(e.measure).map(Math.abs)}}(F,R,o,O,P),j=H.slideSizes,G=H.slideSizesWithGaps,q=y(F,V,R,k,O,I),W=q.snaps,X=q.snapsAligned,Y=-1*u(W)+u(G),J=v(U,Y,W,X,L).snapsContained,K=!P&&""!==L?J:X,Q=function(n,e,t){var r,o;return{limit:(r=e[0],o=u(e),p(t?r-n:o,r))}}(Y,K,P).limit,Z=function n(e,r,o){var i=e.min,u=e.max,a=e[r?"loop":"constrain"],c=a(o);function s(){return c}function f(n){return c=a(n),d}var d={add:function n(e){if(0!==e){var r=t(e);return f(s()+r),n(e+-1*r)}return d},clone:function(){return n(e,r,s())},get:s,max:u,min:i,set:f};return d}(p(0,a(K)),P,C),$=Z.clone(),_=i(o),nn=function(n){var e=0;function t(n,t){return function(){n===!!e&&t()}}function r(){e=window.requestAnimationFrame(n)}return{proceed:t(!0,r),start:t(!1,r),stop:t(!0,(function(){window.cancelAnimationFrame(e),e=0}))}}((function(){P||fn.scrollBounds.constrain(rn,fn.dragHandler.pointerDown()),fn.scrollBody.seek(rn).update();var n=fn.scrollBody.settle(rn);n&&!fn.dragHandler.pointerDown()&&(fn.animation.stop(),s.emit("settle")),n||s.emit("scroll"),P&&(fn.scrollLooper.loop(on,fn.scrollBody.direction()),fn.slideLooper.loop(o)),fn.translate.to(tn),fn.animation.proceed()})),en=K[Z.get()],tn=d(en),rn=d(en),on=[tn,rn],un=g(tn,B,1),an=b(Z,P,K,Y,Q,rn),cn=function(n,e,t,r,o,i){function u(r){var u=r.distance,a=r.index!==e.get();u&&(n.start(),o.add(u)),a&&(t.set(e.get()),e.set(r.index),i.emit("select"))}return{distance:function(n,e){u(r.byDistance(n,e))},index:function(n,t){var o=e.clone().set(n);u(r.byIndex(o.get(),t))}}}(nn,Z,$,an,rn,s),sn=function(n,e,t,r,o,i){var u=Math.min(Math.max(i,.01),.99),a=(o?[0,e,-e]:[0]).reduce((function(n,e){return n.concat(c(e,u))}),[]);function c(e,o){var i=t.map((function(n){return n*(o||0)}));return r.map((function(r,o){return{start:r-t[o]+i[o]+e,end:r+n-i[o]+e,index:o}}))}return{check:function(n){return a.reduce((function(e,t){var r=t.index,o=t.start,i=t.end;return!(-1!==e.indexOf(r))&&(o<n&&i>n)?e.concat([r]):e}),[])},findSlideBounds:c}}(U,Y,j,W,P,D),fn={animation:nn,axis:F,direction:N,dragHandler:l(F,N,n,rn,z,function(n,e){var t=n.scroll,r={x:"clientX",y:"clientY"},o=d(0),i=d(0),u=d(0),a=d(0),c=[],s=(new Date).getTime(),f=!1;function l(n,e){f=!n.touches;var t=r[e],o=f?n[t]:n.touches[0][t];return a.set(o)}return{pointerDown:function(n){var r=l(n,t);return o.set(r),u.set(r),e.measure(o.get())},pointerMove:function(n){var r=l(n,t),o=(new Date).getTime(),a=o-s;return a>=10&&(a>=100&&(c=[]),c.push(r.get()),s=o),i.set(r).subtract(u),u.set(r),e.measure(i.get())},pointerUp:function(){var n=(new Date).getTime()-s,t=u.get(),r=c.slice(-5).map((function(n){return t-n})).sort((function(n,e){return Math.abs(n)<Math.abs(e)?1:-1}))[0];return u.set(n>100||!r?0:r),c=[],e.measure(u.get())},readPoint:l}}(F,R),tn,nn,cn,un,an,Z,Q,s),pxToPercent:R,index:Z,indexPrevious:$,limit:Q,location:tn,options:c,scrollBody:un,scrollBounds:m(Q,tn,un),scrollLooper:h(Y,R,Q,tn),scrollProgress:x(Q),scrollSnaps:K,scrollTarget:an,scrollTo:cn,slideFocus:M(n,cn,I),slideLooper:w(F,U,Y,G,K,sn,tn),slidesInView:sn,slideIndexes:_,target:rn,translate:E(F,N,r)};return fn}var A={align:"center",autoResize:!0,axis:"x",containScroll:"",direction:"ltr",dragFree:!1,draggable:!0,draggableClass:"is-draggable",draggingClass:"is-dragging",inViewThreshold:0,loop:!1,selectedClass:"is-selected",slidesToScroll:1,speed:10,startIndex:0};return function(e,t){var r,o,i,u,a,d,l=function(){var n={};function e(e){return n[e]||[]}var t={emit:function(n){return e(n).forEach((function(e){return e(n)})),t},off:function(r,o){return n[r]=e(r).filter((function(n){return n!==o})),t},on:function(r,o){return n[r]=e(r).concat([o]),t}};return t}(),p=f(),g=(r=function(){if(x){if(y.autoResize){var n=u.axis.measureSize(e.getBoundingClientRect());b!==n&&C()}l.emit("resize")}},o=500,i=0,function(){window.clearTimeout(i),i=window.setTimeout(r,o)||0}),m=C,v=l.on,h=l.off,x=!1,y=n({},A),b=0;function w(t){if(function(){if(!e)throw new Error("Missing root node 😢");var n=e.querySelector("*");if(!n)throw new Error("Missing container node 😢");a=n,d=Array.prototype.slice.call(a.children)}(),y=n(y,t),u=S(e,a,d,y,l),p.add(window,"resize",g),u.translate.to(u.location),y.autoResize&&(b=u.axis.measureSize(e.getBoundingClientRect())),y.loop){if(!u.slideLooper.canLoop())return T(),w({loop:!1});u.slideLooper.loop(d)}y.draggable&&a.offsetParent&&d.length&&(u.dragHandler.addActivationEvents(),y.draggableClass&&s(e,y.draggableClass),y.draggingClass&&l.on("pointerDown",M).on("pointerUp",M)),d.length&&u.slideFocus.addActivationEvents(d),y.selectedClass&&(E(),l.on("select",E).on("pointerUp",E)),x||(setTimeout((function(){return l.emit("init")}),0),x=!0)}function M(n){var t=y.draggingClass;"pointerDown"===n?s(e,t):c(e,t)}function E(){var n=y.selectedClass,e=D(!0);P(!0).forEach((function(e){return c(d[e],n)})),e.forEach((function(e){return s(d[e],n)}))}function T(){u.dragHandler.removeAllEvents(),u.slideFocus.removeAllEvents(),u.animation.stop(),p.removeAll(),u.translate.clear(),u.slideLooper.clear(d),c(e,y.draggableClass),d.forEach((function(n){return c(n,y.selectedClass)})),l.off("select",E),l.off("pointerUp",E),l.off("pointerDown",M),l.off("pointerUp",M)}function C(e){if(x){var t=n({startIndex:z()},e);T(),w(t),l.emit("reInit")}}function D(n){var e=u[n?"target":"location"].get(),t=y.loop?"removeOffset":"constrain";return u.slidesInView.check(u.limit[t](e))}function P(n){var e=D(n);return u.slideIndexes.filter((function(n){return-1===e.indexOf(n)}))}function B(n,e){u.scrollBody.useBaseMass().useBaseSpeed(),x&&u.scrollTo.index(n,e||0)}function z(){return u.index.get()}return w(t),{canScrollNext:function(){return u.index.clone().add(1).get()!==z()},canScrollPrev:function(){return u.index.clone().add(-1).get()!==z()},clickAllowed:function(){return u.dragHandler.clickAllowed()},containerNode:function(){return a},dangerouslyGetEngine:function(){return u},destroy:function(){x&&(T(),x=!1,l.emit("destroy"))},off:h,on:v,previousScrollSnap:function(){return u.indexPrevious.get()},reInit:m,rootNode:function(){return e},scrollNext:function(){B(u.index.clone().add(1).get(),-1)},scrollPrev:function(){B(u.index.clone().add(-1).get(),1)},scrollProgress:function(){return u.scrollProgress.get(u.location.get())},scrollSnapList:function(){return u.scrollSnaps.map(u.scrollProgress.get)},scrollTo:B,selectedScrollSnap:z,slideNodes:function(){return d},slidesInView:D,slidesNotInView:P}}}));
+!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(n="undefined"!=typeof globalThis?globalThis:n||self).EmblaCarousel=e()}(this,(function(){"use strict";function n(){return(n=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n}).apply(this,arguments)}function e(n,e){var t={start:function(){return 0},center:function(n){return r(n)/2},end:r};function r(n){return e-n}return{measure:function(r){return"number"==typeof n?e*Number(n):t[n](r)}}}function t(n){return n?n/Math.abs(n):0}function r(n,e){return Math.abs(n-e)}function o(n,e){for(var t=[],r=0;r<n.length;r+=e)t.push(n.slice(r,r+e));return t}function i(n){return Object.keys(n).map(Number)}function u(n){return n[a(n)]}function a(n){return Math.max(0,n.length-1)}function c(n,e){var t=n.classList;e&&t.contains(e)&&t.remove(e)}function s(n,e){var t=n.classList;e&&!t.contains(e)&&t.add(e)}function f(){var n=[];var e={add:function(t,r,o,i){return void 0===i&&(i=!1),t.addEventListener(r,o,i),n.push((function(){return t.removeEventListener(r,o,i)})),e},removeAll:function(){return n=n.filter((function(n){return n()})),e}};return e}function d(n){var e=n;function t(n){return e/=n,o}function r(n){return"number"==typeof n?n:n.get()}var o={add:function(n){return e+=r(n),o},divide:t,get:function(){return e},multiply:function(n){return e*=n,o},normalize:function(){return 0!==e&&t(e),o},set:function(n){return e=r(n),o},subtract:function(n){return e-=r(n),o}};return o}function l(n,e,o,i,u,a,c,s,l,p,g,m,v,h){var x=n.scroll,y=n.cross,b=["INPUT","SELECT","TEXTAREA"],w=d(0),M=d(0),S=d(0),E=f(),A=f(),T={mouse:2.5,touch:3.5},C={mouse:5,touch:7},D=u?5:12,P=!1,B=!1,I=!1,L=!1;function z(n){if(!(L="mousedown"===n.type)||0===n.button){var e,t,u=r(i.get(),c.get())>=2,s=L||!u,f=(e=n.target,t=e.nodeName||"",!(b.indexOf(t)>-1)),d=u||L&&f;P=!0,a.pointerDown(n),S.set(i),i.set(c),p.useBaseMass().useSpeed(80),function(){var n=L?document:o;A.add(n,"touchmove",O).add(n,"touchend",k).add(n,"mousemove",O).add(n,"mouseup",k)}(),w.set(a.readPoint(n,x)),M.set(a.readPoint(n,y)),h.emit("pointerDown"),s&&(I=!1),d&&n.preventDefault()}}function O(n){if(!B&&!L){if(!n.cancelable)return k();var t=a.readPoint(n,x).get(),o=a.readPoint(n,y).get(),u=r(t,w.get()),c=r(o,M.get());if(!(B=u>c)&&!I)return k()}var f=a.pointerMove(n);!I&&f&&(I=!0),s.start(),i.add(e.applyTo(f)),n.preventDefault()}function k(){var n=a.pointerUp()*(u?C:T)[L?"mouse":"touch"],o=function(n){var e=!(g.byDistance(0,!1).index!==m.get())&&Math.abs(n)>4,r=n+c.get();if(e&&!u&&!v.reachedAny(r)){var o=m.clone().add(-1*t(n));return g.byIndex(o.get(),0).distance}return g.byDistance(n,!u).distance}(e.applyTo(n)),s=function(n,e){if(0===n||0===e)return 0;if(Math.abs(n)<=Math.abs(e))return 0;var t=r(Math.abs(n),Math.abs(e));return Math.abs(t/n)}(n,o);r(i.get(),S.get())>=.5&&!L&&(I=!0),B=!1,P=!1,A.removeAll(),p.useSpeed(D+D*s),l.distance(o,!u),L=!1,h.emit("pointerUp")}function N(n){I&&n.preventDefault()}return{addActivationEvents:function(){var n=o;E.add(n,"touchmove",(function(){})).add(n,"touchend",(function(){})).add(n,"touchstart",z).add(n,"mousedown",z).add(n,"touchcancel",k).add(n,"contextmenu",k).add(n,"click",N)},clickAllowed:function(){return!I},pointerDown:function(){return P},removeAllEvents:function(){E.removeAll(),A.removeAll()}}}function p(n,e){var t=Math.abs(n-e);function r(e){return e<n}function o(n){return n>e}function i(n){return r(n)||o(n)}return{constrain:function(t){return i(t)?r(t)?n:e:t},length:t,loop:function(t){return i(t)?r(t)?e:n:t},max:e,min:n,reachedAny:i,reachedMax:o,reachedMin:r,removeOffset:function(i){if(n===e)return i;for(;r(i);)i+=t;for(;o(i);)i-=t;return i}}}function g(n,e,r){var o,i,u=(o=2,i=Math.pow(10,o),function(n){return Math.round(n*i)/i}),a=d(0),c=d(0),s=d(0),f=0,l=e,p=r;function g(n){return l=n,v}function m(n){return p=n,v}var v={direction:function(){return f},seek:function(e){s.set(e).subtract(n);var r,o,i,u=(r=s.get(),(i=0)+(r-(o=0))/(100-o)*(l-i));return f=t(s.get()),s.normalize().multiply(u).subtract(a),function(n){n.divide(p),c.add(n)}(s),v},settle:function(e){var t=e.get()-n.get(),r=!u(t);return r&&n.set(e),r},update:function(){a.add(c),n.add(a),c.multiply(0)},useBaseMass:function(){return m(r)},useBaseSpeed:function(){return g(e)},useMass:m,useSpeed:g};return v}function m(n,e,t){var r=!1;return{constrain:function(o,i){if(function(t){return!r&&(!!n.reachedAny(t.get())&&!!n.reachedAny(e.get()))}(o)){var u=i?.7:.4,a=o.get()-e.get();o.subtract(a*u),!i&&Math.abs(a)<10&&(o.set(n.constrain(o.get())),t.useSpeed(10).useMass(3))}},toggleActive:function(n){r=!n}}}function v(n,e,t,r,o){var i=p(-e+n,t[0]),a=r.map(i.constrain);return{snapsContained:function(){if(e<=n)return[i.max];if("keepSnaps"===o)return a;var t=function(){var n=a[0],e=u(a),t=a.lastIndexOf(n),r=a.indexOf(e)+1;return p(t,r)}(),r=t.min,c=t.max;return a.slice(r,c)}()}}function h(n,e,t,r){var o=p(t.min+e.measure(.1),t.max+e.measure(.1)),i=o.reachedMin,u=o.reachedMax;return{loop:function(e,t){if(function(n){return 1===n?u(r.get()):-1===n&&i(r.get())}(t)){var o=n*(-1*t);e.forEach((function(n){return n.add(o)}))}}}}function x(n){var e=n.max,t=n.length;return{get:function(n){return(n-e)/-t}}}function y(n,e,t,r,i,a){var c,s,f=n.startEdge,d=n.endEdge,l=i.map((function(n){return r[f]-n[f]})).map(t.measure).map((function(n){return-Math.abs(n)})),p=(c=o(l,a).map((function(n){return n[0]})),s=o(i,a).map((function(n){return u(n)[d]-n[0][f]})).map(t.measure).map(Math.abs).map(e.measure),c.map((function(n,e){return n+s[e]})));return{snaps:l,snapsAligned:p}}function b(n,e,t,r,o,i){var u=o.reachedMax,a=o.reachedAny,c=o.removeOffset;function s(n,e){return Math.abs(n)<Math.abs(e)?n:e}function f(n,t){var o=n,i=n+r,u=n-r;if(!e)return o;if(!t)return s(s(o,i),u);var a=s(o,1===t?i:u);return Math.abs(a)*t}return{byDistance:function(r,o){var s=i.get()+r,d=function(n){var e=c(n);return{index:t.map((function(n){return n-e})).map((function(n){return f(n,0)})).map((function(n,e){return{diff:n,index:e}})).sort((function(n,e){return Math.abs(n.diff)-Math.abs(e.diff)}))[0].index,distance:e}}(s),l=function(t,r){if(!(!e&&a(t)))return r;var o=n.min,i=n.max;return u(t)?o:i}(s,d.index),p=!e&&a(s);return!o||p?{index:l,distance:r}:{index:l,distance:r+f(t[l]-d.distance,0)}},byIndex:function(n,e){return{index:n,distance:f(t[n]-i.get(),e)}},shortcut:f}}function w(n,e,t,r,o,u,a){var c,s=i(r),f=i(r).reverse(),d=(c=o[0]-1,g(p(f,c),"end")).concat(function(){var n=e-o[0]-1;return g(p(s,n),"start")}());function l(n,e){return n.reduce((function(n,e){return n-r[e]}),e)}function p(n,e){return n.reduce((function(n,t){return l(n,e)>0?n.concat([t]):n}),[])}function g(n,e){var r="start"===e,o=r?-t:t,i=u.findSlideBounds(o);return n.map((function(n){var e=r?0:-t,o=r?t:0,u=i.filter((function(e){return e.index===n}))[0][r?"end":"start"];return{point:u,getTarget:function(){return a.get()>u?e:o},index:n,location:-1}}))}return{canLoop:function(){return d.every((function(n){var t=n.index;return l(s.filter((function(n){return n!==t})),e)<=0}))},clear:function(e){d.forEach((function(t){var r=t.index;e[r].style[n.startEdge]=""}))},loop:function(e){d.forEach((function(t){var r=t.getTarget,o=t.location,i=t.index,u=r();u!==o&&(e[i].style[n.startEdge]=u+"%",t.location=u)}))},loopPoints:d}}function M(n,e,t){var r=f(),o=r.removeAll,i=0;function u(n){9===n.keyCode&&(i=(new Date).getTime())}function a(o,u){r.add(o,"focus",(function(){if(!((new Date).getTime()-i>10)){n.scrollLeft=0;var r=Math.floor(u/t);e.index(r,0)}}),!0)}return{addActivationEvents:function(n){r.add(document,"keydown",u,!1),n.forEach(a)},removeAllEvents:o}}function S(n,e,t){var r=t.style,o="x"===n.scroll?function(n){return"translate3d("+n+"%,0px,0px)"}:function(n){return"translate3d(0px,"+n+"%,0px)"},i=!1;return{clear:function(){r.transform=""},to:function(n){i||(r.transform=o(e.applyTo(n.get())))},toggleActive:function(n){i=!n}}}function E(n,r,o,c,s){var f,E=c.align,A=c.axis,T=c.direction,C=c.startIndex,D=c.inViewThreshold,P=c.loop,B=c.speed,I=c.dragFree,L=c.slidesToScroll,z=c.containScroll,O=r.getBoundingClientRect(),k=o.map((function(n){return n.getBoundingClientRect()})),N=function(n){var e="rtl"===n?-1:1;return{applyTo:function(n){return n*e}}}(T),F=function(n,e){var t="y"===n?"y":"x";return{scroll:t,cross:"y"===n?"x":"y",startEdge:"y"===t?"top":"rtl"===e?"right":"left",endEdge:"y"===t?"bottom":"rtl"===e?"left":"right",measureSize:function(n){var e=n.width,r=n.height;return"x"===t?e:r}}}(A,T),U=(f=F.measureSize(O),{measure:function(n){return 0===f?0:n/f*100},totalPercent:100}),V=U.totalPercent,H=e(E,V),R=function(n,e,t,r,o){var i=n.measureSize,c=n.startEdge,s=n.endEdge,f=r.map(i);return{slideSizes:f.map(e.measure),slideSizesWithGaps:r.map((function(n,e,r){var i=e===a(r),d=window.getComputedStyle(u(t)),l=parseFloat(d.getPropertyValue("margin-"+s));return i?f[e]+(o?l:0):r[e+1][c]-n[c]})).map(e.measure).map(Math.abs)}}(F,U,o,k,P),j=R.slideSizes,G=R.slideSizesWithGaps,q=y(F,H,U,O,k,L),W=q.snaps,X=q.snapsAligned,J=-1*u(W)+u(G),Y=v(V,J,W,X,z).snapsContained,K=!P&&""!==z?Y:X,Q=function(n,e,t){var r,o;return{limit:(r=e[0],o=u(e),p(t?r-n:o,r))}}(J,K,P).limit,Z=function n(e,r,o){var i=e.min,u=e.max,a=e[r?"loop":"constrain"],c=a(o);function s(){return c}function f(n){return c=a(n),d}var d={add:function n(e){if(0!==e){var r=t(e);return f(s()+r),n(e+-1*r)}return d},clone:function(){return n(e,r,s())},get:s,max:u,min:i,set:f};return d}(p(0,a(K)),P,C),$=Z.clone(),_=i(o),nn=function(n){var e=0;function t(n,t){return function(){n===!!e&&t()}}function r(){e=window.requestAnimationFrame(n)}return{proceed:t(!0,r),start:t(!1,r),stop:t(!0,(function(){window.cancelAnimationFrame(e),e=0}))}}((function(){P||fn.scrollBounds.constrain(rn,fn.dragHandler.pointerDown()),fn.scrollBody.seek(rn).update();var n=fn.scrollBody.settle(rn);n&&!fn.dragHandler.pointerDown()&&(fn.animation.stop(),s.emit("settle")),n||s.emit("scroll"),P&&(fn.scrollLooper.loop(on,fn.scrollBody.direction()),fn.slideLooper.loop(o)),fn.translate.to(tn),fn.animation.proceed()})),en=K[Z.get()],tn=d(en),rn=d(en),on=[tn,rn],un=g(tn,B,1),an=b(Z,P,K,J,Q,rn),cn=function(n,e,t,r,o,i){function u(r){var u=r.distance,a=r.index!==e.get();u&&(n.start(),o.add(u)),a&&(t.set(e.get()),e.set(r.index),i.emit("select"))}return{distance:function(n,e){u(r.byDistance(n,e))},index:function(n,t){var o=e.clone().set(n);u(r.byIndex(o.get(),t))}}}(nn,Z,$,an,rn,s),sn=function(n,e,t,r,o,i){var u=Math.min(Math.max(i,.01),.99),a=(o?[0,e,-e]:[0]).reduce((function(n,e){return n.concat(c(e,u))}),[]);function c(e,o){var i=t.map((function(n){return n*(o||0)}));return r.map((function(r,o){return{start:r-t[o]+i[o]+e,end:r+n-i[o]+e,index:o}}))}return{check:function(n){return a.reduce((function(e,t){var r=t.index,o=t.start,i=t.end;return!(-1!==e.indexOf(r))&&(o<n&&i>n)?e.concat([r]):e}),[])},findSlideBounds:c}}(V,J,j,W,P,D),fn={animation:nn,axis:F,direction:N,dragHandler:l(F,N,n,rn,I,function(n,e){var t=n.scroll,r={x:"clientX",y:"clientY"},o=d(0),i=d(0),u=d(0),a=d(0),c=[],s=(new Date).getTime(),f=!1;function l(n,e){f=!n.touches;var t=r[e],o=f?n[t]:n.touches[0][t];return a.set(o)}return{pointerDown:function(n){var r=l(n,t);return o.set(r),u.set(r),e.measure(o.get())},pointerMove:function(n){var r=l(n,t),o=(new Date).getTime(),a=o-s;return a>=10&&(a>=100&&(c=[]),c.push(r.get()),s=o),i.set(r).subtract(u),u.set(r),e.measure(i.get())},pointerUp:function(){var n=(new Date).getTime()-s,t=u.get(),r=c.slice(-5).map((function(n){return t-n})).sort((function(n,e){return Math.abs(n)<Math.abs(e)?1:-1}))[0];return u.set(n>100||!r?0:r),c=[],e.measure(u.get())},readPoint:l}}(F,U),tn,nn,cn,un,an,Z,Q,s),pxToPercent:U,index:Z,indexPrevious:$,limit:Q,location:tn,options:c,scrollBody:un,scrollBounds:m(Q,tn,un),scrollLooper:h(J,U,Q,tn),scrollProgress:x(Q),scrollSnaps:K,scrollTarget:an,scrollTo:cn,slideFocus:M(n,cn,L),slideLooper:w(F,V,J,G,K,sn,tn),slidesInView:sn,slideIndexes:_,target:rn,translate:S(F,N,r)};return fn}var A={align:"center",axis:"x",containScroll:"",direction:"ltr",dragFree:!1,draggable:!0,draggableClass:"is-draggable",draggingClass:"is-dragging",inViewThreshold:0,loop:!1,selectedClass:"is-selected",slidesToScroll:1,speed:10,startIndex:0};return function(e,t){var r,o,i,u,a,d,l,p=function(){var n={};function e(e){return n[e]||[]}var t={emit:function(n){return e(n).forEach((function(e){return e(n)})),t},off:function(r,o){return n[r]=e(r).filter((function(n){return n!==o})),t},on:function(r,o){return n[r]=e(r).concat([o]),t}};return t}(),g=f(),m=(r=function(){if(y){var n=u.axis.measureSize(e.getBoundingClientRect());w!==n&&P(),p.emit("resize")}},o=500,i=0,function(){window.clearTimeout(i),i=window.setTimeout(r,o)||0}),v=P,h=p.on,x=p.off,y=!1,b=n({},A),w=0;function M(){if(!e)throw new Error("Missing root node 😢");var n,t,r=e.querySelector("*");if(!r)throw new Error("Missing container node 😢");d=r,l=Array.prototype.slice.call(d.children),n=e,t=window.getComputedStyle(n,":before").content,a={get:function(){try{return JSON.parse(t.slice(1,-1).replace(/\\/g,""))}catch(n){}return{}}}}function S(t){if(M(),b=n(b,t,a.get()),u=E(e,d,l,b,p),g.add(window,"resize",m),u.translate.to(u.location),w=u.axis.measureSize(e.getBoundingClientRect()),b.loop){if(!u.slideLooper.canLoop())return D(),S({loop:!1});u.slideLooper.loop(l)}b.draggable&&d.offsetParent&&l.length&&(u.dragHandler.addActivationEvents(),b.draggableClass&&s(e,b.draggableClass),b.draggingClass&&p.on("pointerDown",T).on("pointerUp",T)),l.length&&u.slideFocus.addActivationEvents(l),b.selectedClass&&(C(),p.on("select",C).on("pointerUp",C)),y||(setTimeout((function(){return p.emit("init")}),0),y=!0)}function T(n){var t=b.draggingClass;"pointerDown"===n?s(e,t):c(e,t)}function C(){var n=b.selectedClass,e=B(!0);I(!0).forEach((function(e){return c(l[e],n)})),e.forEach((function(e){return s(l[e],n)}))}function D(){u.dragHandler.removeAllEvents(),u.slideFocus.removeAllEvents(),u.animation.stop(),g.removeAll(),u.translate.clear(),u.slideLooper.clear(l),c(e,b.draggableClass),l.forEach((function(n){return c(n,b.selectedClass)})),p.off("select",C),p.off("pointerUp",C),p.off("pointerDown",T),p.off("pointerUp",T)}function P(e){if(y){var t=n({startIndex:z()},e);D(),S(t),p.emit("reInit")}}function B(n){var e=u[n?"target":"location"].get(),t=b.loop?"removeOffset":"constrain";return u.slidesInView.check(u.limit[t](e))}function I(n){var e=B(n);return u.slideIndexes.filter((function(n){return-1===e.indexOf(n)}))}function L(n,e){u.scrollBody.useBaseMass().useBaseSpeed(),y&&u.scrollTo.index(n,e||0)}function z(){return u.index.get()}return S(t),{canScrollNext:function(){return u.index.clone().add(1).get()!==z()},canScrollPrev:function(){return u.index.clone().add(-1).get()!==z()},clickAllowed:function(){return u.dragHandler.clickAllowed()},containerNode:function(){return d},dangerouslyGetEngine:function(){return u},destroy:function(){y&&(D(),y=!1,p.emit("destroy"))},off:x,on:h,previousScrollSnap:function(){return u.indexPrevious.get()},reInit:v,rootNode:function(){return e},scrollNext:function(){L(u.index.clone().add(1).get(),-1)},scrollPrev:function(){L(u.index.clone().add(-1).get(),1)},scrollProgress:function(){return u.scrollProgress.get(u.location.get())},scrollSnapList:function(){return u.scrollSnaps.map(u.scrollProgress.get)},scrollTo:L,selectedScrollSnap:z,slideNodes:function(){return l},slidesInView:B,slidesNotInView:I}}}));

package.json

 {
   "name": "embla-carousel",
-  "version": "4.2.1",
+  "version": "4.3.0",
   "private": false,
@@ -39,7 +39,13 @@ "author": "David Cetinkaya <[e-mail]>",
   "scripts": {
+    "test": "jest --config jestconfig.json",
+    "lint": "npm-run-all prettier:report eslint:report",
+    "format": "npm-run-all prettier:fix eslint:fix",
     "build": "rollup -c",
     "start": "rollup -c --watch",
-    "test": "jest --config jestconfig.json",
-    "lint": "eslint src/** --ext .js,.jsx,.ts,.tsx",
-    "format": "prettier --write \"src/**/*.ts\" \"src/**/*.js\"",
+    "start:vanilla": "rollup -c --watch --environment BUILD:development,PACKAGE:vanilla",
+    "start:react": "rollup -c --watch --environment BUILD:development,PACKAGE:react",
+    "prettier:report": "prettier '**/*.{js,tsx,ts,scss,json}' --check",
+    "prettier:fix": "prettier '**/*.{js,tsx,ts,scss,json}' --write",
+    "eslint:report": "eslint 'src/**/*.{js,tsx,ts}'",
+    "eslint:fix": "eslint 'src/**/*.{js,tsx,ts}' --fix",
     "prepare": "npm run build",
@@ -52,28 +58,26 @@ "prepublishOnly": "npm-run-all test lint",
   "devDependencies": {
-    "@babel/core": "^7.9.6",
-    "@babel/plugin-transform-object-assign": "^7.8.3",
-    "@babel/preset-env": "^7.9.6",
-    "@babel/preset-typescript": "^7.10.1",
-    "@rollup/plugin-babel": "^5.0.3",
-    "@rollup/plugin-node-resolve": "^8.0.1",
+    "@babel/core": "^7.13.10",
+    "@babel/plugin-transform-object-assign": "^7.12.13",
+    "@babel/preset-env": "^7.13.10",
+    "@babel/preset-typescript": "^7.13.0",
+    "@rollup/plugin-babel": "^5.3.0",
+    "@rollup/plugin-node-resolve": "^8.4.0",
     "@types/jest": "^24.9.1",
     "@types/jest-diff": "^20.0.0",
-    "@types/react": "^16.9.38",
-    "@typescript-eslint/eslint-plugin": "^3.3.0",
-    "@typescript-eslint/parser": "^3.3.0",
-    "eslint": "^7.3.1",
-    "eslint-config-prettier": "^6.11.0",
-    "eslint-plugin-prettier": "^3.1.4",
+    "@types/react": "^16.14.5",
+    "@typescript-eslint/eslint-plugin": "^4.18.0",
+    "@typescript-eslint/parser": "^4.18.0",
+    "eslint": "^7.22.0",
+    "eslint-config-prettier": "^7.2.0",
+    "eslint-plugin-prettier": "^3.3.1",
     "jest": "^24.9.0",
     "npm-run-all": "^4.1.5",
-    "prettier": "^1.19.1",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
-    "rollup": "^2.18.0",
+    "prettier": "^2.2.1",
+    "react": "^16.14.0",
+    "rollup": "^2.42.0",
     "rollup-plugin-terser": "^6.1.0",
-    "rollup-plugin-typescript2": "^0.27.1",
-    "ts-jest": "^23.10.5",
-    "typescript": "^3.9.3"
-  },
-  "dependencies": {}
+    "rollup-plugin-typescript2": "^0.27.3",
+    "ts-jest": "^26.5.4",
+    "typescript": "^3.9.9"
+  }
 }

react.esm.js

@@ -1270,3 +1270,2 @@ import { useState, useRef, useMemo, useEffect } from 'react';
   align: 'center',
-  autoResize: true,
   axis: 'x',
@@ -1287,2 +1286,20 @@ containScroll: '',
 
+function OptionsPseudo(node) {
+  var psuedoString = window.getComputedStyle(node, ':before').content;
+
+  function get() {
+    try {
+      return JSON.parse(psuedoString.slice(1, -1).replace(/\\/g, ''));
+    } catch (error) {} // eslint-disable-line no-empty
+
+
+    return {};
+  }
+
+  var self = {
+    get: get
+  };
+  return self;
+}
+
 function EventEmitter() {
@@ -1335,2 +1352,3 @@ var listeners = {};
 
+  var optionsPseudo;
   var rootNodeSize = 0;
@@ -1341,3 +1359,3 @@ var container;
 
-  function storeElements() {
+  function setupElements() {
     if (!sliderRoot) throw new Error('Missing root node 😢');
@@ -1348,15 +1366,13 @@ var sliderContainer = sliderRoot.querySelector('*');
     slides = Array.prototype.slice.call(container.children);
+    optionsPseudo = OptionsPseudo(sliderRoot);
   }
 
   function activate(partialOptions) {
-    storeElements();
-    options = _extends(options, partialOptions);
+    setupElements();
+    options = _extends(options, partialOptions, optionsPseudo.get());
     engine = Engine(sliderRoot, container, slides, options, events);
     eventStore.add(window, 'resize', debouncedResize);
     engine.translate.to(engine.location);
+    rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
 
-    if (options.autoResize) {
-      rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-    }
-
     if (options.loop) {
@@ -1411,7 +1427,7 @@ if (!engine.slideLooper.canLoop()) {
     var notInView = slidesNotInView(true);
-    notInView.forEach(function (i) {
-      return removeClass(slides[i], selectedClass);
+    notInView.forEach(function (index) {
+      return removeClass(slides[index], selectedClass);
     });
-    inView.forEach(function (i) {
-      return addClass(slides[i], selectedClass);
+    inView.forEach(function (index) {
+      return addClass(slides[index], selectedClass);
     });
@@ -1428,4 +1444,4 @@ }
     removeClass(sliderRoot, options.draggableClass);
-    slides.forEach(function (s) {
-      return removeClass(s, options.selectedClass);
+    slides.forEach(function (slide) {
+      return removeClass(slide, options.selectedClass);
     });
@@ -1460,8 +1476,4 @@ events.off('select', toggleSelectedClass);
     if (!activated) return;
-
-    if (options.autoResize) {
-      var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-      if (rootNodeSize !== size) reActivate();
-    }
-
+    var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
+    if (rootNodeSize !== size) reActivate();
     events.emit('resize');
@@ -1478,4 +1490,4 @@ }
     var inView = slidesInView(target);
-    return engine.slideIndexes.filter(function (i) {
-      return inView.indexOf(i) === -1;
+    return engine.slideIndexes.filter(function (index) {
+      return inView.indexOf(index) === -1;
     });
@@ -1575,3 +1587,6 @@ }
   return Object.keys(objectA).length === Object.keys(objectB).length && Object.keys(objectA).every(function (objectKey) {
-    if (!objectB.hasOwnProperty(objectKey)) return false;
+    if (!Object.prototype.hasOwnProperty.call(objectB, objectKey)) {
+      return false;
+    }
+
     return objectA[objectKey] === objectB[objectKey];
@@ -1578,0 +1593,0 @@ });

react.js

@@ -1274,3 +1274,2 @@ 'use strict';
   align: 'center',
-  autoResize: true,
   axis: 'x',
@@ -1291,2 +1290,20 @@ containScroll: '',
 
+function OptionsPseudo(node) {
+  var psuedoString = window.getComputedStyle(node, ':before').content;
+
+  function get() {
+    try {
+      return JSON.parse(psuedoString.slice(1, -1).replace(/\\/g, ''));
+    } catch (error) {} // eslint-disable-line no-empty
+
+
+    return {};
+  }
+
+  var self = {
+    get: get
+  };
+  return self;
+}
+
 function EventEmitter() {
@@ -1339,2 +1356,3 @@ var listeners = {};
 
+  var optionsPseudo;
   var rootNodeSize = 0;
@@ -1345,3 +1363,3 @@ var container;
 
-  function storeElements() {
+  function setupElements() {
     if (!sliderRoot) throw new Error('Missing root node 😢');
@@ -1352,15 +1370,13 @@ var sliderContainer = sliderRoot.querySelector('*');
     slides = Array.prototype.slice.call(container.children);
+    optionsPseudo = OptionsPseudo(sliderRoot);
   }
 
   function activate(partialOptions) {
-    storeElements();
-    options = _extends(options, partialOptions);
+    setupElements();
+    options = _extends(options, partialOptions, optionsPseudo.get());
     engine = Engine(sliderRoot, container, slides, options, events);
     eventStore.add(window, 'resize', debouncedResize);
     engine.translate.to(engine.location);
+    rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
 
-    if (options.autoResize) {
-      rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-    }
-
     if (options.loop) {
@@ -1415,7 +1431,7 @@ if (!engine.slideLooper.canLoop()) {
     var notInView = slidesNotInView(true);
-    notInView.forEach(function (i) {
-      return removeClass(slides[i], selectedClass);
+    notInView.forEach(function (index) {
+      return removeClass(slides[index], selectedClass);
     });
-    inView.forEach(function (i) {
-      return addClass(slides[i], selectedClass);
+    inView.forEach(function (index) {
+      return addClass(slides[index], selectedClass);
     });
@@ -1432,4 +1448,4 @@ }
     removeClass(sliderRoot, options.draggableClass);
-    slides.forEach(function (s) {
-      return removeClass(s, options.selectedClass);
+    slides.forEach(function (slide) {
+      return removeClass(slide, options.selectedClass);
     });
@@ -1464,8 +1480,4 @@ events.off('select', toggleSelectedClass);
     if (!activated) return;
-
-    if (options.autoResize) {
-      var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-      if (rootNodeSize !== size) reActivate();
-    }
-
+    var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
+    if (rootNodeSize !== size) reActivate();
     events.emit('resize');
@@ -1482,4 +1494,4 @@ }
     var inView = slidesInView(target);
-    return engine.slideIndexes.filter(function (i) {
-      return inView.indexOf(i) === -1;
+    return engine.slideIndexes.filter(function (index) {
+      return inView.indexOf(index) === -1;
     });
@@ -1579,3 +1591,6 @@ }
   return Object.keys(objectA).length === Object.keys(objectB).length && Object.keys(objectA).every(function (objectKey) {
-    if (!objectB.hasOwnProperty(objectKey)) return false;
+    if (!Object.prototype.hasOwnProperty.call(objectB, objectKey)) {
+      return false;
+    }
+
     return objectA[objectKey] === objectB[objectKey];
@@ -1582,0 +1597,0 @@ });

vanilla/components/options.d.ts

@@ -7,3 +7,2 @@ import { AlignmentOptionType } from './alignment';
     align: AlignmentOptionType;
-    autoResize: boolean;
     axis: AxisOptionType;
@@ -10,0 +9,0 @@ containScroll: ScrollContainOptionType;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

644993

increased by1.07%

Dev dependency count

23

decreased by-4.17%

Number of package files

46

increased by2.22%

Lines of code

5840

increased by0.85%

No dependency changes