메인 콘텐츠로 건너뛰기
Header
진행 또는 카운트다운을 나타내며 오른쪽에서 왼쪽으로 이동합니다.
  • Usage
  • Props
import { ProgressBar } from "twenty-ui/feedback";

export const MyComponent = () => {
  return (
    <ProgressBar
      duration={6000}
      delay={0}
      easing="easeInOut"
      barHeight={10}
      barColor="#4bb543"
      autoStart={true}
    />
  );
};

원형 진행 표시줄

작업의 진행 상황을 나타내며, 로딩 화면이나 진행 중인 프로세스를 사용자에게 전달하고자 할 때 자주 사용됩니다.
  • Usage
  • Props
import { CircularProgressBar } from "@/ui/feedback/progress-bar/components/CircularProgressBar";

export const MyComponent = () => {
  return <CircularProgressBar size={80} barWidth={6} barColor="green" />;
};