@scena/dragscroll - npm Package Compare versions

Comparing version 1.2.2 to 1.3.0

declaration/DragScroll.d.ts

 import EventEmitter from "@scena/event-emitter";
 import { CheckScrollOptions, DragScrollEvents, DragScrollOptions } from "./types";
+/**
+ * @sort 1
+ */
 declare class DragScroll extends EventEmitter<DragScrollEvents> {
@@ -11,5 +14,11 @@ private _startRect;
     private _flag;
+    /**
+     */
     dragStart(e: any, options: DragScrollOptions): void;
     drag(e: any, options: DragScrollOptions): boolean;
+    /**
+     */
     checkScroll(options: CheckScrollOptions): boolean;
+    /**
+     */
     dragEnd(): void;
@@ -16,0 +25,0 @@ private _getScrollPosition;

declaration/types.d.ts

@@ -0,2 +1,8 @@
+/**
+ * @typedef
+ */
 export interface DragScrollOptions {
+    /**
+     * The area to detect scrolling through dragging. scroll container
+     */
     container: string | (() => HTMLElement) | HTMLElement | {
@@ -7,3 +13,11 @@ current?: HTMLElement | null;
     };
+    /**
+     * Distance at which to start scrolling from the start or end points
+     * @default 0
+     */
     threshold?: number;
+    /**
+     * How to get scrollPosition
+     * @default [container.scrollLeft, container.scrollTop]
+     */
     getScrollPosition?: (param: {
@@ -13,5 +27,24 @@ container: HTMLElement;
     }) => number[];
+    /**
+     * Request if there is a need to be scrolled through drag.
+     * Only use one of the scroll event or requestScroll options.
+     * @default null
+     */
+    requestScroll?: ((param: OnScroll) => void) | null;
+    /**
+     * How often to re-scroll when the drag stays at the start or end.
+     * If 0, it does not occur.
+     * @default 0
+     */
     throttleTime?: number;
+    /**
+     * Set to true if only scrolling is enabled.
+     * Set to false if re-scroll check is required
+     * @default false
+     */
     useScroll?: boolean;
 }
+/**
+ * @typedef
+ */
 export interface CheckScrollOptions extends DragScrollOptions {
@@ -23,2 +56,5 @@ isDrag?: boolean;
 }
+/**
+ * @typedef
+ */
 export interface Rect {
@@ -30,2 +66,5 @@ left: number;
 }
+/**
+ * @typedef
+ */
 export interface OnScroll {
@@ -36,2 +75,5 @@ container: HTMLElement;
 }
+/**
+ * @typedef
+ */
 export interface OnMove {
@@ -42,2 +84,5 @@ offsetX: number;
 }
+/**
+ * @typedef
+ */
 export interface DragScrollEvents {
@@ -44,0 +89,0 @@ scroll: OnScroll;

dist/dragscroll.cjs.js

@@ -7,3 +7,3 @@ /*
 repository: git+https://github.com/daybrush/dragscroll.git
-version: 1.2.2
+version: 1.3.0
 */
@@ -275,2 +275,4 @@ 'use strict';
 
+    var _a, _b;
+
     var container = options.container,
@@ -307,2 +309,9 @@ direction = options.direction,
     }
+
+    var param = {
+      container: getContainerElement(container),
+      direction: direction,
+      inputEvent: inputEvent
+    };
+    (_b = (_a = options).requestScroll) === null || _b === void 0 ? void 0 : _b.call(_a, param);
     /**
@@ -312,8 +321,3 @@ * @event DragScroll#scroll
 
-
-    this.trigger("scroll", {
-      container: getContainerElement(container),
-      direction: direction,
-      inputEvent: inputEvent
-    });
+    this.trigger("scroll", param);
     this._isWait = false;
@@ -320,0 +324,0 @@ return useScroll || this.checkScroll(__assign(__assign({}, options), {

dist/dragscroll.esm.js

@@ -7,3 +7,3 @@ /*
 repository: git+https://github.com/daybrush/dragscroll.git
-version: 1.2.2
+version: 1.3.0
 */
@@ -273,2 +273,4 @@ import EventEmitter from '@scena/event-emitter';
 
+    var _a, _b;
+
     var container = options.container,
@@ -305,2 +307,9 @@ direction = options.direction,
     }
