Checkbox

"use client";

import { useForm } from "@tanstack/react-form";
import { ErlForm } from "erlangform";
import { schema, type FormValues } from "./schema";

export default function CheckboxForm() {
  const form = useForm({
    defaultValues: { acceptTerms: false },
    validators: { onChange: schema },
    onSubmit: ({ value }) => alert(JSON.stringify(value)),
  });

  return (
    <form
      onSubmit={(event) => {
        event.preventDefault();
        void form.handleSubmit();
      }}
    >
      <ErlForm<FormValues>
        form={form}
        schema={schema}
        fieldConfig={{
          acceptTerms: {
            label: "Saya menyetujui syarat dan ketentuan",
            type: "checkbox",
          },
        }}
      />
      <button type="submit">Lanjutkan</button>
    </form>
  );
}