import React, {forwardRef} from 'react'
import {
  TextArea as InstUITextArea,
  type TextAreaProps as InstUITextAreaProps,
} from '@instructure/ui-text-area'
import {enhanceErrorMessages} from '../../util/enhanceErrorMessages'

export interface TextAreaProps extends InstUITextAreaProps {}

/**
 * This is a wrapper around the InstUI `TextArea` component.
 *
 * Differences include:
 * - If the `label` prop is a string, it will be enhanced with an asterisk if `isRequired` is `true`
 * - If the `messages` prop contains an error message, it will include an icon
 */
export const TextArea = forwardRef<InstUITextArea, TextAreaProps>(({messages, ...props}, ref) => {
  const messagesWithEnhancedErrors = enhanceErrorMessages(messages)

  return <InstUITextArea {...props} ref={ref} messages={messagesWithEnhancedErrors} />
})

TextArea.displayName = 'TextArea'