UNPKG

react-native-ui-lib

Version:

[![SWUbanner](https://raw.githubusercontent.com/vshymanskyy/StandWithUkraine/main/banner-direct.svg)](https://stand-with-ukraine.pp.ua)

89 lines (88 loc) 2.98 kB
import React, { Component } from 'react'; import { Animated, FlatListProps, ImageSourcePropType, NativeSyntheticEvent, NativeScrollEvent, LayoutChangeEvent } from 'react-native'; import { ForwardRefInjectedProps } from '../../commons/new'; import { ComponentStatics } from '../../typings/common'; export interface ScrollBarProps extends FlatListProps<any> { /** * Whether to use a FlatList. NOTE: you must pass 'data' and 'renderItem' props as well */ useList?: boolean; /** * The element to use as a container, instead of a View */ containerView?: React.ComponentClass; /** * The props to pass the container */ containerProps?: object; /** * The component's height */ height?: number; /** * The gradient's height, defaults to the component's height */ gradientHeight?: number; /** * The gradient's width */ gradientWidth?: number; /** * The gradient's margins for the edge */ gradientMargins?: number; /** * The gradient's tint color */ gradientColor?: string; /** * The gradient's image, instead of the default image. * NOTE: pass an image for the right-hand side and it will be flipped to match the left-hand side */ gradientImage?: ImageSourcePropType; /** * The index to currently focus on */ focusIndex?: number; } type Props = ScrollBarProps & ForwardRefInjectedProps; type State = { gradientOpacity: Animated.Value; gradientOpacityLeft: Animated.Value; }; /** * @description: Scrollable container with animated gradient overlay for horizontal scroll * @extends: ScrollView / FlatList */ declare class ScrollBar extends Component<Props, State> { static displayName: string; static defaultProps: { gradientWidth: number; gradientMargins: number; gradientColor: string; focusIndex: number; }; static Item: typeof Item; constructor(props: Props); private scrollbar; private itemsLayouts; private contentOffset; private scrollContentWidth; private containerWidth; componentDidUpdate(prevProps: Props): void; focusIndex: (index?: number) => void; animateGradientOpacity: (offsetX: number, contentWidth: number, containerWidth: number) => void; onScroll: (event: NativeSyntheticEvent<NativeScrollEvent>) => void; onContentSizeChange: (contentWidth: number, contentHeight: number) => void; onLayout: (event: LayoutChangeEvent) => void; onItemLayout: ({ layout, index }: any) => void; renderScrollable(): React.JSX.Element; renderGradient(left: boolean): React.JSX.Element; render(): React.JSX.Element; } declare const Item: { ({ children, index, onLayout }: any): React.JSX.Element; displayName: string; }; declare const _default: React.ForwardRefExoticComponent<ScrollBarProps & React.RefAttributes<any>> & ComponentStatics<typeof ScrollBar>; export default _default;