vevet 3.3.2 → 3.5.0

package/src/components/Ctx2D/index.ts

@@ -12,7 +12,7 @@ export type { NCtx2D };
 export class Ctx2D<
   StaticProps extends NCtx2D.IStaticProps = NCtx2D.IStaticProps,
   ChangeableProps extends NCtx2D.IChangeableProps = NCtx2D.IChangeableProps,
-  CallbacksTypes extends NCtx2D.ICallbacksTypes = NCtx2D.ICallbacksTypes
+  CallbacksTypes extends NCtx2D.ICallbacksTypes = NCtx2D.ICallbacksTypes,
 > extends ComponentClass<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {
@@ -35,7 +35,7 @@ export class Ctx2D<
   }
 
   /** The Canvas element itself */
-  private _canvas: HTMLCanvasElement;
+  protected _canvas: HTMLCanvasElement;
 
   /** The Canvas element itself */
   get canvas() {
@@ -43,7 +43,7 @@ export class Ctx2D<
   }
 
   /** 2D Context */
-  private _ctx: CanvasRenderingContext2D;
+  protected _ctx: CanvasRenderingContext2D;
 
   /** 2D Context */
   get ctx() {
@@ -51,7 +51,7 @@ export class Ctx2D<
   }
 
   /* Canvas width (with DPR) */
-  private _width: number;
+  protected _width: number;
 
   /* Canvas width (with DPR) */
   get width() {
@@ -64,7 +64,7 @@ export class Ctx2D<
   }
 
   /* Canvas height (with DPR) */
-  private _height: number;
+  protected _height: number;
 
   /* Canvas height (with DPR) */
   get height() {
@@ -77,7 +77,7 @@ export class Ctx2D<
   }
 
   /** Device pixel ratio */
-  private _dpr: number;
+  protected _dpr: number;
 
   /** Device pixel ratio */
   get dpr() {
@@ -135,7 +135,7 @@ export class Ctx2D<
   }
 
   /** Set resize events */
