@nrk/core-scroll - npm Package Compare versions

Comparing version 3.1.1 to 3.1.2

core-scroll.cjs.js

 'use strict';
 
 var name = "@nrk/core-scroll";
-var version = "3.1.0";
+var version = "3.1.1";
 
@@ -71,27 +71,2 @@ var IS_BROWSER = typeof window !== 'undefined';
 /**
-* debounce
-* @param {Function} callback The function to debounce
-* @param {Number} ms The threshold of milliseconds between each callback
-* @return {Function} The new debounced function
-*/
-function debounce (callback, ms) {
-  var last;
-  var time;
-  return function () {
-    var args = [], len = arguments.length;
-    while ( len-- ) args[ len ] = arguments[ len ];
-
-    var self = this;
-    var now = Date.now();
-    if (last && now < last + ms) {
-      clearTimeout(time);
-      time = setTimeout(function () { last = now; callback.apply(self, args); }, ms);
-    } else {
-      last = now;
-      callback.apply(self, args);
-    }
-  }
-}
-
-/**
  * throttle
@@ -102,9 +77,7 @@ * @param {Function} callback  The new throttled function
 function throttle (callback, ms) {
-  var args;
   var timer;
   return function () {
-    var argument = [], len = arguments.length;
-    while ( len-- ) argument[ len ] = arguments[ len ];
+    var args = [], len = arguments.length;
+    while ( len-- ) args[ len ] = arguments[ len ];
 
-    args = argument;
     if (!timer) {
@@ -147,5 +120,4 @@ timer = setTimeout(function () {
 
-function scroll (elements, move, settings) {
+function scroll (elements, move) {
   if ( move === void 0 ) move = '';
-  if ( settings === void 0 ) settings = {};
 
@@ -158,4 +130,2 @@ var options = typeof move === 'object' ? move : { move: move };
       target.setAttribute(UUID, options.friction || '');
-      addEvent(UUID, 'resize', debounce(onChange, settings.resizeMs || 500)); // Update button states on resize
-      addEvent(UUID, 'scroll', throttle(onChange, settings.scrollMs || 500), true); // useCapture to catch event without bubbling
       hideScrollbars(target);
@@ -170,2 +140,4 @@ }
 addEvent(UUID, 'mousedown', onMousedown);
+addEvent(UUID, 'resize', throttle(onChange, 500)); // Update button states on resize
+addEvent(UUID, 'scroll', throttle(onChange, 500), { passive: true, capture: true }); // capture catches events without bubbling
 addEvent(UUID, 'wheel', function () { return (DRAG.animate = false); }, { passive: true }); // Stop animation on wheel scroll
@@ -172,0 +144,0 @@ addEvent(UUID, 'load', onChange); // Update state when we are sure all CSS is loaded

core-scroll.js

 import { name, version } from './package.json'
-import { IS_BROWSER, addEvent, debounce, dispatchEvent, requestAnimFrame, throttle, queryAll } from '../utils'
+import { IS_BROWSER, addEvent, dispatchEvent, requestAnimFrame, throttle, queryAll } from '../utils'
 
@@ -16,3 +16,3 @@ const DRAG = {}
 
-export default function scroll (elements, move = '', settings = {}) {
+export default function scroll (elements, move = '') {
   const options = typeof move === 'object' ? move : { move }
@@ -24,4 +24,2 @@ const isChange = 'x' in options || 'y' in options || options.move
       target.setAttribute(UUID, options.friction || '')
-      addEvent(UUID, 'resize', debounce(onChange, settings.resizeMs || 500)) // Update button states on resize
-      addEvent(UUID, 'scroll', throttle(onChange, settings.scrollMs || 500), true) // useCapture to catch event without bubbling
       hideScrollbars(target)
@@ -36,2 +34,4 @@ }
 addEvent(UUID, 'mousedown', onMousedown)
+addEvent(UUID, 'resize', throttle(onChange, 500)) // Update button states on resize
+addEvent(UUID, 'scroll', throttle(onChange, 500), { passive: true, capture: true }) // capture catches events without bubbling
 addEvent(UUID, 'wheel', () => (DRAG.animate = false), { passive: true }) // Stop animation on wheel scroll
@@ -38,0 +38,0 @@ addEvent(UUID, 'load', onChange) // Update state when we are sure all CSS is loaded

core-scroll.jsx

@@ -19,3 +19,3 @@ import React from 'react'
     this.el.addEventListener('scroll.change', this.onScroll)
-    requestAnimFrame(() => coreScroll(this.el, { friction: this.props.friction }, this.props.settings)) // Make sure DOM has rendered
+    requestAnimFrame(() => coreScroll(this.el, { friction: this.props.friction })) // Make sure DOM has rendered
   }
@@ -22,0 +22,0 @@ componentDidUpdate (prevProps, prevState) {

core-scroll.jsx.js

@@ -1,3 +0,3 @@
-/*! @nrk/core-scroll v3.1.0 - Copyright (c) 2017-2018 NRK */
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["react","prop-types"],e):t.CoreScroll=e(t.React,t.PropTypes)}(this,function(l,t){"use strict";l=l&&l.hasOwnProperty("default")?l.default:l,t=t&&t.hasOwnProperty("default")?t.default:t;var e="undefined"!=typeof window,r=(e&&/(android)/i.test(navigator.userAgent),e&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(t){void 0===t&&(t=!1);try{window.addEventListener("test",null,{get passive(){t=!0}})}catch(t){}return t}());function p(t,e,o,n){(void 0===n&&(n=!1),"undefined"==typeof window||window[t=t+"-"+e])||(r||"object"!=typeof n||(n=Boolean(n.capture)),("resize"===e||"load"===e?window:document).addEventListener(window[t]=e,o,n))}var s="prevent_recursive_dispatch_maximum_callstack";function i(t,e,o){void 0===o&&(o={});var n,r=""+s+e;if(t[r])return!0;t[r]=!0,"function"==typeof window.CustomEvent?n=new window.CustomEvent(e,{bubbles:!0,cancelable:!0,detail:o}):(n=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,o);var i=t.dispatchEvent(n);return t[r]=null,i}function f(t){(window.requestAnimationFrame||window.setTimeout)(t)}function h(t,e){if(void 0===e&&(e=document),t){if(t.nodeType)return[t];if("string"==typeof t)return[].slice.call(e.querySelectorAll(t));if(t.length)return[].slice.call(t)}return[]}var d={},c="data-core-scroll",m="data-@nrk/core-scroll-3.1.0".replace(/\W+/g,"-"),v={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},o=10,g=.8,n=20,a=/INPUT|TEXTAREA|SELECT/,y=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches;function u(t,e,u){void 0===e&&(e=""),void 0===u&&(u={});var f="object"==typeof e?e:{move:e},d="x"in f||"y"in f||f.move;return h(t).map(function(t){var o,n,r,i,l,s,c,a;return t.hasAttribute(m)||(t.setAttribute(m,f.friction||""),p(m,"resize",(l=E,s=u.resizeMs||500,function(){for(var t=[],e=arguments.length;e--;)t[e]=arguments[e];var o=this,n=Date.now();c&&n<c+s?(clearTimeout(a),a=setTimeout(function(){c=n,l.apply(o,t)},s)):(c=n,l.apply(o,t))})),p(m,"scroll",(o=E,n=u.scrollMs||500,function(){for(var t=[],e=arguments.length;e--;)t[e]=arguments[e];r=t,i||(i=setTimeout(function(){o.apply(this,r),i=null},n))}),!0),function(t){document.getElementById(m)||document.head.insertAdjacentHTML("beforeend",'<style id="'+m+'">['+m+"]::-webkit-scrollbar{display:none}</style>");t.style.overflow="scroll",t.style.willChange="scroll-position",t.style.webkitOverflowScrolling="touch";var e=t.offsetWidth-t.clientWidth,o=t.offsetHeight-t.clientHeight;t.style.marginRight="-"+e+"px",t.style.marginBottom="-"+o+"px",t.style.maxHeight="calc(100% + "+o+"px)"}(t)),d?x(t,function(t,e){var o=e.x,n=e.y,r=e.move,i={x:o,y:n,move:v[r]};"number"!=typeof i.x&&(i.x=t.scrollLeft);"number"!=typeof i.y&&(i.y=t.scrollTop);if(i.move){var l=i.move.x?"x":"y",s=i.move.x?"left":"top",c=t.getBoundingClientRect(),a=c[s]-t[i.move.x?"scrollLeft":"scrollTop"],u=c[s]+c[i.move.x?"width":"height"]*i.move[l];h(t.children).every(function(t){var e=t.getBoundingClientRect(),o=t.ownerDocument.defaultView.getComputedStyle(t)["margin-"+s];return i[l]=e[s]-parseInt(o,10)-a,e[i.move.prop||r]<u})}return i}(t,f)):E(t),t})}function w(t){d.diffX=d.pageX-(d.pageX=t.pageX),d.diffY=d.pageY-(d.pageY=t.pageY),d.diffSumX+=d.diffX,d.diffSumY+=d.diffY,d.target.scrollLeft=d.scrollX+=d.diffX,d.target.scrollTop=d.scrollY+=d.diffY,(Math.abs(d.diffSumX)>o||Math.abs(d.diffSumY)>o)&&(d.target.style.pointerEvents="none")}function b(t){var e=d.diffX||d.diffY;document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",b),document.body.style.cursor="",E(d.target),e&&x(d.target,{x:d.scrollX+d.diffX*n,y:d.scrollY+d.diffY*n}),d.target.style.pointerEvents="",d.target=null}function E(t){var e=t.target||t;if("resize"===t.type||"load"===t.type)return h("["+m+"]").forEach(E);if(e.hasAttribute&&e.hasAttribute(m)){var o={left:e.scrollLeft,up:e.scrollTop};o.right=e.scrollWidth-e.clientWidth-o.left,o.down=e.scrollHeight-e.clientHeight-o.up;var n=o.left||o.right||o.up||o.down?"grab":"";i(e,"scroll.change",o),t.type||(e.style.cursor="-webkit-"+n,e.style.cursor=n),e.id&&h("["+c+"]").forEach(function(t){t.getAttribute(c)===e.id&&(t.disabled=!o[t.value])})}}function x(t,e){var o=e.x,n=e.y,r=Math.min(.99,t.getAttribute(m))||g,i=d.animate=Math.floor(Date.now()*Math.random()).toString(16),l=Math.max(0,Math.min(o,t.scrollWidth-t.clientWidth)),s=Math.max(0,Math.min(n,t.scrollHeight-t.clientHeight)),c=y?1:l-t.scrollLeft,a=y?1:s-t.scrollTop,u=function(){d.animate===i&&(Math.round(c)||Math.round(a))&&(t.scrollLeft=l-Math.round(c*=r),t.scrollTop=s-Math.round(a*=r),f(u))};u()}p(m,"mousedown",function(t){for(var e=t.target;e;e=e.parentElement){if("true"===e.contentEditable||a.test(e.nodeName))return;!t.defaultPrevented&&e.hasAttribute&&e.hasAttribute(m)&&(t.preventDefault(),d.pageX=t.pageX,d.pageY=t.pageY,d.diffSumX=0,d.diffSumY=0,d.scrollX=e.scrollLeft,d.scrollY=e.scrollTop,d.animate=d.diffX=d.diffY=0,d.target=e,document.body.style.cursor=e.style.cursor="-webkit-grabbing",document.body.style.cursor=e.style.cursor="grabbing",document.addEventListener("mousemove",w),document.addEventListener("mouseup",b))}}),p(m,"wheel",function(){return d.animate=!1},{passive:!0}),p(m,"load",E),p(m,"click",function(t){if(t.defaultPrevented)return;for(var e=t.target;e;e=e.parentElement){var o=document.getElementById(e.getAttribute(c));if(o&&i(o,"scroll.click",{move:e.value}))return u(o,e.value)}});var L=function(o){function i(t){var e=this;o.call(this,t),this.onScroll=this.onScroll.bind(this),this.scrollTo=function(t){return u(e.el,t)},this.scrollUp=function(){return u(e.el,"up")},this.scrollDown=function(){return u(e.el,"down")},this.scrollLeft=function(){return u(e.el,"left")},this.scrollRight=function(){return u(e.el,"right")}}o&&(i.__proto__=o),(i.prototype=Object.create(o&&o.prototype)).constructor=i;var t={defaultProps:{configurable:!0}};return t.defaultProps.get=function(){return{onChange:null,friction:null}},i.prototype.componentDidMount=function(){var t=this;this.el.addEventListener("scroll.change",this.onScroll),f(function(){return u(t.el,{friction:t.props.friction},t.props.settings)})},i.prototype.componentDidUpdate=function(t,e){this.skipUpdate?this.skipUpdate=!1:u(this.el)},i.prototype.componentWillUnmount=function(){this.el.removeEventListener("scroll.change",this.onScroll)},i.prototype.onScroll=function(t){var e=t.detail;this.props.onChange&&(this.skipUpdate=!0,this.props.onChange({scrollUp:e.up?this.scrollUp:null,scrollDown:e.down?this.scrollDown:null,scrollLeft:e.left?this.scrollLeft:null,scrollRight:e.right?this.scrollRight:null}))},i.prototype.render=function(){var o,n,t,e=this,r=(o=this.props,n=i.defaultProps,void 0===(t={ref:function(t){return e.el=t}})&&(t={}),Object.keys(o).reduce(function(t,e){return n.hasOwnProperty(e)||(t[e]=o[e]),t},t));return l.createElement("div",r,this.props.children)},Object.defineProperties(i,t),i}(l.Component);return L.propTypes={onChange:t.func,friction:t.number},L});
+/*! @nrk/core-scroll v3.1.1 - Copyright (c) 2017-2018 NRK */
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["react","prop-types"],e):t.CoreScroll=e(t.React,t.PropTypes)}(this,function(l,t){"use strict";l=l&&l.hasOwnProperty("default")?l.default:l,t=t&&t.hasOwnProperty("default")?t.default:t;var e="undefined"!=typeof window,r=(e&&/(android)/i.test(navigator.userAgent),e&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(t){void 0===t&&(t=!1);try{window.addEventListener("test",null,{get passive(){t=!0}})}catch(t){}return t}());function o(t,e,o,n){(void 0===n&&(n=!1),"undefined"==typeof window||window[t=t+"-"+e])||(r||"object"!=typeof n||(n=Boolean(n.capture)),("resize"===e||"load"===e?window:document).addEventListener(window[t]=e,o,n))}var c="prevent_recursive_dispatch_maximum_callstack";function i(t,e,o){void 0===o&&(o={});var n,r=""+c+e;if(t[r])return!0;t[r]=!0,"function"==typeof window.CustomEvent?n=new window.CustomEvent(e,{bubbles:!0,cancelable:!0,detail:o}):(n=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,o);var i=t.dispatchEvent(n);return t[r]=null,i}function f(t){(window.requestAnimationFrame||window.setTimeout)(t)}function n(o,n){var r;return function(){for(var t=[],e=arguments.length;e--;)t[e]=arguments[e];r||(r=setTimeout(function(){o.apply(this,t),r=null},n))}}function d(t,e){if(void 0===e&&(e=document),t){if(t.nodeType)return[t];if("string"==typeof t)return[].slice.call(e.querySelectorAll(t));if(t.length)return[].slice.call(t)}return[]}var p={},s="data-core-scroll",h="data-@nrk/core-scroll-3.1.1".replace(/\W+/g,"-"),m={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},u=10,v=.8,a=20,g=/INPUT|TEXTAREA|SELECT/,y=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches;function w(t,e){void 0===e&&(e="");var o="object"==typeof e?e:{move:e},n="x"in o||"y"in o||o.move;return d(t).map(function(t){return t.hasAttribute(h)||(t.setAttribute(h,o.friction||""),function(t){document.getElementById(h)||document.head.insertAdjacentHTML("beforeend",'<style id="'+h+'">['+h+"]::-webkit-scrollbar{display:none}</style>");t.style.overflow="scroll",t.style.willChange="scroll-position",t.style.webkitOverflowScrolling="touch";var e=t.offsetWidth-t.clientWidth,o=t.offsetHeight-t.clientHeight;t.style.marginRight="-"+e+"px",t.style.marginBottom="-"+o+"px",t.style.maxHeight="calc(100% + "+o+"px)"}(t)),n?L(t,function(t,e){var o=e.x,n=e.y,r=e.move,i={x:o,y:n,move:m[r]};"number"!=typeof i.x&&(i.x=t.scrollLeft);"number"!=typeof i.y&&(i.y=t.scrollTop);if(i.move){var l=i.move.x?"x":"y",c=i.move.x?"left":"top",s=t.getBoundingClientRect(),u=s[c]-t[i.move.x?"scrollLeft":"scrollTop"],a=s[c]+s[i.move.x?"width":"height"]*i.move[l];d(t.children).every(function(t){var e=t.getBoundingClientRect(),o=t.ownerDocument.defaultView.getComputedStyle(t)["margin-"+c];return i[l]=e[c]-parseInt(o,10)-u,e[i.move.prop||r]<a})}return i}(t,o)):x(t),t})}function b(t){p.diffX=p.pageX-(p.pageX=t.pageX),p.diffY=p.pageY-(p.pageY=t.pageY),p.diffSumX+=p.diffX,p.diffSumY+=p.diffY,p.target.scrollLeft=p.scrollX+=p.diffX,p.target.scrollTop=p.scrollY+=p.diffY,(Math.abs(p.diffSumX)>u||Math.abs(p.diffSumY)>u)&&(p.target.style.pointerEvents="none")}function E(t){var e=p.diffX||p.diffY;document.removeEventListener("mousemove",b),document.removeEventListener("mouseup",E),document.body.style.cursor="",x(p.target),e&&L(p.target,{x:p.scrollX+p.diffX*a,y:p.scrollY+p.diffY*a}),p.target.style.pointerEvents="",p.target=null}function x(t){var e=t.target||t;if("resize"===t.type||"load"===t.type)return d("["+h+"]").forEach(x);if(e.hasAttribute&&e.hasAttribute(h)){var o={left:e.scrollLeft,up:e.scrollTop};o.right=e.scrollWidth-e.clientWidth-o.left,o.down=e.scrollHeight-e.clientHeight-o.up;var n=o.left||o.right||o.up||o.down?"grab":"";i(e,"scroll.change",o),t.type||(e.style.cursor="-webkit-"+n,e.style.cursor=n),e.id&&d("["+s+"]").forEach(function(t){t.getAttribute(s)===e.id&&(t.disabled=!o[t.value])})}}function L(t,e){var o=e.x,n=e.y,r=Math.min(.99,t.getAttribute(h))||v,i=p.animate=Math.floor(Date.now()*Math.random()).toString(16),l=Math.max(0,Math.min(o,t.scrollWidth-t.clientWidth)),c=Math.max(0,Math.min(n,t.scrollHeight-t.clientHeight)),s=y?1:l-t.scrollLeft,u=y?1:c-t.scrollTop,a=function(){p.animate===i&&(Math.round(s)||Math.round(u))&&(t.scrollLeft=l-Math.round(s*=r),t.scrollTop=c-Math.round(u*=r),f(a))};a()}o(h,"mousedown",function(t){for(var e=t.target;e;e=e.parentElement){if("true"===e.contentEditable||g.test(e.nodeName))return;!t.defaultPrevented&&e.hasAttribute&&e.hasAttribute(h)&&(t.preventDefault(),p.pageX=t.pageX,p.pageY=t.pageY,p.diffSumX=0,p.diffSumY=0,p.scrollX=e.scrollLeft,p.scrollY=e.scrollTop,p.animate=p.diffX=p.diffY=0,p.target=e,document.body.style.cursor=e.style.cursor="-webkit-grabbing",document.body.style.cursor=e.style.cursor="grabbing",document.addEventListener("mousemove",b),document.addEventListener("mouseup",E))}}),o(h,"resize",n(x,500)),o(h,"scroll",n(x,500),{passive:!0,capture:!0}),o(h,"wheel",function(){return p.animate=!1},{passive:!0}),o(h,"load",x),o(h,"click",function(t){if(t.defaultPrevented)return;for(var e=t.target;e;e=e.parentElement){var o=document.getElementById(e.getAttribute(s));if(o&&i(o,"scroll.click",{move:e.value}))return w(o,e.value)}});var S=function(o){function i(t){var e=this;o.call(this,t),this.onScroll=this.onScroll.bind(this),this.scrollTo=function(t){return w(e.el,t)},this.scrollUp=function(){return w(e.el,"up")},this.scrollDown=function(){return w(e.el,"down")},this.scrollLeft=function(){return w(e.el,"left")},this.scrollRight=function(){return w(e.el,"right")}}o&&(i.__proto__=o),(i.prototype=Object.create(o&&o.prototype)).constructor=i;var t={defaultProps:{configurable:!0}};return t.defaultProps.get=function(){return{onChange:null,friction:null}},i.prototype.componentDidMount=function(){var t=this;this.el.addEventListener("scroll.change",this.onScroll),f(function(){return w(t.el,{friction:t.props.friction})})},i.prototype.componentDidUpdate=function(t,e){this.skipUpdate?this.skipUpdate=!1:w(this.el)},i.prototype.componentWillUnmount=function(){this.el.removeEventListener("scroll.change",this.onScroll)},i.prototype.onScroll=function(t){var e=t.detail;this.props.onChange&&(this.skipUpdate=!0,this.props.onChange({scrollUp:e.up?this.scrollUp:null,scrollDown:e.down?this.scrollDown:null,scrollLeft:e.left?this.scrollLeft:null,scrollRight:e.right?this.scrollRight:null}))},i.prototype.render=function(){var o,n,t,e=this,r=(o=this.props,n=i.defaultProps,void 0===(t={ref:function(t){return e.el=t}})&&(t={}),Object.keys(o).reduce(function(t,e){return n.hasOwnProperty(e)||(t[e]=o[e]),t},t));return l.createElement("div",r,this.props.children)},Object.defineProperties(i,t),i}(l.Component);return S.propTypes={onChange:t.func,friction:t.number},S});
 //# sourceMappingURL=core-scroll.jsx.js.map

core-scroll.min.js

@@ -1,3 +0,3 @@
-/*! @nrk/core-scroll v3.1.0 - Copyright (c) 2017-2018 NRK */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.coreScroll=t()}(this,function(){"use strict";var e="undefined"!=typeof window,r=(e&&/(android)/i.test(navigator.userAgent),e&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(e){void 0===e&&(e=!1);try{window.addEventListener("test",null,{get passive(){e=!0}})}catch(e){}return e}());function m(e,t,o,n){(void 0===n&&(n=!1),"undefined"==typeof window||window[e=e+"-"+t])||(r||"object"!=typeof n||(n=Boolean(n.capture)),("resize"===t||"load"===t?window:document).addEventListener(window[e]=t,o,n))}var l="prevent_recursive_dispatch_maximum_callstack";function i(e,t,o){void 0===o&&(o={});var n,r=""+l+t;if(e[r])return!0;e[r]=!0,"function"==typeof window.CustomEvent?n=new window.CustomEvent(t,{bubbles:!0,cancelable:!0,detail:o}):(n=document.createEvent("CustomEvent")).initCustomEvent(t,!0,!0,o);var i=e.dispatchEvent(n);return e[r]=null,i}function p(e,t){if(void 0===t&&(t=document),e){if(e.nodeType)return[e];if("string"==typeof e)return[].slice.call(t.querySelectorAll(e));if(e.length)return[].slice.call(e)}return[]}var s={},a="data-core-scroll",v="data-@nrk/core-scroll-3.1.0".replace(/\W+/g,"-"),g={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},t=10,f=.8,o=20,n=/INPUT|TEXTAREA|SELECT/,h=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches;function u(e,t,d){void 0===t&&(t=""),void 0===d&&(d={});var s="object"==typeof t?t:{move:t},f="x"in s||"y"in s||s.move;return p(e).map(function(e){var o,n,r,i,l,a,u,c;return e.hasAttribute(v)||(e.setAttribute(v,s.friction||""),m(v,"resize",(l=y,a=d.resizeMs||500,function(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];var o=this,n=Date.now();u&&n<u+a?(clearTimeout(c),c=setTimeout(function(){u=n,l.apply(o,e)},a)):(u=n,l.apply(o,e))})),m(v,"scroll",(o=y,n=d.scrollMs||500,function(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];r=e,i||(i=setTimeout(function(){o.apply(this,r),i=null},n))}),!0),function(e){document.getElementById(v)||document.head.insertAdjacentHTML("beforeend",'<style id="'+v+'">['+v+"]::-webkit-scrollbar{display:none}</style>");e.style.overflow="scroll",e.style.willChange="scroll-position",e.style.webkitOverflowScrolling="touch";var t=e.offsetWidth-e.clientWidth,o=e.offsetHeight-e.clientHeight;e.style.marginRight="-"+t+"px",e.style.marginBottom="-"+o+"px",e.style.maxHeight="calc(100% + "+o+"px)"}(e)),f?w(e,function(e,t){var o=t.x,n=t.y,r=t.move,i={x:o,y:n,move:g[r]};"number"!=typeof i.x&&(i.x=e.scrollLeft);"number"!=typeof i.y&&(i.y=e.scrollTop);if(i.move){var l=i.move.x?"x":"y",a=i.move.x?"left":"top",u=e.getBoundingClientRect(),c=u[a]-e[i.move.x?"scrollLeft":"scrollTop"],d=u[a]+u[i.move.x?"width":"height"]*i.move[l];p(e.children).every(function(e){var t=e.getBoundingClientRect(),o=e.ownerDocument.defaultView.getComputedStyle(e)["margin-"+a];return i[l]=t[a]-parseInt(o,10)-c,t[i.move.prop||r]<d})}return i}(e,s)):y(e),e})}function c(e){s.diffX=s.pageX-(s.pageX=e.pageX),s.diffY=s.pageY-(s.pageY=e.pageY),s.diffSumX+=s.diffX,s.diffSumY+=s.diffY,s.target.scrollLeft=s.scrollX+=s.diffX,s.target.scrollTop=s.scrollY+=s.diffY,(Math.abs(s.diffSumX)>t||Math.abs(s.diffSumY)>t)&&(s.target.style.pointerEvents="none")}function d(e){var t=s.diffX||s.diffY;document.removeEventListener("mousemove",c),document.removeEventListener("mouseup",d),document.body.style.cursor="",y(s.target),t&&w(s.target,{x:s.scrollX+s.diffX*o,y:s.scrollY+s.diffY*o}),s.target.style.pointerEvents="",s.target=null}function y(e){var t=e.target||e;if("resize"===e.type||"load"===e.type)return p("["+v+"]").forEach(y);if(t.hasAttribute&&t.hasAttribute(v)){var o={left:t.scrollLeft,up:t.scrollTop};o.right=t.scrollWidth-t.clientWidth-o.left,o.down=t.scrollHeight-t.clientHeight-o.up;var n=o.left||o.right||o.up||o.down?"grab":"";i(t,"scroll.change",o),e.type||(t.style.cursor="-webkit-"+n,t.style.cursor=n),t.id&&p("["+a+"]").forEach(function(e){e.getAttribute(a)===t.id&&(e.disabled=!o[e.value])})}}function w(t,e){var o=e.x,n=e.y,r=Math.min(.99,t.getAttribute(v))||f,i=s.animate=Math.floor(Date.now()*Math.random()).toString(16),l=Math.max(0,Math.min(o,t.scrollWidth-t.clientWidth)),a=Math.max(0,Math.min(n,t.scrollHeight-t.clientHeight)),u=h?1:l-t.scrollLeft,c=h?1:a-t.scrollTop,d=function(){var e;s.animate===i&&(Math.round(u)||Math.round(c))&&(t.scrollLeft=l-Math.round(u*=r),t.scrollTop=a-Math.round(c*=r),e=d,(window.requestAnimationFrame||window.setTimeout)(e))};d()}return m(v,"mousedown",function(e){for(var t=e.target;t;t=t.parentElement){if("true"===t.contentEditable||n.test(t.nodeName))return;!e.defaultPrevented&&t.hasAttribute&&t.hasAttribute(v)&&(e.preventDefault(),s.pageX=e.pageX,s.pageY=e.pageY,s.diffSumX=0,s.diffSumY=0,s.scrollX=t.scrollLeft,s.scrollY=t.scrollTop,s.animate=s.diffX=s.diffY=0,s.target=t,document.body.style.cursor=t.style.cursor="-webkit-grabbing",document.body.style.cursor=t.style.cursor="grabbing",document.addEventListener("mousemove",c),document.addEventListener("mouseup",d))}}),m(v,"wheel",function(){return s.animate=!1},{passive:!0}),m(v,"load",y),m(v,"click",function(e){if(e.defaultPrevented)return;for(var t=e.target;t;t=t.parentElement){var o=document.getElementById(t.getAttribute(a));if(o&&i(o,"scroll.click",{move:t.value}))return u(o,t.value)}}),u});
+/*! @nrk/core-scroll v3.1.1 - Copyright (c) 2017-2018 NRK */
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.coreScroll=t()}(this,function(){"use strict";var e="undefined"!=typeof window,r=(e&&/(android)/i.test(navigator.userAgent),e&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(e){void 0===e&&(e=!1);try{window.addEventListener("test",null,{get passive(){e=!0}})}catch(e){}return e}());function t(e,t,o,n){(void 0===n&&(n=!1),"undefined"==typeof window||window[e=e+"-"+t])||(r||"object"!=typeof n||(n=Boolean(n.capture)),("resize"===t||"load"===t?window:document).addEventListener(window[e]=t,o,n))}var l="prevent_recursive_dispatch_maximum_callstack";function i(e,t,o){void 0===o&&(o={});var n,r=""+l+t;if(e[r])return!0;e[r]=!0,"function"==typeof window.CustomEvent?n=new window.CustomEvent(t,{bubbles:!0,cancelable:!0,detail:o}):(n=document.createEvent("CustomEvent")).initCustomEvent(t,!0,!0,o);var i=e.dispatchEvent(n);return e[r]=null,i}function o(o,n){var r;return function(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];r||(r=setTimeout(function(){o.apply(this,e),r=null},n))}}function f(e,t){if(void 0===t&&(t=document),e){if(e.nodeType)return[e];if("string"==typeof e)return[].slice.call(t.querySelectorAll(e));if(e.length)return[].slice.call(e)}return[]}var s={},a="data-core-scroll",m="data-@nrk/core-scroll-3.1.1".replace(/\W+/g,"-"),p={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},n=10,v=.8,u=20,c=/INPUT|TEXTAREA|SELECT/,g=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches;function d(e,t){void 0===t&&(t="");var o="object"==typeof t?t:{move:t},n="x"in o||"y"in o||o.move;return f(e).map(function(e){return e.hasAttribute(m)||(e.setAttribute(m,o.friction||""),function(e){document.getElementById(m)||document.head.insertAdjacentHTML("beforeend",'<style id="'+m+'">['+m+"]::-webkit-scrollbar{display:none}</style>");e.style.overflow="scroll",e.style.willChange="scroll-position",e.style.webkitOverflowScrolling="touch";var t=e.offsetWidth-e.clientWidth,o=e.offsetHeight-e.clientHeight;e.style.marginRight="-"+t+"px",e.style.marginBottom="-"+o+"px",e.style.maxHeight="calc(100% + "+o+"px)"}(e)),n?b(e,function(e,t){var o=t.x,n=t.y,r=t.move,i={x:o,y:n,move:p[r]};"number"!=typeof i.x&&(i.x=e.scrollLeft);"number"!=typeof i.y&&(i.y=e.scrollTop);if(i.move){var l=i.move.x?"x":"y",a=i.move.x?"left":"top",u=e.getBoundingClientRect(),c=u[a]-e[i.move.x?"scrollLeft":"scrollTop"],d=u[a]+u[i.move.x?"width":"height"]*i.move[l];f(e.children).every(function(e){var t=e.getBoundingClientRect(),o=e.ownerDocument.defaultView.getComputedStyle(e)["margin-"+a];return i[l]=t[a]-parseInt(o,10)-c,t[i.move.prop||r]<d})}return i}(e,o)):w(e),e})}function h(e){s.diffX=s.pageX-(s.pageX=e.pageX),s.diffY=s.pageY-(s.pageY=e.pageY),s.diffSumX+=s.diffX,s.diffSumY+=s.diffY,s.target.scrollLeft=s.scrollX+=s.diffX,s.target.scrollTop=s.scrollY+=s.diffY,(Math.abs(s.diffSumX)>n||Math.abs(s.diffSumY)>n)&&(s.target.style.pointerEvents="none")}function y(e){var t=s.diffX||s.diffY;document.removeEventListener("mousemove",h),document.removeEventListener("mouseup",y),document.body.style.cursor="",w(s.target),t&&b(s.target,{x:s.scrollX+s.diffX*u,y:s.scrollY+s.diffY*u}),s.target.style.pointerEvents="",s.target=null}function w(e){var t=e.target||e;if("resize"===e.type||"load"===e.type)return f("["+m+"]").forEach(w);if(t.hasAttribute&&t.hasAttribute(m)){var o={left:t.scrollLeft,up:t.scrollTop};o.right=t.scrollWidth-t.clientWidth-o.left,o.down=t.scrollHeight-t.clientHeight-o.up;var n=o.left||o.right||o.up||o.down?"grab":"";i(t,"scroll.change",o),e.type||(t.style.cursor="-webkit-"+n,t.style.cursor=n),t.id&&f("["+a+"]").forEach(function(e){e.getAttribute(a)===t.id&&(e.disabled=!o[e.value])})}}function b(t,e){var o=e.x,n=e.y,r=Math.min(.99,t.getAttribute(m))||v,i=s.animate=Math.floor(Date.now()*Math.random()).toString(16),l=Math.max(0,Math.min(o,t.scrollWidth-t.clientWidth)),a=Math.max(0,Math.min(n,t.scrollHeight-t.clientHeight)),u=g?1:l-t.scrollLeft,c=g?1:a-t.scrollTop,d=function(){var e;s.animate===i&&(Math.round(u)||Math.round(c))&&(t.scrollLeft=l-Math.round(u*=r),t.scrollTop=a-Math.round(c*=r),e=d,(window.requestAnimationFrame||window.setTimeout)(e))};d()}return t(m,"mousedown",function(e){for(var t=e.target;t;t=t.parentElement){if("true"===t.contentEditable||c.test(t.nodeName))return;!e.defaultPrevented&&t.hasAttribute&&t.hasAttribute(m)&&(e.preventDefault(),s.pageX=e.pageX,s.pageY=e.pageY,s.diffSumX=0,s.diffSumY=0,s.scrollX=t.scrollLeft,s.scrollY=t.scrollTop,s.animate=s.diffX=s.diffY=0,s.target=t,document.body.style.cursor=t.style.cursor="-webkit-grabbing",document.body.style.cursor=t.style.cursor="grabbing",document.addEventListener("mousemove",h),document.addEventListener("mouseup",y))}}),t(m,"resize",o(w,500)),t(m,"scroll",o(w,500),{passive:!0,capture:!0}),t(m,"wheel",function(){return s.animate=!1},{passive:!0}),t(m,"load",w),t(m,"click",function(e){if(e.defaultPrevented)return;for(var t=e.target;t;t=t.parentElement){var o=document.getElementById(t.getAttribute(a));if(o&&i(o,"scroll.click",{move:t.value}))return d(o,t.value)}}),d});
 //# sourceMappingURL=core-scroll.min.js.map

