import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"; import type { ComponentPropsWithoutRef } from "react"; /** * ScrollArea — custom scroller with Violet Forge styling. * * Built on Radix ScrollArea so the native scrollbar is always hidden and the * custom thumb stays consistent across Chrome/Firefox/Safari/macOS-trackpad. * * Visual: * - track is transparent, only the thumb is visible. * - thumb is `--primary` at 25% opacity by default; on hover, 45% with violet glow. * - active drag bumps to 60%. * - the rounded full pill thumb plays well with the brutalist border language * but stays subtle (1.5px wide on rest, 3px on hover). * * Modes (via `type`): * - "hover" (default) — scrollbar fades in on hover/focus, otherwise hidden. * - "always" — scrollbar always visible. * - "auto" — scrollbar visible only when content overflows. * - "scroll" — Radix-managed: visible only while scrolling. */ interface ScrollAreaProps extends ComponentPropsWithoutRef { /** * Optional override for which scrollbar(s) to render. * Defaults: vertical only. Set to "both" for grids/tables with overflow-x. */ orientation?: "vertical" | "horizontal" | "both"; /** * Thickness of the scrollbar. Default "thin" (2.5px → 3.5px on hover). * Use "regular" (8px) for content where the scrollbar should be a more prominent target. */ size?: "thin" | "regular"; } interface ScrollBarProps extends ComponentPropsWithoutRef { size?: "thin" | "regular"; } declare const ScrollArea: import("react").ForwardRefExoticComponent> & { Bar: import("react").ForwardRefExoticComponent>; }; export { ScrollArea };