ivt/dist/chunks/scroll-area-B0imXKzn.mjs

Ivt Components Library

import{c as e}from"./utils-C-nkZ_Ir.mjs";import*as r from"react";import t from"react";import{P as o}from"./index-DiPp8h7C.mjs";import{P as n}from"./index-1xuBLrml.mjs";import{c as l}from"./index-Dr5ObK3L.mjs";import{u as i}from"./index-C-j8pU3U.mjs";import{u as a}from"./index-DSUHCtxx.mjs";import{u as s}from"./index-DBjm5RwN.mjs";import{u as c}from"./index-0-u0cdz8.mjs";import{c as d}from"./index-DVnblQ-a.mjs";import{jsx as u,jsxs as p,Fragment as f}from"react/jsx-runtime";var h="ScrollArea",[v,w]=l(h),[m,b]=v(h),g=r.forwardRef((e,t)=>{const{__scopeScrollArea:n,type:l="hover",dir:a,scrollHideDelay:c=600,...d}=e,[p,f]=r.useState(null),[h,v]=r.useState(null),[w,b]=r.useState(null),[g,S]=r.useState(null),[E,y]=r.useState(null),[T,C]=r.useState(0),[R,P]=r.useState(0),[x,_]=r.useState(!1),[L,D]=r.useState(!1),A=i(t,e=>f(e)),z=s(a);return u(m,{scope:n,type:l,dir:z,scrollHideDelay:c,scrollArea:p,viewport:h,onViewportChange:v,content:w,onContentChange:b,scrollbarX:g,onScrollbarXChange:S,scrollbarXEnabled:x,onScrollbarXEnabledChange:_,scrollbarY:E,onScrollbarYChange:y,scrollbarYEnabled:L,onScrollbarYEnabledChange:D,onCornerWidthChange:C,onCornerHeightChange:P,children:u(o.div,{dir:z,...d,ref:A,style:{position:"relative","--radix-scroll-area-corner-width":T+"px","--radix-scroll-area-corner-height":R+"px",...e.style}})})});g.displayName=h;var S="ScrollAreaViewport",E=r.forwardRef((e,t)=>{const{__scopeScrollArea:n,children:l,nonce:a,...s}=e,c=b(S,n),d=r.useRef(null),h=i(t,d,c.onViewportChange);return p(f,{children:[u("style",{dangerouslySetInnerHTML:{__html:"[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}"},nonce:a}),u(o.div,{"data-radix-scroll-area-viewport":"",...s,ref:h,style:{overflowX:c.scrollbarXEnabled?"scroll":"hidden",overflowY:c.scrollbarYEnabled?"scroll":"hidden",...e.style},children:u("div",{ref:c.onContentChange,style:{minWidth:"100%",display:"table"},children:l})})]})});E.displayName=S;var y="ScrollAreaScrollbar",T=r.forwardRef((e,t)=>{const{forceMount:o,...n}=e,l=b(y,e.__scopeScrollArea),{onScrollbarXEnabledChange:i,onScrollbarYEnabledChange:a}=l,s="horizontal"===e.orientation;return r.useEffect(()=>(s?i(!0):a(!0),()=>{s?i(!1):a(!1)}),[s,i,a]),"hover"===l.type?u(C,{...n,ref:t,forceMount:o}):"scroll"===l.type?u(R,{...n,ref:t,forceMount:o}):"auto"===l.type?u(P,{...n,ref:t,forceMount:o}):"always"===l.type?u(x,{...n,ref:t}):null});T.displayName=y;var C=r.forwardRef((e,t)=>{const{forceMount:o,...l}=e,i=b(y,e.__scopeScrollArea),[a,s]=r.useState(!1);return r.useEffect(()=>{const e=i.scrollArea;let r=0;if(e){const t=()=>{window.clearTimeout(r),s(!0)},o=()=>{r=window.setTimeout(()=>s(!1),i.scrollHideDelay)};return e.addEventListener("pointerenter",t),e.addEventListener("pointerleave",o),()=>{window.clearTimeout(r),e.removeEventListener("pointerenter",t),e.removeEventListener("pointerleave",o)}}},[i.scrollArea,i.scrollHideDelay]),u(n,{present:o||a,children:u(P,{"data-state":a?"visible":"hidden",...l,ref:t})})}),R=r.forwardRef((e,t)=>{const{forceMount:o,...l}=e,i=b(y,e.__scopeScrollArea),a="horizontal"===e.orientation,s=V(()=>p("SCROLL_END"),100),[c,p]=(f="hidden",h={hidden:{SCROLL:"scrolling"},scrolling:{SCROLL_END:"idle",POINTER_ENTER:"interacting"},interacting:{SCROLL:"interacting",POINTER_LEAVE:"idle"},idle:{HIDE:"hidden",SCROLL:"scrolling",POINTER_ENTER:"interacting"}},r.useReducer((e,r)=>h[e][r]??e,f));var f,h;return r.useEffect(()=>{if("idle"===c){const e=window.setTimeout(()=>p("HIDE"),i.scrollHideDelay);return()=>window.clearTimeout(e)}},[c,i.scrollHideDelay,p]),r.useEffect(()=>{const e=i.viewport,r=a?"scrollLeft":"scrollTop";if(e){let t=e[r];const o=()=>{const o=e[r];t!==o&&(p("SCROLL"),s()),t=o};return e.addEventListener("scroll",o),()=>e.removeEventListener("scroll",o)}},[i.viewport,a,p,s]),u(n,{present:o||"hidden"!==c,children:u(x,{"data-state":"hidden"===c?"hidden":"visible",...l,ref:t,onPointerEnter:d(e.onPointerEnter,()=>p("POINTER_ENTER")),onPointerLeave:d(e.onPointerLeave,()=>p("POINTER_LEAVE"))})})}),P=r.forwardRef((e,t)=>{const o=b(y,e.__scopeScrollArea),{forceMount:l,...i}=e,[a,s]=r.useState(!1),c="horizontal"===e.orientation,d=V(()=>{if(o.viewport){const e=o.viewport.offsetWidth<o.viewport.scrollWidth,r=o.viewport.offsetHeight<o.viewport.scrollHeight;s(c?e:r)}},10);return q(o.viewport,d),q(o.content,d),u(n,{present:l||a,children:u(x,{"data-state":a?"visible":"hidden",...i,ref:t})})}),x=r.forwardRef((e,t)=>{const{orientation:o="vertical",...n}=e,l=b(y,e.__scopeScrollArea),i=r.useRef(null),a=r.useRef(0),[s,c]=r.useState({content:0,viewport:0,scrollbar:{size:0,paddingStart:0,paddingEnd:0}}),d=O(s.viewport,s.content),p={...n,sizes:s,onSizesChange:c,hasThumb:Boolean(d>0&&d<1),onThumbChange:e=>i.current=e,onThumbPointerUp:()=>a.current=0,onThumbPointerDown:e=>a.current=e};function f(e,r){return function(e,r,t,o="ltr"){const n=U(t),l=n/2,i=r||l,a=n-i,s=t.scrollbar.paddingStart+i,c=t.scrollbar.size-t.scrollbar.paddingEnd-a,d=t.content-t.viewport,u="ltr"===o?[0,d]:[-1*d,0];return k([s,c],u)(e)}(e,a.current,s,r)}return"horizontal"===o?u(_,{...p,ref:t,onThumbPositionChange:()=>{if(l.viewport&&i.current){const e=j(l.viewport.scrollLeft,s,l.dir);i.current.style.transform=`translate3d(${e}px, 0, 0)`}},onWheelScroll:e=>{l.viewport&&(l.viewport.scrollLeft=e)},onDragScroll:e=>{l.viewport&&(l.viewport.scrollLeft=f(e,l.dir))}}):"vertical"===o?u(L,{...p,ref:t,onThumbPositionChange:()=>{if(l.viewport&&i.current){const e=j(l.viewport.scrollTop,s);i.current.style.transform=`translate3d(0, ${e}px, 0)`}},onWheelScroll:e=>{l.viewport&&(l.viewport.scrollTop=e)},onDragScroll:e=>{l.viewport&&(l.viewport.scrollTop=f(e))}}):null}),_=r.forwardRef((e,t)=>{const{sizes:o,onSizesChange:n,...l}=e,a=b(y,e.__scopeScrollArea),[s,c]=r.useState(),d=r.useRef(null),p=i(t,d,a.onScrollbarXChange);return r.useEffect(()=>{d.current&&c(getComputedStyle(d.current))},[d]),u(z,{"data-orientation":"horizontal",...l,ref:p,sizes:o,style:{bottom:0,left:"rtl"===a.dir?"var(--radix-scroll-area-corner-width)":0,right:"ltr"===a.dir?"var(--radix-scroll-area-corner-width)":0,"--radix-scroll-area-thumb-width":U(o)+"px",...e.style},onThumbPointerDown:r=>e.onThumbPointerDown(r.x),onDragScroll:r=>e.onDragScroll(r.x),onWheelScroll:(r,t)=>{if(a.viewport){const o=a.viewport.scrollLeft+r.deltaX;e.onWheelScroll(o),B(o,t)&&r.preventDefault()}},onResize:()=>{d.current&&a.viewport&&s&&n({content:a.viewport.scrollWidth,viewport:a.viewport.offsetWidth,scrollbar:{size:d.current.clientWidth,paddingStart:I(s.paddingLeft),paddingEnd:I(s.paddingRight)}})}})}),L=r.forwardRef((e,t)=>{const{sizes:o,onSizesChange:n,...l}=e,a=b(y,e.__scopeScrollArea),[s,c]=r.useState(),d=r.useRef(null),p=i(t,d,a.onScrollbarYChange);return r.useEffect(()=>{d.current&&c(getComputedStyle(d.current))},[d]),u(z,{"data-orientation":"vertical",...l,ref:p,sizes:o,style:{top:0,right:"ltr"===a.dir?0:void 0,left:"rtl"===a.dir?0:void 0,bottom:"var(--radix-scroll-area-corner-height)","--radix-scroll-area-thumb-height":U(o)+"px",...e.style},onThumbPointerDown:r=>e.onThumbPointerDown(r.y),onDragScroll:r=>e.onDragScroll(r.y),onWheelScroll:(r,t)=>{if(a.viewport){const o=a.viewport.scrollTop+r.deltaY;e.onWheelScroll(o),B(o,t)&&r.preventDefault()}},onResize:()=>{d.current&&a.viewport&&s&&n({content:a.viewport.scrollHeight,viewport:a.viewport.offsetHeight,scrollbar:{size:d.current.clientHeight,paddingStart:I(s.paddingTop),paddingEnd:I(s.paddingBottom)}})}})}),[D,A]=v(y),z=r.forwardRef((e,t)=>{const{__scopeScrollArea:n,sizes:l,hasThumb:s,onThumbChange:c,onThumbPointerUp:p,onThumbPointerDown:f,onThumbPositionChange:h,onDragScroll:v,onWheelScroll:w,onResize:m,...g}=e,S=b(y,n),[E,T]=r.useState(null),C=i(t,e=>T(e)),R=r.useRef(null),P=r.useRef(""),x=S.viewport,_=l.content-l.viewport,L=a(w),A=a(h),z=V(m,10);function N(e){if(R.current){const r=e.clientX-R.current.left,t=e.clientY-R.current.top;v({x:r,y:t})}}return r.useEffect(()=>{const e=e=>{const r=e.target,t=E?.contains(r);t&&L(e,_)};return document.addEventListener("wheel",e,{passive:!1}),()=>document.removeEventListener("wheel",e,{passive:!1})},[x,E,_,L]),r.useEffect(A,[l,A]),q(E,z),q(S.content,z),u(D,{scope:n,scrollbar:E,hasThumb:s,onThumbChange:a(c),onThumbPointerUp:a(p),onThumbPositionChange:A,onThumbPointerDown:a(f),children:u(o.div,{...g,ref:C,style:{position:"absolute",...g.style},onPointerDown:d(e.onPointerDown,e=>{if(0===e.button){e.target.setPointerCapture(e.pointerId),R.current=E.getBoundingClientRect(),P.current=document.body.style.webkitUserSelect,document.body.style.webkitUserSelect="none",S.viewport&&(S.viewport.style.scrollBehavior="auto"),N(e)}}),onPointerMove:d(e.onPointerMove,N),onPointerUp:d(e.onPointerUp,e=>{const r=e.target;r.hasPointerCapture(e.pointerId)&&r.releasePointerCapture(e.pointerId),document.body.style.webkitUserSelect=P.current,S.viewport&&(S.viewport.style.scrollBehavior=""),R.current=null})})})}),N="ScrollAreaThumb",H=r.forwardRef((e,r)=>{const{forceMount:t,...o}=e,l=A(N,e.__scopeScrollArea);return u(n,{present:t||l.hasThumb,children:u(W,{ref:r,...o})})}),W=r.forwardRef((e,t)=>{const{__scopeScrollArea:n,style:l,...a}=e,s=b(N,n),c=A(N,n),{onThumbPositionChange:p}=c,f=i(t,e=>c.onThumbChange(e)),h=r.useRef(void 0),v=V(()=>{h.current&&(h.current(),h.current=void 0)},100);return r.useEffect(()=>{const e=s.viewport;if(e){const r=()=>{if(v(),!h.current){const r=F(e,p);h.current=r,p()}};return p(),e.addEventListener("scroll",r),()=>e.removeEventListener("scroll",r)}},[s.viewport,v,p]),u(o.div,{"data-state":c.hasThumb?"visible":"hidden",...a,ref:f,style:{width:"var(--radix-scroll-area-thumb-width)",height:"var(--radix-scroll-area-thumb-height)",...l},onPointerDownCapture:d(e.onPointerDownCapture,e=>{const r=e.target.getBoundingClientRect(),t=e.clientX-r.left,o=e.clientY-r.top;c.onThumbPointerDown({x:t,y:o})}),onPointerUp:d(e.onPointerUp,c.onThumbPointerUp)})});H.displayName=N;var M="ScrollAreaCorner",X=r.forwardRef((e,r)=>{const t=b(M,e.__scopeScrollArea),o=Boolean(t.scrollbarX&&t.scrollbarY);return"scroll"!==t.type&&o?u(Y,{...e,ref:r}):null});X.displayName=M;var Y=r.forwardRef((e,t)=>{const{__scopeScrollArea:n,...l}=e,i=b(M,n),[a,s]=r.useState(0),[c,d]=r.useState(0),p=Boolean(a&&c);return q(i.scrollbarX,()=>{const e=i.scrollbarX?.offsetHeight||0;i.onCornerHeightChange(e),d(e)}),q(i.scrollbarY,()=>{const e=i.scrollbarY?.offsetWidth||0;i.onCornerWidthChange(e),s(e)}),p?u(o.div,{...l,ref:t,style:{width:a,height:c,position:"absolute",right:"ltr"===i.dir?0:void 0,left:"rtl"===i.dir?0:void 0,bottom:0,...e.style}}):null});function I(e){return e?parseInt(e,10):0}function O(e,r){const t=e/r;return isNaN(t)?0:t}function U(e){const r=O(e.viewport,e.content),t=e.scrollbar.paddingStart+e.scrollbar.paddingEnd,o=(e.scrollbar.size-t)*r;return Math.max(o,18)}function j(e,r,t="ltr"){const o=U(r),n=r.scrollbar.paddingStart+r.scrollbar.paddingEnd,l=r.scrollbar.size-n,i=r.content-r.viewport,a=l-o,s=function(e,[r,t]){return Math.min(t,Math.max(r,e))}(e,"ltr"===t?[0,i]:[-1*i,0]);return k([0,i],[0,a])(s)}function k(e,r){return t=>{if(e[0]===e[1]||r[0]===r[1])return r[0];const o=(r[1]-r[0])/(e[1]-e[0]);return r[0]+o*(t-e[0])}}function B(e,r){return e>0&&e<r}var F=(e,r=()=>{})=>{let t={left:e.scrollLeft,top:e.scrollTop},o=0;return function n(){const l={left:e.scrollLeft,top:e.scrollTop},i=t.left!==l.left,a=t.top!==l.top;(i||a)&&r(),t=l,o=window.requestAnimationFrame(n)}(),()=>window.cancelAnimationFrame(o)};function V(e,t){const o=a(e),n=r.useRef(0);return r.useEffect(()=>()=>window.clearTimeout(n.current),[]),r.useCallback(()=>{window.clearTimeout(n.current),n.current=window.setTimeout(o,t)},[o,t])}function q(e,r){const t=a(r);c(()=>{let r=0;if(e){const o=new ResizeObserver(()=>{cancelAnimationFrame(r),r=window.requestAnimationFrame(t)});return o.observe(e),()=>{window.cancelAnimationFrame(r),o.unobserve(e)}}},[e,t])}var $=g,G=E,J=X;function K({className:r,children:o,...n}){return t.createElement($,{"data-slot":"scroll-area",className:e("relative",r),...n},t.createElement(G,{"data-slot":"scroll-area-viewport",className:"ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1"},o),t.createElement(Q,null),t.createElement(J,null))}function Q({className:r,orientation:o="vertical",...n}){return t.createElement(T,{"data-slot":"scroll-area-scrollbar",orientation:o,className:e("flex touch-none p-px transition-colors select-none","vertical"===o&&"h-full w-2.5 border-l border-l-transparent","horizontal"===o&&"h-2.5 flex-col border-t border-t-transparent",r),...n},t.createElement(H,{"data-slot":"scroll-area-thumb",className:"bg-border relative flex-1 rounded-full"}))}export{K as S,Q as a};
//# sourceMappingURL=scroll-area-B0imXKzn.mjs.map