@blackbyte/sugar 1.0.0-beta.1

package/dist/js/dom/inject/injectStylesheet.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @name                injectStylesheet
+ * @namespace           js.dom.inject
+ * @type                Function
+ * @platform            js
+ * @status              stable
+ *
+ * Append a stylesheet link to the page head
+ *
+ * @param    {String}    href     The url to the stylesheet
+ * @return   {Promise}            A promise when the stylesheet is loaded with the link element as parameter
+ *
+ * @snippet         injectStylesheet($1)
+ *
+ * @todo      tests
+ *
+ * @example    js
+ * import { injectStylesheet } from '@blackbyte/sugar/dom'
+ * injectStylesheet('/dist/css/style.css')
+ *
+ * @since           1.0.0
+ * @author    Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function injectStylesheet(href: string): Promise<HTMLLinkElement>;

package/dist/js/dom/inject/injectStylesheet.js

@@ -0,0 +1,33 @@
+import __whenLinkLoaded from '../when/whenLinkLoaded.js';
+/**
+ * @name                injectStylesheet
+ * @namespace           js.dom.inject
+ * @type                Function
+ * @platform            js
+ * @status              stable
+ *
+ * Append a stylesheet link to the page head
+ *
+ * @param    {String}    href     The url to the stylesheet
+ * @return   {Promise}            A promise when the stylesheet is loaded with the link element as parameter
+ *
+ * @snippet         injectStylesheet($1)
+ *
+ * @todo      tests
+ *
+ * @example    js
+ * import { injectStylesheet } from '@blackbyte/sugar/dom'
+ * injectStylesheet('/dist/css/style.css')
+ *
+ * @since           1.0.0
+ * @author    Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function injectStylesheet(href) {
+    const $link = document.createElement('link');
+    $link.type = 'text/css';
+    $link.rel = 'stylesheet';
+    $link.href = href;
+    document.head.appendChild($link);
+    return __whenLinkLoaded($link);
+}
+//# sourceMappingURL=injectStylesheet.js.map

package/dist/js/dom/inject/injectStylesheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"injectStylesheet.js","sourceRoot":"","sources":["../../../../src/js/dom/inject/injectStylesheet.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,2BAA2B,CAAC;AAEzD;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CACtC,IAAY;IAEZ,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7C,KAAK,CAAC,IAAI,GAAG,UAAU,CAAC;IACxB,KAAK,CAAC,GAAG,GAAG,YAAY,CAAC;IACzB,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;IAClB,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IACjC,OAAO,gBAAgB,CAAC,KAAK,CAAC,CAAC;AACjC,CAAC"}

package/dist/js/dom/input/_exports.d.ts

@@ -0,0 +1,3 @@
+import autoResize from './autoResize.js';
+import cursorToEnd from './cursorToEnd.js';
+export { autoResize as __autoResize, cursorToEnd as __cursorToEnd, autoResize, cursorToEnd, };

package/dist/js/dom/input/_exports.js

@@ -0,0 +1,4 @@
+import autoResize from './autoResize.js';
+import cursorToEnd from './cursorToEnd.js';
+export { autoResize as __autoResize, cursorToEnd as __cursorToEnd, autoResize, cursorToEnd, };
+//# sourceMappingURL=_exports.js.map

package/dist/js/dom/input/_exports.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_exports.js","sourceRoot":"","sources":["../../../../src/js/dom/input/_exports.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,iBAAiB,CAAC;AACzC,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAC3C,OAAO,EACL,UAAU,IAAI,YAAY,EAC1B,WAAW,IAAI,aAAa,EAC5B,UAAU,EACV,WAAW,GACZ,CAAC"}

package/dist/js/dom/input/autoResize.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @name            autoResize
+ * @namespace       js.dom.input
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Automatically resize a textarea height
+ *
+ * @param 		{HTMLFormElement} 		$textarea 		The textarea to auto resize
+ *
+ * @todo      tests
+ *
+ * @snippet         autoResize($1)
+ *
+ * @example 	js
+ * import { autoResize } from '@blackbyte/sugar/dom';
+ * autoResize($textarea);
+ *
+ * @see             https://stackoverflow.com/a/56416714
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://olivierboss$input.com)
+ */
+export default function autoResize($textarea: HTMLTextAreaElement): void;

