mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-07-28 03:39:29 -04:00
59 lines
2.4 KiB
Plaintext
59 lines
2.4 KiB
Plaintext
{% from "../error-message/macro.njk" import usaErrorMessage -%}
|
|
{% from "../hint/macro.njk" import usaHint %}
|
|
{% from "../label/macro.njk" import usaLabel %}
|
|
|
|
{# Generate a consistent input ID #}
|
|
{% set inputId = params.id if params.id else params.label.text | default('unknown') | slugify %}
|
|
{% set describedBy = params.describedBy if params.describedBy else "" %}
|
|
|
|
<div class="usa-form-group {%- if params.errorMessage %} usa-form-group--error{% endif %} {%- if params.formGroup.classes %} {{ params.formGroup.classes }}{% endif %}">
|
|
{{ usaLabel({
|
|
html: params.label.html,
|
|
text: params.label.text,
|
|
classes: params.label.classes,
|
|
isPageHeading: params.label.isPageHeading,
|
|
attributes: params.label.attributes,
|
|
for: inputId
|
|
}) | indent(2) | trim }}
|
|
|
|
{% if params.hint %}
|
|
{% set hintId = inputId + '-hint' %}
|
|
{% set describedBy = describedBy + ' ' + hintId if describedBy else hintId %}
|
|
{{ usaHint({
|
|
id: hintId,
|
|
classes: params.hint.classes,
|
|
attributes: params.hint.attributes,
|
|
html: params.hint.html,
|
|
text: params.hint.text
|
|
}) | indent(2) | trim }}
|
|
{% endif %}
|
|
|
|
{% if params.errorMessage %}
|
|
{% set errorId = inputId + '-error' %}
|
|
{% set describedBy = describedBy + ' ' + errorId if describedBy else errorId %}
|
|
{{ usaErrorMessage({
|
|
id: errorId,
|
|
classes: params.errorMessage.classes,
|
|
attributes: params.errorMessage.attributes,
|
|
html: params.errorMessage.html,
|
|
text: params.errorMessage.text,
|
|
visuallyHiddenText: params.errorMessage.visuallyHiddenText,
|
|
}) | indent(2) | trim }}
|
|
{% endif %}
|
|
|
|
<input
|
|
class="usa-input{%- if params.classes %} {{ params.classes }}{% endif %}{%- if params.errorMessage %} usa-input--error{% endif %}"
|
|
id="{{ inputId }}"
|
|
name="{{ params.name }}"
|
|
type="{{ params.type | default('text') }}"
|
|
{%- if params.value %} value="{{ params.value }}"{% endif %}
|
|
{%- if describedBy %} aria-describedby="{{ describedBy | trim }}"{% endif %}
|
|
{# Uncomment below if you want to use aria-labelledby too
|
|
aria-labelledby="{{ inputId }}-label" #}
|
|
{%- if params.autocomplete %} autocomplete="{{ params.autocomplete }}"{% endif %}
|
|
{%- if params.pattern %} pattern="{{ params.pattern }}"{% endif %}
|
|
{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor -%}
|
|
{%- if params.required %} required{% endif %}
|
|
/>
|
|
</div>
|