import { inputColors } from '../input/consts'

const baseStyle = {
  textarea: {
    focusWithinRing: 3,
    color: inputColors.inputText,
  },
  input: {
    color: { placeholder: inputColors.placeholder },
  },
}

const defaultProps = {
  variant: 'grey',
}

const parts = ['container', 'textarea', 'label']

const sizes = {}

const variants = {
  grey: {
    textarea: {
      borderColor: inputColors.border,
      focusWithinRingColor: inputColors.focus,
    },
  },
  green: {
    textarea: {
      borderColor: inputColors.success,
      focusWithinRingColor: inputColors.success,
    },
  },
  red: {
    textarea: {
      borderColor: inputColors.error,
      focusWithinRingColor: inputColors.error,
    },
  },
}

export default {
  baseStyle,
  defaultProps,
  parts,
  sizes,
  variants,
}
