cegz-react-scrollbar - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist/index.js

@@ -1,5 +0,5 @@
-var O=require("./style.css");const c=require("react");function R(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var x={exports:{}};/*!
+var k=require("./style.css");const c=require("react");function R(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var x={exports:{}};/*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
-*/(function(e){(function(){var s={}.hasOwnProperty;function n(){for(var t="",o=0;o<arguments.length;o++){var r=arguments[o];r&&(t=d(t,i(r)))}return t}function i(t){if(typeof t=="string"||typeof t=="number")return t;if(typeof t!="object")return"";if(Array.isArray(t))return n.apply(null,t);if(t.toString!==Object.prototype.toString&&!t.toString.toString().includes("[native code]"))return t.toString();var o="";for(var r in t)s.call(t,r)&&t[r]&&(o=d(o,r));return o}function d(t,o){return o?t?t+" "+o:t+o:t}e.exports?(n.default=n,e.exports=n):window.classNames=n})()})(x);var C=x.exports;const y=R(C),P={vertical:{key:"vertical",size:"height",axis:"Y",offset:"offsetHeight",scroll:"scrollTop",scrollSize:"scrollHeight",client:"clientY",direction:"top"},horizontal:{key:"horizontal",size:"width",axis:"X",offset:"offsetWidth",scroll:"scrollLeft",scrollSize:"scrollWidth",client:"clientX",direction:"left"}};let S;function W(){if(S!==void 0)return S;const e=document.createElement("div");e.style.visibility="hidden",e.style.width="100px",e.style.position="absolute",e.style.top="-9999px",document.body.appendChild(e);const s=e.offsetWidth;e.style.overflow="scroll";const n=document.createElement("div");n.style.width="100%",e.appendChild(n);const i=n.offsetWidth;return e.parentNode.removeChild(e),S=s-i,S}function N({move:e,size:s,bar:n}){const i={},d=`translate${n.axis}(${e}%)`;return i[n.size]=s,i.transform=d,i.msTransform=d,i.WebkitTransform=d,i}function B(e,s){let n;return function(...i){clearTimeout(n),n=window.setTimeout(()=>{s.apply(this,i)},e)}}const L=function(e,s){e.__ro__=new ResizeObserver(B(16,s)),e.__ro__.observe(e)},M=function(e){e.__ro__.disconnect()};function _(e){const{wrapEle:s,vertical:n,size:i,move:d}=e,t=c.useRef(null),o=c.useRef(null),r=P[n?"vertical":"horizontal"],g=N({size:i,bar:r,move:d}),f=c.useRef({X:0,Y:0}),v=a=>{const m=t.current,h=a[r.client]-m.getBoundingClientRect()[r.direction],u=o.current[r.offset]/2,l=(h-u)*100/m[r.offset];s.current[r.scroll]=l*s.current[r.scrollSize]/100},b=a=>{a.ctrlKey||a.button===2||(f.current[r.axis]=a[r.client]-o.current.getBoundingClientRect()[r.direction],E(a))},E=a=>{a.stopPropagation(),document.addEventListener("mousemove",w),document.addEventListener("mouseup",z),document.onselectstart=()=>!1},w=a=>{const m=t.current,h=a[r.client]-m.getBoundingClientRect()[r.direction],u=f.current[r.axis],l=(h-u)*100/m[r.offset];s.current[r.scroll]=l*s.current[r.scrollSize]/100},z=()=>{f.current[r.axis]=0,document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",z),document.onselectstart=null};return c.createElement("div",{className:y("cegz-scrollbar-bar",`is-${r.key}`),ref:t,onMouseDown:v},c.createElement("div",{className:y("cegz-scrollbar-thumb"),style:g,ref:o,onMouseDown:b}))}function T(e){const{className:s,style:n={},wrapClass:i,viewClass:d,wrapStyle:t={},onScroll:o,children:r}=e,g=c.useRef(null),f=c.useRef(null),v=c.useRef(null),[b,E]=c.useState({width:"",height:""}),[w,z]=c.useState({x:0,y:0});c.useEffect(()=>(a(),L(v.current,a),()=>{v.current&&M(v.current)}),[]);const a=()=>{let u,l;const p=f.current;p&&(u=p.clientHeight*100/p.scrollHeight,l=p.clientWidth*100/p.scrollWidth,E({height:u<100?u+"%":"",width:l<100?l+"%":""}))},m=u=>{const l=f.current;z({y:l.scrollTop*100/l.clientHeight,x:l.scrollLeft*100/l.clientWidth}),o&&o(u)},h=W();if(h&&g.current){const{clientWidth:u,clientHeight:l}=g.current,p={width:u+h+"px",height:l+h+"px"};Object.assign(t,p)}return c.createElement("div",{className:y("cegz-scrollbar",s),ref:g,style:n},c.createElement("div",{className:y("cegz-scrollbar-view-wrap",i,{"cegz-scrollbar-view-wrap__hidden-default":!h}),style:t,onScroll:m,ref:f},c.createElement("div",{className:y("cegz-scrollbar-view",d),ref:v},r)),c.createElement(_,{wrapEle:f,size:b.width,move:w.x}),c.createElement(_,{wrapEle:f,vertical:!0,size:b.height,move:w.y}))}module.exports=T;
+*/(function(e){(function(){var s={}.hasOwnProperty;function n(){for(var t="",o=0;o<arguments.length;o++){var r=arguments[o];r&&(t=u(t,i(r)))}return t}function i(t){if(typeof t=="string"||typeof t=="number")return t;if(typeof t!="object")return"";if(Array.isArray(t))return n.apply(null,t);if(t.toString!==Object.prototype.toString&&!t.toString.toString().includes("[native code]"))return t.toString();var o="";for(var r in t)s.call(t,r)&&t[r]&&(o=u(o,r));return o}function u(t,o){return o?t?t+" "+o:t+o:t}e.exports?(n.default=n,e.exports=n):window.classNames=n})()})(x);var P=x.exports;const b=R(P),C={vertical:{key:"vertical",size:"height",axis:"Y",offset:"offsetHeight",scroll:"scrollTop",scrollSize:"scrollHeight",client:"clientY",direction:"top"},horizontal:{key:"horizontal",size:"width",axis:"X",offset:"offsetWidth",scroll:"scrollLeft",scrollSize:"scrollWidth",client:"clientX",direction:"left"}};let S;function N(){if(S!==void 0)return S;const e=document.createElement("div");e.style.visibility="hidden",e.style.width="100px",e.style.position="absolute",e.style.top="-9999px",document.body.appendChild(e);const s=e.offsetWidth;e.style.overflow="scroll";const n=document.createElement("div");n.style.width="100%",e.appendChild(n);const i=n.offsetWidth;return e.parentNode.removeChild(e),S=s-i,S}function W({move:e,size:s,bar:n}){const i={},u=`translate${n.axis}(${e}%)`;return i[n.size]=s,i.transform=u,i.msTransform=u,i.WebkitTransform=u,i}function B(e,s){let n;return function(...i){clearTimeout(n),n=window.setTimeout(()=>{s.apply(this,i)},e)}}const L=function(e,s){e.__ro__=new ResizeObserver(B(16,s)),e.__ro__.observe(e)},M=function(e){e.__ro__.disconnect()};function _(e){const{wrapEle:s,vertical:n,size:i,move:u}=e,t=c.useRef(null),o=c.useRef(null),r=C[n?"vertical":"horizontal"],v=W({size:i,bar:r,move:u}),d=c.useRef({X:0,Y:0}),p=l=>{const h=t.current,m=l[r.client]-h.getBoundingClientRect()[r.direction],f=o.current[r.offset]/2,a=(m-f)*100/h[r.offset];s.current[r.scroll]=a*s.current[r.scrollSize]/100},g=l=>{l.ctrlKey||l.button===2||(d.current[r.axis]=l[r.client]-o.current.getBoundingClientRect()[r.direction],E(l))},E=l=>{l.stopPropagation(),document.addEventListener("mousemove",y),document.addEventListener("mouseup",z),document.onselectstart=()=>!1},y=l=>{const h=t.current,m=l[r.client]-h.getBoundingClientRect()[r.direction],f=d.current[r.axis],a=(m-f)*100/h[r.offset];s.current[r.scroll]=a*s.current[r.scrollSize]/100},z=()=>{d.current[r.axis]=0,document.removeEventListener("mousemove",y),document.removeEventListener("mouseup",z),document.onselectstart=null};return c.createElement("div",{className:b("cegz-scrollbar-bar",`is-${r.key}`),ref:t,onMouseDown:p},c.createElement("div",{className:b("cegz-scrollbar-thumb"),style:v,ref:o,onMouseDown:g}))}function T(e){const{className:s,style:n={},wrapClass:i,viewClass:u,wrapStyle:t={},onScroll:o,children:r}=e,v=c.useRef(null),d=c.useRef(null),p=c.useRef(null),[g,E]=c.useState({width:"",height:""}),[y,z]=c.useState({x:0,y:0});c.useEffect(()=>(l(),L(p.current,l),()=>{p.current&&M(p.current)}),[]);const l=()=>{let f,a;const w=d.current;w&&(f=w.clientHeight*100/w.scrollHeight,a=w.clientWidth*100/w.scrollWidth,E({height:f<100?f+"%":"",width:a<100?a+"%":""}))},h=f=>{const a=d.current;z({y:a.scrollTop*100/a.clientHeight,x:a.scrollLeft*100/a.clientWidth}),o&&o(f)},m=N();return m&&v.current&&v.current.style.setProperty("--scrollbar-width",m+"px"),c.createElement("div",{className:b("cegz-scrollbar",s),ref:v,style:n},c.createElement("div",{className:b("cegz-scrollbar-view-wrap",i,{"cegz-scrollbar-view-wrap__hidden-default":!m}),style:t,onScroll:h,ref:d},c.createElement("div",{className:b("cegz-scrollbar-view",u),ref:p},r)),c.createElement(_,{wrapEle:d,size:g.width,move:y.x}),c.createElement(_,{wrapEle:d,vertical:!0,size:g.height,move:y.y}))}module.exports=T;

package.json

 {
   "name": "cegz-react-scrollbar",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A custom scroll bar component based on React.",
@@ -5,0 +5,0 @@ "license": "MIT",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

14568

decreased by-0.36%

Lines of code

212

decreased by-2.75%

No dependency changes