"use client" import type * as React from "react" import { cn } from "@/lib/utils" /* Scroll-area primary ailesi: 5 dekoratif kaydirma alani. Thumb primary aksan tonunu tasar (solid, soft, ring, gradient, glow). Renkler YALNIZ token; alfa color-mix ile. size -> viewport yuksekligi. */ export type StyledSize = "sm" | "md" | "lg" | "xl" const height: Record = { sm: "h-40", md: "h-56", lg: "h-72", xl: "h-96", } const base = "w-full overflow-y-auto rounded-lg border border-border bg-surface-2 p-3" /* Varsayilan icerik: kaydirmayi tetikleyecek kadar uzun, token-stilli satirlar. */ function DefaultRows({ count = 16 }: { count?: number }) { return (

{Array.from({ length: count }).map((_, i) => (

Satir {i + 1} token

))}

) } type Props = { className?: string size?: StyledSize children?: React.ReactNode } /* Solid: dolu primary thumb. */ export function SolidPrimaryScrollArea({ className, size = "md", children }: Props) { return (

{children ?? }

) } /* Soft: yari saydam primary thumb. */ export function SoftPrimaryScrollArea({ className, size = "md", children }: Props) { return (

{children ?? }

) } /* Ring: primary cerceveli, ici seyreltilmis thumb (halka gorunumu). */ export function RingPrimaryScrollArea({ className, size = "md", children }: Props) { return (

{children ?? }

) } /* Gradient: a thumb with a vertical gradient from primary to a diluted primary. */ export function GradientPrimaryScrollArea({ className, size = "md", children }: Props) { return (

{children ?? }

) } /* Glow: primary thumb + primary tonlu isilti golgesi. */ export function GlowPrimaryScrollArea({ className, size = "md", children }: Props) { return (

{children ?? }

) }