The <pet-insurance> component will check the list of known breeds--if the declared breed exactly matches a recognized breed name, then the quote will automatically be sent. Otherwise, the user will be prompted to select the matching breed for the pet, if it exists in the list, or to select "Rare Breed" (for a dog) or "Mixed Breed" (for a cat) if it is not found.

To see the breed selection dropdown in action, change the "declared breed" in the editor to a breed name which does not exist.

Live Editor

<div style={{ background: "white", padding: "8px" }}> <pet-insurance client-id="test_RGMDV4FV4BNK4TSPT7DOQVC3P9HKEXTQ" customer-email-address="test01@verticalinsure.com" customer-state="MN" customer-postal-code="55401" species="DOG" declared-breed="Bernese" plan="INJURY_AND_ILLNESS" age="3" pet-name="Oliver" gender="MALE" ></pet-insurance> </div>

<div style={{ background: "white", padding: "8px" }}>
    <pet-insurance
      client-id="test_RGMDV4FV4BNK4TSPT7DOQVC3P9HKEXTQ" 
      customer-email-address="test01@verticalinsure.com"
      customer-state="MN"
      customer-postal-code="55401"
      species="DOG"
      declared-breed="Bernese"
      plan="INJURY_AND_ILLNESS"
      age="3"
      pet-name="Oliver"
      gender="MALE"
    ></pet-insurance>
</div>

Result

Loading...