vevet 3.3.2 → 3.4.0

package/src/components/AnimationFrame/index.ts

@@ -21,29 +21,29 @@ export class AnimationFrame<
   }
 
   /** If the frame is launched */
-  private _isPlaying: boolean;
+  protected _isPlaying: boolean;
 
   get isPlaying() {
     return this._isPlaying;
   }
 
   /** The animation frame */
-  private _frame: number | null;
+  protected _frame: number | null;
 
   /** Last frame time */
-  private _frameIndex: number;
+  protected _frameIndex: number;
 
   /** First frame time */
-  private _firstFrameTime: null | number;
+  protected _firstFrameTime: null | number;
 
   /** Last frame time */
-  private _lastFrameTime: null | number;
+  protected _lastFrameTime: null | number;
 
   /** Array of frame time durations */
-  private _frameDurations: number[];
+  protected _frameDurations: number[];
 
   /** Computed fps */
-  private _computedFPS: number;
+  protected _computedFPS: number;
 
   /** Computed real time fps */
   get computedFPS() {
@@ -107,7 +107,7 @@ export class AnimationFrame<
   }
 
   /** Play animation */
-  private _play() {
+  protected _play() {
     if (this.isPlaying) {
       return;
     }
@@ -130,7 +130,7 @@ export class AnimationFrame<
   }
 
   /** Pause animation */
-  private _pause() {
+  protected _pause() {
     if (!this.isPlaying) {
       return;
     }
@@ -147,7 +147,7 @@ export class AnimationFrame<
   }
 
   /** Launch the animation frame */
-  private _animate() {
+  protected _animate() {
     if (!this._isPlaying) {
       return;
     }
@@ -186,7 +186,7 @@ export class AnimationFrame<
   }
 
   /** Compute real-time FPS */
-  private _computeFPS(startTime: number) {
+  protected _computeFPS(startTime: number) {
     const lastFrameDuration = startTime - (this._lastFrameTime ?? startTime);
 
     // skip frames that seem not real

package/src/components/BaseTimeline/index.ts

@@ -24,7 +24,7 @@ export class BaseTimeline<
   }
 
   /** Global timeline progress */
-  private _progress: number;
+  protected _progress: number;
 
   /** Global timeline progress */
   get progress() {
@@ -38,7 +38,7 @@ export class BaseTimeline<
   }
 
   /** Easing progress */
-  private _easing: number;
+  protected _easing: number;
 
   /** Easing progress */
   get easing() {
@@ -46,7 +46,7 @@ export class BaseTimeline<
   }
 
   /** Nested timelines */
-  private _nestedTimelines: { id: string; timeline: BaseTimeline }[];
+  protected _nestedTimelines: { id: string; timeline: BaseTimeline }[];
 
   constructor(initialProps?: StaticProps & ChangeableProps, canInit = true) {
     super(initialProps, false);
@@ -89,7 +89,7 @@ export class BaseTimeline<
   }
 
   /** Render nested timelines */
-  private _renderNestedTimelines() {
+  protected _renderNestedTimelines() {
     const { length } = this._nestedTimelines;
     if (length === 0) {
       return;

package/src/components/Ctx2D/index.ts

@@ -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/CustomCursor/index.ts

@@ -38,10 +38,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 +58,7 @@ export class CustomCursor<
   }
 
   /** Outer cursor element */
-  private _outerElement!: HTMLElement;
+  protected _outerElement!: HTMLElement;
 
   /** Cursor element (inner element) */
   get innerElement() {
@@ -66,10 +66,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 +82,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 +93,7 @@ export class CustomCursor<
   }
 
   /** Target cursor coordinates */
-  private _targetCoords: NCustomCursor.ICoords;
+  protected _targetCoords: NCustomCursor.ICoords;
 
   /** Target cursor coordinates */
   get targetCoords() {
@@ -180,7 +180,7 @@ export class CustomCursor<
   }
 
   /** Create custom cursor */
-  private _createCursor() {
+  protected _createCursor() {
     const { container, domContainer } = this;
 
     // hide native cursor
@@ -225,7 +225,7 @@ export class CustomCursor<
   }
 
   /** Set module events */
-  private _setEvents() {
+  protected _setEvents() {
     const { domContainer } = this;
 
     this._animationFrame = new AnimationFrame();
@@ -266,7 +266,7 @@ export class CustomCursor<
   }
 
   /** 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 +276,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 +293,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,13 +301,13 @@ 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();
   }
 
@@ -387,7 +387,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 +397,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 +410,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

@@ -32,7 +32,7 @@ export abstract class DraggerBase<
   }
 
   /** Preloader container */
-  private _container: Element | Window;
+  protected _container: Element | Window;
 
   /** Preloader container */
   get container() {
@@ -48,7 +48,7 @@ export abstract class DraggerBase<
   }
 
   /** Current pointer id */
-  private _pointerID: number | null;
+  protected _pointerID: number | null;
 
   /** Current pointer id */
   protected get pointerID() {
@@ -56,7 +56,7 @@ export abstract class DraggerBase<
   }
 
   /** Current coordinates */
-  private _coords: NDraggerBase.IVector2;
+  protected _coords: NDraggerBase.IVector2;
 
   /** Current coordinates */
   get coords() {
@@ -69,7 +69,7 @@ export abstract class DraggerBase<
   }
 
   /** Last coordinates */
-  private _prevCoords: NDraggerBase.IVector2;
+  protected _prevCoords: NDraggerBase.IVector2;
 
   /** Last coordinates */
   get prevCoords() {
@@ -82,7 +82,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 +90,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() {
@@ -173,7 +173,7 @@ export abstract class DraggerBase<
   }
 
   /** Remove runtime events */
-  private _removeRuntimeEvents() {
+  protected _removeRuntimeEvents() {
     this._runtimeListeners.forEach((listener) => listener.remove());
 
     this._runtimeListeners = [];
@@ -202,7 +202,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 +242,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/DraggerMove/index.ts

@@ -106,7 +106,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

@@ -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);

package/src/components/Preloader/index.ts

@@ -27,7 +27,7 @@ export class Preloader<
   }
 
   /** Preloader container */
-  private _container?: HTMLElement | false;
+  protected _container?: HTMLElement | false;
 
   /** Preloader container */
   get container() {
@@ -35,7 +35,7 @@ export class Preloader<
   }
 
   /** Preloader start time */
-  private _startTime: number;
+  protected _startTime: number;
 
   /** Preloader start time */
   get startTime() {
@@ -43,7 +43,7 @@ export class Preloader<
   }
 
   /** Preloader end time */
-  private _endTime: number;
+  protected _endTime: number;
 
   /** Preloader end time */
   get endTime() {
@@ -58,10 +58,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 +123,7 @@ export class Preloader<
   }
 
   /** When the page is fully loaded */
-  private _handleLoaded() {
+  protected _handleLoaded() {
     this.callbacks.tbt('loaded', undefined);
 
     // hide the preloader
@@ -169,7 +169,7 @@ export class Preloader<
   }
 
   /** Handle the moment when the preloader is hidden */
-  private _handleHidden() {
+  protected _handleHidden() {
     this._isHidden = true;
     this.callbacks.tbt('hidden', undefined);
   }

package/src/components/ProgressPreloader/index.ts

@@ -33,7 +33,7 @@ export class ProgressPreloader<
   }
 
   /** Images to be preloaded */
-  private _images: HTMLImageElement[];
+  protected _images: HTMLImageElement[];
 
   /** Images to be preloaded */
   get images() {
@@ -41,7 +41,7 @@ export class ProgressPreloader<
   }
 
   /** Videos to be preloaded */
-  private _videos: HTMLVideoElement[];
+  protected _videos: HTMLVideoElement[];
 
   /** Videos to be preloaded */
   get videos() {
@@ -49,14 +49,14 @@ export class ProgressPreloader<
   }
 
   /** Custom resources to be preloaded */
-  private _customResources: NProgressPreloader.ICustomResourceData[];
+  protected _customResources: NProgressPreloader.ICustomResourceData[];
 
   /** Custom resources to be preloaded */
   get customResources() {
     return this._customResources;
   }
 
-  private _resourcesQuantity: number;
+  protected _resourcesQuantity: number;
 
   /** Quantity of resources to be preloader */
   get resourcesQuantity() {
@@ -71,7 +71,7 @@ export class ProgressPreloader<
   }
 
   /** Quantity of loaded resources  */
-  private _loadedResourcesQuantity: number;
+  protected _loadedResourcesQuantity: number;
 
   /** Quantity of loaded resources  */
   get loadedResourcesQuantity() {
@@ -84,7 +84,7 @@ export class ProgressPreloader<
   }
 
   /** Preloader progress */
-  private _progress: number;
+  protected _progress: number;
 
   /** Preloader progress */
   get progress() {
@@ -98,10 +98,10 @@ export class ProgressPreloader<
   }
 
   /** Animation frame for smooth progress calculation */
-  private _animationFrame?: AnimationFrame;
+  protected _animationFrame?: AnimationFrame;
 
   /** Timeline to finish progress animation */
-  private _endTimeline?: Timeline;
+  protected _endTimeline?: Timeline;
 
   constructor(initialProps?: StaticProps & ChangeableProps, canInit = true) {
     super(initialProps, false);
@@ -255,7 +255,7 @@ export class ProgressPreloader<
   }
 
   /** Event on resource loaded */
-  private _handleLoadedResource({
+  protected _handleLoadedResource({
     element,
     isSuccess,
   }: NProgressPreloader.IHandleLoadedResourceParameter) {

package/src/components/ScrollBar/index.ts

@@ -35,7 +35,7 @@ export class ScrollBar<
   }
 
   /** Scroll container */
-  private _container: Element | Window | SmoothScroll;
+  protected _container: Element | Window | SmoothScroll;
 
   /** Scroll container */
   get container() {
@@ -81,10 +81,10 @@ export class ScrollBar<
   }
 
   /** Horizontal scrollbar */
-  private _xBar: Bar;
+  protected _xBar: Bar;
 
   /** Vertical scrollbar */
-  private _yBar: Bar;
+  protected _yBar: Bar;
 
   constructor(initialProps?: StaticProps & ChangeableProps, canInit = true) {
     super(initialProps, false);
@@ -139,7 +139,7 @@ export class ScrollBar<
   }
 
   // Set Module Events
-  private _setEvents() {
+  protected _setEvents() {
     const { container, props } = this;
 
     // default resize handler

package/src/components/ScrollView/index.ts

@@ -127,7 +127,7 @@ export class ScrollView<
   }
 
   /** Set view events */
-  private _setViewEvents() {
+  protected _setViewEvents() {
     if (!this._isIntersectionObserverSupported) {
       return;
     }

package/src/components/SmoothScroll/index.ts

@@ -48,14 +48,14 @@ export class SmoothScroll<
   }
 
   /** Scroll container */
-  private _container: HTMLElement;
+  protected _container: HTMLElement;
 
   /** Scroll container */
   get container() {
     return this._container;
   }
 
-  private _elements: Elements;
+  protected _elements: Elements;
 
   /**
    * Scroll wrapper. If the element does not exist indide the `container`,
@@ -194,7 +194,7 @@ export class SmoothScroll<
   protected _isInstant?: boolean;
 
   /** Animation frame */
-  private _animationFrame: AnimationFrame;
+  protected _animationFrame: AnimationFrame;
 
   /** Frame index */
   protected _frameIndex: number;
@@ -299,7 +299,7 @@ export class SmoothScroll<
   }
 
   /** Set resize events */
-  private _setResize() {
+  protected _setResize() {
     const { viewportTarget, resizeDebounce } = this.props;
 
     // resize handler