@creative-web-solution/front-library 7.1.17 → 7.1.19

package/CHANGELOG.md

@@ -1,6 +1,14 @@
 # CHANGELOG
 
 
+## 7.1.19
+
+* [DragSlider] Fix variable init in goToItem
+
+## 7.1.18
+
+* [DragSlider] Expose some properties + allow item index in goToItem function
+
 ## 7.1.17
 
 * [DragSlider] Rework + add refresh function

package/Modules/DragSlider.ts

@@ -39,10 +39,22 @@ export default class DragSlider {
     #debouncedOnResize;
 
 
+    get count(): number {
+        return this.#$items?.length ?? 0;
+    }
+
+    get currentSnapItem(): FLib.DragSlider.Item | undefined {
+        return this.#currentSnapItem;
+    }
+
     get isActive(): boolean {
         return this.#isDraggingActive;
     }
 
+    get items(): NodeList | undefined {
+        return this.#$items;
+    }
+
 
     constructor( $slider: HTMLElement, options: Partial<FLib.DragSlider.Options> ) {
 
@@ -257,13 +269,13 @@ export default class DragSlider {
 
 
     #getClosestItem = ( xPos: number ): { snapItem: FLib.DragSlider.Item, snapToEnd: boolean } => {
-        let lastDelta, snapItem, snapToEnd = false;
+        let lastDelta, snapItem;
 
         const absXPos = Math.abs( xPos );
 
         for ( const item of this.#itemArray ) {
             const IS_LAST_DELTA = typeof lastDelta !== 'undefined';
-            let newDelta = Math.abs( absXPos - item.info.left + this.#siteOffsetLeft );
+            const newDelta = Math.abs( absXPos - item.info.left + this.#siteOffsetLeft );
 
             if ( !IS_LAST_DELTA || newDelta <= lastDelta ) {
                 lastDelta = newDelta;
@@ -273,7 +285,7 @@ export default class DragSlider {
 
         return {
             snapItem,
-            snapToEnd
+            snapToEnd: false
         };
     }
 
@@ -453,18 +465,33 @@ export default class DragSlider {
     }
 
 
-    goToItem( $block: HTMLElement ): gsap.core.Tween | void {
+    goToItem( blockOrIndex: HTMLElement | number ): gsap.core.Tween | void {
 
         if ( !this.#isDraggingActive ) {
             return;
         }
 
+        let $block;
+
+        if (typeof blockOrIndex === 'number') {
+            $block = this.#$items?.[blockOrIndex] as HTMLElement;
+        }
+        else {
+            $block = blockOrIndex;
+        }
+
+        if ( !$block ) {
+            return;
+        }
+
         const ITEM = this.#itemMap.get( $block );
 
         if ( !ITEM ) {
             return;
         }
 
+        this.#currentSnapItem = ITEM;
+
         this.#options.onSnap?.( {
             "item":        ITEM,
             "xPos":        this.#deltaMove.x,
@@ -494,8 +521,10 @@ export default class DragSlider {
         } );
     }
 
-    refresh = () => {
+    refresh = (): this => {
         this.#onResize();
+
+        return this;
     }
 
     init = (): this => {

package/README.md

@@ -1,6 +1,6 @@
 # Front Library
 
-@version: 7.1.17
+@version: 7.1.19
 
 
 ## Use

package/package.json

@@ -2,7 +2,7 @@
   "name": "@creative-web-solution/front-library",
   "title": "Frontend library",
   "description": "Frontend functions and modules",
-  "version": "7.1.17",
+  "version": "7.1.19",
   "homepage": "https://github.com/creative-web-solution/front-library",
   "author": "Creative Web Solution <contact@cws-studio.com> (https://www.cws-studio.com)",
   "keywords": [],