vevet 2.4.0 → 2.6.0

package/build/cjs/components/scroll/scrollable/ScrollView.js

@@ -71,7 +71,7 @@ var ScrollView = /** @class */ (function (_super) {
         configurable: true
     });
     ScrollView.prototype._getDefaultProp = function () {
-        return __assign(__assign({}, _super.prototype._getDefaultProp.call(this)), { enabled: true, container: window, elements: [], threshold: 0.9, states: 'in', classToToggle: 'viewed', useDelay: false, useIntersectionObserver: true, resizeTimeout: 0 });
+        return __assign(__assign({}, _super.prototype._getDefaultProp.call(this)), { enabled: true, container: window, elements: [], threshold: 0.9, states: 'in', classToToggle: 'viewed', useDelay: false, useIntersectionObserver: true, viewportTarget: '', resizeTimeout: 0 });
     };
     Object.defineProperty(ScrollView.prototype, "elements", {
         /**
@@ -91,7 +91,7 @@ var ScrollView = /** @class */ (function (_super) {
         var _this = this;
         _super.prototype._setEvents.call(this);
         this.resize();
-        this.addViewportCallback('', function () {
+        this.addViewportCallback(this.prop.viewportTarget, function () {
             _this.resize();
         }, {
             timeout: this.prop.resizeTimeout,

package/build/cjs/components/scroll/section/ScrollSectionProgress.js

@@ -0,0 +1,261 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ScrollSectionProgress = void 0;
+var vevet_dom_1 = require("vevet-dom");
+var onScroll_1 = __importDefault(require("../../../utils/listeners/onScroll"));
+var Component_1 = require("../../../base/Component");
+var clampScope_1 = __importDefault(require("../../../utils/math/clampScope"));
+var getScrollValues_1 = __importDefault(require("../../../utils/scroll/getScrollValues"));
+/**
+ * Elements into viewport
+ */
+var ScrollSectionProgress = /** @class */ (function (_super) {
+    __extends(ScrollSectionProgress, _super);
+    function ScrollSectionProgress(initialProp, init) {
+        if (init === void 0) { init = true; }
+        var _this = _super.call(this, initialProp, false) || this;
+        // get scroll container
+        if (typeof _this.prop.container === 'string') {
+            _this._scrollContainer = (0, vevet_dom_1.selectOne)(_this.prop.container);
+        }
+        else {
+            _this._scrollContainer = _this.prop.container;
+        }
+        // get section element
+        if (typeof _this.prop.section === 'string') {
+            _this._section = (0, vevet_dom_1.selectOne)(_this.prop.section);
+        }
+        else {
+            _this._section = _this.prop.section;
+        }
+        // set defaults
+        _this._progress = -0.001;
+        _this._scopeScroll = [0, 0];
+        _this._scopeIn = [0, 0];
+        _this._scopeMove = [0, 0];
+        _this._scopeOut = [0, 0];
+        // initialize the class
+        if (init) {
+            _this.init();
+        }
+        return _this;
+    }
+    ScrollSectionProgress.prototype._getDefaultProp = function () {
+        return __assign(__assign({}, _super.prototype._getDefaultProp.call(this)), { container: window, viewportTarget: '', resizeTimeout: 0 });
+    };
+    Object.defineProperty(ScrollSectionProgress.prototype, "scrollContainer", {
+        get: function () {
+            return this._scrollContainer;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "section", {
+        get: function () {
+            return this._section;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "scopeScroll", {
+        get: function () {
+            return this._scopeScroll;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "scopeIn", {
+        get: function () {
+            return this._scopeIn;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "scopeMove", {
+        get: function () {
+            return this._scopeMove;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "scopeOut", {
+        get: function () {
+            return this._scopeOut;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "progress", {
+        /**
+         * Global progress
+         */
+        get: function () {
+            return this._progress;
+        },
+        set: function (val) {
+            this._progress = val;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    ScrollSectionProgress.prototype.init = function () {
+        _super.prototype.init.call(this);
+    };
+    // Set Module Events
+    ScrollSectionProgress.prototype._setEvents = function () {
+        var _this = this;
+        _super.prototype._setEvents.call(this);
+        // set resize events
+        this.addViewportCallback(this.prop.viewportTarget, function () {
+            _this.resize();
+        }, {
+            timeout: this.prop.resizeTimeout,
+        });
+        // resize on page loaded
+        this._loadedEvent = this._app.onPageLoaded();
+        this._loadedEvent.then(function () {
+            _this.resize();
+        }).catch(function () { });
+        // set scroll events
+        this._scrollEvent = (0, onScroll_1.default)({
+            container: this.prop.container,
+            callback: this._handleScroll.bind(this),
+        });
+    };
+    ScrollSectionProgress.prototype._onPropMutate = function () {
+        _super.prototype._onPropMutate.call(this);
+        this.resize();
+    };
+    Object.defineProperty(ScrollSectionProgress.prototype, "progressIn", {
+        /**
+         * 'in' progress
+         */
+        get: function () {
+            return (0, clampScope_1.default)(this.progress, this.scopeIn) || 0;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "progressOut", {
+        /**
+         * 'out' progress
+         */
+        get: function () {
+            return (0, clampScope_1.default)(this.progress, this.scopeOut) || 0;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(ScrollSectionProgress.prototype, "progressMove", {
+        /**
+         * 'move' progress
+         */
+        get: function () {
+            return (0, clampScope_1.default)(this.progress, this.scopeMove) || 0;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    /**
+     * Handle scroll event
+     */
+    ScrollSectionProgress.prototype._handleScroll = function () {
+        // calculate scopes
+        var scrollData = (0, getScrollValues_1.default)(this.scrollContainer);
+        if (!scrollData) {
+            return;
+        }
+        this._render(scrollData);
+    };
+    /**
+     * Resize the scene
+     */
+    ScrollSectionProgress.prototype.resize = function () {
+        // calculate scopes
+        var scrollData = (0, getScrollValues_1.default)(this.scrollContainer);
+        if (!scrollData) {
+            return;
+        }
+        // get sizes
+        var bounding = this.section.getBoundingClientRect();
+        var vHeight = this._app.viewport.height;
+        // calculate scroll scope
+        var inStart = scrollData.scrollTop + bounding.top - vHeight;
+        var moveEnd = scrollData.scrollTop + bounding.top + bounding.height;
+        var scrollLine = moveEnd - inStart;
+        this._scopeScroll = [inStart, moveEnd];
+        // calculate scopes
+        this._scopeIn = [0, vHeight / scrollLine];
+        this._scopeOut = [1 - vHeight / scrollLine, 1];
+        this._scopeMove = [this._scopeIn[1], this._scopeOut[0]];
+        // launch callbacks
+        this.callbacks.tbt('resize', false);
+        // render the scene
+        this._render(scrollData, true);
+    };
+    /**
+     * Render the scene
+     */
+    ScrollSectionProgress.prototype._render = function (scrollData, force) {
+        if (force === void 0) { force = false; }
+        var canRender = this._canRender(scrollData, force);
+        if (!canRender) {
+            return;
+        }
+        this.callbacks.tbt('render', false);
+    };
+    /**
+     * Check if the section can be rendered
+     */
+    ScrollSectionProgress.prototype._canRender = function (scrollData, force) {
+        if (force === void 0) { force = false; }
+        if (!scrollData) {
+            return false;
+        }
+        var scrollTop = scrollData.scrollTop;
+        var prevProgress = this.progress;
+        var progress = (0, clampScope_1.default)(scrollTop, [this._scopeScroll[0], this._scopeScroll[1]]) || 0;
+        this.progress = progress;
+        return force || (progress !== prevProgress);
+    };
+    /**
+     * Destroy the module
+     */
+    ScrollSectionProgress.prototype._destroy = function () {
+        var _a, _b;
+        _super.prototype._destroy.call(this);
+        (_a = this._scrollEvent) === null || _a === void 0 ? void 0 : _a.remove();
+        (_b = this._loadedEvent) === null || _b === void 0 ? void 0 : _b.cancel();
+    };
+    return ScrollSectionProgress;
+}(Component_1.Component));
+exports.ScrollSectionProgress = ScrollSectionProgress;

package/build/cjs/index.js

@@ -19,7 +19,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CustomCursor = exports.SplitText = exports.SmoothScrollDragPlugin = exports.SmoothScrollKeyboardPlugin = exports.ScrollView = exports.ScrollEventsBase = exports.ScrollBar = exports.SmoothScroll = exports.Ctx2DPrerender = exports.Ctx2D = exports.DraggerDirection = exports.DraggerMove = exports.Dragger = exports.ProgressPreloader = exports.Preloader = exports.Timeline = exports.StaticTimeline = exports.AnimationFrame = exports.WheelHandler = exports.Page = exports.Plugin = exports.Component = exports.Module = exports.MutableProp = exports.Callbacks = exports.PageLoad = exports.Viewport = exports.Application = exports.GeneralTypes = exports.utils = void 0;
+exports.CustomCursor = exports.SplitText = exports.ScrollSectionProgress = exports.SmoothScrollDragPlugin = exports.SmoothScrollKeyboardPlugin = exports.ScrollView = exports.ScrollEventsBase = exports.ScrollBar = exports.SmoothScroll = exports.Ctx2DPrerender = exports.Ctx2D = exports.DraggerDirection = exports.DraggerMove = exports.Dragger = exports.ProgressPreloader = exports.Preloader = exports.Timeline = exports.StaticTimeline = exports.AnimationFrame = exports.WheelHandler = exports.Page = exports.Plugin = exports.Component = exports.Module = exports.MutableProp = exports.Callbacks = exports.PageLoad = exports.Viewport = exports.Application = exports.GeneralTypes = exports.utils = void 0;
 var common = __importStar(require("./utils/common"));
 var listeners = __importStar(require("./utils/listeners"));
 var math = __importStar(require("./utils/math"));
@@ -78,6 +78,8 @@ var SmoothScrollKeyboardPlugin_1 = require("./components/scroll/plugins/SmoothSc
 Object.defineProperty(exports, "SmoothScrollKeyboardPlugin", { enumerable: true, get: function () { return SmoothScrollKeyboardPlugin_1.SmoothScrollKeyboardPlugin; } });
 var SmoothScrollDragPlugin_1 = require("./components/scroll/plugins/SmoothScrollDragPlugin");
 Object.defineProperty(exports, "SmoothScrollDragPlugin", { enumerable: true, get: function () { return SmoothScrollDragPlugin_1.SmoothScrollDragPlugin; } });
+var ScrollSectionProgress_1 = require("./components/scroll/section/ScrollSectionProgress");
+Object.defineProperty(exports, "ScrollSectionProgress", { enumerable: true, get: function () { return ScrollSectionProgress_1.ScrollSectionProgress; } });
 var SplitText_1 = require("./components/text/SplitText");
 Object.defineProperty(exports, "SplitText", { enumerable: true, get: function () { return SplitText_1.SplitText; } });
 var CustomCursor_1 = require("./components/cursor/CustomCursor");

package/build/es/components/scroll/scrollable/ScrollView.js

@@ -23,7 +23,7 @@ export class ScrollView extends ScrollEventsBase {
         return `${this._app.prefix}scroll-view`;
     }
     _getDefaultProp() {
-        return Object.assign(Object.assign({}, super._getDefaultProp()), { enabled: true, container: window, elements: [], threshold: 0.9, states: 'in', classToToggle: 'viewed', useDelay: false, useIntersectionObserver: true, resizeTimeout: 0 });
+        return Object.assign(Object.assign({}, super._getDefaultProp()), { enabled: true, container: window, elements: [], threshold: 0.9, states: 'in', classToToggle: 'viewed', useDelay: false, useIntersectionObserver: true, viewportTarget: '', resizeTimeout: 0 });
     }
     /**
      * Elements to seek
@@ -38,7 +38,7 @@ export class ScrollView extends ScrollEventsBase {
     _setEvents() {
         super._setEvents();
         this.resize();
-        this.addViewportCallback('', () => {
+        this.addViewportCallback(this.prop.viewportTarget, () => {
             this.resize();
         }, {
             timeout: this.prop.resizeTimeout,

package/build/es/components/scroll/section/ScrollSectionProgress.js

@@ -0,0 +1,181 @@
+import { selectOne } from 'vevet-dom';
+import onScroll from '../../../utils/listeners/onScroll';
+import { Component } from '../../../base/Component';
+import clampScope from '../../../utils/math/clampScope';
+import getScrollValues from '../../../utils/scroll/getScrollValues';
+/**
+ * Elements into viewport
+ */
+export class ScrollSectionProgress extends Component {
+    constructor(initialProp, init = true) {
+        super(initialProp, false);
+        // get scroll container
+        if (typeof this.prop.container === 'string') {
+            this._scrollContainer = selectOne(this.prop.container);
+        }
+        else {
+            this._scrollContainer = this.prop.container;
+        }
+        // get section element
+        if (typeof this.prop.section === 'string') {
+            this._section = selectOne(this.prop.section);
+        }
+        else {
+            this._section = this.prop.section;
+        }
+        // set defaults
+        this._progress = -0.001;
+        this._scopeScroll = [0, 0];
+        this._scopeIn = [0, 0];
+        this._scopeMove = [0, 0];
+        this._scopeOut = [0, 0];
+        // initialize the class
+        if (init) {
+            this.init();
+        }
+    }
+    _getDefaultProp() {
+        return Object.assign(Object.assign({}, super._getDefaultProp()), { container: window, viewportTarget: '', resizeTimeout: 0 });
+    }
+    get scrollContainer() {
+        return this._scrollContainer;
+    }
+    get section() {
+        return this._section;
+    }
+    get scopeScroll() {
+        return this._scopeScroll;
+    }
+    get scopeIn() {
+        return this._scopeIn;
+    }
+    get scopeMove() {
+        return this._scopeMove;
+    }
+    get scopeOut() {
+        return this._scopeOut;
+    }
+    /**
+     * Global progress
+     */
+    get progress() {
+        return this._progress;
+    }
+    set progress(val) {
+        this._progress = val;
+    }
+    init() {
+        super.init();
+    }
+    // Set Module Events
+    _setEvents() {
+        super._setEvents();
+        // set resize events
+        this.addViewportCallback(this.prop.viewportTarget, () => {
+            this.resize();
+        }, {
+            timeout: this.prop.resizeTimeout,
+        });
+        // resize on page loaded
+        this._loadedEvent = this._app.onPageLoaded();
+        this._loadedEvent.then(() => {
+            this.resize();
+        }).catch(() => { });
+        // set scroll events
+        this._scrollEvent = onScroll({
+            container: this.prop.container,
+            callback: this._handleScroll.bind(this),
+        });
+    }
+    _onPropMutate() {
+        super._onPropMutate();
+        this.resize();
+    }
+    /**
+     * 'in' progress
+     */
+    get progressIn() {
+        return clampScope(this.progress, this.scopeIn) || 0;
+    }
+    /**
+     * 'out' progress
+     */
+    get progressOut() {
+        return clampScope(this.progress, this.scopeOut) || 0;
+    }
+    /**
+     * 'move' progress
+     */
+    get progressMove() {
+        return clampScope(this.progress, this.scopeMove) || 0;
+    }
+    /**
+     * Handle scroll event
+     */
+    _handleScroll() {
+        // calculate scopes
+        const scrollData = getScrollValues(this.scrollContainer);
+        if (!scrollData) {
+            return;
+        }
+        this._render(scrollData);
+    }
+    /**
+     * Resize the scene
+     */
+    resize() {
+        // calculate scopes
+        const scrollData = getScrollValues(this.scrollContainer);
+        if (!scrollData) {
+            return;
+        }
+        // get sizes
+        const bounding = this.section.getBoundingClientRect();
+        const vHeight = this._app.viewport.height;
+        // calculate scroll scope
+        const inStart = scrollData.scrollTop + bounding.top - vHeight;
+        const moveEnd = scrollData.scrollTop + bounding.top + bounding.height;
+        const scrollLine = moveEnd - inStart;
+        this._scopeScroll = [inStart, moveEnd];
+        // calculate scopes
+        this._scopeIn = [0, vHeight / scrollLine];
+        this._scopeOut = [1 - vHeight / scrollLine, 1];
+        this._scopeMove = [this._scopeIn[1], this._scopeOut[0]];
+        // launch callbacks
+        this.callbacks.tbt('resize', false);
+        // render the scene
+        this._render(scrollData, true);
+    }
+    /**
+     * Render the scene
+     */
+    _render(scrollData, force = false) {
+        const canRender = this._canRender(scrollData, force);
+        if (!canRender) {
+            return;
+        }
+        this.callbacks.tbt('render', false);
+    }
+    /**
+     * Check if the section can be rendered
+     */
+    _canRender(scrollData, force = false) {
+        if (!scrollData) {
+            return false;
+        }
+        const { scrollTop } = scrollData;
+        const prevProgress = this.progress;
+        const progress = clampScope(scrollTop, [this._scopeScroll[0], this._scopeScroll[1]]) || 0;
+        this.progress = progress;
+        return force || (progress !== prevProgress);
+    }
+    /**
+     * Destroy the module
+     */
+    _destroy() {
+        var _a, _b;
+        super._destroy();
+        (_a = this._scrollEvent) === null || _a === void 0 ? void 0 : _a.remove();
+        (_b = this._loadedEvent) === null || _b === void 0 ? void 0 : _b.cancel();
+    }
+}

package/build/es/index.js

@@ -29,6 +29,7 @@ import { ScrollEventsBase } from './components/scroll/scrollable/ScrollEventsBas
 import { ScrollView } from './components/scroll/scrollable/ScrollView';
 import { SmoothScrollKeyboardPlugin } from './components/scroll/plugins/SmoothScrollKeyboardPlugin';
 import { SmoothScrollDragPlugin } from './components/scroll/plugins/SmoothScrollDragPlugin';
+import { ScrollSectionProgress } from './components/scroll/section/ScrollSectionProgress';
 import { SplitText } from './components/text/SplitText';
 import { CustomCursor } from './components/cursor/CustomCursor';
 const utils = {
@@ -37,4 +38,4 @@ const utils = {
     math,
     scroll,
 };
-export { utils, GeneralTypes, Application, Viewport, PageLoad, Callbacks, MutableProp, Module, Component, Plugin, Page, WheelHandler, AnimationFrame, StaticTimeline, Timeline, Preloader, ProgressPreloader, Dragger, DraggerMove, DraggerDirection, Ctx2D, Ctx2DPrerender, SmoothScroll, ScrollBar, ScrollEventsBase, ScrollView, SmoothScrollKeyboardPlugin, SmoothScrollDragPlugin, SplitText, CustomCursor, };
+export { utils, GeneralTypes, Application, Viewport, PageLoad, Callbacks, MutableProp, Module, Component, Plugin, Page, WheelHandler, AnimationFrame, StaticTimeline, Timeline, Preloader, ProgressPreloader, Dragger, DraggerMove, DraggerDirection, Ctx2D, Ctx2DPrerender, SmoothScroll, ScrollBar, ScrollEventsBase, ScrollView, SmoothScrollKeyboardPlugin, SmoothScrollDragPlugin, ScrollSectionProgress, SplitText, CustomCursor, };

package/build/types/components/scroll/scrollable/ScrollView.d.ts

@@ -1,6 +1,7 @@
 import { ScrollEventsBase, NScrollEventsBase } from './ScrollEventsBase';
 import { IRemovable } from '../../../utils/types/general';
 import { RequiredModuleProp } from '../../../utils/types/utility';
+import { NViewport } from '../../../app/events/Viewport';
 export declare namespace NScrollView {
     /**
      * Static properties
@@ -47,6 +48,11 @@ export declare namespace NScrollView {
          * @default true
          */
         useIntersectionObserver?: boolean;
+        /**
+         * Viewport target on resize
+         * @default ''
+         */
+        viewportTarget?: keyof NViewport.CallbacksTypes;
         /**
          * @default 0
          */

package/build/types/components/scroll/scrollable/ScrollView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollView.d.ts","sourceRoot":"","sources":["../../../../../src/ts/components/scroll/scrollable/ScrollView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAQlE,yBAAiB,WAAW,CAAC;IAEzB;;OAEG;IACH,UAAiB,UAAW,SAAQ,iBAAiB,CAAC,UAAU;QAC5D;;;;;WAKG;QACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB;;;WAGG;QACH,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC;QACrB;;;;WAIG;QACH,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB;;;WAGG;QACH,MAAM,CAAC,EAAE,IAAI,GAAG,OAAO,CAAC;QACxB;;;WAGG;QACH,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB;;;WAGG;QACH,QAAQ,CAAC,EAAE,KAAK,GAAG;YACf,GAAG,EAAE,MAAM,CAAC;YACZ,GAAG,EAAE,GAAG,GAAG,GAAG,CAAC;SAClB,CAAC;QACF;;;WAGG;QACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;QAClC;;WAEG;QACH,aAAa,CAAC,EAAE,MAAM,CAAC;KAC1B;IAED;;OAEG;IACH,UAAiB,cAAe,SAAQ,iBAAiB,CAAC,cAAc;KAAI;IAE5E;;OAEG;IACH,UAAiB,EAAG,SAAQ,OAAO;QAC/B,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B;IAED;;OAEG;IACH,UAAiB,cAAe,SAAQ,iBAAiB,CAAC,cAAc;QACpE,IAAI,EAAE,EAAE,CAAC;QACT,KAAK,EAAE,EAAE,CAAC;KACb;CAEJ;AAID;;GAEG;AACH,qBAAa,UAAU,CACnB,UAAU,SAAS,WAAW,CAAC,UAAU,GAAG,WAAW,CAAC,UAAU,EAClE,cAAc,SAAS,WAAW,CAAC,cAAc,GAAG,WAAW,CAAC,cAAc,EAC9E,cAAc,SAAS,WAAW,CAAC,cAAc,GAAG,WAAW,CAAC,cAAc,CAChF,SAAQ,gBAAgB,CACtB,UAAU,EACV,cAAc,EACd,cAAc,CACjB;IACG,IAAI,MAAM,WAET;IAED,SAAS,CAAC,eAAe,CACrB,CAAC,SAAS,kBAAkB,CAAC,UAAU,GAAG,cAAc,CAAC,KACvD,CAAC;IAiBP;;OAEG;IACH,SAAS,CAAC,YAAY,CAAC,EAAE,UAAU,CAAC;IACpC;;OAEG;IACH,SAAS,CAAC,uBAAuB,CAAC,EAAE,oBAAoB,CAAC;IACzD;;OAEG;IACH,SAAS,CAAC,wBAAwB,CAAC,EAAE,oBAAoB,CAAC;IAE1D;;OAEG;IACH,SAAS,CAAC,WAAW,EAAE,OAAO,CAAC;IAE/B,SAAS,CAAC,SAAS,EAAE,WAAW,CAAC,EAAE,EAAE,CAAC;IACtC;;OAEG;IACH,IAAI,QAAQ,qBAEX;gBAKG,WAAW,CAAC,EAAE,CAAC,UAAU,GAAG,cAAc,CAAC,EAC3C,IAAI,UAAO;IAgBR,IAAI;IAKX,SAAS,CAAC,UAAU;IAUpB,SAAS,CAAC,aAAa;IAKvB;;OAEG;IACI,MAAM;IAQb;;OAEG;IACH,SAAS,CAAC,cAAc;IA2CxB;;OAEG;IACH,SAAS,CAAC,iBAAiB;IAa3B;;OAEG;IACH,SAAS,CAAC,6BAA6B,CACnC,IAAI,EAAE,yBAAyB,EAAE;IAyBrC;;OAEG;IACH,SAAS,CAAC,8BAA8B,CACpC,IAAI,EAAE,yBAAyB,EAAE;IAcrC;;OAEG;IACH,SAAS,CAAC,aAAa;IAIvB;;;OAGG;IACI,YAAY;IA0BnB;;OAEG;IACH,SAAS,CAAC,sBAAsB,CAC5B,EAAE,EAAE,OAAO,EACX,cAAc,EAAE,iBAAiB,CAAC,YAAY;;;;IAgDlD;;OAEG;IACH,SAAS,CAAC,YAAY,CAClB,EAAE,EAAE,WAAW,CAAC,EAAE,EAClB,UAAU,EAAE,OAAO,EACnB,KAAK,SAAI;IAgCb;;OAEG;IACH,SAAS,CAAC,sBAAsB;IAchC;;OAEG;IACI,UAAU,CACb,OAAO,EAAE,OAAO,GACjB,UAAU;IAgBb;;OAEG;IACI,aAAa,CAChB,OAAO,EAAE,OAAO;IASpB;;OAEG;IACI,cAAc;IASrB;;OAEG;IACH,SAAS,CAAC,QAAQ;CAIrB"}
+{"version":3,"file":"ScrollView.d.ts","sourceRoot":"","sources":["../../../../../src/ts/components/scroll/scrollable/ScrollView.ts"],"names":[],"mappings":"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"}

package/build/types/components/scroll/section/ScrollSectionProgress.d.ts

@@ -0,0 +1,131 @@
+import PCancelable from 'p-cancelable';
+import { IRemovable } from '../../../utils/types/general';
+import { RequiredModuleProp } from '../../../utils/types/utility';
+import { Component, NComponent } from '../../../base/Component';
+import { NViewport } from '../../../app/events/Viewport';
+import { SmoothScroll } from '../smooth-scroll/SmoothScroll';
+import getScrollValues from '../../../utils/scroll/getScrollValues';
+export declare namespace NScrollSectionProgress {
+    /**
+     * Static properties
+     */
+    interface StaticProp extends NComponent.StaticProp {
+        /**
+         * The scrollable container
+         * @default window
+         */
+        container?: string | Element | SmoothScroll | Window;
+        /**
+         * The scrollable element
+         */
+        section: string | Element;
+        /**
+         * Viewport target on resize
+         * @default ''
+         */
+        viewportTarget?: keyof NViewport.CallbacksTypes;
+        /**
+         * @default 0
+         */
+        resizeTimeout?: number;
+    }
+    /**
+     * Changeable properties
+     */
+    interface ChangeableProp extends NComponent.ChangeableProp {
+    }
+    /**
+     * Available callbacks
+     */
+    interface CallbacksTypes extends NComponent.CallbacksTypes {
+        'render': false;
+        'resize': false;
+    }
+}
+/**
+ * Elements into viewport
+ */
+export declare class ScrollSectionProgress<StaticProp extends NScrollSectionProgress.StaticProp = NScrollSectionProgress.StaticProp, ChangeableProp extends NScrollSectionProgress.ChangeableProp = NScrollSectionProgress.ChangeableProp, CallbacksTypes extends NScrollSectionProgress.CallbacksTypes = NScrollSectionProgress.CallbacksTypes> extends Component<StaticProp, ChangeableProp, CallbacksTypes> {
+    protected _getDefaultProp<T extends RequiredModuleProp<StaticProp & ChangeableProp>>(): T;
+    /**
+     * Scroll container
+     */
+    protected _scrollContainer: Element | SmoothScroll | Window;
+    get scrollContainer(): Element | Window | SmoothScroll<import("../smooth-scroll/SmoothScroll").NSmoothScroll.StaticProp, import("../smooth-scroll/SmoothScroll").NSmoothScroll.ChangeableProp, import("../smooth-scroll/SmoothScroll").NSmoothScroll.CallbacksTypes>;
+    /**
+     * Section element
+     */
+    protected _section: Element;
+    get section(): Element;
+    /**
+     * Scroll event
+     */
+    protected _scrollEvent?: IRemovable;
+    /**
+     * Loaded event
+     */
+    protected _loadedEvent?: PCancelable<any>;
+    /**
+     * Scrolling scope
+     */
+    protected _scopeScroll: [number, number];
+    get scopeScroll(): [number, number];
+    /**
+     * 'In' scope relative to the global progress
+     */
+    protected _scopeIn: [number, number];
+    protected get scopeIn(): [number, number];
+    /**
+     * 'Move' scope relative to the global progress
+     */
+    protected _scopeMove: [number, number];
+    get scopeMove(): [number, number];
+    /**
+     * 'Move' scope relative to the global progress
+     */
+    protected _scopeOut: [number, number];
+    get scopeOut(): [number, number];
+    protected _progress: number;
+    /**
+     * Global progress
+     */
+    get progress(): number;
+    set progress(val: number);
+    constructor(initialProp?: (StaticProp & ChangeableProp), init?: boolean);
+    init(): void;
+    protected _setEvents(): void;
+    protected _onPropMutate(): void;
+    /**
+     * 'in' progress
+     */
+    get progressIn(): number;
+    /**
+     * 'out' progress
+     */
+    get progressOut(): number;
+    /**
+     * 'move' progress
+     */
+    get progressMove(): number;
+    /**
+     * Handle scroll event
+     */
+    protected _handleScroll(): void;
+    /**
+     * Resize the scene
+     */
+    resize(): void;
+    /**
+     * Render the scene
+     */
+    protected _render(scrollData: ReturnType<typeof getScrollValues>, force?: boolean): void;
+    /**
+     * Check if the section can be rendered
+     */
+    protected _canRender(scrollData: ReturnType<typeof getScrollValues>, force?: boolean): boolean;
+    /**
+     * Destroy the module
+     */
+    protected _destroy(): void;
+}
+//# sourceMappingURL=ScrollSectionProgress.d.ts.map