add tsserver plugin

.vscode/settings.json

@@ -0,0 +1,4 @@
+// .vscode/settings.json
+{
+  "typescript.tsdk": "node_modules/typescript/lib"
+}

package.json

@@ -14,21 +14,19 @@
     "typecheck": "bunx --bun tsc"
   },
   "devDependencies": {
+    "@kitajs/ts-html-plugin": "^1.0.1",
     "bun-types": "latest",
     "concurrently": "^8.2.1",
     "drizzle-kit": "^0.19.13",
+    "typescript": "^5.2.2",
     "unocss": "^0.55.7"
   },
-  "peerDependencies": {
-    "typescript": "^5.0.0"
-  },
   "dependencies": {
     "@bogeychan/elysia-logger": "0.0.9",
     "@elysiajs/cron": "^0.6.0",
     "@elysiajs/static": "^0.6.0",
     "@elysiajs/swagger": "^0.6.2",
     "@kitajs/html": "^2.1.2",
-    "@kitajs/ts-html-plugin": "^1.0.1",
     "@libsql/client": "0.3.5-pre.4",
     "@lucia-auth/adapter-sqlite": "^2.0.0",
     "@t3-oss/env-core": "^0.6.1",

src/components/todos.tsx

@@ -3,7 +3,7 @@ import type { Todo } from "../db/schema/todos";
 export function TodoItem({ content, completed, id }: Todo) {
   return (
     <div class="flex flex-row space-x-3">
-      <p>{content}</p>
+      <p safe>{content}</p>
       <input
         type="checkbox"
         checked={completed}
@@ -25,7 +25,7 @@ export function TodoItem({ content, completed, id }: Todo) {
 
 export function TodoList({ todos }: { todos: Todo[] }) {
   return (
-    <div>
+    <div safe>
       {todos.map((todo) => (
         <TodoItem {...todo} />
       ))}

tsconfig.json

@@ -9,7 +9,7 @@
     "noEmit": true,
     "composite": true,
     "strict": true,
-    "noUncheckedIndexedAccess": true,
+    // "noUncheckedIndexedAccess": true,
     "downlevelIteration": true,
     "skipLibCheck": true,
     "jsx": "react",