Progress bar with slider.

<script setup lang="ts">
import { Progress } from "@/components/ui/progress"
import { Slider } from "@/components/ui/slider"

const value = 50
</script>

<template>
  <div class="mx-auto flex w-full max-w-xs flex-col gap-6">
    <Progress :model-value="value" />
    <Slider :model-value="[value]" :min="0" :max="100" :step="1" />
  </div>
</template>