import { cn } from "./index3.js";
import { jsx, jsxs } from "react/jsx-runtime";
import { ScrollArea } from "@base-ui/react/scroll-area";
//#region src/components/ui/scroll-area.tsx
function ScrollArea$1({ className, children, ...props }) {
	return /* @__PURE__ */ jsxs(ScrollArea.Root, {
		"data-slot": "scroll-area",
		className: cn("group/scroll relative overflow-hidden", className),
		...props,
		children: [
			/* @__PURE__ */ jsx(ScrollArea.Viewport, {
				"data-slot": "scroll-area-viewport",
				className: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] motion-reduce:transition-none outline-none focus-visible:ring-[3px] focus-visible:outline-1",
				children
			}),
			/* @__PURE__ */ jsx(ScrollBar, {}),
			/* @__PURE__ */ jsx(ScrollArea.Corner, {})
		]
	});
}
function ScrollBar({ className, orientation = "vertical", ...props }) {
	return /* @__PURE__ */ jsx(ScrollArea.Scrollbar, {
		"data-slot": "scroll-area-scrollbar",
		"data-orientation": orientation,
		orientation,
		className: cn("data-[orientation=horizontal]:h-4 data-[orientation=horizontal]:flex-col data-[orientation=vertical]:h-full data-[orientation=vertical]:w-4 flex touch-none p-1 transition-opacity motion-reduce:transition-none select-none opacity-0 hover:opacity-100 group-hover/scroll:opacity-100", className),
		...props,
		children: /* @__PURE__ */ jsx(ScrollArea.Thumb, {
			"data-slot": "scroll-area-thumb",
			className: "rounded-full bg-border hover:bg-muted-foreground relative flex-1 transition-colors motion-reduce:transition-none"
		})
	});
}
ScrollArea$1.displayName = "ScrollArea";
ScrollBar.displayName = "ScrollBar";
//#endregion
export { ScrollArea$1 as ScrollArea, ScrollBar };

//# sourceMappingURL=index45.js.map