<script setup lang="ts">
import ItFullScreenModal from "@/components/ui/ItFullScreenModal.vue";
import type { Circle } from "@/services/circle";

defineProps<{
  circle: Circle | undefined;
  show: boolean;
}>();

const emit = defineEmits(["closemodal"]);
</script>

<template>
  <ItFullScreenModal :show="show" @closemodal="emit('closemodal')">
    <div v-if="circle" class="container-medium">
      <h2 data-cy="lc-title">Überblick: Circle «{{ circle.title }}»</h2>

      <!-- eslint-disable vue/no-v-html -->
      <div
        v-if="circle.goals"
        class="default-wagtail-rich-text my-4"
        v-html="circle.goals"
      ></div>
    </div>
  </ItFullScreenModal>
</template>

<style scoped></style>
