About
A validated number input inside a form, built with react-hook-form and zod, showing an error message and a success toast when the amount is submitted.
Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Number Field Form to your project and fits it to your theme.
Code
How Number Field Form is used: the demo's code. The component's own source comes with a free account.
Usage.tsx
import NumberFieldForm from "@/components/ui/number-field-form";
import { Toaster } from "sonner";
export default function NumberFieldFormDemo() {
return (
<div className="flex w-full items-center justify-center p-10">
<NumberFieldForm />
<Toaster />
</div>
);
}
















