<script setup lang="ts">
const props = defineProps({
  errMessage: { type: String, default: '' },
  defaultClass: { type: String, default: 'grow shrink-0 overflow-hidden' },
  class: { type: String, default: '' },
})
</script>

<template>
  <div :class="`field ${props.defaultClass} ${props.class}`">
    <slot />
    <div v-if="props.errMessage" class="mt-1 md:!text-xs 2xl:!text-sm font-medium text-red-500">{{ props.errMessage }}</div>
  </div>
</template>
