Skip to content
JonathonWarwick edited this page Jul 16, 2024 · 13 revisions

Refer to Stockport Design System for styling information and reference images

DSL properties

Property Type Required Default Value Description
QuestionId string ✔️ Unique question id allowed charatcers are [a-zA-Z] only
StreetProvider enum ✔️ Street provider used for street data lookup
Label string ✔️ Street name Label associated with the search term
SelectLabel string ✔️ Select the street from the list Label associated with the select dropdown
Hint string hint which appears above the street input
SelectHint string hint which appears above the select input
StreetIAG string The street must be in Stockport. You can only enter letters A to Z and spaces, for example, Stockport Road. Inline altert which appears on the street search page
Optional bool false
CustomValidationMessage string Set a custom validation message for when user does not enter a street)
SelectCustomValidationMessage string Set a custom validation message for when user does not select an street from the dropdown
TargetMapping string Used for custom object mapping when creating submit data
StrongLabel bool true Labels associated to inputs are strong
MaxLength int 200
LabelAsH1 bool false Display the inputs label as a h1 and not a label (if this is set to true, HideTitle in the Page properties should also be set to true)
SummaryLabel string Change the label associated with this input on the summary
StreetMissingText string Shows hint text to the user when they are unable to find their street in the returned list

Validation

The street search query must only contain characters a to z and spaces to be valid.

Street examples

DS Json for street:

 {
      "Title": "Enter your street",
      "PageSlug": "street-search",
      "Elements": [
        {
          "Type": "Street",
          "Properties": {
            "QuestionId": "customersstreet",
            "Label": "What street are you asking about?",
            "StrongLabel": true,
            "SelectLabel": "Select your street",
            "StreetProvider": "Fake"
          }
        },
        {
          "Type": "Button",
          "Properties": {
            "ButtonId": "nextStep"
          }
        }
      ]
    }

All possible properties example:

 {
      "Title": "Enter your street",
      "PageSlug": "street-search",
      "Elements": [
        {
          "Type": "Street",
          "Properties": {
            "StrongLabel": true,
            "QuestionId": "street",
            "Label": "What street are you asking about?",
            "SelectLabel": "Select your street",
            "Hint": "This is an additional hint",
            "SelectHint": "This is an additional hint",
            "StreetProvider": "Fake",
            "Optional": true,
            "CustomValidationMessage": "Custom street validation message",
            "SelectCustomValidationMessage": "Custom street select validation message",
            "TargetMapping": "customer.street",
            "StreetMissingText": "This is shown when user can't find their street"
          }
        }
      ]
    }
Clone this wiki locally