import { View } from '@tarojs/components'
import { FC, ReactNode } from 'react'
import classnames from 'classnames'
import styles from './index.module.scss'

type FlexDirection = 'row' | 'col'

interface PropsType {
  flexDirection?: FlexDirection
  
  circle?: boolean
  children?: ReactNode
  customStyle?: React.CSSProperties

}

const LayoutBlock: FC<PropsType> = (props) => {
  const { flexDirection = 'col', circle = false, children } = props

  const getClassName = () => {
    const classObject = {
      [styles['layoutBlock--circle']]: circle,
      [styles[`layoutBlock--${flexDirection}`]]: flexDirection,
    }
    return classObject
  }

  return <View className={classnames(styles.layoutBlock, getClassName())}>
    
    {children}
    
  </View>
}
export default LayoutBlock
