Progress

작업 완료 진행률을 표시하는 인디케이터입니다.

examples/krds/progress-demo.tsx

"use client"

import * as React from "react"

설치

pnpm dlx shadcn@latest add https://krdscn.gwlee.kr/r/progress.json

import { Progress } from "@/components/ui/progress"

<Progress value={33} />

Use a Field component to add a label to the progress bar.

examples/krds/progress-label.tsx

import { Field, FieldLabel } from "@/components/ui/field"
import { Progress } from "@/components/ui/progress"

A progress bar that can be controlled by a slider.

examples/krds/progress-controlled.tsx

"use client"

import * as React from "react"

RTL 지원을 활성화하려면 RTL 설정 가이드를 참고하세요.

examples/krds/progress-rtl.tsx

"use client"

import * as React from "react"

Radix UI Progress 문서를 참고하세요.