-  private _setResize() {
+  protected _setResize() {
     const { hasInitialResize, hasResize, viewportTarget, resizeDebounce } =
       this.props;
 

package/src/components/Ctx2DPrerender/index.ts

@@ -8,9 +8,12 @@ export type { NCtx2DPrerender } from './types';
  * The class allows you to prerender media for further use with reduced payloads.
  */
 export class Ctx2DPrerender<
-  StaticProps extends NCtx2DPrerender.IStaticProps = NCtx2DPrerender.IStaticProps,
-  ChangeableProps extends NCtx2DPrerender.IChangeableProps = NCtx2DPrerender.IChangeableProps,
-  CallbacksTypes extends NCtx2DPrerender.ICallbacksTypes = NCtx2DPrerender.ICallbacksTypes
+  StaticProps extends
+    NCtx2DPrerender.IStaticProps = NCtx2DPrerender.IStaticProps,
+  ChangeableProps extends
+    NCtx2DPrerender.IChangeableProps = NCtx2DPrerender.IChangeableProps,
+  CallbacksTypes extends
+    NCtx2DPrerender.ICallbacksTypes = NCtx2DPrerender.ICallbacksTypes,
 > extends Ctx2D<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {

package/src/components/CustomCursor/index.ts

@@ -11,8 +11,10 @@ export type { NCustomCursor };
  */
 export class CustomCursor<
   StaticProps extends NCustomCursor.IStaticProps = NCustomCursor.IStaticProps,
-  ChangeableProps extends NCustomCursor.IChangeableProps = NCustomCursor.IChangeableProps,
-  CallbacksTypes extends NCustomCursor.ICallbacksTypes = NCustomCursor.ICallbacksTypes
+  ChangeableProps extends
+    NCustomCursor.IChangeableProps = NCustomCursor.IChangeableProps,
+  CallbacksTypes extends
+    NCustomCursor.ICallbacksTypes = NCustomCursor.ICallbacksTypes,
 > extends ComponentClass<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {
@@ -38,10 +40,10 @@ export class CustomCursor<
   }
 
   /** Cursor container */
-  private _container: Element | Window;
+  protected _container: Element | Window;
 
   /** The container is window */
-  private _isContainerWindow: boolean;
+  protected _isContainerWindow: boolean;
 
   /** DOM parent for the cursor element */
   get domContainer(): HTMLElement {
@@ -58,7 +60,7 @@ export class CustomCursor<
   }
 
   /** Outer cursor element */
-  private _outerElement!: HTMLElement;
+  protected _outerElement!: HTMLElement;
 
   /** Cursor element (inner element) */
   get innerElement() {
@@ -66,10 +68,10 @@ export class CustomCursor<
   }
 
   /** Inner cursor element */
-  private _innerElement!: HTMLElement;
+  protected _innerElement!: HTMLElement;
 
   /** Hovered element */
-  private _hoveredElement?: NCustomCursor.IHoveredElement | undefined;
+  protected _hoveredElement?: NCustomCursor.IHoveredElement | undefined;
 
   /** Hovered element */
   get hoveredElement(): NCustomCursor.IHoveredElement | undefined {
@@ -82,10 +84,10 @@ export class CustomCursor<
   }
 
   /** Animation frame */
-  private _animationFrame!: AnimationFrame;
+  protected _animationFrame!: AnimationFrame;
 
   /** Current cursor coordinates */
-  private _coords: NCustomCursor.ICoords;
+  protected _coords: NCustomCursor.ICoords;
 
   /** Current cursor coordinates */
   get coords() {
@@ -93,7 +95,7 @@ export class CustomCursor<
   }
 
   /** Target cursor coordinates */
-  private _targetCoords: NCustomCursor.ICoords;
+  protected _targetCoords: NCustomCursor.ICoords;
 
   /** Target cursor coordinates */
   get targetCoords() {
@@ -180,7 +182,7 @@ export class CustomCursor<
   }
 
   /** Create custom cursor */
-  private _createCursor() {
+  protected _createCursor() {
     const { container, domContainer } = this;
 
     // hide native cursor
@@ -197,7 +199,7 @@ export class CustomCursor<
       class: this.className(
         '',
         container instanceof Window ? '-in-window' : '-in-element',
-        '-disabled'
+        '-disabled',
       ),
       parent: domContainer,
     });
@@ -225,7 +227,7 @@ export class CustomCursor<
   }
 
   /** Set module events */
-  private _setEvents() {
+  protected _setEvents() {
     const { domContainer } = this;
 
     this._animationFrame = new AnimationFrame();
@@ -235,38 +237,38 @@ export class CustomCursor<
     this.addEventListener(
       domContainer,
       'mouseenter',
-      this._handleMouseEnter.bind(this)
+      this._handleMouseEnter.bind(this),
     );
 
     this.addEventListener(
       domContainer,
       'mouseleave',
-      this._handleMouseLeave.bind(this)
+      this._handleMouseLeave.bind(this),
     );
 
     this.addEventListener(
       domContainer,
       'mousemove',
-      this._handleMouseMove.bind(this)
+      this._handleMouseMove.bind(this),
     );
 
     this.addEventListener(
       domContainer,
       'mousedown',
-      this._handleMouseDown.bind(this)
+      this._handleMouseDown.bind(this),
     );
 
     this.addEventListener(
       domContainer,
       'mouseup',
-      this._handleMouseUp.bind(this)
+      this._handleMouseUp.bind(this),
     );
 
     this.addEventListener(window, 'blur', this._handleWindowBlur.bind(this));
   }
 
   /** Event on mouse enter */
-  private _handleMouseEnter(evt: MouseEvent) {
+  protected _handleMouseEnter(evt: MouseEvent) {
     this._coords.x = evt.clientX;
     this._coords.y = evt.clientY;
     this._targetCoords.x = evt.clientX;
@@ -276,12 +278,12 @@ export class CustomCursor<
   }
 
   /** Event on mouse leave */
-  private _handleMouseLeave() {
+  protected _handleMouseLeave() {
     this.outerElement.classList.remove(this.className('-in-action'));
   }
 
   /** Event on mouse move */
-  private _handleMouseMove(evt: MouseEvent) {
+  protected _handleMouseMove(evt: MouseEvent) {
     this._targetCoords.x = evt.clientX;
     this._targetCoords.y = evt.clientY;
 
@@ -293,7 +295,7 @@ export class CustomCursor<
   }
 
   /** Event on mouse down */
-  private _handleMouseDown(evt: MouseEvent) {
+  protected _handleMouseDown(evt: MouseEvent) {
     if (evt.which === 1) {
       this.outerElement.classList.add(this.className('-click'));
       this.innerElement.classList.add(this.className('-click'));
@@ -301,20 +303,20 @@ export class CustomCursor<
   }
 
   /** Event on mouse up */
-  private _handleMouseUp() {
+  protected _handleMouseUp() {
     this.outerElement.classList.remove(this.className('-click'));
     this.innerElement.classList.remove(this.className('-click'));
   }
 
   /** Event on window blur */
-  private _handleWindowBlur() {
+  protected _handleWindowBlur() {
     this._handleMouseUp();
   }
 
   /** Set hover events on an element */
   public addHoverElement(
     settingsProp: NCustomCursor.IHoveredElement,
-    enterTimeout = 100
+    enterTimeout = 100,
   ) {
     const settings: NCustomCursor.IHoveredElement = {
       width: 'auto',
@@ -387,7 +389,7 @@ export class CustomCursor<
   }
 
   /** Recalculate current coordinates */
-  private _calculateCoords() {
+  protected _calculateCoords() {
     const { targetCoords, _coords: coords } = this;
 
     coords.x = this._lerp(coords.x, targetCoords.x);
@@ -397,7 +399,7 @@ export class CustomCursor<
   }
 
   /** Linear interpolation */
-  private _lerp(current: number, target: number) {
+  protected _lerp(current: number, target: number) {
     const { isFpsNormalized, lerp: ease } = this.props;
 
     const fpsMultiplier = isFpsNormalized
@@ -410,7 +412,7 @@ export class CustomCursor<
   }
 
   /** Render elements */
-  private _renderElements(): NCustomCursor.ICoords {
+  protected _renderElements(): NCustomCursor.ICoords {
     const { domContainer, outerElement } = this;
     let { x, y } = this.coords;
     const { width, height } = this.coords;

package/src/components/DraggerBase/index.ts

@@ -15,8 +15,10 @@ export type { NDraggerBase };
  */
 export abstract class DraggerBase<
   StaticProps extends NDraggerBase.IStaticProps = NDraggerBase.IStaticProps,
-  ChangeableProps extends NDraggerBase.IChangeableProps = NDraggerBase.IChangeableProps,
-  CallbacksTypes extends NDraggerBase.ICallbacksTypes = NDraggerBase.ICallbacksTypes
+  ChangeableProps extends
+    NDraggerBase.IChangeableProps = NDraggerBase.IChangeableProps,
+  CallbacksTypes extends
+    NDraggerBase.ICallbacksTypes = NDraggerBase.ICallbacksTypes,
 > extends ComponentClass<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {
@@ -32,7 +34,7 @@ export abstract class DraggerBase<
   }
 
   /** Preloader container */
-  private _container: Element | Window;
+  protected _container: Element | Window;
 
   /** Preloader container */
   get container() {
@@ -48,7 +50,7 @@ export abstract class DraggerBase<
   }
 
   /** Current pointer id */
-  private _pointerID: number | null;
+  protected _pointerID: number | null;
 
   /** Current pointer id */
   protected get pointerID() {
@@ -56,7 +58,7 @@ export abstract class DraggerBase<
   }
 
   /** Current coordinates */
-  private _coords: NDraggerBase.IVector2;
+  protected _coords: NDraggerBase.IVector2;
 
   /** Current coordinates */
   get coords() {
@@ -69,7 +71,7 @@ export abstract class DraggerBase<
   }
 
   /** Last coordinates */
-  private _prevCoords: NDraggerBase.IVector2;
+  protected _prevCoords: NDraggerBase.IVector2;
 
   /** Last coordinates */
   get prevCoords() {
@@ -82,7 +84,7 @@ export abstract class DraggerBase<
   }
 
   /** Coordinates on drag start */
-  private _startCoords: NDraggerBase.IVector2;
+  protected _startCoords: NDraggerBase.IVector2;
 
   /** Coordinates on drag start */
   get startCoords() {
@@ -90,10 +92,10 @@ export abstract class DraggerBase<
   }
 
   /** Timeout of `handleEnd` */
-  private _handleEndTimeout?: NodeJS.Timeout;
+  protected _handleEndTimeout?: NodeJS.Timeout;
 
   /** Current event type */
-  private _type?: 'mouse' | 'touch';
+  protected _type?: 'mouse' | 'touch';
 
   /** Current event type */
   get type() {
@@ -132,14 +134,14 @@ export abstract class DraggerBase<
       this.container,
       'mousedown',
       (event) => this._handleStart(event),
-      { passive: this.props.isPassive }
+      { passive: this.props.isPassive },
     );
 
     this.addEventListener(
       this.container,
       'touchstart',
       (event) => this._handleStart(event),
-      { passive: this.props.isPassive }
+      { passive: this.props.isPassive },
     );
   }
 
@@ -150,30 +152,30 @@ export abstract class DraggerBase<
     this._runtimeListeners.push(
       addEventListener(window, 'mouseup', (event) => this.handleEnd(event), {
         passive: isPassive,
-      })
+      }),
     );
 
     this._runtimeListeners.push(
       addEventListener(window, 'touchend', (event) => this.handleEnd(event), {
         passive: isPassive,
-      })
+      }),
     );
 
     this._runtimeListeners.push(
       addEventListener(window, 'touchcancel', () => this.cancel(), {
         passive: isPassive,
-      })
+      }),
     );
 
     this._runtimeListeners.push(
       addEventListener(window, 'blur', () => this.cancel(), {
         passive: isPassive,
-      })
+      }),
     );
   }
 
   /** Remove runtime events */
-  private _removeRuntimeEvents() {
+  protected _removeRuntimeEvents() {
     this._runtimeListeners.forEach((listener) => listener.remove());
 
     this._runtimeListeners = [];
@@ -202,7 +204,7 @@ export abstract class DraggerBase<
   }
 
   /** Event on drag start */
-  private _handleStart(event: NDraggerBase.TEvent) {
+  protected _handleStart(event: NDraggerBase.TEvent) {
     if (!this.props.isEnabled || this.isDragging) {
       return false;
     }
@@ -242,7 +244,7 @@ export abstract class DraggerBase<
   }
 
   /** Event on drag end */
-  private handleEnd(event: NDraggerBase.TEvent) {
+  protected handleEnd(event: NDraggerBase.TEvent) {
     if (this._handleEndTimeout) {
       return;
     }

package/src/components/DraggerDirection/index.ts

@@ -7,9 +7,12 @@ export type { NDraggerDirection };
  * `Dragger` that detects swipe direction
  */
 export class DraggerDirection<
-  StaticProps extends NDraggerDirection.IStaticProps = NDraggerDirection.IStaticProps,
-  ChangeableProps extends NDraggerDirection.IChangeableProps = NDraggerDirection.IChangeableProps,
-  CallbacksTypes extends NDraggerDirection.ICallbacksTypes = NDraggerDirection.ICallbacksTypes
+  StaticProps extends
+    NDraggerDirection.IStaticProps = NDraggerDirection.IStaticProps,
+  ChangeableProps extends
+    NDraggerDirection.IChangeableProps = NDraggerDirection.IChangeableProps,
+  CallbacksTypes extends
+    NDraggerDirection.ICallbacksTypes = NDraggerDirection.ICallbacksTypes,
 > extends DraggerBase<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {

package/src/components/DraggerMove/index.ts

@@ -9,8 +9,10 @@ export type { NDraggerMove };
  */
 export class DraggerMove<
   StaticProps extends NDraggerMove.IStaticProps = NDraggerMove.IStaticProps,
-  ChangeableProps extends NDraggerMove.IChangeableProps = NDraggerMove.IChangeableProps,
-  CallbacksTypes extends NDraggerMove.ICallbacksTypes = NDraggerMove.ICallbacksTypes
+  ChangeableProps extends
+    NDraggerMove.IChangeableProps = NDraggerMove.IChangeableProps,
+  CallbacksTypes extends
+    NDraggerMove.ICallbacksTypes = NDraggerMove.ICallbacksTypes,
 > extends DraggerBase<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {
@@ -52,8 +54,8 @@ export class DraggerMove<
         },
         {
           passive: isPassive,
-        }
-      )
+        },
+      ),
     );
 
     this._runtimeListeners.push(
@@ -67,8 +69,8 @@ export class DraggerMove<
         },
         {
           passive: isPassive,
-        }
-      )
+        },
+      ),
     );
   }
 
@@ -106,7 +108,7 @@ export class DraggerMove<
     this._togglePointerEvents(true);
   }
 
