{# @description A figure that counts up from nothing the first time it scrolls into view, and keeps its number after that. The finished number is simply there where the browser cannot do it. Put it in a plain grid or a stats band: inside a daisyUI stats row it counts once, as the page loads. #}
{# @prop title:text | description:"What the figure counts" #}
{# @prop to:number | default:"0" | description:"The whole number it counts up to. It is written without separators, so for a large figure count the leading part and put the rest in suffix: to 12 with a suffix of k." #}
{# @prop prefix:text | description:"Written before the number: a currency sign" #}
{# @prop suffix:text | description:"Written after the number: %, k, +, ms" #}
{# @prop time:number | default:"2" | description:"How long the count takes, in seconds" #}
{# @prop desc:text | description:"A line under the figure" #}
{# @prop icon:text | description:"An icon beside the figure, by the name the project's icon component knows it by. Left out, there is no icon." #}
{# @prop class:text | description:"Extra classes on the stat" #}
{# @slot:figure 
— Beside the figure in place of the icon, for anything that is not one: a picture, a logo, an avatar. #}
{% comment %}
Built on daisy-cotton's stat. The scroll position only starts the count: it
runs on the clock from there, so the number never rests on a figure that is
not true. It runs once. Out of view, the way back to nought waits for ever,
so the figure keeps its number. "In view" is measured against the nearest
scrolling box, and a daisyUI stats row is one. A screen reader is given the
finished number.
{% endcomment %}
{% if icon or figure %}{% if figure %}{{ figure }}{% else %}{% endif %}{% endif %}
{% if title %}{{ title }}{% endif %}
{{ prefix }}{{ to|floatformat:'0u'|default:'0' }}{{ suffix }}
{% if desc %}{{ desc }}{% endif %}