18F/identity-idp

<label class="usa-label" id="memorable-date-label-<%= unique_id %>">
    <%= label %>
</label>
<div id="validated-field-hint-<%= unique_id %>" class="usa-hint">
    <%= hint %>
</div>
  <%= content_tag :'lg-memorable-date', min:, max:, **tag_options do -%>
    <div class="usa-memorable-date">
      <%= content_tag(
            :script,
            error_messages.to_json,
            {
              type: 'application/json',
              class: 'memorable-date__error-strings',
            },
            false,
          ) %>
        <lg-validated-field error-id="validated-field-error-<%= unique_id %>">
          <%= f.simple_fields_for name do |p| %>
            <%= p.input(
                  :month,
                  pattern: '(1[0-2])|(0?[1-9])',
                  wrapper_html: {
                    aria: { labelledby: ["memorable-date-label-#{unique_id}"] },
                    class: 'usa-form-group usa-form-group--month margin-bottom-0',
                  },
                  label: t('components.memorable_date.month'),
                  label_html: {
                    class: 'usa-label',
                    id: "memorable-date-month-label-#{unique_id}",
                  },
                  input_html: {
                    type: 'text',
                    class: 'validated-field__input memorable-date__month',
                    minLength: 1,
                    maxLength: 2,
                    aria: {
                      invalid: has_errors?,
                      labelledby: [
                        "memorable-date-month-label-#{unique_id}",
                        "memorable-date-month-hint-#{unique_id}",
                      ],
                      describedby: ["validated-field-error-#{unique_id}"],
                    },
                    value: month,
                  },
                  error: false,
                  required:,
                ) %>
          <% end %>
          <span id=<%= "memorable-date-month-hint-#{unique_id}" %> class="display-none">
            <%= t('in_person_proofing.form.state_id.date_hint.month') %>
          </span>
          </lg-validated-field>
          <lg-validated-field error-id="validated-field-error-<%= unique_id %>">
          <%= f.simple_fields_for name do |p| %>
          <%= p.input(
                :day,
                pattern: '(3[01])|([12][0-9])|(0?[1-9])',
                wrapper_html: {
                  aria: { labelledby: ["memorable-date-label-#{unique_id}"] },
                  class: 'usa-form-group usa-form-group--day margin-bottom-0',
                },
                label: t('components.memorable_date.day'),
                label_html: {
                  class: 'usa-label',
                  id: "memorable-date-day-label-#{unique_id}",
                },
                input_html: {
                  type: 'text',
                  class: 'validated-field__input memorable-date__day',
                  minLength: 1,
                  maxLength: 2,
                  aria: {
                    invalid: has_errors?,
                    labelledby: [
                      "memorable-date-day-label-#{unique_id}",
                      "memorable-date-day-hint-#{unique_id}",
                    ],
                    describedby: ["validated-field-error-#{unique_id}"],

                  },
                  value: day,
                },
                error: false,
                required:,
              ) %>
          <% end %>
          <span id=<%= "memorable-date-day-hint-#{unique_id}" %> class="display-none">
            <%= t('in_person_proofing.form.state_id.date_hint.day') %>
          </span>
          </lg-validated-field>
          <lg-validated-field error-id="validated-field-error-<%= unique_id %>">
          <%= f.simple_fields_for name do |p| %>
          <%= p.input(
                :year,
                pattern: '\d{4}',
                wrapper_html: {
                  aria: { labelledby: ["memorable-date-label-#{unique_id}"] },
                  class: 'usa-form-group usa-form-group--year margin-bottom-0',
                },
                label: t('components.memorable_date.year'),
                label_html: {
                  class: 'usa-label',
                  id: "memorable-date-year-label-#{unique_id}",
                },
                input_html: {
                  type: 'text',
                  class: 'validated-field__input memorable-date__year',
                  minLength: 4,
                  maxLength: 4,
                  aria: {
                    invalid: has_errors?,
                    labelledby: [
                      "memorable-date-year-label-#{unique_id}",
                      "memorable-date-year-hint-#{unique_id}",
                    ],
                    describedby: ["validated-field-error-#{unique_id}"],
                  },
                  value: year,
                },
                error: false,
                required:,
              ) %>
          <% end %>
          <span id=<%= "memorable-date-year-hint-#{unique_id}" %> class="display-none">
            <%= t('in_person_proofing.form.state_id.date_hint.year') %>
          </span>
        </lg-validated-field>
    </div>
  <% end -%>
<div id="validated-field-error-<%= unique_id %>" class="usa-error-message <%= 'display-none' unless has_errors? %>">
  <% if has_errors? %>
    <%= error_msg %>
  <% end %>
</div>