scroll-padlock
Version:
Locks elements scroll handling scrollbar gaps and iOS Safari with CSS variables
3 lines (2 loc) • 11.5 kB
JavaScript
function ownKeys(e,t){var l=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),l.push.apply(l,i)}return l}function _objectSpread(e){for(var t=1;t<arguments.length;t++){var l=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(l),!0).forEach((function(t){_defineProperty(e,t,l[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(l)):ownKeys(Object(l)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(l,t))}))}return e}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,t){for(var l=0;l<t.length;l++){var i=t[l];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function _createClass(e,t,l){return t&&_defineProperties(e.prototype,t),l&&_defineProperties(e,l),e}function _classPrivateFieldGet(e,t){return _classApplyDescriptorGet(e,_classExtractFieldDescriptor(e,t,"get"))}function _classApplyDescriptorGet(e,t){return t.get?t.get.call(e):t.value}function _classPrivateFieldSet(e,t,l){return _classApplyDescriptorSet(e,_classExtractFieldDescriptor(e,t,"set"),l),l}function _classExtractFieldDescriptor(e,t,l){if(!t.has(e))throw new TypeError("attempted to "+l+" private field on non-instance");return t.get(e)}function _classApplyDescriptorSet(e,t,l){if(t.set)t.set.call(e,l);else{if(!t.writable)throw new TypeError("attempted to set read only private field");t.value=l}}function _defineProperty(e,t,l){return t in e?Object.defineProperty(e,t,{value:l,enumerable:!0,configurable:!0,writable:!0}):e[t]=l,e}System.register("ScrollPadlock",[],(function(e){"use strict";return{execute:function(){var t=window,l=document,i=l.documentElement,r=l.body,a=l.head,s="-",n="scroll",c="resize",o="Width",d="Height",v="Left",u="add",h="remove",_="scroll-padlock",P="data-scroll-padlock",p=function(e){return e.toLowerCase()},f=p("Top"),F=p(v),w=p(o),y=p(d),G="outerWidth",b="outerHeight",k="innerWidth",g="innerHeight",W="scrollWidth",M="scrollHeight",m="scrollbarWidth",S="scrollbarHeight",O="--scroll-padlock-scroll-"+f,j="--scroll-padlock-scroll-"+F,E="--scroll-padlock-scrollbar-"+w,H="--scroll-padlock-scrollbar-"+y,D="--scroll-padlock-outer-"+w,C="--scroll-padlock-outer-"+y,T="--scroll-padlock-inner-"+w,A="--scroll-padlock-inner-"+y,x="--scroll-padlock-scroll-"+w,L="--scroll-padlock-scroll-"+y,I=function(e,t,l,i){var r=!(arguments.length>4&&void 0!==arguments[4])||arguments[4];return null==t?void 0:t["".concat(e,"EventListener")](l,i,r)},R=t.clearImmediate||t.clearTimeout,K=t.setImmediate||t.setTimeout,z=function(e){var t;return function(){for(var l=arguments.length,i=new Array(l),r=0;r<l;r++)i[r]=arguments[r];R(t),t=K((function(){return e.apply(null,i)}))}},X=function(e,t){var l,i,r,a,s,n,c,o,d,v,u,h=(_defineProperty(l={},w,null==t?void 0:t.innerWidth),_defineProperty(l,y,null==t?void 0:t.innerHeight),l);h[w]||h[y]||(h=null!==(u=null==e?void 0:e.getBoundingClientRect())&&void 0!==u?u:{});var _=null!==(i=null===(r=h)||void 0===r?void 0:r[w])&&void 0!==i?i:0,P=null!==(a=null===(s=h)||void 0===s?void 0:s[y])&&void 0!==a?a:0,p=null!==(n=null==e?void 0:e.clientWidth)&&void 0!==n?n:0,f=null!==(c=null==e?void 0:e.clientHeight)&&void 0!==c?c:0;return _defineProperty(v={},G,_),_defineProperty(v,b,P),_defineProperty(v,k,Math.min(_,p)),_defineProperty(v,g,Math.min(P,f)),_defineProperty(v,W,null!==(o=null==e?void 0:e.scrollWidth)&&void 0!==o?o:0),_defineProperty(v,M,null!==(d=null==e?void 0:e.scrollHeight)&&void 0!==d?d:0),_defineProperty(v,m,Math.max(0,_-p)),_defineProperty(v,S,Math.max(0,P-f)),v},Y=function(e){var t,l,i,r,a,s,n;return _defineProperty(n={},f,null!==(t=null!==(l=null!==(i=null==e?void 0:e.scrollY)&&void 0!==i?i:null==e?void 0:e.pageYOffset)&&void 0!==l?l:null==e?void 0:e.scrollTop)&&void 0!==t?t:0),_defineProperty(n,F,null!==(r=null!==(a=null!==(s=null==e?void 0:e.scrollX)&&void 0!==s?s:null==e?void 0:e.pageXOffset)&&void 0!==a?a:null==e?void 0:e.scrollLeft)&&void 0!==r?r:0),n},B=function(e){var t;return null!==(t=null==e?void 0:e.parentElement)&&void 0!==t?t:null},q=function(e,t,l,i,r){var a,n,c;null!=l&&l.contains(t)||!t||l.appendChild(t);var o=null!==(a=null==e?void 0:e.getAttribute(P))&&void 0!==a?a:function(e){for(var t=-1;e;)t++,e=B(e);return t}(e)+s+function(e){for(var t,l,i=null!==(t=null===(l=B(e))||void 0===l?void 0:l.children)&&void 0!==t?t:[],r=0,a=0,s=i.length;a<s;a++){if(i[a]===e)return r;r++}return r}(e);null==e||e.setAttribute(P,o);var d=(null!=t?t:{}).sheet;null!=d&&null!==(n=d.cssRules)&&void 0!==n&&n[0]&&d.deleteRule(0);for(var v=(_defineProperty(c={},O,r[f]),_defineProperty(c,j,r[F]),_defineProperty(c,D,i.outerWidth),_defineProperty(c,C,i.outerHeight),_defineProperty(c,T,i.innerWidth),_defineProperty(c,A,i.innerHeight),_defineProperty(c,x,i.scrollWidth),_defineProperty(c,L,i.scrollHeight),_defineProperty(c,E,i.scrollbarWidth),_defineProperty(c,H,i.scrollbarHeight),c),u=Object.keys(v),h="",_=0,p=u.length;_<p;_++){var w=u[_];h+="".concat(w,": ").concat(v[w],"px;")}return null==d||d.insertRule("[".concat(P,'="').concat(o,'"] { ').concat(h," }"),0),t},J=function(e,t){return null==t||t.remove(),null==e||e.removeAttribute(P),t},N=function(e,t,l,i,r,a){var s;return(s={},_defineProperty(s,u,q),_defineProperty(s,h,J),s)[e](t,l,i,r,a)},Q=new WeakMap,U=i,V="".concat(_,"-locked"),Z=new WeakMap,$=new WeakMap,ee=new WeakMap,te=new WeakMap,le=new WeakMap,ie=new WeakMap,re=new WeakMap,ae=new WeakMap,se=new WeakMap,ne=new WeakMap,ce=new WeakMap,oe=new WeakMap,de=new WeakMap,ve=new WeakMap,ue=new WeakMap,he=new WeakMap,_e=new WeakMap,Pe=new WeakMap,pe=new WeakMap,fe=new WeakMap,Fe=new WeakMap,we=new WeakMap,ye=new WeakMap,Ge=new WeakMap,be=new WeakMap,ke=new WeakMap,ge=function(){function e(){var s,o,d,v=this,_=arguments.length>0&&void 0!==arguments[0]?arguments[0]:U,P=arguments.length>1&&void 0!==arguments[1]?arguments[1]:V;_classCallCheck(this,e),_e.set(this,{get:We,set:void 0}),Z.set(this,{writable:!0,value:U}),$.set(this,{writable:!0,value:r}),ee.set(this,{writable:!0,value:window}),te.set(this,{writable:!0,value:void 0}),le.set(this,{writable:!0,value:V}),ie.set(this,{writable:!0,value:void 0}),re.set(this,{writable:!0,value:void 0}),ae.set(this,{writable:!0,value:void 0}),se.set(this,{writable:!0,value:void 0}),ne.set(this,{writable:!0,value:!1}),ce.set(this,{writable:!0,value:(d="MutationObserver",d in t?new t.MutationObserver((function(){var e=_classPrivateFieldGet(v,ie);_classPrivateFieldGet(v,pe).call(v),_classPrivateFieldGet(v,ie)!==e&&(_classPrivateFieldGet(v,ie)?_classPrivateFieldSet(v,ae,_objectSpread({},_classPrivateFieldGet(v,re))):_classPrivateFieldGet(v,Pe).call(v,_classPrivateFieldGet(v,ae)))})):null)}),oe.set(this,{writable:!0,value:l.createElement("style")}),de.set(this,{writable:!0,value:z((function(){_classPrivateFieldGet(v,fe).call(v,_classPrivateFieldGet(v,Fe)),_classPrivateFieldGet(v,ye).call(v)}))}),ve.set(this,{writable:!0,value:z((function(){_classPrivateFieldGet(v,fe).call(v,_classPrivateFieldGet(v,we)),_classPrivateFieldGet(v,ye).call(v)}))}),ue.set(this,{writable:!0,value:(s={},_defineProperty(s,c,h),_defineProperty(s,n,h),s)}),he.set(this,{writable:!0,value:(o={},_defineProperty(o,c,_classPrivateFieldGet(this,de)),_defineProperty(o,n,_classPrivateFieldGet(this,ve)),o)}),Pe.set(this,{writable:!0,value:function(e){return _classPrivateFieldGet(v,ee).scrollTo(e[F],e[f])}}),pe.set(this,{writable:!0,value:function(){var e;return _classPrivateFieldSet(v,ie,!(null===(e=_classPrivateFieldGet(v,te))||void 0===e||!e.contains(_classPrivateFieldGet(v,le))))}}),fe.set(this,{writable:!0,value:function(e){var t,l=_classPrivateFieldGet(v,ie);_classPrivateFieldGet(v,be).call(v),null===(t=_classPrivateFieldGet(v,te))||void 0===t||t.remove(_classPrivateFieldGet(v,le));var i,r=e();l&&(null===(i=_classPrivateFieldGet(v,te))||void 0===i||i.add(_classPrivateFieldGet(v,le)));return _classPrivateFieldGet(v,Ge).call(v),r}}),Fe.set(this,{writable:!0,value:function(){return _classPrivateFieldSet(v,se,X(_classPrivateFieldGet(v,Z),_classPrivateFieldGet(v,ee)))}}),we.set(this,{writable:!0,value:function(){return _classPrivateFieldSet(v,re,Y(_classPrivateFieldGet(v,ee)))}}),ye.set(this,{writable:!0,value:function(){return N(u,_classPrivateFieldGet(v,$),_classPrivateFieldGet(v,oe),a,v.layout,v.scroll)}}),Ge.set(this,{writable:!0,value:function(){var e;return _classPrivateFieldGet(v,ne)?_classPrivateFieldGet(v,ne):(null===(e=_classPrivateFieldGet(v,ce))||void 0===e||e.observe(_classPrivateFieldGet(v,$),{attributes:!0,attributeFilter:["class"],childList:!1,characterData:!1}),_classPrivateFieldSet(v,ne,!!_classPrivateFieldGet(v,ce)))}}),be.set(this,{writable:!0,value:function(){var e;return _classPrivateFieldGet(v,ne)?(null===(e=_classPrivateFieldGet(v,ce))||void 0===e||e.disconnect(),_classPrivateFieldSet(v,ne,!1)):_classPrivateFieldGet(v,ne)}}),ke.set(this,{writable:!0,value:function(e,t){var l=_classPrivateFieldGet(v,ue)[e];return!(!_classPrivateFieldGet(v,Z)||!l||l===t)&&(_classPrivateFieldGet(v,ue)[e]=t,I(t,_classPrivateFieldGet(v,_e)[e],e,_classPrivateFieldGet(v,he)[e]),!0)}});var p=_===t,w=_ instanceof HTMLElement;if(!p&&!w)throw new TypeError("Invalid element provided to constructor");w&&_classPrivateFieldSet(this,$,_);var y=p||_===i||_===r;if(y||_classPrivateFieldSet(this,Z,_classPrivateFieldSet(this,$,_classPrivateFieldSet(this,ee,_))),Q.has(_classPrivateFieldGet(this,Z)))throw new Error("An instance has already been initialized on ".concat(y?"page scroll":"the given element"));Q.set(_classPrivateFieldGet(this,Z),this),_classPrivateFieldSet(this,te,_classPrivateFieldGet(this,$).classList);var G="string"==typeof P&&!!P.length;if(!G)throw new TypeError("Invalid CSS class name provided to constructor");_classPrivateFieldSet(this,le,P),this.update(),_classPrivateFieldGet(this,Ge).call(this),_classPrivateFieldGet(this,ke).call(this,c,u),_classPrivateFieldGet(this,ke).call(this,n,u)}return _createClass(e,[{key:"scroll",get:function(){return _classPrivateFieldGet(this,ie)?_classPrivateFieldGet(this,ae):_classPrivateFieldGet(this,re)},set:function(e){_classPrivateFieldGet(this,ie)?_classPrivateFieldSet(this,ae,e):_classPrivateFieldGet(this,Pe).call(this,e)}},{key:"layout",get:function(){return _classPrivateFieldGet(this,se)}},{key:"unlisten",value:function(e){_classPrivateFieldGet(this,ke).call(this,e,h)}},{key:"listen",value:function(e){_classPrivateFieldGet(this,ke).call(this,e,u)}},{key:"destroy",value:function(){_classPrivateFieldGet(this,be).call(this),N(h,_classPrivateFieldGet(this,Z),_classPrivateFieldGet(this,oe)),_classPrivateFieldGet(this,ke).call(this,c,h),_classPrivateFieldGet(this,ke).call(this,n,h),Q.delete(_classPrivateFieldGet(this,Z)),_classPrivateFieldSet(this,Z,_classPrivateFieldSet(this,$,_classPrivateFieldSet(this,ee,_classPrivateFieldSet(this,ce,_classPrivateFieldSet(this,oe,_classPrivateFieldSet(this,te,null))))))}},{key:"update",value:function(){var e=this;_classPrivateFieldGet(this,pe).call(this),_classPrivateFieldGet(this,fe).call(this,(function(){_classPrivateFieldGet(e,Fe).call(e),_classPrivateFieldGet(e,we).call(e)})),_classPrivateFieldGet(this,ye).call(this)}}]),e}();function We(){var e;return _defineProperty(e={},c,t),_defineProperty(e,n,_classPrivateFieldGet(this,ee)),e}e("default",ge)}}}));
//# sourceMappingURL=scroll-padlock.min.js.map