spb/worthdoing Public

1"use client"23import * as React from "react"4import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area"56import { cn } from "@/lib/utils"78function ScrollArea({9  className,10  children,11  ...props12}: ScrollAreaPrimitive.Root.Props) {13  return (14    <ScrollAreaPrimitive.Root15      data-slot="scroll-area"16      className={cn("relative", className)}17      {...props}18    >19      <ScrollAreaPrimitive.Viewport20        data-slot="scroll-area-viewport"21        className="size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1"22      >23        {children}24      </ScrollAreaPrimitive.Viewport>25      <ScrollBar />26      <ScrollAreaPrimitive.Corner />27    </ScrollAreaPrimitive.Root>28  )29}3031function ScrollBar({32  className,33  orientation = "vertical",34  ...props35}: ScrollAreaPrimitive.Scrollbar.Props) {36  return (37    <ScrollAreaPrimitive.Scrollbar38      data-slot="scroll-area-scrollbar"39      data-orientation={orientation}40      orientation={orientation}41      className={cn(42        "flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent",43        className44      )}45      {...props}46    >47      <ScrollAreaPrimitive.Thumb48        data-slot="scroll-area-thumb"49        className="relative flex-1 rounded-full bg-border"50      />51    </ScrollAreaPrimitive.Scrollbar>52  )53}5455export { ScrollArea, ScrollBar }56