You will need to include one or more of our 3 components, depending on which validation type (address, phone or email) you require and where. The component names to use in your LWC templates are the following:
texperianledq-ledq-cmp-address-validate-flowtexperianledq-ledq-cmp-email-validate-flowtexperianledq-ledq-cmp-phone-validate-flowYou can then populate the required attributes for each embedded component to control its behavior and where the data ends up.
The following attributes apply to all components:
| Attribute | Description |
|---|---|
| field-label | The label that appears above the field. |
| help-text | If present, shows a popover element by the element label, containing whatever you assign to the attribute. Typically used to give extra explanation as to the purpose or behavior of the field. |
| is-required | Boolean attribute that toggles required status of the field. This only displays a required message if the field is left blank, it is up to the integrator to ensure this is enforced. |
| is-disabled | Boolean attribute that toggles disabled status of the field. You will not be able to interact with the component while this is toggled. |
| onvalidationstatuschange | Assign a function here to subscribe to validation status change events. This data can be used to save transaction logs or populate other fields. |
| onfieldchange | Assign a function here to subscribe to field change events. The event.detail attribute here will contain values for each field in the component. |
| onmappedfieldschange | Assign a function here to subscribe to changes to the fields mapped in the assigned Touchpoint. The event.detail attribute here will contain values for each metadata/components/enrichment field which has a value for the current validation. |
| existing-record-id | The ID of an existing record. When coupled with the existing-field-api-name attribute, the component will attempt to load an existing transaction log record and show its validation status. |
| existing-field-api-name | The API field name of an address, phone or email field to be validated. When coupled with the existing-record-id attribute, the component will attempt to load an existing transaction log record and show its validation status. |
| touchpoint-api-name | The API name of a Touchpoint. It is generally recommended to use unbound ones. |
| validation-input-key | Can be used to optionally provide a default value for Validation Input Key, which allows you to restore a previous validation from a previous state of your component. |
| validation-status | Can be used to optionally provide a default value for Validation Status, which allows you to restore a previous validation from a previous state of your component. |
| validation-more-info | Can be used to optionally provide a default value for Validation More Info, which allows you to restore a previous validation from a previous state of your component. |
The following attributes are component specific:
| Attribute | Description |
|---|---|
| state-picklists | Boolean attribute that enables state picklists for supported countries. The active states configured in State and Country Picklists will be displayed as a picklist if this option is enabled. The default is plain text display of the state. |
| split-street-field | Boolean attribute that enables 7-line addresses. The street results will be split into the separate Street fields if this option is enabled. The default is for them to be concatenated in the first Street field. |
| restrict-countries-to-comma-separated | Comma-separated list of ISO country codes, which, if specified, restricts the countries displayed in the country dropdown to those specified, e.g. GBP, AUS, CAN, USA. |
| street-1-value | Can be used to optionally provide a default value for the Street 1 field. |
| street-2-value | Can be used to optionally provide a default value for the Street 2 field. Only applies if split-street-field is also enabled. |
| street-3-value | Can be used to optionally provide a default value for the Street 3 field. Only applies if split-street-field is also enabled. |
| city-value | Can be used to optionally provide a default value for the City field. |
| province-value | Can be used to optionally provide a default value for the State/Province field. |
| postcode-value | Can be used to optionally provide a default value for the ZIP/Postal Code field. |
| country-value | Can be used to optionally provide a default value for the Country field. Must be a valid 3-letter ISO country code, otherwise this setting will be ignored. |
| global-address-key | Can be used to optionally provide a global address key from a previous validation. You may need this to restore a previous validation from a previous state of your component. |
| Attribute | Description |
|---|---|
| email-value | Can be used to optionally provide a default email value. |
| placeholder | The text that appears in the email field when it's empty. Use placeholder text to give users a hint about what to enter in the field. |
| Attribute | Description |
|---|---|
| phone-code | Can be used to optionally provide a default country code value. It must be provided as a three-letter ISO country code, e.g. GBR. This is to differentiate countries with the same numerical value, e.g. the United States and Canada. |
| phone-value | Can be used to optionally provide a default codeless phone value. |
| placeholder | The text that appears in the phone field when it's empty. Use placeholder text to give users a hint about what to enter in the field. |
In certain cases, you may want to prepopulate the values of your components with existing data. This is fairly straightforward and can be done using the attributes listed above. This extends to validation statuses too, if for example you wanted to restore a previously validated number when stepping backwards in your UI from a later state.