@nrk/core-scroll - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

core-scroll.js

@@ -8,3 +8,3 @@ import {name, version} from './package.json'
 const MOVE = {up: {y: -1, prop: 'top'}, down: {y: 1, prop: 'bottom'}, left: {x: -1}, right: {x: 1}}
-const FRICTION = 0.95
+const FRICTION = 0.8
 const VELOCITY = 20
@@ -22,9 +22,11 @@
     if (!target.hasAttribute(UUID)) { // Reduce read / write operations
+      target.setAttribute(UUID, options.friction)
+      target.style.overflow = 'scroll' // Ensure visible scrollbars
+      target.style.willChange = 'scroll-position' // Enhance performace
+      target.style.webkitOverflowScrolling = 'touch' // Momentum scoll on iOS
+
+      // Must be after setting overflow scroll
       const scrollbarWidth = target.offsetWidth - target.clientWidth
       const scrollbarHeight = target.offsetHeight - target.clientHeight
 
-      target.setAttribute(UUID, '')
-      target.style.overflow = 'scroll' // Ensure visible scrollbars
-      target.style.willChange = 'scroll-position' // Enhance performace
-      target.style.webkitOverflowScrolling = 'touch' // Momentum scoll on iOS
       target.style.maxHeight = `calc(100% + ${scrollbarHeight}px)` // Consistent height
@@ -34,3 +36,3 @@ target.style.marginRight = `-${scrollbarWidth}px`
       setCursor(target, 'grab')
-      onScroll({target}) // Update state
+      onChange({target}) // Update state
     }
@@ -43,3 +45,4 @@ if (isChange) scrollTo(target, parsePoint(target, options))
 addEvent(UUID, 'mousedown', onMousedown)
-addEvent(UUID, 'scroll', throttle(onScroll, 500), true) // useCapture to catch event without bubbling
+addEvent(UUID, 'resize', throttle(onChange, 500)) // Update button states on resize
+addEvent(UUID, 'scroll', throttle(onChange, 500), true) // useCapture to catch event without bubbling
 addEvent(UUID, 'wheel', () => (DRAG.animate = false), {passive: true}) // Stop animation on wheel scroll
@@ -86,4 +89,7 @@ addEvent(UUID, 'click', onClick)
 
