TrackForm

import { TrackForm } from 'mentiq-sdk';

function ContactForm() {
  return (
    <TrackForm formName="contact_form">
      <input type="text" name="name" placeholder="Your name" />
      <input type="email" name="email" placeholder="Your email" />
      <textarea name="message" placeholder="Your message" />
      <button type="submit">Send Message</button>
    </TrackForm>
  );
}

<TrackForm
  formName="signup_form"
  trackSubmit={true}
  trackFieldChanges={true}
>
  <input type="text" name="username" />
  <input type="password" name="password" />
  <input type="email" name="email" />
  <button type="submit">Sign Up</button>
</TrackForm>

function MultiStepForm() {
  const [step, setStep] = useState(1);

  return (
    <TrackForm
      formName={`checkout_form_step_${step}`}
      trackFieldChanges={true}
    >
      {step === 1 && (
        <div>
          <input type="text" name="shipping_address" />
          <input type="text" name="city" />
        </div>
      )}
      {step === 2 && (
        <div>
          <input type="text" name="card_number" />
          <input type="text" name="cvv" />
        </div>
      )}
      <button type="submit">Continue</button>
    </TrackForm>
  );
}

{
  form_name: string,      // The formName prop value
  field_count: number,    // Number of fields in the form
  fields: string          // Comma-separated list of field names
}

{
  form_name: string,      // The formName prop value
  field_name: string,     // The name attribute of the field
  field_type: string      // The type of input (text, email, etc.)
}