fix(vue template): support script setup template (#648)

sandpack-client/.bundler

@@ -1,3 +1,3 @@
 // Manually generated file to trigger new releases based on the bundler changes. 
 // The following value is the commit hash from codesandbox-client
-560d0f63c40a5adec235138c1e4509f42c980aeb
+ebf846d29f45cae489d4c6525c41fd96e90cbbdc

sandpack-react/src/templates/vue3.ts

@@ -4,31 +4,31 @@
 export const VUE_TEMPLATE_3 = {
   files: {
     "/src/App.vue": {
-      code: `<template>
-  <main id="app">
-    <h1>{{ helloWorld }}</h1>
-  </main>
-</template>
-                             
-<script>
+      code: `<script setup>
 import { ref } from "vue";
-export default {
-   name: "App",
-   setup() {
-      const helloWorld = ref("Hello World");
-      return { helloWorld };
-   }
-};
+
+const msg = ref("world");
 </script>
+
+<template>
+  <h1>Hello {{ msg }}</h1>
+</template>
                              
 <style>
-#app {
-font-family: Avenir, Helvetica, Arial, sans-serif;
--webkit-font-smoothing: antialiased;
--moz-osx-font-smoothing: grayscale;
-text-align: center;
-color: #2c3e50;
-margin-top: 60px;
+body {
+  font-family: sans-serif;
+  -webkit-font-smoothing: auto;
+  -moz-font-smoothing: auto;
+  -moz-osx-font-smoothing: grayscale;
+  font-smoothing: auto;
+  text-rendering: optimizeLegibility;
+  font-smooth: always;
+  -webkit-tap-highlight-color: transparent;
+  -webkit-touch-callout: none;
+}
+
+h1 {
+  font-size: 1.5rem;
 }
 </style>   
 `,