From e1cf5c05b578471a123bc0bc585c770d03676fe5 Mon Sep 17 00:00:00 2001
From: Renovate Bot <renovatebot@schulze.network>
Date: Sat, 12 Jul 2025 03:03:33 +0000
Subject: [PATCH 1/2] fix(deps): update dependency zod to v4

---
 package-lock.json | 8 ++++----
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 9aa792c..3a99857 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -25,7 +25,7 @@
         "react-hook-form": "^7.56.1",
         "recharts": "^2.15.3",
         "tailwind-merge": "^3.2.0",
-        "zod": "^3.24.3"
+        "zod": "^4.0.0"
       },
       "devDependencies": {
         "@eslint/eslintrc": "3.3.1",
@@ -7637,9 +7637,9 @@
       }
     },
     "node_modules/zod": {
-      "version": "3.25.76",
-      "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.76.tgz",
-      "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-4.0.5.tgz",
+      "integrity": "sha512-/5UuuRPStvHXu7RS+gmvRf4NXrNxpSllGwDnCBcJZtQsKrviYXm54yDGV2KYNLT5kq0lHGcl7lqWJLgSaG+tgA==",
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
diff --git a/package.json b/package.json
index 5e942e6..728cadd 100644
--- a/package.json
+++ b/package.json
@@ -31,7 +31,7 @@
     "react-hook-form": "^7.56.1",
     "recharts": "^2.15.3",
     "tailwind-merge": "^3.2.0",
-    "zod": "^3.24.3"
+    "zod": "^4.0.0"
   },
   "devDependencies": {
     "@eslint/eslintrc": "3.3.1",
-- 
2.49.1


From 41c4e27160e0e9992c3c1a509cd51ad633807d5d Mon Sep 17 00:00:00 2001
From: Felix Schulze <admin@schulze.network>
Date: Sun, 13 Jul 2025 00:55:18 +0200
Subject: [PATCH 2/2] zod 4 migration

---
 src/app/components/FireCalculatorForm.tsx | 111 ++++++++++++++++------
 1 file changed, 81 insertions(+), 30 deletions(-)

diff --git a/src/app/components/FireCalculatorForm.tsx b/src/app/components/FireCalculatorForm.tsx
index 26f9818..ec79a03 100644
--- a/src/app/components/FireCalculatorForm.tsx
+++ b/src/app/components/FireCalculatorForm.tsx
@@ -120,7 +120,7 @@ export default function FireCalculatorForm() {
   const [showing4percent, setShowing4percent] = useState(false);
 
   // Initialize form with default values
-  const form = useForm<FormValues>({
+  const form = useForm<z.input<typeof formSchema>, undefined, FormValues>({
     resolver: zodResolver(formSchema),
     defaultValues: {
       startingCapital: 50000,
@@ -258,11 +258,18 @@ export default function FireCalculatorForm() {
                         <Input
                           placeholder="e.g., 10000"
                           type="number"
-                          {...field}
-                          onChange={(value) => {
-                            field.onChange(value);
+                          value={field.value as number | string | undefined}
+                          onChange={(e) => {
+                            field.onChange(
+                              e.target.value === ""
+                                ? undefined
+                                : Number(e.target.value),
+                            );
                             void form.handleSubmit(onSubmit)();
                           }}
+                          onBlur={field.onBlur}
+                          name={field.name}
+                          ref={field.ref}
                         />
                       </FormControl>
                       <FormMessage />
@@ -279,11 +286,18 @@ export default function FireCalculatorForm() {
                         <Input
                           placeholder="e.g., 500"
                           type="number"
-                          {...field}
-                          onChange={(value) => {
-                            field.onChange(value);
+                          value={field.value as number | string | undefined}
+                          onChange={(e) => {
+                            field.onChange(
+                              e.target.value === ""
+                                ? undefined
+                                : Number(e.target.value),
+                            );
                             void form.handleSubmit(onSubmit)();
                           }}
+                          onBlur={field.onBlur}
+                          name={field.name}
+                          ref={field.ref}
                         />
                       </FormControl>
                       <FormMessage />
@@ -300,11 +314,18 @@ export default function FireCalculatorForm() {
                         <Input
                           placeholder="e.g., 30"
                           type="number"
-                          {...field}
-                          onChange={(value) => {
-                            field.onChange(value);
+                          value={field.value as number | string | undefined}
+                          onChange={(e) => {
+                            field.onChange(
+                              e.target.value === ""
+                                ? undefined
+                                : Number(e.target.value),
+                            );
                             void form.handleSubmit(onSubmit)();
                           }}
+                          onBlur={field.onBlur}
+                          name={field.name}
+                          ref={field.ref}
                         />
                       </FormControl>
                       <FormMessage />
@@ -321,11 +342,18 @@ export default function FireCalculatorForm() {
                         <Input
                           placeholder="e.g., 90"
                           type="number"
-                          {...field}
-                          onChange={(value) => {
-                            field.onChange(value);
+                          value={field.value as number | string | undefined}
+                          onChange={(e) => {
+                            field.onChange(
+                              e.target.value === ""
+                                ? undefined
+                                : Number(e.target.value),
+                            );
                             void form.handleSubmit(onSubmit)();
                           }}
+                          onBlur={field.onBlur}
+                          name={field.name}
+                          ref={field.ref}
                         />
                       </FormControl>
                       <FormMessage />
@@ -343,11 +371,18 @@ export default function FireCalculatorForm() {
                           placeholder="e.g., 7"
                           type="number"
                           step="0.1"
-                          {...field}
-                          onChange={(value) => {
-                            field.onChange(value);
+                          value={field.value as number | string | undefined}
+                          onChange={(e) => {
+                            field.onChange(
+                              e.target.value === ""
+                                ? undefined
+                                : Number(e.target.value),
+                            );
                             void form.handleSubmit(onSubmit)();
                           }}
+                          onBlur={field.onBlur}
+                          name={field.name}
+                          ref={field.ref}
                         />
                       </FormControl>
                       <FormMessage />
@@ -365,11 +400,18 @@ export default function FireCalculatorForm() {
                           placeholder="e.g., 2"
                           type="number"
                           step="0.1"
-                          {...field}
-                          onChange={(value) => {
-                            field.onChange(value);
+                          value={field.value as number | string | undefined}
+                          onChange={(e) => {
+                            field.onChange(
+                              e.target.value === ""
+                                ? undefined
+                                : Number(e.target.value),
+                            );
                             void form.handleSubmit(onSubmit)();
                           }}
+                          onBlur={field.onBlur}
+                          name={field.name}
+                          ref={field.ref}
                         />
                       </FormControl>
                       <FormMessage />
@@ -388,11 +430,18 @@ export default function FireCalculatorForm() {
                         <Input
                           placeholder="e.g., 2000"
                           type="number"
-                          {...field}
-                          onChange={(value) => {
-                            field.onChange(value);
+                          value={field.value as number | string | undefined}
+                          onChange={(e) => {
+                            field.onChange(
+                              e.target.value === ""
+                                ? undefined
+                                : Number(e.target.value),
+                            );
                             void form.handleSubmit(onSubmit)();
                           }}
+                          onBlur={field.onBlur}
+                          name={field.name}
+                          ref={field.ref}
                         />
                       </FormControl>
                       <FormMessage />
@@ -406,11 +455,13 @@ export default function FireCalculatorForm() {
                   name="retirementAge"
                   render={({ field }) => (
                     <FormItem>
-                      <FormLabel>Retirement Age: {field.value}</FormLabel>
+                      <FormLabel>
+                        Retirement Age: {field.value as number}
+                      </FormLabel>
                       <FormControl>
                         <Slider
                           name="retirementAge"
-                          value={[field.value]}
+                          value={[field.value as number]}
                           min={25}
                           max={75}
                           step={1}
@@ -563,8 +614,8 @@ export default function FireCalculatorForm() {
                         <ReferenceLine
                           x={
                             irlYear +
-                            (form.getValues("retirementAge") -
-                              form.getValues("currentAge"))
+                            (Number(form.getValues("retirementAge")) -
+                              Number(form.getValues("currentAge")))
                           }
                           stroke="var(--primary)"
                           strokeWidth={2}
@@ -579,7 +630,7 @@ export default function FireCalculatorForm() {
                             x={
                               irlYear +
                               (result.retirementAge4percent -
-                                form.getValues("currentAge"))
+                                Number(form.getValues("currentAge")))
                             }
                             stroke="var(--secondary)"
                             strokeWidth={1}
@@ -642,8 +693,8 @@ export default function FireCalculatorForm() {
                 </CardHeader>
                 <CardContent>
                   <p className="text-3xl font-bold">
-                    {form.getValues("lifeExpectancy") -
-                      form.getValues("retirementAge")}
+                    {Number(form.getValues("lifeExpectancy")) -
+                      Number(form.getValues("retirementAge"))}
                   </p>
                 </CardContent>
               </Card>
@@ -674,7 +725,7 @@ export default function FireCalculatorForm() {
                     </CardHeader>
                     <CardContent>
                       <p className="text-3xl font-bold">
-                        {form.getValues("lifeExpectancy") -
+                        {Number(form.getValues("lifeExpectancy")) -
                           (result.retirementAge4percent ?? 0)}
                       </p>
                     </CardContent>
-- 
2.49.1