+
+    var param = {
+      container: getContainerElement(container),
+      direction: direction,
+      inputEvent: inputEvent
+    };
+    (_b = (_a = options).requestScroll) === null || _b === void 0 ? void 0 : _b.call(_a, param);
     /**
@@ -310,8 +319,3 @@ * @event DragScroll#scroll
 
-
-    this.trigger("scroll", {
-      container: getContainerElement(container),
-      direction: direction,
-      inputEvent: inputEvent
-    });
+    this.trigger("scroll", param);
     this._isWait = false;
@@ -318,0 +322,0 @@ return useScroll || this.checkScroll(__assign(__assign({}, options), {

dist/dragscroll.js

@@ -7,3 +7,3 @@ /*
 repository: git+https://github.com/daybrush/dragscroll.git
-version: 1.2.2
+version: 1.3.0
 */
@@ -698,2 +698,4 @@ (function (global, factory) {
 
+        var _a, _b;
+
         var container = options.container,
@@ -730,2 +732,9 @@ direction = options.direction,
         }
+
+        var param = {
+          container: getContainerElement(container),
+          direction: direction,
+          inputEvent: inputEvent
+        };
+        (_b = (_a = options).requestScroll) === null || _b === void 0 ? void 0 : _b.call(_a, param);
         /**
@@ -735,8 +744,3 @@ * @event DragScroll#scroll
 
-
-        this.trigger("scroll", {
-          container: getContainerElement(container),
-          direction: direction,
-          inputEvent: inputEvent
-        });
+        this.trigger("scroll", param);
         this._isWait = false;
@@ -743,0 +747,0 @@ return useScroll || this.checkScroll(__assign(__assign({}, options), {

dist/dragscroll.min.js

@@ -7,5 +7,5 @@ /*
 repository: git+https://github.com/daybrush/dragscroll.git
-version: 1.2.2
+version: 1.3.0
 */
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).DragScroll=e()}(this,function(){"use strict";var s=function(t,e){return(s=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};var f=function(){return(f=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};function o(t){return t&&"object"==typeof t}var r=function(){return(r=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};var e="function",n="string";function c(t){var e=t.container;return e===document.body?[e.scrollLeft||document.documentElement.scrollLeft,e.scrollTop||document.documentElement.scrollTop]:[e.scrollLeft,e.scrollTop]}function h(t){return t?typeof t===n?document.querySelector(t):typeof t===e?t():t instanceof Element?t:"current"in t?t.current:"value"in t?t.value:void 0:null}return function(e){function t(){this.constructor=n}var n,i;function r(){var t=null!==e&&e.apply(this,arguments)||this;return t._startRect=null,t._startPos=[],t._prevTime=0,t._timer=0,t._prevScrollPos=[0,0],t._isWait=!1,t._flag=!1,t}s(n=r,i=e),n.prototype=null===i?Object.create(i):(t.prototype=i.prototype,new t);var o=r.prototype;return o.dragStart=function(t,e){var n=h(e.container);if(n){var i=0,r=0,o=0,s=0;if(n===document.body)o=window.innerWidth,s=window.innerHeight;else{var c=n.getBoundingClientRect();i=c.top,r=c.left,o=c.width,s=c.height}this._flag=!0,this._startPos=[t.clientX,t.clientY],this._startRect={top:i,left:r,width:o,height:s},this._prevScrollPos=this._getScrollPosition([0,0],e)}else this._flag=!1},o.drag=function(t,e){if(clearTimeout(this._timer),this._flag){var n=t.clientX,i=t.clientY,r=e.threshold,o=void 0===r?0:r,s=this._startRect,c=this._startPos,l=[0,0];return s.top>i-o?(c[1]>s.top||i<c[1])&&(l[1]=-1):s.top+s.height<i+o&&(c[1]<s.top+s.height||i>c[1])&&(l[1]=1),s.left>n-o?(c[0]>s.left||n<c[0])&&(l[0]=-1):s.left+s.width<n+o&&(c[0]<s.left+s.width||n>c[0])&&(l[0]=1),!(!l[0]&&!l[1])&&this._continueDrag(f(f({},e),{direction:l,inputEvent:t,isDrag:!0}))}},o.checkScroll=function(t){var e=this;if(this._isWait)return!1;var n=t.prevScrollPos,i=void 0===n?this._prevScrollPos:n,r=t.direction,o=t.throttleTime,s=void 0===o?0:o,c=t.inputEvent,l=t.isDrag,a=this._getScrollPosition(r||[0,0],t),u=a[0]-i[0],f=a[1]-i[1],h=r||[u?Math.abs(u)/u:0,f?Math.abs(f)/f:0];return this._prevScrollPos=a,!(!u&&!f)&&(this.trigger("move",{offsetX:h[0]?u:0,offsetY:h[1]?f:0,inputEvent:c}),s&&l&&(clearTimeout(this._timer),this._timer=window.setTimeout(function(){e._continueDrag(t)},s)),!0)},o.dragEnd=function(){this._flag=!1,clearTimeout(this._timer)},o._getScrollPosition=function(t,e){var n=e.container,i=e.getScrollPosition;return(void 0===i?c:i)({container:h(n),direction:t})},o._continueDrag=function(t){var e=this,n=t.container,i=t.direction,r=t.throttleTime,o=t.useScroll,s=t.isDrag,c=t.inputEvent;if(!(!this._flag||s&&this._isWait)){var l=Date.now?Date.now():(new Date).getTime(),a=Math.max(r+this._prevTime-l,0);if(0<a)return clearTimeout(this._timer),this._timer=window.setTimeout(function(){e._continueDrag(t)},a),!1;this._prevTime=l;var u=this._getScrollPosition(i,t);return this._prevScrollPos=u,s&&(this._isWait=!0),this.trigger("scroll",{container:h(n),direction:i,inputEvent:c}),this._isWait=!1,o||this.checkScroll(f(f({},t),{prevScrollPos:u,direction:i,inputEvent:c}))}},r}(function(){function t(){this._events={}}var e=t.prototype;return e.on=function(t,e){if(o(t))for(var n in t)this.on(n,t[n]);else this._addEvent(t,e,{});return this},e.off=function(t,e){if(t)if(o(t))for(var n in t)this.off(n);else if(e){var i=this._events[t];if(i){var r=function(t,e,n){void 0===n&&(n=-1);for(var i=t.length,r=0;r<i;++r)if(e(t[r],r,t))return r;return n}(i,function(t){return t.listener===e});-1<r&&i.splice(r,1)}}else this._events[t]=[];else this._events={};return this},e.once=function(e,t){var n=this;return t&&this._addEvent(e,t,{once:!0}),new Promise(function(t){n._addEvent(e,t,{once:!0})})},e.emit=function(e,n){var i=this;void 0===n&&(n={});var t=this._events[e];if(!e||!t)return!0;var r=!1;return n.eventType=e,n.stop=function(){r=!0},n.currentTarget=this,function(){for(var t=0,e=0,n=arguments.length;e<n;e++)t+=arguments[e].length;var i=Array(t),r=0;for(e=0;e<n;e++)for(var o=arguments[e],s=0,c=o.length;s<c;s++,r++)i[r]=o[s];return i}(t).forEach(function(t){t.listener(n),t.once&&i.off(e,t.listener)}),!r},e.trigger=function(t,e){return void 0===e&&(e={}),this.emit(t,e)},e._addEvent=function(t,e,n){var i=this._events;i[t]=i[t]||[],i[t].push(r({listener:e},n))},t}())});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).DragScroll=e()}(this,function(){"use strict";var s=function(t,e){return(s=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};var v=function(){return(v=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};function o(t){return t&&"object"==typeof t}var r=function(){return(r=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};var e="function",n="string";function c(t){var e=t.container;return e===document.body?[e.scrollLeft||document.documentElement.scrollLeft,e.scrollTop||document.documentElement.scrollTop]:[e.scrollLeft,e.scrollTop]}function p(t){return t?typeof t===n?document.querySelector(t):typeof t===e?t():t instanceof Element?t:"current"in t?t.current:"value"in t?t.value:void 0:null}return function(e){function t(){this.constructor=n}var n,i;function r(){var t=null!==e&&e.apply(this,arguments)||this;return t._startRect=null,t._startPos=[],t._prevTime=0,t._timer=0,t._prevScrollPos=[0,0],t._isWait=!1,t._flag=!1,t}s(n=r,i=e),n.prototype=null===i?Object.create(i):(t.prototype=i.prototype,new t);var o=r.prototype;return o.dragStart=function(t,e){var n=p(e.container);if(n){var i=0,r=0,o=0,s=0;if(n===document.body)o=window.innerWidth,s=window.innerHeight;else{var c=n.getBoundingClientRect();i=c.top,r=c.left,o=c.width,s=c.height}this._flag=!0,this._startPos=[t.clientX,t.clientY],this._startRect={top:i,left:r,width:o,height:s},this._prevScrollPos=this._getScrollPosition([0,0],e)}else this._flag=!1},o.drag=function(t,e){if(clearTimeout(this._timer),this._flag){var n=t.clientX,i=t.clientY,r=e.threshold,o=void 0===r?0:r,s=this._startRect,c=this._startPos,l=[0,0];return s.top>i-o?(c[1]>s.top||i<c[1])&&(l[1]=-1):s.top+s.height<i+o&&(c[1]<s.top+s.height||i>c[1])&&(l[1]=1),s.left>n-o?(c[0]>s.left||n<c[0])&&(l[0]=-1):s.left+s.width<n+o&&(c[0]<s.left+s.width||n>c[0])&&(l[0]=1),!(!l[0]&&!l[1])&&this._continueDrag(v(v({},e),{direction:l,inputEvent:t,isDrag:!0}))}},o.checkScroll=function(t){var e=this;if(this._isWait)return!1;var n=t.prevScrollPos,i=void 0===n?this._prevScrollPos:n,r=t.direction,o=t.throttleTime,s=void 0===o?0:o,c=t.inputEvent,l=t.isDrag,a=this._getScrollPosition(r||[0,0],t),u=a[0]-i[0],f=a[1]-i[1],h=r||[u?Math.abs(u)/u:0,f?Math.abs(f)/f:0];return this._prevScrollPos=a,!(!u&&!f)&&(this.trigger("move",{offsetX:h[0]?u:0,offsetY:h[1]?f:0,inputEvent:c}),s&&l&&(clearTimeout(this._timer),this._timer=window.setTimeout(function(){e._continueDrag(t)},s)),!0)},o.dragEnd=function(){this._flag=!1,clearTimeout(this._timer)},o._getScrollPosition=function(t,e){var n=e.container,i=e.getScrollPosition;return(void 0===i?c:i)({container:p(n),direction:t})},o._continueDrag=function(t){var e,n=this,i=t.container,r=t.direction,o=t.throttleTime,s=t.useScroll,c=t.isDrag,l=t.inputEvent;if(!(!this._flag||c&&this._isWait)){var a=Date.now?Date.now():(new Date).getTime(),u=Math.max(o+this._prevTime-a,0);if(0<u)return clearTimeout(this._timer),this._timer=window.setTimeout(function(){n._continueDrag(t)},u),!1;this._prevTime=a;var f=this._getScrollPosition(r,t);this._prevScrollPos=f,c&&(this._isWait=!0);var h={container:p(i),direction:r,inputEvent:l};return null===(e=t.requestScroll)||void 0===e||e.call(t,h),this.trigger("scroll",h),this._isWait=!1,s||this.checkScroll(v(v({},t),{prevScrollPos:f,direction:r,inputEvent:l}))}},r}(function(){function t(){this._events={}}var e=t.prototype;return e.on=function(t,e){if(o(t))for(var n in t)this.on(n,t[n]);else this._addEvent(t,e,{});return this},e.off=function(t,e){if(t)if(o(t))for(var n in t)this.off(n);else if(e){var i=this._events[t];if(i){var r=function(t,e,n){void 0===n&&(n=-1);for(var i=t.length,r=0;r<i;++r)if(e(t[r],r,t))return r;return n}(i,function(t){return t.listener===e});-1<r&&i.splice(r,1)}}else this._events[t]=[];else this._events={};return this},e.once=function(e,t){var n=this;return t&&this._addEvent(e,t,{once:!0}),new Promise(function(t){n._addEvent(e,t,{once:!0})})},e.emit=function(e,n){var i=this;void 0===n&&(n={});var t=this._events[e];if(!e||!t)return!0;var r=!1;return n.eventType=e,n.stop=function(){r=!0},n.currentTarget=this,function(){for(var t=0,e=0,n=arguments.length;e<n;e++)t+=arguments[e].length;var i=Array(t),r=0;for(e=0;e<n;e++)for(var o=arguments[e],s=0,c=o.length;s<c;s++,r++)i[r]=o[s];return i}(t).forEach(function(t){t.listener(n),t.once&&i.off(e,t.listener)}),!r},e.trigger=function(t,e){return void 0===e&&(e={}),this.emit(t,e)},e._addEvent=function(t,e,n){var i=this._events;i[t]=i[t]||[],i[t].push(r({listener:e},n))},t}())});
 //# sourceMappingURL=dragscroll.min.js.map

package.json

 {
   "name": "@scena/dragscroll",
-  "version": "1.2.2",
+  "version": "1.3.0",
   "description": "",
@@ -14,3 +14,3 @@ "main": "./dist/dragscroll.cjs.js",
     "declaration": "rm -rf declaration && tsc -p tsconfig.declaration.json",
-    "prerelease": "npm run build && && npm run doc && prerelease --dirs=dist,doc",
+    "prerelease": "npm run build && npm run doc && prerelease --dirs=dist,doc",
     "release": "npm run build && npm run doc && release --dirs=dist,doc",
@@ -17,0 +17,0 @@ "release:init": "npm run build && npm run doc && release -i --dirs=dist,doc",

src/DragScroll.ts

@@ -215,10 +215,12 @@ import EventEmitter from "@scena/event-emitter";
         }
+        const param = {
+            container: getContainerElement(container),
+            direction,
+            inputEvent,
+        };
+        options.requestScroll?.(param);
         /**
          * @event DragScroll#scroll
          */
-        this.trigger("scroll", {
-            container: getContainerElement(container),
-            direction,
-            inputEvent,
-        });
+        this.trigger("scroll", param);
 
@@ -225,0 +227,0 @@ this._isWait = false;

src/types.ts

@@ -20,2 +20,8 @@ /**
     /**
+     * Request if there is a need to be scrolled through drag.
+     * Only use one of the scroll event or requestScroll options.
+     * @default null
+     */
+    requestScroll?: ((param: OnScroll) => void) | null;
+    /**
      * How often to re-scroll when the drag stays at the start or end.
@@ -22,0 +28,0 @@ * If 0, it does not occur.

tsconfig.declaration.json

 {
   "extends": "./tsconfig",
   "compilerOptions": {
-    "removeComments": true,
+    "removeComments": false,
     "declaration": true,
@@ -6,0 +6,0 @@ "emitDeclarationOnly": true,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

111829

increased by2.24%

Lines of code

1751

increased by4.23%

No dependency changes