From 9269d303853367ba2e4e8e6071e59c490e1e3b82 Mon Sep 17 00:00:00 2001
From: Hatem Hosny <hatemhosny@gmail.com>
Date: Mon, 7 Apr 2025 22:59:02 +0200
Subject: [PATCH] feat(Templates): edit Vue template to infer props from types

---
 src/livecodes/templates/starter/vue-sfc-starter.ts | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/livecodes/templates/starter/vue-sfc-starter.ts b/src/livecodes/templates/starter/vue-sfc-starter.ts
index e707b9aaa1..6361bce4ea 100644
--- a/src/livecodes/templates/starter/vue-sfc-starter.ts
+++ b/src/livecodes/templates/starter/vue-sfc-starter.ts
@@ -27,14 +27,15 @@ import Counter from './Component.vue';
 <script setup lang="tsx">
   import { ref } from 'vue';
 
-  const props = defineProps({
-    name: String
-  })
+  interface Props {
+    name?: string
+  }
+  const props = defineProps<Props>();
   const count = ref(0);
   const align = 'center';
 
   // define inline component
-  function Greeting(props: {name?: string}) {
+  function Greeting(props: Props) {
     return <h1>Hello, { props.name || 'World' }!</h1>
   }
 </script>