From c1f02927c4be07ae469553931eada6f42ec22c25 Mon Sep 17 00:00:00 2001
From: Jordan Pittman <jordan@cryptica.me>
Date: Thu, 18 Aug 2022 12:01:56 -0400
Subject: [PATCH 1/4] Add dynamic routes to Vue playground

---
 .../playground-vue/src/components/Home.vue    |  45 +++--
 packages/playground-vue/src/router.js         |  79 ++++++--
 packages/playground-vue/src/routes.json       | 188 ------------------
 packages/playground-vue/vite.config.js        |  27 ---
 4 files changed, 89 insertions(+), 250 deletions(-)
 delete mode 100644 packages/playground-vue/src/routes.json

diff --git a/packages/playground-vue/src/components/Home.vue b/packages/playground-vue/src/components/Home.vue
index 3d2f30493e..dbc76ec98f 100644
--- a/packages/playground-vue/src/components/Home.vue
+++ b/packages/playground-vue/src/components/Home.vue
@@ -2,44 +2,45 @@
   <div class="container mx-auto my-24">
     <div class="prose">
       <h2>Examples</h2>
-      <Examples :examples="examples" />
+      <Examples :examples="examples">
+        <slot></slot>
+      </Examples>
     </div>
   </div>
 </template>
 
 <script>
 import { defineComponent, h } from 'vue'
