feat(i18n): update internationalization for app using nuxt i18n version 10

Author: sfxcode

playground/app/app.vue

@@ -1,11 +1,11 @@
 <script setup lang='ts'>
-import FormkitComponent from '~/components/FormkitComponent.vue'
+const { t } = useI18n()
 </script>
 
 <template>
   <div style="padding: 1rem">
     <div class="">
-      <h2>Formkit-PrimeVue</h2>
+      <h2>{{ t('app_name') }}</h2>
       <div>
         <h4>GitHub</h4>
         <a href="https://github.com/sfxcode/formkit-primevue">formkit-primevue</a>

playground/app/components/FormkitComponent.vue

@@ -19,11 +19,11 @@ onMounted(() => {
 
 const schema = reactive(
   [
-    addElement('h5', ['Validation with FormKit - Inputs from PrimeVue']),
+    addElement('h3', ['Validation with FormKit - Inputs from PrimeVue']),
     {
       $formkit: 'primeOutputDate',
       name: 'date',
-      label: 'Date',
+      label: 'Formatted Date',
     },
     {
       $formkit: 'primeInputText',
@@ -128,7 +128,7 @@ async function submitHandler() {
 
 <template>
   <div>
-    <h2>FormKit PrimeVue Nuxt Playground</h2>
+    <h2>{{ t('app_description') }}</h2>
     <div v-if="data">
       <FormKitDataEdit
         v-model="data"

playground/vue-i18n.options.ts renamed to playground/i18n/i18n.config.ts

@@ -1,4 +1,6 @@
 {
+  "app_name": "FormKit Playground",
+  "app_description": "FormKit PrimeVue Nuxt Module Playground",
   "welcome": "Willkommen",
   "sample": "Hallo Welt",
   "save": "Speichern",

playground/i18n/locales/de.json

@@ -1,4 +1,6 @@
 {
+  "app_name": "FormKit Playground",
+  "app_description": "FormKit PrimeVue Nuxt Module Playground",
   "welcome": "Welcome",
   "sample": "Hello World",
   "save": "Save",

playground/i18n/locales/en.json

@@ -19,7 +19,7 @@ export default defineNuxtModule<ModuleOptions>({
     name: 'formkit-primevue-nuxt',
     configKey: 'formkitPrimevue',
     compatibility: {
-      nuxt: '>=3.16.0',
+      nuxt: '^3.0.0',
     },
   },
   // Default configuration options of the Nuxt module