<div class="yoro-widget"
     data-domain="{{ widget.domain }}"
     data-precision="{{ widget.precision }}"
     data-tile-url="{{ widget.tile_url }}"
     data-tile-attribution="{{ widget.tile_attribution }}"
     id="yoro-widget-{{ widget.attrs.id }}">

    <div class="yoro-widget-header">
        <input type="text"
               name="{{ widget.name }}"
               id="{{ widget.attrs.id }}"
               value="{{ widget.value|default_if_none:'' }}"
               class="yoro-code-input"
               placeholder="{{ widget.domain }}-XXXXX"
               autocomplete="off"
               spellcheck="false"
               {% for attr, val in widget.attrs.items %}
                   {% if attr != "id" and attr != "class" %}{{ attr }}="{{ val }}"{% endif %}
               {% endfor %} />
        <span class="yoro-info"></span>
        <span class="yoro-coords"></span>
    </div>

    <div class="yoro-map" style="height: {{ widget.map_height }}px;"></div>
</div>