package/dist/js/dom/input/autoResize.js

@@ -0,0 +1,34 @@
+/**
+ * @name            autoResize
+ * @namespace       js.dom.input
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Automatically resize a textarea height
+ *
+ * @param 		{HTMLFormElement} 		$textarea 		The textarea to auto resize
+ *
+ * @todo      tests
+ *
+ * @snippet         autoResize($1)
+ *
+ * @example 	js
+ * import { autoResize } from '@blackbyte/sugar/dom';
+ * autoResize($textarea);
+ *
+ * @see             https://stackoverflow.com/a/56416714
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://olivierboss$input.com)
+ */
+export default function autoResize($textarea) {
+    $textarea.style.boxSizing = 'border-box';
+    var offset = $textarea.offsetHeight - $textarea.clientHeight;
+    $textarea.addEventListener('input', function (event) {
+        // @ts-ignore
+        event.target.style.height = 'auto';
+        // @ts-ignore
+        event.target.style.height = event.target.scrollHeight + offset + 'px';
+    });
+}
+//# sourceMappingURL=autoResize.js.map

package/dist/js/dom/input/autoResize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"autoResize.js","sourceRoot":"","sources":["../../../../src/js/dom/input/autoResize.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,SAA8B;IAC/D,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,YAAY,CAAC;IACzC,IAAI,MAAM,GAAG,SAAS,CAAC,YAAY,GAAG,SAAS,CAAC,YAAY,CAAC;IAC7D,SAAS,CAAC,gBAAgB,CAAC,OAAO,EAAE,UAAU,KAAK;QACjD,aAAa;QACb,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;QACnC,aAAa;QACb,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,GAAG,MAAM,GAAG,IAAI,CAAC;IACxE,CAAC,CAAC,CAAC;AACL,CAAC"}

package/dist/js/dom/input/cursorToEnd.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @name            cursorToEnd
+ * @namespace       js.dom.input
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Place the cursor to the end of the input
+ *
+ * @param 		{HTMLFormElement} 		$input 		The input to process
+ *
+ * @todo      tests
+ *
+ * @snippet         cursorToEnd($1)
+ *
+ * @example 	js
+ * import { cursorToEnd } from '@blackbyte/sugar/dom';
+ * cursorToEnd($input);
+ *
+ * @see             https://stackoverflow.com/a/56416714
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://olivierboss$input.com)
+ */
+export default function cursorToEnd($input: HTMLTextAreaElement | HTMLInputElement): void;

package/dist/js/dom/input/cursorToEnd.js

@@ -0,0 +1,43 @@
+/**
+ * @name            cursorToEnd
+ * @namespace       js.dom.input
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Place the cursor to the end of the input
+ *
+ * @param 		{HTMLFormElement} 		$input 		The input to process
+ *
+ * @todo      tests
+ *
+ * @snippet         cursorToEnd($1)
+ *
+ * @example 	js
+ * import { cursorToEnd } from '@blackbyte/sugar/dom';
+ * cursorToEnd($input);
+ *
+ * @see             https://stackoverflow.com/a/56416714
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://olivierboss$input.com)
+ */
+export default function cursorToEnd($input) {
+    $input.focus();
+    setTimeout(() => {
+        let len = $input.value.length;
+        if ($input.setSelectionRange) {
+            $input.focus();
+            $input.setSelectionRange(len, len);
+            // @ts-ignore
+        }
+        else if ($input.createTextRange) {
+            // @ts-ignore
+            let t = $input.createTextRange();
+            t.collapse(true);
+            t.moveEnd('character', len);
+            t.moveStart('character', len);
+            t.select();
+        }
+    });
+}
+//# sourceMappingURL=cursorToEnd.js.map

package/dist/js/dom/input/cursorToEnd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cursorToEnd.js","sourceRoot":"","sources":["../../../../src/js/dom/input/cursorToEnd.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CACjC,MAA8C;IAE9C,MAAM,CAAC,KAAK,EAAE,CAAC;IACf,UAAU,CAAC,GAAG,EAAE;QACd,IAAI,GAAG,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;QAC9B,IAAI,MAAM,CAAC,iBAAiB,EAAE,CAAC;YAC7B,MAAM,CAAC,KAAK,EAAE,CAAC;YACf,MAAM,CAAC,iBAAiB,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;YACnC,aAAa;QACf,CAAC;aAAM,IAAI,MAAM,CAAC,eAAe,EAAE,CAAC;YAClC,aAAa;YACb,IAAI,CAAC,GAAG,MAAM,CAAC,eAAe,EAAE,CAAC;YACjC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACjB,CAAC,CAAC,OAAO,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;YAC5B,CAAC,CAAC,SAAS,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;YAC9B,CAAC,CAAC,MAAM,EAAE,CAAC;QACb,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC"}

