<script setup>
import {ref} from "vue";
import MediaLibrary from "./MediaLibrary.vue";
import Modal from "../../components/Modal.vue";

const props = defineProps({
  show: {
    type: Boolean,
    default: true,
  },
  singleFile: {
    type: Boolean,
    default: true,
  },
  active: {
    type: Array,
    default: () => []
  },
});

const filesSelected = (files) => {
  emit('filesSelected', files);
  emit('close')
};

const emit = defineEmits(['close', 'filesSelected'])
</script>

<template>
  <Modal :show="show" @close="$emit('close')" max-width="5xl" :fixedHeight="true">
    <div class="p-6">
      <MediaLibrary
          :selectable="true"
          :singleFile="singleFile"
          :active="active"
          @close="$emit('close')"
          @filesSelected="filesSelected"
      />
    </div>
  </Modal>
</template>
