feat(PrimeOutputText): isTranslationKey prop added and i18n handling

Author: sfxcode

dev/locales/de.json

@@ -1,5 +1,6 @@
 {
   "welcome": "Willkommen",
+  "sample": "Hallo Welt",
   "save": "Speichern",
   "search": "Suchen",
   "formkit": {

dev/locales/en.json

@@ -1,5 +1,6 @@
 {
   "welcome": "Welcome",
+  "sample": "Hello World",
   "save": "Save",
   "search": "Search",
   "formkit": {

dev/pages/data/Edit.vue

@@ -22,10 +22,8 @@ const schema = reactive(
       label: 'Email',
       help: 'This will be used for your account.',
       validation: 'required|email',
-      prefix: 'test',
-      iconPrefix: 'pi pi-trash text-color-red',
-      suffix: 'ich suffix net',
-      iconSuffix: 'pi pi-trash text-color-blue',
+      iconPrefix: 'pi pi-book',
+      iconSuffix: 'pi pi-bullseye',
     },
     {
       $formkit: 'primeTextarea',
@@ -108,7 +106,8 @@ async function submitHandler() {
       :schema="schema"
       :submit-label="t('save')"
       :form-class="horizontal ? 'form-horizontal' : ''"
-      :debug-mode="true"
+      :debug-data="true"
+      :debug-schema="true"
       @data-saved="submitHandler"
     />
   </PrimeData>

dev/pages/outputs/OutputText.vue

@@ -9,6 +9,12 @@ const schema
       name: 'name',
       label: 'Basic',
     },
+    {
+      $formkit: 'primeOutputText',
+      name: 'toTranslate',
+      isTranslationKey: true,
+      label: 'Translated',
+    },
     {
       $formkit: 'primeOutputText',
       name: 'html',
@@ -39,7 +45,7 @@ const schema
 
   ]
 
-const data = { name: 'Harry Potter', iconLeft: 'Some Text ...', iconRight: 'Another Text ...', html: '<b style="color: gold">Bold Hello World</b>' }
+const data = { name: 'Harry Potter', toTranslate: 'sample', iconLeft: 'Some Text ...', iconRight: 'Another Text ...', html: '<b style="color: gold">Bold Hello World</b>' }
 </script>
 
 <template>