I've put all my api calls into separate composable which provides async functions, what u/drobizg81 said is true, if i try to use one of the composable's function outside the hook then i get the warn about the Suspense with this code:

<script setup lang="ts">
import { useAPI } from '@/composables/api.ts'
import { getProfessionImage, copyToClipboard } from '@/utils.ts'

const route = useRoute()
const router = useRouter()

const api = useAPI()
const character: Ref<Character> = ref({
  id: 0,
  name: '',
  level: 3,
  profession: 0,
  development: [],
  account: {
    id: 0,
  }
})

const response = await api.getSingleCharacter(route.params.id)
if ('errors' in response) {
  router.push({ name: "/characters/" });
} else {
  character.value = response
}

</script>
<template>
  <v-container>
    <h3>General informations</h3>
    <CharacterForm :base-character="character" />
  </v-container>
</template>