<template>
  <Teleport to="body">
    <div ref="root" class="fullscreen-gallery">
      {{ videoConsumers.length + shareConsumers.length }}
    </div>
  </Teleport>
</template>

<script setup lang="ts">
import { useFullscreen } from '@vueuse/core'

const rootRef = useTemplateRef('root')

const { enter } = useFullscreen(rootRef)
const { videoConsumers, shareConsumers } = useMediasoup()

onMounted(() => {
  // enter()
})
</script>
