import React from 'react'
import { Flex, Box } from '@chakra-ui/core'

export default function Bar (props) {
  return (
    <Flex
      borderBottom='barSeperator'
      {...props}
    />
  )
}

export function Element (props) {
  return (
    <Box
      px={2}
      py={1}
      borderRight='barSeperator'
      fontFamily='mono'
      color='textBar'
      {...props}
    />
  )
}

Bar.Element = Element