jsx.js

@@ -9,3 +9,3 @@ 'use strict';
 var name = "@nrk/core-scroll";
-var version = "3.1.0";
+var version = "3.1.1";
 
@@ -92,27 +92,2 @@ var IS_BROWSER = typeof window !== 'undefined';
 /**
-* debounce
-* @param {Function} callback The function to debounce
-* @param {Number} ms The threshold of milliseconds between each callback
-* @return {Function} The new debounced function
-*/
-function debounce (callback, ms) {
-  var last;
-  var time;
-  return function () {
-    var args = [], len = arguments.length;
-    while ( len-- ) args[ len ] = arguments[ len ];
-
-    var self = this;
-    var now = Date.now();
-    if (last && now < last + ms) {
-      clearTimeout(time);
-      time = setTimeout(function () { last = now; callback.apply(self, args); }, ms);
-    } else {
-      last = now;
-      callback.apply(self, args);
-    }
-  }
-}
-
-/**
  * throttle
@@ -123,9 +98,7 @@ * @param {Function} callback  The new throttled function
 function throttle (callback, ms) {
-  var args;
   var timer;
   return function () {
-    var argument = [], len = arguments.length;
-    while ( len-- ) argument[ len ] = arguments[ len ];
+    var args = [], len = arguments.length;
+    while ( len-- ) args[ len ] = arguments[ len ];
 
-    args = argument;
     if (!timer) {
@@ -168,5 +141,4 @@ timer = setTimeout(function () {
 
-function scroll (elements, move, settings) {
+function scroll (elements, move) {
   if ( move === void 0 ) move = '';
-  if ( settings === void 0 ) settings = {};
 
@@ -179,4 +151,2 @@ var options = typeof move === 'object' ? move : { move: move };
       target.setAttribute(UUID, options.friction || '');
-      addEvent(UUID, 'resize', debounce(onChange, settings.resizeMs || 500)); // Update button states on resize
-      addEvent(UUID, 'scroll', throttle(onChange, settings.scrollMs || 500), true); // useCapture to catch event without bubbling
       hideScrollbars(target);
@@ -191,2 +161,4 @@ }
 addEvent(UUID, 'mousedown', onMousedown);
+addEvent(UUID, 'resize', throttle(onChange, 500)); // Update button states on resize
+addEvent(UUID, 'scroll', throttle(onChange, 500), { passive: true, capture: true }); // capture catches events without bubbling
 addEvent(UUID, 'wheel', function () { return (DRAG.animate = false); }, { passive: true }); // Stop animation on wheel scroll
@@ -392,3 +364,3 @@ addEvent(UUID, 'load', onChange); // Update state when we are sure all CSS is loaded
     this.el.addEventListener('scroll.change', this.onScroll);
-    requestAnimFrame(function () { return scroll(this$1.el, { friction: this$1.props.friction }, this$1.props.settings); }); // Make sure DOM has rendered
+    requestAnimFrame(function () { return scroll(this$1.el, { friction: this$1.props.friction }); }); // Make sure DOM has rendered
   };
@@ -395,0 +367,0 @@ Scroll.prototype.componentDidUpdate = function componentDidUpdate (prevProps, prevState) {

package.json

@@ -5,3 +5,3 @@ {
   "author": "NRK <[e-mail]> (https://www.nrk.no/)",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "license": "MIT",
@@ -8,0 +8,0 @@ "main": "core-scroll.cjs.js",

readme.md

@@ -130,6 +130,3 @@ # Core Scroll
 })
-coreScroll(String|Element|Elements, '', {
-  resizeMs: 250,
-  scrollMs: 100
-}) // Optionally send in a third argument to customize the debounce rate of the resize event and the throttle rate of the scroll event
+coreScroll(String|Element|Elements, '') // Optionally send in a third argument to customize the debounce rate of the resize event and the throttle rate of the scroll event
 ```
@@ -141,3 +138,3 @@
 
-<CoreScroll onChange={(state) => {}} settings={{resizeMs: 250, scrollMs: 100}}>
+<CoreScroll onChange={(state) => {}}>
   {/* elements */}
