rebase

www/package.json

@@ -4,6 +4,7 @@
   "type": "module",
   "dependencies": {
     "@headlessui/react": "^1.7.11",
+    "@hookform/resolvers": "^2.9.11",
     "@preact/signals": "^1.1.3",
     "@talisman-connect/wallets": "^1.1.3",
     "@tanstack/react-query": "^4.26.1",
@@ -13,10 +14,12 @@
     "common": "workspace:../common",
     "preact": "^10.12.1",
     "prettier-plugin-tailwindcss": "^0.2.4",
+    "react-hook-form": "^7.43.3",
     "react-router-dom": "^6.8.1",
     "server": "workspace:../server",
     "tailwind-merge": "^1.10.0",
-    "vite-tsconfig-paths": "^4.0.5"
+    "vite-tsconfig-paths": "^4.0.5",
+    "zod": "link:@hookform/resolvers/zod"
   },
   "devDependencies": {
     "@babel/core": ">=7.12.10 <8.0.0",

src/components/wizard/MultisigFund.tsx → www/src/components/wizard/MultisigFund.tsx

@@ -1,14 +1,13 @@
-import { useForm } from 'react-hook-form'
-import { zodResolver } from '@hookform/resolvers/zod'
-import * as z from 'zod'
-import { signal } from '@preact/signals'
-import type { Signal } from '@preact/signals'
-
-import { Button } from '../Button'
-import { useWizardNavigation, useWizardFormDataStep } from './Wizard'
+import { zodResolver } from "@hookform/resolvers/zod/dist/index.js"
+import { signal } from "@preact/signals"
+import type { Signal } from "@preact/signals"
+import { useForm } from "react-hook-form"
+import { z } from "zod"
+import { Button } from "../Button.js"
+import { useWizardFormDataStep, useWizardNavigation } from "./Wizard.js"
 
 export const multisigFundSchema = z.object({
-  fund: z.number().min(1, { message: 'Fund must be greater than 0' }),
+  fund: z.number().min(1, { message: "Fund must be greater than 0" }),
 })
 export type MultisigFundEntity = z.infer<typeof multisigFundSchema>
 
@@ -25,11 +24,10 @@ export function MultisigFund() {
     formState: { errors },
   } = useForm<MultisigFundEntity>({
     resolver: zodResolver(multisigFundSchema),
-    mode: 'onChange',
+    mode: "onChange",
   })
   const { goNext, goPrev } = useWizardNavigation()
-  const { formDataStep, updateFormDataStep } =
-    useWizardFormDataStep<MultisigFundEntity>()
+  const { formDataStep, updateFormDataStep } = useWizardFormDataStep<MultisigFundEntity>()
 
   const onSubmit = (formDataNew: MultisigFundEntity) => {
     updateFormDataStep(formDataNew)
@@ -49,7 +47,7 @@ export function MultisigFund() {
         Fund the multisig: <span class="text-pink-600">*</span>
       </label>
       <input
-        {...register('fund', { valueAsNumber: true })}
+        {...register("fund", { valueAsNumber: true })}
         type="number"
         defaultValue={formDataStep.fund.toString()}
         class="block rounded-lg border border-gray-300 p-2 my-2 w-1/3"