import React from 'react'
import { StyleProp, View, ViewStyle } from 'react-native'
import { colorsV2 } from '../Colors'

/**
 * Vertical bar used for highlighting a specific point in a graph, e.g. the selected date
 */
export const VerticalIndicatorBar: React.FC<{
  style?: StyleProp<ViewStyle>
}> = ({ style }) => (
  <View
    style={[
      {
        right: 0,
        top: 0,
        bottom: 0,
        width: 2,
        backgroundColor: colorsV2.metals.metal2,
        flex: 1,
        alignSelf: 'center',
      },
      style,
    ]}
  />
)