{% extends 'forms/base_widget.html' %}

{% block html %}
    <div>
        <input type="hidden" name="{{ field.name }}" id="{{ field.id }}-data"
               {% if field.data is not none %}value="{{ field.data }}"{% endif %}
               {{ input_args | html_params }}>
        <span id="{{ field.id }}"></span>
    </div>
{% endblock %}

{% block javascript %}
    <script>
        setupSUIColorPickerWidget({
            fieldId: {{ field.id | tojson }},
            required: {{ input_args.required | default(false) | tojson }},
            disabled: {{ input_args.disabled | default(false) | tojson }},
        });
    </script>
{% endblock %}