@@ -163,5 +160,7 @@ </CoreScroll>
 ## Events
-`'scroll.change'` is fired regularly during a scroll. The event is [throttled](https://css-tricks.com/the-difference-between-throttling-and-debouncing/) to achieve better performance. The event bubbles, and can therefore be detected both from button element itself, or any parent element (read event delegation):
 
+### scroll.change
+`'scroll.change'` is fired regularly during a scroll. The event is [throttled](https://css-tricks.com/the-difference-between-throttling-and-debouncing/) to run every 500ms and ensure better performance. The event bubbles, and can therefore be detected both from button element itself, or any parent element (read event delegation):
 
+
 ```js
@@ -177,2 +176,4 @@ document.addEventListener('scroll.change', (event) => {
 
+
+### scroll.click
 `'scroll.click'` is fired when clicking a button controlling `@nrk/core-scroll`. The event bubbles, and can therefore be detected both from button element itself, or any parent element (read event delegation):
@@ -188,2 +189,16 @@
 
+### scroll
+`'scroll'` [is a native event](https://developer.mozilla.org/en-US/docs/Web/Events/scroll) fired for every scrolled pixel. Be cautious about performance when listening to `scroll`; heavy or many read/write operations will slow down your page. The event does not bubble, and you therefore need [`useCapture`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Parameters) set to true when listening for `scroll` events from a parent element:
+
+```js
+document.addEventListener('scroll', (event) => {
+  event.target        // NB: Can be any scrolling element since this is a native event
+
+  // Example check if the event.target is the correct @nrk/core-scoll
+  if (event.target.id === 'ID-OF-MY-CORE-SCROLL-HERE') {
+    // Do Something
+  }
+}, true) // Note the true parameter, activating capture listening
+```
+
 ---
@@ -190,0 +205,0 @@

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

Number of lines in readme file

231

increased by6.94%

Worsened metrics

Total package byte prevSize

103546

decreased by-3.05%

Lines of code

900

decreased by-5.66%

No dependency changes