UNPKG

@snowball-tech/fractal

Version:

Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS

3 lines 1.69 kB
'use client'; import{a as o}from"./chunk-DT63SLXO.js";import{b as e}from"./chunk-CMFNILWJ.js";import{a as c,b as s}from"./chunk-KHPUS472.js";import*as l from"@radix-ui/react-scroll-area";import S from"lodash/fp/omit";import{jsx as a,jsxs as n}from"react/jsx-runtime";var f=({children:h,orientation:r="vertical",scrollHideDelay:x=600,type:u="hover",viewportClassName:p,...t})=>{let b="flex touch-none select-none bg-grey-90 p-quarter transition-background-color duration-300 ease-out hover:bg-grey-70",m="relative flex-1 rounded-sm bg-grey-30 before:absolute before:content-empty";return n(l.Root,{className:s(`${e}-${o}`,r==="vertical"||r==="both"?"h-full max-h-full min-h-0":"",r==="horizontal"||r==="both"?"w-full min-w-0 max-w-full":"",t.className),scrollHideDelay:x,type:u,...S(["className"],t),children:[a(l.Viewport,{className:s("relative h-full w-full",p),children:h}),(r==="both"||r==="vertical")&&a(l.Scrollbar,{className:c(`${e}-${o}__scrollbar--y`,b,"w-1"),orientation:"vertical",children:a(l.Thumb,{className:c(`${e}-${o}__scrollbar--y__thumb`,m,"!w-half before:top-1/2 before:h-full before:min-h-[44px] before:w-full before:min-w-[44px] before:-translate-x-1/2 before:-translate-y-1/2")})}),(r==="both"||r==="horizontal")&&a(l.Scrollbar,{className:c(`${e}-${o}__scrollbar--x`,b,"h-1 flex-col"),orientation:"horizontal",children:a(l.Thumb,{className:c(`${e}-${o}__scrollbar--x__thumb`,m,"!h-half before:top-1/2 before:h-full before:min-h-[44px] before:w-full before:min-w-[44px] before:-translate-x-1/2 before:-translate-y-1/2")})}),a(l.Corner,{className:"bg-grey-50"})]})};f.displayName="ScrollArea";var N=f;export{f as a,N as b}; //# sourceMappingURL=chunk-2TLZZPTU.js.map