Reshaped Progress bar

import { Reshaped, View } from "reshaped/bundle";
import ProgressBar from "@/components/ui/reshaped-progress-bar";

export default function Demo() {
  return (
    <Reshaped theme="slate">
      <div style={{ maxWidth: 400, width: "100%", margin: "0 auto", padding: 24 }}>
        <View gap={3}>
          <ProgressBar value={50} color="primary" />
          <ProgressBar value={50} color="critical" />
          <ProgressBar value={50} color="warning" />
          <ProgressBar value={50} color="positive" />
        </View>
      </div>
    </Reshaped>
  );
}