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