mirror of
https://github.com/tenrok/OverlayScrollbars.git
synced 2026-06-23 19:10:35 +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 b(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 _(t,e){return h("scrollTop",0,t,e)}const g=/[^\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(g)||[];for(s=i.length>0;o=i[r++];)s=!!n(t.classList,o)&&s}})(t,e,(t,e)=>t.add(e))};function y(t,e){if(u(t))for(let n=0;n<t.length&&!1!==e(t[n],n,t);n++);else t&&y(Object.keys(t),n=>e(t[n],n,t));return t}const x=(t,e,n)=>(n||c(e)||!u(e)?t.push(e):Array.prototype.push.apply(t,e),t),z=t=>{if(Array.from)return Array.from(t);const e=[];return y(t,t=>{x(e,t)}),e},O=t=>t&&0===t.length,S=(t,e)=>{const n=t=>t&&t(e);t instanceof Set?t.forEach(n):y(t,n)},j=Element.prototype,A=(t,e)=>{const n=[],o=e?f(e)?e:null:document;return o?x(n,o.querySelectorAll(t)):n},C=(t,e)=>{if(f(t)){return(j.matches||j.msMatchesSelector).call(t,e)}return!1},M=t=>t?z(t.childNodes):[],$=(t,e,n)=>{if(n){let o,r=e;t&&(u(n)?(o=document.createDocumentFragment(),y(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))}},L=(t,e)=>{$(t,null,e)},k=(t,e)=>{$(t,t&&t.firstChild,e)},E=t=>{if(u(t))y(z(t),t=>E(t));else if(t){const n=(e=t)?e.parentElement:null;n&&n.removeChild(t)}var e},N=t=>{const e=document.createElement("div");return t&&b(e,"class",t),e},T=t=>{const e=N();return e.innerHTML=t.trim(),y(M(e),t=>E(t))},V={w:0,h:0},q=()=>({w:window.innerWidth,h:window.innerHeight}),F=t=>t?{w:t.offsetWidth,h:t.offsetHeight}:V;let P;const I=t=>t.split(" "),B=(t,e,n,o)=>{y(I(e),e=>{t.removeEventListener(e,n,o)})},Y=(t,e,n,r)=>{const s=(()=>{if(o(P)){P=!1;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get:function(){P=!0}}))}catch(t){}}return P})(),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 y(I(e),e=>{const o=l?r=>{t.removeEventListener(e,o,c),n&&n(r)}:n;x(a,B.bind(null,t,e,o,c)),t.addEventListener(e,o,d)}),S.bind(0,a)},D=t=>t.stopPropagation(),G=t=>t.preventDefault(),J=(t,e,n)=>{if(t&&e){let o=!0;return y(n,n=>{t[n]!==e[n]&&(o=!1)}),o}return!1},K=(t,e)=>J(t,e,["w","h"]),R=(t,e)=>J(t,e,["x","y"]),U=(t,e)=>J(t,e,["t","r","b","l"]),W=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),X=t=>t?Object.keys(t):[];function H(t,e,n,o,s,i,c){const d=[e,n,o,s,i,c];return"object"==typeof t&&!r(t)||l(t)||(t={}),y(d,e=>{y(X(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]=H(s,o)}else t[n]=o})}),t}function Q(t){for(const e in t)return!1;return!0}const 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(W(ot,t))return e;const n=Z(t),o=N().style;return y(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 W(nt,t)||(y(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=(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)}},vt={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},ft=(t,e)=>{const n=e?parseFloat(t):parseInt(t,10);return Number.isNaN(n)?0:n},ht=(t,e,n)=>null!=e?e.getPropertyValue(n):t.style[n],bt=(t,e,n)=>{try{t&&void 0!==t.style[e]&&(t.style[e]=((t,e)=>!vt[t.toLowerCase()]&&i(e)?e+"px":e)(e,n))}catch(o){}};function pt(t,e){const n=c(e);if(a(e)||n){let o=n?"":{};if(t){const r=window.getComputedStyle(t,null);o=n?ht(t,r,e):e.reduce((e,n)=>(e[n]=ht(t,r,n),e),o)}return o}y(X(e),n=>bt(t,n,e[n]))}const wt={x:0,y:0},_t=t=>{const e=t?(t=>t.getBoundingClientRect())(t):0;return e?{x:e.left+window.pageYOffset,y:e.top+window.pageXOffset}:wt},gt=(t,e)=>{const{v:n,p:o}=e||{};let r,s=o;return(e,o)=>{const i=s,c=t(o,s,r),l=e||(n?!n(i,c):i!==c);return l&&(s=c,r=i),{_:s,g:r,m:l}}};var mt=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:yt}=JSON,xt=["__TPL_","_TYPE__"],zt=["boolean","number","string","array","object","function","null"].reduce((t,e)=>(t[e]=xt[0]+e+xt[1],t),{}),Ot=(t,e,n,r,i)=>{const l={},d=mt({},t);return y(X(e).filter(e=>W(t,e)),u=>{const f=o(n[u])?{}:n[u],h=t[u],b=e[u],p=v(b),w=i?i+".":"";if(p&&v(h)){const t=Ot(h,b,f,r,w+u);l[u]=t.O,d[u]=t.S,y([d,l],t=>{Q(t[u])&&delete t[u]})}else if(!p){let t=!1;const e=[],n=[],i=s(h);if(y(a(b)?b:[b],r=>{let s;y(zt,(t,e)=>{t===r&&(s=e)});const l=o(s);if(l&&c(h)){const n=r.split(" ");t=!!n.find(t=>t===h),x(e,n)}else t=zt[i]===r;return x(n,l?zt.string:s),!t}),t){(a(h)||v(h)?yt(h)!==yt(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]}}),{S:d,O:l}},St=(t,e,n,o)=>Ot(t,e,n||{},o||!1);let jt;const{abs:At,round:Ct}=Math,Mt=(t,e)=>{L(t,e);const n=(o=e)?{w:o.clientWidth,h:o.clientHeight}:V;var o;const r=F(e);return{x:r.h-n.h,y:r.w-n.w}},$t=t=>{let e=!1;m(t,"os-viewport-scrollbar-styled");try{e="none"===pt(t,"scrollbar-width")||"none"===window.getComputedStyle(t,"::-webkit-scrollbar").getPropertyValue("display")}catch(n){}return e},Lt=(t,e)=>{pt(t,{overflowX:"hidden",overflowY:"hidden",direction:"rtl"}),w(t,0);const n=_t(t),o=_t(e);w(t,-999);const r=_t(e);return{i:n.x===o.x,n:o.x!==r.x}},kt=(t,e)=>{m(t,"os-environment-flexbox-glue");const n=F(t),o=F(e),r=K(o,n);m(t,"os-environment-flexbox-glue-max");const s=F(t),i=F(e),c=K(i,s);return r&&c},Et=()=>{const t=window.screen.deviceXDPI||0,e=window.screen.logicalXDPI||1;return window.devicePixelRatio||t/e},Nt=()=>{const{body:t}=document,e=T('<div class="os-environment"><div></div></div>')[0],n=e.firstChild,o=new Set,r=Mt(t,e),s={x:0===r.x,y:0===r.y},i={j:!1,A:r,C:s,M:$t(e),$:Lt(e,n),L:kt(e,n),k(t){o.add(t)},N(t){o.delete(t)}};if(p(e,"style"),p(e,"class"),E(e),!s.x||!s.y){let n=q(),s=Et(),i=r;window.addEventListener("resize",()=>{if(o.size){const r=q(),c={w:r.w-n.w,h:r.h-n.h};if(0===c.w&&0===c.h)return;const l={w:At(c.w),h:At(c.h)},a={w:At(Ct(r.w/(n.w/100))),h:At(Ct(r.h/(n.h/100)))},d=Et(),u=l.w>2&&l.h>2,v=!((t,e)=>{const n=At(t),o=At(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=jt.A=Mt(t,e);E(e),i.x===n.x&&i.y===n.y||S(o),i=n}n=r,s=d}})}return i},Tt=()=>(jt||(jt=Nt()),jt),Vt=(t,e)=>t&&e.split(".").reduce((t,e)=>t&&W(t,e)?t[e]:void 0,t),qt=(t,e,n)=>{const{T:o,V:r}=function t(e){const n={T:{},V:{}};return y(X(e),o=>{const r=e[o];if(a(r))n.T[o]=r[1],n.V[o]=r[0];else{const e=t(r);n.T[o]=e.T,n.V[o]=e.V}}),n}(t),s=H({},r,St(e||{},o,null,!0).O),i=t=>{const{q:e,F:o}=t;n(!!e,t=>({_:Vt(s,t),m:e||void 0!==Vt(o,t)}))};return i({q:!0}),{V(t){if(t){const{O:e}=St(t,o,s,!0);Q(e)||(H(s,e),i({F:e}))}return s},P:t=>{i({q:t})}}},Ft={paddingAbsolute:[!1,zt.boolean],overflowBehavior:{x:["scroll","visible-hidden visible-scroll scroll hidden"],y:["scroll","visible-hidden visible-scroll scroll hidden"]}},Pt=rt("margin-inline-end"),It=rt("border-inline-end"),Bt=(t,e)=>{const{host:n,padding:o,viewport:r,content:s}=t,i=[],c=Tt(),l=c.C,a=c.M,d=(c.L,Pt&&It||a||l.y,gt(()=>((t,e)=>{const n=e||"",o=n+"-top",r=n+"-right",s=n+"-bottom",i=n+"-left",c=pt(t,[o,r,s,i]);return{t:ft(c[o]),r:ft(c[r]),b:ft(c[s]),l:ft(c[i])}})(n,"padding"),{v:U})),u=gt(t=>({x:Math.max(0,Math.round(100*(t.I.w-t.B.w))/100),y:Math.max(0,Math.round(100*(t.I.h-t.B.h))/100)}),{v:R}),{V:v,P:f}=qt(Ft,e,(t,e)=>{const{_:n,m:r}=e("paddingAbsolute"),{_:i,m: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),pt(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=F(o),a=F(s),v=(f=s)?{w:f.scrollWidth,h:f.scrollHeight}:V;var f;const h=u(t,{I:v,B:{w:l.w+Math.max(0,a.w-v.w),h:l.h+Math.max(0,a.h-v.h)}}),{_:b,m:p}=h;console.log("overflowAmount",b),console.log("overflowAmountChanged",p)});return{V:v,P:f,Y:()=>{f()},D:(t,e)=>{const{m:n,_:o}=e;n&&pt(s,{height:o?"auto":"100%"})},G(){S(i)}}},Yt=t=>pt(t,"direction"),Dt=(t,e,n)=>{const{J:o=!1,K:r=!1}=n||{},s=Tt().$,i=T('<div class="os-size-observer"><div class="os-size-observer-listener"></div></div>')[0],l=i.firstChild,a=t=>{if(o){const t="rtl"===Yt(i);w(i,t?s.n?-3333333:s.i?0:3333333:3333333),_(i,3333333)}e(c((t||{})._)?t:void 0)},d=[];let u=r?a:null;if(lt){const t=new lt(a);t.observe(l),x(d,()=>t.disconnect())}else{const t=T('<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>');L(l,t),m(l,"os-size-observer-listener-scroll");const e=t[0],n=e.lastChild,o=e.firstChild,s=null==o?void 0:o.firstChild;let i,c=F(l),v=c,f=!1;const h=()=>{w(o,3333333),_(o,3333333),w(n,3333333),_(n,3333333)},b=()=>{i=0,f&&(c=v,a())},p=t=>(v=F(l),f=!t||!K(v,c),t&&f&&!i?(at(i),i=dt(b)):t||b(),h(),t&&(G(t),D(t)),!1);x(d,[Y(o,"scroll",p),Y(n,"scroll",p)]),pt(s,{width:3333333,height:3333333}),h(),u=r?()=>p():h}if(o){const t=gt(()=>Yt(i));x(d,Y(i,"scroll",e=>{const n=t(),{_:o,m:r}=n;return r&&(pt(l,"rtl"===o?{left:"auto",right:0}:{left:0,right:"auto"}),a(n)),G(e),D(e),!1}))}return u&&(m(i,"os-size-observer-appear"),x(d,Y(i,"animationstart",u))),k(t,i),()=>{S(d),E(i)}},Gt=(t,e,n,r)=>{let s;const i=()=>{n.forEach((t,e)=>{B(e,t,r)}),n.clear()},c=e=>{if(s){y(s.reduce((n,o)=>{if(o){const r=o[0],s=o[1],i=s&&r&&(e?e(r):A(r,t));i&&x(n,[i,l(s)?s(i):s],!0)}return n},[]),t=>{const e=t[0],s=t[1];y(e,t=>{((t,e)=>{const s=n.get(t),i=o(s),c=()=>{n.set(t,e),Y(t,e,r)};i||e===s?i&&c():(B(t,s,r),c())})(t,s)})})}},a=t=>{s=t,i(),c()};return e&&a(e),{R:i,U:c,P:a}},Jt=(t,e,n)=>{let o=!1;const{W:r,X:s,H:i,Z:l,tt:a}=n||{},{U:d,R:u,P:v}=Gt(t,r&&a,new Map,ut(()=>{o&&e([],!1,!0)},80)),f=i||[],h=(s||[]).concat(f),p=o=>{const s=[],i=[];let a=!1,u=!1,v=!1;y(o,e=>{const{attributeName:o,target:d,type:h,oldValue:p,addedNodes:w}=e,_="attributes"===h,g="childList"===h,m=t===d,y=_&&c(o)&&((t,e,n)=>n!==b(t,e))(d,o,p),z=y&&m&&!r,O=(S=o,f.indexOf(S,j)>-1&&y);var S,j;if(a=a||z&&O,z&&x(s,o),r){const o=_&&O&&!m,s=(!_||o)&&(l?!l(e,t,n):r);x(i,w),u=u||s,v=v||g}}),v&&!O(i)&&d(t=>i.reduce((e,n)=>(x(e,A(t,n)),C(n,t)?x(e,n):e),[])),(!O(s)||a||u)&&e(s,a,u)},w=new it(p);return w.observe(t,{attributes:!0,attributeOldValue:!0,attributeFilter:h,subtree:r,childList:r,characterData:r}),o=!0,{et:()=>{o&&(u(),w.disconnect(),o=!1)},nt:t=>{v(o&&r&&t)},P:()=>{o&&p(w.takeRecords())}}},Kt=e=>{if(function(e){const n=window.HTMLElement;return!!e&&(n?e instanceof n:e.nodeType===t)}(e)){const t=C(e,"textarea")?N():e,n=N("os-padding"),o=N("os-viewport"),r=N("os-content");return L(n,o),L(o,r),L(r,M(e)),L(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},Rt=(t,e,n)=>{const o=Kt(t),r=[],{host:s,content:i}=o;x(r,Bt(o));Dt(s,t=>{y(r,t?e=>{e.ot&&e.ot(t)}:t=>{t.Y&&t.Y()})},{K:!0,J:!0}),((t,e)=>{const n=T('<div class="os-trinsic-observer"></div>')[0],o=[],r=gt(t=>0===t.h||t.isIntersecting||t.intersectionRatio>0,{p:!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.m&&e(!1,t)}}},{root:t});s.observe(n),x(o,()=>s.disconnect())}else x(o,Dt(n,()=>{const t=F(n),o=r(0,t);o.m&&e(!1,o)}));k(t,n)})(s,(t,e)=>{y(r,n=>{n.D&&n.D(t,e)})}),Jt(s,()=>null),Jt(i,()=>null,{W:!0})};export default()=>[Tt(),Rt(document.body),T(' <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>')]; |