diff --git a/docs/404.html b/docs/404.html index 984e221..25bfad0 100644 --- a/docs/404.html +++ b/docs/404.html @@ -1,4 +1,4 @@ -404: This page could not be found

404

This page could not be found.

\ No newline at end of file + }

404

This page could not be found.

\ No newline at end of file diff --git a/docs/_next/static/H6pdr41QQqL3zh1PXMwwV/_buildManifest.js b/docs/_next/static/MFC_3c1tHO1VVYfXqKpaE/_buildManifest.js similarity index 79% rename from docs/_next/static/H6pdr41QQqL3zh1PXMwwV/_buildManifest.js rename to docs/_next/static/MFC_3c1tHO1VVYfXqKpaE/_buildManifest.js index e4003ba..ecb18a9 100644 --- a/docs/_next/static/H6pdr41QQqL3zh1PXMwwV/_buildManifest.js +++ b/docs/_next/static/MFC_3c1tHO1VVYfXqKpaE/_buildManifest.js @@ -1 +1 @@ -self.__BUILD_MANIFEST={__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":["static/css/054cd89f2e050c9e.css","static/chunks/pages/index-1465b24e4598396b.js"],"/_error":["static/chunks/pages/_error-fa37e1d4331cc885.js"],sortedPages:["/","/_app","/_error"]},self.__BUILD_MANIFEST_CB&&self.__BUILD_MANIFEST_CB(); \ No newline at end of file +self.__BUILD_MANIFEST={__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":["static/css/054cd89f2e050c9e.css","static/chunks/pages/index-8ddcd3e778eaf347.js"],"/_error":["static/chunks/pages/_error-fa37e1d4331cc885.js"],sortedPages:["/","/_app","/_error"]},self.__BUILD_MANIFEST_CB&&self.__BUILD_MANIFEST_CB(); \ No newline at end of file diff --git a/docs/_next/static/H6pdr41QQqL3zh1PXMwwV/_ssgManifest.js b/docs/_next/static/MFC_3c1tHO1VVYfXqKpaE/_ssgManifest.js similarity index 100% rename from docs/_next/static/H6pdr41QQqL3zh1PXMwwV/_ssgManifest.js rename to docs/_next/static/MFC_3c1tHO1VVYfXqKpaE/_ssgManifest.js diff --git a/docs/_next/static/chunks/pages/_app-7f89ee3d41d62052.js b/docs/_next/static/chunks/pages/_app-0d224bd9e3d9990c.js similarity index 56% rename from docs/_next/static/chunks/pages/_app-7f89ee3d41d62052.js rename to docs/_next/static/chunks/pages/_app-0d224bd9e3d9990c.js index 2066824..f150d4a 100644 --- a/docs/_next/static/chunks/pages/_app-7f89ee3d41d62052.js +++ b/docs/_next/static/chunks/pages/_app-0d224bd9e3d9990c.js @@ -1,9 +1,9 @@ -(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[888],{8936:function(e,t,r){(window.__NEXT_P=window.__NEXT_P||[]).push(["/_app",function(){return r(3504)}])},3504:function(e,t,r){"use strict";r.r(t),r.d(t,{default:function(){return g}});var i=r(9722),n=r(169);function o(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,i=Array(t);rt(e[r],r,e));return e}function o(e,t){let r=f(t),i=v(t)||r;if(i){let o=r?"":{};if(e){let l=window.getComputedStyle(e,null);o=r?eN(e,l,t):t.reduce((t,r)=>(t[r]=eN(e,l,r),t),o)}return o}e&&n(P(t),r=>ez(e,r,t[r]))}let l=(e,t)=>{let{o:r,u:i,_:n}=e,o=r,l,a=(e,t)=>{let r=o,a=t||(i?!i(r,e):r!==e);return(a||n)&&(o=e,l=r),[o,a,l]},s=e=>a(t(o,l),e),u=e=>[o,!!e,l];return[t?s:a,u]},a=()=>"undefined"!=typeof window,s=a()&&Node.ELEMENT_NODE,{toString:u,hasOwnProperty:c}=Object.prototype,d=e=>void 0===e,b=e=>null===e,p=e=>d(e)||b(e)?`${e}`:u.call(e).replace(/^\[object (.+)\]$/,"$1").toLowerCase(),w=e=>"number"==typeof e,f=e=>"string"==typeof e,m=e=>"boolean"==typeof e,h=e=>"function"==typeof e,v=e=>Array.isArray(e),g=e=>"object"==typeof e&&!v(e)&&!b(e),y=e=>{let t=!!e&&e.length,r=w(t)&&t>-1&&t%1==0;return(!!v(e)||!h(e)&&!!r)&&(!(t>0&&g(e))||t-1 in e)},x=e=>{if(!e||!g(e)||"object"!==p(e))return!1;let t,r="constructor",i=e[r],n=i&&i.prototype,o=c.call(e,r),l=n&&c.call(n,"isPrototypeOf");if(i&&!o&&!l)return!1;for(t in e);return d(t)||c.call(e,t)},k=e=>{let t=HTMLElement;return!!e&&(t?e instanceof t:e.nodeType===s)},_=e=>{let t=Element;return!!e&&(t?e instanceof t:e.nodeType===s)},O=(e,t,r)=>e.indexOf(t,r),S=(e,t,r)=>(!r&&!f(t)&&y(t)?Array.prototype.push.apply(e,t):e.push(t),e),j=e=>{let t=Array.from,r=[];return t&&e?t(e):(e instanceof Set?e.forEach(e=>{S(r,e)}):n(e,e=>{S(r,e)}),r)},E=e=>!!e&&0===e.length,$=(e,t,r)=>{let i=e=>e&&e.apply(void 0,t||[]);n(e,i),r||(e.length=0)},T=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),P=e=>e?Object.keys(e):[],C=(e,t,r,i,o,l,a)=>(("object"!=typeof e||b(e))&&!h(e)&&(e={}),n([t,r,i,o,l,a],t=>{n(P(t),r=>{let i=t[r];if(e===i)return!0;let n=v(i);if(i&&(x(i)||n)){let o=e[r],l=o;n&&!v(o)?l=[]:n||x(o)||(l={}),e[r]=C(l,i)}else e[r]=i})}),e),A=e=>{for(let t in e)return!1;return!0},N=(e,t,r,i)=>{if(d(i))return r?r[e]:t;r&&(f(i)||w(i))&&(r[e]=i)},z=(e,t,r)=>{if(d(r))return e?e.getAttribute(t):null;e&&e.setAttribute(t,r)},L=(e,t,r,i)=>{if(r){let n=z(e,t)||"",o=new Set(n.split(" "));o[i?"add":"delete"](r),z(e,t,j(o).join(" ").trim())}},M=(e,t,r)=>{let i=z(e,t)||"",n=new Set(i.split(" "));return n.has(r)},q=(e,t)=>{e&&e.removeAttribute(t)},I=(e,t)=>N("scrollLeft",0,e,t),R=(e,t)=>N("scrollTop",0,e,t),B=a()&&Element.prototype,D=(e,t)=>{let r=[],i=t?_(t)?t:null:document;return i?S(r,i.querySelectorAll(e)):r},V=(e,t)=>{let r=t?_(t)?t:null:document;return r?r.querySelector(e):null},F=(e,t)=>{if(_(e)){let r=B.matches||B.msMatchesSelector;return r.call(e,t)}return!1},H=e=>e?j(e.childNodes):[],X=e=>e?e.parentElement:null,Z=(e,t)=>{if(_(e)){let r=B.closest;if(r)return r.call(e,t);do{if(F(e,t))return e;e=X(e)}while(e)}return null},U=(e,t,r)=>{let i=e&&Z(e,t),n=e&&V(r,i),o=Z(n,t)===i;return!!i&&!!n&&(i===e||n===e||o&&Z(Z(e,r),t)!==i)},W=(e,t,r)=>{if(r&&e){let i=t,o;y(r)?(o=document.createDocumentFragment(),n(r,e=>{e===i&&(i=e.previousSibling),o.appendChild(e)})):o=r,t&&(i?i!==t&&(i=i.nextSibling):i=e.firstChild),e.insertBefore(o,i||null)}},Y=(e,t)=>{W(e,null,t)},K=(e,t)=>{W(X(e),e,t)},G=(e,t)=>{W(X(e),e&&e.nextSibling,t)},J=e=>{if(y(e))n(j(e),e=>J(e));else if(e){let t=X(e);t&&t.removeChild(e)}},Q=e=>{let t=document.createElement("div");return e&&z(t,"class",e),t},ee=e=>{let t=Q();return t.innerHTML=e.trim(),n(H(t),e=>J(e))},et=e=>e.charAt(0).toUpperCase()+e.slice(1),er=()=>Q().style,ei=["-webkit-","-moz-","-o-","-ms-"],en=["WebKit","Moz","O","MS","webkit","moz","o","ms"],eo={},el={},ea=e=>{let t=el[e];if(T(el,e))return t;let r=et(e),i=er();return n(ei,n=>{let o=n.replace(/-/g,""),l=[e,n+e,o+r,et(o)+r];return!(t=l.find(e=>void 0!==i[e]))}),el[e]=t||""},es=e=>{if(a()){let t=eo[e]||window[e];return T(eo,e)||(n(en,r=>!(t=t||window[r+et(e)])),eo[e]=t),t}},eu=es("MutationObserver"),ec=es("IntersectionObserver"),ed=es("ResizeObserver"),eb=es("cancelAnimationFrame"),ep=es("requestAnimationFrame"),ew=a()&&window.setTimeout,ef=a()&&window.clearTimeout,em=(e,t,r,i)=>{if(e&&t){let o=!0;return n(r,r=>{let n=i?i(e[r]):e[r],l=i?i(t[r]):t[r];n!==l&&(o=!1)}),o}return!1},eh=(e,t)=>em(e,t,["w","h"]),ev=(e,t)=>em(e,t,["x","y"]),eg=(e,t)=>em(e,t,["t","r","b","l"]),ey=(e,t,r)=>em(e,t,["width","height"],r&&(e=>Math.round(e))),ex=()=>{},ek=e=>{let t,r=e?ew:ep,i=e?ef:eb;return[n=>{i(t),t=r(n,h(e)?e():e)},()=>i(t)]},e_=(e,t)=>{let r,i,n,o=ex,{g:l,v:a,p:s}=t||{},u=function(t){o(),ef(r),r=i=void 0,o=ex,e.apply(this,t)},c=e=>s&&i?s(i,e):e,d=()=>{o!==ex&&u(c(n)||n)},b=function(){let e=j(arguments),t=h(l)?l():l,s=w(t)&&t>=0;if(s){let b=h(a)?a():a,p=w(b)&&b>=0,f=t>0?ef:eb,m=c(e),v=m||e,g=u.bind(0,v);o();let y=(t>0?ew:ep)(g,t);o=()=>f(y),p&&!r&&(r=ew(d,b)),i=n=v}else u(e)};return b.m=d,b},{max:eO}=Math,eS=/[^\x20\t\r\n\f]+/g,ej=(e,t,r)=>{let i=e&&e.classList,n,o=0,l=!1;if(i&&t&&f(t)){let a=t.match(eS)||[];for(l=a.length>0;n=a[o++];)l=!!r(i,n)&&l}return l},eE=(e,t)=>ej(e,t,(e,t)=>e.contains(t)),e$=(e,t)=>{ej(e,t,(e,t)=>e.remove(t))},eT=(e,t)=>(ej(e,t,(e,t)=>e.add(t)),e$.bind(0,e,t)),eP={opacity:1,zindex:1},eC=(e,t)=>{let r=t?parseFloat(e):parseInt(e,10);return r==r?r:0},eA=(e,t)=>!eP[e.toLowerCase()]&&w(t)?`${t}px`:t,eN=(e,t,r)=>null!=t?t[r]||t.getPropertyValue(r):e.style[r],ez=(e,t,r)=>{try{let{style:i}=e;d(i[t])?i.setProperty(t,r):i[t]=eA(t,r)}catch(n){}},eL=e=>"rtl"===o(e,"direction"),eM=(e,t,r)=>{let i=t?`${t}-`:"",n=r?`-${r}`:"",l=`${i}top${n}`,a=`${i}right${n}`,s=`${i}bottom${n}`,u=`${i}left${n}`,c=o(e,[l,a,s,u]);return{t:eC(c[l],!0),r:eC(c[a],!0),b:eC(c[s],!0),l:eC(c[u],!0)}},{round:eq}=Math,eI={w:0,h:0},eR=e=>e?{w:e.offsetWidth,h:e.offsetHeight}:eI,eB=e=>e?{w:e.clientWidth,h:e.clientHeight}:eI,eD=e=>e?{w:e.scrollWidth,h:e.scrollHeight}:eI,eV=e=>{let t=parseFloat(o(e,"height"))||0,r=parseFloat(o(e,"width"))||0;return{w:r-eq(r),h:t-eq(t)}},eF=e=>e.getBoundingClientRect(),eH,eX=()=>{if(d(eH)){eH=!1;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get(){eH=!0}}))}catch(e){}}return eH},eZ=e=>e.split(" "),eU=(e,t,r,i)=>{n(eZ(t),t=>{e.removeEventListener(t,r,i)})},eW=(e,t,r,i)=>{var o;let l=eX(),a=null!=(o=l&&i&&i.S)?o:l,s=i&&i.$||!1,u=i&&i.C||!1,c=[],d=l?{passive:a,capture:s}:s;return n(eZ(t),t=>{let i=u?n=>{e.removeEventListener(t,i,s),r&&r(n)}:r;S(c,eU.bind(null,e,t,i,s)),e.addEventListener(t,i,d)}),$.bind(0,c)},eY=e=>e.stopPropagation(),eK=e=>e.preventDefault(),eG={x:0,y:0},eJ=e=>{let t=e?eF(e):0;return t?{x:t.left+window.pageYOffset,y:t.top+window.pageXOffset}:eG},eQ=(e,t)=>{n(v(t)?t:[t],e)},e0=e=>{let t=new Map,r=(e,r)=>{if(e){let i=t.get(e);eQ(e=>{i&&i[e?"delete":"clear"](e)},r)}else t.forEach(e=>{e.clear()}),t.clear()},i=(e,o)=>{if(f(e)){let l=t.get(e)||new Set;return t.set(e,l),eQ(e=>{h(e)&&l.add(e)},o),r.bind(0,e,o)}m(o)&&o&&r();let a=P(e),s=[];return n(a,t=>{let r=e[t];r&&S(s,i(t,r))}),$.bind(0,s)},o=(e,r)=>{let i=t.get(e);n(j(i),e=>{r&&!E(r)?e.apply(0,r):e()})};return i(e||{}),[i,r,o]},e1=e=>JSON.stringify(e,(e,t)=>{if(h(t))throw Error();return t}),e3={paddingAbsolute:!1,showNativeOverlaidScrollbars:!1,update:{elementEvents:[["img","load"]],debounce:[0,33],attributes:null,ignoreMutation:null},overflow:{x:"scroll",y:"scroll"},scrollbars:{theme:"os-theme-dark",visibility:"auto",autoHide:"never",autoHideDelay:1300,dragScroll:!0,clickScroll:!1,pointers:["mouse","touch","pen"]}},e2=(e,t)=>{let r={},i=P(t).concat(P(e));return n(i,i=>{let n=e[i],o=t[i];if(g(n)&&g(o))C(r[i]={},e2(n,o)),A(r[i])&&delete r[i];else if(T(t,i)&&o!==n){let l=!0;if(v(n)||v(o))try{e1(n)===e1(o)&&(l=!1)}catch(a){}l&&(r[i]=o)}}),r},e6="os-environment",e4=`${e6}-flexbox-glue`,e5=`${e4}-max`,e9="data-overlayscrollbars",e7="data-overlayscrollbars-initialize",e8=`${e9}-overflow-x`,te=`${e9}-overflow-y`,tt="overflowVisible",tr="updating",ti="os-viewport",tn=`${ti}-arrange`,to=`${ti}-scrollbar-hidden`,tl="os-overflow-visible",ta="os-size-observer",ts=`${ta}-appear`,tu=`${ta}-listener`,tc="os-scrollbar",td=`${tc}-rtl`,tb=`${tc}-horizontal`,tp=`${tc}-vertical`,tw=`${tc}-track`,tf=`${tc}-handle`,tm=`${tc}-visible`,th=`${tc}-cornerless`,tv=`${tc}-transitionless`,tg=`${tc}-interaction`,ty=`${tc}-unusable`,tx=`${tc}-auto-hidden`,tk=`${tc}-wheel`,t_=`${tw}-interactive`,tO=`${tf}-interactive`,tS={},tj=()=>tS,tE=e=>{let t=[];return n(v(e)?e:[e],e=>{let r=P(e);n(r,r=>{S(t,tS[r]=e[r])})}),t},t$={boolean:"__TPL_boolean_TYPE__",number:"__TPL_number_TYPE__",string:"__TPL_string_TYPE__",array:"__TPL_array_TYPE__",object:"__TPL_object_TYPE__",function:"__TPL_function_TYPE__",null:"__TPL_null_TYPE__"};t$.number,t$.boolean,t$.array,t$.null,t$.number,t$.array,t$.null,t$.function,t$.null,t$.string,t$.null,t$.array,t$.null;let{round:tT,abs:tP}=Math,tC="__osScrollbarsHidingPlugin",tA,tN=(e,t,r,i)=>{Y(e,t);let n=eB(t),o=eR(t),l=eV(r);return i&&J(t),{x:o.h-n.h+l.h,y:o.w-n.w+l.w}},tz=e=>{let t=!1,r=eT(e,to);try{t="none"===o(e,ea("scrollbar-width"))||"none"===window.getComputedStyle(e,"::-webkit-scrollbar").getPropertyValue("display")}catch(i){}return r(),t},tL=(e,t)=>{let r="hidden";o(e,{overflowX:r,overflowY:r,direction:"rtl"}),I(e,0);let i=eJ(e),n=eJ(t);I(e,-999);let l=eJ(t);return{i:i.x===n.x,n:n.x!==l.x}},tM=(e,t)=>{let r=eT(e,e4),i=eF(e),n=eF(t),o=ey(n,i,!0),l=eT(e,e5),a=eF(e),s=eF(t),u=ey(s,a,!0);return r(),l(),o&&u},tq=()=>{let{body:e}=document,t=ee(`
`),r=t[0],i=r.firstChild,[n,,a]=e0(),[s,u]=l({o:tN(e,r,i),u:ev},tN.bind(0,e,r,i,!0)),[c]=u(),d=tz(r),b={x:0===c.x,y:0===c.y},p={elements:{host:null,padding:!d,viewport:e=>d&&e===e.ownerDocument.body&&e,content:!1},scrollbars:{slot:!0},cancel:{nativeScrollbarsOverlaid:!1,body:null}},w=C({},e3),f=C.bind(0,{},w),m=C.bind(0,{},p),h={k:c,A:b,I:d,L:"-1"===o(r,"zIndex"),B:tL(r,i),V:tM(r,i),Y:n.bind(0,"z"),j:n.bind(0,"r"),N:m,q:e=>C(p,e)&&m(),F:f,G:e=>C(w,e)&&f(),X:C({},p),U:C({},w)},v=window.addEventListener,g=e_(e=>a(e?"z":"r"),{g:33,v:99});if(q(r,"style"),J(r),v("resize",g.bind(0,!1)),!d&&(!b.x||!b.y)){let y;v("resize",()=>{let e=tj()[tC];(y=y||e&&e.R())&&y(h,s,g.bind(0,!0))})}return h},tI=()=>(tA||(tA=tq()),tA),tR=(e,t)=>h(t)?t.apply(0,e):t,tB=(e,t,r,i)=>{let n=d(i)?r:i,o=tR(e,n);return o||t.apply(0,e)},tD=(e,t,r,i)=>{let n=d(i)?r:i,o=tR(e,n);return!!o&&(k(o)?o:t.apply(0,e))},tV=(e,t,r)=>{let{nativeScrollbarsOverlaid:i,body:n}=r||{},{A:o,I:l}=tI(),{nativeScrollbarsOverlaid:a,body:s}=t,u=d(n)?s:n,c=(o.x||o.y)&&(null!=i?i:a),p=e&&(b(u)?!l:u);return!!c||!!p},tF=new WeakMap,tH=(e,t)=>{tF.set(e,t)},tX=e=>{tF.delete(e)},tZ=e=>tF.get(e),tU=(e,t)=>e?t.split(".").reduce((e,t)=>e&&T(e,t)?e[t]:void 0,e):void 0,tW=(e,t,r)=>i=>[tU(e,i),r||void 0!==tU(t,i)],tY=e=>{let t=e;return[()=>t,e=>{t=C({},t,e)}]},tK="tabindex",tG=Q.bind(0,""),tJ=e=>{Y(X(e),H(e)),J(e)},tQ=e=>{let t=tI(),{N:r,I:i}=t,n=tj()[tC],o=n&&n.T,{elements:l}=r(),{host:a,padding:s,viewport:u,content:c}=l,d=k(e),b=d?{}:e,{elements:p}=b,{host:w,padding:f,viewport:m,content:h}=p||{},v=d?e:b.target,g=F(v,"textarea"),y=v.ownerDocument,x=y.documentElement,_=v===y.body,j=y.defaultView,E=tB.bind(0,[v]),T=tD.bind(0,[v]),C=tR.bind(0,[v]),A=E.bind(0,tG,u),N=T.bind(0,tG,c),I=A(m),R=I===v,B=R&&_,D=!R&&N(h),V=!R&&k(I)&&I===D,Z=V&&!!C(c),U=Z?A():I,W=Z?D:N(),Q=B?x:V?U:I,ee=g?E(tG,a,w):v,et=y.activeElement,er=!R&&j.top===j&&et===v,ei={W:v,Z:B?Q:ee,J:Q,K:!R&&T(tG,s,f),tt:V?W:D,nt:!R&&!i&&o&&o(t),ot:B?x:Q,st:B?y:Q,et:j,ct:y,rt:g,it:_,lt:d,ut:R,dt:V,ft:(e,t)=>R?M(Q,e9,t):eE(Q,e),_t:(e,t,r)=>R?L(Q,e9,t,r):(r?eT:e$)(Q,e)},en=P(ei).reduce((e,t)=>{let r=ei[t];return S(e,!!r&&!X(r)&&r)},[]),eo=e=>e?O(en,e)>-1:null,{W:el,Z:ea,K:es,J:eu,tt:ec,nt:ed}=ei,eb=[()=>{q(ea,e9),q(ea,e7),q(el,e7),_&&(q(x,e9),q(x,e7))}],ep=g&&eo(ea),ew=g?el:H([ec,eu,es,ea,el].find(e=>!1===eo(e))),ef=B?el:ec||eu,em=()=>{z(ea,e9,R?"viewport":"host");let e=eT(es,"os-padding"),t=eT(eu,!R&&ti),r=eT(ec,"os-content"),n=_&&!R?eT(X(v),to):ex;if(ep&&(G(el,ea),S(eb,()=>{G(ea,el),J(ea)})),Y(ef,ew),Y(ea,es),Y(es||ea,!R&&eu),Y(eu,ec),S(eb,()=>{n(),q(eu,e8),q(eu,te),eo(ec)&&tJ(ec),eo(eu)&&tJ(eu),eo(es)&&tJ(es),e(),t(),r()}),i&&!R&&S(eb,e$.bind(0,eu,to)),ed&&(K(eu,ed),S(eb,J.bind(0,ed))),er){let o=z(eu,tK);z(eu,tK,"-1"),eu.focus();let l=()=>o?z(eu,tK,o):q(eu,tK),a=eW(y,"pointerdown keydown",()=>{l(),a()});S(eb,[l,a])}else et&&et.focus&&et.focus();ew=0};return[ei,em,$.bind(0,eb)]},t0=(e,t)=>{let{tt:r}=e,[i]=t;return e=>{let{V:t}=tI(),{ht:n}=i(),{gt:l}=e,a=(r||!t)&&l;return a&&o(r,{height:n?"":"100%"}),{vt:a,wt:a}}},t1=(e,t)=>{let[r,i]=t,{Z:n,K:a,J:s,ut:u}=e,[c,d]=l({u:eg,o:eM()},eM.bind(0,n,"padding",""));return(e,t,n)=>{let[l,b]=d(n),{I:p,V:w}=tI(),{bt:f}=r(),{vt:m,wt:h,yt:v}=e,[g,y]=t("paddingAbsolute");(m||b||!w&&h)&&([l,b]=c(n));let x=!u&&(y||v||b);if(x){let k=!g||!a&&!p,_=l.r+l.l,O=l.t+l.b,S={marginRight:k&&!f?-_:0,marginBottom:k?-O:0,marginLeft:k&&f?-_:0,top:k?-l.t:0,right:k?f?-l.r:"auto":0,left:k?f?"auto":-l.l:0,width:k?`calc(100% + ${_}px)`:""},j={paddingTop:k?l.t:0,paddingRight:k?l.r:0,paddingBottom:k?l.b:0,paddingLeft:k?l.l:0};o(a||s,S),o(s,j),i({K:l,St:!k,M:a?j:C({},S,j)})}return{xt:x}}},{max:t3}=Math,t2=t3.bind(0,0),t6="visible",t4="hidden",t5={u:eh,o:{w:0,h:0}},t9={u:ev,o:{x:t4,y:t4}},t7=(e,t)=>{let r=window.devicePixelRatio%1!=0?1:0,i={w:t2(e.w-t.w),h:t2(e.h-t.h)};return{w:i.w>r?i.w:0,h:i.h>r?i.h:0}},t8=(e,t,r)=>r?eT(e,t):e$(e,t),re=e=>0===e.indexOf(t6),rt=(e,t)=>{let[r,i]=t,{Z:n,K:a,J:s,nt:u,ut:c,_t:d,it:b,et:p}=e,{k:w,V:f,I:m,A:h}=tI(),v=tj()[tC],g=!c&&!m&&(h.x||h.y),y=b&&c,[x,k]=l(t5,eV.bind(0,s)),[_,O]=l(t5,eD.bind(0,s)),[S,j]=l(t5),[E,$]=l(t5),[T]=l(t9),P=(e,t)=>{if(o(s,{height:""}),t){let{St:i,K:l}=r(),{$t:a,P:u}=e,c=eV(n),d=eB(n),b="content-box"===o(s,"boxSizing"),p=i||b?l.b+l.t:0,w=!(h.x&&b);o(s,{height:d.h+c.h+(a.x&&w?u.x:0)-p})}},C=(e,t)=>{let r=m||e?0:42,i=(e,i,n)=>{let l=o(s,e),a=t?t[e]:l,u="scroll"===a;return[l,u,u&&!m?i?r:n:0,i&&!!r]},[n,l,a,u]=i("overflowX",h.x,w.x),[c,d,b,p]=i("overflowY",h.y,w.y);return{Ct:{x:n,y:c},$t:{x:l,y:d},P:{x:a,y:b},D:{x:u,y:p}}},A=(e,t,r,i)=>{let n=(e,t)=>{let r=re(e),i=t&&r&&e.replace(`${t6}-`,"")||"";return[t&&!r?e:"",re(i)?"hidden":i]},[o,l]=n(r.x,t.x),[a,s]=n(r.y,t.y);return i.overflowX=l&&a?l:o,i.overflowY=s&&o?s:a,C(e,i)},N=(e,t,i,n)=>{let{P:o,D:l}=e,{x:a,y:s}=l,{x:u,y:c}=o,{M:d}=r(),b=t?"marginLeft":"marginRight",p=t?"paddingLeft":"paddingRight",w=d[b],f=d.marginBottom,m=d[p],h=d.paddingBottom;n.width=`calc(100% + ${c+-1*w}px)`,n[b]=-c+w,n.marginBottom=-u+f,i&&(n[p]=m+(s?c:0),n.paddingBottom=h+(a?u:0))},[M,q]=v?v.H(g,f,s,u,r,C,N):[()=>g,()=>[ex]];return(e,t,l)=>{let{vt:u,Ot:b,wt:w,xt:v,gt:g,yt:I}=e,{ht:R,bt:B}=r(),[D,V]=t("showNativeOverlaidScrollbars"),[F,H]=t("overflow"),X=D&&h.x&&h.y,Z=!c&&!f&&(u||w||b||V||g),U=re(F.x),W=re(F.y),Y=U||W,K=k(l),G=O(l),J=j(l),Q=$(l),ee;if(V&&m&&d(to,"scrollbarHidden",!X),Z&&(ee=C(X),P(ee,R)),u||v||w||I||V){Y&&d(tl,tt,!1);let[et,er]=q(X,B,ee),[ei,en]=K=x(l),[eo,el]=G=_(l),ea=eB(s),es=eo,eu=ea;et(),(el||en||V)&&er&&!X&&M(er,eo,ei,B)&&(eu=eB(s),es=eD(s));let ec={w:t2(t3(eo.w,es.w)+ei.w),h:t2(t3(eo.h,es.h)+ei.h)},ed={w:t2((y?p.innerWidth:eu.w+t2(ea.w-eo.w))+ei.w),h:t2((y?p.innerHeight+ei.h:eu.h+t2(ea.h-eo.h))+ei.h)};Q=E(ed),J=S(t7(ec,ed),l)}let[eb,ep]=Q,[ew,ef]=J,[em,eh]=G,[ev,eg]=K,ey={x:ew.w>0,y:ew.h>0},ex=U&&W&&(ey.x||ey.y)||U&&ey.x&&!ey.y||W&&ey.y&&!ey.x;if(v||I||eg||eh||ep||ef||H||V||Z){let ek={marginRight:0,marginBottom:0,marginLeft:0,width:"",overflowY:"",overflowX:""},e_=A(X,ey,F,ek),eO=M(e_,em,ev,B);c||N(e_,B,eO,ek),Z&&P(e_,R),c?(z(n,e8,ek.overflowX),z(n,te,ek.overflowY)):o(s,ek)}L(n,e9,tt,ex),t8(a,tl,ex),c||t8(s,tl,Y);let[eS,ej]=T(C(X).Ct);return i({Ct:eS,zt:{x:eb.w,y:eb.h},Tt:{x:ew.w,y:ew.h},Et:ey}),{It:ej,At:ep,Lt:ef}}},rr=(e,t,r)=>{let i={},o=t||{},l=P(e).concat(P(o));return n(l,t=>{let n=e[t],l=o[t];i[t]=!!(r||n||l)}),i},ri=(e,t)=>{let{W:r,J:i,_t:o,ut:l}=e,{I:a,A:s,V:u}=tI(),c=!a&&(s.x||s.y),d=[t0(e,t),t1(e,t),rt(e,t)];return(e,t,a)=>{let s=rr(C({vt:!1,xt:!1,yt:!1,gt:!1,At:!1,Lt:!1,It:!1,Ot:!1,wt:!1},t),{},a),b=c||!u,p=b&&I(i),w=b&&R(i);o("",tr,!0);let f=s;return n(d,t=>{f=rr(f,t(f,e,!!a)||{},a)}),I(i,p),R(i,w),o("",tr),l||(I(r,0),R(r,0)),f}},rn=(e,t,r)=>{let i,o=!1,l=()=>{o=!0},a=l=>{if(r){let a=r.reduce((t,r)=>{if(r){let[i,n]=r,o=n&&i&&(l?l(i):D(i,e));o&&o.length&&n&&f(n)&&S(t,[o,n.trim()],!0)}return t},[]);n(a,r=>n(r[0],n=>{let l=r[1],a=i.get(n)||[],s=e.contains(n);if(s){let u=eW(n,l,e=>{o?(u(),i.delete(n)):t(e)});i.set(n,S(a,u))}else $(a),i.delete(n)}))}};return r&&(i=new WeakMap,a()),[l,a]},ro=(e,t,r,i)=>{let o=!1,{Ht:l,Mt:a,Pt:s,Dt:u,Rt:c,kt:d}=i||{},b=e_(()=>{o&&r(!0)},{g:33,v:99}),[p,w]=rn(e,b,s),m=a||[],h=(l||[]).concat(m),v=(o,l)=>{let a=c||ex,s=d||ex,b=new Set,p=new Set,h=!1,v=!1;if(n(o,r=>{let{attributeName:o,target:l,type:c,oldValue:d,addedNodes:w,removedNodes:g}=r,y="attributes"===c,x=e===l,k=y&&f(o)?z(l,o):0,_=0!==k&&d!==k,S=O(m,o)>-1&&_;if(t&&("childList"===c||!x)){let j=y&&_,E=j&&u&&F(l,u),$=E?!a(l,o,d,k):!y||j,T=$&&!s(r,!!E,e,i);n(w,e=>b.add(e)),n(g,e=>b.add(e)),v=v||T}!t&&x&&_&&!a(l,o,d,k)&&(p.add(o),h=h||S)}),b.size>0&&w(e=>j(b).reduce((t,r)=>(S(t,D(e,r)),F(r,e)?S(t,r):t),[])),t)return!l&&v&&r(!1),[!1];if(p.size>0||h){let g=[j(p),h];return l||r.apply(0,g),g}},g=new eu(e=>v(e));return g.observe(e,{attributes:!0,attributeOldValue:!0,attributeFilter:h,subtree:t,childList:t,characterData:t}),o=!0,[()=>{o&&(p(),g.disconnect(),o=!1)},()=>{if(o){b.m();let e=g.takeRecords();return!E(e)&&v(e,!0)}}]},rl=e=>e&&(e.height||e.width),ra=(e,t,r)=>{let{Bt:i=!1,Vt:n=!1}=r||{},o=tj().__osSizeObserverPlugin,{B:a}=tI(),s=ee(`
`),u=s[0],c=u.firstChild,d=eL.bind(0,e),[b]=l({o:void 0,_:!0,u:(e,t)=>!(!e||!rl(e)&&rl(t))}),p=e=>{let r=v(e)&&e.length>0&&g(e[0]),n=!r&&m(e[0]),o=!1,l=!1,s=!0;if(r){let[c,,d]=b(e.pop().contentRect),p=rl(c),w=rl(d);o=!d||!p,l=!w&&p,s=!o}else n?[,s]=e:l=!0===e;if(i&&s){let f=n?e[0]:eL(u);I(u,f?a.n?-3333333:a.i?0:3333333:3333333),R(u,3333333)}o||t({vt:!n,Yt:n?e:void 0,Vt:!!l})},w=[],f=!!n&&p;return[()=>{$(w),J(u)},()=>{if(ed){let t=new ed(p);t.observe(c),S(w,()=>{t.disconnect()})}else if(o){let[r,a]=o.O(c,p,n);f=r,S(w,a)}if(i){let[s]=l({o:!d()},d);S(w,eW(u,"scroll",e=>{let t=s(),[r,i]=t;i&&(e$(c,"ltr rtl"),r?eT(c,"rtl"):eT(c,"ltr"),p(t)),eY(e)}))}f&&(eT(u,ts),S(w,eW(u,"animationstart",f,{C:!!ed}))),(ed||o)&&Y(e,u)}]},rs=e=>0===e.h||e.isIntersecting||e.intersectionRatio>0,ru=(e,t)=>{let r,i=Q("os-trinsic-observer"),n=[],[o]=l({o:!1}),a=(e,r)=>{if(e){let i=o(rs(e)),[,n]=i;if(n)return r||t(i),[i]}},s=(e,t)=>{if(e&&e.length>0)return a(e.pop(),t)};return[()=>{$(n),J(i)},()=>{if(ec)(r=new ec(e=>s(e),{root:e})).observe(i),S(n,()=>{r.disconnect()});else{let t=()=>{let e=eR(i);a(e)},[o,l]=ra(i,t);S(n,o),l(),t()}Y(e,i)},()=>{if(r)return s(r.takeRecords(),!0)}]},rc=`[${e9}]`,rd=`.${ti}`,rb=["tabindex"],rp=["wrap","cols","rows"],rw=["id","class","style","open"],rf=(e,t,r)=>{let i,o,a,{Z:s,J:u,tt:c,rt:d,ut:b,ft:p,_t:m}=e,{V:g}=tI(),[y]=l({u:eh,o:{w:0,h:0}},()=>{let e=p(tl,tt),t=p(tn,""),r=t&&I(u),i=t&&R(u);m(tl,tt),m(tn,""),m("",tr,!0);let n=eD(c),o=eD(u),l=eV(u);return m(tl,tt,e),m(tn,"",t),m("",tr),I(u,r),R(u,i),{w:o.w+n.w+l.w,h:o.h+n.h+l.h}}),x=d?rp:rw.concat(rp),k=e_(r,{g:()=>i,v:()=>o,p(e,t){let[r]=e,[i]=t;return[P(r).concat(P(i)).reduce((e,t)=>(e[t]=r[t]||i[t],e),{})]}}),_=e=>{n(e||rb,e=>{if(O(rb,e)>-1){let t=z(s,e);f(t)?z(u,e,t):q(u,e)}})},j=(e,i)=>{let[n,o]=e,l={gt:o};return t({ht:n}),i||r(l),l},E=({vt:e,Yt:i,Vt:n})=>{let o=!1;if(i){let[l,a]=i;o=a,t({bt:l})}(!e||n?r:k)({vt:e,yt:o})},$=(e,t)=>{let[,i]=y(),n={wt:i};return i&&(t||(e?r:k)(n)),n},T=(e,t,r)=>{let i={Ot:t};return t?r||k(i):b||_(e),i},[A,N,L]=c||!g?ru(s,j):[ex,ex,ex],[M,B]=b?[ex,ex]:ra(s,E,{Vt:!0,Bt:!0}),[D,V]=ro(s,!1,T,{Mt:rw,Ht:rw.concat(rb)}),F=b&&ed&&new ed(E.bind(0,{vt:!0}));return F&&F.observe(s),_(),[()=>{A(),M(),a&&a[0](),F&&F.disconnect(),D()},()=>{B(),N()},()=>{let e={},t=V(),r=L(),i=a&&a[1]();return t&&C(e,T.apply(0,S(t,!0))),r&&C(e,j.apply(0,S(r,!0))),i&&C(e,$.apply(0,S(i,!0))),e},e=>{let[t]=e("update.ignoreMutation"),[r,n]=e("update.attributes"),[l,s]=e("update.elementEvents"),[d,p]=e("update.debounce"),f=e=>h(t)&&t(e);if((s||n)&&(a&&(a[1](),a[0]()),a=ro(c||u,!0,$,{Ht:x.concat(r||[]),Pt:l,Dt:rc,kt(e,t){let{target:r,attributeName:i}=e,n=!t&&!!i&&!b&&U(r,rc,rd);return n||!!Z(r,`.${tc}`)||!!f(e)}})),p){if(k.m(),v(d)){let m=d[0],g=d[1];i=w(m)&&m,o=w(g)&&g}else w(d)?(i=d,o=!1):(i=!1,o=!1)}}]},rm={x:0,y:0},rh={K:{t:0,r:0,b:0,l:0},St:!1,M:{marginRight:0,marginBottom:0,marginLeft:0,paddingTop:0,paddingRight:0,paddingBottom:0,paddingLeft:0},zt:rm,Tt:rm,Ct:{x:"hidden",y:"hidden"},Et:{x:!1,y:!1},ht:!1,bt:!1},rv=(e,t)=>{let r=tW(t,{}),i=tY(rh),[n,o,l]=e0(),[a,s]=i,[u,c,d]=tQ(e),b=ri(u,i),p=(e,t,r)=>{let i=P(e).some(t=>e[t]),n=i||!A(t)||r;return n&&l("u",[e,t,r]),n},[w,f,m,h]=rf(u,s,e=>p(b(r,e),{},!1)),v=a.bind(0);return v.jt=e=>n("u",e),v.Nt=()=>{let{W:e,J:t}=u,r=I(e),i=R(e);f(),c(),I(t,r),R(t,i)},v.qt=u,[(e,r)=>{let i=tW(t,e,r);return h(i),p(b(i,m(),r),e,!!r)},v,()=>{o(),w(),d()}]},{round:rg}=Math,ry=e=>{let{width:t,height:r}=eF(e),{w:i,h:n}=eR(e);return{x:rg(t)/i||1,y:rg(r)/n||1}},rx=(e,t,r)=>{let i=t.scrollbars,{button:n,isPrimary:o,pointerType:l}=e,{pointers:a}=i;return 0===n&&o&&i[r?"dragScroll":"clickScroll"]&&(a||[]).includes(l)},rk=(e,t)=>eW(e,"mousedown",eW.bind(0,t,"click",eY,{C:!0,$:!0}),{$:!0}),r_=(e,t,r,i,n,o)=>{let{B:l}=tI(),{Ft:a,Gt:s,Xt:u}=r,c=`scroll${o?"Left":"Top"}`,d=`client${o?"X":"Y"}`,b=o?"width":"height",p=o?"left":"top",w=o?"w":"h",f=o?"x":"y",m=(e,t)=>r=>{let{Tt:d}=n(),b=eR(s)[w]-eR(a)[w],p=t*r/b*d[f],m=eL(u),h=m&&o?l.n||l.i?1:-1:1;i[c]=e+p*h};return eW(s,"pointerdown",r=>{let n=Z(r.target,`.${tf}`)===a;if(rx(r,e,n)){let o=!n&&r.shiftKey,l=()=>eF(a),u=()=>eF(s),w=(e,t)=>(e||l())[p]-(t||u())[p],h=m(i[c]||0,1/ry(i)[f]),v=r[d],g=l(),y=u(),x=g[b],k=w(g,y)+x/2,_=v-y[p],O=n?0:_-k,j=[eW(t,"selectstart",e=>eK(e),{S:!1}),eW(s,"pointermove",e=>{let t=e[d]-v;(n||o)&&h(O+t)})];if(o)h(O);else if(!n){let E=tj().__osClickScrollPlugin;E&&S(j,E.O(h,w,O,x,_))}eW(s,"pointerup",e=>{$(j),s.releasePointerCapture(e.pointerId)},{C:!0}),s.setPointerCapture(r.pointerId)}})},rO=(e,t)=>(r,i,n,o,l,a)=>{let{Xt:s}=r,[u,c]=ek(333),d=!!l.scrollBy,b=!0;return $.bind(0,[eW(s,"pointerenter",()=>{i(tg,!0)}),eW(s,"pointerleave pointercancel",()=>{i(tg)}),eW(s,"wheel",e=>{let{deltaX:t,deltaY:r,deltaMode:n}=e;d&&b&&0===n&&X(s)===o&&l.scrollBy({left:t,top:r,behavior:"smooth"}),b=!1,i(tk,!0),u(()=>{b=!0,i(tk)}),eK(e)},{S:!1,$:!0}),rk(s,n),r_(e,n,r,l,t,a),c])},{min:rS,max:rj,abs:rE,round:r$}=Math,rT=(e,t,r,i)=>{if(i){let n=r?"x":"y",{Tt:o,zt:l}=i,a=l[n],s=o[n];return rj(0,rS(1,a/(a+s)))}let u=r?"w":"h",c=eR(e)[u],d=eR(t)[u];return rj(0,rS(1,c/d))},rP=(e,t,r,i,n,o)=>{let{B:l}=tI(),{Tt:a}=i,s=r$(a[o?"x":"y"]),u=rE(r[`scroll${o?"Left":"Top"}`]),c=l.i?u:s-u,d=rS(1,(o&&n?c:u)/s),b=rT(e,t,o);return 1/b*(1-b)*d},rC=(e,t,r)=>{let{N:i}=tI(),{scrollbars:l}=i(),{slot:a}=l,{ct:s,W:u,Z:c,J:d,lt:b,ot:p,it:w,ut:f}=t,{scrollbars:h}=b?{}:e,{slot:v}=h||{},g=tD([u,c,d],()=>f&&w?u:c,a,v),y=(e,t,r)=>{let i=r?eT:e$;n(e,e=>{i(e.Xt,t)})},x=(e,t)=>{n(e,e=>{let[r,i]=t(e);o(r,i)})},k=(e,t,r)=>{x(e,e=>{let{Ft:i,Gt:n}=e;return[i,{[r?"width":"height"]:`${(100*rT(i,n,r,t)).toFixed(3)}%`}]})},_=(e,t,r)=>{let i=r?"X":"Y";x(e,e=>{let{Ft:n,Gt:o,Xt:l}=e,a=rP(n,o,p,t,eL(l),r);return[n,{transform:a==a?`translate${i}(${(100*a).toFixed(3)}%)`:""}]})},O=[],j=[],T=[],P=(e,t,r)=>{let i=m(r);(!i||r)&&y(j,e,t),i&&r||y(T,e,t)},C=e=>{k(j,e,!0),k(T,e)},A=e=>{_(j,e,!0),_(T,e)},N=e=>{let t=e?j:T,i=E(t)?tv:"",n=Q(`${tc} ${e?tb:tp} ${i}`),o=Q(tw),l=Q(tf),a={Xt:n,Gt:o,Ft:l};return Y(n,o),Y(o,l),S(t,a),S(O,[J.bind(0,n),r(a,P,s,c,p,e)]),a},z=N.bind(0,!0),L=N.bind(0,!1),M=()=>{Y(g,j[0].Xt),Y(g,T[0].Xt),ew(()=>{P(tv)},300)};return z(),L(),[{Ut:C,Wt:A,Zt:P,Jt:{Kt:j,Qt:z,tn:x.bind(0,j)},nn:{Kt:T,Qt:L,tn:x.bind(0,T)}},M,$.bind(0,O)]},rA=(e,t,r,i)=>{let n,o,l,a,s,u=0,c=tY({}),[d]=c,[b,p]=ek(),[w,f]=ek(),[m,h]=ek(100),[v,g]=ek(100),[y,x]=ek(()=>u),[k,_,O]=rC(e,r.qt,rO(t,r)),{Z:S,J:j,ot:E,st:T,ut:P,it:C}=r.qt,{Jt:A,nn:N,Zt:z,Ut:L,Wt:M}=k,{tn:q}=A,{tn:B}=N,D=e=>{let{Xt:t}=e,r=P&&!C&&X(t)===j&&t;return[r,{transform:r?`translate(${I(E)}px, ${R(E)}px)`:""}]},V=(e,t)=>{if(x(),e)z(tx);else{let r=()=>z(tx,!0);u>0&&!t?y(r):r()}},F=()=>{(a=o)&&V(!0)},H=[h,x,g,f,p,O,eW(S,"pointerover",F,{C:!0}),eW(S,"pointerenter",F),eW(S,"pointerleave",()=>{a=!1,o&&V(!1)}),eW(S,"pointermove",()=>{n&&b(()=>{h(),V(!0),v(()=>{n&&V(!1)})})}),eW(T,"scroll",e=>{w(()=>{M(r()),l&&V(!0),m(()=>{l&&!a&&V(!1)})}),i(e),P&&q(D),P&&B(D)})],Z=d.bind(0);return Z.qt=k,Z.Nt=_,[(e,i,a)=>{let{At:c,Lt:d,It:b,yt:p}=a,{A:w}=tI(),f=tW(t,e,i),m=r(),{Tt:h,Ct:v,bt:g}=m,[y,x]=f("showNativeOverlaidScrollbars"),[k,_]=f("scrollbars.theme"),[O,S]=f("scrollbars.visibility"),[j,E]=f("scrollbars.autoHide"),[$]=f("scrollbars.autoHideDelay"),[T,P]=f("scrollbars.dragScroll"),[A,N]=f("scrollbars.clickScroll"),q=y&&w.x&&w.y,I=(e,t)=>{let r="visible"===O||"auto"===O&&"scroll"===e;return z(tm,r,t),r};if(u=$,x&&z("os-theme-none",q),_&&(z(s),z(k,!0),s=k),E&&(n="move"===j,o="leave"===j,V(!(l="never"!==j),!0)),P&&z(tO,T),N&&z(t_,A),b||S){let R=I(v.x,!0),B=I(v.y,!1);z(th,!(R&&B))}(c||d||p)&&(L(m),M(m),z(ty,!h.x,!0),z(ty,!h.y,!1),z(td,g&&!C))},Z,$.bind(0,H)]},rN=(e,t,r)=>{h(e)&&e(t||void 0,r||void 0)},rz=(e,t,r)=>{let{F:i,N:o,Y:l,j:a}=tI(),s=tj(),u=k(e),c=u?e:e.target,d=tZ(c);if(t&&!d){let b=!1,p=e=>{let t=tj().__osOptionsValidationPlugin,r=t&&t.O;return r?r(e,!0):e},w=C({},i(),p(t)),[f,m,h]=e0(r),[v,g,y]=rv(e,w),[x,_,O]=rA(e,w,g,e=>h("scroll",[N,e])),S=(e,t)=>v(e,!!t),j=S.bind(0,{},!0),E=l(j),$=a(j),T=e=>{tX(c),E(),$(),O(),y(),b=!0,h("destroyed",[N,!!e]),m()},N={options(e,t){if(e){let r=t?i():{},n=e2(w,C(r,p(e)));A(n)||(C(w,n),S(n))}return C({},w)},on:f,off(e,t){e&&t&&m(e,t)},state(){let{zt:e,Tt:t,Ct:r,Et:i,K:n,St:o,bt:l}=g();return C({},{overflowEdge:e,overflowAmount:t,overflowStyle:r,hasOverflow:i,padding:n,paddingAbsolute:o,directionRTL:l,destroyed:b})},elements(){let{W:e,Z:t,K:r,J:i,tt:n,ot:o,st:l}=g.qt,{Jt:a,nn:s}=_.qt,u=e=>{let{Ft:t,Gt:r,Xt:i}=e;return{scrollbar:i,track:r,handle:t}},c=e=>{let{Kt:t,Qt:r}=e,i=u(t[0]);return C({},i,{clone(){let e=u(r());return x({},!0,{}),e}})};return C({},{target:e,host:t,padding:r||i,viewport:i,content:n||i,scrollOffsetElement:o,scrollEventElement:l,scrollbarHorizontal:c(a),scrollbarVertical:c(s)})},update:e=>S({},e),destroy:T.bind(0)};return(g.jt((e,t,r)=>{x(t,r,e)}),tH(c,N),n(P(s),e=>rN(s[e],0,N)),tV(g.qt.it,o().cancel,!u&&e.cancel))?(T(!0),N):(g.Nt(),_.Nt(),h("initialized",[N]),g.jt((e,t,r)=>{let{vt:i,yt:n,gt:o,At:l,Lt:a,It:s,wt:u,Ot:c}=e;h("updated",[N,{updateHints:{sizeChanged:i,directionChanged:n,heightIntrinsicChanged:o,overflowEdgeChanged:l,overflowAmountChanged:a,overflowStyleChanged:s,contentMutation:u,hostMutation:c},changedOptions:t,force:r}])}),N.update(!0),N)}return d};rz.plugin=e=>{n(tE(e),e=>rN(e,rz))},rz.valid=e=>{let t=e&&e.elements,r=h(t)&&t();return x(r)&&!!tZ(r.target)},rz.env=()=>{let{k:e,A:t,I:r,B:i,V:n,L:o,X:l,U:a,N:s,q:u,F:c,G:d}=tI();return C({},{scrollbarsSize:e,scrollbarsOverlaid:t,scrollbarsHiding:r,rtlScrollBehavior:i,flexboxGlue:n,cssCustomProperties:o,staticDefaultInitialization:l,staticDefaultOptions:a,getDefaultInitialization:s,setDefaultInitialization:u,getDefaultOptions:c,setDefaultOptions:d})};let rL=()=>{if(typeof window>"u"){let e=()=>{};return[e,e]}let t,r,i=window,n="function"==typeof i.requestIdleCallback,o=i.requestAnimationFrame,l=i.cancelAnimationFrame,a=n?i.requestIdleCallback:o,s=n?i.cancelIdleCallback:l,u=()=>{s(t),l(r)};return[(e,i)=>{u(),t=a(n?()=>{u(),r=o(e)}:e,"object"==typeof i?i:{timeout:2233})},u]},rM=e=>{let{options:t,events:r,defer:n}=e||{},[o,l]=(0,i.useMemo)(rL,[]),a=(0,i.useRef)(null),s=(0,i.useRef)(n),u=(0,i.useRef)(t),c=(0,i.useRef)(r);return(0,i.useEffect)(()=>{s.current=n},[n]),(0,i.useEffect)(()=>{let{current:e}=a;u.current=t,rz.valid(e)&&e.options(t||{},!0)},[t]),(0,i.useEffect)(()=>{let{current:e}=a;c.current=r,rz.valid(e)&&e.on(r||{},!0)},[r]),(0,i.useEffect)(()=>()=>{var e;l(),null==(e=a.current)||e.destroy()},[]),(0,i.useMemo)(()=>[e=>{let t=a.current;if(rz.valid(t))return;let r=s.current,i=u.current||{},n=c.current||{},l=()=>a.current=rz(e,i,n);r?o(l,r):l()},()=>a.current],[])},rq=(e,t)=>{let{element:r="div",options:n,events:o,defer:l,children:a,...s}=e,u=(0,i.useRef)(null),c=(0,i.useRef)(null),[d,b]=rM({options:n,events:o,defer:l});return(0,i.useEffect)(()=>{let{current:e}=u,{current:t}=c;return e&&t&&d({target:e,elements:{viewport:t,content:t}}),()=>{var e;return null==(e=b())?void 0:e.destroy()}},[d,r]),(0,i.useImperativeHandle)(t,()=>({osInstance:b,getElement:()=>u.current}),[]),i.createElement(r,{"data-overlayscrollbars-initialize":"",ref:u,...s},i.createElement("div",{ref:c},a))},rI=(0,i.forwardRef)(rq)},2562:function(e,t,r){var i;!function(n,o){"use strict";var l="function",a="undefined",s="object",u="string",c="model",d="name",b="type",p="vendor",w="version",f="architecture",m="console",h="mobile",v="tablet",g="smarttv",y="wearable",x="embedded",k="Amazon",_="Apple",O="ASUS",S="BlackBerry",j="Browser",E="Chrome",$="Firefox",T="Google",P="Huawei",C="Microsoft",A="Motorola",N="Opera",z="Samsung",L="Sharp",M="Sony",q="Xiaomi",I="Zebra",R="Facebook",B=function(e,t){var r={};for(var i in e)t[i]&&t[i].length%2==0?r[i]=t[i].concat(e[i]):r[i]=e[i];return r},D=function(e){for(var t={},r=0;r0?2===a.length?typeof a[1]==l?this[a[0]]=a[1].call(this,c):this[a[0]]=a[1]:3===a.length?typeof a[1]!==l||a[1].exec&&a[1].test?this[a[0]]=c?c.replace(a[1],a[2]):o:this[a[0]]=c?a[1].call(this,c,a[2]):o:4===a.length&&(this[a[0]]=c?a[3].call(this,c.replace(a[1],a[2])):o):this[a]=c||o;d+=2}},Z=function(e,t){for(var r in t)if(typeof t[r]===s&&t[r].length>0){for(var i=0;i350?H(e,350):e,this},this.setUA(r),this};Y.VERSION="1.0.32",Y.BROWSER=D([d,w,"major"]),Y.CPU=D([f]),Y.DEVICE=D([c,p,b,m,h,g,v,y,x]),Y.ENGINE=Y.OS=D([d,w]),typeof t!==a?("object"!==a&&e.exports&&(t=e.exports=Y),t.UAParser=Y):"function"===l&&r.amdO?o!==(i=(function(){return Y}).call(t,r,t,e))&&(e.exports=i):typeof n!==a&&(n.UAParser=Y);var K=typeof n!==a&&(n.jQuery||n.Zepto);if(K&&!K.ua){var G=new Y;K.ua=G.getResult(),K.ua.get=function(){return G.getUA()},K.ua.set=function(e){G.setUA(e);var t=G.getResult();for(var r in t)K.ua[r]=t[r]}}}("object"==typeof window?window:this)},1670:function(e,t,r){"use strict";r.d(t,{Zo:function(){return a},ah:function(){return o}});var i=r(7378);let n=i.createContext({});function o(e){let t=i.useContext(n);return i.useMemo(()=>"function"==typeof e?e(t):{...t,...e},[t,e])}let l={};function a({components:e,children:t,disableParentContext:r}){let a=o(e);return r&&(a=e||l),i.createElement(n.Provider,{value:a},t)}},9722:function(e,t,r){"use strict";function i(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function n(e){for(var t=1;t=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(i=0;i=0)&&Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}r.d(t,{Z:function(){return i}})}},function(e){var t=function(t){return e(e.s=t)};e.O(0,[774,179],function(){return t(8936),t(5817)}),_N_E=e.O()}]); \ No newline at end of file + */ function n(e,t){if(y(e))for(let r=0;rt(e[r],r,e));return e}function o(e,t){let r=f(t),i=v(t)||r;if(i){let o=r?"":{};if(e){let l=window.getComputedStyle(e,null);o=r?eN(e,l,t):t.reduce((t,r)=>(t[r]=eN(e,l,r),t),o)}return o}e&&n(P(t),r=>ez(e,r,t[r]))}let l=(e,t)=>{let{o:r,u:i,_:n}=e,o=r,l,a=(e,t)=>{let r=o,a=t||(i?!i(r,e):r!==e);return(a||n)&&(o=e,l=r),[o,a,l]},s=e=>a(t(o,l),e),u=e=>[o,!!e,l];return[t?s:a,u]},a=()=>"undefined"!=typeof window,s=a()&&Node.ELEMENT_NODE,{toString:u,hasOwnProperty:c}=Object.prototype,d=e=>void 0===e,b=e=>null===e,p=e=>d(e)||b(e)?`${e}`:u.call(e).replace(/^\[object (.+)\]$/,"$1").toLowerCase(),w=e=>"number"==typeof e,f=e=>"string"==typeof e,m=e=>"boolean"==typeof e,h=e=>"function"==typeof e,v=e=>Array.isArray(e),g=e=>"object"==typeof e&&!v(e)&&!b(e),y=e=>{let t=!!e&&e.length,r=w(t)&&t>-1&&t%1==0;return(!!v(e)||!h(e)&&!!r)&&(!(t>0&&g(e))||t-1 in e)},x=e=>{if(!e||!g(e)||"object"!==p(e))return!1;let t,r="constructor",i=e[r],n=i&&i.prototype,o=c.call(e,r),l=n&&c.call(n,"isPrototypeOf");if(i&&!o&&!l)return!1;for(t in e);return d(t)||c.call(e,t)},k=e=>{let t=HTMLElement;return!!e&&(t?e instanceof t:e.nodeType===s)},_=e=>{let t=Element;return!!e&&(t?e instanceof t:e.nodeType===s)},O=(e,t,r)=>e.indexOf(t,r),S=(e,t,r)=>(!r&&!f(t)&&y(t)?Array.prototype.push.apply(e,t):e.push(t),e),j=e=>{let t=Array.from,r=[];return t&&e?t(e):(e instanceof Set?e.forEach(e=>{S(r,e)}):n(e,e=>{S(r,e)}),r)},E=e=>!!e&&0===e.length,$=(e,t,r)=>{let i=e=>e&&e.apply(void 0,t||[]);n(e,i),r||(e.length=0)},T=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),P=e=>e?Object.keys(e):[],C=(e,t,r,i,o,l,a)=>(("object"!=typeof e||b(e))&&!h(e)&&(e={}),n([t,r,i,o,l,a],t=>{n(P(t),r=>{let i=t[r];if(e===i)return!0;let n=v(i);if(i&&(x(i)||n)){let o=e[r],l=o;n&&!v(o)?l=[]:n||x(o)||(l={}),e[r]=C(l,i)}else e[r]=i})}),e),A=e=>{for(let t in e)return!1;return!0},N=(e,t,r,i)=>{if(d(i))return r?r[e]:t;r&&(f(i)||w(i))&&(r[e]=i)},z=(e,t,r)=>{if(d(r))return e?e.getAttribute(t):null;e&&e.setAttribute(t,r)},L=(e,t,r,i)=>{if(r){let n=z(e,t)||"",o=new Set(n.split(" "));o[i?"add":"delete"](r),z(e,t,j(o).join(" ").trim())}},M=(e,t,r)=>{let i=z(e,t)||"",n=new Set(i.split(" "));return n.has(r)},q=(e,t)=>{e&&e.removeAttribute(t)},I=(e,t)=>N("scrollLeft",0,e,t),R=(e,t)=>N("scrollTop",0,e,t),B=a()&&Element.prototype,D=(e,t)=>{let r=[],i=t?_(t)?t:null:document;return i?S(r,i.querySelectorAll(e)):r},V=(e,t)=>{let r=t?_(t)?t:null:document;return r?r.querySelector(e):null},F=(e,t)=>{if(_(e)){let r=B.matches||B.msMatchesSelector;return r.call(e,t)}return!1},H=e=>e?j(e.childNodes):[],X=e=>e?e.parentElement:null,Z=(e,t)=>{if(_(e)){let r=B.closest;if(r)return r.call(e,t);do{if(F(e,t))return e;e=X(e)}while(e)}return null},U=(e,t,r)=>{let i=e&&Z(e,t),n=e&&V(r,i),o=Z(n,t)===i;return!!i&&!!n&&(i===e||n===e||o&&Z(Z(e,r),t)!==i)},W=(e,t,r)=>{if(r&&e){let i=t,o;y(r)?(o=document.createDocumentFragment(),n(r,e=>{e===i&&(i=e.previousSibling),o.appendChild(e)})):o=r,t&&(i?i!==t&&(i=i.nextSibling):i=e.firstChild),e.insertBefore(o,i||null)}},Y=(e,t)=>{W(e,null,t)},K=(e,t)=>{W(X(e),e,t)},G=(e,t)=>{W(X(e),e&&e.nextSibling,t)},J=e=>{if(y(e))n(j(e),e=>J(e));else if(e){let t=X(e);t&&t.removeChild(e)}},Q=e=>{let t=document.createElement("div");return e&&z(t,"class",e),t},ee=e=>{let t=Q();return t.innerHTML=e.trim(),n(H(t),e=>J(e))},et=e=>e.charAt(0).toUpperCase()+e.slice(1),er=()=>Q().style,ei=["-webkit-","-moz-","-o-","-ms-"],en=["WebKit","Moz","O","MS","webkit","moz","o","ms"],eo={},el={},ea=e=>{let t=el[e];if(T(el,e))return t;let r=et(e),i=er();return n(ei,n=>{let o=n.replace(/-/g,""),l=[e,n+e,o+r,et(o)+r];return!(t=l.find(e=>void 0!==i[e]))}),el[e]=t||""},es=e=>{if(a()){let t=eo[e]||window[e];return T(eo,e)||(n(en,r=>!(t=t||window[r+et(e)])),eo[e]=t),t}},eu=es("MutationObserver"),ec=es("IntersectionObserver"),ed=es("ResizeObserver"),eb=es("cancelAnimationFrame"),ep=es("requestAnimationFrame"),ew=a()&&window.setTimeout,ef=a()&&window.clearTimeout,em=(e,t,r,i)=>{if(e&&t){let o=!0;return n(r,r=>{let n=i?i(e[r]):e[r],l=i?i(t[r]):t[r];n!==l&&(o=!1)}),o}return!1},eh=(e,t)=>em(e,t,["w","h"]),ev=(e,t)=>em(e,t,["x","y"]),eg=(e,t)=>em(e,t,["t","r","b","l"]),ey=(e,t,r)=>em(e,t,["width","height"],r&&(e=>Math.round(e))),ex=()=>{},ek=e=>{let t,r=e?ew:ep,i=e?ef:eb;return[n=>{i(t),t=r(n,h(e)?e():e)},()=>i(t)]},e_=(e,t)=>{let r,i,n,o=ex,{g:l,v:a,p:s}=t||{},u=function(t){o(),ef(r),r=i=void 0,o=ex,e.apply(this,t)},c=e=>s&&i?s(i,e):e,d=()=>{o!==ex&&u(c(n)||n)},b=function(){let e=j(arguments),t=h(l)?l():l,s=w(t)&&t>=0;if(s){let b=h(a)?a():a,p=w(b)&&b>=0,f=t>0?ef:eb,m=c(e),v=m||e,g=u.bind(0,v);o();let y=(t>0?ew:ep)(g,t);o=()=>f(y),p&&!r&&(r=ew(d,b)),i=n=v}else u(e)};return b.m=d,b},{max:eO}=Math,eS=/[^\x20\t\r\n\f]+/g,ej=(e,t,r)=>{let i=e&&e.classList,n,o=0,l=!1;if(i&&t&&f(t)){let a=t.match(eS)||[];for(l=a.length>0;n=a[o++];)l=!!r(i,n)&&l}return l},eE=(e,t)=>ej(e,t,(e,t)=>e.contains(t)),e$=(e,t)=>{ej(e,t,(e,t)=>e.remove(t))},eT=(e,t)=>(ej(e,t,(e,t)=>e.add(t)),e$.bind(0,e,t)),eP={opacity:1,zindex:1},eC=(e,t)=>{let r=t?parseFloat(e):parseInt(e,10);return r==r?r:0},eA=(e,t)=>!eP[e.toLowerCase()]&&w(t)?`${t}px`:t,eN=(e,t,r)=>null!=t?t[r]||t.getPropertyValue(r):e.style[r],ez=(e,t,r)=>{try{let{style:i}=e;d(i[t])?i.setProperty(t,r):i[t]=eA(t,r)}catch(n){}},eL=e=>"rtl"===o(e,"direction"),eM=(e,t,r)=>{let i=t?`${t}-`:"",n=r?`-${r}`:"",l=`${i}top${n}`,a=`${i}right${n}`,s=`${i}bottom${n}`,u=`${i}left${n}`,c=o(e,[l,a,s,u]);return{t:eC(c[l],!0),r:eC(c[a],!0),b:eC(c[s],!0),l:eC(c[u],!0)}},{round:eq}=Math,eI={w:0,h:0},eR=e=>e?{w:e.offsetWidth,h:e.offsetHeight}:eI,eB=e=>e?{w:e.clientWidth,h:e.clientHeight}:eI,eD=e=>e?{w:e.scrollWidth,h:e.scrollHeight}:eI,eV=e=>{let t=parseFloat(o(e,"height"))||0,r=parseFloat(o(e,"width"))||0;return{w:r-eq(r),h:t-eq(t)}},eF=e=>e.getBoundingClientRect(),eH,eX=()=>{if(d(eH)){eH=!1;try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get(){eH=!0}}))}catch(e){}}return eH},eZ=e=>e.split(" "),eU=(e,t,r,i)=>{n(eZ(t),t=>{e.removeEventListener(t,r,i)})},eW=(e,t,r,i)=>{var o;let l=eX(),a=null!=(o=l&&i&&i.S)?o:l,s=i&&i.$||!1,u=i&&i.C||!1,c=[],d=l?{passive:a,capture:s}:s;return n(eZ(t),t=>{let i=u?n=>{e.removeEventListener(t,i,s),r&&r(n)}:r;S(c,eU.bind(null,e,t,i,s)),e.addEventListener(t,i,d)}),$.bind(0,c)},eY=e=>e.stopPropagation(),eK=e=>e.preventDefault(),eG={x:0,y:0},eJ=e=>{let t=e?eF(e):0;return t?{x:t.left+window.pageYOffset,y:t.top+window.pageXOffset}:eG},eQ=(e,t)=>{n(v(t)?t:[t],e)},e0=e=>{let t=new Map,r=(e,r)=>{if(e){let i=t.get(e);eQ(e=>{i&&i[e?"delete":"clear"](e)},r)}else t.forEach(e=>{e.clear()}),t.clear()},i=(e,o)=>{if(f(e)){let l=t.get(e)||new Set;return t.set(e,l),eQ(e=>{h(e)&&l.add(e)},o),r.bind(0,e,o)}m(o)&&o&&r();let a=P(e),s=[];return n(a,t=>{let r=e[t];r&&S(s,i(t,r))}),$.bind(0,s)},o=(e,r)=>{let i=t.get(e);n(j(i),e=>{r&&!E(r)?e.apply(0,r):e()})};return i(e||{}),[i,r,o]},e1=e=>JSON.stringify(e,(e,t)=>{if(h(t))throw Error();return t}),e3={paddingAbsolute:!1,showNativeOverlaidScrollbars:!1,update:{elementEvents:[["img","load"]],debounce:[0,33],attributes:null,ignoreMutation:null},overflow:{x:"scroll",y:"scroll"},scrollbars:{theme:"os-theme-dark",visibility:"auto",autoHide:"never",autoHideDelay:1300,dragScroll:!0,clickScroll:!1,pointers:["mouse","touch","pen"]}},e2=(e,t)=>{let r={},i=P(t).concat(P(e));return n(i,i=>{let n=e[i],o=t[i];if(g(n)&&g(o))C(r[i]={},e2(n,o)),A(r[i])&&delete r[i];else if(T(t,i)&&o!==n){let l=!0;if(v(n)||v(o))try{e1(n)===e1(o)&&(l=!1)}catch(a){}l&&(r[i]=o)}}),r},e6="os-environment",e4=`${e6}-flexbox-glue`,e5=`${e4}-max`,e9="data-overlayscrollbars",e7="data-overlayscrollbars-initialize",e8=`${e9}-overflow-x`,te=`${e9}-overflow-y`,tt="overflowVisible",tr="updating",ti="os-viewport",tn=`${ti}-arrange`,to=`${ti}-scrollbar-hidden`,tl="os-overflow-visible",ta="os-size-observer",ts=`${ta}-appear`,tu=`${ta}-listener`,tc="os-scrollbar",td=`${tc}-rtl`,tb=`${tc}-horizontal`,tp=`${tc}-vertical`,tw=`${tc}-track`,tf=`${tc}-handle`,tm=`${tc}-visible`,th=`${tc}-cornerless`,tv=`${tc}-transitionless`,tg=`${tc}-interaction`,ty=`${tc}-unusable`,tx=`${tc}-auto-hidden`,tk=`${tc}-wheel`,t_=`${tw}-interactive`,tO=`${tf}-interactive`,tS={},tj=()=>tS,tE=e=>{let t=[];return n(v(e)?e:[e],e=>{let r=P(e);n(r,r=>{S(t,tS[r]=e[r])})}),t},t$={boolean:"__TPL_boolean_TYPE__",number:"__TPL_number_TYPE__",string:"__TPL_string_TYPE__",array:"__TPL_array_TYPE__",object:"__TPL_object_TYPE__",function:"__TPL_function_TYPE__",null:"__TPL_null_TYPE__"};t$.number,t$.boolean,t$.array,t$.null,t$.number,t$.array,t$.null,t$.function,t$.null,t$.string,t$.null,t$.array,t$.null;let{round:tT,abs:tP}=Math,tC="__osScrollbarsHidingPlugin",tA,tN=(e,t,r,i)=>{Y(e,t);let n=eB(t),o=eR(t),l=eV(r);return i&&J(t),{x:o.h-n.h+l.h,y:o.w-n.w+l.w}},tz=e=>{let t=!1,r=eT(e,to);try{t="none"===o(e,ea("scrollbar-width"))||"none"===window.getComputedStyle(e,"::-webkit-scrollbar").getPropertyValue("display")}catch(i){}return r(),t},tL=(e,t)=>{let r="hidden";o(e,{overflowX:r,overflowY:r,direction:"rtl"}),I(e,0);let i=eJ(e),n=eJ(t);I(e,-999);let l=eJ(t);return{i:i.x===n.x,n:n.x!==l.x}},tM=(e,t)=>{let r=eT(e,e4),i=eF(e),n=eF(t),o=ey(n,i,!0),l=eT(e,e5),a=eF(e),s=eF(t),u=ey(s,a,!0);return r(),l(),o&&u},tq=()=>{let{body:e}=document,t=ee(`
`),r=t[0],i=r.firstChild,[n,,a]=e0(),[s,u]=l({o:tN(e,r,i),u:ev},tN.bind(0,e,r,i,!0)),[c]=u(),d=tz(r),b={x:0===c.x,y:0===c.y},p={elements:{host:null,padding:!d,viewport:e=>d&&e===e.ownerDocument.body&&e,content:!1},scrollbars:{slot:!0},cancel:{nativeScrollbarsOverlaid:!1,body:null}},w=C({},e3),f=C.bind(0,{},w),m=C.bind(0,{},p),h={k:c,A:b,I:d,L:"-1"===o(r,"zIndex"),B:tL(r,i),V:tM(r,i),Y:n.bind(0,"z"),j:n.bind(0,"r"),N:m,q:e=>C(p,e)&&m(),F:f,G:e=>C(w,e)&&f(),X:C({},p),U:C({},w)},v=window.addEventListener,g=e_(e=>a(e?"z":"r"),{g:33,v:99});if(q(r,"style"),J(r),v("resize",g.bind(0,!1)),!d&&(!b.x||!b.y)){let y;v("resize",()=>{let e=tj()[tC];(y=y||e&&e.R())&&y(h,s,g.bind(0,!0))})}return h},tI=()=>(tA||(tA=tq()),tA),tR=(e,t)=>h(t)?t.apply(0,e):t,tB=(e,t,r,i)=>{let n=d(i)?r:i,o=tR(e,n);return o||t.apply(0,e)},tD=(e,t,r,i)=>{let n=d(i)?r:i,o=tR(e,n);return!!o&&(k(o)?o:t.apply(0,e))},tV=(e,t,r)=>{let{nativeScrollbarsOverlaid:i,body:n}=r||{},{A:o,I:l}=tI(),{nativeScrollbarsOverlaid:a,body:s}=t,u=d(n)?s:n,c=(o.x||o.y)&&(null!=i?i:a),p=e&&(b(u)?!l:u);return!!c||!!p},tF=new WeakMap,tH=(e,t)=>{tF.set(e,t)},tX=e=>{tF.delete(e)},tZ=e=>tF.get(e),tU=(e,t)=>e?t.split(".").reduce((e,t)=>e&&T(e,t)?e[t]:void 0,e):void 0,tW=(e,t,r)=>i=>[tU(e,i),r||void 0!==tU(t,i)],tY=e=>{let t=e;return[()=>t,e=>{t=C({},t,e)}]},tK="tabindex",tG=Q.bind(0,""),tJ=e=>{Y(X(e),H(e)),J(e)},tQ=e=>{let t=tI(),{N:r,I:i}=t,n=tj()[tC],o=n&&n.T,{elements:l}=r(),{host:a,padding:s,viewport:u,content:c}=l,d=k(e),b=d?{}:e,{elements:p}=b,{host:w,padding:f,viewport:m,content:h}=p||{},v=d?e:b.target,g=F(v,"textarea"),y=v.ownerDocument,x=y.documentElement,_=v===y.body,j=y.defaultView,E=tB.bind(0,[v]),T=tD.bind(0,[v]),C=tR.bind(0,[v]),A=E.bind(0,tG,u),N=T.bind(0,tG,c),I=A(m),R=I===v,B=R&&_,D=!R&&N(h),V=!R&&k(I)&&I===D,Z=V&&!!C(c),U=Z?A():I,W=Z?D:N(),Q=B?x:V?U:I,ee=g?E(tG,a,w):v,et=y.activeElement,er=!R&&j.top===j&&et===v,ei={W:v,Z:B?Q:ee,J:Q,K:!R&&T(tG,s,f),tt:V?W:D,nt:!R&&!i&&o&&o(t),ot:B?x:Q,st:B?y:Q,et:j,ct:y,rt:g,it:_,lt:d,ut:R,dt:V,ft:(e,t)=>R?M(Q,e9,t):eE(Q,e),_t:(e,t,r)=>R?L(Q,e9,t,r):(r?eT:e$)(Q,e)},en=P(ei).reduce((e,t)=>{let r=ei[t];return S(e,!!r&&!X(r)&&r)},[]),eo=e=>e?O(en,e)>-1:null,{W:el,Z:ea,K:es,J:eu,tt:ec,nt:ed}=ei,eb=[()=>{q(ea,e9),q(ea,e7),q(el,e7),_&&(q(x,e9),q(x,e7))}],ep=g&&eo(ea),ew=g?el:H([ec,eu,es,ea,el].find(e=>!1===eo(e))),ef=B?el:ec||eu,em=()=>{z(ea,e9,R?"viewport":"host");let e=eT(es,"os-padding"),t=eT(eu,!R&&ti),r=eT(ec,"os-content"),n=_&&!R?eT(X(v),to):ex;if(ep&&(G(el,ea),S(eb,()=>{G(ea,el),J(ea)})),Y(ef,ew),Y(ea,es),Y(es||ea,!R&&eu),Y(eu,ec),S(eb,()=>{n(),q(eu,e8),q(eu,te),eo(ec)&&tJ(ec),eo(eu)&&tJ(eu),eo(es)&&tJ(es),e(),t(),r()}),i&&!R&&S(eb,e$.bind(0,eu,to)),ed&&(K(eu,ed),S(eb,J.bind(0,ed))),er){let o=z(eu,tK);z(eu,tK,"-1"),eu.focus();let l=()=>o?z(eu,tK,o):q(eu,tK),a=eW(y,"pointerdown keydown",()=>{l(),a()});S(eb,[l,a])}else et&&et.focus&&et.focus();ew=0};return[ei,em,$.bind(0,eb)]},t0=(e,t)=>{let{tt:r}=e,[i]=t;return e=>{let{V:t}=tI(),{ht:n}=i(),{gt:l}=e,a=(r||!t)&&l;return a&&o(r,{height:n?"":"100%"}),{vt:a,wt:a}}},t1=(e,t)=>{let[r,i]=t,{Z:n,K:a,J:s,ut:u}=e,[c,d]=l({u:eg,o:eM()},eM.bind(0,n,"padding",""));return(e,t,n)=>{let[l,b]=d(n),{I:p,V:w}=tI(),{bt:f}=r(),{vt:m,wt:h,yt:v}=e,[g,y]=t("paddingAbsolute");(m||b||!w&&h)&&([l,b]=c(n));let x=!u&&(y||v||b);if(x){let k=!g||!a&&!p,_=l.r+l.l,O=l.t+l.b,S={marginRight:k&&!f?-_:0,marginBottom:k?-O:0,marginLeft:k&&f?-_:0,top:k?-l.t:0,right:k?f?-l.r:"auto":0,left:k?f?"auto":-l.l:0,width:k?`calc(100% + ${_}px)`:""},j={paddingTop:k?l.t:0,paddingRight:k?l.r:0,paddingBottom:k?l.b:0,paddingLeft:k?l.l:0};o(a||s,S),o(s,j),i({K:l,St:!k,M:a?j:C({},S,j)})}return{xt:x}}},{max:t3}=Math,t2=t3.bind(0,0),t6="visible",t4="hidden",t5={u:eh,o:{w:0,h:0}},t9={u:ev,o:{x:t4,y:t4}},t7=(e,t)=>{let r=window.devicePixelRatio%1!=0?1:0,i={w:t2(e.w-t.w),h:t2(e.h-t.h)};return{w:i.w>r?i.w:0,h:i.h>r?i.h:0}},t8=(e,t,r)=>r?eT(e,t):e$(e,t),re=e=>0===e.indexOf(t6),rt=(e,t)=>{let[r,i]=t,{Z:n,K:a,J:s,nt:u,ut:c,_t:d,it:b,et:p}=e,{k:w,V:f,I:m,A:h}=tI(),v=tj()[tC],g=!c&&!m&&(h.x||h.y),y=b&&c,[x,k]=l(t5,eV.bind(0,s)),[_,O]=l(t5,eD.bind(0,s)),[S,j]=l(t5),[E,$]=l(t5),[T]=l(t9),P=(e,t)=>{if(o(s,{height:""}),t){let{St:i,K:l}=r(),{$t:a,P:u}=e,c=eV(n),d=eB(n),b="content-box"===o(s,"boxSizing"),p=i||b?l.b+l.t:0,w=!(h.x&&b);o(s,{height:d.h+c.h+(a.x&&w?u.x:0)-p})}},C=(e,t)=>{let r=m||e?0:42,i=(e,i,n)=>{let l=o(s,e),a=t?t[e]:l,u="scroll"===a;return[l,u,u&&!m?i?r:n:0,i&&!!r]},[n,l,a,u]=i("overflowX",h.x,w.x),[c,d,b,p]=i("overflowY",h.y,w.y);return{Ct:{x:n,y:c},$t:{x:l,y:d},P:{x:a,y:b},D:{x:u,y:p}}},A=(e,t,r,i)=>{let n=(e,t)=>{let r=re(e),i=t&&r&&e.replace(`${t6}-`,"")||"";return[t&&!r?e:"",re(i)?"hidden":i]},[o,l]=n(r.x,t.x),[a,s]=n(r.y,t.y);return i.overflowX=l&&a?l:o,i.overflowY=s&&o?s:a,C(e,i)},N=(e,t,i,n)=>{let{P:o,D:l}=e,{x:a,y:s}=l,{x:u,y:c}=o,{M:d}=r(),b=t?"marginLeft":"marginRight",p=t?"paddingLeft":"paddingRight",w=d[b],f=d.marginBottom,m=d[p],h=d.paddingBottom;n.width=`calc(100% + ${c+-1*w}px)`,n[b]=-c+w,n.marginBottom=-u+f,i&&(n[p]=m+(s?c:0),n.paddingBottom=h+(a?u:0))},[M,q]=v?v.H(g,f,s,u,r,C,N):[()=>g,()=>[ex]];return(e,t,l)=>{let{vt:u,Ot:b,wt:w,xt:v,gt:g,yt:I}=e,{ht:R,bt:B}=r(),[D,V]=t("showNativeOverlaidScrollbars"),[F,H]=t("overflow"),X=D&&h.x&&h.y,Z=!c&&!f&&(u||w||b||V||g),U=re(F.x),W=re(F.y),Y=U||W,K=k(l),G=O(l),J=j(l),Q=$(l),ee;if(V&&m&&d(to,"scrollbarHidden",!X),Z&&(ee=C(X),P(ee,R)),u||v||w||I||V){Y&&d(tl,tt,!1);let[et,er]=q(X,B,ee),[ei,en]=K=x(l),[eo,el]=G=_(l),ea=eB(s),es=eo,eu=ea;et(),(el||en||V)&&er&&!X&&M(er,eo,ei,B)&&(eu=eB(s),es=eD(s));let ec={w:t2(t3(eo.w,es.w)+ei.w),h:t2(t3(eo.h,es.h)+ei.h)},ed={w:t2((y?p.innerWidth:eu.w+t2(ea.w-eo.w))+ei.w),h:t2((y?p.innerHeight+ei.h:eu.h+t2(ea.h-eo.h))+ei.h)};Q=E(ed),J=S(t7(ec,ed),l)}let[eb,ep]=Q,[ew,ef]=J,[em,eh]=G,[ev,eg]=K,ey={x:ew.w>0,y:ew.h>0},ex=U&&W&&(ey.x||ey.y)||U&&ey.x&&!ey.y||W&&ey.y&&!ey.x;if(v||I||eg||eh||ep||ef||H||V||Z){let ek={marginRight:0,marginBottom:0,marginLeft:0,width:"",overflowY:"",overflowX:""},e_=A(X,ey,F,ek),eO=M(e_,em,ev,B);c||N(e_,B,eO,ek),Z&&P(e_,R),c?(z(n,e8,ek.overflowX),z(n,te,ek.overflowY)):o(s,ek)}L(n,e9,tt,ex),t8(a,tl,ex),c||t8(s,tl,Y);let[eS,ej]=T(C(X).Ct);return i({Ct:eS,zt:{x:eb.w,y:eb.h},Tt:{x:ew.w,y:ew.h},Et:ey}),{It:ej,At:ep,Lt:ef}}},rr=(e,t,r)=>{let i={},o=t||{},l=P(e).concat(P(o));return n(l,t=>{let n=e[t],l=o[t];i[t]=!!(r||n||l)}),i},ri=(e,t)=>{let{W:r,J:i,_t:o,ut:l}=e,{I:a,A:s,V:u}=tI(),c=!a&&(s.x||s.y),d=[t0(e,t),t1(e,t),rt(e,t)];return(e,t,a)=>{let s=rr(C({vt:!1,xt:!1,yt:!1,gt:!1,At:!1,Lt:!1,It:!1,Ot:!1,wt:!1},t),{},a),b=c||!u,p=b&&I(i),w=b&&R(i);o("",tr,!0);let f=s;return n(d,t=>{f=rr(f,t(f,e,!!a)||{},a)}),I(i,p),R(i,w),o("",tr),l||(I(r,0),R(r,0)),f}},rn=(e,t,r)=>{let i,o=!1,l=()=>{o=!0},a=l=>{if(r){let a=r.reduce((t,r)=>{if(r){let[i,n]=r,o=n&&i&&(l?l(i):D(i,e));o&&o.length&&n&&f(n)&&S(t,[o,n.trim()],!0)}return t},[]);n(a,r=>n(r[0],n=>{let l=r[1],a=i.get(n)||[],s=e.contains(n);if(s){let u=eW(n,l,e=>{o?(u(),i.delete(n)):t(e)});i.set(n,S(a,u))}else $(a),i.delete(n)}))}};return r&&(i=new WeakMap,a()),[l,a]},ro=(e,t,r,i)=>{let o=!1,{Ht:l,Mt:a,Pt:s,Dt:u,Rt:c,kt:d}=i||{},b=e_(()=>{o&&r(!0)},{g:33,v:99}),[p,w]=rn(e,b,s),m=a||[],h=(l||[]).concat(m),v=(o,l)=>{let a=c||ex,s=d||ex,b=new Set,p=new Set,h=!1,v=!1;if(n(o,r=>{let{attributeName:o,target:l,type:c,oldValue:d,addedNodes:w,removedNodes:g}=r,y="attributes"===c,x=e===l,k=y&&f(o)?z(l,o):0,_=0!==k&&d!==k,S=O(m,o)>-1&&_;if(t&&("childList"===c||!x)){let j=y&&_,E=j&&u&&F(l,u),$=E?!a(l,o,d,k):!y||j,T=$&&!s(r,!!E,e,i);n(w,e=>b.add(e)),n(g,e=>b.add(e)),v=v||T}!t&&x&&_&&!a(l,o,d,k)&&(p.add(o),h=h||S)}),b.size>0&&w(e=>j(b).reduce((t,r)=>(S(t,D(e,r)),F(r,e)?S(t,r):t),[])),t)return!l&&v&&r(!1),[!1];if(p.size>0||h){let g=[j(p),h];return l||r.apply(0,g),g}},g=new eu(e=>v(e));return g.observe(e,{attributes:!0,attributeOldValue:!0,attributeFilter:h,subtree:t,childList:t,characterData:t}),o=!0,[()=>{o&&(p(),g.disconnect(),o=!1)},()=>{if(o){b.m();let e=g.takeRecords();return!E(e)&&v(e,!0)}}]},rl=e=>e&&(e.height||e.width),ra=(e,t,r)=>{let{Bt:i=!1,Vt:n=!1}=r||{},o=tj().__osSizeObserverPlugin,{B:a}=tI(),s=ee(`
`),u=s[0],c=u.firstChild,d=eL.bind(0,e),[b]=l({o:void 0,_:!0,u:(e,t)=>!(!e||!rl(e)&&rl(t))}),p=e=>{let r=v(e)&&e.length>0&&g(e[0]),n=!r&&m(e[0]),o=!1,l=!1,s=!0;if(r){let[c,,d]=b(e.pop().contentRect),p=rl(c),w=rl(d);o=!d||!p,l=!w&&p,s=!o}else n?[,s]=e:l=!0===e;if(i&&s){let f=n?e[0]:eL(u);I(u,f?a.n?-3333333:a.i?0:3333333:3333333),R(u,3333333)}o||t({vt:!n,Yt:n?e:void 0,Vt:!!l})},w=[],f=!!n&&p;return[()=>{$(w),J(u)},()=>{if(ed){let t=new ed(p);t.observe(c),S(w,()=>{t.disconnect()})}else if(o){let[r,a]=o.O(c,p,n);f=r,S(w,a)}if(i){let[s]=l({o:!d()},d);S(w,eW(u,"scroll",e=>{let t=s(),[r,i]=t;i&&(e$(c,"ltr rtl"),r?eT(c,"rtl"):eT(c,"ltr"),p(t)),eY(e)}))}f&&(eT(u,ts),S(w,eW(u,"animationstart",f,{C:!!ed}))),(ed||o)&&Y(e,u)}]},rs=e=>0===e.h||e.isIntersecting||e.intersectionRatio>0,ru=(e,t)=>{let r,i=Q("os-trinsic-observer"),n=[],[o]=l({o:!1}),a=(e,r)=>{if(e){let i=o(rs(e)),[,n]=i;if(n)return r||t(i),[i]}},s=(e,t)=>{if(e&&e.length>0)return a(e.pop(),t)};return[()=>{$(n),J(i)},()=>{if(ec)(r=new ec(e=>s(e),{root:e})).observe(i),S(n,()=>{r.disconnect()});else{let t=()=>{let e=eR(i);a(e)},[o,l]=ra(i,t);S(n,o),l(),t()}Y(e,i)},()=>{if(r)return s(r.takeRecords(),!0)}]},rc=`[${e9}]`,rd=`.${ti}`,rb=["tabindex"],rp=["wrap","cols","rows"],rw=["id","class","style","open"],rf=(e,t,r)=>{let i,o,a,{Z:s,J:u,tt:c,rt:d,ut:b,ft:p,_t:m}=e,{V:g}=tI(),[y]=l({u:eh,o:{w:0,h:0}},()=>{let e=p(tl,tt),t=p(tn,""),r=t&&I(u),i=t&&R(u);m(tl,tt),m(tn,""),m("",tr,!0);let n=eD(c),o=eD(u),l=eV(u);return m(tl,tt,e),m(tn,"",t),m("",tr),I(u,r),R(u,i),{w:o.w+n.w+l.w,h:o.h+n.h+l.h}}),x=d?rp:rw.concat(rp),k=e_(r,{g:()=>i,v:()=>o,p(e,t){let[r]=e,[i]=t;return[P(r).concat(P(i)).reduce((e,t)=>(e[t]=r[t]||i[t],e),{})]}}),_=e=>{n(e||rb,e=>{if(O(rb,e)>-1){let t=z(s,e);f(t)?z(u,e,t):q(u,e)}})},j=(e,i)=>{let[n,o]=e,l={gt:o};return t({ht:n}),i||r(l),l},E=({vt:e,Yt:i,Vt:n})=>{let o=!1;if(i){let[l,a]=i;o=a,t({bt:l})}(!e||n?r:k)({vt:e,yt:o})},$=(e,t)=>{let[,i]=y(),n={wt:i};return i&&(t||(e?r:k)(n)),n},T=(e,t,r)=>{let i={Ot:t};return t?r||k(i):b||_(e),i},[A,N,L]=c||!g?ru(s,j):[ex,ex,ex],[M,B]=b?[ex,ex]:ra(s,E,{Vt:!0,Bt:!0}),[D,V]=ro(s,!1,T,{Mt:rw,Ht:rw.concat(rb)}),F=b&&ed&&new ed(E.bind(0,{vt:!0}));return F&&F.observe(s),_(),[()=>{A(),M(),a&&a[0](),F&&F.disconnect(),D()},()=>{B(),N()},()=>{let e={},t=V(),r=L(),i=a&&a[1]();return t&&C(e,T.apply(0,S(t,!0))),r&&C(e,j.apply(0,S(r,!0))),i&&C(e,$.apply(0,S(i,!0))),e},e=>{let[t]=e("update.ignoreMutation"),[r,n]=e("update.attributes"),[l,s]=e("update.elementEvents"),[d,p]=e("update.debounce"),f=e=>h(t)&&t(e);if((s||n)&&(a&&(a[1](),a[0]()),a=ro(c||u,!0,$,{Ht:x.concat(r||[]),Pt:l,Dt:rc,kt(e,t){let{target:r,attributeName:i}=e,n=!t&&!!i&&!b&&U(r,rc,rd);return n||!!Z(r,`.${tc}`)||!!f(e)}})),p){if(k.m(),v(d)){let m=d[0],g=d[1];i=w(m)&&m,o=w(g)&&g}else w(d)?(i=d,o=!1):(i=!1,o=!1)}}]},rm={x:0,y:0},rh={K:{t:0,r:0,b:0,l:0},St:!1,M:{marginRight:0,marginBottom:0,marginLeft:0,paddingTop:0,paddingRight:0,paddingBottom:0,paddingLeft:0},zt:rm,Tt:rm,Ct:{x:"hidden",y:"hidden"},Et:{x:!1,y:!1},ht:!1,bt:!1},rv=(e,t)=>{let r=tW(t,{}),i=tY(rh),[n,o,l]=e0(),[a,s]=i,[u,c,d]=tQ(e),b=ri(u,i),p=(e,t,r)=>{let i=P(e).some(t=>e[t]),n=i||!A(t)||r;return n&&l("u",[e,t,r]),n},[w,f,m,h]=rf(u,s,e=>p(b(r,e),{},!1)),v=a.bind(0);return v.jt=e=>n("u",e),v.Nt=()=>{let{W:e,J:t}=u,r=I(e),i=R(e);f(),c(),I(t,r),R(t,i)},v.qt=u,[(e,r)=>{let i=tW(t,e,r);return h(i),p(b(i,m(),r),e,!!r)},v,()=>{o(),w(),d()}]},{round:rg}=Math,ry=e=>{let{width:t,height:r}=eF(e),{w:i,h:n}=eR(e);return{x:rg(t)/i||1,y:rg(r)/n||1}},rx=(e,t,r)=>{let i=t.scrollbars,{button:n,isPrimary:o,pointerType:l}=e,{pointers:a}=i;return 0===n&&o&&i[r?"dragScroll":"clickScroll"]&&(a||[]).includes(l)},rk=(e,t)=>eW(e,"mousedown",eW.bind(0,t,"click",eY,{C:!0,$:!0}),{$:!0}),r_=(e,t,r,i,n,o)=>{let{B:l}=tI(),{Ft:a,Gt:s,Xt:u}=r,c=`scroll${o?"Left":"Top"}`,d=`client${o?"X":"Y"}`,b=o?"width":"height",p=o?"left":"top",w=o?"w":"h",f=o?"x":"y",m=(e,t)=>r=>{let{Tt:d}=n(),b=eR(s)[w]-eR(a)[w],p=t*r/b*d[f],m=eL(u),h=m&&o?l.n||l.i?1:-1:1;i[c]=e+p*h};return eW(s,"pointerdown",r=>{let n=Z(r.target,`.${tf}`)===a;if(rx(r,e,n)){let o=!n&&r.shiftKey,l=()=>eF(a),u=()=>eF(s),w=(e,t)=>(e||l())[p]-(t||u())[p],h=m(i[c]||0,1/ry(i)[f]),v=r[d],g=l(),y=u(),x=g[b],k=w(g,y)+x/2,_=v-y[p],O=n?0:_-k,j=[eW(t,"selectstart",e=>eK(e),{S:!1}),eW(s,"pointermove",e=>{let t=e[d]-v;(n||o)&&h(O+t)})];if(o)h(O);else if(!n){let E=tj().__osClickScrollPlugin;E&&S(j,E.O(h,w,O,x,_))}eW(s,"pointerup",e=>{$(j),s.releasePointerCapture(e.pointerId)},{C:!0}),s.setPointerCapture(r.pointerId)}})},rO=(e,t)=>(r,i,n,o,l,a)=>{let{Xt:s}=r,[u,c]=ek(333),d=!!l.scrollBy,b=!0;return $.bind(0,[eW(s,"pointerenter",()=>{i(tg,!0)}),eW(s,"pointerleave pointercancel",()=>{i(tg)}),eW(s,"wheel",e=>{let{deltaX:t,deltaY:r,deltaMode:n}=e;d&&b&&0===n&&X(s)===o&&l.scrollBy({left:t,top:r,behavior:"smooth"}),b=!1,i(tk,!0),u(()=>{b=!0,i(tk)}),eK(e)},{S:!1,$:!0}),rk(s,n),r_(e,n,r,l,t,a),c])},{min:rS,max:rj,abs:rE,round:r$}=Math,rT=(e,t,r,i)=>{if(i){let n=r?"x":"y",{Tt:o,zt:l}=i,a=l[n],s=o[n];return rj(0,rS(1,a/(a+s)))}let u=r?"w":"h",c=eR(e)[u],d=eR(t)[u];return rj(0,rS(1,c/d))},rP=(e,t,r,i,n,o)=>{let{B:l}=tI(),{Tt:a}=i,s=r$(a[o?"x":"y"]),u=rE(r[`scroll${o?"Left":"Top"}`]),c=l.i?u:s-u,d=rS(1,(o&&n?c:u)/s),b=rT(e,t,o);return 1/b*(1-b)*d},rC=(e,t,r)=>{let{N:i}=tI(),{scrollbars:l}=i(),{slot:a}=l,{ct:s,W:u,Z:c,J:d,lt:b,ot:p,it:w,ut:f}=t,{scrollbars:h}=b?{}:e,{slot:v}=h||{},g=tD([u,c,d],()=>f&&w?u:c,a,v),y=(e,t,r)=>{let i=r?eT:e$;n(e,e=>{i(e.Xt,t)})},x=(e,t)=>{n(e,e=>{let[r,i]=t(e);o(r,i)})},k=(e,t,r)=>{x(e,e=>{let{Ft:i,Gt:n}=e;return[i,{[r?"width":"height"]:`${(100*rT(i,n,r,t)).toFixed(3)}%`}]})},_=(e,t,r)=>{let i=r?"X":"Y";x(e,e=>{let{Ft:n,Gt:o,Xt:l}=e,a=rP(n,o,p,t,eL(l),r);return[n,{transform:a==a?`translate${i}(${(100*a).toFixed(3)}%)`:""}]})},O=[],j=[],T=[],P=(e,t,r)=>{let i=m(r);(!i||r)&&y(j,e,t),i&&r||y(T,e,t)},C=e=>{k(j,e,!0),k(T,e)},A=e=>{_(j,e,!0),_(T,e)},N=e=>{let t=e?j:T,i=E(t)?tv:"",n=Q(`${tc} ${e?tb:tp} ${i}`),o=Q(tw),l=Q(tf),a={Xt:n,Gt:o,Ft:l};return Y(n,o),Y(o,l),S(t,a),S(O,[J.bind(0,n),r(a,P,s,c,p,e)]),a},z=N.bind(0,!0),L=N.bind(0,!1),M=()=>{Y(g,j[0].Xt),Y(g,T[0].Xt),ew(()=>{P(tv)},300)};return z(),L(),[{Ut:C,Wt:A,Zt:P,Jt:{Kt:j,Qt:z,tn:x.bind(0,j)},nn:{Kt:T,Qt:L,tn:x.bind(0,T)}},M,$.bind(0,O)]},rA=(e,t,r,i)=>{let n,o,l,a,s,u=0,c=tY({}),[d]=c,[b,p]=ek(),[w,f]=ek(),[m,h]=ek(100),[v,g]=ek(100),[y,x]=ek(()=>u),[k,_,O]=rC(e,r.qt,rO(t,r)),{Z:S,J:j,ot:E,st:T,ut:P,it:C}=r.qt,{Jt:A,nn:N,Zt:z,Ut:L,Wt:M}=k,{tn:q}=A,{tn:B}=N,D=e=>{let{Xt:t}=e,r=P&&!C&&X(t)===j&&t;return[r,{transform:r?`translate(${I(E)}px, ${R(E)}px)`:""}]},V=(e,t)=>{if(x(),e)z(tx);else{let r=()=>z(tx,!0);u>0&&!t?y(r):r()}},F=()=>{(a=o)&&V(!0)},H=[h,x,g,f,p,O,eW(S,"pointerover",F,{C:!0}),eW(S,"pointerenter",F),eW(S,"pointerleave",()=>{a=!1,o&&V(!1)}),eW(S,"pointermove",()=>{n&&b(()=>{h(),V(!0),v(()=>{n&&V(!1)})})}),eW(T,"scroll",e=>{w(()=>{M(r()),l&&V(!0),m(()=>{l&&!a&&V(!1)})}),i(e),P&&q(D),P&&B(D)})],Z=d.bind(0);return Z.qt=k,Z.Nt=_,[(e,i,a)=>{let{At:c,Lt:d,It:b,yt:p}=a,{A:w}=tI(),f=tW(t,e,i),m=r(),{Tt:h,Ct:v,bt:g}=m,[y,x]=f("showNativeOverlaidScrollbars"),[k,_]=f("scrollbars.theme"),[O,S]=f("scrollbars.visibility"),[j,E]=f("scrollbars.autoHide"),[$]=f("scrollbars.autoHideDelay"),[T,P]=f("scrollbars.dragScroll"),[A,N]=f("scrollbars.clickScroll"),q=y&&w.x&&w.y,I=(e,t)=>{let r="visible"===O||"auto"===O&&"scroll"===e;return z(tm,r,t),r};if(u=$,x&&z("os-theme-none",q),_&&(z(s),z(k,!0),s=k),E&&(n="move"===j,o="leave"===j,V(!(l="never"!==j),!0)),P&&z(tO,T),N&&z(t_,A),b||S){let R=I(v.x,!0),B=I(v.y,!1);z(th,!(R&&B))}(c||d||p)&&(L(m),M(m),z(ty,!h.x,!0),z(ty,!h.y,!1),z(td,g&&!C))},Z,$.bind(0,H)]},rN=(e,t,r)=>{h(e)&&e(t||void 0,r||void 0)},rz=(e,t,r)=>{let{F:i,N:o,Y:l,j:a}=tI(),s=tj(),u=k(e),c=u?e:e.target,d=tZ(c);if(t&&!d){let b=!1,p=e=>{let t=tj().__osOptionsValidationPlugin,r=t&&t.O;return r?r(e,!0):e},w=C({},i(),p(t)),[f,m,h]=e0(r),[v,g,y]=rv(e,w),[x,_,O]=rA(e,w,g,e=>h("scroll",[N,e])),S=(e,t)=>v(e,!!t),j=S.bind(0,{},!0),E=l(j),$=a(j),T=e=>{tX(c),E(),$(),O(),y(),b=!0,h("destroyed",[N,!!e]),m()},N={options(e,t){if(e){let r=t?i():{},n=e2(w,C(r,p(e)));A(n)||(C(w,n),S(n))}return C({},w)},on:f,off(e,t){e&&t&&m(e,t)},state(){let{zt:e,Tt:t,Ct:r,Et:i,K:n,St:o,bt:l}=g();return C({},{overflowEdge:e,overflowAmount:t,overflowStyle:r,hasOverflow:i,padding:n,paddingAbsolute:o,directionRTL:l,destroyed:b})},elements(){let{W:e,Z:t,K:r,J:i,tt:n,ot:o,st:l}=g.qt,{Jt:a,nn:s}=_.qt,u=e=>{let{Ft:t,Gt:r,Xt:i}=e;return{scrollbar:i,track:r,handle:t}},c=e=>{let{Kt:t,Qt:r}=e,i=u(t[0]);return C({},i,{clone(){let e=u(r());return x({},!0,{}),e}})};return C({},{target:e,host:t,padding:r||i,viewport:i,content:n||i,scrollOffsetElement:o,scrollEventElement:l,scrollbarHorizontal:c(a),scrollbarVertical:c(s)})},update:e=>S({},e),destroy:T.bind(0)};return(g.jt((e,t,r)=>{x(t,r,e)}),tH(c,N),n(P(s),e=>rN(s[e],0,N)),tV(g.qt.it,o().cancel,!u&&e.cancel))?(T(!0),N):(g.Nt(),_.Nt(),h("initialized",[N]),g.jt((e,t,r)=>{let{vt:i,yt:n,gt:o,At:l,Lt:a,It:s,wt:u,Ot:c}=e;h("updated",[N,{updateHints:{sizeChanged:i,directionChanged:n,heightIntrinsicChanged:o,overflowEdgeChanged:l,overflowAmountChanged:a,overflowStyleChanged:s,contentMutation:u,hostMutation:c},changedOptions:t,force:r}])}),N.update(!0),N)}return d};rz.plugin=e=>{n(tE(e),e=>rN(e,rz))},rz.valid=e=>{let t=e&&e.elements,r=h(t)&&t();return x(r)&&!!tZ(r.target)},rz.env=()=>{let{k:e,A:t,I:r,B:i,V:n,L:o,X:l,U:a,N:s,q:u,F:c,G:d}=tI();return C({},{scrollbarsSize:e,scrollbarsOverlaid:t,scrollbarsHiding:r,rtlScrollBehavior:i,flexboxGlue:n,cssCustomProperties:o,staticDefaultInitialization:l,staticDefaultOptions:a,getDefaultInitialization:s,setDefaultInitialization:u,getDefaultOptions:c,setDefaultOptions:d})};let rL=()=>{if(typeof window>"u"){let e=()=>{};return[e,e]}let t,r,i=window,n="function"==typeof i.requestIdleCallback,o=i.requestAnimationFrame,l=i.cancelAnimationFrame,a=n?i.requestIdleCallback:o,s=n?i.cancelIdleCallback:l,u=()=>{s(t),l(r)};return[(e,i)=>{u(),t=a(n?()=>{u(),r=o(e)}:e,"object"==typeof i?i:{timeout:2233})},u]},rM=e=>{let{options:t,events:r,defer:n}=e||{},[o,l]=(0,i.useMemo)(rL,[]),a=(0,i.useRef)(null),s=(0,i.useRef)(n),u=(0,i.useRef)(t),c=(0,i.useRef)(r);return(0,i.useEffect)(()=>{s.current=n},[n]),(0,i.useEffect)(()=>{let{current:e}=a;u.current=t,rz.valid(e)&&e.options(t||{},!0)},[t]),(0,i.useEffect)(()=>{let{current:e}=a;c.current=r,rz.valid(e)&&e.on(r||{},!0)},[r]),(0,i.useEffect)(()=>()=>{var e;l(),null==(e=a.current)||e.destroy()},[]),(0,i.useMemo)(()=>[e=>{let t=a.current;if(rz.valid(t))return;let r=s.current,i=u.current||{},n=c.current||{},l=()=>a.current=rz(e,i,n);r?o(l,r):l()},()=>a.current],[])},rq=(e,t)=>{let{element:r="div",options:n,events:o,defer:l,children:a,...s}=e,u=(0,i.useRef)(null),c=(0,i.useRef)(null),[d,b]=rM({options:n,events:o,defer:l});return(0,i.useEffect)(()=>{let{current:e}=u,{current:t}=c;return e&&t&&d({target:e,elements:{viewport:t,content:t}}),()=>{var e;return null==(e=b())?void 0:e.destroy()}},[d,r]),(0,i.useImperativeHandle)(t,()=>({osInstance:b,getElement:()=>u.current}),[]),i.createElement(r,{"data-overlayscrollbars-initialize":"",ref:u,...s},i.createElement("div",{ref:c},a))},rI=(0,i.forwardRef)(rq)},8936:function(e,t,r){(window.__NEXT_P=window.__NEXT_P||[]).push(["/_app",function(){return r(3504)}])},3504:function(e,t,r){"use strict";r.r(t),r.d(t,{default:function(){return g}});var i=r(9722),n=r(169);function o(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,i=Array(t);r0?2===a.length?typeof a[1]==l?this[a[0]]=a[1].call(this,c):this[a[0]]=a[1]:3===a.length?typeof a[1]!==l||a[1].exec&&a[1].test?this[a[0]]=c?c.replace(a[1],a[2]):o:this[a[0]]=c?a[1].call(this,c,a[2]):o:4===a.length&&(this[a[0]]=c?a[3].call(this,c.replace(a[1],a[2])):o):this[a]=c||o;d+=2}},Z=function(e,t){for(var r in t)if(typeof t[r]===s&&t[r].length>0){for(var i=0;i350?H(e,350):e,this},this.setUA(r),this};Y.VERSION="1.0.32",Y.BROWSER=D([d,w,"major"]),Y.CPU=D([f]),Y.DEVICE=D([c,p,b,m,h,g,v,y,x]),Y.ENGINE=Y.OS=D([d,w]),typeof t!==a?("object"!==a&&e.exports&&(t=e.exports=Y),t.UAParser=Y):"function"===l&&r.amdO?o!==(i=(function(){return Y}).call(t,r,t,e))&&(e.exports=i):typeof n!==a&&(n.UAParser=Y);var K=typeof n!==a&&(n.jQuery||n.Zepto);if(K&&!K.ua){var G=new Y;K.ua=G.getResult(),K.ua.get=function(){return G.getUA()},K.ua.set=function(e){G.setUA(e);var t=G.getResult();for(var r in t)K.ua[r]=t[r]}}}("object"==typeof window?window:this)},1670:function(e,t,r){"use strict";r.d(t,{Zo:function(){return a},ah:function(){return o}});var i=r(7378);let n=i.createContext({});function o(e){let t=i.useContext(n);return i.useMemo(()=>"function"==typeof e?e(t):{...t,...e},[t,e])}let l={};function a({components:e,children:t,disableParentContext:r}){let a=o(e);return r&&(a=e||l),i.createElement(n.Provider,{value:a},t)}},9722:function(e,t,r){"use strict";function i(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function n(e){for(var t=1;t=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(i=0;i=0)&&Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}r.d(t,{Z:function(){return i}})}},function(e){var t=function(t){return e(e.s=t)};e.O(0,[774,179],function(){return t(8936),t(5817)}),_N_E=e.O()}]); \ No newline at end of file diff --git a/docs/_next/static/chunks/pages/index-1465b24e4598396b.js b/docs/_next/static/chunks/pages/index-1465b24e4598396b.js deleted file mode 100644 index bf12362..0000000 --- a/docs/_next/static/chunks/pages/index-1465b24e4598396b.js +++ /dev/null @@ -1,5 +0,0 @@ -(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[405],{42:function(e,s){var l; /*! - Copyright (c) 2018 Jed Watson. - Licensed under the MIT License (MIT), see - http://jedwatson.github.io/classnames -*/ !function(){"use strict";var n={}.hasOwnProperty;function r(){for(var e=[],s=0;s"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"script"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"type"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"="}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:'"text/javascript"'}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"src"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"="}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:'"path/to/overlayscrollbars.js"'}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"defer>"})]})]})})})]}),"\n",(0,o.jsx)(s.h2,{id:"initialization",children:"Initialization"}),"\n",(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": During initialization its expected that the ",(0,o.jsx)("b",{children:"CSS file is loaded and parsed"})," by the browser."]}),"\n"]}),"\n",(0,o.jsxs)(s.p,{children:["You can initialize either directly with an ",(0,o.jsx)(s.code,{children:"Element"})," or with an ",(0,o.jsx)(s.code,{children:"Object"})," where you have more control over the initialization process."]}),"\n",(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"// simple initialization with an element"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"const"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"osInstance"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"="}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"), {});"})]})]})})}),"\n",(0,o.jsx)(s.h3,{id:"bridging-initialization-flickering",children:"Bridging initialization flickering"}),"\n",(0,o.jsx)(s.p,{children:"If you initialize OverlayScrollbars it needs a few milliseconds to create and append all the elements to the DOM.\r\nWhile this period the native scrollbars are still visible and are switched out after the initialization is finished. This is perceived as flickering."}),"\n",(0,o.jsxs)(s.p,{children:["To fix this behavior apply the ",(0,o.jsx)(s.code,{children:"data-overlayscrollbars-initialize"})," attribute to the target element (and ",(0,o.jsx)(s.code,{children:"html"})," element if the target element is ",(0,o.jsx)(s.code,{children:"body"}),")."]}),"\n",(0,o.jsx)(s.h3,{id:"initialization-with-an-object",children:"Initialization with an Object"}),"\n",(0,o.jsxs)("details",{children:[(0,o.jsx)("summary",{children:(0,o.jsx)(s.p,{children:"This is a in depth topic. Click here to read it."})}),(0,o.jsx)("br",{}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,o.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description of all possibilities."]}),"\n"]}),(0,o.jsxs)(s.p,{children:["The only required field is the ",(0,o.jsx)(s.code,{children:"target"})," field. This is the field to which the plugin is applied to.",(0,o.jsx)(s.br,{}),"\n","If you use the object initialization only with the ",(0,o.jsx)(s.code,{children:"target"})," field, the outcome is equivalent to the element initialization:"]}),(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"// Both initializations have the same outcome"})}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"), {});"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"({ target: "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:") }, {});"})]})]})})}),(0,o.jsxs)(s.p,{children:["In the initialization object you can specify how the library is handling generated elements.\r\nFor example you can appoint an existing element as the ",(0,o.jsx)(s.code,{children:"viewport"})," element. Like this the library won't generate it but take the specified element instead:"]}),(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"({ "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" target: "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" elements: {"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" viewport: "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#viewport'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"}, {});"})})]})})}),(0,o.jsx)(s.p,{children:"This is very useful if you have a fixed DOM structure and don't want OverlayScrollbars to generate its own elements. Those cases arise very often when you want an other library to work together with OverlayScrollbars."}),(0,o.jsx)(s.hr,{}),(0,o.jsx)(s.p,{children:"You can also decide to which element the scrollbars should be applied to:"}),(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"({ "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" target: "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" scrollbars: {"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" slot: "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:")."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"parentElement"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"}, {});"})})]})})}),(0,o.jsx)(s.hr,{}),(0,o.jsx)(s.p,{children:"And last but not least you can decide when the initialization should be canceled:"}),(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"({ "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" target: "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" cancel: {"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" nativeScrollbarsOverlaid: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"true"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" body: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"null"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" }"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"}, {});"})})]})})}),(0,o.jsxs)(s.p,{children:["In the above example the initialization is canceled when the native scrollbars are overlaid or when your target is a ",(0,o.jsx)(s.code,{children:"body"})," element and the plugin determined that a initialization to the ",(0,o.jsx)(s.code,{children:"body"})," element would affect native functionality like ",(0,o.jsx)(s.code,{children:"window.scrollTo"}),"."]})]}),"\n",(0,o.jsx)(s.h2,{id:"options",children:"Options"}),"\n",(0,o.jsxs)(s.p,{children:["You can initialize OverlayScrollbars with an initial set of options, which can be changed at any time with the ",(0,o.jsx)(s.code,{children:"options"})," method:"]}),"\n",(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"), {"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" overflow: {"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" x: "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'hidden'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"});"})})]})})}),"\n",(0,o.jsx)(s.h3,{id:"options-in-depth",children:"Options in depth"}),"\n",(0,o.jsxs)("details",{children:[(0,o.jsx)("summary",{children:(0,o.jsx)(s.p,{children:"This is a in depth topic. Click here to read it."})}),(0,o.jsx)("br",{}),(0,o.jsx)(s.p,{children:"The default options are:"}),(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"const"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"defaultOptions"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"="}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" paddingAbsolute: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"false"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" showNativeOverlaidScrollbars: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"false"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" update: {"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" elementEvents: [["}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'img'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'load'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"]],"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" debounce: ["}),(0,o.jsx)(s.span,{style:{color:"#D33682"},children:"0"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,o.jsx)(s.span,{style:{color:"#D33682"},children:"33"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"],"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" attributes: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"null"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" ignoreMutation: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"null"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" overflow: {"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" x: "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'scroll'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" y: "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'scroll'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" scrollbars: {"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" theme: "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'os-theme-dark'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" visibility: "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'auto'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" autoHide: "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'never'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" autoHideDelay: "}),(0,o.jsx)(s.span,{style:{color:"#D33682"},children:"1300"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" dragScroll: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"true"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" clickScroll: "}),(0,o.jsx)(s.span,{style:{color:"#B58900"},children:"false"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" pointers: ["}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'mouse'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'touch'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'pen'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"],"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"};"})})]})})}),(0,o.jsx)(s.h3,{id:"paddingabsolute",children:(0,o.jsx)(s.code,{children:"paddingAbsolute"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"boolean"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"false"})})]})})]}),(0,o.jsx)(s.p,{children:"Indicates whether the padding for the content shall be absolute."}),(0,o.jsx)(s.h3,{id:"shownativeoverlaidscrollbars",children:(0,o.jsx)(s.code,{children:"showNativeOverlaidScrollbars"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"boolean"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"false"})})]})})]}),(0,o.jsx)(s.p,{children:"Indicates whether the native overlaid scrollbars shall be visible."}),(0,o.jsx)(s.h3,{id:"updateelementevents",children:(0,o.jsx)(s.code,{children:"update.elementEvents"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"Array<[string, string]> | null"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"[['img', 'load']]"})})]})})]}),(0,o.jsxs)(s.p,{children:["An array of tuples. The first value in the tuple is an ",(0,o.jsx)(s.code,{children:"selector"})," and the second value are ",(0,o.jsx)(s.code,{children:"event names"}),'. The plugin will update itself if any of the elements with the specified selector will emit any specified event. The default value can be interpreted as "The plugin will update itself if any ',(0,o.jsx)(s.code,{children:"img"})," element emits an ",(0,o.jsx)(s.code,{children:"load"}),' event."']}),(0,o.jsx)(s.h3,{id:"updatedebounce",children:(0,o.jsx)(s.code,{children:"update.debounce"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"[number, number] | number | null"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"[0, 33]"})})]})})]}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": If 0 is used for the timeout, ",(0,o.jsx)(s.code,{children:"requestAnimationFrame"})," instead of ",(0,o.jsx)(s.code,{children:"setTimeout"})," is used for the debounce."]}),"\n"]}),(0,o.jsxs)(s.p,{children:["Debounces the ",(0,o.jsx)(s.code,{children:"MutationObserver"})," which tracks changes to the content. If a ",(0,o.jsx)(s.strong,{children:"tuple"})," is passed, the first value is the timeout and second is the max wait. If only a ",(0,o.jsx)(s.strong,{children:"number"})," is passed you specify only the timeout and there is no max wait. With ",(0,o.jsx)(s.strong,{children:"null"})," there is no debounce. ",(0,o.jsx)(s.strong,{children:"Usefull to fine-tune performance."})]}),(0,o.jsx)(s.h3,{id:"updateattributes",children:(0,o.jsx)(s.code,{children:"update.attributes"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"string[] | null"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"null"})})]})})]}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": There is a base array of attributes that the ",(0,o.jsx)(s.code,{children:"MutationObserver"})," always observes, even if this option is ",(0,o.jsx)(s.code,{children:"null"}),"."]}),"\n"]}),(0,o.jsxs)(s.p,{children:["An array of additional attributes that the ",(0,o.jsx)(s.code,{children:"MutationObserver"})," should observe for the content."]}),(0,o.jsx)(s.h3,{id:"updateignoremutation",children:(0,o.jsx)(s.code,{children:"update.ignoreMutation"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"((mutation) => any) | null"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"null"})})]})})]}),(0,o.jsxs)(s.p,{children:["A function which receives a ",(0,o.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/MutationRecord",children:(0,o.jsx)(s.code,{children:"MutationRecord"})})," as an argument. If the function returns a truthy value the mutation will be ignored and the plugin won't update. ",(0,o.jsx)(s.strong,{children:"Usefull to fine-tune performance."})]}),(0,o.jsx)(s.h3,{id:"overflowx",children:(0,o.jsx)(s.code,{children:"overflow.x"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"string"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"'scroll'"})})]})})]}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,o.jsx)(s.code,{children:"'hidden'"}),", ",(0,o.jsx)(s.code,{children:"'scroll'"}),", ",(0,o.jsx)(s.code,{children:"'visible'"}),", ",(0,o.jsx)(s.code,{children:"'visible-hidden'"})," and ",(0,o.jsx)(s.code,{children:"'visible-scroll'"}),"."]}),"\n"]}),(0,o.jsx)(s.p,{children:"The overflow behavior for the horizontal (x) axis."}),(0,o.jsx)(s.h3,{id:"overflowy",children:(0,o.jsx)(s.code,{children:"overflow.y"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"string"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"'scroll'"})})]})})]}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,o.jsx)(s.code,{children:"'hidden'"}),", ",(0,o.jsx)(s.code,{children:"'scroll'"}),", ",(0,o.jsx)(s.code,{children:"'visible'"}),", ",(0,o.jsx)(s.code,{children:"'visible-hidden'"})," and ",(0,o.jsx)(s.code,{children:"'visible-scroll'"}),"."]}),"\n"]}),(0,o.jsx)(s.p,{children:"The overflow behavior for the vertical (y) axis."}),(0,o.jsx)(s.h3,{id:"scrollbarstheme",children:(0,o.jsx)(s.code,{children:"scrollbars.theme"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"string | null"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"'os-theme-dark'"})})]})})]}),(0,o.jsx)(s.p,{children:"Applies the specified theme (classname) to the scrollbars."}),(0,o.jsx)(s.h3,{id:"scrollbarsvisibility",children:(0,o.jsx)(s.code,{children:"scrollbars.visibility"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"string"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"'auto'"})})]})})]}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,o.jsx)(s.code,{children:"'visible'"}),", ",(0,o.jsx)(s.code,{children:"'hidden'"}),", and ",(0,o.jsx)(s.code,{children:"'auto'"}),"."]}),"\n"]}),(0,o.jsx)(s.p,{children:"The base visibility of the scrollbars."}),(0,o.jsx)(s.h3,{id:"scrollbarsautohide",children:(0,o.jsx)(s.code,{children:"scrollbars.autoHide"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"string"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"'never'"})})]})})]}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,o.jsx)(s.code,{children:"'never'"}),", ",(0,o.jsx)(s.code,{children:"'scroll'"}),", ",(0,o.jsx)(s.code,{children:"'leave'"})," and ",(0,o.jsx)(s.code,{children:"'move'"}),"."]}),"\n"]}),(0,o.jsx)(s.p,{children:"The possibility to hide visible scrollbars automatically after a certain user action."}),(0,o.jsx)(s.h3,{id:"scrollbarsautohidedelay",children:(0,o.jsx)(s.code,{children:"scrollbars.autoHideDelay"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"number"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"1300"})})]})})]}),(0,o.jsx)(s.p,{children:"The delay in milliseconds before the scrollbars are hidden automatically."}),(0,o.jsx)(s.h3,{id:"scrollbarsdragscroll",children:(0,o.jsx)(s.code,{children:"scrollbars.dragScroll"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"boolean"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"true"})})]})})]}),(0,o.jsx)(s.p,{children:"Indicates whether you can drag the scrollbar handles for scrolling."}),(0,o.jsx)(s.h3,{id:"scrollbarsclickscroll",children:(0,o.jsx)(s.code,{children:"scrollbars.clickScroll"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"boolean"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"false"})})]})})]}),(0,o.jsx)(s.p,{children:"Indicates whether you can click on the scrollbar track for scrolling."}),(0,o.jsx)(s.h3,{id:"scrollbarspointers",children:(0,o.jsx)(s.code,{children:"scrollbars.pointers"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"type"}),(0,o.jsx)(s.th,{align:"left",children:"default"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"string[] | null"})}),(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"['mouse', 'touch', 'pen']"})})]})})]}),(0,o.jsxs)(s.p,{children:["The ",(0,o.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType",children:(0,o.jsx)(s.code,{children:"PointerTypes"})})," the plugin should react to."]})]}),"\n",(0,o.jsx)(s.h2,{id:"events",children:"Events"}),"\n",(0,o.jsxs)(s.p,{children:["You can initialize OverlayScrollbars with an initial set of events, which can be managed at any time with the ",(0,o.jsx)(s.code,{children:"on"})," and ",(0,o.jsx)(s.code,{children:"off"})," methods:"]}),"\n",(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"), {}, {"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"updated"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"(osInstance, onUpdatedArgs) {"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"// ..."})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" }"})}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"});"})})]})})}),"\n",(0,o.jsx)(s.h3,{id:"events-in-depth",children:"Events in depth"}),"\n",(0,o.jsxs)("details",{children:[(0,o.jsx)("summary",{children:(0,o.jsx)(s.p,{children:"This is a in depth topic. Click here to read it."})}),(0,o.jsx)("br",{}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": Every event receives the ",(0,o.jsx)(s.code,{children:"instance"})," from which it was invoked as the first argument. Always."]}),"\n"]}),(0,o.jsx)(s.h3,{id:"initialized",children:(0,o.jsx)(s.code,{children:"initialized"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"arguments"}),(0,o.jsx)(s.th,{align:"left",children:"description"})]})}),(0,o.jsx)(s.tbody,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"instance"})}),(0,o.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]})})]}),(0,o.jsx)(s.p,{children:"Is invoked after all generated elements, observers and events were appended to the DOM."}),(0,o.jsx)(s.h3,{id:"updated",children:(0,o.jsx)(s.code,{children:"updated"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"arguments"}),(0,o.jsx)(s.th,{align:"left",children:"description"})]})}),(0,o.jsxs)(s.tbody,{children:[(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"instance"})}),(0,o.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]}),(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"onUpdatedArgs"})}),(0,o.jsxs)(s.td,{align:"left",children:["An ",(0,o.jsx)(s.code,{children:"object"})," which describes the update in detail."]})]})]})]}),(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": If an update was triggered but nothing changed, the event won't be invoked."]}),"\n"]}),(0,o.jsx)(s.p,{children:"Is invoked after the instace was updated."}),(0,o.jsx)(s.h3,{id:"destroyed",children:(0,o.jsx)(s.code,{children:"destroyed"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"arguments"}),(0,o.jsx)(s.th,{align:"left",children:"description"})]})}),(0,o.jsxs)(s.tbody,{children:[(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"instance"})}),(0,o.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]}),(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"canceled"})}),(0,o.jsxs)(s.td,{align:"left",children:["An ",(0,o.jsx)(s.code,{children:"boolean"})," which indicates whether the initialization was canceled and thus destroyed."]})]})]})]}),(0,o.jsx)(s.p,{children:"Is invoked after all generated elements, observers and events were removed from the DOM."}),(0,o.jsx)(s.h3,{id:"scroll",children:(0,o.jsx)(s.code,{children:"scroll"})}),(0,o.jsxs)(s.table,{children:[(0,o.jsx)(s.thead,{children:(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.th,{align:"left",children:"arguments"}),(0,o.jsx)(s.th,{align:"left",children:"description"})]})}),(0,o.jsxs)(s.tbody,{children:[(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"instance"})}),(0,o.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]}),(0,o.jsxs)(s.tr,{children:[(0,o.jsx)(s.td,{align:"left",children:(0,o.jsx)(s.code,{children:"event"})}),(0,o.jsxs)(s.td,{align:"left",children:["The original ",(0,o.jsx)(s.code,{children:"event"})," argument of the DOM event."]})]})]})]}),(0,o.jsx)(s.p,{children:"Is invoked by scrolling the viewport."})]}),"\n",(0,o.jsx)(s.h2,{id:"instance",children:"Instance"}),"\n",(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,o.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description."]}),"\n"]}),"\n",(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"ts","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"ts","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"interface"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"options"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"Options"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"options"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"(newOptions"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"PartialOptions"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", pure"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"Options"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"on"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"(eventListeners"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListeners"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", pure"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" () "}),(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"=>"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"on"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">)"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" () "}),(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"=>"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"on"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">[])"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" () "}),(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"=>"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"off"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">)"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"off"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:">[])"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"update"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"(force"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"state"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"State"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"elements"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"Elements"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"destroy"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"}"})})]})})}),"\n",(0,o.jsx)(s.h2,{id:"static-methods",children:"Static Methods"}),"\n",(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,o.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description."]}),"\n"]}),"\n",(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"ts","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"ts","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"interface"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbarsStatic"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" (target"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"InitializationTarget"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"|"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"undefined"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" (target"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"InitializationTarget"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", options"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"PartialOptions"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", eventListeners"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListeners"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"plugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"(plugin"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"Plugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"|"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"Plugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"[])"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"valid"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"(osInstance"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"any"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" osInstance "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"is"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"env"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#CB4B16"},children:"Environment"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"}"})})]})})}),"\n",(0,o.jsx)(s.h2,{id:"plugins",children:"Plugins"}),"\n",(0,o.jsx)(s.p,{children:"Everything thats considered not core functionality or old browser compatibility is exposed via a plugin. This is done because all unused plugins are treeshaken and thus won't end up in your final bundle. OverlayScrollbars comes with the following plugins:"}),"\n",(0,o.jsxs)(s.ul,{children:["\n",(0,o.jsxs)(s.li,{children:[(0,o.jsx)(s.strong,{children:"ScrollbarsHidingPlugin"}),": Is needed for old browsers which aren't supporting nativ scrollbar styling features. ",(0,o.jsx)(s.a,{href:"https://caniuse.com/?search=scrollbar%20styling",children:"You can find the list of browsers where you need this plugin here"})," (note that even though ",(0,o.jsx)(s.code,{children:"iOS Safari >= 14"})," is marked as unsupported you only need this plugin for ",(0,o.jsx)(s.code,{children:"iOS < 7.1"}),")."]}),"\n",(0,o.jsxs)(s.li,{children:[(0,o.jsx)(s.strong,{children:"SizeObserverPlugin"}),": Is needed for old browsers which aren't supporting the ",(0,o.jsx)(s.code,{children:"ResizeObserver"})," api. ",(0,o.jsx)(s.a,{href:"https://caniuse.com/?search=ResizeObserver",children:"You can find the list of browsers where you need this plugin here"})]}),"\n",(0,o.jsxs)(s.li,{children:[(0,o.jsx)(s.strong,{children:"ClickScrollPlugin"}),": If you want to use the option ",(0,o.jsx)(s.code,{children:"scrollbars: { clickScroll: true }"}),"."]}),"\n"]}),"\n",(0,o.jsx)(s.h3,{id:"consuming-plugins",children:"Consuming Plugins"}),"\n",(0,o.jsx)(s.p,{children:"Plugins are consumed like:"}),"\n",(0,o.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,o.jsx)(s.pre,{"data-language":"ts","data-theme":"default",children:(0,o.jsxs)(s.code,{"data-language":"ts","data-theme":"default",children:[(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#859900"},children:"import"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" { "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"ScrollbarsHidingPlugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"SizeObserverPlugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"ClickScrollPlugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "})]}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"} "}),(0,o.jsx)(s.span,{style:{color:"#859900"},children:"from"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,o.jsx)(s.span,{style:{color:"#2AA198"},children:"'overlayscrollbars'"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"// single plugin"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"plugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"ScrollbarsHidingPlugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:");"})]}),"\n",(0,o.jsx)(s.span,{className:"line"}),"\n",(0,o.jsx)(s.span,{className:"line",children:(0,o.jsx)(s.span,{style:{color:"#93A1A1"},children:"// multiple plugins"})}),"\n",(0,o.jsxs)(s.span,{className:"line",children:[(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"plugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"(["}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"SizeObserverPlugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,o.jsx)(s.span,{style:{color:"#268BD2"},children:"ClickScrollPlugin"}),(0,o.jsx)(s.span,{style:{color:"#657B83"},children:"]);"})]})]})})}),"\n",(0,o.jsx)(s.h3,{id:"writing-plugins",children:"Writing Plugins"}),"\n",(0,o.jsxs)(s.blockquote,{children:["\n",(0,o.jsxs)(s.p,{children:[(0,o.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,o.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description."]}),"\n"]}),"\n",(0,o.jsx)(s.p,{children:"You can write and publish your own Plugins. This section is a work in progress."}),"\n",(0,o.jsxs)(s.h2,{id:"feature-comparison-to-v1",children:["Feature comparison to ",(0,o.jsx)(s.code,{children:"v1"})]}),"\n",(0,o.jsxs)(s.ul,{children:["\n",(0,o.jsxs)(s.li,{children:["The ",(0,o.jsx)(s.code,{children:"scroll"})," function is missing. Planned as a ",(0,o.jsx)(s.code,{children:"plugin"}),". (WIP)"]}),"\n",(0,o.jsxs)(s.li,{children:["Initialization to the ",(0,o.jsx)(s.code,{children:"textarea"})," element isn't supported yet. Planned as a ",(0,o.jsx)(s.code,{children:"plugin"}),". (WIP)"]}),"\n"]}),"\n",(0,o.jsx)(s.h2,{id:"future-plans",children:"Future Plans"}),"\n",(0,o.jsxs)(s.ul,{children:["\n",(0,o.jsx)(s.li,{children:"Provide plugin based support for missing features. (treeshakeable)"}),"\n",(0,o.jsx)(s.li,{children:"Frequent updates in terms of bug-fixes and enhancements. (always use latest browser features)"}),"\n",(0,o.jsx)(s.li,{children:"Improve tests. (unit & browser tests)"}),"\n"]}),"\n",(0,o.jsx)(s.h2,{id:"license",children:"License"}),"\n",(0,o.jsx)(s.p,{children:"MIT"})]})}var B=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},s=Object.assign({},(0,m.ah)(),e.components).wrapper;return s?(0,o.jsx)(s,Object.assign({},e,{children:(0,o.jsx)(f,e)})):f(e)},b=l(4028),v=l.n(b),w=function(e){return(0,o.jsx)("div",{className:"my-6 text-center font-medium text-sm uppercase relative",children:(0,o.jsxs)("span",{className:"p-3 bg-white",children:[e,(0,o.jsx)("div",{className:"absolute block top-1/2 left-1/2 w-[100%] xs:w-[80%] border-t-[1px] border-slate-300 translate-x-[-50%] translate-y-[-50%] z-[-1]"})]})})},N=function(){return(0,o.jsxs)(h,{className:"px-6",children:[(0,o.jsx)("div",{className:"mt-8 flex justify-center items-center h-[33vh] min-h-32 max-h-40 xxs:max-h-44",children:(0,o.jsx)("div",{className:a()("h-full",v().logo),children:(0,o.jsx)("img",{src:j.src,className:"h-full",alt:"OverlayScrollbars Logo",width:"200",height:"200"})})}),(0,o.jsxs)("h1",{className:"text-center xxs:text-4xl text-2xl font-bold my-11",children:["Overlay",(0,o.jsx)("wbr",{}),"Scrollbars"]}),(0,o.jsx)("p",{className:"text-center mx-auto max-w-screen-sm my-11 font-medium",children:"A javascript scrollbar plugin that hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling."}),w("used by"),(0,o.jsx)(x.E,{defer:!0,children:(0,o.jsx)("div",{className:"flex justify-center",children:(0,o.jsxs)("div",{className:a()("inline-flex items-center gap-6 py-6",v().usedBy),children:[(0,o.jsx)("div",{className:"h-11 px-3 flex-grow flex-shrink-0",style:{filter:"brightness(0.35)"},children:(0,o.jsx)("img",{className:"h-full",src:p.src,alt:""})}),(0,o.jsx)("div",{className:"h-11 px-3 py-1.5 flex-grow flex-shrink-0",children:(0,o.jsx)("img",{className:"h-full",src:y.src,alt:""})}),(0,o.jsx)("div",{className:"h-11 p-3 flex-grow flex-shrink-0",children:(0,o.jsx)("img",{className:"h-full",src:u.src,alt:""})})]})})}),w((0,o.jsxs)("a",{href:"https://github.com/KingSora/OverlayScrollbars",target:"_blank",rel:"noreferrer",children:[(0,o.jsx)(d,{className:"inline-block w-11 hover:scale-110 text-primary-dark hover:text-primary-blue1 active:text-primary-blue2 transition-transformColor ease-in-out duration-300",svg:g,icon:"github"}),(0,o.jsx)("span",{className:"sr-only",children:"OverlayScrollbars on Github"})]})),(0,o.jsxs)("p",{className:"text-center text-sm text-primary-gray2 mx-auto max-w-screen-sm my-11 font-medium",children:["This page is a work in progress. For now refer to the TypeScript definitions for a more detailed documentation.",(0,o.jsx)("br",{}),"Looking for the v1 docs?"," ",(0,o.jsx)("a",{href:"v1",className:"text-primary-blue2 underline",children:"Follow this link"}),"."]}),(0,o.jsxs)("div",{className:"mx-auto flex sm:flex-row justify-center gap-2 items-center flex-wrap",children:[(0,o.jsx)("a",{href:"https://www.npmjs.com/package/overlayscrollbars",children:(0,o.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/npm/dm/overlayscrollbars.svg?style=flat-square",alt:"Downloads"})}),(0,o.jsx)("a",{href:"https://www.npmjs.com/package/overlayscrollbars",children:(0,o.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/npm/v/overlayscrollbars.svg?style=flat-square",alt:"Version"})}),(0,o.jsx)("a",{href:"https://github.com/KingSora/OverlayScrollbars/blob/master/LICENSE",children:(0,o.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/github/license/kingsora/overlayscrollbars.svg?style=flat-square",alt:"License"})}),(0,o.jsx)("a",{href:"https://app.codecov.io/gh/KingSora/OverlayScrollbars",children:(0,o.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/codecov/c/github/KingSora/OverlayScrollbars?style=flat-square",alt:"Code Coverage"})}),(0,o.jsx)("a",{href:"https://bundlephobia.com/package/overlayscrollbars",children:(0,o.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/bundlephobia/minzip/overlayscrollbars?label=max.%20bundle%20size&style=flat-square",alt:"Max. Bundle Size"})})]}),(0,o.jsx)("div",{className:"mt-11 prose prose-primary mx-auto pb-32",children:(0,o.jsx)(B,{})})]})}},4028:function(e){e.exports={logo:"assets_logo__UC59w",usedBySeparator:"assets_usedBySeparator__yqt5h",usedBy:"assets_usedBy__FHTGG"}}},function(e){e.O(0,[774,888,179],function(){return e(e.s=2766)}),_N_E=e.O()}]); \ No newline at end of file diff --git a/docs/_next/static/chunks/pages/index-8ddcd3e778eaf347.js b/docs/_next/static/chunks/pages/index-8ddcd3e778eaf347.js new file mode 100644 index 0000000..9f86176 --- /dev/null +++ b/docs/_next/static/chunks/pages/index-8ddcd3e778eaf347.js @@ -0,0 +1,5 @@ +(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[405],{42:function(e,s){var l; /*! + Copyright (c) 2018 Jed Watson. + Licensed under the MIT License (MIT), see + http://jedwatson.github.io/classnames +*/ !function(){"use strict";var n={}.hasOwnProperty;function r(){for(var e=[],s=0;s"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"script"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"type"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"="}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:'"text/javascript"'}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"src"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"="}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:'"path/to/overlayscrollbars.js"'}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"defer>"})]})]})})})]}),"\n",(0,t.jsx)(s.h2,{id:"initialization",children:"Initialization"}),"\n",(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": During initialization its expected that the ",(0,t.jsx)("b",{children:"CSS file is loaded and parsed"})," by the browser."]}),"\n"]}),"\n",(0,t.jsxs)(s.p,{children:["You can initialize either directly with an ",(0,t.jsx)(s.code,{children:"Element"})," or with an ",(0,t.jsx)(s.code,{children:"Object"})," where you have more control over the initialization process."]}),"\n",(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"// simple initialization with an element"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"const"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"osInstance"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"="}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"), {});"})]})]})})}),"\n",(0,t.jsx)(s.h3,{id:"bridging-initialization-flickering",children:"Bridging initialization flickering"}),"\n",(0,t.jsx)(s.p,{children:"If you initialize OverlayScrollbars it needs a few milliseconds to create and append all the elements to the DOM.\r\nWhile this period the native scrollbars are still visible and are switched out after the initialization is finished. This is perceived as flickering."}),"\n",(0,t.jsxs)(s.p,{children:["To fix this behavior apply the ",(0,t.jsx)(s.code,{children:"data-overlayscrollbars-initialize"})," attribute to the target element (and ",(0,t.jsx)(s.code,{children:"html"})," element if the target element is ",(0,t.jsx)(s.code,{children:"body"}),")."]}),"\n",(0,t.jsx)(s.h3,{id:"initialization-with-an-object",children:"Initialization with an Object"}),"\n",(0,t.jsxs)("details",{children:[(0,t.jsx)("summary",{children:(0,t.jsx)(s.p,{children:"This is a in depth topic. Click here to read it."})}),(0,t.jsx)("br",{}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,t.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description of all possibilities."]}),"\n"]}),(0,t.jsxs)(s.p,{children:["The only required field is the ",(0,t.jsx)(s.code,{children:"target"})," field. This is the field to which the plugin is applied to.",(0,t.jsx)(s.br,{}),"\n","If you use the object initialization only with the ",(0,t.jsx)(s.code,{children:"target"})," field, the outcome is equivalent to the element initialization:"]}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"// Both initializations have the same outcome"})}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"), {});"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"({ target: "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:") }, {});"})]})]})})}),(0,t.jsxs)(s.p,{children:["In the initialization object you can specify how the library is handling generated elements.\r\nFor example you can appoint an existing element as the ",(0,t.jsx)(s.code,{children:"viewport"})," element. Like this the library won't generate it but take the specified element instead:"]}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"({ "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" target: "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" elements: {"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" viewport: "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#viewport'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"}, {});"})})]})})}),(0,t.jsx)(s.p,{children:"This is very useful if you have a fixed DOM structure and don't want OverlayScrollbars to generate its own elements. Those cases arise very often when you want an other library to work together with OverlayScrollbars."}),(0,t.jsx)(s.hr,{}),(0,t.jsx)(s.p,{children:"You can also decide to which element the scrollbars should be applied to:"}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"({ "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" target: "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" scrollbars: {"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" slot: "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:")."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"parentElement"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"}, {});"})})]})})}),(0,t.jsx)(s.hr,{}),(0,t.jsx)(s.p,{children:"And last but not least you can decide when the initialization should be canceled:"}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"({ "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" target: "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#target'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"),"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" cancel: {"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" nativeScrollbarsOverlaid: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"true"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" body: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"null"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" }"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"}, {});"})})]})})}),(0,t.jsxs)(s.p,{children:["In the above example the initialization is canceled when the native scrollbars are overlaid or when your target is a ",(0,t.jsx)(s.code,{children:"body"})," element and the plugin determined that a initialization to the ",(0,t.jsx)(s.code,{children:"body"})," element would affect native functionality like ",(0,t.jsx)(s.code,{children:"window.scrollTo"}),"."]})]}),"\n",(0,t.jsx)(s.h2,{id:"options",children:"Options"}),"\n",(0,t.jsxs)(s.p,{children:["You can initialize OverlayScrollbars with an initial set of options, which can be changed at any time with the ",(0,t.jsx)(s.code,{children:"options"})," method:"]}),"\n",(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"), {"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" overflow: {"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" x: "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'hidden'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"});"})})]})})}),"\n",(0,t.jsx)(s.h3,{id:"options-in-depth",children:"Options in depth"}),"\n",(0,t.jsxs)("details",{children:[(0,t.jsx)("summary",{children:(0,t.jsx)(s.p,{children:"This is a in depth topic. Click here to read it."})}),(0,t.jsx)("br",{}),(0,t.jsx)(s.p,{children:"The default options are:"}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"const"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"defaultOptions"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"="}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" paddingAbsolute: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"false"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" showNativeOverlaidScrollbars: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"false"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" update: {"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" elementEvents: [["}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'img'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'load'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"]],"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" debounce: ["}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"0"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"33"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"],"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" attributes: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"null"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" ignoreMutation: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"null"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" overflow: {"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" x: "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'scroll'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" y: "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'scroll'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" scrollbars: {"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" theme: "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'os-theme-dark'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" visibility: "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'auto'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" autoHide: "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'never'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" autoHideDelay: "}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"1300"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" dragScroll: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"true"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" clickScroll: "}),(0,t.jsx)(s.span,{style:{color:"#B58900"},children:"false"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:","})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" pointers: ["}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'mouse'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'touch'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'pen'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"],"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" },"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"};"})})]})})}),(0,t.jsx)(s.h3,{id:"paddingabsolute",children:(0,t.jsx)(s.code,{children:"paddingAbsolute"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"boolean"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"false"})})]})})]}),(0,t.jsx)(s.p,{children:"Indicates whether the padding for the content shall be absolute."}),(0,t.jsx)(s.h3,{id:"shownativeoverlaidscrollbars",children:(0,t.jsx)(s.code,{children:"showNativeOverlaidScrollbars"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"boolean"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"false"})})]})})]}),(0,t.jsx)(s.p,{children:"Indicates whether the native overlaid scrollbars shall be visible."}),(0,t.jsx)(s.h3,{id:"updateelementevents",children:(0,t.jsx)(s.code,{children:"update.elementEvents"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"Array<[string, string]> | null"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"[['img', 'load']]"})})]})})]}),(0,t.jsxs)(s.p,{children:["An array of tuples. The first value in the tuple is an ",(0,t.jsx)(s.code,{children:"selector"})," and the second value are ",(0,t.jsx)(s.code,{children:"event names"}),'. The plugin will update itself if any of the elements with the specified selector will emit any specified event. The default value can be interpreted as "The plugin will update itself if any ',(0,t.jsx)(s.code,{children:"img"})," element emits an ",(0,t.jsx)(s.code,{children:"load"}),' event."']}),(0,t.jsx)(s.h3,{id:"updatedebounce",children:(0,t.jsx)(s.code,{children:"update.debounce"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"[number, number] | number | null"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"[0, 33]"})})]})})]}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": If 0 is used for the timeout, ",(0,t.jsx)(s.code,{children:"requestAnimationFrame"})," instead of ",(0,t.jsx)(s.code,{children:"setTimeout"})," is used for the debounce."]}),"\n"]}),(0,t.jsxs)(s.p,{children:["Debounces the ",(0,t.jsx)(s.code,{children:"MutationObserver"})," which tracks changes to the content. If a ",(0,t.jsx)(s.strong,{children:"tuple"})," is passed, the first value is the timeout and second is the max wait. If only a ",(0,t.jsx)(s.strong,{children:"number"})," is passed you specify only the timeout and there is no max wait. With ",(0,t.jsx)(s.strong,{children:"null"})," there is no debounce. ",(0,t.jsx)(s.strong,{children:"Usefull to fine-tune performance."})]}),(0,t.jsx)(s.h3,{id:"updateattributes",children:(0,t.jsx)(s.code,{children:"update.attributes"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"string[] | null"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"null"})})]})})]}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": There is a base array of attributes that the ",(0,t.jsx)(s.code,{children:"MutationObserver"})," always observes, even if this option is ",(0,t.jsx)(s.code,{children:"null"}),"."]}),"\n"]}),(0,t.jsxs)(s.p,{children:["An array of additional attributes that the ",(0,t.jsx)(s.code,{children:"MutationObserver"})," should observe for the content."]}),(0,t.jsx)(s.h3,{id:"updateignoremutation",children:(0,t.jsx)(s.code,{children:"update.ignoreMutation"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"((mutation) => any) | null"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"null"})})]})})]}),(0,t.jsxs)(s.p,{children:["A function which receives a ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/MutationRecord",children:(0,t.jsx)(s.code,{children:"MutationRecord"})})," as an argument. If the function returns a truthy value the mutation will be ignored and the plugin won't update. ",(0,t.jsx)(s.strong,{children:"Usefull to fine-tune performance."})]}),(0,t.jsx)(s.h3,{id:"overflowx",children:(0,t.jsx)(s.code,{children:"overflow.x"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"string"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"'scroll'"})})]})})]}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,t.jsx)(s.code,{children:"'hidden'"}),", ",(0,t.jsx)(s.code,{children:"'scroll'"}),", ",(0,t.jsx)(s.code,{children:"'visible'"}),", ",(0,t.jsx)(s.code,{children:"'visible-hidden'"})," and ",(0,t.jsx)(s.code,{children:"'visible-scroll'"}),"."]}),"\n"]}),(0,t.jsx)(s.p,{children:"The overflow behavior for the horizontal (x) axis."}),(0,t.jsx)(s.h3,{id:"overflowy",children:(0,t.jsx)(s.code,{children:"overflow.y"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"string"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"'scroll'"})})]})})]}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,t.jsx)(s.code,{children:"'hidden'"}),", ",(0,t.jsx)(s.code,{children:"'scroll'"}),", ",(0,t.jsx)(s.code,{children:"'visible'"}),", ",(0,t.jsx)(s.code,{children:"'visible-hidden'"})," and ",(0,t.jsx)(s.code,{children:"'visible-scroll'"}),"."]}),"\n"]}),(0,t.jsx)(s.p,{children:"The overflow behavior for the vertical (y) axis."}),(0,t.jsx)(s.h3,{id:"scrollbarstheme",children:(0,t.jsx)(s.code,{children:"scrollbars.theme"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"string | null"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"'os-theme-dark'"})})]})})]}),(0,t.jsx)(s.p,{children:"Applies the specified theme (classname) to the scrollbars."}),(0,t.jsx)(s.h3,{id:"scrollbarsvisibility",children:(0,t.jsx)(s.code,{children:"scrollbars.visibility"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"string"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"'auto'"})})]})})]}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,t.jsx)(s.code,{children:"'visible'"}),", ",(0,t.jsx)(s.code,{children:"'hidden'"}),", and ",(0,t.jsx)(s.code,{children:"'auto'"}),"."]}),"\n"]}),(0,t.jsx)(s.p,{children:"The base visibility of the scrollbars."}),(0,t.jsx)(s.h3,{id:"scrollbarsautohide",children:(0,t.jsx)(s.code,{children:"scrollbars.autoHide"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"string"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"'never'"})})]})})]}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": Valid values are: ",(0,t.jsx)(s.code,{children:"'never'"}),", ",(0,t.jsx)(s.code,{children:"'scroll'"}),", ",(0,t.jsx)(s.code,{children:"'leave'"})," and ",(0,t.jsx)(s.code,{children:"'move'"}),"."]}),"\n"]}),(0,t.jsx)(s.p,{children:"The possibility to hide visible scrollbars automatically after a certain user action."}),(0,t.jsx)(s.h3,{id:"scrollbarsautohidedelay",children:(0,t.jsx)(s.code,{children:"scrollbars.autoHideDelay"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"number"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"1300"})})]})})]}),(0,t.jsx)(s.p,{children:"The delay in milliseconds before the scrollbars are hidden automatically."}),(0,t.jsx)(s.h3,{id:"scrollbarsdragscroll",children:(0,t.jsx)(s.code,{children:"scrollbars.dragScroll"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"boolean"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"true"})})]})})]}),(0,t.jsx)(s.p,{children:"Indicates whether you can drag the scrollbar handles for scrolling."}),(0,t.jsx)(s.h3,{id:"scrollbarsclickscroll",children:(0,t.jsx)(s.code,{children:"scrollbars.clickScroll"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"boolean"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"false"})})]})})]}),(0,t.jsx)(s.p,{children:"Indicates whether you can click on the scrollbar track for scrolling."}),(0,t.jsx)(s.h3,{id:"scrollbarspointers",children:(0,t.jsx)(s.code,{children:"scrollbars.pointers"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"type"}),(0,t.jsx)(s.th,{align:"left",children:"default"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"string[] | null"})}),(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"['mouse', 'touch', 'pen']"})})]})})]}),(0,t.jsxs)(s.p,{children:["The ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType",children:(0,t.jsx)(s.code,{children:"PointerTypes"})})," the plugin should react to."]})]}),"\n",(0,t.jsx)(s.h2,{id:"events",children:"Events"}),"\n",(0,t.jsxs)(s.p,{children:["You can initialize OverlayScrollbars with an initial set of events, which can be managed at any time with the ",(0,t.jsx)(s.code,{children:"on"})," and ",(0,t.jsx)(s.code,{children:"off"})," methods:"]}),"\n",(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"document"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"querySelector"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'#myElement'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"), {}, {"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"updated"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"(osInstance, onUpdatedArgs) {"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"// ..."})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" }"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"});"})})]})})}),"\n",(0,t.jsx)(s.h3,{id:"events-in-depth",children:"Events in depth"}),"\n",(0,t.jsxs)("details",{children:[(0,t.jsx)("summary",{children:(0,t.jsx)(s.p,{children:"This is a in depth topic. Click here to read it."})}),(0,t.jsx)("br",{}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": Every event receives the ",(0,t.jsx)(s.code,{children:"instance"})," from which it was invoked as the first argument. Always."]}),"\n"]}),(0,t.jsx)(s.h3,{id:"initialized",children:(0,t.jsx)(s.code,{children:"initialized"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"arguments"}),(0,t.jsx)(s.th,{align:"left",children:"description"})]})}),(0,t.jsx)(s.tbody,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"instance"})}),(0,t.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]})})]}),(0,t.jsx)(s.p,{children:"Is invoked after all generated elements, observers and events were appended to the DOM."}),(0,t.jsx)(s.h3,{id:"updated",children:(0,t.jsx)(s.code,{children:"updated"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"arguments"}),(0,t.jsx)(s.th,{align:"left",children:"description"})]})}),(0,t.jsxs)(s.tbody,{children:[(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"instance"})}),(0,t.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]}),(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"onUpdatedArgs"})}),(0,t.jsxs)(s.td,{align:"left",children:["An ",(0,t.jsx)(s.code,{children:"object"})," which describes the update in detail."]})]})]})]}),(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": If an update was triggered but nothing changed, the event won't be invoked."]}),"\n"]}),(0,t.jsx)(s.p,{children:"Is invoked after the instace was updated."}),(0,t.jsx)(s.h3,{id:"destroyed",children:(0,t.jsx)(s.code,{children:"destroyed"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"arguments"}),(0,t.jsx)(s.th,{align:"left",children:"description"})]})}),(0,t.jsxs)(s.tbody,{children:[(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"instance"})}),(0,t.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]}),(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"canceled"})}),(0,t.jsxs)(s.td,{align:"left",children:["An ",(0,t.jsx)(s.code,{children:"boolean"})," which indicates whether the initialization was canceled and thus destroyed."]})]})]})]}),(0,t.jsx)(s.p,{children:"Is invoked after all generated elements, observers and events were removed from the DOM."}),(0,t.jsx)(s.h3,{id:"scroll",children:(0,t.jsx)(s.code,{children:"scroll"})}),(0,t.jsxs)(s.table,{children:[(0,t.jsx)(s.thead,{children:(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.th,{align:"left",children:"arguments"}),(0,t.jsx)(s.th,{align:"left",children:"description"})]})}),(0,t.jsxs)(s.tbody,{children:[(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"instance"})}),(0,t.jsx)(s.td,{align:"left",children:"The instance which invoked the event."})]}),(0,t.jsxs)(s.tr,{children:[(0,t.jsx)(s.td,{align:"left",children:(0,t.jsx)(s.code,{children:"event"})}),(0,t.jsxs)(s.td,{align:"left",children:["The original ",(0,t.jsx)(s.code,{children:"event"})," argument of the DOM event."]})]})]})]}),(0,t.jsx)(s.p,{children:"Is invoked by scrolling the viewport."})]}),"\n",(0,t.jsx)(s.h2,{id:"instance",children:"Instance"}),"\n",(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,t.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description."]}),"\n"]}),"\n",(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"ts","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"ts","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"interface"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"options"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"Options"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"options"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"(newOptions"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"PartialOptions"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", pure"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"Options"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"on"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"(eventListeners"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListeners"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", pure"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" () "}),(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"=>"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"on"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">)"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" () "}),(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"=>"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"on"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">[])"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" () "}),(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"=>"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"off"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">)"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"off"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"extends"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"keyof"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListenerArgs"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">(name"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", listener"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListener"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"<"}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"N"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:">[])"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"update"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"(force"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"boolean"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"state"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"State"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"elements"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"Elements"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"destroy"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"}"})})]})})}),"\n",(0,t.jsx)(s.h2,{id:"static-methods",children:"Static Methods"}),"\n",(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,t.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description."]}),"\n"]}),"\n",(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"ts","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"ts","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"interface"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbarsStatic"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" (target"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"InitializationTarget"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"|"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"undefined"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" (target"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"InitializationTarget"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", options"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"PartialOptions"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", eventListeners"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"?:"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"EventListeners"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"plugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"(plugin"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"Plugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"|"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"Plugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"[])"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"void"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"valid"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"(osInstance"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"any"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:")"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" osInstance "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"is"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"env"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"()"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:":"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#CB4B16"},children:"Environment"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"}"})})]})})}),"\n",(0,t.jsx)(s.h2,{id:"plugins",children:"Plugins"}),"\n",(0,t.jsx)(s.p,{children:"Everything thats considered not core functionality or old browser compatibility is exposed via a plugin. This is done because all unused plugins are treeshaken and thus won't end up in your final bundle. OverlayScrollbars comes with the following plugins:"}),"\n",(0,t.jsxs)(s.ul,{children:["\n",(0,t.jsxs)(s.li,{children:[(0,t.jsx)(s.strong,{children:"ScrollbarsHidingPlugin"}),": Is needed for old browsers which aren't supporting nativ scrollbar styling features. ",(0,t.jsx)(s.a,{href:"https://caniuse.com/?search=scrollbar%20styling",children:"You can find the list of browsers where you need this plugin here"})," (note that even though ",(0,t.jsx)(s.code,{children:"iOS Safari >= 14"})," is marked as unsupported you only need this plugin for ",(0,t.jsx)(s.code,{children:"iOS < 7.1"}),")."]}),"\n",(0,t.jsxs)(s.li,{children:[(0,t.jsx)(s.strong,{children:"SizeObserverPlugin"}),": Is needed for old browsers which aren't supporting the ",(0,t.jsx)(s.code,{children:"ResizeObserver"})," api. ",(0,t.jsx)(s.a,{href:"https://caniuse.com/?search=ResizeObserver",children:"You can find the list of browsers where you need this plugin here"})]}),"\n",(0,t.jsxs)(s.li,{children:[(0,t.jsx)(s.strong,{children:"ClickScrollPlugin"}),": If you want to use the option ",(0,t.jsx)(s.code,{children:"scrollbars: { clickScroll: true }"}),"."]}),"\n"]}),"\n",(0,t.jsx)(s.h3,{id:"consuming-plugins",children:"Consuming Plugins"}),"\n",(0,t.jsx)(s.p,{children:"Plugins are consumed like:"}),"\n",(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"ts","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"ts","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#859900"},children:"import"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" { "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"ScrollbarsHidingPlugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"SizeObserverPlugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"ClickScrollPlugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"} "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"from"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#2AA198"},children:"'overlayscrollbars'"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"// single plugin"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"plugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"("}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"ScrollbarsHidingPlugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:");"})]}),"\n",(0,t.jsx)(s.span,{className:"line"}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"// multiple plugins"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"OverlayScrollbars"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"plugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"(["}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"SizeObserverPlugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"ClickScrollPlugin"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"]);"})]})]})})}),"\n",(0,t.jsx)(s.h3,{id:"writing-plugins",children:"Writing Plugins"}),"\n",(0,t.jsxs)(s.blockquote,{children:["\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.strong,{children:"Note"}),": For now please refer to the ",(0,t.jsx)("b",{children:"TypeScript definitions"})," for a more detailed description."]}),"\n"]}),"\n",(0,t.jsx)(s.p,{children:"You can write and publish your own Plugins. This section is a work in progress."}),"\n",(0,t.jsx)(s.h2,{id:"faq",children:"FAQ"}),"\n",(0,t.jsxs)("details",{children:[(0,t.jsx)("summary",{children:(0,t.jsxs)(s.p,{children:["How do I ",(0,t.jsx)("code",{children:"get"})," the ",(0,t.jsx)("code",{children:"scroll position"})," of an element I applied the OverlayScrollbars to?"]})}),(0,t.jsx)("br",{}),(0,t.jsxs)(s.p,{children:["If you applied ",(0,t.jsx)(s.code,{children:"OverlayScrollbars"})," to the ",(0,t.jsx)(s.code,{children:"body"})," element you can use ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollX",children:(0,t.jsx)(s.code,{children:"window.scrollX"})}),", ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollY",children:(0,t.jsx)(s.code,{children:"window.scrollY"})})," or any other native api."]}),(0,t.jsxs)(s.p,{children:["If the plugin was applied to any other element you have to get the ",(0,t.jsx)(s.code,{children:"instance"})," first. With the instance you can get the ",(0,t.jsx)(s.code,{children:"viewport"})," element. With this element you can use ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTop",children:(0,t.jsx)(s.code,{children:"element.scrollTop"})}),", ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft",children:(0,t.jsx)(s.code,{children:"element.scrollLeft"})})," or any other native api."]}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"const"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" { "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"viewport"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" } "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"="}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"osInstance"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"elements"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"();"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"const"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" { "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"scrollLeft"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:", "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"scrollTop"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" } "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"="}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"viewport"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]})]})})})]}),"\n",(0,t.jsxs)("details",{children:[(0,t.jsx)("summary",{children:(0,t.jsxs)(s.p,{children:["How do I ",(0,t.jsx)("code",{children:"set"})," the ",(0,t.jsx)("code",{children:"scroll position"})," of an element I applied the OverlayScrollbars to?"]})}),(0,t.jsx)("br",{}),(0,t.jsxs)(s.p,{children:["If you applied ",(0,t.jsx)(s.code,{children:"OverlayScrollbars"})," to the ",(0,t.jsx)(s.code,{children:"body"})," element you can scroll it with ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/scroll",children:(0,t.jsx)(s.code,{children:"window.scroll"})}),", ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo",children:(0,t.jsx)(s.code,{children:"window.scrollTo"})}),", ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollBy",children:(0,t.jsx)(s.code,{children:"window.scrollBy"})})," or any other native api."]}),(0,t.jsxs)(s.p,{children:["If the plugin was applied to any other element you have to get the ",(0,t.jsx)(s.code,{children:"instance"})," first. With the instance you can get the ",(0,t.jsx)(s.code,{children:"viewport"})," element. With this element you can use ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Element/scroll",children:(0,t.jsx)(s.code,{children:"element.scroll"})}),", ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTo",children:(0,t.jsx)(s.code,{children:"element.scrollTo"})}),", ",(0,t.jsx)(s.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollBy",children:(0,t.jsx)(s.code,{children:"element.scrollBy"})})," or any other native api."]}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"js","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"js","data-theme":"default",children:[(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#586E75",fontStyle:"italic"},children:"const"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" { "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"viewport"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" } "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"="}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"osInstance"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"elements"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"();"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"viewport"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"."}),(0,t.jsx)(s.span,{style:{color:"#268BD2"},children:"scrollTo"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"({ top: "}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"0"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" });"})]})]})})})]}),"\n",(0,t.jsxs)("details",{children:[(0,t.jsx)("summary",{children:(0,t.jsxs)(s.p,{children:["Is it possible to ",(0,t.jsx)("code",{children:"limit / adjust the scrollbar handle length"}),"?"]})}),(0,t.jsx)("br",{}),(0,t.jsxs)(s.p,{children:["You can adjust a scrollbars handle length by setting a ",(0,t.jsx)(s.code,{children:"min-width / min-height"})," and ",(0,t.jsx)(s.code,{children:"max-width / max-height"})," style:"]}),(0,t.jsx)(s.div,{"data-rehype-pretty-code-fragment":"",children:(0,t.jsx)(s.pre,{"data-language":"css","data-theme":"default",children:(0,t.jsxs)(s.code,{"data-language":"css","data-theme":"default",children:[(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"/* horizontal boundaries */"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:".os-scrollbar-horizontal"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:".os-scrollbar-handle"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"min-width"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:": "}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"50"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"px"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"max-width"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:": "}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"200"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"px"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"}"})}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:"/* vertical boundaries */"})}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:".os-scrollbar-vertical"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#93A1A1"},children:".os-scrollbar-handle"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" {"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"min-height"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:": "}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"40"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"px"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsxs)(s.span,{className:"line",children:[(0,t.jsx)(s.span,{style:{color:"#657B83"},children:" "}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"max-height"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:": "}),(0,t.jsx)(s.span,{style:{color:"#D33682"},children:"40"}),(0,t.jsx)(s.span,{style:{color:"#859900"},children:"px"}),(0,t.jsx)(s.span,{style:{color:"#657B83"},children:";"})]}),"\n",(0,t.jsx)(s.span,{className:"line",children:(0,t.jsx)(s.span,{style:{color:"#657B83"},children:"}"})})]})})}),(0,t.jsxs)(s.p,{children:["You can assign the same value to both properties to force the scrollbar to be always the same size.",(0,t.jsx)(s.br,{}),"\n","Setting the ",(0,t.jsx)(s.code,{children:"width"})," and ",(0,t.jsx)(s.code,{children:"height"})," properties won't work since those are set by the plugin automatically."]})]}),"\n",(0,t.jsxs)(s.h2,{id:"feature-comparison-to-v1",children:["Feature comparison to ",(0,t.jsx)(s.code,{children:"v1"})]}),"\n",(0,t.jsxs)(s.ul,{children:["\n",(0,t.jsxs)(s.li,{children:["The ",(0,t.jsx)(s.code,{children:"scroll"})," function is missing. Planned as a ",(0,t.jsx)(s.code,{children:"plugin"}),". (WIP)"]}),"\n",(0,t.jsxs)(s.li,{children:["Initialization to the ",(0,t.jsx)(s.code,{children:"textarea"})," element isn't supported yet. Planned as a ",(0,t.jsx)(s.code,{children:"plugin"}),". (WIP)"]}),"\n"]}),"\n",(0,t.jsx)(s.h2,{id:"future-plans",children:"Future Plans"}),"\n",(0,t.jsxs)(s.ul,{children:["\n",(0,t.jsx)(s.li,{children:"Provide plugin based support for missing features. (treeshakeable)"}),"\n",(0,t.jsx)(s.li,{children:"Frequent updates in terms of bug-fixes and enhancements. (always use latest browser features)"}),"\n",(0,t.jsx)(s.li,{children:"Improve tests. (unit & browser tests)"}),"\n"]}),"\n",(0,t.jsx)(s.h2,{id:"license",children:"License"}),"\n",(0,t.jsx)(s.p,{children:"MIT"})]})}var f=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},s=Object.assign({},(0,g.ah)(),e.components).wrapper;return s?(0,t.jsx)(s,Object.assign({},e,{children:(0,t.jsx)(B,e)})):B(e)},b=l(4028),v=l.n(b),w=function(e){return(0,t.jsx)("div",{className:"my-6 text-center font-medium text-sm uppercase relative",children:(0,t.jsxs)("span",{className:"p-3 bg-white",children:[e,(0,t.jsx)("div",{className:"absolute block top-1/2 left-1/2 w-[100%] xs:w-[80%] border-t-[1px] border-slate-300 translate-x-[-50%] translate-y-[-50%] z-[-1]"})]})})},N=function(){return(0,t.jsxs)(h,{className:"px-6",children:[(0,t.jsx)("div",{className:"mt-8 flex justify-center items-center h-[33vh] min-h-32 max-h-40 xxs:max-h-44",children:(0,t.jsx)("div",{className:a()("h-full",v().logo),children:(0,t.jsx)("img",{src:j.src,className:"h-full",alt:"OverlayScrollbars Logo",width:"200",height:"200"})})}),(0,t.jsxs)("h1",{className:"text-center xxs:text-4xl text-2xl font-bold my-11",children:["Overlay",(0,t.jsx)("wbr",{}),"Scrollbars"]}),(0,t.jsx)("p",{className:"text-center mx-auto max-w-screen-sm my-11 font-medium",children:"A javascript scrollbar plugin that hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling."}),w("used by"),(0,t.jsx)(x.E,{defer:!0,children:(0,t.jsx)("div",{className:"flex justify-center",children:(0,t.jsxs)("div",{className:a()("inline-flex items-center gap-6 py-6",v().usedBy),children:[(0,t.jsx)("div",{className:"h-11 px-3 flex-grow flex-shrink-0",style:{filter:"brightness(0.35)"},children:(0,t.jsx)("img",{className:"h-full",src:p.src,alt:""})}),(0,t.jsx)("div",{className:"h-11 px-3 py-1.5 flex-grow flex-shrink-0",children:(0,t.jsx)("img",{className:"h-full",src:y.src,alt:""})}),(0,t.jsx)("div",{className:"h-11 p-3 flex-grow flex-shrink-0",children:(0,t.jsx)("img",{className:"h-full",src:m.src,alt:""})})]})})}),w((0,t.jsxs)("a",{href:"https://github.com/KingSora/OverlayScrollbars",target:"_blank",rel:"noreferrer",children:[(0,t.jsx)(d,{className:"inline-block w-11 hover:scale-110 text-primary-dark hover:text-primary-blue1 active:text-primary-blue2 transition-transformColor ease-in-out duration-300",svg:u,icon:"github"}),(0,t.jsx)("span",{className:"sr-only",children:"OverlayScrollbars on Github"})]})),(0,t.jsxs)("p",{className:"text-center text-sm text-primary-gray2 mx-auto max-w-screen-sm my-11 font-medium",children:["This page is a work in progress. For now refer to the TypeScript definitions for a more detailed documentation.",(0,t.jsx)("br",{}),"Looking for the v1 docs?"," ",(0,t.jsx)("a",{href:"v1",className:"text-primary-blue2 underline",children:"Follow this link"}),"."]}),(0,t.jsxs)("div",{className:"mx-auto flex sm:flex-row justify-center gap-2 items-center flex-wrap",children:[(0,t.jsx)("a",{href:"https://www.npmjs.com/package/overlayscrollbars",children:(0,t.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/npm/dm/overlayscrollbars.svg?style=flat-square",alt:"Downloads"})}),(0,t.jsx)("a",{href:"https://www.npmjs.com/package/overlayscrollbars",children:(0,t.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/npm/v/overlayscrollbars.svg?style=flat-square",alt:"Version"})}),(0,t.jsx)("a",{href:"https://github.com/KingSora/OverlayScrollbars/blob/master/LICENSE",children:(0,t.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/github/license/kingsora/overlayscrollbars.svg?style=flat-square",alt:"License"})}),(0,t.jsx)("a",{href:"https://app.codecov.io/gh/KingSora/OverlayScrollbars",children:(0,t.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/codecov/c/github/KingSora/OverlayScrollbars?style=flat-square",alt:"Code Coverage"})}),(0,t.jsx)("a",{href:"https://bundlephobia.com/package/overlayscrollbars",children:(0,t.jsx)("img",{className:"min-h-[20px]",src:"https://img.shields.io/bundlephobia/minzip/overlayscrollbars?label=max.%20bundle%20size&style=flat-square",alt:"Max. Bundle Size"})})]}),(0,t.jsx)("div",{className:"mt-11 prose prose-primary mx-auto pb-32",children:(0,t.jsx)(f,{})})]})}},4028:function(e){e.exports={logo:"assets_logo__UC59w",usedBySeparator:"assets_usedBySeparator__yqt5h",usedBy:"assets_usedBy__FHTGG"}}},function(e){e.O(0,[774,888,179],function(){return e(e.s=2766)}),_N_E=e.O()}]); \ No newline at end of file diff --git a/docs/_next/static/css/adc3bb11338102a5.css b/docs/_next/static/css/5a6c15b2dc230309.css similarity index 71% rename from docs/_next/static/css/adc3bb11338102a5.css rename to docs/_next/static/css/5a6c15b2dc230309.css index 857afb7..ecd2dd0 100644 --- a/docs/_next/static/css/adc3bb11338102a5.css +++ b/docs/_next/static/css/5a6c15b2dc230309.css @@ -1,13 +1,13 @@ .default\:fill-current{fill:currentColor}/* ! tailwindcss v3.2.0 | MIT License | https://tailwindcss.com -*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Noto Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input:-ms-input-placeholder,textarea:-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.prose{color:var(--tw-prose-body);max-width:65ch}.prose :where([class~=lead]):not(:where([class~=not-prose] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.prose :where(a):not(:where([class~=not-prose] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.prose :where(strong):not(:where([class~=not-prose] *)){color:var(--tw-prose-bold);font-weight:600}.prose :where(a strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(blockquote strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(thead th strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(ol):not(:where([class~=not-prose] *)){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.prose :where(ol[type=A]):not(:where([class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a]):not(:where([class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=A s]):not(:where([class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a s]):not(:where([class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=I]):not(:where([class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i]):not(:where([class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type=I s]):not(:where([class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i s]):not(:where([class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type="1"]):not(:where([class~=not-prose] *)){list-style-type:decimal}.prose :where(ul):not(:where([class~=not-prose] *)){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.prose :where(ol>li):not(:where([class~=not-prose] *))::marker{font-weight:400;color:var(--tw-prose-counters)}.prose :where(ul>li):not(:where([class~=not-prose] *))::marker{color:var(--tw-prose-bullets)}.prose :where(hr):not(:where([class~=not-prose] *)){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.prose :where(blockquote):not(:where([class~=not-prose] *)){font-weight:500;font-style:italic;color:var(--tw-prose-quotes);border-left-width:.25rem;border-left-color:var(--tw-prose-quote-borders);quotes:"\201C""\201D""\2018""\2019";margin-top:1.6em;margin-bottom:1.6em;padding-left:1em}.prose :where(h1):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:800;font-size:2.25em;margin-top:0;margin-bottom:.8888889em;line-height:1.1111111;border-bottom:1px solid;border-color:#cbd5e1;padding-bottom:.5rem}.prose :where(h1 strong):not(:where([class~=not-prose] *)){font-weight:900;color:inherit}.prose :where(h2):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:700;font-size:1.5em;margin-top:2em;margin-bottom:1em;line-height:1.3333333;border-bottom:1px solid;border-color:#cbd5e1;padding-bottom:.5rem}.prose :where(h2 strong):not(:where([class~=not-prose] *)){font-weight:800;color:inherit}.prose :where(h3):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;font-size:1.25em;margin-top:1.6em;margin-bottom:.6em;line-height:1.6}.prose :where(h3 strong):not(:where([class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(h4):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.5em;margin-bottom:.5em;line-height:1.5}.prose :where(h4 strong):not(:where([class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(img):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(figure>*):not(:where([class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(figcaption):not(:where([class~=not-prose] *)){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.prose :where(code):not(:where([class~=not-prose] *)){color:var(--tw-prose-code);font-weight:600;font-size:.875em;background:var(--tw-prose-pre-bg);padding:.25rem;border-radius:.375rem;overflow-wrap:break-word}.prose :where(a code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(h1 code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(h2 code):not(:where([class~=not-prose] *)){color:inherit;font-size:.875em}.prose :where(h3 code):not(:where([class~=not-prose] *)){color:inherit;font-size:.9em}.prose :where(h4 code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(blockquote code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(thead th code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(pre):not(:where([class~=not-prose] *)){color:var(--tw-prose-pre-code);background-color:var(--tw-prose-pre-bg);overflow-x:auto;font-weight:400;font-size:.875em;line-height:1.7142857;margin-top:1.7142857em;margin-bottom:1.7142857em;border-radius:.375rem;padding:.8571429em 1.1428571em}.prose :where(pre code):not(:where([class~=not-prose] *)){background-color:transparent;border-width:0;border-radius:0;padding:0;font-weight:inherit;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}.prose :where(pre code):not(:where([class~=not-prose] *)):before{content:none}.prose :where(pre code):not(:where([class~=not-prose] *)):after{content:none}.prose :where(table):not(:where([class~=not-prose] *)){width:100%;table-layout:auto;text-align:left;margin-top:2em;margin-bottom:2em;font-size:.875em;line-height:1.7142857}.prose :where(thead):not(:where([class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.prose :where(thead th):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;vertical-align:bottom;padding-right:.5714286em;padding-bottom:.5714286em;padding-left:.5714286em}.prose :where(tbody tr):not(:where([class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.prose :where(tbody tr:last-child):not(:where([class~=not-prose] *)){border-bottom-width:0}.prose :where(tbody td):not(:where([class~=not-prose] *)){vertical-align:baseline}.prose :where(tfoot):not(:where([class~=not-prose] *)){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.prose :where(tfoot td):not(:where([class~=not-prose] *)){vertical-align:top}.prose{--tw-prose-body:#374151;--tw-prose-headings:#111827;--tw-prose-lead:#4b5563;--tw-prose-links:#111827;--tw-prose-bold:#111827;--tw-prose-counters:#6b7280;--tw-prose-bullets:#d1d5db;--tw-prose-hr:#e5e7eb;--tw-prose-quotes:#111827;--tw-prose-quote-borders:#e5e7eb;--tw-prose-captions:#6b7280;--tw-prose-code:#111827;--tw-prose-pre-code:#e5e7eb;--tw-prose-pre-bg:#1f2937;--tw-prose-th-borders:#d1d5db;--tw-prose-td-borders:#e5e7eb;--tw-prose-invert-body:#d1d5db;--tw-prose-invert-headings:#fff;--tw-prose-invert-lead:#9ca3af;--tw-prose-invert-links:#fff;--tw-prose-invert-bold:#fff;--tw-prose-invert-counters:#9ca3af;--tw-prose-invert-bullets:#4b5563;--tw-prose-invert-hr:#374151;--tw-prose-invert-quotes:#f3f4f6;--tw-prose-invert-quote-borders:#374151;--tw-prose-invert-captions:#9ca3af;--tw-prose-invert-code:#fff;--tw-prose-invert-pre-code:#d1d5db;--tw-prose-invert-pre-bg:rgba(0,0,0,.5);--tw-prose-invert-th-borders:#4b5563;--tw-prose-invert-td-borders:#374151;font-size:1rem;line-height:1.75}.prose :where(p):not(:where([class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where(video):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(figure):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(li):not(:where([class~=not-prose] *)){margin-top:.5em;margin-bottom:.5em}.prose :where(ol>li):not(:where([class~=not-prose] *)){padding-left:.375em}.prose :where(ul>li):not(:where([class~=not-prose] *)){padding-left:.375em}.prose :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(hr+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h2+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h3+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h4+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(thead th:first-child):not(:where([class~=not-prose] *)){padding-left:0}.prose :where(thead th:last-child):not(:where([class~=not-prose] *)){padding-right:0}.prose :where(tbody td,tfoot td):not(:where([class~=not-prose] *)){padding:.5714286em}.prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose] *)){padding-left:0}.prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose] *)){padding-right:0}.prose :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose :where(b):not(:where([class~=not-prose] *)){font-weight:600}.prose :where(h5):not(:where([class~=not-prose] *)){color:#0a376b;font-weight:600;font-size:.875rem;font-size:[object Object]}.prose :where(h6):not(:where([class~=not-prose] *)){color:#0a376b;font-weight:600;font-size:.875rem;font-size:[object Object]}.prose :where(blockquote>p>strong:first-child):not(:where([class~=not-prose] *)){color:#4276ff}.prose :where(summary>:only-child,):not(:where([class~=not-prose] *)){display:inline;margin:0}.prose :where(summary):not(:where([class~=not-prose] *)){display:list-item;cursor:pointer}.prose-sm :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.5714286em;margin-bottom:.5714286em}.prose-sm :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.1428571em}.prose-sm :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.1428571em}.prose-sm :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.1428571em}.prose-sm :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.1428571em}.prose-sm :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-sm :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-base :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose-base :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose-base :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose-base :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose-base :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose-base :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-base :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-lg :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.8888889em;margin-bottom:.8888889em}.prose-lg :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-lg :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-lg :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-lg :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-lg :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-lg :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-xl :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.8em;margin-bottom:.8em}.prose-xl :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.2em}.prose-xl :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.2em}.prose-xl :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.2em}.prose-xl :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.2em}.prose-xl :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-xl :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-2xl :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.8333333em;margin-bottom:.8333333em}.prose-2xl :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-2xl :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-2xl :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-2xl :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-2xl :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-2xl :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-primary{--tw-prose-body:#475774;--tw-prose-headings:#0a376b;--tw-prose-lead:#475774;--tw-prose-links:#4276ff;--tw-prose-bold:#0a376b;--tw-prose-counters:#475774;--tw-prose-bullets:#4276ff;--tw-prose-hr:#e2e8f0;--tw-prose-quotes:#0a376b;--tw-prose-quote-borders:#e2e8f0;--tw-prose-captions:#475774;--tw-prose-code:#0a376b;--tw-prose-pre-code:#fce7f3;--tw-prose-pre-bg:#f1f5f9;--tw-prose-th-borders:#e2e8f0;--tw-prose-td-borders:#e2e8f0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.visible{visibility:visible}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.top-1\/2{top:50%}.left-1\/2{left:50%}.z-\[-1\]{z-index:-1}.mx-1{margin-left:.25rem;margin-right:.25rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.my-11{margin-top:2.75rem;margin-bottom:2.75rem}.mx-auto{margin-left:auto;margin-right:auto}.mt-8{margin-top:2rem}.mt-11{margin-top:2.75rem}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-\[80px\]{height:80px}.h-\[33vh\]{height:33vh}.h-full{height:100%}.h-11{height:2.75rem}.max-h-40{max-height:10rem}.min-h-\[20px\]{min-height:20px}.w-\[100\%\]{width:100%}.w-11{width:2.75rem}.max-w-screen-sm{max-width:768px}.flex-shrink-0{flex-shrink:0}.flex-grow-0{flex-grow:0}.flex-grow{flex-grow:1}.translate-x-\[-50\%\]{--tw-translate-x:-50%}.translate-x-\[-50\%\],.translate-y-\[-50\%\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\[-50\%\]{--tw-translate-y:-50%}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.gap-6{gap:1.5rem}.gap-2{gap:.5rem}.border-t-\[1px\]{border-top-width:1px}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.p-3{padding:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.pb-32{padding-bottom:8rem}.text-center{text-align:center}.font-sans{font-family:Noto Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.text-sm{font-size:.875rem;line-height:1.25rem}.text-2xl{font-size:1.5rem;line-height:2rem}.font-medium{font-weight:600}.font-bold{font-weight:800}.font-normal{font-weight:400}.uppercase{text-transform:uppercase}.text-primary-dark{--tw-text-opacity:1;color:rgb(10 55 107/var(--tw-text-opacity))}.text-primary-gray2{--tw-text-opacity:1;color:rgb(105 121 150/var(--tw-text-opacity))}.text-primary-blue2{--tw-text-opacity:1;color:rgb(66 118 255/var(--tw-text-opacity))}.underline{-webkit-text-decoration-line:underline;text-decoration-line:underline}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-transformColor{transition-property:transform,color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.default\:fill-current:default{fill:currentColor}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:text-primary-blue1:hover{--tw-text-opacity:1;color:rgb(51 142 255/var(--tw-text-opacity))}.active\:text-primary-blue2:active{--tw-text-opacity:1;color:rgb(66 118 255/var(--tw-text-opacity))}@media (min-width:374px){.xxs\:max-h-44{max-height:11rem}.xxs\:text-4xl{font-size:2.25rem;line-height:2.5rem}}@media (min-width:640px){.xs\:w-\[80\%\]{width:80%}}@media (min-width:768px){.sm\:container{width:100%;margin-right:auto;margin-left:auto}@media (min-width:374px){.sm\:container{max-width:374px}}@media (min-width:640px){.sm\:container{max-width:640px}}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:960px){.sm\:container{max-width:960px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}@media (min-width:1440px){.sm\:container{max-width:1440px}}@media (min-width:1536px){.sm\:container{max-width:1536px}}.sm\:flex-row{flex-direction:row}}@font-face{font-family:Noto Sans;src:url(/OverlayScrollbars/_next/static/media/NotoSans-Regular.c983f2f0.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Noto Sans;src:url(/OverlayScrollbars/_next/static/media/NotoSans-SemiBold.dedd3bcb.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Noto Sans;src:url(/OverlayScrollbars/_next/static/media/NotoSans-ExtraBold.d19a8e50.ttf) format("truetype");font-weight:800;font-style:normal;font-display:swap} +*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Noto Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input:-ms-input-placeholder,textarea:-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.prose{color:var(--tw-prose-body);max-width:65ch}.prose :where([class~=lead]):not(:where([class~=not-prose] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.prose :where(a):not(:where([class~=not-prose] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.prose :where(strong):not(:where([class~=not-prose] *)){color:var(--tw-prose-bold);font-weight:600}.prose :where(a strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(blockquote strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(thead th strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(ol):not(:where([class~=not-prose] *)){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.prose :where(ol[type=A]):not(:where([class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a]):not(:where([class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=A s]):not(:where([class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a s]):not(:where([class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=I]):not(:where([class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i]):not(:where([class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type=I s]):not(:where([class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i s]):not(:where([class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type="1"]):not(:where([class~=not-prose] *)){list-style-type:decimal}.prose :where(ul):not(:where([class~=not-prose] *)){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;padding-left:1.625em}.prose :where(ol>li):not(:where([class~=not-prose] *))::marker{font-weight:400;color:var(--tw-prose-counters)}.prose :where(ul>li):not(:where([class~=not-prose] *))::marker{color:var(--tw-prose-bullets)}.prose :where(hr):not(:where([class~=not-prose] *)){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.prose :where(blockquote):not(:where([class~=not-prose] *)){font-weight:500;font-style:italic;color:var(--tw-prose-quotes);border-left-width:.25rem;border-left-color:var(--tw-prose-quote-borders);quotes:"\201C""\201D""\2018""\2019";margin-top:1.6em;margin-bottom:1.6em;padding-left:1em}.prose :where(h1):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:800;font-size:2.25em;margin-top:0;margin-bottom:.8888889em;line-height:1.1111111;border-bottom:1px solid;border-color:#cbd5e1;padding-bottom:.5rem}.prose :where(h1 strong):not(:where([class~=not-prose] *)){font-weight:900;color:inherit}.prose :where(h2):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:700;font-size:1.5em;margin-top:2em;margin-bottom:1em;line-height:1.3333333;border-bottom:1px solid;border-color:#cbd5e1;padding-bottom:.5rem}.prose :where(h2 strong):not(:where([class~=not-prose] *)){font-weight:800;color:inherit}.prose :where(h3):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;font-size:1.25em;margin-top:1.6em;margin-bottom:.6em;line-height:1.6}.prose :where(h3 strong):not(:where([class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(h4):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.5em;margin-bottom:.5em;line-height:1.5}.prose :where(h4 strong):not(:where([class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(img):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(figure>*):not(:where([class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(figcaption):not(:where([class~=not-prose] *)){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.prose :where(code):not(:where([class~=not-prose] *)){color:var(--tw-prose-code);font-weight:600;font-size:.875em;background:var(--tw-prose-pre-bg);padding:.25rem;border-radius:.375rem;overflow-wrap:break-word}.prose :where(a code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(h1 code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(h2 code):not(:where([class~=not-prose] *)){color:inherit;font-size:.875em}.prose :where(h3 code):not(:where([class~=not-prose] *)){color:inherit;font-size:.9em}.prose :where(h4 code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(blockquote code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(thead th code):not(:where([class~=not-prose] *)){color:inherit}.prose :where(pre):not(:where([class~=not-prose] *)){color:var(--tw-prose-pre-code);background-color:var(--tw-prose-pre-bg);overflow-x:auto;font-weight:400;font-size:.875em;line-height:1.7142857;margin-top:1.7142857em;margin-bottom:1.7142857em;border-radius:.375rem;padding:.8571429em 1.1428571em}.prose :where(pre code):not(:where([class~=not-prose] *)){background-color:transparent;border-width:0;border-radius:0;padding:0;font-weight:inherit;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}.prose :where(pre code):not(:where([class~=not-prose] *)):before{content:none}.prose :where(pre code):not(:where([class~=not-prose] *)):after{content:none}.prose :where(table):not(:where([class~=not-prose] *)){width:100%;table-layout:auto;text-align:left;margin-top:2em;margin-bottom:2em;font-size:.875em;line-height:1.7142857}.prose :where(thead):not(:where([class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.prose :where(thead th):not(:where([class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;vertical-align:bottom;padding-right:.5714286em;padding-bottom:.5714286em;padding-left:.5714286em}.prose :where(tbody tr):not(:where([class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.prose :where(tbody tr:last-child):not(:where([class~=not-prose] *)){border-bottom-width:0}.prose :where(tbody td):not(:where([class~=not-prose] *)){vertical-align:baseline}.prose :where(tfoot):not(:where([class~=not-prose] *)){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.prose :where(tfoot td):not(:where([class~=not-prose] *)){vertical-align:top}.prose{--tw-prose-body:#374151;--tw-prose-headings:#111827;--tw-prose-lead:#4b5563;--tw-prose-links:#111827;--tw-prose-bold:#111827;--tw-prose-counters:#6b7280;--tw-prose-bullets:#d1d5db;--tw-prose-hr:#e5e7eb;--tw-prose-quotes:#111827;--tw-prose-quote-borders:#e5e7eb;--tw-prose-captions:#6b7280;--tw-prose-code:#111827;--tw-prose-pre-code:#e5e7eb;--tw-prose-pre-bg:#1f2937;--tw-prose-th-borders:#d1d5db;--tw-prose-td-borders:#e5e7eb;--tw-prose-invert-body:#d1d5db;--tw-prose-invert-headings:#fff;--tw-prose-invert-lead:#9ca3af;--tw-prose-invert-links:#fff;--tw-prose-invert-bold:#fff;--tw-prose-invert-counters:#9ca3af;--tw-prose-invert-bullets:#4b5563;--tw-prose-invert-hr:#374151;--tw-prose-invert-quotes:#f3f4f6;--tw-prose-invert-quote-borders:#374151;--tw-prose-invert-captions:#9ca3af;--tw-prose-invert-code:#fff;--tw-prose-invert-pre-code:#d1d5db;--tw-prose-invert-pre-bg:rgba(0,0,0,.5);--tw-prose-invert-th-borders:#4b5563;--tw-prose-invert-td-borders:#374151;font-size:1rem;line-height:1.75}.prose :where(p):not(:where([class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where(video):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(figure):not(:where([class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(li):not(:where([class~=not-prose] *)){margin-top:.5em;margin-bottom:.5em}.prose :where(ol>li):not(:where([class~=not-prose] *)){padding-left:.375em}.prose :where(ul>li):not(:where([class~=not-prose] *)){padding-left:.375em}.prose :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(hr+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h2+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h3+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(h4+*):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(thead th:first-child):not(:where([class~=not-prose] *)){padding-left:0}.prose :where(thead th:last-child):not(:where([class~=not-prose] *)){padding-right:0}.prose :where(tbody td,tfoot td):not(:where([class~=not-prose] *)){padding:.5714286em}.prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose] *)){padding-left:0}.prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose] *)){padding-right:0}.prose :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose :where(b):not(:where([class~=not-prose] *)){font-weight:600}.prose :where(h5):not(:where([class~=not-prose] *)){color:#0a376b;font-weight:600;font-size:.875rem;font-size:[object Object]}.prose :where(h6):not(:where([class~=not-prose] *)){color:#0a376b;font-weight:600;font-size:.875rem;font-size:[object Object]}.prose :where(blockquote>p>strong:first-child):not(:where([class~=not-prose] *)){color:#4276ff}.prose :where(summary>:only-child,):not(:where([class~=not-prose] *)){display:inline;margin:0}.prose :where(details):not(:where([class~=not-prose] *)){margin-top:1rem;margin-bottom:1rem}.prose :where(summary):not(:where([class~=not-prose] *)){display:list-item;cursor:pointer}.prose :where(summary+br):not(:where([class~=not-prose] *)){display:none}.prose-sm :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.5714286em;margin-bottom:.5714286em}.prose-sm :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.1428571em}.prose-sm :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.1428571em}.prose-sm :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.1428571em}.prose-sm :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.1428571em}.prose-sm :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-sm :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-base :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose-base :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose-base :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose-base :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.25em}.prose-base :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.25em}.prose-base :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-base :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-lg :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.8888889em;margin-bottom:.8888889em}.prose-lg :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-lg :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-lg :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-lg :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-lg :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-lg :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-xl :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.8em;margin-bottom:.8em}.prose-xl :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.2em}.prose-xl :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.2em}.prose-xl :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.2em}.prose-xl :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.2em}.prose-xl :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-xl :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-2xl :where(.prose>ul>li p):not(:where([class~=not-prose] *)){margin-top:.8333333em;margin-bottom:.8333333em}.prose-2xl :where(.prose>ul>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-2xl :where(.prose>ul>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-2xl :where(.prose>ol>li>:first-child):not(:where([class~=not-prose] *)){margin-top:1.3333333em}.prose-2xl :where(.prose>ol>li>:last-child):not(:where([class~=not-prose] *)){margin-bottom:1.3333333em}.prose-2xl :where(.prose>:first-child):not(:where([class~=not-prose] *)){margin-top:0}.prose-2xl :where(.prose>:last-child):not(:where([class~=not-prose] *)){margin-bottom:0}.prose-primary{--tw-prose-body:#475774;--tw-prose-headings:#0a376b;--tw-prose-lead:#475774;--tw-prose-links:#4276ff;--tw-prose-bold:#0a376b;--tw-prose-counters:#475774;--tw-prose-bullets:#4276ff;--tw-prose-hr:#e2e8f0;--tw-prose-quotes:#0a376b;--tw-prose-quote-borders:#e2e8f0;--tw-prose-captions:#475774;--tw-prose-code:#0a376b;--tw-prose-pre-code:#fce7f3;--tw-prose-pre-bg:#f1f5f9;--tw-prose-th-borders:#e2e8f0;--tw-prose-td-borders:#e2e8f0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.visible{visibility:visible}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.top-1\/2{top:50%}.left-1\/2{left:50%}.z-\[-1\]{z-index:-1}.mx-1{margin-left:.25rem;margin-right:.25rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.my-11{margin-top:2.75rem;margin-bottom:2.75rem}.mx-auto{margin-left:auto;margin-right:auto}.mt-8{margin-top:2rem}.mt-11{margin-top:2.75rem}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-\[80px\]{height:80px}.h-\[33vh\]{height:33vh}.h-full{height:100%}.h-11{height:2.75rem}.max-h-40{max-height:10rem}.min-h-\[20px\]{min-height:20px}.w-\[100\%\]{width:100%}.w-11{width:2.75rem}.max-w-screen-sm{max-width:768px}.flex-shrink-0{flex-shrink:0}.flex-grow-0{flex-grow:0}.flex-grow{flex-grow:1}.translate-x-\[-50\%\]{--tw-translate-x:-50%}.translate-x-\[-50\%\],.translate-y-\[-50\%\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\[-50\%\]{--tw-translate-y:-50%}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.gap-6{gap:1.5rem}.gap-2{gap:.5rem}.border-t-\[1px\]{border-top-width:1px}.border-slate-300{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.p-3{padding:.75rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.pb-32{padding-bottom:8rem}.text-center{text-align:center}.font-sans{font-family:Noto Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.text-sm{font-size:.875rem;line-height:1.25rem}.text-2xl{font-size:1.5rem;line-height:2rem}.font-medium{font-weight:600}.font-bold{font-weight:800}.font-normal{font-weight:400}.uppercase{text-transform:uppercase}.text-primary-dark{--tw-text-opacity:1;color:rgb(10 55 107/var(--tw-text-opacity))}.text-primary-gray2{--tw-text-opacity:1;color:rgb(105 121 150/var(--tw-text-opacity))}.text-primary-blue2{--tw-text-opacity:1;color:rgb(66 118 255/var(--tw-text-opacity))}.underline{-webkit-text-decoration-line:underline;text-decoration-line:underline}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-transformColor{transition-property:transform,color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.default\:fill-current:default{fill:currentColor}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:text-primary-blue1:hover{--tw-text-opacity:1;color:rgb(51 142 255/var(--tw-text-opacity))}.active\:text-primary-blue2:active{--tw-text-opacity:1;color:rgb(66 118 255/var(--tw-text-opacity))}@media (min-width:374px){.xxs\:max-h-44{max-height:11rem}.xxs\:text-4xl{font-size:2.25rem;line-height:2.5rem}}@media (min-width:640px){.xs\:w-\[80\%\]{width:80%}}@media (min-width:768px){.sm\:container{width:100%;margin-right:auto;margin-left:auto}@media (min-width:374px){.sm\:container{max-width:374px}}@media (min-width:640px){.sm\:container{max-width:640px}}@media (min-width:768px){.sm\:container{max-width:768px}}@media (min-width:960px){.sm\:container{max-width:960px}}@media (min-width:1280px){.sm\:container{max-width:1280px}}@media (min-width:1440px){.sm\:container{max-width:1440px}}@media (min-width:1536px){.sm\:container{max-width:1536px}}.sm\:flex-row{flex-direction:row}}@font-face{font-family:Noto Sans;src:url(/OverlayScrollbars/_next/static/media/NotoSans-Regular.c983f2f0.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Noto Sans;src:url(/OverlayScrollbars/_next/static/media/NotoSans-SemiBold.dedd3bcb.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Noto Sans;src:url(/OverlayScrollbars/_next/static/media/NotoSans-ExtraBold.d19a8e50.ttf) format("truetype");font-weight:800;font-style:normal;font-display:swap} /*! * OverlayScrollbars - * Version: 2.0.1 + * Version: 2.0.2 * * Copyright (c) Rene Haas | KingSora. * https://github.com/KingSora * * Released under the MIT license. - */.os-size-observer,.os-size-observer-listener{direction:inherit;pointer-events:none;overflow:hidden;visibility:hidden;box-sizing:border-box}.os-size-observer,.os-size-observer-listener,.os-size-observer-listener-item,.os-size-observer-listener-item-final{-ms-writing-mode:lr-tb;writing-mode:horizontal-tb;position:absolute;left:0;top:0}.os-size-observer{z-index:-1;contain:strict;display:flex;flex-direction:row;flex-wrap:nowrap;padding:inherit;border:inherit;box-sizing:inherit;margin:-133px;top:0;right:0;bottom:0;left:0;transform:scale(.1)}.os-size-observer:before{content:"";flex:none;box-sizing:inherit;padding:10px;width:10px;height:10px}.os-size-observer-appear{animation:os-size-observer-appear-animation 1ms forwards}.os-size-observer-listener{box-sizing:border-box;position:relative;flex:auto;padding:inherit;border:inherit;margin:-133px;transform:scale(10)}.os-size-observer-listener.ltr{margin-right:-266px;margin-left:0}.os-size-observer-listener.rtl{margin-left:-266px;margin-right:0}.os-size-observer-listener:empty:before{content:"";width:100%;height:100%}.os-size-observer-listener:empty:before,.os-size-observer-listener>.os-size-observer-listener-item{display:block;position:relative;padding:inherit;border:inherit;box-sizing:content-box;flex:auto}.os-size-observer-listener-scroll{box-sizing:border-box;display:flex}.os-size-observer-listener-item{right:0;bottom:0;overflow:hidden;direction:ltr;flex:none}.os-size-observer-listener-item-final{transition:none}@keyframes os-size-observer-appear-animation{0%{cursor:auto}to{cursor:none}}.os-trinsic-observer{flex:none;box-sizing:border-box;position:relative;max-width:0;max-height:1px;padding:0;margin:0;border:none;overflow:hidden;z-index:-1;height:0;top:calc(100% + 1px);contain:strict}.os-trinsic-observer:not(:empty){height:calc(100% + 1px);top:-1px}.os-trinsic-observer:not(:empty)>.os-size-observer{width:1000%;height:1000%;min-height:1px;min-width:1px}.os-environment{--os-custom-prop:-1;position:fixed;opacity:0;visibility:hidden;overflow:scroll;height:200px;width:200px;z-index:var(--os-custom-prop)}.os-environment div{width:200%;height:200%;margin:10px 0}.os-environment.os-environment-flexbox-glue{display:flex;flex-direction:row;flex-wrap:nowrap;height:auto;width:auto;min-height:200px;min-width:200px}.os-environment.os-environment-flexbox-glue div{flex:auto;width:auto;height:auto;max-height:100%;max-width:100%;margin:0}.os-environment.os-environment-flexbox-glue-max{max-height:200px}.os-environment.os-environment-flexbox-glue-max div{overflow:visible}.os-environment.os-environment-flexbox-glue-max div:before{content:"";display:block;height:999px;width:999px}.os-environment,.os-viewport{-ms-overflow-style:scrollbar!important}.os-viewport-scrollbar-hidden.os-environment,.os-viewport-scrollbar-hidden.os-viewport,[data-overlayscrollbars-initialize],[data-overlayscrollbars~=scrollbarHidden]{scrollbar-width:none!important}.os-viewport-scrollbar-hidden.os-environment::-webkit-scrollbar,.os-viewport-scrollbar-hidden.os-environment::-webkit-scrollbar-corner,.os-viewport-scrollbar-hidden.os-viewport::-webkit-scrollbar,.os-viewport-scrollbar-hidden.os-viewport::-webkit-scrollbar-corner,[data-overlayscrollbars-initialize]::-webkit-scrollbar,[data-overlayscrollbars-initialize]::-webkit-scrollbar-corner,[data-overlayscrollbars~=scrollbarHidden]::-webkit-scrollbar,[data-overlayscrollbars~=scrollbarHidden]::-webkit-scrollbar-corner{-webkit-appearance:none!important;appearance:none!important;display:none!important;width:0!important;height:0!important}[data-overlayscrollbars-initialize]{overflow:auto}html.os-viewport-scrollbar-hidden,html.os-viewport-scrollbar-hidden>body,html[data-overlayscrollbars]{box-sizing:border-box;margin:0;width:100%;height:100%}html[data-overlayscrollbars]>body{overflow:visible}.os-padding,[data-overlayscrollbars~=host]{position:relative;display:flex;flex-direction:row!important;flex-wrap:nowrap!important}.os-padding,.os-viewport{box-sizing:inherit;position:relative;flex:auto!important;height:auto;width:100%;padding:0;margin:0;border:none;z-index:0}.os-viewport{--os-vaw:0;--os-vah:0}.os-viewport.os-viewport-arrange:before{content:"";position:absolute;pointer-events:none;z-index:-1;min-width:1px;min-height:1px;width:var(--os-vaw);height:var(--os-vah)}[data-overlayscrollbars~=host],[data-overlayscrollbars~=viewport]{overflow:hidden}[data-overlayscrollbars~=overflowVisible]{overflow:visible}[data-overlayscrollbars-overflow-x=hidden]{overflow-x:hidden}[data-overlayscrollbars-overflow-x=scroll]{overflow-x:scroll}[data-overlayscrollbars-overflow-x=hidden]{overflow-y:hidden}[data-overlayscrollbars-overflow-y=scroll]{overflow-y:scroll}.os-padding,.os-viewport{overflow:hidden}.os-overflow-visible{overflow:visible}.os-content{box-sizing:inherit}[data-overlayscrollbars-grid],[data-overlayscrollbars-grid] .os-padding{display:grid;grid-template:1fr/1fr}[data-overlayscrollbars-grid]>.os-padding,[data-overlayscrollbars-grid]>.os-padding>.os-viewport,[data-overlayscrollbars-grid]>.os-viewport{height:auto!important;width:auto!important}.os-scrollbar{contain:strict;transition:opacity .3s,visibility .3s,top .3s,right .3s,bottom .3s,left .3s;pointer-events:none;position:absolute;opacity:0;visibility:hidden}body>.os-scrollbar{position:fixed;z-index:99999}.os-scrollbar-transitionless{transition:none}.os-scrollbar-track{position:relative;direction:ltr!important;padding:0!important;border:none!important}.os-scrollbar-handle{position:absolute}.os-scrollbar-handle,.os-scrollbar-track{pointer-events:none;width:100%;height:100%}.os-scrollbar.os-scrollbar-handle-interactive .os-scrollbar-handle,.os-scrollbar.os-scrollbar-track-interactive .os-scrollbar-track{pointer-events:auto;touch-action:none}.os-scrollbar-horizontal{bottom:0;left:0}.os-scrollbar-vertical{top:0;right:0}.os-scrollbar-rtl.os-scrollbar-horizontal{right:0}.os-scrollbar-rtl.os-scrollbar-vertical{right:auto;left:0}.os-scrollbar-interaction.os-scrollbar-visible,.os-scrollbar-visible{opacity:1;visibility:visible}.os-scrollbar-auto-hidden{opacity:0;visibility:hidden}.os-scrollbar-unusable,.os-scrollbar-unusable *,.os-scrollbar-wheel,.os-scrollbar-wheel *{pointer-events:none!important}.os-scrollbar-unusable .os-scrollbar-handle{opacity:0!important}.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless,.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless.os-scrollbar-rtl{left:0;right:0}.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless,.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless.os-scrollbar-rtl{top:0;bottom:0}.os-theme-none.os-scrollbar,[data-overlayscrollbars~=updating]>.os-scrollbar{display:none!important}.os-theme-dark.os-scrollbar-horizontal,.os-theme-light.os-scrollbar-horizontal{right:10px;height:10px}.os-theme-dark.os-scrollbar-vertical,.os-theme-light.os-scrollbar-vertical{bottom:10px;width:10px}.os-theme-dark.os-scrollbar-rtl.os-scrollbar-horizontal,.os-theme-light.os-scrollbar-rtl.os-scrollbar-horizontal{left:10px;right:0}.os-theme-dark.os-scrollbar,.os-theme-light.os-scrollbar{padding:2px;box-sizing:border-box;background:transparent}.os-theme-dark.os-scrollbar-unusable,.os-theme-dark.os-scrollbar>.os-scrollbar-track,.os-theme-light.os-scrollbar-unusable,.os-theme-light.os-scrollbar>.os-scrollbar-track{background:transparent}.os-theme-dark.os-scrollbar-horizontal>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar-horizontal>.os-scrollbar-track>.os-scrollbar-handle{min-width:30px}.os-theme-dark.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle{min-height:30px}.os-theme-dark.os-scrollbar-transition>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar-transition>.os-scrollbar-track>.os-scrollbar-handle{transition:background-color .3s}.os-theme-dark.os-scrollbar>.os-scrollbar-track,.os-theme-dark.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar>.os-scrollbar-track,.os-theme-light.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{border-radius:10px}.os-theme-dark.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(0,0,0,.4)}.os-theme-light.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{background:hsla(0,0%,100%,.4)}.os-theme-dark.os-scrollbar:hover>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(0,0,0,.55)}.os-theme-light.os-scrollbar:hover>.os-scrollbar-track>.os-scrollbar-handle{background:hsla(0,0%,100%,.55)}.os-theme-dark.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle.active{background:rgba(0,0,0,.7)}.os-theme-light.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle.active{background:hsla(0,0%,100%,.7)}.os-theme-dark.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-dark.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-vertical .os-scrollbar-handle:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;display:block}.os-theme-dark.os-host-scrollbar-hidden>.os-scrollbar-handle:before{display:none}.os-theme-dark.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-horizontal .os-scrollbar-handle:before{top:-6px;bottom:-2px}.os-theme-dark.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-vertical .os-scrollbar-handle:before{left:-6px;right:-2px}.os-theme-dark.os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle:before{right:-6px;left:-2px} \ No newline at end of file + */.os-size-observer,.os-size-observer-listener{direction:inherit;pointer-events:none;overflow:hidden;visibility:hidden;box-sizing:border-box}.os-size-observer,.os-size-observer-listener,.os-size-observer-listener-item,.os-size-observer-listener-item-final{-ms-writing-mode:lr-tb;writing-mode:horizontal-tb;position:absolute;left:0;top:0}.os-size-observer{z-index:-1;contain:strict;display:flex;flex-direction:row;flex-wrap:nowrap;padding:inherit;border:inherit;box-sizing:inherit;margin:-133px;top:0;right:0;bottom:0;left:0;transform:scale(.1)}.os-size-observer:before{content:"";flex:none;box-sizing:inherit;padding:10px;width:10px;height:10px}.os-size-observer-appear{animation:os-size-observer-appear-animation 1ms forwards}.os-size-observer-listener{box-sizing:border-box;position:relative;flex:auto;padding:inherit;border:inherit;margin:-133px;transform:scale(10)}.os-size-observer-listener.ltr{margin-right:-266px;margin-left:0}.os-size-observer-listener.rtl{margin-left:-266px;margin-right:0}.os-size-observer-listener:empty:before{content:"";width:100%;height:100%}.os-size-observer-listener:empty:before,.os-size-observer-listener>.os-size-observer-listener-item{display:block;position:relative;padding:inherit;border:inherit;box-sizing:content-box;flex:auto}.os-size-observer-listener-scroll{box-sizing:border-box;display:flex}.os-size-observer-listener-item{right:0;bottom:0;overflow:hidden;direction:ltr;flex:none}.os-size-observer-listener-item-final{transition:none}@keyframes os-size-observer-appear-animation{0%{cursor:auto}to{cursor:none}}.os-trinsic-observer{flex:none;box-sizing:border-box;position:relative;max-width:0;max-height:1px;padding:0;margin:0;border:none;overflow:hidden;z-index:-1;height:0;top:calc(100% + 1px);contain:strict}.os-trinsic-observer:not(:empty){height:calc(100% + 1px);top:-1px}.os-trinsic-observer:not(:empty)>.os-size-observer{width:1000%;height:1000%;min-height:1px;min-width:1px}.os-environment{--os-custom-prop:-1;position:fixed;opacity:0;visibility:hidden;overflow:scroll;height:200px;width:200px;z-index:var(--os-custom-prop)}.os-environment div{width:200%;height:200%;margin:10px 0}.os-environment.os-environment-flexbox-glue{display:flex;flex-direction:row;flex-wrap:nowrap;height:auto;width:auto;min-height:200px;min-width:200px}.os-environment.os-environment-flexbox-glue div{flex:auto;width:auto;height:auto;max-height:100%;max-width:100%;margin:0}.os-environment.os-environment-flexbox-glue-max{max-height:200px}.os-environment.os-environment-flexbox-glue-max div{overflow:visible}.os-environment.os-environment-flexbox-glue-max div:before{content:"";display:block;height:999px;width:999px}.os-environment,.os-viewport{-ms-overflow-style:scrollbar!important}.os-viewport-scrollbar-hidden.os-environment,.os-viewport-scrollbar-hidden.os-viewport,[data-overlayscrollbars-initialize],[data-overlayscrollbars~=scrollbarHidden]{scrollbar-width:none!important}.os-viewport-scrollbar-hidden.os-environment::-webkit-scrollbar,.os-viewport-scrollbar-hidden.os-environment::-webkit-scrollbar-corner,.os-viewport-scrollbar-hidden.os-viewport::-webkit-scrollbar,.os-viewport-scrollbar-hidden.os-viewport::-webkit-scrollbar-corner,[data-overlayscrollbars-initialize]::-webkit-scrollbar,[data-overlayscrollbars-initialize]::-webkit-scrollbar-corner,[data-overlayscrollbars~=scrollbarHidden]::-webkit-scrollbar,[data-overlayscrollbars~=scrollbarHidden]::-webkit-scrollbar-corner{-webkit-appearance:none!important;appearance:none!important;display:none!important;width:0!important;height:0!important}[data-overlayscrollbars-initialize]{overflow:auto}html.os-viewport-scrollbar-hidden,html.os-viewport-scrollbar-hidden>body,html[data-overlayscrollbars]{box-sizing:border-box;margin:0;width:100%;height:100%}html[data-overlayscrollbars]>body{overflow:visible}[data-overlayscrollbars~=host]{position:relative}.os-padding,[data-overlayscrollbars~=host]{display:flex;flex-direction:row!important;flex-wrap:nowrap!important}.os-padding,.os-viewport{box-sizing:inherit;flex:auto!important;height:auto;width:100%;padding:0;margin:0;border:none;z-index:0}.os-viewport{--os-vaw:0;--os-vah:0}.os-viewport.os-viewport-arrange{position:relative}.os-viewport.os-viewport-arrange:before{content:"";position:absolute;pointer-events:none;z-index:-1;min-width:1px;min-height:1px;width:var(--os-vaw);height:var(--os-vah)}[data-overlayscrollbars~=host],[data-overlayscrollbars~=viewport]{overflow:hidden}[data-overlayscrollbars~=overflowVisible]{overflow:visible}[data-overlayscrollbars-overflow-x=hidden]{overflow-x:hidden}[data-overlayscrollbars-overflow-x=scroll]{overflow-x:scroll}[data-overlayscrollbars-overflow-x=hidden]{overflow-y:hidden}[data-overlayscrollbars-overflow-y=scroll]{overflow-y:scroll}.os-padding,.os-viewport{overflow:hidden}.os-overflow-visible{overflow:visible}.os-content{box-sizing:inherit}[data-overlayscrollbars-grid],[data-overlayscrollbars-grid] .os-padding{display:grid;grid-template:1fr/1fr}[data-overlayscrollbars-grid]>.os-padding,[data-overlayscrollbars-grid]>.os-padding>.os-viewport,[data-overlayscrollbars-grid]>.os-viewport{height:auto!important;width:auto!important}.os-scrollbar{contain:strict;transition:opacity .3s,visibility .3s,top .3s,right .3s,bottom .3s,left .3s;pointer-events:none;position:absolute;opacity:0;visibility:hidden}body>.os-scrollbar{position:fixed;z-index:99999}.os-scrollbar-transitionless{transition:none}.os-scrollbar-track{position:relative;direction:ltr!important;padding:0!important;border:none!important}.os-scrollbar-handle{position:absolute}.os-scrollbar-handle,.os-scrollbar-track{pointer-events:none;width:100%;height:100%}.os-scrollbar.os-scrollbar-handle-interactive .os-scrollbar-handle,.os-scrollbar.os-scrollbar-track-interactive .os-scrollbar-track{pointer-events:auto;touch-action:none}.os-scrollbar-horizontal{bottom:0;left:0}.os-scrollbar-vertical{top:0;right:0}.os-scrollbar-rtl.os-scrollbar-horizontal{right:0}.os-scrollbar-rtl.os-scrollbar-vertical{right:auto;left:0}.os-scrollbar-interaction.os-scrollbar-visible,.os-scrollbar-visible{opacity:1;visibility:visible}.os-scrollbar-auto-hidden{opacity:0;visibility:hidden}.os-scrollbar-unusable,.os-scrollbar-unusable *,.os-scrollbar-wheel,.os-scrollbar-wheel *{pointer-events:none!important}.os-scrollbar-unusable .os-scrollbar-handle{opacity:0!important}.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless,.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless.os-scrollbar-rtl{left:0;right:0}.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless,.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless.os-scrollbar-rtl{top:0;bottom:0}.os-theme-none.os-scrollbar,[data-overlayscrollbars~=updating]>.os-scrollbar{display:none!important}.os-theme-dark.os-scrollbar-horizontal,.os-theme-light.os-scrollbar-horizontal{right:10px;height:10px}.os-theme-dark.os-scrollbar-vertical,.os-theme-light.os-scrollbar-vertical{bottom:10px;width:10px}.os-theme-dark.os-scrollbar-rtl.os-scrollbar-horizontal,.os-theme-light.os-scrollbar-rtl.os-scrollbar-horizontal{left:10px;right:0}.os-theme-dark.os-scrollbar,.os-theme-light.os-scrollbar{padding:2px;box-sizing:border-box;background:transparent}.os-theme-dark.os-scrollbar-unusable,.os-theme-dark.os-scrollbar>.os-scrollbar-track,.os-theme-light.os-scrollbar-unusable,.os-theme-light.os-scrollbar>.os-scrollbar-track{background:transparent}.os-theme-dark.os-scrollbar-horizontal>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar-horizontal>.os-scrollbar-track>.os-scrollbar-handle{min-width:30px}.os-theme-dark.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle{min-height:30px}.os-theme-dark.os-scrollbar-transition>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar-transition>.os-scrollbar-track>.os-scrollbar-handle{transition:background-color .3s}.os-theme-dark.os-scrollbar>.os-scrollbar-track,.os-theme-dark.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle,.os-theme-light.os-scrollbar>.os-scrollbar-track,.os-theme-light.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{border-radius:10px}.os-theme-dark.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(0,0,0,.4)}.os-theme-light.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle{background:hsla(0,0%,100%,.4)}.os-theme-dark.os-scrollbar:hover>.os-scrollbar-track>.os-scrollbar-handle{background:rgba(0,0,0,.55)}.os-theme-light.os-scrollbar:hover>.os-scrollbar-track>.os-scrollbar-handle{background:hsla(0,0%,100%,.55)}.os-theme-dark.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle.active{background:rgba(0,0,0,.7)}.os-theme-light.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle.active{background:hsla(0,0%,100%,.7)}.os-theme-dark.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-dark.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-vertical .os-scrollbar-handle:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;display:block}.os-theme-dark.os-host-scrollbar-hidden>.os-scrollbar-handle:before{display:none}.os-theme-dark.os-scrollbar-horizontal .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-horizontal .os-scrollbar-handle:before{top:-6px;bottom:-2px}.os-theme-dark.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-vertical .os-scrollbar-handle:before{left:-6px;right:-2px}.os-theme-dark.os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle:before,.os-theme-light.os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle:before{right:-6px;left:-2px} \ No newline at end of file diff --git a/docs/index.html b/docs/index.html index ceaa0d1..28df3b4 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1,4 +1,4 @@ -OverlayScrollbars
OverlayScrollbars Logo

OverlayScrollbars

A javascript scrollbar plugin that hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling.

used by
OverlayScrollbars on Github

This page is a work in progress. For now refer to the TypeScript definitions for a more detailed documentation.
Looking for the v1 docs? Follow this link.

DownloadsVersionLicenseCode CoverageMax. Bundle Size

Why

+OverlayScrollbars
OverlayScrollbars Logo

OverlayScrollbars

A javascript scrollbar plugin that hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling.

used by
OverlayScrollbars on Github

This page is a work in progress. For now refer to the TypeScript definitions for a more detailed documentation.
Looking for the v1 docs? Follow this link.

DownloadsVersionLicenseCode CoverageMax. Bundle Size

Why

I created this plugin because I hate ugly and space consuming scrollbars. Similar plugins haven't met my requirements in terms of features, quality, simplicity, license or browser support.

Goals & Features

    @@ -193,6 +193,22 @@ For example you can appoint an existing element as the viewport ele

    Note: For now please refer to the TypeScript definitions for a more detailed description.

    You can write and publish your own Plugins. This section is a work in progress.

    +

    FAQ

    +

    How do I get the scroll position of an element I applied the OverlayScrollbars to?


    If you applied OverlayScrollbars to the body element you can use window.scrollX, window.scrollY or any other native api.

    If the plugin was applied to any other element you have to get the instance first. With the instance you can get the viewport element. With this element you can use element.scrollTop, element.scrollLeft or any other native api.

    const { viewport } = osInstance.elements();
+const { scrollLeft, scrollTop } = viewport;
    +

    How do I set the scroll position of an element I applied the OverlayScrollbars to?


    If you applied OverlayScrollbars to the body element you can scroll it with window.scroll, window.scrollTo, window.scrollBy or any other native api.

    If the plugin was applied to any other element you have to get the instance first. With the instance you can get the viewport element. With this element you can use element.scroll, element.scrollTo, element.scrollBy or any other native api.

    const { viewport } = osInstance.elements();
+viewport.scrollTo({ top: 0 });
    +

    Is it possible to limit / adjust the scrollbar handle length?


    You can adjust a scrollbars handle length by setting a min-width / min-height and max-width / max-height style:

    /* horizontal boundaries */
+.os-scrollbar-horizontal .os-scrollbar-handle {
+  min-width: 50px;
+  max-width: 200px;
+}
+/* vertical boundaries */
+.os-scrollbar-vertical .os-scrollbar-handle {
+  min-height: 40px;
+  max-height: 40px;
+}

    You can assign the same value to both properties to force the scrollbar to be always the same size.
    +Setting the width and height properties won't work since those are set by the plugin automatically.

    Feature comparison to v1

    • The scroll function is missing. Planned as a plugin. (WIP)
      • @@ -205,4 +221,4 @@ For example you can appoint an existing element as the viewport ele
    • Improve tests. (unit & browser tests)

    License

    -

    MIT

\ No newline at end of file +

MIT

\ No newline at end of file diff --git a/local/tailwind/tailwind.config.js b/local/tailwind/tailwind.config.js index c92c57d..beda332 100644 --- a/local/tailwind/tailwind.config.js +++ b/local/tailwind/tailwind.config.js @@ -82,10 +82,17 @@ module.exports = { display: 'inline', margin: 0, }, + details: { + marginTop: theme('margin[4]'), + marginBottom: theme('margin[4]'), + }, summary: { display: 'list-item', cursor: 'pointer', }, + 'summary + br': { + display: 'none', + }, }, }, primary: { diff --git a/website/README.md b/website/README.md deleted file mode 100644 index c87e042..0000000 --- a/website/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file. - -[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`. - -The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/website/src/components/index.mdx b/website/src/components/index.mdx index af24773..d57759b 100644 --- a/website/src/components/index.mdx +++ b/website/src/components/index.mdx @@ -463,6 +463,66 @@ OverlayScrollbars.plugin([SizeObserverPlugin, ClickScrollPlugin]); You can write and publish your own Plugins. This section is a work in progress. +## FAQ + +
+ + How do I get the scroll position of an element I applied the OverlayScrollbars to? + +
+ + If you applied `OverlayScrollbars` to the `body` element you can use [`window.scrollX`](https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollX), [`window.scrollY`](https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollY) or any other native api. + +If the plugin was applied to any other element you have to get the `instance` first. With the instance you can get the `viewport` element. With this element you can use [`element.scrollTop`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTop), [`element.scrollLeft`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft) or any other native api. + +```js +const { viewport } = osInstance.elements(); +const { scrollLeft, scrollTop } = viewport; +``` +
+ +
+ + How do I set the scroll position of an element I applied the OverlayScrollbars to? + +
+ + If you applied `OverlayScrollbars` to the `body` element you can scroll it with [`window.scroll`](https://developer.mozilla.org/en-US/docs/Web/API/Window/scroll), [`window.scrollTo`](https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo), [`window.scrollBy`](https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollBy) or any other native api. + +If the plugin was applied to any other element you have to get the `instance` first. With the instance you can get the `viewport` element. With this element you can use [`element.scroll`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scroll), [`element.scrollTo`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTo), [`element.scrollBy`](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollBy) or any other native api. + +```js +const { viewport } = osInstance.elements(); +viewport.scrollTo({ top: 0 }); +``` +
+ +
+ + Is it possible to limit / adjust the scrollbar handle length? + +
+ + You can adjust a scrollbars handle length by setting a `min-width / min-height` and `max-width / max-height` style: + +```css +/* horizontal boundaries */ +.os-scrollbar-horizontal .os-scrollbar-handle { + min-width: 50px; + max-width: 200px; +} +/* vertical boundaries */ +.os-scrollbar-vertical .os-scrollbar-handle { + min-height: 40px; + max-height: 40px; +} +``` + + You can assign the same value to both properties to force the scrollbar to be always the same size. + Setting the `width` and `height` properties won't work since those are set by the plugin automatically. + +
+ ## Feature comparison to `v1` - The `scroll` function is missing. Planned as a `plugin`. (WIP)