embla-carousel-svelte - npm Package Compare versions

Comparing version 8.0.0-rc01 to 8.0.0-rc02

components/emblaCarouselSvelte.d.ts

 import { ActionReturn } from 'svelte/action';
-import { EmblaOptionsType, EmblaPluginType } from 'embla-carousel';
+import { EmblaCarouselType, EmblaOptionsType, EmblaPluginType } from 'embla-carousel';
 type EmblaCarouselParameterType = {
@@ -7,3 +7,6 @@ options: EmblaOptionsType;
 };
-export type EmblaCarouselSvelteType = ActionReturn<EmblaCarouselParameterType>;
+type EmblaCarouselAttributesType = {
+    'on:emblaInit'?: (evt: CustomEvent<EmblaCarouselType>) => void;
+};
+export type EmblaCarouselSvelteType = ActionReturn<EmblaCarouselParameterType, EmblaCarouselAttributesType>;
 declare function emblaCarouselSvelte(emblaNode: HTMLElement, emblaConfig?: EmblaCarouselParameterType): EmblaCarouselSvelteType;
@@ -10,0 +13,0 @@ declare namespace emblaCarouselSvelte {

embla-carousel-svelte.cjs.js

@@ -19,3 +19,3 @@ 'use strict';
     embla = EmblaCarousel__default["default"](emblaNode, storedEmblaConfig.options, storedEmblaConfig.plugins);
-    embla.on('init', () => emblaNode.dispatchEvent(new CustomEvent('init', {
+    embla.on('init', () => emblaNode.dispatchEvent(new CustomEvent('emblaInit', {
       detail: embla
@@ -22,0 +22,0 @@ })));

embla-carousel-svelte.esm.js

@@ -13,3 +13,3 @@ import { canUseDOM, areOptionsEqual, arePluginsEqual } from 'embla-carousel-reactive-utils';
     embla = EmblaCarousel(emblaNode, storedEmblaConfig.options, storedEmblaConfig.plugins);
-    embla.on('init', () => emblaNode.dispatchEvent(new CustomEvent('init', {
+    embla.on('init', () => emblaNode.dispatchEvent(new CustomEvent('emblaInit', {
       detail: embla
@@ -16,0 +16,0 @@ })));

embla-carousel-svelte.umd.js

@@ -146,3 +146,3 @@ (function (global, factory) {
   }
-  function Animation(callback) {
+  function Animation(update, draw) {
     const documentVisibleHandler = EventStore();
@@ -153,3 +153,5 @@ const timeStep = 1000 / 60;
     let animationFrame = 0;
-    function init() {
+    let engine;
+    function init(engineInstance) {
+      engine = engineInstance;
       documentVisibleHandler.add(document, 'visibilitychange', () => {
@@ -176,5 +178,6 @@ if (document.hidden) lastTimeStamp = null;
       while (delta >= timeStep) {
-        callback();
+        update(engine);
         delta -= timeStep;
       }
+      draw(engine);
       if (animationFrame) start();
@@ -582,2 +585,3 @@ }
       attractionDirection = mathSign(attraction.get() || diff);
+      return self;
     }
@@ -1142,10 +1146,18 @@ function settle(target) {
     const slideIndexes = arrayKeys(slides);
-    // Draw
-    const animationCallback = () => {
-      const pointerDown = engine.dragHandler.pointerDown();
-      if (!loop) engine.scrollBounds.constrain(pointerDown);
-      engine.scrollBody.seek(target);
-      const settled = engine.scrollBody.settle(target);
+    // Animation
+    function update({
+      target,
+      dragHandler,
+      scrollBody,
+      scrollBounds,
+      scrollLooper,
+      slideLooper,
+      eventHandler,
+      animation
+    }) {
+      const pointerDown = dragHandler.pointerDown();
+      if (!loop) scrollBounds.constrain(pointerDown);
+      const settled = scrollBody.seek(target).settle(target);
       if (settled && !pointerDown) {
-        engine.animation.stop();
+        animation.stop();
         eventHandler.emit('settle');
@@ -1157,10 +1169,15 @@ }
       if (loop) {
-        engine.scrollLooper.loop(engine.scrollBody.direction());
-        engine.slideLooper.loop();
+        scrollLooper.loop(scrollBody.direction());
+        slideLooper.loop();
       }
-      engine.translate.to(location);
-    };
+    }
+    function draw({
+      translate,
+      location
+    }) {
+      translate.to(location);
+    }
     // Shared
     const friction = 0.68;
-    const animation = Animation(animationCallback);
+    const animation = Animation(update, draw);
     const startLocation = scrollSnaps[index.get()];
@@ -1175,2 +1192,3 @@ const location = Vector1D(startLocation);
     const engine = {
+      eventHandler,
       containerRect,
@@ -1342,4 +1360,4 @@ slideRects,
       }) => options)]).forEach(query => mediaHandlers.add(query, 'change', reActivate));
-      engine.animation.init();
-      eventHandler.init(self);
+      engine.animation.init(engine);
+      engine.eventHandler.init(self);
       engine.resizeHandler.init(self, options.watchResize);
@@ -1485,3 +1503,3 @@ engine.slidesHandler.init(self, options.watchSlides);
       embla = EmblaCarousel(emblaNode, storedEmblaConfig.options, storedEmblaConfig.plugins);
-      embla.on('init', () => emblaNode.dispatchEvent(new CustomEvent('init', {
+      embla.on('init', () => emblaNode.dispatchEvent(new CustomEvent('emblaInit', {
         detail: embla
@@ -1488,0 +1506,0 @@ })));

package.json

 {
   "name": "embla-carousel-svelte",
-  "version": "8.0.0-rc01",
+  "version": "8.0.0-rc02",
   "author": "David Jerleke",
@@ -59,4 +59,4 @@ "description": "A lightweight carousel library with fluid motion and great swipe precision",
   "dependencies": {
-    "embla-carousel": "8.0.0-rc01",
-    "embla-carousel-reactive-utils": "8.0.0-rc01"
+    "embla-carousel": "8.0.0-rc02",
+    "embla-carousel-reactive-utils": "8.0.0-rc02"
   },
@@ -63,0 +63,0 @@ "peerDependencies": {

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

55697

increased by0.79%

Lines of code

1604

increased by1.33%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• + Addedembla-carousel@8.0.0-rc02(transitive)

• + Addedembla-carousel-reactive-utils@8.0.0-rc02(transitive)

• - Removedembla-carousel@8.0.0-rc01(transitive)

• - Removedembla-carousel-reactive-utils@8.0.0-rc01(transitive)

• Updatedembla-carousel@8.0.0-rc02

• Updatedembla-carousel-reactive-utils@8.0.0-rc02