import React, { type ReactElement } from 'react'
import { type IDescriptionProps } from '@/Types/InputTypes'
import { makeClassName } from '@/utils'

export default function Description ({
  description,
  defaultClassName = 'block text-xs mb-2 mt-2',
  className,
  disabled = false
}: IDescriptionProps): ReactElement {
  return (
        <>{description !== undefined
          ? <span className={makeClassName({
            defaultClassName,
            className,
            extras: [
              disabled ? 'text-slate-400 cursor-not-allowed' : undefined
            ]
          })}>{description}</span>
          : ''}</>
  )
}
