@ehfuse/overlay-scrollbar 1.7.3 → 1.7.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -43,5 +43,5 @@ import{useRef as P,useEffect as $,useState as m,useCallback as f,useMemo as xe,f
43
43
  from { transform: rotate(0deg); }
44
44
  to { transform: rotate(360deg); }
45
45
  }
46
- `,document.head.appendChild(o),()=>{let i=document.getElementById(e);i&&i.remove()}},[]),_e("div",{ref:Te,className:`overlay-scrollbar-wrapper ${E}`,onMouseLeave:xt,style:{display:"flex",flexDirection:"column",position:"relative",minHeight:0,height:"100%",flex:"1 1 0%",overflow:"visible",...k},children:[st&&R("div",{className:"overlay-scrollbar-pull-indicator",style:{position:"absolute",top:0,left:"50%",transform:`translate(-50%, ${w-44}px)`,transition:re?"transform 0.15s ease-out":w===0?"transform 0.2s ease-out":"none",width:36,height:36,borderRadius:"50%",background:"#ffffff",boxShadow:"0 2px 8px rgba(0, 0, 0, 0.25)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1001,pointerEvents:"none",opacity:re?1:Math.min(ne*1.5,1)},children:re?R("svg",{width:"20",height:"20",viewBox:"0 0 24 24",style:{animation:"overlay-scrollbar-ptr-spin 0.8s linear infinite"},children:R("circle",{cx:"12",cy:"12",r:"9",fill:"none",stroke:Ue,strokeWidth:"2.5",strokeLinecap:"round",strokeDasharray:"42",strokeDashoffset:"14"})}):R("svg",{width:"20",height:"20",viewBox:"0 0 24 24",style:{transform:`rotate(${ne*270}deg)`,opacity:ne>=1?1:.6},children:R("path",{d:"M17.65 6.35A7.958 7.958 0 0 0 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08A5.99 5.99 0 0 1 12 18c-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z",fill:Ue})})}),R("div",{ref:l,className:"overlay-scrollbar-container",tabIndex:-1,onMouseDown:Ht,style:{display:"flex",width:"100%",flex:"1 1 auto",minHeight:0,overflow:"auto",scrollbarWidth:"none",msOverflowStyle:"none",outline:"none",userSelect:K?"none":"auto",...z},children:R("div",{ref:G,className:"overlay-scrollbar-content",style:{flex:"1 1 0%",minHeight:0,display:"flex",flexDirection:"column",boxSizing:"border-box",...y},children:_})}),A&&le&&(r.overflowY??!0)&&_e("div",{ref:j,className:"overlay-scrollbar-track",onMouseEnter:()=>{g(),Q.current=setTimeout(()=>{x(!0),Q.current=null},100)},onMouseLeave:()=>{Ce(),U||h(a.delay)},style:{position:"absolute",top:0,right:0,width:`${L}px`,height:"100%",opacity:we?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[r.visible&&R("div",{className:"overlay-scrollbar-track-background",onClick:e=>{e.preventDefault(),e.stopPropagation(),wt(e)},style:{position:"absolute",top:X?`${T.width+r.margin*2}px`:`${r.margin}px`,right:r.alignment==="outside"?"0px":`${(L-T.width)/2}px`,width:`${T.width}px`,height:X?`calc(100% - ${T.width*2+r.margin*4}px)`:`calc(100% - ${r.margin*2}px)`,backgroundColor:r.color,borderRadius:`${r.radius}px`,cursor:"pointer"}}),R("div",{ref:oe,className:"overlay-scrollbar-thumb",onMouseDown:Tt,onMouseEnter:()=>Ye(!0),onMouseLeave:()=>Ye(!1),style:{position:"absolute",top:`${(X?b+r.margin*2:r.margin)+dt}px`,right:r.alignment==="outside"?"0px":`${(L-b)/2}px`,width:`${b}px`,height:`${Math.max(fe,Oe)}px`,backgroundColor:Xe||U?T.hoverColor:T.color,opacity:Xe||U?T.hoverOpacity:T.opacity,borderRadius:`${T.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]}),A&&le&&X&&R("div",{className:"overlay-scrollbar-up-arrow",onClick:Mt,onMouseEnter:()=>Ee("up"),onMouseLeave:()=>Ee(null),style:{position:"absolute",top:`${r.margin}px`,right:r.alignment==="outside"?"0px":`${(L-b)/2}px`,width:`${b}px`,height:`${b}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(b*.75,8)}px`,color:Me==="up"?F.hoverColor:F.color,userSelect:"none",zIndex:1001,opacity:we?Me==="up"?F.hoverOpacity:F.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25B2"}),A&&le&&X&&R("div",{className:"overlay-scrollbar-down-arrow",onClick:Et,onMouseEnter:()=>Ee("down"),onMouseLeave:()=>Ee(null),style:{position:"absolute",bottom:`${r.margin}px`,right:r.alignment==="outside"?"0px":`${(L-b)/2}px`,width:`${b}px`,height:`${b}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(b*.75,8)}px`,color:Me==="down"?F.hoverColor:F.color,userSelect:"none",zIndex:1001,opacity:we?Me==="down"?F.hoverOpacity:F.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25BC"}),A&&q&&ft&&(r.overflowX??!0)&&_e("div",{className:"overlay-scrollbar-horizontal-track",onMouseEnter:()=>{g(),Q.current=setTimeout(()=>{x(!0),Q.current=null},100)},onMouseLeave:()=>{Ce(),B||h(a.delay)},style:{position:"absolute",bottom:`${bt}px`,left:0,width:"100%",height:`${L}px`,opacity:we?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[r.visible&&R("div",{className:"overlay-scrollbar-horizontal-track-background",onClick:e=>{e.preventDefault(),e.stopPropagation(),Ct(e)},style:{position:"absolute",bottom:r.alignment==="outside"?"0px":`${(L-b)/2}px`,left:`${r.margin}px`,right:le?r.alignment==="outside"?`${L-r.margin}px`:`${L}px`:`${r.margin}px`,height:`${b}px`,backgroundColor:r.color,borderRadius:`${r.radius}px`,cursor:"pointer"}}),R("div",{className:"overlay-scrollbar-horizontal-thumb",onMouseDown:St,onMouseEnter:()=>Ke(!0),onMouseLeave:()=>Ke(!1),style:{position:"absolute",bottom:r.alignment==="outside"?"0px":`${(L-b)/2}px`,left:`${r.margin+We}px`,right:le?r.alignment==="outside"?`${L-r.margin}px`:`${L}px`:"auto",maxWidth:le?r.alignment==="outside"?`calc(100% - ${r.margin+We+L-r.margin}px)`:`calc(100% - ${r.margin+We+L}px)`:"none",width:`${Math.max(Ie,50)}px`,height:`${b}px`,backgroundColor:je||B?T.hoverColor:T.color,opacity:je||B?T.hoverOpacity:T.opacity,borderRadius:`${T.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]})]})}),ct=_t;export{ct as OverlayScrollbar,ct as default};
46
+ `,document.head.appendChild(o),()=>{let i=document.getElementById(e);i&&i.remove()}},[]),_e("div",{ref:Te,className:`overlay-scrollbar-wrapper ${E}`,onMouseLeave:xt,style:{display:"flex",flexDirection:"column",position:"relative",minHeight:0,height:"100%",flex:"1 1 0%",overflow:"visible",...k},children:[st&&R("div",{className:"overlay-scrollbar-pull-indicator",style:{position:"absolute",top:0,left:"50%",transform:`translate(-50%, ${w-56}px)`,transition:re?"transform 0.15s ease-out":w===0?"transform 0.2s ease-out":"none",width:48,height:48,borderRadius:"50%",background:"#ffffff",boxShadow:"0 2px 8px rgba(0, 0, 0, 0.25)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1001,pointerEvents:"none",opacity:re?1:Math.min(ne*1.5,1)},children:re?R("svg",{width:"28",height:"28",viewBox:"0 0 24 24",style:{animation:"overlay-scrollbar-ptr-spin 0.8s linear infinite"},children:R("circle",{cx:"12",cy:"12",r:"9",fill:"none",stroke:Ue,strokeWidth:"2.5",strokeLinecap:"round",strokeDasharray:"42",strokeDashoffset:"14"})}):R("svg",{width:"28",height:"28",viewBox:"0 0 24 24",style:{transform:`rotate(${ne*270}deg)`,opacity:ne>=1?1:.6},children:R("path",{d:"M17.65 6.35A7.958 7.958 0 0 0 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08A5.99 5.99 0 0 1 12 18c-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z",fill:Ue})})}),R("div",{ref:l,className:"overlay-scrollbar-container",tabIndex:-1,onMouseDown:Ht,style:{display:"flex",width:"100%",flex:"1 1 auto",minHeight:0,overflow:"auto",scrollbarWidth:"none",msOverflowStyle:"none",outline:"none",userSelect:K?"none":"auto",...z},children:R("div",{ref:G,className:"overlay-scrollbar-content",style:{flex:"1 1 0%",minHeight:0,display:"flex",flexDirection:"column",boxSizing:"border-box",...y},children:_})}),A&&le&&(r.overflowY??!0)&&_e("div",{ref:j,className:"overlay-scrollbar-track",onMouseEnter:()=>{g(),Q.current=setTimeout(()=>{x(!0),Q.current=null},100)},onMouseLeave:()=>{Ce(),U||h(a.delay)},style:{position:"absolute",top:0,right:0,width:`${L}px`,height:"100%",opacity:we?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[r.visible&&R("div",{className:"overlay-scrollbar-track-background",onClick:e=>{e.preventDefault(),e.stopPropagation(),wt(e)},style:{position:"absolute",top:X?`${T.width+r.margin*2}px`:`${r.margin}px`,right:r.alignment==="outside"?"0px":`${(L-T.width)/2}px`,width:`${T.width}px`,height:X?`calc(100% - ${T.width*2+r.margin*4}px)`:`calc(100% - ${r.margin*2}px)`,backgroundColor:r.color,borderRadius:`${r.radius}px`,cursor:"pointer"}}),R("div",{ref:oe,className:"overlay-scrollbar-thumb",onMouseDown:Tt,onMouseEnter:()=>Ye(!0),onMouseLeave:()=>Ye(!1),style:{position:"absolute",top:`${(X?b+r.margin*2:r.margin)+dt}px`,right:r.alignment==="outside"?"0px":`${(L-b)/2}px`,width:`${b}px`,height:`${Math.max(fe,Oe)}px`,backgroundColor:Xe||U?T.hoverColor:T.color,opacity:Xe||U?T.hoverOpacity:T.opacity,borderRadius:`${T.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]}),A&&le&&X&&R("div",{className:"overlay-scrollbar-up-arrow",onClick:Mt,onMouseEnter:()=>Ee("up"),onMouseLeave:()=>Ee(null),style:{position:"absolute",top:`${r.margin}px`,right:r.alignment==="outside"?"0px":`${(L-b)/2}px`,width:`${b}px`,height:`${b}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(b*.75,8)}px`,color:Me==="up"?F.hoverColor:F.color,userSelect:"none",zIndex:1001,opacity:we?Me==="up"?F.hoverOpacity:F.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25B2"}),A&&le&&X&&R("div",{className:"overlay-scrollbar-down-arrow",onClick:Et,onMouseEnter:()=>Ee("down"),onMouseLeave:()=>Ee(null),style:{position:"absolute",bottom:`${r.margin}px`,right:r.alignment==="outside"?"0px":`${(L-b)/2}px`,width:`${b}px`,height:`${b}px`,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",fontSize:`${Math.max(b*.75,8)}px`,color:Me==="down"?F.hoverColor:F.color,userSelect:"none",zIndex:1001,opacity:we?Me==="down"?F.hoverOpacity:F.opacity:0,transition:"opacity 0.2s ease-in-out, color 0.15s ease-in-out"},children:"\u25BC"}),A&&q&&ft&&(r.overflowX??!0)&&_e("div",{className:"overlay-scrollbar-horizontal-track",onMouseEnter:()=>{g(),Q.current=setTimeout(()=>{x(!0),Q.current=null},100)},onMouseLeave:()=>{Ce(),B||h(a.delay)},style:{position:"absolute",bottom:`${bt}px`,left:0,width:"100%",height:`${L}px`,opacity:we?1:0,transition:"opacity 0.2s ease-in-out",cursor:"pointer",zIndex:1e3,pointerEvents:"auto"},children:[r.visible&&R("div",{className:"overlay-scrollbar-horizontal-track-background",onClick:e=>{e.preventDefault(),e.stopPropagation(),Ct(e)},style:{position:"absolute",bottom:r.alignment==="outside"?"0px":`${(L-b)/2}px`,left:`${r.margin}px`,right:le?r.alignment==="outside"?`${L-r.margin}px`:`${L}px`:`${r.margin}px`,height:`${b}px`,backgroundColor:r.color,borderRadius:`${r.radius}px`,cursor:"pointer"}}),R("div",{className:"overlay-scrollbar-horizontal-thumb",onMouseDown:St,onMouseEnter:()=>Ke(!0),onMouseLeave:()=>Ke(!1),style:{position:"absolute",bottom:r.alignment==="outside"?"0px":`${(L-b)/2}px`,left:`${r.margin+We}px`,right:le?r.alignment==="outside"?`${L-r.margin}px`:`${L}px`:"auto",maxWidth:le?r.alignment==="outside"?`calc(100% - ${r.margin+We+L-r.margin}px)`:`calc(100% - ${r.margin+We+L}px)`:"none",width:`${Math.max(Ie,50)}px`,height:`${b}px`,backgroundColor:je||B?T.hoverColor:T.color,opacity:je||B?T.hoverOpacity:T.opacity,borderRadius:`${T.radius}px`,cursor:"pointer",transition:"background-color 0.2s ease-in-out, opacity 0.2s ease-in-out"}})]})]})}),ct=_t;export{ct as OverlayScrollbar,ct as default};
47
47
  //# sourceMappingURL=index.esm.js.map