@bothub-chat/ui
Version:
Bothub UI Components
2 lines (1 loc) • 2.85 kB
JavaScript
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{forwardRef as r,useRef as o,useState as l,useCallback as s,useEffect as n,useImperativeHandle as i}from"react";import{ScrollbarContent as c,ScrollbarStyled as a,ScrollbarShadows as d}from"./styled.js";import{ScrollbarProvider as u}from"./context.js";export{ScrollbarContext,useScrollbar}from"./context.js";import"tslib";import"@react-spring/web";import"./shadow/styled.js";import"../../theme/index.js";export{ScrollbarStyle}from"./style/styled.js";const m=r((({className:r,scrollbarClassName:m,variant:h="primary",size:p=6,scrollShadows:w,scrollLocked:f,overflow:v="auto",disabled:b=!1,disableShadows:S=!1,children:T,onScroll:g,defaultStickyBottom:L=!1,withStickyBottom:x=!1,isHorizontalScrollbar:y=!1},z)=>{var j;const H=o(null),[E,M]=l(!1),[$,B]=l(!1),[N,k]=l(!1),[C,O]=l(!1),R=!!w,W=!!f,[D,Y]=l(L),[q,A]=l(0),F=null!==(j=null==w?void 0:w.size)&&void 0!==j?j:60,G=s((e=>{const{scrollTop:t,scrollHeight:r,clientHeight:o,scrollLeft:l,scrollWidth:s,clientWidth:n}=e,i=F>o,c=F>n,a=!i&&0!==t,d=!i&&Math.round(t)+1<r-o;k(a),O(d),M(!c&&0!==l),B(!c&&Math.round(l)+1<s-n);const u=q>e.scrollTop;if(A(e.scrollTop),x){const t=e.clientHeight-Math.ceil(e.scrollHeight-e.scrollTop);Math.abs(t)<20&&!u?Y(!0):u&&Y(!1)}b&&e.scrollTo(0,0),null==g||g({isTop:a,isBottom:d})}),[H.current,b,q,x,F,g]);n((()=>{if(!y)return;const e=e=>{H.current&&(e.preventDefault(),H.current.scrollLeft+=e.deltaY)},t=H.current;return t&&t.addEventListener("wheel",e),()=>{t&&t.removeEventListener("wheel",e)}}),[y,H.current]);const I=s((e=>{var t;const r=H.current;if(null!==r&&(W||void 0!==e)&&null!==r){const{side:o}=null!==(t=null!=e?e:f)&&void 0!==t?t:{side:"bottom"};if("bottom"===o)r.scrollTop=r.scrollHeight}}),[W,f]);i(z,(()=>({element:H.current,setScroll:I})),[H.current,I]),n((()=>{I()}),[T,I]),n((()=>{const e=H.current;if(null===e)return;G(e);let t=window.setTimeout((()=>{G(e)}),500),r=null;D&&(r=new MutationObserver((()=>{G(e),D&&!W&&(e.scrollTop=e.scrollHeight)})),r.observe(e,{childList:!0,subtree:!0}));const o=()=>{window.clearTimeout(t),G(e),t=window.setTimeout((()=>{G(e)}),500)};window.addEventListener("resize",o);let l=null;return H.current&&(l=new ResizeObserver((e=>{e.forEach((e=>{G(e.target)}))})),l.observe(H.current)),()=>{clearTimeout(t),null==r||r.disconnect(),window.removeEventListener("resize",o),null==l||l.disconnect()}}),[H.current,G,D]);const J=e(c,{$variant:h,$size:p,$disabled:b,$overflow:v,ref:H,className:r,onScroll:()=>{H.current&&G(H.current)},children:T});return R?e(u,{scrollbarSize:p,scrollShadows:w,setScroll:I,disabled:b,isLeft:E,isRight:$,isTop:N,isBottom:C,children:t(a,{$overflow:v,className:m,children:[J,!S&&t(d,{children:[w.left,w.right,w.top,w.bottom]})]})}):J}));export{m as Scrollbar,c as ScrollbarContent,u as ScrollbarProvider,d as ScrollbarShadows,a as ScrollbarStyled};