From 4c4b3aa3c898a80566715946239565f18b1351b8 Mon Sep 17 00:00:00 2001
From: Danilo Woznica <danilowoz@gmail.com>
Date: Wed, 30 Nov 2022 09:48:03 +0000
Subject: [PATCH 1/2] Update Templates.stories.tsx and vue3.ts

---
 .../src/templates/Templates.stories.tsx       |  5 ++-
 sandpack-react/src/templates/vue3.ts          | 42 +++++++++----------
 2 files changed, 25 insertions(+), 22 deletions(-)

diff --git a/sandpack-react/src/templates/Templates.stories.tsx b/sandpack-react/src/templates/Templates.stories.tsx
index d2487a6b1..74b3fca34 100644
--- a/sandpack-react/src/templates/Templates.stories.tsx
+++ b/sandpack-react/src/templates/Templates.stories.tsx
@@ -10,6 +10,9 @@ const stories = storiesOf("presets/Template", module);
 
 Object.keys(SANDBOX_TEMPLATES).forEach((template) =>
   stories.add(template, () => (
-    <Sandpack template={template as SandpackPredefinedTemplate} />
+    <Sandpack
+      options={{ bundlerURL: "http://localhost:3000/" }}
+      template={template as SandpackPredefinedTemplate}
+    />
   ))
 );
diff --git a/sandpack-react/src/templates/vue3.ts b/sandpack-react/src/templates/vue3.ts
index d3806d905..26bf46cbf 100644
--- a/sandpack-react/src/templates/vue3.ts
+++ b/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>   
 `,

From 2641325de736bd4ecf7f79890134344ecea21d59 Mon Sep 17 00:00:00 2001
From: Danilo Woznica <danilowoz@gmail.com>
Date: Wed, 30 Nov 2022 09:48:37 +0000
Subject: [PATCH 2/2] Update .bundler and Templates.stories.tsx

---
 sandpack-client/.bundler                           | 2 +-
 sandpack-react/src/templates/Templates.stories.tsx | 5 +----
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/sandpack-client/.bundler b/sandpack-client/.bundler
index df7620896..f61a70d55 100644
--- a/sandpack-client/.bundler
+++ b/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
diff --git a/sandpack-react/src/templates/Templates.stories.tsx b/sandpack-react/src/templates/Templates.stories.tsx
index 74b3fca34..d2487a6b1 100644
--- a/sandpack-react/src/templates/Templates.stories.tsx
+++ b/sandpack-react/src/templates/Templates.stories.tsx
@@ -10,9 +10,6 @@ const stories = storiesOf("presets/Template", module);
 
 Object.keys(SANDBOX_TEMPLATES).forEach((template) =>
   stories.add(template, () => (
-    <Sandpack
-      options={{ bundlerURL: "http://localhost:3000/" }}
-      template={template as SandpackPredefinedTemplate}
-    />
+    <Sandpack template={template as SandpackPredefinedTemplate} />
   ))
 );