@m0ksem/vue-custom-scrollbar - npm Package Compare versions

Comparing version 0.0.2 to 0.0.3

dist/vue-custom-scrollbar.js

@@ -1,1 +0,1 @@
-(function(h,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core"],n):(h=typeof globalThis!="undefined"?globalThis:h||self,n(h["vue-custom-scrollbar"]={},h.Vue,h.core))})(this,function(h,n,y){"use strict";const se=()=>{},ie=Array.isArray,ae=e=>typeof e=="function",ce=e=>typeof e=="symbol";let le;function fe(e,t=le){t&&t.active&&t.effects.push(e)}const ue=e=>{const t=new Set(e);return t.w=0,t.n=0,t},B=e=>(e.w&p)>0,V=e=>(e.n&p)>0,de=({deps:e})=>{if(e.length)for(let t=0;t<e.length;t++)e[t].w|=p},he=e=>{const{deps:t}=e;if(t.length){let r=0;for(let o=0;o<t.length;o++){const s=t[o];B(s)&&!V(s)?s.delete(e):t[r++]=s,s.w&=~p,s.n&=~p}t.length=r}};let v=0,p=1;const C=30;let u;class pe{constructor(t,r=null,o){this.fn=t,this.scheduler=r,this.active=!0,this.deps=[],this.parent=void 0,fe(this,o)}run(){if(!this.active)return this.fn();let t=u,r=R;for(;t;){if(t===this)return;t=t.parent}try{return this.parent=u,u=this,R=!0,p=1<<++v,v<=C?de(this):N(this),this.fn()}finally{v<=C&&he(this),p=1<<--v,u=this.parent,R=r,this.parent=void 0}}stop(){this.active&&(N(this),this.onStop&&this.onStop(),this.active=!1)}}function N(e){const{deps:t}=e;if(t.length){for(let r=0;r<t.length;r++)t[r].delete(e);t.length=0}}let R=!0;function me(e,t){let r=!1;v<=C?V(e)||(e.n|=p,r=!B(e)):r=!e.has(u),r&&(e.add(u),u.deps.push(e))}function be(e,t){for(const r of ie(e)?e:[...e])(r!==u||r.allowRecurse)&&(r.scheduler?r.scheduler():r.run())}new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(ce));function w(e){const t=e&&e.__v_raw;return t?w(t):e}function ye(e){R&&u&&(e=w(e),me(e.dep||(e.dep=ue())))}function ge(e,t){e=w(e),e.dep&&be(e.dep)}class Se{constructor(t,r,o,s){this._setter=r,this.dep=void 0,this.__v_isRef=!0,this._dirty=!0,this.effect=new pe(t,()=>{this._dirty||(this._dirty=!0,ge(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!s,this.__v_isReadonly=o}get value(){const t=w(this);return ye(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function _e(e,t,r=!1){let o,s;const i=ae(e);return i?(o=e,s=se):(o=e.get,s=e.set),new Se(o,s,i||!s,r)}Promise.resolve();const ve=()=>_e(()=>typeof document!="undefined"?document:void 0),ke=e=>{const t=ve(),r=(i,a={})=>{if(!t.value)return null;const l=t.value.createElement(i);return Object.keys(a).forEach(f=>{l.style[f]=a[f]}),l},o=n.computed(()=>{const i=r("div",{visibility:"hidden",overflow:"scroll"}),a=r("div");return!i||!a?{parent:i,child:a}:(i.appendChild(a),{parent:i,child:a})});return{scrollbarSize:n.computed(()=>{var f,m,d;const{parent:i,child:a}=o.value;if(!a||!i||!t.value)return 0;(m=n.unref(e)||((f=t.value)==null?void 0:f.body))==null||m.appendChild(i);const l=i.offsetWidth-a.offsetWidth;return(d=i.parentElement)==null||d.removeChild(i),l})}},$e=e=>{const t=n.reactive({x:0,y:0}),r=o=>{const s=o.target;t.x=s.scrollLeft/s.scrollWidth*100,t.y=s.scrollTop/s.scrollHeight*100};return y.useEventListener(e,"scroll",r),n.watch(t,()=>{const o=n.unref(e);!o||o.scrollTo({top:t.y/100*o.scrollHeight,left:t.x/100*o.scrollWidth})}),t};var E=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{};function Te(e,t,r){var o=-1,s=e.length;t<0&&(t=-t>s?0:s+t),r=r>s?s:r,r<0&&(r+=s),s=t>r?0:r-t>>>0,t>>>=0;for(var i=Array(s);++o<s;)i[o]=e[o+t];return i}var Re=Te,we=Re;function Ee(e,t,r){var o=e.length;return r=r===void 0?o:r,!t&&r>=o?e:we(e,t,r)}var je=Ee,Ce="\\ud800-\\udfff",xe="\\u0300-\\u036f",ze="\\ufe20-\\ufe2f",Oe="\\u20d0-\\u20ff",Pe=xe+ze+Oe,Ae="\\ufe0e\\ufe0f",Be="\\u200d",Ve=RegExp("["+Be+Ce+Pe+Ae+"]");function Ne(e){return Ve.test(e)}var F=Ne;function Fe(e){return e.split("")}var Me=Fe,M="\\ud800-\\udfff",Ie="\\u0300-\\u036f",We="\\ufe20-\\ufe2f",Le="\\u20d0-\\u20ff",Ue=Ie+We+Le,Ge="\\ufe0e\\ufe0f",He="["+M+"]",x="["+Ue+"]",z="\\ud83c[\\udffb-\\udfff]",De="(?:"+x+"|"+z+")",I="[^"+M+"]",W="(?:\\ud83c[\\udde6-\\uddff]){2}",L="[\\ud800-\\udbff][\\udc00-\\udfff]",qe="\\u200d",U=De+"?",G="["+Ge+"]?",Je="(?:"+qe+"(?:"+[I,W,L].join("|")+")"+G+U+")*",Ke=G+U+Je,Ye="(?:"+[I+x+"?",x,W,L,He].join("|")+")",Xe=RegExp(z+"(?="+z+")|"+Ye+Ke,"g");function Ze(e){return e.match(Xe)||[]}var Qe=Ze,et=Me,tt=F,rt=Qe;function nt(e){return tt(e)?rt(e):et(e)}var ot=nt,st=typeof E=="object"&&E&&E.Object===Object&&E,it=st,at=it,ct=typeof self=="object"&&self&&self.Object===Object&&self,lt=at||ct||Function("return this")(),ft=lt,ut=ft,dt=ut.Symbol,O=dt;function ht(e,t){for(var r=-1,o=e==null?0:e.length,s=Array(o);++r<o;)s[r]=t(e[r],r,e);return s}var pt=ht,mt=Array.isArray,bt=mt,H=O,D=Object.prototype,yt=D.hasOwnProperty,gt=D.toString,k=H?H.toStringTag:void 0;function St(e){var t=yt.call(e,k),r=e[k];try{e[k]=void 0;var o=!0}catch{}var s=gt.call(e);return o&&(t?e[k]=r:delete e[k]),s}var _t=St,vt=Object.prototype,kt=vt.toString;function $t(e){return kt.call(e)}var Tt=$t,q=O,Rt=_t,wt=Tt,Et="[object Null]",jt="[object Undefined]",J=q?q.toStringTag:void 0;function Ct(e){return e==null?e===void 0?jt:Et:J&&J in Object(e)?Rt(e):wt(e)}var xt=Ct;function zt(e){return e!=null&&typeof e=="object"}var Ot=zt,Pt=xt,At=Ot,Bt="[object Symbol]";function Vt(e){return typeof e=="symbol"||At(e)&&Pt(e)==Bt}var K=Vt,Y=O,Nt=pt,Ft=bt,Mt=K,It=1/0,X=Y?Y.prototype:void 0,Z=X?X.toString:void 0;function Q(e){if(typeof e=="string")return e;if(Ft(e))return Nt(e,Q)+"";if(Mt(e))return Z?Z.call(e):"";var t=e+"";return t=="0"&&1/e==-It?"-0":t}var Wt=Q,Lt=Wt;function Ut(e){return e==null?"":Lt(e)}var Gt=Ut,Ht=je,Dt=F,qt=ot,Jt=Gt;function Kt(e){return function(t){t=Jt(t);var r=Dt(t)?qt(t):void 0,o=r?r[0]:t.charAt(0),s=r?Ht(r,1).join(""):t.slice(1);return o[e]()+s}}var Yt=Kt,Xt=Yt,Zt=Xt("toUpperCase"),ee=Zt;const te=(e,t="value")=>{if(typeof e=="number")return`${e}%`;if(e.endsWith("%"))return e;throw new Error(`${ee(t)} must be string number in percents or just a number. For example 40%.`)},P=(e,t="value")=>{if(typeof e=="number")return`${e}px`;if(e.endsWith("px"))return e;throw new Error(`${ee(t)} must be string number in pixels or just a number. For example 200px`)};function Qt(e,t,r){return e===e&&(r!==void 0&&(e=e<=r?e:r),t!==void 0&&(e=e>=t?e:t)),e}var er=Qt,tr=/\s/;function rr(e){for(var t=e.length;t--&&tr.test(e.charAt(t)););return t}var nr=rr,or=nr,sr=/^\s+/;function ir(e){return e&&e.slice(0,or(e)+1).replace(sr,"")}var ar=ir;function cr(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var lr=cr,fr=ar,re=lr,ur=K,ne=0/0,dr=/^[-+]0x[0-9a-f]+$/i,hr=/^0b[01]+$/i,pr=/^0o[0-7]+$/i,mr=parseInt;function br(e){if(typeof e=="number")return e;if(ur(e))return ne;if(re(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=re(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=fr(e);var r=hr.test(e);return r||pr.test(e)?mr(e.slice(2),r?2:8):dr.test(e)?ne:+e}var yr=br,gr=er,A=yr;function Sr(e,t,r){return r===void 0&&(r=t,t=void 0),r!==void 0&&(r=A(r),r=r===r?r:0),t!==void 0&&(t=A(t),t=t===t?t:0),gr(A(e),t,r)}var oe=Sr;const _r=e=>{const t=n.ref(!1),r=()=>{t.value=!1};return y.useEventListener(e,"mousedown",()=>{t.value=!0}),y.useEventListener("mouseup",r),y.useEventListener("blur",r),{isFocused:t}},vr=(e,t)=>{const r=n.ref({x:0,y:0}),{isFocused:o}=_r(t),s=i=>{var c,b;if(!o.value)return;const a=(c=n.unref(e))==null?void 0:c.getBoundingClientRect(),l=(b=n.unref(t))==null?void 0:b.getBoundingClientRect();if(!a||!l)return;const f=l.top-a.top,m=l.left-a.left,d=oe(f+i.movementY,0,a.height-l.height),g=oe(m+i.movementX,0,a.width-l.width),$=d/a.height*100,S=g/a.width*100;r.value={y:$,x:S}};return y.useEventListener("mousemove",s),{position:r,isFocused:o}};var Er="";const kr={class:"track-wrapper"},$r=n.defineComponent({props:{modelValue:{type:Number,required:!0,validator(e){return e>=0&&e<=100}},position:{type:String,default:"right",validator(e){return["bottom","right","left","top"].includes(e)}},size:{type:[String,Number],required:!0},thickness:{type:[String,Number],default:"18px"},color:{type:String},trackColor:{type:String}},emits:["update:modelValue"],setup(e,{emit:t}){const r=e,o=()=>r.position==="bottom"||r.position==="top",s=()=>o()?"width":"height",i=()=>o()?"height":"width",a=()=>o()?"left":"top",l=n.computed(()=>({[a()]:te(r.modelValue),[s()]:te(r.size,"size"),[i()]:P(r.thickness,"thickness")})),f=n.computed(()=>({[i()]:P(r.thickness,"thickness")})),m=n.computed(()=>({["scrollbar--focused"]:S.value,[`scrollbar--${r.position}`]:!0})),d=n.ref(),g=n.ref(),{position:$,isFocused:S}=vr(g,d);n.watch($,({x:b,y:_})=>{const j=o()?b:_;t("update:modelValue",j)});const c=n.computed(()=>({horizontal:o(),vertical:!o(),placement:o()?"horizontal":"vertical",focused:S.value}));return(b,_)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["scrollbar",n.unref(m)]),style:n.normalizeStyle(n.unref(f)),ref_key:"scrollbarRef",ref:g},[n.createElementVNode("div",{class:"thumb-wrapper",style:n.normalizeStyle(n.unref(l)),ref_key:"thumbRef",ref:d},[n.renderSlot(b.$slots,"thumb",n.normalizeProps(n.guardReactiveProps(n.unref(c))),()=>[n.createElementVNode("div",{class:"thumb thumb--default",style:n.normalizeStyle({background:e.color})},null,4)])],4),n.createElementVNode("div",kr,[n.renderSlot(b.$slots,"track",n.normalizeProps(n.guardReactiveProps(n.unref(c))),()=>[n.createElementVNode("div",{class:"track track--default",style:n.normalizeStyle({background:e.trackColor})},null,4)])])],6))}});var jr="",Tr=(e,t)=>{const r=e.__vccOpts||e;for(const[o,s]of t)r[o]=s;return r};const Rr={class:"vue-custom-scrollbar"};var wr=Tr(n.defineComponent({props:{top:{type:Boolean,default:!1},left:{type:Boolean,default:!1},bottom:{type:Boolean,default:!1},right:{type:Boolean,default:!1},inner:{type:Boolean,default:!1},thickness:{type:[String,Number]},color:{type:String,default:"#9d4edd"},trackColor:{type:String,default:"#3c096c"}},setup(e){const t=e,{scrollbarSize:r}=ke(),o=n.computed(()=>t.thickness||r.value),s=n.computed(()=>{if(!t.inner)return{padding:[t.top,t.right,t.bottom,t.left].map(c=>c?P(o.value,"thickness"):"0").join(" ")}}),i=n.ref(),a=n.ref(),l=$e(i),{width:f,height:m}=y.useElementSize(i),{width:d,height:g}=y.useElementSize(a),$=n.computed(()=>({x:f.value/d.value*100,y:m.value/g.value*100})),S=n.computed(()=>{const c=[];return t.top&&c.push({main:"x",cross:"y",position:"top"}),t.left&&c.push({main:"y",cross:"x",position:"left"}),t.right&&c.push({main:"y",cross:"x",position:"right"}),t.bottom&&c.push({main:"x",cross:"y",position:"bottom"}),c});return(c,b)=>(n.openBlock(),n.createElementBlock("div",Rr,[n.createElementVNode("div",{class:"vue-custom-scrollbar__scrollable",ref_key:"scrollableRef",ref:i},[n.createElementVNode("div",{class:"vue-custom-scrollbar__inner",style:n.normalizeStyle(n.unref(s)),ref_key:"innerRef",ref:a},[n.renderSlot(c.$slots,"default",{},void 0,!0)],4)],512),(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(n.unref(S),({main:_,position:j})=>(n.openBlock(),n.createBlock($r,{key:j,size:n.unref($)[_],position:j,thickness:n.unref(o),color:e.color,trackColor:e.trackColor,modelValue:n.unref(l)[_],"onUpdate:modelValue":T=>n.unref(l)[_]=T},{thumb:n.withCtx(T=>[n.renderSlot(c.$slots,"thumb",n.normalizeProps(n.guardReactiveProps(T)),void 0,!0)]),track:n.withCtx(T=>[n.renderSlot(c.$slots,"track",n.normalizeProps(n.guardReactiveProps(T)),void 0,!0)]),_:2},1032,["size","position","thickness","color","trackColor","modelValue","onUpdate:modelValue"]))),128))]))}}),[["__scopeId","data-v-4a57777c"]]);h.VueCustomScrollbar=wr,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(h,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core"],n):(h=typeof globalThis!="undefined"?globalThis:h||self,n(h["vue-custom-scrollbar"]={},h.Vue,h.core))})(this,function(h,n,y){"use strict";const se=()=>{},ie=Array.isArray,ae=e=>typeof e=="function",ce=e=>typeof e=="symbol";let le;function fe(e,t=le){t&&t.active&&t.effects.push(e)}const ue=e=>{const t=new Set(e);return t.w=0,t.n=0,t},B=e=>(e.w&p)>0,V=e=>(e.n&p)>0,de=({deps:e})=>{if(e.length)for(let t=0;t<e.length;t++)e[t].w|=p},he=e=>{const{deps:t}=e;if(t.length){let r=0;for(let s=0;s<t.length;s++){const o=t[s];B(o)&&!V(o)?o.delete(e):t[r++]=o,o.w&=~p,o.n&=~p}t.length=r}};let v=0,p=1;const C=30;let u;class pe{constructor(t,r=null,s){this.fn=t,this.scheduler=r,this.active=!0,this.deps=[],this.parent=void 0,fe(this,s)}run(){if(!this.active)return this.fn();let t=u,r=R;for(;t;){if(t===this)return;t=t.parent}try{return this.parent=u,u=this,R=!0,p=1<<++v,v<=C?de(this):N(this),this.fn()}finally{v<=C&&he(this),p=1<<--v,u=this.parent,R=r,this.parent=void 0}}stop(){this.active&&(N(this),this.onStop&&this.onStop(),this.active=!1)}}function N(e){const{deps:t}=e;if(t.length){for(let r=0;r<t.length;r++)t[r].delete(e);t.length=0}}let R=!0;function me(e,t){let r=!1;v<=C?V(e)||(e.n|=p,r=!B(e)):r=!e.has(u),r&&(e.add(u),u.deps.push(e))}function be(e,t){for(const r of ie(e)?e:[...e])(r!==u||r.allowRecurse)&&(r.scheduler?r.scheduler():r.run())}new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(ce));function w(e){const t=e&&e.__v_raw;return t?w(t):e}function ye(e){R&&u&&(e=w(e),me(e.dep||(e.dep=ue())))}function ge(e,t){e=w(e),e.dep&&be(e.dep)}class Se{constructor(t,r,s,o){this._setter=r,this.dep=void 0,this.__v_isRef=!0,this._dirty=!0,this.effect=new pe(t,()=>{this._dirty||(this._dirty=!0,ge(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!o,this.__v_isReadonly=s}get value(){const t=w(this);return ye(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function _e(e,t,r=!1){let s,o;const i=ae(e);return i?(s=e,o=se):(s=e.get,o=e.set),new Se(s,o,i||!o,r)}Promise.resolve();const ve=()=>_e(()=>typeof document!="undefined"?document:void 0),ke=e=>{const t=ve(),r=(i,a={})=>{if(!t.value)return null;const l=t.value.createElement(i);return Object.keys(a).forEach(f=>{l.style[f]=a[f]}),l},s=n.computed(()=>{const i=r("div",{visibility:"hidden",overflow:"scroll"}),a=r("div");return!i||!a?{parent:i,child:a}:(i.appendChild(a),{parent:i,child:a})});return{scrollbarSize:n.computed(()=>{var f,m,d;const{parent:i,child:a}=s.value;if(!a||!i||!t.value)return 0;(m=n.unref(e)||((f=t.value)==null?void 0:f.body))==null||m.appendChild(i);const l=i.offsetWidth-a.offsetWidth;return(d=i.parentElement)==null||d.removeChild(i),l})}},$e=e=>{const t=n.reactive({x:0,y:0}),r=o=>{const i=o.target;t.x=i.scrollLeft/i.scrollWidth*100,t.y=i.scrollTop/i.scrollHeight*100};y.useEventListener(e,"scroll",r);const s=()=>{const o=n.unref(e);!o||o.scrollTo({top:t.y/100*o.scrollHeight,left:t.x/100*o.scrollWidth})};return new Proxy(t,{set(o,i,a){return o[i]=a,s(),!0}})};var E=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{};function Te(e,t,r){var s=-1,o=e.length;t<0&&(t=-t>o?0:o+t),r=r>o?o:r,r<0&&(r+=o),o=t>r?0:r-t>>>0,t>>>=0;for(var i=Array(o);++s<o;)i[s]=e[s+t];return i}var Re=Te,we=Re;function Ee(e,t,r){var s=e.length;return r=r===void 0?s:r,!t&&r>=s?e:we(e,t,r)}var je=Ee,Ce="\\ud800-\\udfff",xe="\\u0300-\\u036f",ze="\\ufe20-\\ufe2f",Pe="\\u20d0-\\u20ff",Oe=xe+ze+Pe,Ae="\\ufe0e\\ufe0f",Be="\\u200d",Ve=RegExp("["+Be+Ce+Oe+Ae+"]");function Ne(e){return Ve.test(e)}var F=Ne;function Fe(e){return e.split("")}var Me=Fe,M="\\ud800-\\udfff",Ie="\\u0300-\\u036f",We="\\ufe20-\\ufe2f",Le="\\u20d0-\\u20ff",Ue=Ie+We+Le,Ge="\\ufe0e\\ufe0f",He="["+M+"]",x="["+Ue+"]",z="\\ud83c[\\udffb-\\udfff]",De="(?:"+x+"|"+z+")",I="[^"+M+"]",W="(?:\\ud83c[\\udde6-\\uddff]){2}",L="[\\ud800-\\udbff][\\udc00-\\udfff]",qe="\\u200d",U=De+"?",G="["+Ge+"]?",Je="(?:"+qe+"(?:"+[I,W,L].join("|")+")"+G+U+")*",Ke=G+U+Je,Ye="(?:"+[I+x+"?",x,W,L,He].join("|")+")",Xe=RegExp(z+"(?="+z+")|"+Ye+Ke,"g");function Ze(e){return e.match(Xe)||[]}var Qe=Ze,et=Me,tt=F,rt=Qe;function nt(e){return tt(e)?rt(e):et(e)}var ot=nt,st=typeof E=="object"&&E&&E.Object===Object&&E,it=st,at=it,ct=typeof self=="object"&&self&&self.Object===Object&&self,lt=at||ct||Function("return this")(),ft=lt,ut=ft,dt=ut.Symbol,P=dt;function ht(e,t){for(var r=-1,s=e==null?0:e.length,o=Array(s);++r<s;)o[r]=t(e[r],r,e);return o}var pt=ht,mt=Array.isArray,bt=mt,H=P,D=Object.prototype,yt=D.hasOwnProperty,gt=D.toString,k=H?H.toStringTag:void 0;function St(e){var t=yt.call(e,k),r=e[k];try{e[k]=void 0;var s=!0}catch{}var o=gt.call(e);return s&&(t?e[k]=r:delete e[k]),o}var _t=St,vt=Object.prototype,kt=vt.toString;function $t(e){return kt.call(e)}var Tt=$t,q=P,Rt=_t,wt=Tt,Et="[object Null]",jt="[object Undefined]",J=q?q.toStringTag:void 0;function Ct(e){return e==null?e===void 0?jt:Et:J&&J in Object(e)?Rt(e):wt(e)}var xt=Ct;function zt(e){return e!=null&&typeof e=="object"}var Pt=zt,Ot=xt,At=Pt,Bt="[object Symbol]";function Vt(e){return typeof e=="symbol"||At(e)&&Ot(e)==Bt}var K=Vt,Y=P,Nt=pt,Ft=bt,Mt=K,It=1/0,X=Y?Y.prototype:void 0,Z=X?X.toString:void 0;function Q(e){if(typeof e=="string")return e;if(Ft(e))return Nt(e,Q)+"";if(Mt(e))return Z?Z.call(e):"";var t=e+"";return t=="0"&&1/e==-It?"-0":t}var Wt=Q,Lt=Wt;function Ut(e){return e==null?"":Lt(e)}var Gt=Ut,Ht=je,Dt=F,qt=ot,Jt=Gt;function Kt(e){return function(t){t=Jt(t);var r=Dt(t)?qt(t):void 0,s=r?r[0]:t.charAt(0),o=r?Ht(r,1).join(""):t.slice(1);return s[e]()+o}}var Yt=Kt,Xt=Yt,Zt=Xt("toUpperCase"),ee=Zt;const te=(e,t="value")=>{if(typeof e=="number")return`${e}%`;if(e.endsWith("%"))return e;throw new Error(`${ee(t)} must be string number in percents or just a number. For example 40%.`)},O=(e,t="value")=>{if(typeof e=="number")return`${e}px`;if(e.endsWith("px"))return e;throw new Error(`${ee(t)} must be string number in pixels or just a number. For example 200px`)};function Qt(e,t,r){return e===e&&(r!==void 0&&(e=e<=r?e:r),t!==void 0&&(e=e>=t?e:t)),e}var er=Qt,tr=/\s/;function rr(e){for(var t=e.length;t--&&tr.test(e.charAt(t)););return t}var nr=rr,or=nr,sr=/^\s+/;function ir(e){return e&&e.slice(0,or(e)+1).replace(sr,"")}var ar=ir;function cr(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var lr=cr,fr=ar,re=lr,ur=K,ne=0/0,dr=/^[-+]0x[0-9a-f]+$/i,hr=/^0b[01]+$/i,pr=/^0o[0-7]+$/i,mr=parseInt;function br(e){if(typeof e=="number")return e;if(ur(e))return ne;if(re(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=re(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=fr(e);var r=hr.test(e);return r||pr.test(e)?mr(e.slice(2),r?2:8):dr.test(e)?ne:+e}var yr=br,gr=er,A=yr;function Sr(e,t,r){return r===void 0&&(r=t,t=void 0),r!==void 0&&(r=A(r),r=r===r?r:0),t!==void 0&&(t=A(t),t=t===t?t:0),gr(A(e),t,r)}var oe=Sr;const _r=e=>{const t=n.ref(!1),r=()=>{t.value=!1};return y.useEventListener(e,"mousedown",()=>{t.value=!0}),y.useEventListener("mouseup",r),y.useEventListener("blur",r),{isFocused:t}},vr=(e,t)=>{const r=n.ref({x:0,y:0}),{isFocused:s}=_r(t),o=i=>{var c,b;if(!s.value)return;const a=(c=n.unref(e))==null?void 0:c.getBoundingClientRect(),l=(b=n.unref(t))==null?void 0:b.getBoundingClientRect();if(!a||!l)return;const f=l.top-a.top,m=l.left-a.left,d=oe(f+i.movementY,0,a.height-l.height),g=oe(m+i.movementX,0,a.width-l.width),$=d/a.height*100,S=g/a.width*100;r.value={y:$,x:S}};return y.useEventListener("mousemove",o),{position:r,isFocused:s}};var Er="";const kr={class:"track-wrapper"},$r=n.defineComponent({props:{modelValue:{type:Number,required:!0,validator(e){return e>=0&&e<=100}},position:{type:String,default:"right",validator(e){return["bottom","right","left","top"].includes(e)}},size:{type:[String,Number],required:!0},thickness:{type:[String,Number],default:"18px"},color:{type:String},trackColor:{type:String}},emits:["update:modelValue"],setup(e,{emit:t}){const r=e,s=()=>r.position==="bottom"||r.position==="top",o=()=>s()?"width":"height",i=()=>s()?"height":"width",a=()=>s()?"left":"top",l=n.computed(()=>({[a()]:te(r.modelValue),[o()]:te(r.size,"size"),[i()]:O(r.thickness,"thickness")})),f=n.computed(()=>({[i()]:O(r.thickness,"thickness")})),m=n.computed(()=>({["scrollbar--focused"]:S.value,[`scrollbar--${r.position}`]:!0})),d=n.ref(),g=n.ref(),{position:$,isFocused:S}=vr(g,d);n.watch($,({x:b,y:_})=>{const j=s()?b:_;t("update:modelValue",j)});const c=n.computed(()=>({horizontal:s(),vertical:!s(),placement:s()?"horizontal":"vertical",focused:S.value}));return(b,_)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["scrollbar",n.unref(m)]),style:n.normalizeStyle(n.unref(f)),ref_key:"scrollbarRef",ref:g},[n.createElementVNode("div",{class:"thumb-wrapper",style:n.normalizeStyle(n.unref(l)),ref_key:"thumbRef",ref:d},[n.renderSlot(b.$slots,"thumb",n.normalizeProps(n.guardReactiveProps(n.unref(c))),()=>[n.createElementVNode("div",{class:"thumb thumb--default",style:n.normalizeStyle({background:e.color})},null,4)])],4),n.createElementVNode("div",kr,[n.renderSlot(b.$slots,"track",n.normalizeProps(n.guardReactiveProps(n.unref(c))),()=>[n.createElementVNode("div",{class:"track track--default",style:n.normalizeStyle({background:e.trackColor})},null,4)])])],6))}});var jr="",Tr=(e,t)=>{const r=e.__vccOpts||e;for(const[s,o]of t)r[s]=o;return r};const Rr={class:"vue-custom-scrollbar"};var wr=Tr(n.defineComponent({props:{top:{type:Boolean,default:!1},left:{type:Boolean,default:!1},bottom:{type:Boolean,default:!1},right:{type:Boolean,default:!1},inner:{type:Boolean,default:!1},thickness:{type:[String,Number]},color:{type:String,default:"#9d4edd"},trackColor:{type:String,default:"#3c096c"}},setup(e){const t=e,{scrollbarSize:r}=ke(),s=n.computed(()=>t.thickness||r.value),o=n.computed(()=>{if(!t.inner)return{padding:[t.top,t.right,t.bottom,t.left].map(c=>c?O(s.value,"thickness"):"0").join(" ")}}),i=n.ref(),a=n.ref(),l=$e(i),{width:f,height:m}=y.useElementSize(i),{width:d,height:g}=y.useElementSize(a),$=n.computed(()=>({x:f.value/d.value*100,y:m.value/g.value*100})),S=n.computed(()=>{const c=[];return t.top&&c.push({main:"x",cross:"y",position:"top"}),t.left&&c.push({main:"y",cross:"x",position:"left"}),t.right&&c.push({main:"y",cross:"x",position:"right"}),t.bottom&&c.push({main:"x",cross:"y",position:"bottom"}),c});return(c,b)=>(n.openBlock(),n.createElementBlock("div",Rr,[n.createElementVNode("div",{class:"vue-custom-scrollbar__scrollable",ref_key:"scrollableRef",ref:i},[n.createElementVNode("div",{class:"vue-custom-scrollbar__inner",style:n.normalizeStyle(n.unref(o)),ref_key:"innerRef",ref:a},[n.renderSlot(c.$slots,"default",{},void 0,!0)],4)],512),(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(n.unref(S),({main:_,position:j})=>(n.openBlock(),n.createBlock($r,{key:j,size:n.unref($)[_],position:j,thickness:n.unref(s),color:e.color,trackColor:e.trackColor,modelValue:n.unref(l)[_],"onUpdate:modelValue":T=>n.unref(l)[_]=T},{thumb:n.withCtx(T=>[n.renderSlot(c.$slots,"thumb",n.normalizeProps(n.guardReactiveProps(T)),void 0,!0)]),track:n.withCtx(T=>[n.renderSlot(c.$slots,"track",n.normalizeProps(n.guardReactiveProps(T)),void 0,!0)]),_:2},1032,["size","position","thickness","color","trackColor","modelValue","onUpdate:modelValue"]))),128))]))}}),[["__scopeId","data-v-087e0248"]]);h.VueCustomScrollbar=wr,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package.json

 {
   "name": "@m0ksem/vue-custom-scrollbar",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "main": "./dist/vue-custom-scrollbar.js",
@@ -16,3 +16,3 @@ "module": "./dist/vue-custom-scrollbar.mjs",
   },
-  "dependencies": {
+  "peerDependencies": {
     "@vueuse/core": "^8.1.2",
@@ -19,0 +19,0 @@ "vue": "3.2.31"

No alert changes

Improved metrics

Total package byte prevSize

46381

increased by0.34%

Lines of code

960

increased by0.63%

Dependency changes

• - Removed@vueuse/core@^8.1.2

• - Removedvue@3.2.31