Progress
Use to display the length of time a process will take, visualize a percentage value (determinate) or to represent an unspecified wait time (indeterminate).
Determinate state can be used to display how much of a process has been completed. For example, in a multi-step form.
<script setup lang="ts">import { VProgress } from '@vonage/vivid-api-vue';</script><template> <VProgress :min="1" :max="5" :value="2" aria-label="Step 2 of 5" /></template><vwc-progress min="1" max="5" value="2" aria-label="Step 2 of 5"></vwc-progress>Indeterminate state can be used to indicated that something is loading.
<script setup lang="ts"> import {VProgress} from '@vonage/vivid-api-vue';</script><template> <VProgress aria-label="Loading search results" /></template><vwc-progress aria-label="Loading search results"></vwc-progress>