Important: This documentation is about an older version. It's relevant only to the release noted, many of the features and functions have been updated or replaced. Please view the current version.

Documentationbreadcrumb arrow Grafana documentationbreadcrumb arrow API Referencebreadcrumb arrow @grafana/uibreadcrumb arrow CustomScrollbar
Enterprise Open source

CustomScrollbar class

Wraps component into component from react-custom-scrollbars

Signature

typescript 
export declare class CustomScrollbar extends Component<Props>

Import

typescript 
import { CustomScrollbar } from '@grafana/ui';

Constructors

ConstructorModifiersDescription
constructor(props)Constructs a new instance of the CustomScrollbar class

Properties

PropertyModifiersTypeDescription
defaultPropsstaticPartial<Props>
renderThumb(thumb: ’thumb-horizontal’ | ’thumb-vertical’, passedProps: any) => JSX.Element
renderThumbHorizontal(passedProps: any) => JSX.Element
renderThumbVertical(passedProps: any) => JSX.Element
renderTrack(track: ’track-vertical’ | ’track-horizontal’, hideTrack: boolean | undefined, passedProps: any) => JSX.Element
renderTrackHorizontal(passedProps: any) => JSX.Element
renderTrackVertical(passedProps: any) => JSX.Element
renderView(passedProps: any) => JSX.Element

Methods

MethodModifiersDescription
componentDidMount()
componentDidUpdate()
render()
updateAfterMount()
updateScroll()

constructor(props)

Constructs a new instance of the CustomScrollbar class

Signature

typescript 
constructor(props: Props);

Parameters

ParameterTypeDescription
propsProps

defaultProps property

Signature

typescript 
static defaultProps: Partial<Props>;

renderThumb property

Signature

typescript 
renderThumb: (thumb: 'thumb-horizontal' | 'thumb-vertical', passedProps: any) => JSX.Element;

renderThumbHorizontal property

Signature

typescript 
renderThumbHorizontal: (passedProps: any) => JSX.Element;

renderThumbVertical property

Signature

typescript 
renderThumbVertical: (passedProps: any) => JSX.Element;

renderTrack property

Signature

typescript 
renderTrack: (track: 'track-vertical' | 'track-horizontal', hideTrack: boolean | undefined, passedProps: any) => JSX.Element;

renderTrackHorizontal property

Signature

typescript 
renderTrackHorizontal: (passedProps: any) => JSX.Element;

renderTrackVertical property

Signature

typescript 
renderTrackVertical: (passedProps: any) => JSX.Element;

renderView property

Signature

typescript 
renderView: (passedProps: any) => JSX.Element;

componentDidMount method

Signature

typescript 
componentDidMount(): void;

Returns:

void

componentDidUpdate method

Signature

typescript 
componentDidUpdate(): void;

Returns:

void

render method

Signature

typescript 
render(): JSX.Element;

Returns:

JSX.Element

updateAfterMount method

Signature

typescript 
updateAfterMount(): void;

Returns:

void

updateScroll method

Signature

typescript 
updateScroll(): void;

Returns:

void