import React , { forwardRef } from 'react' ; import { ScrollView as rScrollView } from 'react-native' ; import { SxProp } from '../css/types' ; import { createThemedComponent } from '../css/create-themed-component' ; import { useSx } from '../use-sx' ; const DripsyScrollView = createThemedComponent ( rScrollView ) ; export type DripsyScrollViewProps = React . ComponentPropsWithoutRef < typeof DripsyScrollView > & { contentContainerSx ? : SxProp ; indicatorSx ? : SxProp ; } ; export const ScrollView = forwardRef < rScrollView , DripsyScrollViewProps > ( function ScrollView ( props , ref ) { const sx = useSx ( ) ; const containerSx = props . contentContainerSx && sx ( props . contentContainerSx ) ; const indicatorSx = props . indicatorSx && sx ( props . indicatorSx ) ; return ( < DripsyScrollView { ... props } contentContainerStyle = { props . contentContainerStyle && containerSx ? [ props . contentContainerStyle , containerSx ] : containerSx || props . contentContainerStyle } indicatorStyle = { props . indicatorStyle && indicatorSx ? [ props . indicatorStyle , indicatorSx ] : indicatorSx || props . indicatorStyle } ref = { ref } / > ) ; } ) ;