embla-carousel-react - npm Package Compare versions

Comparing version 5.0.1 to 6.0.0

components/index.d.ts

@@ -1,8 +0,8 @@
-import { EmblaCarouselType, EmblaOptionsType } from 'embla-carousel';
-declare type ViewportRefType = <ViewportElement extends HTMLElement>(instance: ViewportElement | null) => void;
+import { EmblaCarouselType, EmblaOptionsType, EmblaPluginType } from 'embla-carousel';
+declare type EmblaViewportRefType = <ViewportElement extends HTMLElement>(instance: ViewportElement | null) => void;
 export declare type UseEmblaCarouselType = [
-    ViewportRefType,
+    EmblaViewportRefType,
     EmblaCarouselType | undefined
 ];
-declare function useEmblaCarousel(options?: EmblaOptionsType): UseEmblaCarouselType;
+declare function useEmblaCarousel<EmblaPluginsType extends EmblaPluginType>(options?: EmblaOptionsType, plugins?: EmblaPluginsType[]): UseEmblaCarouselType;
 export default useEmblaCarousel;

components/utils.d.ts

@@ -0,3 +1,4 @@
+import { EmblaPluginType } from 'embla-carousel';
 export declare function canUseDOM(): boolean;
-export declare function areEqualShallow(objectA: {
+export declare function areObjectsEqualShallow(objectA: {
     [key: string]: any;
@@ -7,1 +8,3 @@ }, objectB: {
 }): boolean;
+export declare function sortAndMapPluginToOptions(plugins: EmblaPluginType[]): EmblaPluginType['options'][];
+export declare function arePluginsEqual(pluginsA: EmblaPluginType[], pluginsB: EmblaPluginType[]): boolean;

embla-carousel-react.esm.js

@@ -6,3 +6,3 @@ import { useState, useRef, useMemo, useEffect } from 'react';
 }
-function areEqualShallow(objectA, objectB) {
+function areObjectsEqualShallow(objectA, objectB) {
   return Object.keys(objectA).length === Object.keys(objectB).length && Object.keys(objectA).every(function (objectKey) {
@@ -16,20 +16,18 @@ if (!Object.prototype.hasOwnProperty.call(objectB, objectKey)) {
 }
-
-function _extends() {
-  _extends = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends.apply(this, arguments);
+function sortAndMapPluginToOptions(plugins) {
+  return plugins.concat().sort(function (a, b) {
+    return a.name > b.name ? 1 : -1;
+  }).map(function (plugin) {
+    return plugin.options;
+  });
 }
+function arePluginsEqual(pluginsA, pluginsB) {
+  if (pluginsA.length !== pluginsB.length) return false;
+  var optionsA = sortAndMapPluginToOptions(pluginsA);
+  var optionsB = sortAndMapPluginToOptions(pluginsB);
+  return optionsA.every(function (optionA, index) {
+    var optionB = optionsB[index];
+    return areObjectsEqualShallow(optionA, optionB);
+  });
+}
 
@@ -357,12 +355,2 @@ function Alignment(align, viewSize) {
 
-function removeClass(node, className) {
-  var cl = node.classList;
-  if (className && cl.contains(className)) cl.remove(className);
-}
-
-function addClass(node, className) {
-  var cl = node.classList;
-  if (className && !cl.contains(className)) cl.add(className);
-}
-
 function DragHandler(axis, direction, rootNode, target, dragFree, dragTracker, location, animation, scrollTo, scrollBody, scrollTarget, index, events, loop, skipSnaps) {
@@ -613,9 +601,9 @@ var scrollAxis = axis.scroll,
 
-  function applyForce(v) {
-    v.divide(mass);
-    acceleration.add(v);
+  function applyForce(force) {
+    force.divide(mass);
+    acceleration.add(force);
   }
 
-  function seek(v) {
-    attraction.set(v).subtract(location);
+  function seek(target) {
+    attraction.set(target).subtract(location);
     var magnitude = map(attraction.get(), 0, 100, 0, speed);
@@ -628,6 +616,6 @@ attractionDirection = mathSign(attraction.get());
 
-  function settle(v) {
-    var diff = v.get() - location.get();
+  function settle(target) {
+    var diff = target.get() - location.get();
     var hasSettled = !roundToTwoDecimals(diff);
-    if (hasSettled) location.set(v);
+    if (hasSettled) location.set(target);
     return hasSettled;
@@ -1039,37 +1027,2 @@ }
 
-function SlideFocus(rootNode, scrollTo, slidesToScroll) {
-  var eventStore = EventStore();
-  var removeAllEvents = eventStore.removeAll;
-  var lastTabPressTime = 0;
-
-  function registerTabPress(event) {
-    if (event.keyCode !== 9) return;
-    lastTabPressTime = new Date().getTime();
-  }
-
-  function addFocusEvent(slide, index) {
-    var focus = function focus() {
-      var nowTime = new Date().getTime();
-      var diffTime = nowTime - lastTabPressTime;
-      if (diffTime > 10) return;
-      rootNode.scrollLeft = 0;
-      var selectedIndex = Math.floor(index / slidesToScroll);
-      scrollTo.index(selectedIndex, 0);
-    };
-
-    eventStore.add(slide, 'focus', focus, true);
-  }
-
-  function addActivationEvents(slides) {
-    eventStore.add(document, 'keydown', registerTabPress, false);
-    slides.forEach(addFocusEvent);
-  }
-
-  var self = {
-    addActivationEvents: addActivationEvents,
-    removeAllEvents: removeAllEvents
-  };
-  return self;
-}
-
 function SlidesInView(viewSize, contentSize, slideSizes, snaps, loop, inViewThreshold) {
@@ -1254,2 +1207,3 @@ var threshold = Math.min(Math.max(inViewThreshold, 0.01), 0.99);
     dragHandler: dragHandler,
+    eventStore: EventStore(),
     pxToPercent: pxToPercent,
@@ -1268,3 +1222,2 @@ index: index,
     scrollTo: scrollTo,
-    slideFocus: SlideFocus(root, scrollTo, slidesToScroll),
     slideLooper: SlideLooper(axis, viewSize, contentSize, slideSizesWithGaps, scrollSnaps, slidesInView, location, slides),
@@ -1283,4 +1236,3 @@ slidesInView: slidesInView,
   function getListeners(evt) {
-    var eventListeners = listeners[evt];
-    return eventListeners || [];
+    return listeners[evt] || [];
   }
@@ -1322,8 +1274,5 @@
   draggable: true,
-  draggableClass: 'is-draggable',
-  draggingClass: 'is-dragging',
   inViewThreshold: 0,
   loop: false,
-  skipSnaps: true,
-  selectedClass: 'is-selected',
+  skipSnaps: false,
   slidesToScroll: 1,
@@ -1352,5 +1301,4 @@ speed: 10,
 
-function EmblaCarousel(sliderRoot, userOptions) {
+function EmblaCarousel(nodes, userOptions, userPlugins) {
   var events = EventEmitter();
-  var eventStore = EventStore();
   var debouncedResize = debounce(resize, 500);
@@ -1362,30 +1310,32 @@ var reInit = reActivate;
   var activated = false;
-
-  var optionsBase = _extends({}, defaultOptions);
-
-  var options = _extends({}, optionsBase);
-
+  var optionsBase = Object.assign({}, defaultOptions);
+  var options = Object.assign({}, optionsBase);
   var optionsPseudo;
-  var rootNodeSize = 0;
+  var plugins;
+  var rootSize = 0;
+  var root;
   var container;
   var slides;
-  activate(userOptions);
 
   function setupElements() {
-    if (!sliderRoot) throw new Error('Missing root node 😢');
-    var sliderContainer = sliderRoot.querySelector('*');
-    if (!sliderContainer) throw new Error('Missing container node 😢');
-    container = sliderContainer;
-    slides = Array.prototype.slice.call(container.children);
-    optionsPseudo = OptionsPseudo(sliderRoot);
+    var providedContainer = 'container' in nodes && nodes.container;
+    var providedSlides = 'slides' in nodes && nodes.slides;
+    root = 'root' in nodes ? nodes.root : nodes;
+    container = providedContainer || root.children[0];
+    slides = providedSlides || [].slice.call(container.children);
+    optionsPseudo = OptionsPseudo(root);
   }
 
-  function activate(partialOptions) {
+  function activate(withOptions, withPlugins) {
     setupElements();
-    optionsBase = _extends({}, optionsBase, partialOptions);
-    options = _extends({}, optionsBase, optionsPseudo.get());
-    engine = Engine(sliderRoot, container, slides, options, events);
-    eventStore.add(window, 'resize', debouncedResize);
+    optionsBase = Object.assign({}, optionsBase, withOptions);
+    options = Object.assign({}, optionsBase, optionsPseudo.get());
+    plugins = Object.assign([], withPlugins);
+    engine = Engine(root, container, slides, options, events);
+    engine.eventStore.add(window, 'resize', debouncedResize);
     engine.translate.to(engine.location);
-    rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
+    rootSize = engine.axis.measureSize(root.getBoundingClientRect());
+    plugins.forEach(function (plugin) {
+      return plugin.init(self);
+    });
 
@@ -1397,3 +1347,3 @@ if (options.loop) {
           loop: false
-        });
+        }, withPlugins);
       }
@@ -1406,21 +1356,4 @@
       engine.dragHandler.addActivationEvents();
-
-      if (options.draggableClass) {
-        addClass(sliderRoot, options.draggableClass);
-      }
-
-      if (options.draggingClass) {
-        events.on('pointerDown', toggleDraggingClass).on('pointerUp', toggleDraggingClass);
-      }
     }
 
-    if (slides.length) {
-      engine.slideFocus.addActivationEvents(slides);
-    }
-
-    if (options.selectedClass) {
-      toggleSelectedClass();
-      events.on('select', toggleSelectedClass).on('pointerUp', toggleSelectedClass);
-    }
-
     if (!activated) {
@@ -1434,46 +1367,24 @@ setTimeout(function () {
 
-  function toggleDraggingClass(evt) {
-    var draggingClass = options.draggingClass;
-    if (evt === 'pointerDown') addClass(sliderRoot, draggingClass);else removeClass(sliderRoot, draggingClass);
+  function reActivate(withOptions, withPlugins) {
+    if (!activated) return;
+    var startIndex = selectedScrollSnap();
+    var newOptions = Object.assign({
+      startIndex: startIndex
+    }, withOptions);
+    deActivate();
+    activate(newOptions, withPlugins || plugins);
+    events.emit('reInit');
   }
 
-  function toggleSelectedClass() {
-    var selectedClass = options.selectedClass;
-    var inView = slidesInView(true);
-    var notInView = slidesNotInView(true);
-    notInView.forEach(function (index) {
-      return removeClass(slides[index], selectedClass);
-    });
-    inView.forEach(function (index) {
-      return addClass(slides[index], selectedClass);
-    });
-  }
-
   function deActivate() {
     engine.dragHandler.removeAllEvents();
-    engine.slideFocus.removeAllEvents();
     engine.animation.stop();
-    eventStore.removeAll();
+    engine.eventStore.removeAll();
     engine.translate.clear();
     engine.slideLooper.clear();
-    removeClass(sliderRoot, options.draggableClass);
-    slides.forEach(function (slide) {
-      return removeClass(slide, options.selectedClass);
+    plugins.forEach(function (plugin) {
+      return plugin.destroy();
     });
-    events.off('select', toggleSelectedClass).off('pointerUp', toggleSelectedClass).off('pointerDown', toggleDraggingClass).off('pointerUp', toggleDraggingClass);
   }
 
-  function reActivate(partialOptions) {
-    if (!activated) return;
-    var startIndex = selectedScrollSnap();
-
-    var newOptions = _extends({
-      startIndex: startIndex
-    }, partialOptions);
-
-    deActivate();
-    activate(newOptions);
-    events.emit('reInit');
-  }
-
   function destroy() {
@@ -1488,4 +1399,4 @@ if (!activated) return;
     if (!activated) return;
-    var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-    if (rootNodeSize !== size) reActivate();
+    var size = engine.axis.measureSize(root.getBoundingClientRect());
+    if (rootSize !== size) reActivate();
     events.emit('resize');
@@ -1552,3 +1463,3 @@ }
 
-  function dangerouslyGetEngine() {
+  function internalEngine() {
     return engine;
@@ -1558,3 +1469,3 @@ }
   function rootNode() {
-    return sliderRoot;
+    return root;
   }
@@ -1575,3 +1486,3 @@
     containerNode: containerNode,
-    dangerouslyGetEngine: dangerouslyGetEngine,
+    internalEngine: internalEngine,
     destroy: destroy,
@@ -1593,6 +1504,7 @@ off: off,
   };
+  activate(userOptions, userPlugins);
   return self;
 }
 
-function useEmblaCarousel(options) {
+function useEmblaCarousel(options, plugins) {
   if (options === void 0) {
@@ -1602,2 +1514,6 @@ options = {};
 
+  if (plugins === void 0) {
+    plugins = [];
+  }
+
   var _a = useState(),
@@ -1612,4 +1528,5 @@ embla = _a[0],
   var storedOptions = useRef(options);
+  var storedPlugins = useRef(plugins);
   var activeOptions = useMemo(function () {
-    if (!areEqualShallow(storedOptions.current, options)) {
+    if (!areObjectsEqualShallow(storedOptions.current, options)) {
       storedOptions.current = options;
@@ -1620,5 +1537,12 @@ }
   }, [storedOptions, options]);
+  var activePlugins = useMemo(function () {
+    if (!arePluginsEqual(storedPlugins.current, plugins)) {
+      storedPlugins.current = plugins;
+    }
+
+    return storedPlugins.current;
+  }, [storedPlugins, plugins]);
   useEffect(function () {
     if (canUseDOM() && viewport) {
-      var newEmbla_1 = EmblaCarousel(viewport, activeOptions);
+      var newEmbla_1 = EmblaCarousel(viewport, activeOptions, activePlugins);
       setEmbla(newEmbla_1);
@@ -1631,3 +1555,3 @@ return function () {
     }
-  }, [viewport, activeOptions, setEmbla]);
+  }, [viewport, activeOptions, activePlugins, setEmbla]);
   return [setViewport, embla];
@@ -1634,0 +1558,0 @@ }

embla-carousel-react.js

@@ -8,3 +8,3 @@ 'use strict';
 }
-function areEqualShallow(objectA, objectB) {
+function areObjectsEqualShallow(objectA, objectB) {
   return Object.keys(objectA).length === Object.keys(objectB).length && Object.keys(objectA).every(function (objectKey) {
@@ -18,20 +18,18 @@ if (!Object.prototype.hasOwnProperty.call(objectB, objectKey)) {
 }
-
-function _extends() {
-  _extends = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends.apply(this, arguments);
+function sortAndMapPluginToOptions(plugins) {
+  return plugins.concat().sort(function (a, b) {
+    return a.name > b.name ? 1 : -1;
+  }).map(function (plugin) {
+    return plugin.options;
+  });
 }
+function arePluginsEqual(pluginsA, pluginsB) {
+  if (pluginsA.length !== pluginsB.length) return false;
+  var optionsA = sortAndMapPluginToOptions(pluginsA);
+  var optionsB = sortAndMapPluginToOptions(pluginsB);
+  return optionsA.every(function (optionA, index) {
+    var optionB = optionsB[index];
+    return areObjectsEqualShallow(optionA, optionB);
+  });
+}
 
@@ -359,12 +357,2 @@ function Alignment(align, viewSize) {
 
-function removeClass(node, className) {
-  var cl = node.classList;
-  if (className && cl.contains(className)) cl.remove(className);
-}
-
-function addClass(node, className) {
-  var cl = node.classList;
-  if (className && !cl.contains(className)) cl.add(className);
-}
-
 function DragHandler(axis, direction, rootNode, target, dragFree, dragTracker, location, animation, scrollTo, scrollBody, scrollTarget, index, events, loop, skipSnaps) {
@@ -615,9 +603,9 @@ var scrollAxis = axis.scroll,
 
-  function applyForce(v) {
-    v.divide(mass);
-    acceleration.add(v);
+  function applyForce(force) {
+    force.divide(mass);
+    acceleration.add(force);
   }
 
-  function seek(v) {
-    attraction.set(v).subtract(location);
+  function seek(target) {
+    attraction.set(target).subtract(location);
     var magnitude = map(attraction.get(), 0, 100, 0, speed);
@@ -630,6 +618,6 @@ attractionDirection = mathSign(attraction.get());
 
-  function settle(v) {
-    var diff = v.get() - location.get();
+  function settle(target) {
+    var diff = target.get() - location.get();
     var hasSettled = !roundToTwoDecimals(diff);
-    if (hasSettled) location.set(v);
+    if (hasSettled) location.set(target);
     return hasSettled;
@@ -1041,37 +1029,2 @@ }
 
-function SlideFocus(rootNode, scrollTo, slidesToScroll) {
-  var eventStore = EventStore();
-  var removeAllEvents = eventStore.removeAll;
-  var lastTabPressTime = 0;
-
-  function registerTabPress(event) {
-    if (event.keyCode !== 9) return;
-    lastTabPressTime = new Date().getTime();
-  }
-
-  function addFocusEvent(slide, index) {
-    var focus = function focus() {
-      var nowTime = new Date().getTime();
-      var diffTime = nowTime - lastTabPressTime;
-      if (diffTime > 10) return;
-      rootNode.scrollLeft = 0;
-      var selectedIndex = Math.floor(index / slidesToScroll);
-      scrollTo.index(selectedIndex, 0);
-    };
-
-    eventStore.add(slide, 'focus', focus, true);
-  }
-
-  function addActivationEvents(slides) {
-    eventStore.add(document, 'keydown', registerTabPress, false);
-    slides.forEach(addFocusEvent);
-  }
-
-  var self = {
-    addActivationEvents: addActivationEvents,
-    removeAllEvents: removeAllEvents
-  };
-  return self;
-}
-
 function SlidesInView(viewSize, contentSize, slideSizes, snaps, loop, inViewThreshold) {
@@ -1256,2 +1209,3 @@ var threshold = Math.min(Math.max(inViewThreshold, 0.01), 0.99);
     dragHandler: dragHandler,
+    eventStore: EventStore(),
     pxToPercent: pxToPercent,
@@ -1270,3 +1224,2 @@ index: index,
     scrollTo: scrollTo,
-    slideFocus: SlideFocus(root, scrollTo, slidesToScroll),
     slideLooper: SlideLooper(axis, viewSize, contentSize, slideSizesWithGaps, scrollSnaps, slidesInView, location, slides),
@@ -1285,4 +1238,3 @@ slidesInView: slidesInView,
   function getListeners(evt) {
-    var eventListeners = listeners[evt];
-    return eventListeners || [];
+    return listeners[evt] || [];
   }
@@ -1324,8 +1276,5 @@
   draggable: true,
-  draggableClass: 'is-draggable',
-  draggingClass: 'is-dragging',
   inViewThreshold: 0,
   loop: false,
-  skipSnaps: true,
-  selectedClass: 'is-selected',
+  skipSnaps: false,
   slidesToScroll: 1,
@@ -1354,5 +1303,4 @@ speed: 10,
 
-function EmblaCarousel(sliderRoot, userOptions) {
+function EmblaCarousel(nodes, userOptions, userPlugins) {
   var events = EventEmitter();
-  var eventStore = EventStore();
   var debouncedResize = debounce(resize, 500);
@@ -1364,30 +1312,32 @@ var reInit = reActivate;
   var activated = false;
-
-  var optionsBase = _extends({}, defaultOptions);
-
-  var options = _extends({}, optionsBase);
-
+  var optionsBase = Object.assign({}, defaultOptions);
+  var options = Object.assign({}, optionsBase);
   var optionsPseudo;
-  var rootNodeSize = 0;
+  var plugins;
+  var rootSize = 0;
+  var root;
   var container;
   var slides;
-  activate(userOptions);
 
   function setupElements() {
-    if (!sliderRoot) throw new Error('Missing root node 😢');
-    var sliderContainer = sliderRoot.querySelector('*');
-    if (!sliderContainer) throw new Error('Missing container node 😢');
-    container = sliderContainer;
-    slides = Array.prototype.slice.call(container.children);
-    optionsPseudo = OptionsPseudo(sliderRoot);
+    var providedContainer = 'container' in nodes && nodes.container;
+    var providedSlides = 'slides' in nodes && nodes.slides;
+    root = 'root' in nodes ? nodes.root : nodes;
+    container = providedContainer || root.children[0];
+    slides = providedSlides || [].slice.call(container.children);
+    optionsPseudo = OptionsPseudo(root);
   }
 
-  function activate(partialOptions) {
+  function activate(withOptions, withPlugins) {
     setupElements();
-    optionsBase = _extends({}, optionsBase, partialOptions);
-    options = _extends({}, optionsBase, optionsPseudo.get());
-    engine = Engine(sliderRoot, container, slides, options, events);
-    eventStore.add(window, 'resize', debouncedResize);
+    optionsBase = Object.assign({}, optionsBase, withOptions);
+    options = Object.assign({}, optionsBase, optionsPseudo.get());
+    plugins = Object.assign([], withPlugins);
+    engine = Engine(root, container, slides, options, events);
+    engine.eventStore.add(window, 'resize', debouncedResize);
     engine.translate.to(engine.location);
-    rootNodeSize = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
+    rootSize = engine.axis.measureSize(root.getBoundingClientRect());
+    plugins.forEach(function (plugin) {
+      return plugin.init(self);
+    });
 
@@ -1399,3 +1349,3 @@ if (options.loop) {
           loop: false
-        });
+        }, withPlugins);
       }
@@ -1408,21 +1358,4 @@
       engine.dragHandler.addActivationEvents();
-
-      if (options.draggableClass) {
-        addClass(sliderRoot, options.draggableClass);
-      }
-
-      if (options.draggingClass) {
-        events.on('pointerDown', toggleDraggingClass).on('pointerUp', toggleDraggingClass);
-      }
     }
 
-    if (slides.length) {
-      engine.slideFocus.addActivationEvents(slides);
-    }
-
-    if (options.selectedClass) {
-      toggleSelectedClass();
-      events.on('select', toggleSelectedClass).on('pointerUp', toggleSelectedClass);
-    }
-
     if (!activated) {
@@ -1436,46 +1369,24 @@ setTimeout(function () {
 
-  function toggleDraggingClass(evt) {
-    var draggingClass = options.draggingClass;
-    if (evt === 'pointerDown') addClass(sliderRoot, draggingClass);else removeClass(sliderRoot, draggingClass);
+  function reActivate(withOptions, withPlugins) {
+    if (!activated) return;
+    var startIndex = selectedScrollSnap();
+    var newOptions = Object.assign({
+      startIndex: startIndex
+    }, withOptions);
+    deActivate();
+    activate(newOptions, withPlugins || plugins);
+    events.emit('reInit');
   }
 
-  function toggleSelectedClass() {
-    var selectedClass = options.selectedClass;
-    var inView = slidesInView(true);
-    var notInView = slidesNotInView(true);
-    notInView.forEach(function (index) {
-      return removeClass(slides[index], selectedClass);
-    });
-    inView.forEach(function (index) {
-      return addClass(slides[index], selectedClass);
-    });
-  }
-
   function deActivate() {
     engine.dragHandler.removeAllEvents();
-    engine.slideFocus.removeAllEvents();
     engine.animation.stop();
-    eventStore.removeAll();
+    engine.eventStore.removeAll();
     engine.translate.clear();
     engine.slideLooper.clear();
-    removeClass(sliderRoot, options.draggableClass);
-    slides.forEach(function (slide) {
-      return removeClass(slide, options.selectedClass);
+    plugins.forEach(function (plugin) {
+      return plugin.destroy();
     });
-    events.off('select', toggleSelectedClass).off('pointerUp', toggleSelectedClass).off('pointerDown', toggleDraggingClass).off('pointerUp', toggleDraggingClass);
   }
 
-  function reActivate(partialOptions) {
-    if (!activated) return;
-    var startIndex = selectedScrollSnap();
-
-    var newOptions = _extends({
-      startIndex: startIndex
-    }, partialOptions);
-
-    deActivate();
-    activate(newOptions);
-    events.emit('reInit');
-  }
-
   function destroy() {
@@ -1490,4 +1401,4 @@ if (!activated) return;
     if (!activated) return;
-    var size = engine.axis.measureSize(sliderRoot.getBoundingClientRect());
-    if (rootNodeSize !== size) reActivate();
+    var size = engine.axis.measureSize(root.getBoundingClientRect());
+    if (rootSize !== size) reActivate();
     events.emit('resize');
@@ -1554,3 +1465,3 @@ }
 
-  function dangerouslyGetEngine() {
+  function internalEngine() {
     return engine;
@@ -1560,3 +1471,3 @@ }
   function rootNode() {
-    return sliderRoot;
+    return root;
   }
@@ -1577,3 +1488,3 @@
     containerNode: containerNode,
-    dangerouslyGetEngine: dangerouslyGetEngine,
+    internalEngine: internalEngine,
     destroy: destroy,
@@ -1595,6 +1506,7 @@ off: off,
   };
+  activate(userOptions, userPlugins);
   return self;
 }
 
-function useEmblaCarousel(options) {
+function useEmblaCarousel(options, plugins) {
   if (options === void 0) {
@@ -1604,2 +1516,6 @@ options = {};
 
+  if (plugins === void 0) {
+    plugins = [];
+  }
+
   var _a = react.useState(),
@@ -1614,4 +1530,5 @@ embla = _a[0],
   var storedOptions = react.useRef(options);
+  var storedPlugins = react.useRef(plugins);
   var activeOptions = react.useMemo(function () {
-    if (!areEqualShallow(storedOptions.current, options)) {
+    if (!areObjectsEqualShallow(storedOptions.current, options)) {
       storedOptions.current = options;
@@ -1622,5 +1539,12 @@ }
   }, [storedOptions, options]);
+  var activePlugins = react.useMemo(function () {
+    if (!arePluginsEqual(storedPlugins.current, plugins)) {
+      storedPlugins.current = plugins;
+    }
+
+    return storedPlugins.current;
+  }, [storedPlugins, plugins]);
   react.useEffect(function () {
     if (canUseDOM() && viewport) {
-      var newEmbla_1 = EmblaCarousel(viewport, activeOptions);
+      var newEmbla_1 = EmblaCarousel(viewport, activeOptions, activePlugins);
       setEmbla(newEmbla_1);
@@ -1633,3 +1557,3 @@ return function () {
     }
-  }, [viewport, activeOptions, setEmbla]);
+  }, [viewport, activeOptions, activePlugins, setEmbla]);
   return [setViewport, embla];
@@ -1636,0 +1560,0 @@ }

embla-carousel-react.umd.js

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

index.d.ts

 export { EmblaOptionsType } from 'embla-carousel/components/Options';
 export { EmblaEventType } from 'embla-carousel/components/EventEmitter';
-export { EmblaCarouselType } from 'embla-carousel/components';
+export { EmblaCarouselType, EmblaPluginType } from 'embla-carousel/components';
 export { UseEmblaCarouselType } from './components';
 export { default } from './components';

package.json

 {
   "name": "embla-carousel-react",
-  "version": "5.0.1",
+  "version": "6.0.0",
   "author": "David Cetinkaya",
@@ -66,3 +66,3 @@ "description": "A lightweight carousel library with fluid motion and great swipe precision",
   "dependencies": {
-    "embla-carousel": "5.0.1"
+    "embla-carousel": "6.0.0"
   },
@@ -69,0 +69,0 @@ "peerDependencies": {

README.md

@@ -18,3 +18,3 @@ <br />
   <strong>
-    <h2 align="center">Embla Carousel</h2>
+    <h2 align="center">Embla Carousel React</h2>
   </strong>
@@ -21,0 +21,0 @@

No alert changes

Worsened metrics

Total package byte prevSize

192998

decreased by-2.91%

Lines of code

2688

decreased by-3.93%

Dependency changes

• + Addedembla-carousel@6.0.0(transitive)

• - Removedembla-carousel@5.0.1(transitive)

• Updatedembla-carousel@6.0.0