-function onScroll ({type, target}) {
+function onChange (event) {
+  const target = event.target || event
+  if (event.type === 'resize') return queryAll(`[${UUID}]`).forEach(onChange) // Update all on resize
   if (!target.hasAttribute || !target.hasAttribute(UUID)) return // target can be document
+
   const detail = {left: target.scrollLeft, up: target.scrollTop}
@@ -94,2 +100,3 @@ detail.right = target.scrollWidth - target.clientWidth - detail.left
   dispatchEvent(target, 'scroll.change', detail)
+
   if (target.id) {
@@ -116,2 +123,3 @@ queryAll(`[${ATTR}]`).forEach((el) => {
   // Giving the animation an ID to workaround IE timeout issues
+  const friction = Math.min(0.99, target.getAttribute(UUID)) || FRICTION // Avoid friction 1 (infinite)
   const uuid = DRAG.animate = Math.floor(Date.now() * Math.random()).toString(16)
@@ -125,4 +133,4 @@ const endX = Math.max(0, Math.min(x, target.scrollWidth - target.clientWidth))
     if (DRAG.animate === uuid && (Math.round(moveX) || Math.round(moveY))) {
-      target.scrollLeft = endX - Math.round(moveX *= FRICTION)
-      target.scrollTop = endY - Math.round(moveY *= FRICTION)
+      target.scrollLeft = endX - Math.round(moveX *= friction)
+      target.scrollTop = endY - Math.round(moveY *= friction)
       requestAnim(move)
@@ -129,0 +137,0 @@ }

core-scroll.jsx

@@ -5,3 +5,3 @@ import React from 'react'
 
-const DEFAULTS = {onChange: null}
+const DEFAULTS = {onChange: null, friction: null}
 
@@ -12,2 +12,3 @@ export default class Scroll extends React.Component {
     this.onScroll = this.onScroll.bind(this)
+    this.scrollTo = (options) => coreScroll(this.el, options)
     this.scrollUp = () => coreScroll(this.el, 'up')
@@ -20,3 +21,3 @@ this.scrollDown = () => coreScroll(this.el, 'down')
     this.el.addEventListener('scroll.change', this.onScroll)
-    coreScroll(this.el)
+    coreScroll(this.el, {friction: this.props.friction})
   }
@@ -23,0 +24,0 @@ componentDidUpdate () { coreScroll(this.el) }

core-scroll.md

@@ -9,4 +9,4 @@ ---
 ```scroll.html
-<button data-core-scroll="my-scroll-js" value="up" aria-label="Rull opp">&darr;</button>
-<button data-core-scroll="my-scroll-js" value="down" aria-label="Rull ned">&uarr;</button>
+<button data-core-scroll="my-scroll-js" value="up" aria-label="Rull opp">&uarr;</button>
+<button data-core-scroll="my-scroll-js" value="down" aria-label="Rull ned">&darr;</button>
 <br>
@@ -63,3 +63,3 @@ <button data-core-scroll="my-scroll-js" value="left" aria-label="Rull til venstre">&larr;</button>
       <div className="my-wrap">
-        <Scroll className="my-scroll" id={this.scrollId} onChange={(state) => this.setState(state)}>
+        <Scroll className="my-scroll" onChange={(state) => this.setState(state)}>
           <div>1</div><div>2</div><div>3</div><div>4</div><a href="#">5</a>
@@ -66,0 +66,0 @@ <div>6</div><div>7</div><div>8</div><div>9</div><div>10</div>

core-scroll.min.js

@@ -1,2 +0,2 @@
-!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,t=(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 o(e,o,n,r){void 0===r&&(r=!1),"undefined"==typeof window||window[e+"-"+o]||(t||"object"!=typeof r||(r=Boolean(r.capture)),document.addEventListener(window[e+"-"+o]=o,n,r))}var n="prevent_recursive_dispatch_maximum_callstack";function r(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 i,l,a,c,u={},d="data-core-scroll",f="data-@nrk/core-scroll-1.0.0".replace(/\W+/g,"-"),s={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},m=.95,p=20,v=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches,g=!e||window.requestAnimationFrame||window.setTimeout;function h(e,t){void 0===t&&(t="");var o="object"==typeof t?t:{move:t},n="x"in o||"y"in o||o.move;return r(e).map(function(e){if(!e.hasAttribute(f)){var t=e.offsetWidth-e.clientWidth,i=e.offsetHeight-e.clientHeight;e.setAttribute(f,""),e.style.overflow="scroll",e.style.willChange="scroll-position",e.style.webkitOverflowScrolling="touch",e.style.maxHeight="calc(100% + "+i+"px)",e.style.marginRight="-"+t+"px",e.style.marginBottom="-"+i+"px",x(e,"grab"),b({target:e})}return n&&E(e,function(e,t){var o=t.x,n=t.y,i=t.move,l={x:o,y:n,move:s[i]};"number"!=typeof l.x&&(l.x=e.scrollLeft);"number"!=typeof l.y&&(l.y=e.scrollTop);if(l.move){var a=l.move.x?"x":"y",c=l.move.x?"width":"height",u=l.move.x?"left":"top",d=e.getBoundingClientRect(),f=e["x"===a?"scrollLeft":"scrollTop"];r(e.children).every(function(e){var t=e.getBoundingClientRect();return l[a]=t[u]-d[u]+f,t[l.move.prop||i]<d[u]+d[c]*l.move[a]})}return l}(e,o)),e})}function y(e){u.diffX=u.pageX-(u.pageX=e.pageX),u.diffY=u.pageY-(u.pageY=e.pageY),u.target.scrollLeft=u.scrollX+=u.diffX,u.target.scrollTop=u.scrollY+=u.diffY}function w(e){document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",w),x(document.body,""),x(u.target,"grab"),E(u.target,{x:u.scrollX+u.diffX*p,y:u.scrollY+u.diffY*p})}function b(e){e.type;var t=e.target;if(t.hasAttribute&&t.hasAttribute(f)){var o={left:t.scrollLeft,up:t.scrollTop};o.right=t.scrollWidth-t.clientWidth-o.left,o.down=t.scrollTop-t.scrollHeight-o.right,function(e,t,o){void 0===o&&(o={});var r,i=""+n+t;!!e[i]||(e[i]=!0,"function"==typeof window.CustomEvent?r=new window.CustomEvent(t,{bubbles:!0,cancelable:!0,detail:o}):(r=document.createEvent("CustomEvent")).initCustomEvent(t,!0,!0,o),e.dispatchEvent(r),e[i]=null,r.defaultPrevented)}(t,"scroll.change",o),t.id&&r("["+d+"]").forEach(function(e){e.getAttribute(d)===t.id&&(e.disabled=!o[e.value])})}}function x(e,t){e.style.cursor="-webkit-"+t,e.style.cursor=t}function E(e,t){var o=t.x,n=t.y,r=u.animate=Math.floor(Date.now()*Math.random()).toString(16),i=Math.max(0,Math.min(o,e.scrollWidth-e.clientWidth)),l=Math.max(0,Math.min(n,e.scrollHeight-e.clientHeight)),a=v?1:i-e.scrollLeft,c=v?1:l-e.scrollTop,d=function(){u.animate===r&&(Math.round(a)||Math.round(c))&&(e.scrollLeft=i-Math.round(a*=m),e.scrollTop=l-Math.round(c*=m),g(d))};d()}return o(f,"mousedown",function(e){for(var t=e.target;t;t=t.parentElement)!e.defaultPrevented&&t.hasAttribute(f)&&(e.preventDefault(),u.pageX=e.pageX,u.pageY=e.pageY,u.scrollX=t.scrollLeft,u.scrollY=t.scrollTop,u.animate=u.diffX=u.diffY=0,u.target=t,x(t,"grabbing"),x(document.body,"grabbing"),document.addEventListener("mousemove",y),document.addEventListener("mouseup",w))}),o(f,"scroll",(i=b,l=500,function(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];var o=this,n=Date.now();a&&n<a+l?(clearTimeout(c),c=setTimeout(function(){a=n,i.apply(o,e)},l)):(a=n,i.apply(o,e))}),!0),o(f,"wheel",function(){return u.animate=!1},{passive:!0}),o(f,"click",function(e){for(var t=e.target;t;t=t.parentElement){var o=t.getAttribute(d);if(o)return h(document.getElementById(o),t.value)}}),h});
+!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,t=(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 o(e,o,n,r){void 0===r&&(r=!1),"undefined"==typeof window||window[e=e+"-"+o]||(t||"object"!=typeof r||(r=Boolean(r.capture)),("resize"===o?window:document).addEventListener(window[e]=o,n,r))}var n="prevent_recursive_dispatch_maximum_callstack";function r(e,t){var o,n;return function(){for(var r=[],i=arguments.length;i--;)r[i]=arguments[i];var l=this,a=Date.now();o&&a<o+t?(clearTimeout(n),n=setTimeout(function(){o=a,e.apply(l,r)},t)):(o=a,e.apply(l,r))}}function i(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 l={},a="data-core-scroll",c="data-@nrk/core-scroll-1.0.0".replace(/\W+/g,"-"),u={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},d=.8,f=20,s=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches,m=!e||window.requestAnimationFrame||window.setTimeout;function p(e,t){void 0===t&&(t="");var o="object"==typeof t?t:{move:t},n="x"in o||"y"in o||o.move;return i(e).map(function(e){if(!e.hasAttribute(c)){e.setAttribute(c,o.friction),e.style.overflow="scroll",e.style.willChange="scroll-position",e.style.webkitOverflowScrolling="touch";var t=e.offsetWidth-e.clientWidth,r=e.offsetHeight-e.clientHeight;e.style.maxHeight="calc(100% + "+r+"px)",e.style.marginRight="-"+t+"px",e.style.marginBottom="-"+r+"px",y(e,"grab"),h({target:e})}return n&&w(e,function(e,t){var o=t.x,n=t.y,r=t.move,l={x:o,y:n,move:u[r]};"number"!=typeof l.x&&(l.x=e.scrollLeft);"number"!=typeof l.y&&(l.y=e.scrollTop);if(l.move){var a=l.move.x?"x":"y",c=l.move.x?"width":"height",d=l.move.x?"left":"top",f=e.getBoundingClientRect(),s=e["x"===a?"scrollLeft":"scrollTop"];i(e.children).every(function(e){var t=e.getBoundingClientRect();return l[a]=t[d]-f[d]+s,t[l.move.prop||r]<f[d]+f[c]*l.move[a]})}return l}(e,o)),e})}function v(e){l.diffX=l.pageX-(l.pageX=e.pageX),l.diffY=l.pageY-(l.pageY=e.pageY),l.target.scrollLeft=l.scrollX+=l.diffX,l.target.scrollTop=l.scrollY+=l.diffY}function g(e){document.removeEventListener("mousemove",v),document.removeEventListener("mouseup",g),y(document.body,""),y(l.target,"grab"),w(l.target,{x:l.scrollX+l.diffX*f,y:l.scrollY+l.diffY*f})}function h(e){var t=e.target||e;if("resize"===e.type)return i("["+c+"]").forEach(h);if(t.hasAttribute&&t.hasAttribute(c)){var o={left:t.scrollLeft,up:t.scrollTop};o.right=t.scrollWidth-t.clientWidth-o.left,o.down=t.scrollTop-t.scrollHeight-o.right,function(e,t,o){void 0===o&&(o={});var r,i=""+n+t;!!e[i]||(e[i]=!0,"function"==typeof window.CustomEvent?r=new window.CustomEvent(t,{bubbles:!0,cancelable:!0,detail:o}):(r=document.createEvent("CustomEvent")).initCustomEvent(t,!0,!0,o),e.dispatchEvent(r),e[i]=null,r.defaultPrevented)}(t,"scroll.change",o),t.id&&i("["+a+"]").forEach(function(e){e.getAttribute(a)===t.id&&(e.disabled=!o[e.value])})}}function y(e,t){e.style.cursor="-webkit-"+t,e.style.cursor=t}function w(e,t){var o=t.x,n=t.y,r=Math.min(.99,e.getAttribute(c))||d,i=l.animate=Math.floor(Date.now()*Math.random()).toString(16),a=Math.max(0,Math.min(o,e.scrollWidth-e.clientWidth)),u=Math.max(0,Math.min(n,e.scrollHeight-e.clientHeight)),f=s?1:a-e.scrollLeft,p=s?1:u-e.scrollTop,v=function(){l.animate===i&&(Math.round(f)||Math.round(p))&&(e.scrollLeft=a-Math.round(f*=r),e.scrollTop=u-Math.round(p*=r),m(v))};v()}return o(c,"mousedown",function(e){for(var t=e.target;t;t=t.parentElement)!e.defaultPrevented&&t.hasAttribute(c)&&(e.preventDefault(),l.pageX=e.pageX,l.pageY=e.pageY,l.scrollX=t.scrollLeft,l.scrollY=t.scrollTop,l.animate=l.diffX=l.diffY=0,l.target=t,y(t,"grabbing"),y(document.body,"grabbing"),document.addEventListener("mousemove",v),document.addEventListener("mouseup",g))}),o(c,"resize",r(h,500)),o(c,"scroll",r(h,500),!0),o(c,"wheel",function(){return l.animate=!1},{passive:!0}),o(c,"click",function(e){for(var t=e.target;t;t=t.parentElement){var o=t.getAttribute(a);if(o)return p(document.getElementById(o),t.value)}}),p});
 //# sourceMappingURL=core-scroll.min.js.map

jsx/index.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):t.CoreScroll=e(t.React)}(this,function(t){"use strict";t=t&&t.hasOwnProperty("default")?t.default:t;var e="undefined"!=typeof window,o=(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 n(t,e,n,r){void 0===r&&(r=!1),"undefined"==typeof window||window[t+"-"+e]||(o||"object"!=typeof r||(r=Boolean(r.capture)),document.addEventListener(window[t+"-"+e]=e,n,r))}var r="prevent_recursive_dispatch_maximum_callstack";function i(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 l,c,a,s,u={},f="data-core-scroll",d="data-@nrk/core-scroll-1.0.0".replace(/\W+/g,"-"),p={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},h=.95,m=20,v=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches,g=!e||window.requestAnimationFrame||window.setTimeout;function y(t,e){void 0===e&&(e="");var o="object"==typeof e?e:{move:e},n="x"in o||"y"in o||o.move;return i(t).map(function(t){if(!t.hasAttribute(d)){var e=t.offsetWidth-t.clientWidth,r=t.offsetHeight-t.clientHeight;t.setAttribute(d,""),t.style.overflow="scroll",t.style.willChange="scroll-position",t.style.webkitOverflowScrolling="touch",t.style.maxHeight="calc(100% + "+r+"px)",t.style.marginRight="-"+e+"px",t.style.marginBottom="-"+r+"px",E(t,"grab"),x({target:t})}return n&&L(t,function(t,e){var o=e.x,n=e.y,r=e.move,l={x:o,y:n,move:p[r]};"number"!=typeof l.x&&(l.x=t.scrollLeft);"number"!=typeof l.y&&(l.y=t.scrollTop);if(l.move){var c=l.move.x?"x":"y",a=l.move.x?"width":"height",s=l.move.x?"left":"top",u=t.getBoundingClientRect(),f=t["x"===c?"scrollLeft":"scrollTop"];i(t.children).every(function(t){var e=t.getBoundingClientRect();return l[c]=e[s]-u[s]+f,e[l.move.prop||r]<u[s]+u[a]*l.move[c]})}return l}(t,o)),t})}function w(t){u.diffX=u.pageX-(u.pageX=t.pageX),u.diffY=u.pageY-(u.pageY=t.pageY),u.target.scrollLeft=u.scrollX+=u.diffX,u.target.scrollTop=u.scrollY+=u.diffY}function b(t){document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",b),E(document.body,""),E(u.target,"grab"),L(u.target,{x:u.scrollX+u.diffX*m,y:u.scrollY+u.diffY*m})}function x(t){t.type;var e=t.target;if(e.hasAttribute&&e.hasAttribute(d)){var o={left:e.scrollLeft,up:e.scrollTop};o.right=e.scrollWidth-e.clientWidth-o.left,o.down=e.scrollTop-e.scrollHeight-o.right,function(t,e,o){void 0===o&&(o={});var n,i=""+r+e;!!t[i]||(t[i]=!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),t.dispatchEvent(n),t[i]=null,n.defaultPrevented)}(e,"scroll.change",o),e.id&&i("["+f+"]").forEach(function(t){t.getAttribute(f)===e.id&&(t.disabled=!o[t.value])})}}function E(t,e){t.style.cursor="-webkit-"+e,t.style.cursor=e}function L(t,e){var o=e.x,n=e.y,r=u.animate=Math.floor(Date.now()*Math.random()).toString(16),i=Math.max(0,Math.min(o,t.scrollWidth-t.clientWidth)),l=Math.max(0,Math.min(n,t.scrollHeight-t.clientHeight)),c=v?1:i-t.scrollLeft,a=v?1:l-t.scrollTop,s=function(){u.animate===r&&(Math.round(c)||Math.round(a))&&(t.scrollLeft=i-Math.round(c*=h),t.scrollTop=l-Math.round(a*=h),g(s))};s()}n(d,"mousedown",function(t){for(var e=t.target;e;e=e.parentElement)!t.defaultPrevented&&e.hasAttribute(d)&&(t.preventDefault(),u.pageX=t.pageX,u.pageY=t.pageY,u.scrollX=e.scrollLeft,u.scrollY=e.scrollTop,u.animate=u.diffX=u.diffY=0,u.target=e,E(e,"grabbing"),E(document.body,"grabbing"),document.addEventListener("mousemove",w),document.addEventListener("mouseup",b))}),n(d,"scroll",(l=x,c=500,function(){for(var t=[],e=arguments.length;e--;)t[e]=arguments[e];var o=this,n=Date.now();a&&n<a+c?(clearTimeout(s),s=setTimeout(function(){a=n,l.apply(o,t)},c)):(a=n,l.apply(o,t))}),!0),n(d,"wheel",function(){return u.animate=!1},{passive:!0}),n(d,"click",function(t){for(var e=t.target;e;e=e.parentElement){var o=e.getAttribute(f);if(o)return y(document.getElementById(o),e.value)}});var M={onChange:null};return function(e){function o(t){var o=this;e.call(this,t),this.onScroll=this.onScroll.bind(this),this.scrollUp=function(){return y(o.el,"up")},this.scrollDown=function(){return y(o.el,"down")},this.scrollLeft=function(){return y(o.el,"left")},this.scrollRight=function(){return y(o.el,"right")}}return e&&(o.__proto__=e),o.prototype=Object.create(e&&e.prototype),o.prototype.constructor=o,o.prototype.componentDidMount=function(){this.el.addEventListener("scroll.change",this.onScroll),y(this.el)},o.prototype.componentDidUpdate=function(){y(this.el)},o.prototype.componentWillUnmount=function(){this.el.removeEventListener("scroll.change",this.onScroll)},o.prototype.onScroll=function(t){var e=t.detail;this.props.onChange&&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})},o.prototype.render=function(){var e=this,o=function(t,e,o){return void 0===o&&(o={}),Object.keys(t).reduce(function(o,n){return e.hasOwnProperty(n)||(o[n]=t[n]),o},o)}(this.props,M,{ref:function(t){return e.el=t}});return t.createElement("div",o,this.props.children)},o}(t.Component)});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):t.CoreScroll=e(t.React)}(this,function(t){"use strict";t=t&&t.hasOwnProperty("default")?t.default:t;var e="undefined"!=typeof window,o=(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 n(t,e,n,r){void 0===r&&(r=!1),"undefined"==typeof window||window[t=t+"-"+e]||(o||"object"!=typeof r||(r=Boolean(r.capture)),("resize"===e?window:document).addEventListener(window[t]=e,n,r))}var r="prevent_recursive_dispatch_maximum_callstack";function i(t,e){var o,n;return function(){for(var r=[],i=arguments.length;i--;)r[i]=arguments[i];var l=this,c=Date.now();o&&c<o+e?(clearTimeout(n),n=setTimeout(function(){o=c,t.apply(l,r)},e)):(o=c,t.apply(l,r))}}function l(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 c={},a="data-core-scroll",s="data-@nrk/core-scroll-1.0.0".replace(/\W+/g,"-"),u={up:{y:-1,prop:"top"},down:{y:1,prop:"bottom"},left:{x:-1},right:{x:1}},f=.8,d=20,p=e&&window.matchMedia&&window.matchMedia("(prefers-reduced-motion)").matches,h=!e||window.requestAnimationFrame||window.setTimeout;function m(t,e){void 0===e&&(e="");var o="object"==typeof e?e:{move:e},n="x"in o||"y"in o||o.move;return l(t).map(function(t){if(!t.hasAttribute(s)){t.setAttribute(s,o.friction),t.style.overflow="scroll",t.style.willChange="scroll-position",t.style.webkitOverflowScrolling="touch";var e=t.offsetWidth-t.clientWidth,r=t.offsetHeight-t.clientHeight;t.style.maxHeight="calc(100% + "+r+"px)",t.style.marginRight="-"+e+"px",t.style.marginBottom="-"+r+"px",w(t,"grab"),y({target:t})}return n&&b(t,function(t,e){var o=e.x,n=e.y,r=e.move,i={x:o,y:n,move:u[r]};"number"!=typeof i.x&&(i.x=t.scrollLeft);"number"!=typeof i.y&&(i.y=t.scrollTop);if(i.move){var c=i.move.x?"x":"y",a=i.move.x?"width":"height",s=i.move.x?"left":"top",f=t.getBoundingClientRect(),d=t["x"===c?"scrollLeft":"scrollTop"];l(t.children).every(function(t){var e=t.getBoundingClientRect();return i[c]=e[s]-f[s]+d,e[i.move.prop||r]<f[s]+f[a]*i.move[c]})}return i}(t,o)),t})}function v(t){c.diffX=c.pageX-(c.pageX=t.pageX),c.diffY=c.pageY-(c.pageY=t.pageY),c.target.scrollLeft=c.scrollX+=c.diffX,c.target.scrollTop=c.scrollY+=c.diffY}function g(t){document.removeEventListener("mousemove",v),document.removeEventListener("mouseup",g),w(document.body,""),w(c.target,"grab"),b(c.target,{x:c.scrollX+c.diffX*d,y:c.scrollY+c.diffY*d})}function y(t){var e=t.target||t;if("resize"===t.type)return l("["+s+"]").forEach(y);if(e.hasAttribute&&e.hasAttribute(s)){var o={left:e.scrollLeft,up:e.scrollTop};o.right=e.scrollWidth-e.clientWidth-o.left,o.down=e.scrollTop-e.scrollHeight-o.right,function(t,e,o){void 0===o&&(o={});var n,i=""+r+e;!!t[i]||(t[i]=!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),t.dispatchEvent(n),t[i]=null,n.defaultPrevented)}(e,"scroll.change",o),e.id&&l("["+a+"]").forEach(function(t){t.getAttribute(a)===e.id&&(t.disabled=!o[t.value])})}}function w(t,e){t.style.cursor="-webkit-"+e,t.style.cursor=e}function b(t,e){var o=e.x,n=e.y,r=Math.min(.99,t.getAttribute(s))||f,i=c.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=p?1:l-t.scrollLeft,d=p?1:a-t.scrollTop,m=function(){c.animate===i&&(Math.round(u)||Math.round(d))&&(t.scrollLeft=l-Math.round(u*=r),t.scrollTop=a-Math.round(d*=r),h(m))};m()}n(s,"mousedown",function(t){for(var e=t.target;e;e=e.parentElement)!t.defaultPrevented&&e.hasAttribute(s)&&(t.preventDefault(),c.pageX=t.pageX,c.pageY=t.pageY,c.scrollX=e.scrollLeft,c.scrollY=e.scrollTop,c.animate=c.diffX=c.diffY=0,c.target=e,w(e,"grabbing"),w(document.body,"grabbing"),document.addEventListener("mousemove",v),document.addEventListener("mouseup",g))}),n(s,"resize",i(y,500)),n(s,"scroll",i(y,500),!0),n(s,"wheel",function(){return c.animate=!1},{passive:!0}),n(s,"click",function(t){for(var e=t.target;e;e=e.parentElement){var o=e.getAttribute(a);if(o)return m(document.getElementById(o),e.value)}});var x={onChange:null,friction:null};return function(e){function o(t){var o=this;e.call(this,t),this.onScroll=this.onScroll.bind(this),this.scrollTo=function(t){return m(o.el,t)},this.scrollUp=function(){return m(o.el,"up")},this.scrollDown=function(){return m(o.el,"down")},this.scrollLeft=function(){return m(o.el,"left")},this.scrollRight=function(){return m(o.el,"right")}}return e&&(o.__proto__=e),o.prototype=Object.create(e&&e.prototype),o.prototype.constructor=o,o.prototype.componentDidMount=function(){this.el.addEventListener("scroll.change",this.onScroll),m(this.el,{friction:this.props.friction})},o.prototype.componentDidUpdate=function(){m(this.el)},o.prototype.componentWillUnmount=function(){this.el.removeEventListener("scroll.change",this.onScroll)},o.prototype.onScroll=function(t){var e=t.detail;this.props.onChange&&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})},o.prototype.render=function(){var e=this,o=function(t,e,o){return void 0===o&&(o={}),Object.keys(t).reduce(function(o,n){return e.hasOwnProperty(n)||(o[n]=t[n]),o},o)}(this.props,x,{ref:function(t){return e.el=t}});return t.createElement("div",o,this.props.children)},o}(t.Component)});
 //# sourceMappingURL=index.js.map

package.json

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

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

57870

increased by4.32%

Lines of code

208

increased by4%

No dependency changes