<template>
  <n-button
    @click="toggle"
    quaternary
  >
    <Icon
      :name="
        isFullscreen
          ? 'MaterialSymbolsFullscreenExit'
          : 'MaterialSymbolsFullscreen'
      "
    />
  </n-button>
</template>

<script setup lang="ts">
  import { Icon } from "@/components/icon";
  import { useFullscreen } from "@vueuse/core";
  const { isFullscreen, toggle } = useFullscreen();
</script>
