18F/identity-idp

View on GitHub
app/components/phone_input_component.html.erb

Summary

Maintainability
Test Coverage
<%= content_tag(
      'lg-phone-input',
      class: tag_options[:class],
      data: {
        delivery_methods:,
        translated_country_code_names:,
      },
    ) do %>
  <%= content_tag(
        :script,
        strings.to_json,
        {
          type: 'application/json',
          class: 'phone-input__strings',
        },
        false,
      ) %>
  <div class="phone-input__international-code-wrapper">
    <%= f.label(
          :international_code,
          class: 'usa-label',
        ) { t('components.phone_input.country_code_label') } %>
    <%= f.input(
          :international_code,
          collection: international_phone_codes,
          include_blank: false,
          label: false,
          input_html: {
            class: 'phone-input__international-code',
            data: { countries: supported_country_codes },
          },
        ) %>
  </div>
  <%= f.label(
        :phone,
        class: 'usa-label',
      ) { t('two_factor_authentication.phone_label') } %>
  <%= render ValidatedFieldComponent.new(
        form: f,
        name: :phone,
        error_messages: {
          valueMissing: t('errors.messages.phone_required'),
        },
        as: :tel,
        required:,
        label: false,
        wrapper_html: {
          class: 'margin-bottom-0',
        },
        input_html: {
          class: 'phone-input__number',
        },
      ) %>
<% end %>
<%= stylesheet_link_tag 'intlTelInput' %>