ProgressBar: Add Buffer mode (or Multiple Progress Bars)

[J43fura]

Requested Feature

A "buffer" mode to the ProgressBar component to display two layers of progress: the primary progress and a secondary buffer progress, enhancing feedback for operations such as loading, streaming, or preloading content.

Description

The buffer mode is essential for scenarios requiring a visual representation of both current progress and the extent of additional processing or preloading, similar to how YouTube indicates video loading.
This mode adds a secondary progress bar behind the primary one but different color/opacity to distinguish the buffered amount from the actual progress.

Proposed API Changes

• New Prop: mode="buffer"
• Additional Prop: bufferValue: Number representing the secondary progress.
• New ProgressBar Pass Through option: buffer

E.g.:
<ProgressBar mode="buffer" :value="30" pt:value:class="bg-red-500" :bufferValue="60" pt:buffer:class="bg-red-200" />

Multiple Progress Bars

An even better feature would be "multiple progress bars" (1+) instead of just "buffer" (2) E.g. Boostrap

[tugcekucukoglu]

We need more demand for buffer mode. And also I want to suggest using MeterGroup for Multiple Progress Bars.

[jbland-riparian]

I need to have multiple bars like above as we are migrating from bootstrap-vue to PrimeVue. BUT I am using PrimeVue 2. Do you have a solution for multiple bars like above for PrimeVue 2