AsyncForm

import { AsyncForm, TextField } from "mizu-ui";

export function Example() {
  return (
    <AsyncForm
      onSubmit={async (data, signal) => {
        const response = await fetch("/api/settings", {
          method: "POST",
          body: data,
          signal,
        });
        if (!response.ok) throw new Error("Could not save settings.");
      }}
    >
      <TextField label="Display name" name="name" required />
      <button type="submit" className="mizu-text-button">
        Save settings
      </button>
    </AsyncForm>
  );
}