Progress ring

Playground

'use client';
import { ProgressRing } from '@mbsw/ui';

export default function Demo() {
  const settings = {
    "value": 64
  };
  return (
    <ProgressRing aria-label={"작업 진행률"} value={settings.value} />
  );
}

Properties

Value64

Usage

value에 0부터 100까지의 진행률을 지정합니다. 진행률을 알 수 없는 대기 상태에는 Spinner를 사용합니다.

'use client';
import { ProgressRing } from '@mbsw/ui';

export default function Example() {
  return <ProgressRing aria-label={"작업 진행률"} value={64} />;
}

Playground의 Code 탭에서 현재 설정과 동작이 포함된 예제 전체를 복사할 수 있습니다. 공통 CSS 설치는 설치하기를 확인하세요.

Composition

ProgressRing