{% load i18n %}
<div id="textbox_{{ id }}" class="capa_inputtype textbox cminput">
    {% if response_data.label %}
        <label class="problem-group-label" for="cm-textarea-{{ id }}">{{ response_data.label }}</label>
    {% else %}
        <label class="sr problem-group-label" for="cm-textarea-{{ id }}">
            {% trans "Code Editor" as editor_label %}{{ editor_label|force_escape }}
        </label>
    {% endif %}
    <textarea rows="{{ rows }}"
              cols="{{ cols }}"
              name="input_{{ id }}"
              aria-label="{{ aria_label }}"
              aria-describedby="answer_{{ id }}"
              id="input_{{ id }}"
              tabindex="0"
              data-mode="{{ mode }}"
              data-tabsize="{{ tabsize }}"
              {% if linenumbers %} data-linenums="true" {% endif %}
              {% if hidden %} style="display:none;" {% endif %}>{{ value }}</textarea>
    <span class="cm-editor-exit-message capa-message"
          id="cm-editor-exit-message-{{ id }}">{{ code_mirror_exit_message }}</span>
    <div class="grader-status" tabindex="-1">
        {% include "status_span.html" with status=status status_id=id %}
        {% if status == 'queued' %}<span style="display:none;" class="xqueue" id="{{ id }}">{{ queue_len }}</span>{% endif %}
        {% if hidden %}<div style="display:none;" name="{{ hidden }}" inputid="input_{{ id }}" />{% endif %}
        <p class="debug">{{ status.display_name }}</p>
    </div>
    <span id="answer_{{ id }}"></span>
    <div class="external-grader-message">{{ msg|safe }}</div>
</div>