https://scripod.com/assets/horizonal-scroll-CJ_ds0qs.js

1import{a as e,t}from"./jsx-runtime-D_MnEzuy.js";import{t as n}from"./react-DBEjWt7A.js";import{n as r}from"./index.esm-yZ3WVT7t.js";import{i}from"./dist-DT2jQ2P_.js";var a=e(n(),1),o=t(),s=({children:e,className:t,scrollerClassName:n,ref:s,scrollStep:c,scrollPaddingLeft:l=0,scrollPaddingRight:u=0,controlClassName:d})=>{let f=(0,a.useRef)(null),p=s||f,[m,h]=(0,a.useState)(!1),[g,_]=(0,a.useState)(!1),v=(0,a.useCallback)(()=>{let e=p.current;if(!e)return;let{scrollLeft:t,scrollWidth:n,clientWidth:r}=e;h(t>l),_(t<n-r-u-1)},[p]),y=(0,a.useCallback)(()=>{let e=p.current;if(!e)return;let t=c??e.clientWidth*.8,n=e.scrollLeft,r=Math.max(0,n-t);e.scrollTo({left:r,behavior:`smooth`})},[c,p]),b=(0,a.useCallback)(()=>{let e=p.current;if(!e)return;let t=c??e.clientWidth*.8,n=e.scrollLeft,r=e.scrollWidth-e.clientWidth,i=Math.min(r,n+t);e.scrollTo({left:i,behavior:`smooth`})},[c,p]);return(0,a.useEffect)(()=>{let e=p.current;if(!e)return;v(),e.addEventListener(`scroll`,v);let t=()=>{v()};return window.addEventListener(`resize`,t),()=>{e.removeEventListener(`scroll`,v),window.removeEventListener(`resize`,t)}},[v,p]),(0,a.useEffect)(()=>{v()},[e,v]),(0,o.jsxs)(`div`,{className:i(`relative`,t),children:[(0,o.jsx)(`div`,{className:i(`overflow-x-auto scrollbar-hide`,n),ref:p,children:e}),(0,o.jsxs)(`div`,{className:i(`absolute inset-0 pointer-events-none`,d),children:[(0,o.jsx)(`div`,{className:i(`absolute left-0 inset-y-0 my-auto pointer-events-auto`,`rounded-full w-8 h-13 flex items-center justify-center backdrop-blur-xl backdrop-saturate-200 cursor-pointer transition shadow-lg`,m?`bg-foreground

1/25 text-foreground/70 hover:text-foreground hover-active:bg-foreground/30`:`opacity-0 pointer-events-none`),onClick:m?y:void 0,children:(0,o.jsx)(r.arrow,{className:`size-3 rotate-180`})}),(0,o.jsx)(`div`,{className:i(`absolute right-0 inset-y-0 my-auto pointer-events-auto`,`rounded-full w-8 h-13 flex items-center justify-center backdrop-blur-xl backdrop-saturate-200 cursor-pointer transition shadow-lg`,g?`bg-foreground/25 text-foreground/70 hover:text-foreground hover-active:bg-foreground/30`:`opacity-0 pointer-events-none`),onClick:g?b:void 0,children:(0,o.jsx)(r.arrow,{className:`size-3`})})]})]})};export{s as t};