Scroll area

Exports

Import these components from @mbsw/ui.

ScrollArea

Props

The tables list common props for each component. See the full types for supported prop combinations and inherited HTML and Radix props.

ScrollArea

ScrollArea props
Prop	Type	Requirement
`children`	`ReactNode`	Optional
`variant`	`'vertical' \| 'horizontal' \| 'concurrently'`	Optional
`viewportProps`	`ScrollAreaViewportProps`	Optional

Type reference

Show full types

Full TypeScript definitions, including prop combinations and inherited props.

import { type ComponentPropsWithoutRef, type ReactNode } from 'react';

import { ScrollArea as ScrollAreaPrimitive } from 'radix-ui';

type DataAttributes = {
    [key: `data-${string}`]: boolean | number | string | undefined;
};

type ScrollAreaPrimitiveProps = ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>;

type ScrollAreaViewportPrimitiveProps = ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Viewport>;

export type ScrollAreaVariant = 'vertical' | 'horizontal' | 'concurrently';

export type ScrollAreaViewportProps = Omit<ScrollAreaViewportPrimitiveProps, 'asChild' | 'children' | 'color' | 'tabIndex'> & DataAttributes;

export type ScrollAreaProps = Omit<ScrollAreaPrimitiveProps, 'asChild' | 'children' | 'color' | 'scrollHideDelay' | 'type'> & DataAttributes & {
    children?: ReactNode;
    variant?: ScrollAreaVariant;
    viewportProps?: ScrollAreaViewportProps;
};

export declare const ScrollArea: import("react").ForwardRefExoticComponent<Omit<Omit<ScrollAreaPrimitive.ScrollAreaProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "color" | "children" | "type" | "asChild" | "scrollHideDelay"> & DataAttributes & {
    children?: ReactNode;
    variant?: ScrollAreaVariant;
    viewportProps?: ScrollAreaViewportProps;
} & import("react").RefAttributes<HTMLDivElement>>;