Progress ring

Playground

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

export default function Demo() {
  const settings = {
    "value": 64
  };
  return (
    <ProgressRing aria-label={"Task progress"} value={settings.value} />
  );
}

Properties

Value64

Usage

Set value to a number from 0 to 100. Use Spinner when you do not know how much work remains.

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

export default function Example() {
  return <ProgressRing aria-label={"Task progress"} value={64} />;
}

The Playground Code tab includes the full example with your current settings. See Installation for the CSS imports.

Composition

ProgressRing