<template>
  <div v-if="html" class="ivyforms-description-message regular-14" :class="extraClass">
    <SafeHTML :html="html" field-type="field-description" />
  </div>
</template>

<script setup lang="ts">
import SafeHTML from '@/views/_components/SafeHTML.vue'

interface Props {
  html?: string
  extraClass?: string
}

withDefaults(defineProps<Props>(), {
  html: '',
  extraClass: '',
})
</script>

<style lang="scss" scoped>
.ivyforms-description-message {
  color: var(--map-base-text-0);
  display: block;
  width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
</style>
