## Progreso Progreso es usado para mostrar el estado de la operación actual e informar al usuario acerca de ésta. ### Barra de progreso lineal (porcentage externo) :::demo Usa el atributo `percentage` para asignar el porcentage. Este es **requerido** y tiene que ser un valor entre `0-100`. ```html ``` ::: ### Barra de progreso lineal (porcentage interno) En este caso el porcentage no toma espacio adicional. :::demo El atributo `stroke-width` decide el ancho de la barra de progreso, y usa el atributo `text-inside` para poner la descripción dentro de la misma. ```html ``` ::: ### Barra de progreso circular :::demo Puede asignar el atributo `type` como `circle` para usar la barra circular de progreso, y usar el atributo `width` para cambiar el tamaño del círculo. ```html Done ``` ::: ### Atributos | Atributo | Descripción | Tipo | Valores aceptado | Por defecto | | ------------ | ---------------------------------------- | ------- | ----------------- | ----------- | | percentage | porcentaje, requerido | number | 0-100 | 0 | | type | tipo de barra de progreso | string | line/circle | line | | stroke-width | ancho de la barra de progreso | number | — | 6 | | text-inside | mostrar el porcentaje dentro de la barra de progreso, solo funciona cuando `type` es 'line' | boolean | — | false | | status | estado actual de la barra de progreso | string | success/exception/text | — | | color | color de fondo de la barra de progreso. Sobreescribe la propiedad `status` | string | — | — | | width | ancho del canvas que contiene la barra de progreso circula | number | — | 126 | | show-text | mostrar porcentaje | boolean | — | true |