{# @description A native progress bar. value must be a number from 0 to max — never render it from unvalidated user input. Leave value empty for daisyUI's indeterminate animation. Type value="40" label="Upload progress" in the attributes field to give this preview a value and a name. See the mockup.phone entry for progress bars at several values and colours plus one indeterminate. #}
{# @prop value:text | description:"Current value, from 0 to max. Leave empty for the indeterminate animation." #}
{# @prop max:number | default:"100" | description:"Maximum value." #}
{# @prop variant:select['neutral','primary','secondary','accent','info','success','warning','error'] | description:"Colour variant." #}
{# @prop label:text | description:"Accessible name. Always give one." #}
{# @prop class:text | description:"Extra classes added to the progress bar." #}
{% load daisy_cotton %}
<c-vars value="" max="100" variant="" label="" class="" />
{# djlint:off #}
<progress class="progress {% variation variant "progress" "neutral,primary,secondary,accent,info,success,warning,error" %} {{ class }}"{% if value is not None and value != "" %} value="{{ value }}"{% endif %} max="{{ max }}"{% if label %} aria-label="{{ label }}"{% endif %} {{ attrs }}></progress>
{# djlint:on #}