<div class="govuk-character-count" data-module="govuk-character-count" data-maxlength="200">
    <div class="govuk-form-group">
        <h1 class="govuk-label-wrapper">
            <label class="govuk-label govuk-label--l" for="with-hint">
                {{ title }}
            </label>
        </h1>
        <div id="with-hint-hint" class="govuk-hint">
            {{ hint }}
        </div>
        <textarea class="govuk-textarea govuk-js-character-count" id="with-hint" name="with-hint" rows="5" aria-describedby="with-hint-info with-hint-hint"></textarea>
    </div>

    <div id="with-hint-info" class="govuk-hint govuk-character-count__message" aria-live="polite">
        {{ info }}
    </div>
</div>
