Progress circle

import { ProgressCircle } from "@/components/ui/progress-circle";

export default function Example() {
  return <ProgressCircle value={72} aria-label="Daily goal" />;
}

#Installation

$ npx uix-ui@latest add progress-circle

This copies the file into components/ui/progress-circle.tsx in your project. npx shadcn@latest add @uix/progress-circle works too.

#Usage

import { ProgressCircle } from "@/components/ui/progress-circle";

<ProgressCircle value={72} aria-label="Daily goal" />

#Props

Everything else is passed to the root element, so className, aria-* and event handlers work as usual.

#Dependencies

Installed for you by the CLI.

• class-variance-authority
• clsx
• tailwind-merge

• lib/utils.ts