@radix-ui/themes/dist/esm/components/scroll-area.js

[](https://radix-ui.com/themes)

"use client";import*as r from"react";import s from"classnames";import*as e from"@radix-ui/react-scroll-area";import{scrollAreaPropDefs as o}from"./scroll-area.props.js";import{extractMarginProps as g,getMarginStyles as w,getResponsiveClassNames as m,mergeStyles as C,getSubtree as z}from"../helpers/index.js";const c=r.forwardRef((n,S)=>{const{rest:u,...P}=g(n),[d,A]=w(P),{asChild:a,children:f,className:v,style:y,type:t,scrollHideDelay:N=t!=="scroll"?0:void 0,dir:V,size:i=o.size.default,radius:p=o.radius.default,scrollbars:l=o.scrollbars.default,...b}=u;return r.createElement(e.Root,{type:t,scrollHideDelay:N,className:s("rt-ScrollAreaRoot",d,v),style:C(A,y),asChild:a},z({asChild:a,children:f},h=>r.createElement(r.Fragment,null,r.createElement(e.Viewport,{...b,ref:S,className:"rt-ScrollAreaViewport"},h),r.createElement("div",{className:"rt-ScrollAreaViewportFocusRing"}),l!=="vertical"?r.createElement(e.Scrollbar,{"data-radius":p,orientation:"horizontal",className:s("rt-ScrollAreaScrollbar",m({className:"rt-r-size",value:i,propValues:o.size.values}))},r.createElement(e.Thumb,{className:"rt-ScrollAreaThumb"})):null,l!=="horizontal"?r.createElement(e.Scrollbar,{"data-radius":p,orientation:"vertical",className:s("rt-ScrollAreaScrollbar",m({className:"rt-r-size",value:i,propValues:o.size.values}))},r.createElement(e.Thumb,{className:"rt-ScrollAreaThumb"})):null,l==="both"?r.createElement(e.Corner,{className:"rt-ScrollAreaCorner"}):null)))});c.displayName="ScrollArea";export{c as ScrollArea};
//# sourceMappingURL=scroll-area.js.map