fix prop default for iconlistsection

had to create a function to generate obj🙄, should have known + prevents mutations between components for ref types (https://vuejs.org/api/sfc-script-setup.html#default-props-values-when-using-type-declaration + https://vuejs.org/guide/components/props.html#prop-validation)

package.json

@@ -27,8 +27,8 @@
   "devDependencies": {
     "@rushstack/eslint-patch": "^1.10.4",
     "@tsconfig/node20": "^20.1.4",
-    "@types/node": "^20.14.14",
     "@types/bun": "latest",
+    "@types/node": "^20.14.14",
     "@vitejs/plugin-vue": "^5.1.2",
     "@vitejs/plugin-vue-jsx": "^3.1.0",
     "@vue/eslint-config-typescript": "^13.0.0",
@@ -37,10 +37,12 @@
     "eslint-plugin-vue": "^9.27.0",
     "npm-run-all2": "^6.2.2",
     "vite": "^5.3.5",
+    "vite-plugin-checker": "^0.7.2",
     "vite-plugin-vue-devtools": "^7.3.7",
     "vue-tsc": "^2.0.29"
   },
   "peerDependencies": {
-    "typescript": "~5.4.5"
+    "vue-tsc": "^2.0.29",
+    "typescript": "^5.5.4"
   }
 }

src/App.vue

@@ -1,12 +1,12 @@
 <template>
     <div class="is-flex is-flex-direction-column">
-        <header class="is-flex-grow-0">
+        <header>
             <TheNav />
         </header>
-        <main class="container is-fluid is-flex-grow-1">
+        <main class="container is-fluid">
             <RouterView />
         </main>
-        <TheFoot class="is-flex-shrink-1 is-flex-grow-0" />
+        <TheFoot />
     </div>
 </template>
 

src/views/IconListSection.vue

@@ -22,12 +22,14 @@
 
     const props = withDefaults(defineProps<IconListSectionProps>(),
         {
-            iconStyle: {
+            iconStyle() {
+                return {
                 size: 12,
                 coloured: true,
                 wordmark: true,
                 design: 'plain',
                 fallback: 'no-text'
             }
-        });
+        }
+    });
 </script>

tsconfig.json

@@ -7,5 +7,9 @@
     {
       "path": "./tsconfig.app.json"
     }
-  ]
+  ],
+  "compilerOptions": {
+    "isolatedModules": true,
+    "verbatimModuleSyntax": true
+  }
 }

vite.config.ts

@@ -4,13 +4,15 @@ import {defineConfig} from "vite";
 import vue from "@vitejs/plugin-vue";
 import vueJsx from "@vitejs/plugin-vue-jsx";
 import VueDevTools from "vite-plugin-vue-devtools";
+import checker from 'vite-plugin-checker'
 
 // https://vitejs.dev/config/
 export default defineConfig({
     plugins: [
         vue(),
         vueJsx(),
         VueDevTools(),
+        checker({ typescript: true, vueTsc: true }),
     ],
     resolve: {
         alias: {