Last updated

Lead Capture

The Lead Capture component displays a form to capture customer leads and associate them with an affiliate.

Usage

<fluid-lead-capture></fluid-lead-capture>

Attributes

AttributeTypeDefaultDescription
hide-widgetbooleanfalseWhether to hide the component
class-namestringAdditional CSS classes
primary-colorstringPrimary color for styling
secondary-colorstringSecondary color for styling

Form Options

AttributeTypeDefaultDescription
show-namebooleantrueShow name field
show-phonebooleanfalseShow phone field
require-phonebooleanfalseMake phone field required
button-textstring'Submit'Submit button text
success-messagestringMessage shown after successful submission

Examples

Basic Lead Form

<fluid-lead-capture></fluid-lead-capture>

With Phone Field

<fluid-lead-capture
  show-phone="true"
  require-phone="true"
></fluid-lead-capture>

Custom Styling

<fluid-lead-capture
  primary-color="#4F46E5"
  secondary-color="#1F2937"
  button-text="Get Started"
  success-message="Thanks! We'll be in touch soon."
></fluid-lead-capture>

JavaScript API

// Capture a lead programmatically
await window.FairShareSDK.captureLead({
  email: "customer@example.com",
  name: "John Doe",
  phone: "+1234567890"
});