SProgressBar

Полоска прогресса.

В чем отличие от аналогов?

В отличие от популярных библиотек компонентов для Vue3:

1. Есть лейбл-пояснение, формирующий ожидание пользователей, упрощенный до одного атрибута.

Базовый пример

Обновляем проект...

50%

<SProgressBar :percentage="readyPercentage">Обновляем проект...</SProgressBar>

<template>
    <SProgressBar :percentage="readyPercentage">Обновляем проект...</SProgressBar>
</template>
<script setup>
import { ref } from 'vue'
import { SProgressBar } from 'startup-ui'

const readyPercentage = ref(50)
</script>

Интерфейс компонента

Свойства (Props)

Название	Тип	По умолчанию	Описание
percentage	number	undefined	Обязательный. Текущее значение прогресса от 0 до 100.

Слоты (Slots)

Название	Описание
default	Текстовая метка, отображаемая рядом с полосой прогресса (например, «Обновляем проект...»).