{% assign size = include['size'] | default: 'sm' %}
{% assign color = include.color | default: 'blue' %}

<div{% if include.class %} class="{{ include.class }}"{% endif %}>
   <div class="d-flex mb-1 align-items-center lh-1">
      <div class="fs-5 fw-semibold m-0">{{ include.label | default: 'Label' }}</div>
      {% if include.description %}
         <div class="fs-6 text-secondary ms-2">{{ include.description }}</div>
      {% endif %}
      <span class="ms-auto fs-6 strong">{{ include.value }}%</span>
   </div>
   {% include "ui/progress.html" size=size value=include.value color=color %}
</div>
