import React, { CSSProperties } from 'react'
import cln from 'classnames'

import { concat } from '../utils'
import { usePrefix } from '../ConfigProvider'

export interface DividerProps {
  /**
   * 纵向
   *
   * @default false
   */
  vertical?: boolean
  /**
   * 是否虚线
   *
   * @default false
   */
  dashed?: boolean
  className?: string
  style?: CSSProperties
}

export default function Divider(props: DividerProps) {
  const { vertical = false, dashed = false, className: classNameFromProps, style } = props
  const prefix = usePrefix('divider')
  const verticalPrefix = concat(prefix, 'vertical')
  const dashPrefix = concat(prefix, 'dashed')
  const className = cln(prefix, vertical && verticalPrefix, dashed && dashPrefix, classNameFromProps)

  return <div className={className} style={style} />
}