Return value from modal in template form

Ionic Framework
1

(Using Vue3 and TS)

Using the modal controller , I have a few places in my app where I return values from a modal to the parent app.I like how clean it is to use a modal in the template as shown below.

Is there any way to return a value from the modal when using the modal in the template form
to pass the value to a function that is ran by @didDismiss ???

<template>
  <ion-button @click="setOpen(true)">Show Modal</ion-button>
  <ion-modal :is-open="isOpenRef" css-class="my-custom-class" @didDismiss="setOpen(false)">
    <Modal :data="data"></Modal>
  </ion-modal>
</template>

<script>
  import { IonModal, IonButton } from '@ionic/vue';
  import { defineComponent, ref } from 'vue';
  import Modal from './modal.vue';

  export default defineComponent({
    components: { IonModal, IonButton, Modal },
    setup() {
      const isOpenRef = ref(false);
      const setOpen = (state: boolean) => (isOpenRef.value = state);
      const data = { content: 'New Content' };
      return { isOpenRef, setOpen, data };
    },
  });
</script>
2

There is examples on how this is done in the docs:

3

that is an oversimplified example IMHO, I like to create a separate component for my modal and leverage the events being emitted from the component to pass data