NuxtUI Form Submit Issue

<template>
  <UForm
    :schema="z.object({ text: z.string() })"
    :state="formState"
    @error="(e) => console.log(e)"
    @submit="(e) => console.log(e)"
  >
    <UInput v-model="formState.text" name="text" />
    <UButton type="submit" label="Submit" />
  </UForm>
</template>
  
<script setup lang="ts">
import * as z from "zod";

const formState = ref({ text: "" });
</script>

<template>
  <UForm
    :schema="z.object({ text: z.string() })"
    :state="formState"
    @error="(e) => console.log(e)"
    @submit="(e) => console.log(e)"
  >
    <UInput v-model="formState.text" name="text" />
    <UButton type="submit" label="Submit" />
  </UForm>
</template>
  
<script setup lang="ts">
import * as z from "zod";

const formState = ref({ text: "" });
</script>