-  private _togglePointerEvents(isEnabledProp: boolean) {
+  protected _togglePointerEvents(isEnabledProp: boolean) {
     if (typeof this.props.disablePointerEventsAt !== 'number') {
       return;
     }

package/src/components/Marquee/index.ts

@@ -13,7 +13,7 @@ export type { NMarquee };
 export class Marquee<
   StaticProps extends NMarquee.IStaticProps = NMarquee.IStaticProps,
   ChangeableProps extends NMarquee.IChangeableProps = NMarquee.IChangeableProps,
-  CallbacksTypes extends NMarquee.ICallbacksTypes = NMarquee.ICallbacksTypes
+  CallbacksTypes extends NMarquee.ICallbacksTypes = NMarquee.ICallbacksTypes,
 > extends ComponentClass<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {
@@ -63,7 +63,7 @@ export class Marquee<
   protected _canPlay: boolean;
 
   /** Animation frame */
-  private _animationFrame?: AnimationFrame;
+  protected _animationFrame?: AnimationFrame;
 
   constructor(initialProps?: StaticProps & ChangeableProps, canInit = true) {
     super(initialProps, false);
@@ -190,7 +190,7 @@ export class Marquee<
     // get items quantity
     if (itemWidth < container.clientWidth) {
       this._quantity = Math.ceil(
-        (container.clientWidth + itemWidth) / itemWidth
+        (container.clientWidth + itemWidth) / itemWidth,
       );
     }
     this._quantity = Math.max(this._quantity, 4);

package/src/components/Preloader/index.ts

@@ -11,8 +11,10 @@ export type { NPreloader };
  */
 export class Preloader<
   StaticProps extends NPreloader.IStaticProps = NPreloader.IStaticProps,
-  ChangeableProps extends NPreloader.IChangeableProps = NPreloader.IChangeableProps,
-  CallbacksTypes extends NPreloader.ICallbacksTypes = NPreloader.ICallbacksTypes
+  ChangeableProps extends
+    NPreloader.IChangeableProps = NPreloader.IChangeableProps,
+  CallbacksTypes extends
+    NPreloader.ICallbacksTypes = NPreloader.ICallbacksTypes,
 > extends ComponentClass<StaticProps, ChangeableProps, CallbacksTypes> {
   protected _getDefaultProps() {
     return {
@@ -27,7 +29,7 @@ export class Preloader<
   }
 
   /** Preloader container */
-  private _container?: HTMLElement | false;
+  protected _container?: HTMLElement | false;
 
   /** Preloader container */
   get container() {
@@ -35,7 +37,7 @@ export class Preloader<
   }
 
   /** Preloader start time */
-  private _startTime: number;
+  protected _startTime: number;
 
   /** Preloader start time */
   get startTime() {
@@ -43,7 +45,7 @@ export class Preloader<
   }
 
   /** Preloader end time */
-  private _endTime: number;
+  protected _endTime: number;
 
   /** Preloader end time */
   get endTime() {
@@ -58,10 +60,10 @@ export class Preloader<
   }
 
   /** Preloader is to be hidden */
-  private _isToBeHidden: boolean;
+  protected _isToBeHidden: boolean;
 
   /** Preloader is hidden */
-  private _isHidden: boolean;
+  protected _isHidden: boolean;
 
   /** Preloader is hidden */
   get isHidden() {
@@ -123,7 +125,7 @@ export class Preloader<
   }
 
   /** When the page is fully loaded */
-  private _handleLoaded() {
+  protected _handleLoaded() {
     this.callbacks.tbt('loaded', undefined);
 
     // hide the preloader
@@ -136,7 +138,7 @@ export class Preloader<
   public hide(
     duration = typeof this.props.hideAnimation !== 'boolean'
       ? this.props.hideAnimation
-      : 250
+      : 250,
   ) {
     this._isToBeHidden = true;
     this.callbacks.tbt('hide', undefined);
@@ -169,7 +171,7 @@ export class Preloader<
   }
 
   /** Handle the moment when the preloader is hidden */
-  private _handleHidden() {
+  protected _handleHidden() {
     this._isHidden = true;
     this.callbacks.tbt('hidden', undefined);
   }