import { CSSProperties } from 'react'
import { tokens } from '../../systems/tokens'

export function Divider({ vertical=false, style }: { vertical?: boolean; style?: CSSProperties }) {
  return (
    <hr style={{
      border  : 'none',
      height  : vertical ? '1px' : 'auto',
      width   : vertical ? '1px' : '100%',
      flex    : vertical ? 'none' : 1,
      background: 'linear-gradient(90deg, transparent, rgba(37,99,235,.2), transparent)',
      margin  : 0,
      ...style,
    }} />
  )
}