vevet 5.2.0 → 5.2.1

package/src/components/ScrollProgress/index.ts

@@ -4,7 +4,7 @@ import {
   IScrollProgressMutableProps,
   IScrollProgressStaticProps,
 } from './types';
-import { Module, TModuleCallbacksProps } from '@/base';
+import { Module, TModuleOnCallbacksProps } from '@/base';
 import { TRequiredProps } from '@/internal/requiredProps';
 import { initVevet } from '@/global/initVevet';
 import { addEventListener, clampScope } from '@/utils';
@@ -22,25 +22,23 @@ export * from './types';
  * @group Components
  */
 export class ScrollProgress<
-  CallbacksMap extends
-    IScrollProgressCallbacksMap = IScrollProgressCallbacksMap,
-  StaticProps extends IScrollProgressStaticProps = IScrollProgressStaticProps,
-  MutableProps extends
-    IScrollProgressMutableProps = IScrollProgressMutableProps,
-> extends Module<CallbacksMap, StaticProps, MutableProps> {
+  C extends IScrollProgressCallbacksMap = IScrollProgressCallbacksMap,
+  S extends IScrollProgressStaticProps = IScrollProgressStaticProps,
+  M extends IScrollProgressMutableProps = IScrollProgressMutableProps,
+> extends Module<C, S, M> {
   /** Retrieves the default static properties. */
-  public _getStatic(): TRequiredProps<StaticProps> {
+  public _getStatic(): TRequiredProps<S> {
     return {
       ...super._getStatic(),
       root: null,
       optimized: true,
       useSvh: false,
-    } as TRequiredProps<StaticProps>;
+    } as TRequiredProps<S>;
   }
 
   /** Retrieves the default mutable properties. */
-  public _getMutable(): TRequiredProps<MutableProps> {
-    return { ...super._getMutable() } as TRequiredProps<MutableProps>;
+  public _getMutable(): TRequiredProps<M> {
+    return { ...super._getMutable() } as TRequiredProps<M>;
   }
 
   /**
@@ -85,9 +83,10 @@ export class ScrollProgress<
   }
 
   constructor(
-    props?: StaticProps & MutableProps & TModuleCallbacksProps<CallbacksMap>,
+    props?: S & M,
+    onCallbacks?: TModuleOnCallbacksProps<C, ScrollProgress<C, S, M>>,
   ) {
-    super(props);
+    super(props, onCallbacks as any);
 
     this._isVisible = !this.props.optimized;
 

package/src/components/Scrollbar/index.ts

@@ -1,5 +1,5 @@
 import { TRequiredProps } from '@/internal/requiredProps';
-import { Module, TModuleCallbacksProps } from '@/base';
+import { Module, TModuleOnCallbacksProps } from '@/base';
 import {
   IScrollbarCallbacksMap,
   IScrollbarMutableProps,
@@ -24,12 +24,12 @@ export * from './types';
  * @group Components
  */
 export class Scrollbar<
-  CallbacksMap extends IScrollbarCallbacksMap = IScrollbarCallbacksMap,
-  StaticProps extends IScrollbarStaticProps = IScrollbarStaticProps,
-  MutableProps extends IScrollbarMutableProps = IScrollbarMutableProps,
-> extends Module<CallbacksMap, StaticProps, MutableProps> {
+  C extends IScrollbarCallbacksMap = IScrollbarCallbacksMap,
+  S extends IScrollbarStaticProps = IScrollbarStaticProps,
+  M extends IScrollbarMutableProps = IScrollbarMutableProps,
+> extends Module<C, S, M> {
   /** Get default static properties. */
-  public _getStatic(): TRequiredProps<StaticProps> {
+  public _getStatic(): TRequiredProps<S> {
     return {
       ...super._getStatic(),
       container: window,
@@ -39,16 +39,16 @@ export class Scrollbar<
       draggable: true,
       autoHide: true,
       resizeDebounce: 10,
-    } as TRequiredProps<StaticProps>;
+    } as TRequiredProps<S>;
   }
 
   /** Get default mutable properties. */
-  public _getMutable(): TRequiredProps<MutableProps> {
+  public _getMutable(): TRequiredProps<M> {
     return {
       ...super._getMutable(),
       minSize: 50,
       autoSize: true,
-    } as TRequiredProps<MutableProps>;
+    } as TRequiredProps<M>;
   }
 
   get prefix() {
@@ -114,9 +114,10 @@ export class Scrollbar<
   protected _isRtl = false;
 
   constructor(
-    props?: StaticProps & MutableProps & TModuleCallbacksProps<CallbacksMap>,
+    props?: S & M,
+    onCallbacks?: TModuleOnCallbacksProps<C, Scrollbar<C, S, M>>,
   ) {
-    super(props);
+    super(props, onCallbacks as any);
 
     // detect features
     this._isRtl = getTextDirection(this.parent) === 'rtl';

package/src/components/Snap/index.ts

@@ -1,4 +1,4 @@
-import { Module, TModuleCallbacksProps } from '@/base';
+import { Module, TModuleOnCallbacksProps } from '@/base';
 import { Timeline } from '../Timeline';
 import {
   ISnapCallbacksMap,
@@ -50,21 +50,21 @@ export * from './Slide';
  * @group Components
  */
 export class Snap<
-  CallbacksMap extends ISnapCallbacksMap = ISnapCallbacksMap,
-  StaticProps extends ISnapStaticProps = ISnapStaticProps,
-  MutableProps extends ISnapMutableProps = ISnapMutableProps,
-> extends Module<CallbacksMap, StaticProps, MutableProps> {
+  C extends ISnapCallbacksMap = ISnapCallbacksMap,
+  S extends ISnapStaticProps = ISnapStaticProps,
+  M extends ISnapMutableProps = ISnapMutableProps,
+> extends Module<C, S, M> {
   /** Retrieves the default static properties. */
-  public _getStatic(): TRequiredProps<StaticProps> {
+  public _getStatic(): TRequiredProps<S> {
     return {
       ...super._getStatic(),
       eventsEmitter: null,
       activeIndex: 0,
-    } as TRequiredProps<StaticProps>;
+    } as TRequiredProps<S>;
   }
 
   /** Retrieves the default mutable properties. */
-  public _getMutable(): TRequiredProps<MutableProps> {
+  public _getMutable(): TRequiredProps<M> {
     return {
       ...super._getMutable(),
       slides: false,
@@ -100,7 +100,7 @@ export class Snap<
       stickOnWheelEnd: true,
       stickOnWheelEndThreshold: 30,
       slideSize: 'auto',
-    } as TRequiredProps<MutableProps>;
+    } as TRequiredProps<M>;
   }
 
   /** Animation frame for smooth animations */
@@ -140,9 +140,10 @@ export class Snap<
   protected _targetIndex?: number;
 
   constructor(
-    props?: StaticProps & MutableProps & TModuleCallbacksProps<CallbacksMap>,
+    props?: S & M,
+    onCallbacks?: TModuleOnCallbacksProps<C, Snap<C, S, M>>,
   ) {
-    super(props);
+    super(props, onCallbacks as any);
 
     const { container, activeIndex } = this.props;
 

package/src/components/SplitText/index.ts

@@ -9,7 +9,7 @@ import {
   ISplitTextStaticProps,
   ISplitTextWordMeta,
 } from './types';
-import { Module, TModuleCallbacksProps } from '@/base';
+import { Module, TModuleOnCallbacksProps } from '@/base';
 import { TRequiredProps } from '@/internal/requiredProps';
 import { initVevet } from '@/global/initVevet';
 import { saveInitialNodes } from './utils/saveInitialNodes';
@@ -33,14 +33,14 @@ export * from './types';
  * @group Components
  */
 export class SplitText<
-  CallbacksMap extends ISplitTextCallbacksMap = ISplitTextCallbacksMap,
-  StaticProps extends ISplitTextStaticProps = ISplitTextStaticProps,
-  MutableProps extends ISplitTextMutableProps = ISplitTextMutableProps,
-> extends Module<CallbacksMap, StaticProps, MutableProps> {
+  C extends ISplitTextCallbacksMap = ISplitTextCallbacksMap,
+  S extends ISplitTextStaticProps = ISplitTextStaticProps,
+  M extends ISplitTextMutableProps = ISplitTextMutableProps,
+> extends Module<C, S, M> {
   /**
    * Retrieves the default static properties.
    */
-  public _getStatic(): TRequiredProps<StaticProps> {
+  public _getStatic(): TRequiredProps<S> {
     return {
       ...super._getStatic(),
       letters: false,
@@ -58,14 +58,14 @@ export class SplitText<
       prepareText: (text) => text,
       wordDelimiter: String.fromCharCode(32),
       wordDelimiterOutput: null,
-    } as TRequiredProps<StaticProps>;
+    } as TRequiredProps<S>;
   }
 
   /**
    * Retrieves the default mutable properties.
    */
-  public _getMutable(): TRequiredProps<MutableProps> {
-    return { ...super._getMutable() } as TRequiredProps<MutableProps>;
+  public _getMutable(): TRequiredProps<M> {
+    return { ...super._getMutable() } as TRequiredProps<M>;
   }
 
   /**
@@ -151,9 +151,10 @@ export class SplitText<
    * Initializes the SplitText instance and saves the initial state.
    */
   constructor(
-    props?: StaticProps & MutableProps & TModuleCallbacksProps<CallbacksMap>,
+    props?: S & M,
+    onCallbacks?: TModuleOnCallbacksProps<C, SplitText<C, S, M>>,
   ) {
-    super(props);
+    super(props, onCallbacks as any);
 
     const { container } = this.props;
     const { style } = container;

package/src/components/Swipe/index.ts

@@ -1,4 +1,4 @@
-import { Module, TModuleCallbacksProps } from '@/base';
+import { Module, TModuleOnCallbacksProps } from '@/base';
 import { TRequiredProps } from '@/internal/requiredProps';
 import {
   ISwipeCallbacksMap,
@@ -35,26 +35,27 @@ const VELOCITIES_COUNT = 4;
  * @group Components
  */
 export class Swipe<
-  CallbacksMap extends ISwipeCallbacksMap = ISwipeCallbacksMap,
-  StaticProps extends ISwipeStaticProps = ISwipeStaticProps,
-  MutableProps extends ISwipeMutableProps = ISwipeMutableProps,
-> extends Module<CallbacksMap, StaticProps, MutableProps> {
+  C extends ISwipeCallbacksMap = ISwipeCallbacksMap,
+  S extends ISwipeStaticProps = ISwipeStaticProps,
+  M extends ISwipeMutableProps = ISwipeMutableProps,
+> extends Module<C, S, M> {
   /**
    * Returns default static properties.
    */
-  public _getStatic(): TRequiredProps<StaticProps> {
+  public _getStatic(): TRequiredProps<S> {
     return {
       ...super._getStatic(),
+      thumb: null,
       buttons: [0],
       pointers: 1,
       disableUserSelect: true,
-    } as TRequiredProps<StaticProps>;
+    } as TRequiredProps<S>;
   }
 
   /**
    * Returns default mutable properties.
    */
-  public _getMutable(): TRequiredProps<MutableProps> {
+  public _getMutable(): TRequiredProps<M> {
     return {
       ...super._getMutable(),
       enabled: true,
@@ -77,7 +78,7 @@ export class Swipe<
       distanceModifier: false,
       inertiaRatio: 1,
       inertiaDistanceThreshold: 50,
-    } as TRequiredProps<MutableProps>;
+    } as TRequiredProps<M>;
   }
 
   /** Pointer event manager */
@@ -128,11 +129,12 @@ export class Swipe<
   protected _cursorStyles: HTMLStyleElement;
 
   constructor(
-    props?: StaticProps & MutableProps & TModuleCallbacksProps<CallbacksMap>,
+    props?: S & M,
+    onCallbacks?: TModuleOnCallbacksProps<C, Swipe<C, S, M>>,
   ) {
-    super(props);
+    super(props, onCallbacks as any);
 
-    const { container, buttons, pointers } = this.props;
+    const { container, thumb, buttons, pointers } = this.props;
 
     // set default data
     this._coords = {
@@ -151,7 +153,7 @@ export class Swipe<
 
     // create pointers
     this._pointers = new Pointers({
-      container,
+      container: thumb || container,
       buttons,
       minPointers: pointers,
       maxPointers: pointers,

package/src/components/Swipe/types.ts

@@ -9,6 +9,12 @@ export interface ISwipeStaticProps extends IModuleStaticProps {
   /** Event listener container. */
   container: HTMLElement | SVGElement;
 
+  /**
+   * An element that triggers the swipe start.
+   * Calculations remain relative to the container regardless of this element.
+   */
+  thumb?: HTMLElement | SVGElement | null;
+
   /**
    * Determines which mouse buttons trigger events.
    * - 0: Main button pressed, usually the left button or the un-initialized state

package/src/components/Timeline/index.ts

@@ -1,5 +1,5 @@
 import { TRequiredProps } from '@/internal/requiredProps';
-import { Module, TModuleCallbacksProps } from '@/base/Module';
+import { Module, TModuleOnCallbacksProps } from '@/base/Module';
 import { clamp, easing } from '@/utils/math';
 import {
   ITimelineCallbacksMap,
@@ -21,22 +21,22 @@ export * from './types';
  * @group Components
  */
 export class Timeline<
-  CallbacksMap extends ITimelineCallbacksMap = ITimelineCallbacksMap,
-  StaticProps extends ITimelineStaticProps = ITimelineStaticProps,
-  MutableProps extends ITimelineMutableProps = ITimelineMutableProps,
-> extends Module<CallbacksMap, StaticProps, MutableProps> {
+  C extends ITimelineCallbacksMap = ITimelineCallbacksMap,
+  S extends ITimelineStaticProps = ITimelineStaticProps,
+  M extends ITimelineMutableProps = ITimelineMutableProps,
+> extends Module<C, S, M> {
   /** Get default static properties. */
-  public _getStatic(): TRequiredProps<StaticProps> {
-    return { ...super._getStatic() } as TRequiredProps<StaticProps>;
+  public _getStatic(): TRequiredProps<S> {
+    return { ...super._getStatic() } as TRequiredProps<S>;
   }
 
   /** Get default mutable properties. */
-  public _getMutable(): TRequiredProps<MutableProps> {
+  public _getMutable(): TRequiredProps<M> {
     return {
       ...super._getMutable(),
       easing: initVevet().props.easing,
       duration: 1000,
-    } as TRequiredProps<MutableProps>;
+    } as TRequiredProps<M>;
   }
 
   /** Current linear progress of the timeline (0 to 1). */
@@ -113,9 +113,10 @@ export class Timeline<
   }
 
   constructor(
-    props?: StaticProps & MutableProps & TModuleCallbacksProps<CallbacksMap>,
+    props?: S & M,
+    onCallbacks?: TModuleOnCallbacksProps<C, Timeline<C, S, M>>,
   ) {
-    super(props);
+    super(props, onCallbacks as any);
 
     // Initialize default values
     this._progress = 0;

package/src/manifest.json

@@ -1,3 +1,3 @@
 {
-  "version": "5.2.0"
+  "version": "5.2.1"
 }