Address

A simple text preset with their options and an address preset with its default options.

The following form is rendered from:

const json = {
  "inputs": [
    {
      "type": "text",
      "options": {
        "name": "full_name",
        "label": "Full Name",
        "props": {
          "placeholder": "Paracelso de la Fuente"
        },
        "rules": {
          "required": "YoUr NaMe Is ReQuIrEd"
        }
      }
    },
    {
      "type": "address"
    }
  ]
}

Sign up

There are default options to each preset, but you can define your own.

The password preset when declaring `confirm: true` will look for another input with the name as "password". If it finds it, it will validate that the values match. You can define another input to validate againts by passing the name as a string to the confirm option.

The following form is rendered from:

const json = {
  "inputs": [
    {
      "type": "email"
    },
    {
      "type": "password"
    },
    {
      "type": "password",
      "options": {
        "name": "confirmPassword",
        "label": "Confirm Password",
        "confirm": true
      }
    }
  ]
}

With default values

There are default options to each preset, but you can define your own.

The following form is rendered from:

const json = {
  "inputs": [
    {
      "type": "text",
      "options": {
        "name": "name",
        "label": "Name",
        "props": {
          "defaultValue": "John Doe"
        }
      }
    },
    {
      "type": "text",
      "options": {
        "name": "profession",
        "label": "Profession",
        "props": {
          "defaultValue": "Attorney"
        }
      }
    },
    {
      "type": "address",
      "options": {
        "props": {
          "defaultValue": {
            "value": {
              "primary_line": "123 Main St",
              "city": "Anytown",
              "state": "CA",
              "zip_code": "12345"
            },
            "label": "123 Main St, Anytown, CA 12345"
          }
        }
      }
    }
  ]
}