<script setup lang="ts">
import { ConfigProvider } from 'reka-ui'

import Loading from '@/components/loading.vue'
import { Toaster } from '@/components/ui/sonner'
import { useSystemTheme } from '@/composables/use-system-theme'

useSystemTheme()
</script>

<template>
  <ConfigProvider :scroll-body="{ padding: false, margin: false }">
    <Toaster />

    <Suspense>
      <router-view v-slot="{ Component, route }">
        <component :is="Component" :key="route" />
      </router-view>

      <template #fallback>
        <Loading />
      </template>
    </Suspense>
  </ConfigProvider>
</template>