package/dist/js/dom/offset/_exports.d.ts

@@ -0,0 +1,3 @@
+import offsetFromParent from './offsetFromParent.js';
+import offsetFromViewport from './offsetFromViewport.js';
+export { offsetFromParent as __offsetFromParent, offsetFromViewport as __offsetFromViewport, offsetFromParent, offsetFromViewport, };

package/dist/js/dom/offset/_exports.js

@@ -0,0 +1,4 @@
+import offsetFromParent from './offsetFromParent.js';
+import offsetFromViewport from './offsetFromViewport.js';
+export { offsetFromParent as __offsetFromParent, offsetFromViewport as __offsetFromViewport, offsetFromParent, offsetFromViewport, };
+//# sourceMappingURL=_exports.js.map

package/dist/js/dom/offset/_exports.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_exports.js","sourceRoot":"","sources":["../../../../src/js/dom/offset/_exports.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AAEzD,OAAO,EACL,gBAAgB,IAAI,kBAAkB,EACtC,kBAAkB,IAAI,oBAAoB,EAC1C,gBAAgB,EAChB,kBAAkB,GACnB,CAAC"}

package/dist/js/dom/offset/offsetFromParent.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @name            offsetFromParent
+ * @namespace       js.dom.offset
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Get the offset top and left of the passed element from his parent top left point
+ *
+ * @param 		{HTMLElement} 					          elm  		    The element to get the offset from
+ * @return 		{top: number; left: number;} 									The offset top and left object
+ *
+ * @snippet         offsetFromParent($1)
+ *
+ * @todo      tests
+ *
+ * @example  	js
+ * import { offsetFromParent } from '@blackbyte/sugar/dom'
+ * const offsetFromParentElm = offsetFromParent(myCoolElement);
+ * // output : { top : 200, left : 300 }
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function offsetFromParent(elm: HTMLElement): {
+    top: number;
+    left: number;
+};

package/dist/js/dom/offset/offsetFromParent.js