-import { RouterLink } from 'vue-router'
-import routes from '../routes.json'
+import { RouterLink, useRouter } from 'vue-router'
 
 let Examples = defineComponent({
   props: ['examples'],
-  setup(props) {
-    return () => {
-      return h(
-        'ul',
-        props.examples
-          .filter((example) => example.path !== '/')
-          .map((example) =>
-            h(
-              'li',
-              { key: example.path },
-              example.children
-                ? h('h3', { class: 'text-xl' }, example.name)
-                : [h(RouterLink, { to: example.path }, () => example.name)],
-              example.children && h(Examples, { examples: example.children })
-            )
-          )
+  setup: (props) => () =>
+    h(
+      'ul',
+      props.examples.map((example) =>
+        h(
+          'li',
+          { key: example.path },
+          example.children.length > 0
+            ? h('h3', { class: 'text-xl' }, example.meta.name)
+            : [h(RouterLink, { to: example.path }, () => example.meta.name)],
+          example.children.length > 0 && h(Examples, { examples: example.children })
+        )
       )
-    }
-  },
+    ),
 })
 
 export default {
   components: { Examples },
   setup() {
+    let router = useRouter()
+
     return {
-      examples: routes,
+      examples: router
+        .getRoutes()
+        .filter((example) => example.path !== '/')
+        .filter((route) => route.meta.isRoot),
     }
   },
 }
diff --git a/packages/playground-vue/src/router.js b/packages/playground-vue/src/router.js
index c32c50c7f5..e7d58fe6c6 100644
--- a/packages/playground-vue/src/router.js
+++ b/packages/playground-vue/src/router.js
@@ -1,23 +1,76 @@
 import { createWebHistory, createRouter, RouterView } from 'vue-router'
-import lookup from './.generated/preload.js'
-import routes from './routes.json'
-
-function buildRoutes(routes) {
-  return routes.map((route) => {
-    let definition = {
-      path: route.path,
-      component: route.component ? lookup[route.component] : RouterView,
-    }
 
-    if (route.children) {
-      definition.children = buildRoutes(route.children)
+function buildRoutes() {
+  function titleCase(str) {
+    return str
+      .toLocaleLowerCase()
+      .split('-')
+      .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+      .join(' ')
+  }
+
+  // 1. Get all the components in the src/components directory
+  let files = Object.entries(import.meta.globEager('./components/**/*.vue'))
+
+  // 2.a. Swap the file names for route urls
+  // 2.b. Resolve the default import for each component
+  files = files.map(([file, component]) => [
+    file
+      .replace('./components/', '/')
+      .replace(/\.vue$/, '')
+      .toLocaleLowerCase()
+      .replace(/^\/home$/g, '/'),
+    component.default,
+  ])
+
+  let alreadyAdded = new Set()
+
+  // 3. Add a route for each directory (if not already added)
+  files = files.flatMap((entry) => {
+    let dirs = entry[0].split('/').slice(1, -1)
+
+    let paths = []
+
+    for (const [idx] of dirs.entries()) {
+      let path = `/` + dirs.slice(0, idx + 1).join('/')
+      if (alreadyAdded.has(path)) {
+        continue
+      }
+
+      paths.push([path, RouterView])
+      alreadyAdded.add(path)
     }
 
-    return definition
+    return [...paths, entry]
   })
+
+  // 4. Sort the routes alphabetically and by length
+  files.sort((a, b) => a[0].localeCompare(b[0]))
+
+  // 5. Create the nested routes
+  let routes = []
+  let routesByPath = {}
+
+  for (let [path, component] of files) {
+    let prefix = path.split('/').slice(0, -1).join('/')
+    let parent = routesByPath[prefix]?.children ?? routes
+    let route = {
+      path,
+      component: component,
+      children: [],
+      meta: {
+        name: titleCase(path.match(/[^/]+$/)?.[0] ?? 'Home'),
+        isRoot: parent === routes,
+      },
+    }
+
+    parent.push((routesByPath[path] = route))
+  }
+
+  return routes
 }
 
 export default createRouter({
   history: createWebHistory(),
-  routes: buildRoutes(routes),
+  routes: buildRoutes(),
 })
diff --git a/packages/playground-vue/src/routes.json b/packages/playground-vue/src/routes.json
deleted file mode 100644
index e3d88e6466..0000000000
--- a/packages/playground-vue/src/routes.json
+++ /dev/null
@@ -1,188 +0,0 @@
-[
-  {
-    "path": "/",
-    "component": "./components/Home.vue"
-  },
-  {
-    "name": "Combinations",
-    "path": "/combinations",
-    "children": [
-      {
-        "name": "Tabs in Dialog",
-        "path": "/combinations/tabs-in-dialog",
-        "component": "./components/combinations/tabs-in-dialog.vue"
-      }
-    ]
-  },
-  {
-    "name": "Combobox",
-    "path": "/combobox",
-    "children": [
-      {
-        "name": "Combobox (w/ pure tailwind)",
-        "path": "/combobox/combobox-with-pure-tailwind",
-        "component": "./components/combobox/combobox-with-pure-tailwind.vue"
-      },
-      {
-        "name": "Command Palette",
-        "path": "/combobox/command-palette",
-        "component": "./components/combobox/command-palette.vue"
-      },
-      {
-        "name": "Command Palette (w/ Groups)",
-        "path": "/combobox/command-palette-with-groups",
-        "component": "./components/combobox/command-palette-with-groups.vue"
-      },
-      {
-        "name": "Combobox multi select",
-        "path": "/combobox/multi-select",
-        "component": "./components/combobox/multi-select.vue"
-      }
-    ]
-  },
-  {
-    "name": "Menu",
-    "path": "/menu",
-    "children": [
-      {
-        "name": "Menu (basic)",
-        "path": "/menu/menu",
-        "component": "./components/menu/menu.vue"
-      },
-      {
-        "name": "Menu with Popper",
-        "path": "/menu/menu-with-popper",
-        "component": "./components/menu/menu-with-popper.vue"
-      },
-      {
-        "name": "Menu with Transition",
-        "path": "/menu/menu-with-transition",
-        "component": "./components/menu/menu-with-transition.vue"
-      },
-      {
-        "name": "Menu with Popper + Transition",
-        "path": "/menu/menu-with-transition-and-popper",
-        "component": "./components/menu/menu-with-transition-and-popper.vue"
-      },
-      {
-        "name": "Menu multiple elements",
-        "path": "/menu/multiple-elements",
-        "component": "./components/menu/multiple-elements.vue"
-      }
-    ]
-  },
-  {
-    "name": "Listbox",
-    "path": "/listbox",
-    "children": [
-      {
-        "name": "Listbox (basic)",
-        "path": "/listbox/listbox",
-        "component": "./components/listbox/listbox.vue"
-      },
-      {
-        "name": "Listbox multiple elements",
-        "path": "/listbox/multiple-elements",
-        "component": "./components/listbox/multiple-elements.vue"
-      },
-      {
-        "name": "Listbox multi select",
-        "path": "/listbox/multi-select",
-        "component": "./components/listbox/multi-select.vue"
-      }
-    ]
-  },
-  {
-    "name": "Switch",
-    "path": "/switch",
-    "children": [
-      {
-        "name": "Switch (basic)",
-        "path": "/switch/switch",
-        "component": "./components/switch/switch.vue"
-      }
-    ]
-  },
-  {
-    "name": "Tabs",
-    "path": "/tabs",
-    "children": [
-      {
-        "name": "Tabs (basic)",
-        "path": "/tabs/tabs",
-        "component": "./components/tabs/tabs.vue"
-      }
-    ]
-  },
-  {
-    "name": "Focus Trap",
-    "path": "/focus-trap",
-    "children": [
-      {
-        "name": "FocusTrap (basic)",
-        "path": "/focus-trap/focus-trap",
-        "component": "./components/focus-trap/focus-trap.vue"
-      }
-    ]
-  },
-  {
-    "name": "Portal",
-    "path": "/portal",
-    "children": [
-      {
-        "name": "Portal (group)",
-        "path": "/portal/portal",
-        "component": "./components/portal/portal.vue"
-      }
-    ]
-  },
-  {
-    "name": "Popover",
-    "path": "/popover",
-    "children": [
-      {
-        "name": "Popover",
-        "path": "/popover/popover",
-        "component": "./components/popover/popover.vue"
-      }
-    ]
-  },
-  {
-    "name": "Disclosure",
-    "path": "/disclosure",
-    "children": [
-      {
-        "name": "Disclosure",
-        "path": "/disclosure/disclosure",
-        "component": "./components/disclosure/disclosure.vue"
-      }
-    ]
-  },
-  {
-    "name": "Dialog",
-    "path": "/dialog",
-    "children": [
-      {
-        "name": "Dialog",
-        "path": "/dialog/dialog",
-        "component": "./components/dialog/dialog.vue"
-      },
-      {
-        "name": "Dialog Slide Over",
-        "path": "/dialog/slide-over",
-        "component": "./components/dialog/slide-over.vue"
-      }
-    ]
-  },
-  {
-    "name": "RadioGroup",
-    "path": "/radio-group",
-    "children": [
-      {
-        "name": "RadioGroup",
-        "path": "/radio-group/radio-group",
-        "component": "./components/radio-group/radio-group.vue"
-      }
-    ]
-  }
-]
diff --git a/packages/playground-vue/vite.config.js b/packages/playground-vue/vite.config.js
index 16068d10a1..6c112dd22b 100644
--- a/packages/playground-vue/vite.config.js
+++ b/packages/playground-vue/vite.config.js
@@ -1,32 +1,5 @@
-import fs from 'fs'
-import path from 'path'
-
 import vue from '@vitejs/plugin-vue'
 
-import routes from './src/routes.json'
-
-function flatten(routes, resolver) {
-  return routes
-    .map((route) => (route.children ? flatten(route.children, resolver) : resolver(route)))
-    .flat(Infinity)
-}
-
-let map = {}
-let contents = flatten(routes, (route) => route.component)
-  .map((path, i) => {
-    let name = `Component$${i + 1}`
-    map[path] = name
-    return `import ${name} from ".${path}";`
-  })
-  .join('\n')
-
-let location = path.resolve(__dirname, './src/.generated/preload.js')
-let data = `${contents}\n\nexport default {\n${Object.entries(map)
-  .map(([path, name]) => `  "${path}": ${name}`)
-  .join(',\n')}\n}`
-
-fs.writeFileSync(location, data, 'utf8')
-
 export default {
   plugins: [vue()],
 }

From 22e9e6fc2cd750eb05f615235e787dbeb33f2a62 Mon Sep 17 00:00:00 2001
From: Jordan Pittman <jordan@cryptica.me>
Date: Thu, 18 Aug 2022 12:20:32 -0400
Subject: [PATCH 2/4] Simplify

---
 .../playground-vue/src/components/Home.vue    | 73 +++++++++----------
 1 file changed, 34 insertions(+), 39 deletions(-)

diff --git a/packages/playground-vue/src/components/Home.vue b/packages/playground-vue/src/components/Home.vue
index dbc76ec98f..4a96ced39e 100644
--- a/packages/playground-vue/src/components/Home.vue
+++ b/packages/playground-vue/src/components/Home.vue
@@ -1,47 +1,42 @@
+<script setup>
+import { defineComponent } from 'vue'
+import { useRouter } from 'vue-router'
+
+let Examples = defineComponent({
+  props: ['routes'],
+  setup:
+    (props, { slots }) =>
+    () =>
+      slots.default({ routes: props.routes, slots }),
+})
+
+let router = useRouter()
+let routes = router
+  .getRoutes()
+  .filter((example) => example.path !== '/')
+  .filter((route) => route.meta.isRoot)
+</script>
+
 <template>
   <div class="container mx-auto my-24">
     <div class="prose">
       <h2>Examples</h2>
-      <Examples :examples="examples">
-        <slot></slot>
+      <Examples :routes="routes" v-slot="{ routes, slots }">
+        <ul>
+          <li v-for="{ children, meta, path } in routes">
+            <template v-if="children.length > 0">
+              <h3 class="text-xl">{{ meta.name }}</h3>
+              <!-- This is a bit cursed but it works -->
+              <component v-for="vnode in slots.default({ routes: children, slots })" :is="vnode" />
+            </template>
+            <template v-else>
+              <router-link :key="path" :to="path">
+                {{ meta.name }}
+              </router-link>
+            </template>
+          </li>
+        </ul>
       </Examples>
     </div>
   </div>
 </template>
-
-<script>
-import { defineComponent, h } from 'vue'
-import { RouterLink, useRouter } from 'vue-router'
-
-let Examples = defineComponent({
-  props: ['examples'],
-  setup: (props) => () =>
-    h(
-      'ul',
-      props.examples.map((example) =>
-        h(
-          'li',
-          { key: example.path },
-          example.children.length > 0
-            ? h('h3', { class: 'text-xl' }, example.meta.name)
-            : [h(RouterLink, { to: example.path }, () => example.meta.name)],
-          example.children.length > 0 && h(Examples, { examples: example.children })
-        )
-      )
-    ),
-})
-
-export default {
-  components: { Examples },
-  setup() {
-    let router = useRouter()
-
-    return {
-      examples: router
-        .getRoutes()
-        .filter((example) => example.path !== '/')
-        .filter((route) => route.meta.isRoot),
-    }
-  },
-}
-</script>

From c09d5b3d0d8c8fe4ae078fd4d3300275f8f1eab8 Mon Sep 17 00:00:00 2001
From: Jordan Pittman <jordan@cryptica.me>
Date: Thu, 18 Aug 2022 16:11:37 -0400
Subject: [PATCH 3/4] Upgrade to Vite 3.0

---
 packages/playground-vue/package.json   |   4 +-
 packages/playground-vue/src/router.js  |   9 +-
 packages/playground-vue/vite.config.js |   6 +-
 yarn.lock                              | 193 ++++++++++++++++++++++---
 4 files changed, 188 insertions(+), 24 deletions(-)

diff --git a/packages/playground-vue/package.json b/packages/playground-vue/package.json
index 4ef3d42e74..ea214030c3 100644
--- a/packages/playground-vue/package.json
+++ b/packages/playground-vue/package.json
@@ -28,7 +28,7 @@
     "vue-router": "^4.0.0"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "^2.0.1",
-    "vite": "^2.7.13"
+    "@vitejs/plugin-vue": "^3.0.3",
+    "vite": "^3.0.0"
   }
 }
diff --git a/packages/playground-vue/src/router.js b/packages/playground-vue/src/router.js
index e7d58fe6c6..c0a49aaa4a 100644
--- a/packages/playground-vue/src/router.js
+++ b/packages/playground-vue/src/router.js
@@ -10,7 +10,12 @@ function buildRoutes() {
   }
 
   // 1. Get all the components in the src/components directory
-  let files = Object.entries(import.meta.globEager('./components/**/*.vue'))
+  let files = Object.entries(
+    import.meta.glob('./components/**/*.vue', {
+      eager: true,
+      import: 'default',
+    })
+  )
 
   // 2.a. Swap the file names for route urls
   // 2.b. Resolve the default import for each component
@@ -20,7 +25,7 @@ function buildRoutes() {
       .replace(/\.vue$/, '')
       .toLocaleLowerCase()
       .replace(/^\/home$/g, '/'),
-    component.default,
+    component,
   ])
 
   let alreadyAdded = new Set()
diff --git a/packages/playground-vue/vite.config.js b/packages/playground-vue/vite.config.js
index 6c112dd22b..3da591e434 100644
--- a/packages/playground-vue/vite.config.js
+++ b/packages/playground-vue/vite.config.js
@@ -1,5 +1,7 @@
+import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 
-export default {
+export default defineConfig({
+  server: { port: 3000 },
   plugins: [vue()],
-}
+})
diff --git a/yarn.lock b/yarn.lock
index ca882f36e7..48cfd69249 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -326,6 +326,11 @@
   resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
   integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
 
+"@esbuild/linux-loong64@0.14.54":
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.14.54.tgz#de2a4be678bd4d0d1ffbb86e6de779cde5999028"
+  integrity sha512-bZBrLAIX1kpWelV0XemxBZllyRmM6vgFQQG2GdNb+r3Fkp0FOh1NJSvekXDs7jq70k4euu1cryLMfU+mTXlEpw==
+
 "@heroicons/react@^1.0.6":
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/@heroicons/react/-/react-1.0.6.tgz#35dd26987228b39ef2316db3b1245c42eb19e324"
@@ -973,10 +978,10 @@
   dependencies:
     "@types/yargs-parser" "*"
 
-"@vitejs/plugin-vue@^2.0.1":
-  version "2.2.4"
-  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-2.2.4.tgz#ab8b199ca82496b05d2654c5f34ffcf9b947243d"
-  integrity sha512-ev9AOlp0ljCaDkFZF3JwC/pD2N4Hh+r5srl5JHM6BKg5+99jiiK0rE/XaRs3pVm1wzyKkjUy/StBSoXX5fFzcw==
+"@vitejs/plugin-vue@^3.0.3":
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-3.0.3.tgz#7e3e401ccb30b4380d2279d9849281413f1791ef"
+  integrity sha512-U4zNBlz9mg+TA+i+5QPc3N5lQvdUXENZLO2h0Wdzp56gI1MWhqJOv+6R+d4kOzoaSSq6TnGPBdZAXKOe4lXy6g==
 
 "@vue/compiler-core@3.2.31":
   version "3.2.31"
@@ -2021,107 +2026,207 @@ esbuild-android-64@0.14.27:
   resolved "https://registry.yarnpkg.com/esbuild-android-64/-/esbuild-android-64-0.14.27.tgz#b868bbd9955a92309c69df628d8dd1945478b45c"
   integrity sha512-LuEd4uPuj/16Y8j6kqy3Z2E9vNY9logfq8Tq+oTE2PZVuNs3M1kj5Qd4O95ee66yDGb3isaOCV7sOLDwtMfGaQ==
 
+esbuild-android-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-android-64/-/esbuild-android-64-0.14.54.tgz#505f41832884313bbaffb27704b8bcaa2d8616be"
+  integrity sha512-Tz2++Aqqz0rJ7kYBfz+iqyE3QMycD4vk7LBRyWaAVFgFtQ/O8EJOnVmTOiDWYZ/uYzB4kvP+bqejYdVKzE5lAQ==
+
 esbuild-android-arm64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-android-arm64/-/esbuild-android-arm64-0.14.27.tgz#e7d6430555e8e9c505fd87266bbc709f25f1825c"
   integrity sha512-E8Ktwwa6vX8q7QeJmg8yepBYXaee50OdQS3BFtEHKrzbV45H4foMOeEE7uqdjGQZFBap5VAqo7pvjlyA92wznQ==
 
+esbuild-android-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-android-arm64/-/esbuild-android-arm64-0.14.54.tgz#8ce69d7caba49646e009968fe5754a21a9871771"
+  integrity sha512-F9E+/QDi9sSkLaClO8SOV6etqPd+5DgJje1F9lOWoNncDdOBL2YF59IhsWATSt0TLZbYCf3pNlTHvVV5VfHdvg==
+
 esbuild-darwin-64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-darwin-64/-/esbuild-darwin-64-0.14.27.tgz#4dc7484127564e89b4445c0a560a3cb50b3d68e1"
   integrity sha512-czw/kXl/1ZdenPWfw9jDc5iuIYxqUxgQ/Q+hRd4/3udyGGVI31r29LCViN2bAJgGvQkqyLGVcG03PJPEXQ5i2g==
 
+esbuild-darwin-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-darwin-64/-/esbuild-darwin-64-0.14.54.tgz#24ba67b9a8cb890a3c08d9018f887cc221cdda25"
+  integrity sha512-jtdKWV3nBviOd5v4hOpkVmpxsBy90CGzebpbO9beiqUYVMBtSc0AL9zGftFuBon7PNDcdvNCEuQqw2x0wP9yug==
+
 esbuild-darwin-arm64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.27.tgz#469e59c665f84a8ed323166624c5e7b9b2d22ac1"
   integrity sha512-BEsv2U2U4o672oV8+xpXNxN9bgqRCtddQC6WBh4YhXKDcSZcdNh7+6nS+DM2vu7qWIWNA4JbRG24LUUYXysimQ==
 
+esbuild-darwin-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.54.tgz#3f7cdb78888ee05e488d250a2bdaab1fa671bf73"
+  integrity sha512-OPafJHD2oUPyvJMrsCvDGkRrVCar5aVyHfWGQzY1dWnzErjrDuSETxwA2HSsyg2jORLY8yBfzc1MIpUkXlctmw==
+
 esbuild-freebsd-64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.27.tgz#895df03bf5f87094a56c9a5815bf92e591903d70"
   integrity sha512-7FeiFPGBo+ga+kOkDxtPmdPZdayrSzsV9pmfHxcyLKxu+3oTcajeZlOO1y9HW+t5aFZPiv7czOHM4KNd0tNwCA==
 
+esbuild-freebsd-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.54.tgz#09250f997a56ed4650f3e1979c905ffc40bbe94d"
+  integrity sha512-OKwd4gmwHqOTp4mOGZKe/XUlbDJ4Q9TjX0hMPIDBUWWu/kwhBAudJdBoxnjNf9ocIB6GN6CPowYpR/hRCbSYAg==
+
 esbuild-freebsd-arm64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.27.tgz#0b72a41a6b8655e9a8c5608f2ec1afdcf6958441"
   integrity sha512-8CK3++foRZJluOWXpllG5zwAVlxtv36NpHfsbWS7TYlD8S+QruXltKlXToc/5ZNzBK++l6rvRKELu/puCLc7jA==
 
+esbuild-freebsd-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.54.tgz#bafb46ed04fc5f97cbdb016d86947a79579f8e48"
+  integrity sha512-sFwueGr7OvIFiQT6WeG0jRLjkjdqWWSrfbVwZp8iMP+8UHEHRBvlaxL6IuKNDwAozNUmbb8nIMXa7oAOARGs1Q==
+
 esbuild-linux-32@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-32/-/esbuild-linux-32-0.14.27.tgz#43b8ba3803b0bbe7f051869c6a8bf6de1e95de28"
   integrity sha512-qhNYIcT+EsYSBClZ5QhLzFzV5iVsP1YsITqblSaztr3+ZJUI+GoK8aXHyzKd7/CKKuK93cxEMJPpfi1dfsOfdw==
 
+esbuild-linux-32@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-32/-/esbuild-linux-32-0.14.54.tgz#e2a8c4a8efdc355405325033fcebeb941f781fe5"
+  integrity sha512-1ZuY+JDI//WmklKlBgJnglpUL1owm2OX+8E1syCD6UAxcMM/XoWd76OHSjl/0MR0LisSAXDqgjT3uJqT67O3qw==
+
 esbuild-linux-64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-64/-/esbuild-linux-64-0.14.27.tgz#dc8072097327ecfadba1735562824ce8c05dd0bd"
   integrity sha512-ESjck9+EsHoTaKWlFKJpPZRN26uiav5gkI16RuI8WBxUdLrrAlYuYSndxxKgEn1csd968BX/8yQZATYf/9+/qg==
 
+esbuild-linux-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-64/-/esbuild-linux-64-0.14.54.tgz#de5fdba1c95666cf72369f52b40b03be71226652"
+  integrity sha512-EgjAgH5HwTbtNsTqQOXWApBaPVdDn7XcK+/PtJwZLT1UmpLoznPd8c5CxqsH2dQK3j05YsB3L17T8vE7cp4cCg==
+
 esbuild-linux-arm64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.27.tgz#c52b58cbe948426b1559910f521b0a3f396f10b8"
   integrity sha512-no6Mi17eV2tHlJnqBHRLekpZ2/VYx+NfGxKcBE/2xOMYwctsanCaXxw4zapvNrGE9X38vefVXLz6YCF8b1EHiQ==
 
+esbuild-linux-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.54.tgz#dae4cd42ae9787468b6a5c158da4c84e83b0ce8b"
+  integrity sha512-WL71L+0Rwv+Gv/HTmxTEmpv0UgmxYa5ftZILVi2QmZBgX3q7+tDeOQNqGtdXSdsL8TQi1vIaVFHUPDe0O0kdig==
+
 esbuild-linux-arm@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-arm/-/esbuild-linux-arm-0.14.27.tgz#df869dbd67d4ee3a04b3c7273b6bd2b233e78a18"
   integrity sha512-JnnmgUBdqLQO9hoNZQqNHFWlNpSX82vzB3rYuCJMhtkuaWQEmQz6Lec1UIxJdC38ifEghNTBsF9bbe8dFilnCw==
 
+esbuild-linux-arm@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-arm/-/esbuild-linux-arm-0.14.54.tgz#a2c1dff6d0f21dbe8fc6998a122675533ddfcd59"
+  integrity sha512-qqz/SjemQhVMTnvcLGoLOdFpCYbz4v4fUo+TfsWG+1aOu70/80RV6bgNpR2JCrppV2moUQkww+6bWxXRL9YMGw==
+
 esbuild-linux-mips64le@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.27.tgz#a2b646d9df368b01aa970a7b8968be6dd6b01d19"
   integrity sha512-NolWP2uOvIJpbwpsDbwfeExZOY1bZNlWE/kVfkzLMsSgqeVcl5YMen/cedRe9mKnpfLli+i0uSp7N+fkKNU27A==
 
+esbuild-linux-mips64le@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.54.tgz#d9918e9e4cb972f8d6dae8e8655bf9ee131eda34"
+  integrity sha512-qTHGQB8D1etd0u1+sB6p0ikLKRVuCWhYQhAHRPkO+OF3I/iSlTKNNS0Lh2Oc0g0UFGguaFZZiPJdJey3AGpAlw==
+
 esbuild-linux-ppc64le@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.27.tgz#9a21af766a0292578a3009c7408b8509cac7cefd"
   integrity sha512-/7dTjDvXMdRKmsSxKXeWyonuGgblnYDn0MI1xDC7J1VQXny8k1qgNp6VmrlsawwnsymSUUiThhkJsI+rx0taNA==
 
+esbuild-linux-ppc64le@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.54.tgz#3f9a0f6d41073fb1a640680845c7de52995f137e"
+  integrity sha512-j3OMlzHiqwZBDPRCDFKcx595XVfOfOnv68Ax3U4UKZ3MTYQB5Yz3X1mn5GnodEVYzhtZgxEBidLWeIs8FDSfrQ==
+
 esbuild-linux-riscv64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.27.tgz#344a27f91568056a5903ad5841b447e00e78d740"
   integrity sha512-D+aFiUzOJG13RhrSmZgrcFaF4UUHpqj7XSKrIiCXIj1dkIkFqdrmqMSOtSs78dOtObWiOrFCDDzB24UyeEiNGg==
 
+esbuild-linux-riscv64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.54.tgz#618853c028178a61837bc799d2013d4695e451c8"
+  integrity sha512-y7Vt7Wl9dkOGZjxQZnDAqqn+XOqFD7IMWiewY5SPlNlzMX39ocPQlOaoxvT4FllA5viyV26/QzHtvTjVNOxHZg==
+
 esbuild-linux-s390x@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.27.tgz#73a7309bd648a07ef58f069658f989a5096130db"
   integrity sha512-CD/D4tj0U4UQjELkdNlZhQ8nDHU5rBn6NGp47Hiz0Y7/akAY5i0oGadhEIg0WCY/HYVXFb3CsSPPwaKcTOW3bg==
 
+esbuild-linux-s390x@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.54.tgz#d1885c4c5a76bbb5a0fe182e2c8c60eb9e29f2a6"
+  integrity sha512-zaHpW9dziAsi7lRcyV4r8dhfG1qBidQWUXweUjnw+lliChJqQr+6XD71K41oEIC3Mx1KStovEmlzm+MkGZHnHA==
+
 esbuild-netbsd-64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.27.tgz#482a587cdbd18a6c264a05136596927deb46c30a"
   integrity sha512-h3mAld69SrO1VoaMpYl3a5FNdGRE/Nqc+E8VtHOag4tyBwhCQXxtvDDOAKOUQexBGca0IuR6UayQ4ntSX5ij1Q==
 
+esbuild-netbsd-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.54.tgz#69ae917a2ff241b7df1dbf22baf04bd330349e81"
+  integrity sha512-PR01lmIMnfJTgeU9VJTDY9ZerDWVFIUzAtJuDHwwceppW7cQWjBBqP48NdeRtoP04/AtO9a7w3viI+PIDr6d+w==
+
 esbuild-openbsd-64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.27.tgz#e99f8cdc63f1628747b63edd124d53cf7796468d"
   integrity sha512-xwSje6qIZaDHXWoPpIgvL+7fC6WeubHHv18tusLYMwL+Z6bEa4Pbfs5IWDtQdHkArtfxEkIZz77944z8MgDxGw==
 
+esbuild-openbsd-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.54.tgz#db4c8495287a350a6790de22edea247a57c5d47b"
+  integrity sha512-Qyk7ikT2o7Wu76UsvvDS5q0amJvmRzDyVlL0qf5VLsLchjCa1+IAvd8kTBgUxD7VBUUVgItLkk609ZHUc1oCaw==
+
 esbuild-sunos-64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-sunos-64/-/esbuild-sunos-64-0.14.27.tgz#8611d825bcb8239c78d57452e83253a71942f45c"
   integrity sha512-/nBVpWIDjYiyMhuqIqbXXsxBc58cBVH9uztAOIfWShStxq9BNBik92oPQPJ57nzWXRNKQUEFWr4Q98utDWz7jg==
 
+esbuild-sunos-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-sunos-64/-/esbuild-sunos-64-0.14.54.tgz#54287ee3da73d3844b721c21bc80c1dc7e1bf7da"
+  integrity sha512-28GZ24KmMSeKi5ueWzMcco6EBHStL3B6ubM7M51RmPwXQGLe0teBGJocmWhgwccA1GeFXqxzILIxXpHbl9Q/Kw==
+
 esbuild-windows-32@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-windows-32/-/esbuild-windows-32-0.14.27.tgz#c06374206d4d92dd31d4fda299b09f51a35e82f6"
   integrity sha512-Q9/zEjhZJ4trtWhFWIZvS/7RUzzi8rvkoaS9oiizkHTTKd8UxFwn/Mm2OywsAfYymgUYm8+y2b+BKTNEFxUekw==
 
+esbuild-windows-32@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-windows-32/-/esbuild-windows-32-0.14.54.tgz#f8aaf9a5667630b40f0fb3aa37bf01bbd340ce31"
+  integrity sha512-T+rdZW19ql9MjS7pixmZYVObd9G7kcaZo+sETqNH4RCkuuYSuv9AGHUVnPoP9hhuE1WM1ZimHz1CIBHBboLU7w==
+
 esbuild-windows-64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-windows-64/-/esbuild-windows-64-0.14.27.tgz#756631c1d301dfc0d1a887deed2459ce4079582f"
   integrity sha512-b3y3vTSl5aEhWHK66ngtiS/c6byLf6y/ZBvODH1YkBM+MGtVL6jN38FdHUsZasCz9gFwYs/lJMVY9u7GL6wfYg==
 
+esbuild-windows-64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-windows-64/-/esbuild-windows-64-0.14.54.tgz#bf54b51bd3e9b0f1886ffdb224a4176031ea0af4"
+  integrity sha512-AoHTRBUuYwXtZhjXZbA1pGfTo8cJo3vZIcWGLiUcTNgHpJJMC1rVA44ZereBHMJtotyN71S8Qw0npiCIkW96cQ==
+
 esbuild-windows-arm64@0.14.27:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.27.tgz#ad7e187193dcd18768b16065a950f4441d7173f4"
   integrity sha512-I/reTxr6TFMcR5qbIkwRGvldMIaiBu2+MP0LlD7sOlNXrfqIl9uNjsuxFPGEG4IRomjfQ5q8WT+xlF/ySVkqKg==
 
+esbuild-windows-arm64@0.14.54:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.54.tgz#937d15675a15e4b0e4fafdbaa3a01a776a2be982"
+  integrity sha512-M0kuUvXhot1zOISQGXwWn6YtS+Y/1RT9WrVIOywZnJHo3jCDyewAc79aKNQWFCQm+xNHVTq9h8dZKvygoXQQRg==
+
 esbuild@^0.11.18:
   version "0.11.23"
   resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.11.23.tgz#c42534f632e165120671d64db67883634333b4b8"
   integrity sha512-iaiZZ9vUF5wJV8ob1tl+5aJTrwDczlvGP0JoMmnpC2B0ppiMCu8n8gmy5ZTGl5bcG081XBVn+U+jP+mPFm5T5Q==
 
-esbuild@^0.14.11, esbuild@^0.14.14:
+esbuild@^0.14.11:
   version "0.14.27"
   resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.14.27.tgz#41fe0f1b6b68b9f77cac025009bc54bb96e616f1"
   integrity sha512-MZQt5SywZS3hA9fXnMhR22dv0oPGh6QtjJRIYbgL1AeqAoQZE+Qn5ppGYQAoHv/vq827flj4tIJ79Mrdiwk46Q==
@@ -2147,6 +2252,33 @@ esbuild@^0.14.11, esbuild@^0.14.14:
     esbuild-windows-64 "0.14.27"
     esbuild-windows-arm64 "0.14.27"
 
+esbuild@^0.14.47:
+  version "0.14.54"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.14.54.tgz#8b44dcf2b0f1a66fc22459943dccf477535e9aa2"
+  integrity sha512-Cy9llcy8DvET5uznocPyqL3BFRrFXSVqbgpMJ9Wz8oVjZlh/zUSNbPRbov0VX7VxN2JH1Oa0uNxZ7eLRb62pJA==
+  optionalDependencies:
+    "@esbuild/linux-loong64" "0.14.54"
+    esbuild-android-64 "0.14.54"
+    esbuild-android-arm64 "0.14.54"
+    esbuild-darwin-64 "0.14.54"
+    esbuild-darwin-arm64 "0.14.54"
+    esbuild-freebsd-64 "0.14.54"
+    esbuild-freebsd-arm64 "0.14.54"
+    esbuild-linux-32 "0.14.54"
+    esbuild-linux-64 "0.14.54"
+    esbuild-linux-arm "0.14.54"
+    esbuild-linux-arm64 "0.14.54"
+    esbuild-linux-mips64le "0.14.54"
+    esbuild-linux-ppc64le "0.14.54"
+    esbuild-linux-riscv64 "0.14.54"
+    esbuild-linux-s390x "0.14.54"
+    esbuild-netbsd-64 "0.14.54"
+    esbuild-openbsd-64 "0.14.54"
+    esbuild-sunos-64 "0.14.54"
+    esbuild-windows-32 "0.14.54"
+    esbuild-windows-64 "0.14.54"
+    esbuild-windows-arm64 "0.14.54"
+
 escalade@^3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.1.1.tgz#d8cfdc7000965c5a0174b4a82eaa5c0552742e40"
@@ -2794,6 +2926,13 @@ is-core-module@^2.8.0, is-core-module@^2.8.1:
   dependencies:
     has "^1.0.3"
 
+is-core-module@^2.9.0:
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.10.0.tgz#9012ede0a91c69587e647514e1d5277019e728ed"
+  integrity sha512-Erxj2n/LDAZ7H8WNJXd9tw38GYM3dv8rk8Zcs+jJuxYTW7sozH+SS8NtrSjVL1/vpLvWi1hxy96IzjJ3EHTJJg==
+  dependencies:
+    has "^1.0.3"
+
 is-data-descriptor@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz#0b5ee648388e2c860282e793f1856fec3f301b56"
@@ -4298,7 +4437,7 @@ postcss@8.4.5:
     picocolors "^1.0.0"
     source-map-js "^1.0.1"
 
-postcss@^8.1.10, postcss@^8.4.6:
+postcss@^8.1.10:
   version "8.4.8"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.8.tgz#dad963a76e82c081a0657d3a2f3602ce10c2e032"
   integrity sha512-2tXEqGxrjvAO6U+CJzDL2Fk2kPHTv1jQsYkSoMeOis2SsYaXRO2COxTdQp99cYvif9JTXaAk9lYGc3VhJt7JPQ==
@@ -4316,6 +4455,15 @@ postcss@^8.4.13, postcss@^8.4.14:
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
+postcss@^8.4.16:
+  version "8.4.16"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.16.tgz#33a1d675fac39941f5f445db0de4db2b6e01d43c"
+  integrity sha512-ipHE1XBvKzm5xI7hiHCZJCSugxvsdq2mPnsq5+UF+VHCjiBvtDrlxJfMBToWaP9D5XlgNmcFGqoHmUn0EYEaRQ==
+  dependencies:
+    nanoid "^3.3.4"
+    picocolors "^1.0.0"
+    source-map-js "^1.0.2"
+
 prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
@@ -4568,6 +4716,15 @@ resolve@^1.22.0:
     path-parse "^1.0.7"
     supports-preserve-symlinks-flag "^1.0.0"
 
+resolve@^1.22.1:
+  version "1.22.1"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.1.tgz#27cb2ebb53f91abb49470a928bba7558066ac177"
+  integrity sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==
+  dependencies:
+    is-core-module "^2.9.0"
+    path-parse "^1.0.7"
+    supports-preserve-symlinks-flag "^1.0.0"
+
 restore-cursor@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/restore-cursor/-/restore-cursor-3.1.0.tgz#39f67c54b3a7a58cea5236d95cf0034239631f7e"
@@ -4598,10 +4755,10 @@ rimraf@^3.0.0, rimraf@^3.0.2:
   dependencies:
     glob "^7.1.3"
 
-rollup@^2.59.0:
-  version "2.70.1"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.70.1.tgz#824b1f1f879ea396db30b0fc3ae8d2fead93523e"
-  integrity sha512-CRYsI5EuzLbXdxC6RnYhOuRdtz4bhejPMSWjsFLfVM/7w/85n2szZv6yExqUXsBdz5KT8eoubeyDUDjhLHEslA==
+"rollup@>=2.75.6 <2.77.0 || ~2.77.0":
+  version "2.77.3"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.77.3.tgz#8f00418d3a2740036e15deb653bed1a90ee0cc12"
+  integrity sha512-/qxNTG7FbmefJWoeeYJFbHehJ2HNWnjkAFRKzWN/45eNBBF/r8lo992CwcJXEzyVxs5FmfId+vTSTQDb+bxA+g==
   optionalDependencies:
     fsevents "~2.3.2"
 
@@ -5328,15 +5485,15 @@ validate-npm-package-license@^3.0.1:
     spdx-correct "^3.0.0"
     spdx-expression-parse "^3.0.0"
 
-vite@^2.7.13:
-  version "2.8.6"
-  resolved "https://registry.yarnpkg.com/vite/-/vite-2.8.6.tgz#32d50e23c99ca31b26b8ccdc78b1d72d4d7323d3"
-  integrity sha512-e4H0QpludOVKkmOsRyqQ7LTcMUDF3mcgyNU4lmi0B5JUbe0ZxeBBl8VoZ8Y6Rfn9eFKYtdXNPcYK97ZwH+K2ug==
+vite@^3.0.0:
+  version "3.0.8"
+  resolved "https://registry.yarnpkg.com/vite/-/vite-3.0.8.tgz#aa095ad8e3e5da46d9ec7e878f262678965d6531"
+  integrity sha512-AOZ4eN7mrkJiOLuw8IA7piS4IdOQyQCA81GxGsAQvAZzMRi9ZwGB3TOaYsj4uLAWK46T5L4AfQ6InNGlxX30IQ==
   dependencies:
-    esbuild "^0.14.14"
-    postcss "^8.4.6"
-    resolve "^1.22.0"
-    rollup "^2.59.0"
+    esbuild "^0.14.47"
+    postcss "^8.4.16"
+    resolve "^1.22.1"
+    rollup ">=2.75.6 <2.77.0 || ~2.77.0"
   optionalDependencies:
     fsevents "~2.3.2"
 

From f72c258d1bf52bdd2e1299415ad5d7136a00c78a Mon Sep 17 00:00:00 2001
From: Jordan Pittman <jordan@cryptica.me>
Date: Thu, 18 Aug 2022 16:58:51 -0400
Subject: [PATCH 4/4] Use TypeScript

---
 packages/playground-vue/index.html            |  2 +-
 .../playground-vue/src/{main.js => main.ts}   |  0
 .../src/{router.js => router.ts}              |  6 +++--
 packages/playground-vue/tsconfig.json         | 22 +++++++++++++++++++
 4 files changed, 27 insertions(+), 3 deletions(-)
 rename packages/playground-vue/src/{main.js => main.ts} (100%)
 rename packages/playground-vue/src/{router.js => router.ts} (94%)
 create mode 100644 packages/playground-vue/tsconfig.json

diff --git a/packages/playground-vue/index.html b/packages/playground-vue/index.html
index 4517611ab3..779b5e619f 100644
--- a/packages/playground-vue/index.html
+++ b/packages/playground-vue/index.html
@@ -9,6 +9,6 @@
   </head>
   <body class="h-full w-full font-sans text-gray-900 antialiased">
     <div class="h-full w-full" id="app"></div>
-    <script type="module" src="/src/main.js"></script>
+    <script type="module" src="/src/main.ts"></script>
   </body>
 </html>
diff --git a/packages/playground-vue/src/main.js b/packages/playground-vue/src/main.ts
similarity index 100%
rename from packages/playground-vue/src/main.js
rename to packages/playground-vue/src/main.ts
diff --git a/packages/playground-vue/src/router.js b/packages/playground-vue/src/router.ts
similarity index 94%
rename from packages/playground-vue/src/router.js
rename to packages/playground-vue/src/router.ts
index c0a49aaa4a..4561ab9748 100644
--- a/packages/playground-vue/src/router.js
+++ b/packages/playground-vue/src/router.ts
@@ -1,5 +1,7 @@
 import { createWebHistory, createRouter, RouterView } from 'vue-router'
 
+type Component = import('vue').Component
+
 function buildRoutes() {
   function titleCase(str) {
     return str
@@ -15,7 +17,7 @@ function buildRoutes() {
       eager: true,
       import: 'default',
     })
-  )
+  ) as [string, Component][]
 
   // 2.a. Swap the file names for route urls
   // 2.b. Resolve the default import for each component
@@ -34,7 +36,7 @@ function buildRoutes() {
   files = files.flatMap((entry) => {
     let dirs = entry[0].split('/').slice(1, -1)
 
-    let paths = []
+    let paths: [string, Component][] = []
 
     for (const [idx] of dirs.entries()) {
       let path = `/` + dirs.slice(0, idx + 1).join('/')
diff --git a/packages/playground-vue/tsconfig.json b/packages/playground-vue/tsconfig.json
new file mode 100644
index 0000000000..4ed49812d1
--- /dev/null
+++ b/packages/playground-vue/tsconfig.json
@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "types": ["vite/client"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": false,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "incremental": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "downlevelIteration": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve"
+  },
+  "include": ["**/*.ts", "**/*.tsx", "**/*.vue"],
+  "exclude": ["node_modules"]
+}