Signature Input

Capture a quick hand-drawn signature.

Preview

Please provide your signature above

Usage

<FormField
          control={form.control}
          name="sign_here"
          render={({ field }) => (
          <FormItem>
            <FormLabel>Sign here</FormLabel>
            <FormControl>
            <SignatureInput
              canvasRef={canvasRef}
              onSignatureChange={field.onChange}
            />
            </FormControl>
            <FormDescription>Please provide your signature above</FormDescription>
            <FormMessage />
          </FormItem>
          )}
        />

Details

Copy this field block into a React Hook Form setup and swap the demo content for your own schema and labels.

Component referenceform-builder/components/ui/signature-input.tsx