@@ -0,0 +1,34 @@
+import offsetFromViewport from './offsetFromViewport.js';
+/**
+ * @name            offsetFromParent
+ * @namespace       js.dom.offset
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Get the offset top and left of the passed element from his parent top left point
+ *
+ * @param 		{HTMLElement} 					          elm  		    The element to get the offset from
+ * @return 		{top: number; left: number;} 									The offset top and left object
+ *
+ * @snippet         offsetFromParent($1)
+ *
+ * @todo      tests
+ *
+ * @example  	js
+ * import { offsetFromParent } from '@blackbyte/sugar/dom'
+ * const offsetFromParentElm = offsetFromParent(myCoolElement);
+ * // output : { top : 200, left : 300 }
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function offsetFromParent(elm) {
+    const parentOffset = offsetFromViewport(elm.parentElement);
+    const offset = offsetFromViewport(elm);
+    return {
+        top: offset.top - parentOffset.top,
+        left: offset.left - parentOffset.left,
+    };
+}
+//# sourceMappingURL=offsetFromParent.js.map

package/dist/js/dom/offset/offsetFromParent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"offsetFromParent.js","sourceRoot":"","sources":["../../../../src/js/dom/offset/offsetFromParent.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AAEzD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,GAAgB;IAIvD,MAAM,YAAY,GAAG,kBAAkB,CAAC,GAAG,CAAC,aAA4B,CAAC,CAAC;IAC1E,MAAM,MAAM,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACvC,OAAO;QACL,GAAG,EAAE,MAAM,CAAC,GAAG,GAAG,YAAY,CAAC,GAAG;QAClC,IAAI,EAAE,MAAM,CAAC,IAAI,GAAG,YAAY,CAAC,IAAI;KACtC,CAAC;AACJ,CAAC"}

package/dist/js/dom/offset/offsetFromViewport.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @name                offsetFromViewport
+ * @namespace           js.dom.offset
+ * @type                Function
+ * @platform            js
+ * @status              stable
+ *
+ * Get the offset top and left of the passed element from the document top left point
+ *
+ * @param 		{HTMLElement} 					        elm  		      The element to get the offset from
+ * @return 		{top: number; left: number;} 									The offset top and left object
+ *
+ * @snippet         offsetFromViewport($1)
+ *
+ * @todo      tests
+ *
+ * @example  	js
+ * import { offsetFromViewport } from '@blackbyte/sugar/dom'
+ * const offsetFromViewport = offset(myCoolElement);
+ * // output : { top : 200, left : 300 }
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function offsetFromViewport(elm: HTMLElement): {
+    top: number;
+    left: number;
+};

package/dist/js/dom/offset/offsetFromViewport.js

@@ -0,0 +1,32 @@
+/**
+ * @name                offsetFromViewport
+ * @namespace           js.dom.offset
+ * @type                Function
+ * @platform            js
+ * @status              stable
+ *
+ * Get the offset top and left of the passed element from the document top left point
+ *
+ * @param 		{HTMLElement} 					        elm  		      The element to get the offset from
+ * @return 		{top: number; left: number;} 									The offset top and left object
+ *
+ * @snippet         offsetFromViewport($1)
+ *
+ * @todo      tests
+ *
+ * @example  	js
+ * import { offsetFromViewport } from '@blackbyte/sugar/dom'
+ * const offsetFromViewport = offset(myCoolElement);
+ * // output : { top : 200, left : 300 }
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function offsetFromViewport(elm) {
+    const box = elm.getBoundingClientRect(), body = document.body, docEl = document.documentElement, scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop, scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft, clientTop = docEl.clientTop || body.clientTop || 0, clientLeft = docEl.clientLeft || body.clientLeft || 0, top = box.top + scrollTop - clientTop, left = box.left + scrollLeft - clientLeft;
+    return {
+        top: Math.round(top),
+        left: Math.round(left),
+    };
+}
+//# sourceMappingURL=offsetFromViewport.js.map

package/dist/js/dom/offset/offsetFromViewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"offsetFromViewport.js","sourceRoot":"","sources":["../../../../src/js/dom/offset/offsetFromViewport.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,GAAgB;IAIzD,MAAM,GAAG,GAAG,GAAG,CAAC,qBAAqB,EAAE,EACrC,IAAI,GAAG,QAAQ,CAAC,IAAI,EACpB,KAAK,GAAG,QAAQ,CAAC,eAAe,EAChC,SAAS,GAAG,MAAM,CAAC,WAAW,IAAI,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,EACnE,UAAU,GAAG,MAAM,CAAC,WAAW,IAAI,KAAK,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,EACtE,SAAS,GAAG,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,EAClD,UAAU,GAAG,KAAK,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,IAAI,CAAC,EACrD,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,SAAS,GAAG,SAAS,EACrC,IAAI,GAAG,GAAG,CAAC,IAAI,GAAG,UAAU,GAAG,UAAU,CAAC;IAC5C,OAAO;QACL,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;QACpB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;KACvB,CAAC;AACJ,CAAC"}

package/dist/js/dom/on/_exports.d.ts

@@ -0,0 +1,4 @@
+import onDrag from './onDrag.js';
+import onScrollEnd from './onScrollEnd.js';
+import onSwipe from './onSwipe.js';
+export { onDrag as __onDrag, onScrollEnd as __onScrollEnd, onSwipe as __onSwipe, onDrag, onScrollEnd, onSwipe, };

package/dist/js/dom/on/_exports.js

@@ -0,0 +1,5 @@
+import onDrag from './onDrag.js';
+import onScrollEnd from './onScrollEnd.js';
+import onSwipe from './onSwipe.js';
+export { onDrag as __onDrag, onScrollEnd as __onScrollEnd, onSwipe as __onSwipe, onDrag, onScrollEnd, onSwipe, };
+//# sourceMappingURL=_exports.js.map

package/dist/js/dom/on/_exports.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_exports.js","sourceRoot":"","sources":["../../../../src/js/dom/on/_exports.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAC3C,OAAO,OAAO,MAAM,cAAc,CAAC;AAEnC,OAAO,EACL,MAAM,IAAI,QAAQ,EAClB,WAAW,IAAI,aAAa,EAC5B,OAAO,IAAI,SAAS,EACpB,MAAM,EACN,WAAW,EACX,OAAO,GACR,CAAC"}

package/dist/js/dom/on/onDrag.d.ts

@@ -0,0 +1,44 @@
+/**
+ * @name            onDrag
+ * @namespace       js.dom.on
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Detect drag "gesture" with the mouse or touch
+ *
+ * @param       {HTMLElement}         elm                   The HTMLElement on which to detect the swipe
+ * @param       {Function}            cb                    The function to call on swipe. The callback function has as parameter an object that containthe swipe direction like left, right, up and down
+ * @param       {Number}              [threshold=100]       The swipe threshold
+ *
+ * @setting     {Number}      [maxSpeed=0.01]       The maximum speed
+ *
+ * @snippet         onDrag($1, $2)
+ * onDrag($1, drag => {
+ *     $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example 	js
+ * import { onDrag } from '@blackbyte/sugar/dom'
+ * onDrag($myElement, (drag) => {
+ *    // do something...
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export type TOnDragTrackItem = {
+    x: number;
+    y: number;
+    deltaX: number;
+    deltaY: number;
+    speedX: number;
+    speedY: number;
+};
+export type TOnDragSettings = {
+    maxSpeed: number;
+};
+export default function onDrag($elm: HTMLElement, cb: Function, settings?: Partial<TOnDragSettings>): void;

package/dist/js/dom/on/onDrag.js

@@ -0,0 +1,90 @@
+import positionFromEvent from '../position/positionFromEvent.js';
+export default function onDrag($elm, cb, settings) {
+    const finalSettings = Object.assign({ maxSpeed: 0.01 }, (settings !== null && settings !== void 0 ? settings : {}));
+    let isMouseDown = false;
+    let startPos, $target;
+    let track = [];
+    let lastCapturedTime;
+    function buildTrackPoint(e) {
+        const { x, y } = positionFromEvent(e);
+        const deltaX = x - startPos.x, deltaY = y - startPos.y, time = Date.now() - lastCapturedTime;
+        const secondPercentage = (100 / 1000) * time;
+        const lastTrackPoint = track[track.length - 1];
+        const lastDeltaX = x - lastTrackPoint.x, lastDeltaY = y - lastTrackPoint.y;
+        let speedX = lastDeltaX / time || 0, speedY = lastDeltaY / time || 0;
+        if (Math.abs(speedX) > finalSettings.maxSpeed) {
+            speedX = finalSettings.maxSpeed * (speedX < 0 ? -1 : 1);
+        }
+        if (Math.abs(speedY) > finalSettings.maxSpeed) {
+            speedY = finalSettings.maxSpeed * (speedY < 0 ? -1 : 1);
+        }
+        const point = {
+            x,
+            y,
+            deltaX,
+            deltaY,
+            speedX: (lastDeltaX / secondPercentage) * 100,
+            speedY: (lastDeltaY / secondPercentage) * 100,
+        };
+        return point;
+    }
+    function down(e) {
+        if (e.target !== $elm && !$elm.contains(e.target))
+            return;
+        $target = e.target;
+        const { x, y } = positionFromEvent(e);
+        // set the start position
+        startPos = {
+            x,
+            y,
+        };
+        // set the first tracked point
+        track = [
+            {
+                x: startPos.x,
+                y: startPos.y,
+                deltaX: 0,
+                deltaY: 0,
+                speedX: 0,
+                speedY: 0,
+            },
+        ];
+        lastCapturedTime = Date.now();
+        // update status
+        isMouseDown = true;
+    }
+    document.addEventListener('mousedown', down);
+    document.addEventListener('touchstart', down);
+    function move(e) {
+        if (!isMouseDown)
+            return;
+        // if first point tracked, trigger the "start" event
+        if (track.length === 1) {
+            cb === null || cb === void 0 ? void 0 : cb({
+                type: 'start',
+                track: track[0],
+            });
+        }
+        $target.style.pointerEvents = 'none';
+        const point = buildTrackPoint(e);
+        track.push(point);
+        cb === null || cb === void 0 ? void 0 : cb(Object.assign(Object.assign({ type: 'track' }, point), { track }));
+        lastCapturedTime = Date.now();
+    }
+    document.addEventListener('mousemove', move);
+    document.addEventListener('touchmove', move);
+    function up(e) {
+        if (!isMouseDown)
+            return;
+        $target.style.pointerEvents = 'unset';
+        // update status
+        isMouseDown = false;
+        // callback if moved
+        if (track.length > 1) {
+            cb === null || cb === void 0 ? void 0 : cb(Object.assign(Object.assign({ type: 'end' }, track[track.length - 1]), { track }));
+        }
+    }
+    document.addEventListener('mouseup', up);
+    document.addEventListener('touchend', up);
+}
+//# sourceMappingURL=onDrag.js.map

package/dist/js/dom/on/onDrag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"onDrag.js","sourceRoot":"","sources":["../../../../src/js/dom/on/onDrag.ts"],"names":[],"mappings":"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"}

package/dist/js/dom/on/onScrollEnd.d.ts

@@ -0,0 +1,43 @@
+/**
+ * @name            onScrollEnd
+ * @namespace       js.dom.on
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * This function simply listen for scroll on the passed element and call the passed callback
+ * when reaching the end of it.
+ *
+ * @param       {HTMLElement}               $elm                The element to listen on
+ * @param       {Function}                  callback            The function to call when scroll end is detected
+ * @param       {TOnScrollEndSettings}      [settings={}]       Some settings like offset, etc...
+ *
+ * @setting         {Number}        [offset=20]             An offset to detect earlier the end of the scroll
+ * @setting         {boolean}       [once=false]            true if you want to detect the scroll end just once
+ * @setting         {number}        [times=-1]              Specify a number of times to detect the scroll end
+ *
+ * @todo      tests
+ *
+ * @snippet         onScrollEnd($1, $2)
+ * onScrollEnd($1, () => {
+ *      $2
+ * });
+ *
+ * @example         js
+ * import { onScrollEnd } from '@blackbyte/sugar/dom';
+ * onScrollEnd($elm, () => {
+ *      // do something
+ * }, {
+ *    offset: 50
+ * });
+ *
+ * @since       1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export type TOnScrollEndSettings = {
+    offset: number;
+    once: boolean;
+    times: number;
+};
+export default function onScrollEnd($elm: HTMLElement, callback: Function, settings?: TOnScrollEndSettings): void;

package/dist/js/dom/on/onScrollEnd.js

@@ -0,0 +1,50 @@
+export default function onScrollEnd($elm, callback, settings) {
+    const finalSettings = Object.assign({ offset: 20, once: false, times: -1 }, (settings !== null && settings !== void 0 ? settings : {}));
+    let isBody = false;
+    let $scrollListenedElm = $elm;
+    let $scrollHeightElm = $elm;
+    if ($elm === window.document.body) {
+        isBody = true;
+        $scrollListenedElm = document;
+        $scrollHeightElm = window.document.body;
+        // @ts-ignore
+    }
+    else if ($elm === window.document) {
+        isBody = true;
+        $elm = document.body;
+        $scrollHeightElm = document.body;
+    }
+    let active = true, count = 0;
+    const internalCallback = (e) => {
+        let fullHeight, viewportHeight, scrollTop;
+        if (isBody) {
+            viewportHeight = window.innerHeight;
+            scrollTop = $scrollHeightElm.scrollTop;
+            fullHeight = Math.max(window.document.body.scrollHeight, window.document.documentElement.scrollHeight, window.document.body.offsetHeight, window.document.documentElement.offsetHeight, window.document.body.clientHeight, window.document.documentElement.clientHeight);
+        }
+        else {
+            viewportHeight = $scrollHeightElm.offsetHeight;
+            scrollTop = $scrollHeightElm.scrollTop;
+            fullHeight = $scrollHeightElm.scrollHeight;
+        }
+        if (active &&
+            scrollTop + viewportHeight >= fullHeight - finalSettings.offset) {
+            callback();
+            count++;
+            if (finalSettings.once) {
+                $scrollListenedElm.removeEventListener('scroll', internalCallback);
+                active = false;
+            }
+            else if (finalSettings.times > 0 && count >= finalSettings.times) {
+                $scrollListenedElm.removeEventListener('scroll', internalCallback);
+                active = false;
+            }
+        }
+        else if ($scrollHeightElm.offsetHeight + $scrollHeightElm.scrollTop <
+            $scrollHeightElm.scrollHeight - finalSettings.offset) {
+            active = true;
+        }
+    };
+    $scrollListenedElm.addEventListener('scroll', internalCallback);
+}
+//# sourceMappingURL=onScrollEnd.js.map

package/dist/js/dom/on/onScrollEnd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"onScrollEnd.js","sourceRoot":"","sources":["../../../../src/js/dom/on/onScrollEnd.ts"],"names":[],"mappings":"AA2CA,MAAM,CAAC,OAAO,UAAU,WAAW,CACjC,IAAiB,EACjB,QAAkB,EAClB,QAA+B;IAE/B,MAAM,aAAa,mBACjB,MAAM,EAAE,EAAE,EACV,IAAI,EAAE,KAAK,EACX,KAAK,EAAE,CAAC,CAAC,IACN,CAAC,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,EAAE,CAAC,CACpB,CAAC;IAEF,IAAI,MAAM,GAAG,KAAK,CAAC;IAEnB,IAAI,kBAAkB,GAAQ,IAAI,CAAC;IACnC,IAAI,gBAAgB,GAAG,IAAI,CAAC;IAC5B,IAAI,IAAI,KAAK,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;QAClC,MAAM,GAAG,IAAI,CAAC;QACd,kBAAkB,GAAG,QAAQ,CAAC;QAC9B,gBAAgB,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC;QACxC,aAAa;IACf,CAAC;SAAM,IAAI,IAAI,KAAK,MAAM,CAAC,QAAQ,EAAE,CAAC;QACpC,MAAM,GAAG,IAAI,CAAC;QACd,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC;QACrB,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC;IACnC,CAAC;IAED,IAAI,MAAM,GAAG,IAAI,EACf,KAAK,GAAG,CAAC,CAAC;IAEZ,MAAM,gBAAgB,GAAG,CAAC,CAAC,EAAE,EAAE;QAC7B,IAAI,UAAU,EAAE,cAAc,EAAE,SAAS,CAAC;QAC1C,IAAI,MAAM,EAAE,CAAC;YACX,cAAc,GAAG,MAAM,CAAC,WAAW,CAAC;YACpC,SAAS,GAAG,gBAAgB,CAAC,SAAS,CAAC;YACvC,UAAU,GAAG,IAAI,CAAC,GAAG,CACnB,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,EACjC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,YAAY,EAC5C,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,EACjC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,YAAY,EAC5C,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,EACjC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,YAAY,CAC7C,CAAC;QACJ,CAAC;aAAM,CAAC;YACN,cAAc,GAAG,gBAAgB,CAAC,YAAY,CAAC;YAC/C,SAAS,GAAG,gBAAgB,CAAC,SAAS,CAAC;YACvC,UAAU,GAAG,gBAAgB,CAAC,YAAY,CAAC;QAC7C,CAAC;QAED,IACE,MAAM;YACN,SAAS,GAAG,cAAc,IAAI,UAAU,GAAG,aAAa,CAAC,MAAM,EAC/D,CAAC;YACD,QAAQ,EAAE,CAAC;YACX,KAAK,EAAE,CAAC;YACR,IAAI,aAAa,CAAC,IAAI,EAAE,CAAC;gBACvB,kBAAkB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,gBAAgB,CAAC,CAAC;gBACnE,MAAM,GAAG,KAAK,CAAC;YACjB,CAAC;iBAAM,IAAI,aAAa,CAAC,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,aAAa,CAAC,KAAK,EAAE,CAAC;gBACnE,kBAAkB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,gBAAgB,CAAC,CAAC;gBACnE,MAAM,GAAG,KAAK,CAAC;YACjB,CAAC;QACH,CAAC;aAAM,IACL,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC,SAAS;YAC1D,gBAAgB,CAAC,YAAY,GAAG,aAAa,CAAC,MAAM,EACpD,CAAC;YACD,MAAM,GAAG,IAAI,CAAC;QAChB,CAAC;IACH,CAAC,CAAC;IAEF,kBAAkB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,gBAAgB,CAAC,CAAC;AAClE,CAAC"}