Как уничтожить sweet modal?

Question

[evomed]

Есть библиотека модального окна https://sweet-modal-vue.adepto.as/
Работает хорошо. Но есть проблема.
Если щелкать на крестик или за окном модалки, то модалка не уничтожается, а скрывается. Контент в модалках начинает глючить на объектах в цикле - переключатели при множественном открытии перестают нажиматься. Крестик этой модалки (кнопка закрывания) находится внутри библиотеки и мной не контролируется. Т.е. я не могу повесить на него запуск экшена, который бы уничтожил модалку. И клик вне окна модалки, ее закрывающий, тоже внутри библиотеки естественно.
У этого компонента есть ref="modal"
в самом компоненте в data есть boolean свойства
is_open и visible
они связаны с этими кнопками закрытия и с нажатиев вне окна. Они и скрывают модалку.
можно ли как-то по реф отследить, что свойства эти изменились и вызвать уже мой метод, который уничтожит модалку по событию внутри этого компонента? Или другим способом.
vue и js знаю на поверхностном уровне, которого достаточно для большинства моих задач. Если что-то сложное то без примера, на одном объяснении не вывезу. Заранее благодарен добрым людям.

<template>
  <div>
    <sweet-modal ref="modal">
      <slot v-if="is_open_modal" name="form"></slot>
    </sweet-modal>

    <slot name="info"></slot>

    <element @click.prevent="openModal">
      <slot name="open-button"></slot>
    </element>
  </div>
</template>

<script>
import { SweetModal, SweetModalTab } from "sweet-modal-vue";

export default {
  components: {
    SweetModal,
    SweetModalTab,
  },

  data() {
    return {
      is_open_modal: false,
    };
  },

  props: {
    data: Object,
  },

  methods: {
    openModal() {
      this.is_open_modal = true;
      this.$refs.modal.open();
      
    },

    closeModal() {
      this.is_open_modal = false;
      this.$refs.modal.close();
    },
  },
};
</script>

Answer 1

[evomed]

В компоненте обнаружился емит close
@close="closeModal()"