{{#with profile_field_info}}
<form class="name-setting profile-field-form modal-form" id="edit-custom-profile-field-form-{{id}}" data-profile-field-id="{{id}}">
    <div class="input-group">
        <label for="id-custom-profile-field-name" class="modal-field-label">{{t "Label" }}</label>
        <input type="text" name="name" id="id-custom-profile-field-name" class="modal_text_input prop-element" value="{{ name }}" maxlength="40" data-setting-widget-type="string" />
    </div>
    <div class="input-group hint_change_container">
        <label for="id-custom-profile-field-hint" class="modal-field-label">{{t "Hint" }}</label>
        <input type="text" name="hint" id="id-custom-profile-field-hint" class="modal_text_input prop-element" value="{{ hint }}" maxlength="80" data-setting-widget-type="string" />
    </div>
    {{#if is_dropdown_field }}
    <div class="input-group prop-element profile-field-choices-wrapper" id="id-custom-profile-field-field-data" data-setting-widget-type="field-data-setting">
        <label for="profile_field_choices_edit" class="modal-field-label">{{t "Field choices" }}</label>
        <div class="profile-field-choices" name="profile_field_choices_edit">
            <div class="edit_profile_field_choices_container">
                {{#each choices}}
                    {{> profile_field_choice . }}
                {{/each}}
            </div>
        </div>
        {{> ../components/action_button
          label=(t "Alphabetize choices")
          custom_classes="alphabetize-choices-button"
          intent="neutral"
          variant="subtle"
          }}
    </div>
    {{else if is_external_account_field}}
    <div class="prop-element" id="id-custom-profile-field-field-data" data-setting-widget-type="field-data-setting">
        <div class="input-group profile_field_external_accounts_edit" >
            <label for="external_acc_field_type" class="modal-field-label">{{t "External account type" }}</label>
            <select name="external_acc_field_type" class="modal_select" disabled>
                {{#each (object_entries ../realm_default_external_accounts) as |entry|}}
                    <option value='{{entry.[0]}}'>{{entry.[1].text}}</option>
                {{/each}}
                <option value="custom">{{t 'Custom' }}</option>
            </select>
        </div>
        <div class="input-group custom_external_account_detail">
            <label for="url_pattern" class="modal-field-label">{{t "URL pattern" }}</label>
            <input type="url" class="modal_url_input" name="url_pattern" autocomplete="off" maxlength="80" />
        </div>
    </div>
    {{/if}}
    {{#if valid_to_display_in_summary}}
        <div class="input-group">
            <label class="checkbox edit_profile_field_display_label" for="id-custom-profile-field-display-in-profile-summary">
                <input class="edit_display_in_profile_summary prop-element" data-setting-widget-type="boolean" type="checkbox" id="id-custom-profile-field-display-in-profile-summary" name="display_in_profile_summary" data-setting-widget-type="boolean" {{#if display_in_profile_summary}} checked="checked" {{/if}}/>
                <span class="rendered-checkbox"></span>
                {{t 'Display on user card' }}
            </label>
        </div>
    {{/if}}
    <div class="input-group">
        <label class="checkbox" for="id-custom-profile-field-required">
            <input class="edit-required prop-element" type="checkbox" id="id-custom-profile-field-required" name="required" data-setting-widget-type="boolean" {{#if required}} checked="checked" {{/if}}/>
            <span class="rendered-checkbox"></span>
            {{t 'Required field' }}
        </label>
    </div>
    {{> settings_checkbox
      prefix="id-custom-profile-field-"
      setting_name="editable-by-user"
      is_checked= editable_by_user
      label=(t "Users can edit this field for their own account")
      }}
    {{#if valid_to_use_for_user_matching}}
    {{> settings_checkbox
      prefix="id-custom-profile-field-"
      setting_name="use_for_user_matching"
      is_checked= use_for_user_matching
      label=(t "Use in @-mention suggestions")
      }}
    {{/if}}
</form>
{{/with}}