{% set input_id = "inp-" ~ widget.path | replace('.','_') | replace('(','_') | replace(')','_') | replace(':','_') %}
<div class="rp-widget rp-string{% if widget.attrs.multiline %} rp-string-multiline{% endif %}" data-path="{{ widget.path }}" data-type="string"
     {% if widget.enable %}data-enable='{{ widget.enable }}'{% endif %}>
    <label class="rp-label" for="{{ input_id }}" data-rp-tooltip='{{ {"desc": widget.description} | tojson }}' title="{{ widget.description }}">
        {{ widget.label or widget.id }}
    </label>
    {% if widget.description %}
    <span id="{{ input_id }}-desc" class="rp-sr-only">{{ widget.description }}</span>
    {% endif %}
    {% if widget.attrs.multiline %}
    <textarea id="{{ input_id }}"
              class="rp-input rp-input-textarea"
              name="{{ widget.path }}"
              rows="{{ widget.attrs.height|default(5) }}"
              cols="{{ widget.attrs.width|default(40) }}"
              {% if widget.description %}aria-describedby="{{ input_id }}-desc"{% endif %}
              placeholder="{{ widget.hints }}">{{ widget.default }}</textarea>
    {% else %}
    <input type="text"
           id="{{ input_id }}"
           class="rp-input rp-input-string"
           name="{{ widget.path }}"
           value="{{ widget.default }}"
           {% if widget.description %}aria-describedby="{{ input_id }}-desc"{% endif %}
           placeholder="{{ widget.hints }}">
    {% endif %}
    {% if widget.hints %}
    <small class="rp-hints" aria-hidden="true">{{ widget.hints }}</small>
    {% endif %}
</div>
