{% import "_includes/forms" as forms %}

{{ forms.textField({
    label: "Placeholder Text"|t,
    instructions: "The text that will be shown if the field doesn’t have a value."|t,
    id: 'placeholder',
    name: 'placeholder',
    value: field.placeholder
}) }}

{{ forms.checkboxField({
    label: "URLs for this field have their own validation pattern"|t,
    name: 'customPatternToggle',
    checked: field.customPatternToggle,
    toggle: 'sprouturlfield-custom-validation-pattern'
}) }}

<div id="sprouturlfield-custom-validation-pattern" {% if not field.customPatternToggle %}class="hidden"{% endif %}>
    {{ forms.textField({
        label: 'Validation Pattern'|t,
        instructions: 'Validate URLs using this regular expression.'|t,
        name: 'customPattern',
        placeholder: '^https://twitter.com/(.*)',
        value: field.customPattern
    }) }}

    {{ forms.textField({
        label: 'Error Message'|t,
        instructions: 'Display this error message when a URL is invalid.'|t,
        name: 'customPatternErrorMessage',
        placeholder: 'Must be a valid profile URL from twitter.com',
        value: field.customPatternErrorMessage
    }) }}
</div>