uktrade/lite-forms

<input class="govuk-input {% if not component.classes %}govuk-input--width-20{% endif %} {% for class in component.classes %}{{ class }} {% endfor %}{% if error %}govuk-input--error{% endif %}" id="{{ name }}" name="{{ name }}" type="email" aria-describedby="email-hint" autocomplete="email" spellcheck="false" value="{{ value }}">
<div id="email-pane-{{ name }}" class="lite-email-panel govuk-inset-text">
    <p class="govuk-hint govuk-!-margin-bottom-1">We'll send an email to:</p>
    <p class="govuk-body-l"></p>
</div>
<script type="text/javascript">
    function tryShowEmailField(object) {
        if ($(object).val().trim().length != 0) {
            $("#email-pane-{{ name|prefix_dots }} .govuk-body-l").text($(object).val())
            $("#email-pane-{{ name|prefix_dots }}").show();
        } else {
            $("#email-pane-{{ name|prefix_dots }}").hide();
        }
    }

    $("#{{ name|prefix_dots }}").on('input propertychange paste', function() {
        tryShowEmailField(this);
    });

    tryShowEmailField("#{{ name|prefix_dots }}");
</script>