mirror of
https://github.com/tenrok/OverlayScrollbars.git
synced 2026-06-18 20:30:36 +03:00
Rene
1 line
14 KiB
JavaScript
1 line
14 KiB
JavaScript
const t=Node.ELEMENT_NODE,{toString:e,hasOwnProperty:n}=Object.prototype;function o(t){return void 0===t}function r(t){return null===t}const s=t=>o(t)||r(t)?""+t:e.call(t).replace(/^\[object (.+)\]$/,"$1").toLowerCase();function i(t){return"number"==typeof t}function c(t){return"string"==typeof t}function l(t){return"function"==typeof t}function a(t){return Array.isArray(t)}function d(t){return"object"==typeof t&&!a(t)&&!r(t)}function u(t){const e=!!t&&t.length,n=i(e)&&e>-1&&e%1==0;return!!(a(t)||!l(t)&&n)&&(!(e>0&&d(t))||e-1 in t)}function v(t){if(!t||!d(t)||"object"!==s(t))return!1;let e;const r=t.constructor,i=r&&r.prototype,c=n.call(t,"constructor"),l=i&&n.call(i,"isPrototypeOf");if(r&&!c&&!l)return!1;for(e in t);return o(e)||n.call(t,e)}function f(e){const n=window.Element;return!!e&&(n?e instanceof n:e.nodeType===t)}function h(t,e,n,r){if(o(r))return n?n[t]:e;n&&(n[t]=r)}function _(t,e,n){if(o(n))return t?t.getAttribute(e):null;t&&t.setAttribute(e,n)}const p=(t,e)=>{t&&t.removeAttribute(e)};function w(t,e){return h("scrollLeft",0,t,e)}function b(t,e){return h("scrollTop",0,t,e)}function g(t,e){if(u(t))for(let n=0;n<t.length&&!1!==e(t[n],n,t);n++);else t&&g(Object.keys(t),n=>e(t[n],n,t));return t}const m=(t,e,n)=>(n||c(e)||!u(e)?t.push(e):Array.prototype.push.apply(t,e),t),y=t=>{if(Array.from)return Array.from(t);const e=[];return g(t,t=>{m(e,t)}),e},x=t=>t&&0===t.length,z=(t,e)=>{const n=t=>t&&t(e);t instanceof Set?t.forEach(n):g(t,n)},O=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),S=t=>t?Object.keys(t):[];function A(t,e,n,o,s,i,c){const d=[e,n,o,s,i,c];return"object"==typeof t&&!r(t)||l(t)||(t={}),g(d,e=>{g(S(e),n=>{const o=e[n];if(t===o)return!0;const r=a(o);if(o&&(v(o)||r)){const e=t[n];let s=e;r&&!a(e)?s=[]:r||v(e)||(s={}),t[n]=A(s,o)}else t[n]=o})}),t}function C(t){for(const e in t)return!1;return!0}const j=/[^\x20\t\r\n\f]+/g,M=(t,e)=>{((t,e,n)=>{let o,r=0,s=!1;if(t&&c(e)){const i=e.match(j)||[];for(s=i.length>0;o=i[r++];)s=!!n(t.classList,o)&&s}})(t,e,(t,e)=>t.add(e))},$=Element.prototype,L=(t,e)=>{const n=[],o=e?f(e)?e:null:document;return o?m(n,o.querySelectorAll(t)):n},T=(t,e)=>{if(f(t)){return($.matches||$.msMatchesSelector).call(t,e)}return!1},V=t=>t?y(t.childNodes):[],k=(t,e,n)=>{if(n){let o,r=e;t&&(u(n)?(o=document.createDocumentFragment(),g(n,t=>{t===r&&(r=t.previousSibling),o.appendChild(t)})):o=n,e&&(r?r!==e&&(r=r.nextSibling):r=t.firstChild),t.insertBefore(o,r))}},q=(t,e)=>{k(t,null,e)},E=(t,e)=>{k(t,t&&t.firstChild,e)},N=t=>{if(u(t))g(y(t),t=>N(t));else if(t){const n=(e=t)?e.parentElement:null;n&&n.removeChild(t)}var e},F=t=>{const e=document.createElement("div");return t&&_(e,"class",t),e},P=t=>{const e=F();return e.innerHTML=t.trim(),g(V(e),t=>N(t))},I={w:0,h:0},U=()=>({w:window.innerWidth,h:window.innerHeight}),B=t=>t?{w:t.offsetWidth,h:t.offsetHeight}:I;let Y;const D=t=>t.split(" "),G=(t,e,n,o)=>{g(D(e),e=>{t.removeEventListener(e,n,o)})},J=(t,e,n,r)=>{const s=(()=>{if(o(Y)){Y=!1;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get:function(){Y=!0}}))}catch(t){}}return Y})(),i=s&&r&&r.o||!1,c=r&&r.s||!1,l=r&&r.u||!1,a=[],d=s?{passive:i,capture:c}:c;return g(D(e),e=>{const o=l?r=>{t.removeEventListener(e,o,c),n&&n(r)}:n;m(a,G.bind(null,t,e,o,c)),t.addEventListener(e,o,d)}),z.bind(0,a)},K=t=>t.stopPropagation(),R=t=>t.preventDefault(),W=(t,e,n)=>{if(t&&e){let o=!0;return g(n,n=>{t[n]!==e[n]&&(o=!1)}),o}return!1},X=(t,e)=>W(t,e,["w","h"]),H=(t,e)=>W(t,e,["x","y"]),Q=(t,e)=>W(t,e,["t","r","b","l"]),Z=t=>t.charAt(0).toUpperCase()+t.slice(1),tt=["-webkit-","-moz-","-o-","-ms-"],et=["WebKit","Moz","O","MS","webkit","moz","o","ms"],nt={},ot={},rt=t=>{let e=ot[t];if(O(ot,t))return e;const n=Z(t),o=F().style;return g(tt,r=>{const s=r.replace(/-/g,""),i=[t,r+t,s+n,Z(s)+n];return e=i.find(t=>void 0!==o[t]),!e}),ot[t]=e,e},st=t=>{let e=nt[t]||window[t];return O(nt,t)||(g(et,n=>(e=e||window[n+Z(t)],!e)),nt[t]=e),e},it=st("MutationObserver"),ct=st("IntersectionObserver"),lt=st("ResizeObserver"),at=st("cancelAnimationFrame"),dt=st("requestAnimationFrame"),ut=()=>{},vt=(t,e,n)=>{let o,r;const s=i(e)&&e>0,c=i(n)&&n>0,l=s?window.clearTimeout:at,a=s?window.setTimeout:dt,d=function(e){r=c?performance.now():0,o&&l(o),t.apply(this,e)};return function(){const t=d.bind(this,arguments),s=!!c&&performance.now()-r>=n;o&&l(o),o=s?t():a(t,e)}},ft={animationiterationcount:1,columncount:1,fillopacity:1,flexgrow:1,flexshrink:1,fontweight:1,lineheight:1,opacity:1,order:1,orphans:1,widows:1,zindex:1,zoom:1},ht=(t,e)=>{const n=e?parseFloat(t):parseInt(t,10);return Number.isNaN(n)?0:n},_t=(t,e,n)=>null!=e?e.getPropertyValue(n):t.style[n],pt=(t,e,n)=>{try{t&&void 0!==t.style[e]&&(t.style[e]=((t,e)=>!ft[t.toLowerCase()]&&i(e)?e+"px":e)(e,n))}catch(o){}};function wt(t,e){const n=c(e);if(a(e)||n){let o=n?"":{};if(t){const r=window.getComputedStyle(t,null);o=n?_t(t,r,e):e.reduce((e,n)=>(e[n]=_t(t,r,n),e),o)}return o}g(S(e),n=>pt(t,n,e[n]))}const bt={x:0,y:0},gt=t=>{const e=t?(t=>t.getBoundingClientRect())(t):0;return e?{x:e.left+window.pageYOffset,y:e.top+window.pageXOffset}:bt},mt=(t,e)=>{const{v:n,_:o,p:r}=e||{};let s,i=o;return(e,o)=>{const c=i,l=t?t(o,i,s):o,a=e||(n?!n(c,l):c!==l);return(a||r)&&(i=l,s=c),{g:i,m:s,O:a}}};var yt=function(t){var e={exports:{}};return t(e,e.exports),e.exports}((function(t){function e(){return t.exports=e=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return t},e.apply(this,arguments)}t.exports=e}));const{stringify:xt}=JSON,zt=["__TPL_","_TYPE__"],Ot=["boolean","number","string","array","object","function","null"].reduce((t,e)=>(t[e]=zt[0]+e+zt[1],t),{}),St=(t,e,n,r,i)=>{const l={},d=yt({},t);return g(S(e).filter(e=>O(t,e)),u=>{const f=o(n[u])?{}:n[u],h=t[u],_=e[u],p=v(_),w=i?i+".":"";if(p&&v(h)){const t=St(h,_,f,r,w+u);l[u]=t.S,d[u]=t.A,g([d,l],t=>{C(t[u])&&delete t[u]})}else if(!p){let t=!1;const e=[],n=[],i=s(h);if(g(a(_)?_:[_],r=>{let s;g(Ot,(t,e)=>{t===r&&(s=e)});const l=o(s);if(l&&c(h)){const n=r.split(" ");t=!!n.find(t=>t===h),m(e,n)}else t=Ot[i]===r;return m(n,l?Ot.string:s),!t}),t){(a(h)||v(h)?xt(h)!==xt(f):h!==f)&&(l[u]=h)}else r&&console.warn(`The option "${w}${u}" wasn't set, because it doesn't accept the type [ ${i.toUpperCase()} ] with the value of "${h}".\r\nAccepted types are: [ ${n.join(", ").toUpperCase()} ].\r\n${e.length>0?`\r\nValid strings are: [ ${e.join(", ")} ].`:""}`);delete d[u]}}),{A:d,S:l}},At=(t,e,n,o)=>St(t,e,n||{},o||!1);let Ct;const{abs:jt,round:Mt}=Math,$t=(t,e)=>{q(t,e);const n=(o=e)?{w:o.clientWidth,h:o.clientHeight}:I;var o;const r=B(e);return{x:r.h-n.h,y:r.w-n.w}},Lt=t=>{let e=!1;M(t,"os-viewport-scrollbar-styled");try{e="none"===wt(t,"scrollbar-width")||"none"===window.getComputedStyle(t,"::-webkit-scrollbar").getPropertyValue("display")}catch(n){}return e},Tt=(t,e)=>{wt(t,{overflowX:"hidden",overflowY:"hidden",direction:"rtl"}),w(t,0);const n=gt(t),o=gt(e);w(t,-999);const r=gt(e);return{i:n.x===o.x,n:o.x!==r.x}},Vt=(t,e)=>{M(t,"os-environment-flexbox-glue");const n=B(t),o=B(e),r=X(o,n);M(t,"os-environment-flexbox-glue-max");const s=B(t),i=B(e),c=X(i,s);return r&&c},kt=()=>{const t=window.screen.deviceXDPI||0,e=window.screen.logicalXDPI||1;return window.devicePixelRatio||t/e},qt=()=>{const{body:t}=document,e=P('<div class="os-environment"><div></div></div>')[0],n=e.firstChild,o=new Set,r=$t(t,e),s={x:0===r.x,y:0===r.y},i={C:!1,j:r,M:s,$:Lt(e),L:Tt(e,n),T:Vt(e,n),V(t){o.add(t)},k(t){o.delete(t)}};if(p(e,"style"),p(e,"class"),N(e),!s.x||!s.y){let n=U(),s=kt(),i=r;window.addEventListener("resize",()=>{if(o.size){const r=U(),c={w:r.w-n.w,h:r.h-n.h};if(0===c.w&&0===c.h)return;const l={w:jt(c.w),h:jt(c.h)},a={w:jt(Mt(r.w/(n.w/100))),h:jt(Mt(r.h/(n.h/100)))},d=kt(),u=l.w>2&&l.h>2,v=!((t,e)=>{const n=jt(t),o=jt(e);return!(n===o||n+1===o||n-1===o)})(a.w,a.h),f=d!==s&&s>0;if(u&&v&&f){const n=Ct.j=$t(t,e);N(e),i.x===n.x&&i.y===n.y||z(o),i=n}n=r,s=d}})}return i},Et=()=>(Ct||(Ct=qt()),Ct),Nt=(t,e)=>t&&e.split(".").reduce((t,e)=>t&&O(t,e)?t[e]:void 0,t),Ft=(t,e,n)=>{const{q:o,N:r}=function t(e){const n={q:{},N:{}};return g(S(e),o=>{const r=e[o];if(a(r))n.q[o]=r[1],n.N[o]=r[0];else{const e=t(r);n.q[o]=e.q,n.N[o]=e.N}}),n}(t),s=A({},r,At(e||{},o,null,!0).S),i=t=>{const{F:e,P:o}=t;n(!!e,t=>({g:Nt(s,t),O:e||void 0!==Nt(o,t)}))};return i({F:!0}),{N(t){if(t){const{S:e}=At(t,o,s,!0);C(e)||(A(s,e),i({P:e}))}return s},I:t=>{i({F:t})}}},Pt={paddingAbsolute:[!1,Ot.boolean],overflowBehavior:{x:["scroll","visible-hidden visible-scroll scroll hidden"],y:["scroll","visible-hidden visible-scroll scroll hidden"]}},It=rt("margin-inline-end"),Ut=rt("border-inline-end"),Bt=(t,e)=>{const{host:n,padding:o,viewport:r,content:s}=t,i=[],c=Et(),l=c.M,a=c.$,d=(c.T,It&&Ut||a||l.y,mt(()=>((t,e)=>{const n=e||"",o=n+"-top",r=n+"-right",s=n+"-bottom",i=n+"-left",c=wt(t,[o,r,s,i]);return{t:ht(c[o]),r:ht(c[r]),b:ht(c[s]),l:ht(c[i])}})(n,"padding"),{v:Q})),u=mt(t=>({x:Math.max(0,Math.round(100*(t.U.w-t.B.w))/100),y:Math.max(0,Math.round(100*(t.U.h-t.B.h))/100)}),{v:H}),{N:v,I:f}=Ft(Pt,e,(t,e)=>{const{g:n,O:r}=e("paddingAbsolute"),{g:i,O:c}=d(t);if(r||c){const t={t:0,r:0,b:0,l:0};n||(t.t=-i.t,t.r=-(i.r+i.l),t.b=-(i.b+i.t),t.l=-i.l),wt(o,{top:t.t,left:t.l,"margin-right":t.r,"margin-bottom":t.b,"max-width":`calc(100% + ${-1*t.r}px)`})}const l=B(o),a=B(s),v=(f=s)?{w:f.scrollWidth,h:f.scrollHeight}:I;var f;const h=u(t,{U:v,B:{w:l.w+Math.max(0,a.w-v.w),h:l.h+Math.max(0,a.h-v.h)}}),{g:_,O:p}=h;console.log("overflowAmount",_),console.log("overflowAmountChanged",p)});return{N:v,I:f,Y:()=>{f()},D:(t,e)=>{const{O:n,g:o}=e;n&&wt(s,{height:o?"auto":"100%"})},G(){z(i)}}},Yt=t=>wt(t,"direction"),Dt=t=>t&&(t.height>0||t.width>0),Gt=(t,e,n)=>{const{J:o=!1,K:r=!1}=n||{},s=Et().L,i=P('<div class="os-size-observer"><div class="os-size-observer-listener"></div></div>')[0],c=i.firstChild,l=mt(0,{p:!0,v:(t,e)=>!(!t||!Dt(t)&&Dt(e))}),d=t=>{const n=t&&t.g;let r=!1,c=!0;if(a(t)&&t.length>0){const{m:e,g:n,O:o}=l(0,t.pop().contentRect);r=!e||!Dt(n),c=!r&&o}else n&&(c=t.O);if(o&&c){const t="rtl"===(n||Yt(i));w(i,t?s.n?-3333333:s.i?0:3333333:3333333),b(i,3333333)}r||e(n?t:void 0)},u=[];let v=!!r&&d;if(lt){const t=new lt(d);t.observe(c),m(u,()=>t.disconnect())}else{const t=P('<div class="os-size-observer-listener-item" dir="ltr"><div class="os-size-observer-listener-item"><div class="os-size-observer-listener-item-final"></div></div><div class="os-size-observer-listener-item"><div class="os-size-observer-listener-item-final" style="width: 200%; height: 200%"></div></div></div>');q(c,t),M(c,"os-size-observer-listener-scroll");const e=t[0],n=e.lastChild,o=e.firstChild,s=null==o?void 0:o.firstChild;let i,l=B(c),a=l,f=!1;const h=()=>{w(o,3333333),b(o,3333333),w(n,3333333),b(n,3333333)},_=()=>{i=0,f&&(l=a,d())},p=t=>(a=B(c),f=!t||!X(a,l),t&&f&&!i?(at(i),i=dt(_)):t||_(),h(),t&&(R(t),K(t)),!1);m(u,[J(o,"scroll",p),J(n,"scroll",p)]),wt(s,{width:3333333,height:3333333}),h(),v=r?()=>p():h}if(o){const t=mt(()=>Yt(i));m(u,J(i,"scroll",e=>{const n=t(),{g:o,O:r}=n;return r&&(wt(c,"rtl"===o?{left:"auto",right:0}:{left:0,right:"auto"}),d(n)),R(e),K(e),!1}))}return v&&(M(i,"os-size-observer-appear"),m(u,J(i,"animationstart",v,{u:!!lt}))),E(t,i),()=>{z(u),N(i)}},Jt=(t,e,n,r)=>{let s;const i=()=>{n.forEach((t,e)=>{G(e,t,r)}),n.clear()},c=e=>{if(s){g(s.reduce((n,o)=>{if(o){const r=o[0],s=o[1],i=s&&r&&(e?e(r):L(r,t));i&&m(n,[i,l(s)?s(i):s],!0)}return n},[]),t=>{const e=t[0],s=t[1];g(e,t=>{((t,e)=>{const s=n.get(t),i=o(s),c=()=>{n.set(t,e),J(t,e,r)};i||e===s?i&&c():(G(t,s,r),c())})(t,s)})})}},a=t=>{s=t,i(),c()};return e&&a(e),{R:i,W:c,I:a}},Kt=(t,e,n)=>{let o=!1;const{X:r,H:s,Z:i,tt:l,et:a,nt:d,ot:u}=n||{},{W:v,R:f,I:h}=Jt(t,r&&l,new Map,vt(()=>{o&&e([],!1,!0)},80)),p=i||[],w=(s||[]).concat(p),b=o=>{const s=d||ut,i=u||ut,l=[],f=[];let h=!1,w=!1,b=!1;g(o,e=>{const{attributeName:o,target:d,type:u,oldValue:v,addedNodes:g}=e,y="attributes"===u,x="childList"===u,z=t===d,O=y&&c(o)?_(d,o):0,S=0!==O&&v!==O,A=S&&z&&!r&&!s(d,o,v,O),C=(j=o,p.indexOf(j,M)>-1&&S);var j,M;if(A&&m(l,o),r){const r=!y,c=y&&C&&!z,l=c&&a&&T(d,a),u=(l?!s(d,o,v,O):r||c)&&!i(e,!!l,t,n);m(f,g),w=w||u,b=b||x}h=h||A&&C}),b&&!x(f)&&v(t=>f.reduce((e,n)=>(m(e,L(t,n)),T(n,t)?m(e,n):e),[])),(!x(l)||h||w)&&e(l,h,w)},y=new it(b);return y.observe(t,{attributes:!0,attributeOldValue:!0,attributeFilter:w,subtree:r,childList:r,characterData:r}),o=!0,{rt:()=>{o&&(f(),y.disconnect(),o=!1)},st:t=>{h(o&&r&&t)},I:()=>{o&&b(y.takeRecords())}}},Rt=e=>{if(function(e){const n=window.HTMLElement;return!!e&&(n?e instanceof n:e.nodeType===t)}(e)){const t=T(e,"textarea")?F():e,n=F("os-padding"),o=F("os-viewport"),r=F("os-content");return q(n,o),q(o,r),q(r,V(e)),q(e,n),M(t,"os-host"),{target:e,host:t,padding:n,viewport:o,content:r}}const{host:n,padding:o,viewport:r,content:s}=e;return M(n,"os-host"),M(o,"os-padding"),M(r,"os-viewport"),M(s,"os-content"),e},Wt=(t,e,n)=>{const o=Rt(t),r=[],{host:s,content:i}=o;m(r,Bt(o));Gt(s,t=>{g(r,t?e=>{e.it&&e.it(t)}:t=>{t.Y&&t.Y()})},{K:!0,J:!0}),((t,e)=>{const n=P('<div class="os-trinsic-observer"></div>')[0],o=[],r=mt(t=>0===t.h||t.isIntersecting||t.intersectionRatio>0,{_:!1});if(ct){const s=new ct(t=>{if(t&&t.length>0){const n=t.pop();if(n){const t=r(0,n);t.O&&e(!1,t)}}},{root:t});s.observe(n),m(o,()=>s.disconnect())}else m(o,Gt(n,()=>{const t=B(n),o=r(0,t);o.O&&e(!1,o)}));E(t,n)})(s,(t,e)=>{g(r,n=>{n.D&&n.D(t,e)})}),Kt(s,()=>null),Kt(i,()=>null,{X:!0})};export default()=>[Et(),Wt(document.body),P(' <div class="os-host"> <div class="os-resize-observer-host"></div> <div class="os-padding"> <div class="os-viewport"> <div class="os-content"> fdfhdfgh </div> </div> </div> <div class="os-scrollbar os-scrollbar-horizontal"> <div class="os-scrollbar-track"> <div class="os-scrollbar-handle"></div> </div> </div> <div class="os-scrollbar os-scrollbar-vertical"> <div class="os-scrollbar-track"> <div class="os-scrollbar-handle"></div> </div> </div> <div class="os-scrollbar-corner"></div> </div>')]; |