ProgressRing

ProgressRing displays a fraction from 0 to 1, or a dashed ring when the target is unknown. It can contain any React content and can optionally respond to presses.

import { ProgressRing } from "@ovok/native/progress-ring";
import { Text } from "react-native";

<ProgressRing progress={0.65} accessibilityLabel="Daily goal" size={64}>
  <Text>65%</Text>
</ProgressRing>

<ProgressRing accessibilityLabel="Daily goal unavailable" />

When progress is omitted or null, the ring uses a dashed indicator and does not announce an empty value. Finite values are clamped to 0–1. Set onPress to make the ring a button; otherwise it exposes progress-bar accessibility semantics. Provide an accessibilityLabel appropriate to the host app's language and context.

Prop	Type	Default	Description
progress	number | null	unknown	Fraction from 0 to 1; omitted or null means unknown.
children	ReactNode	-	Optional content centered inside the ring.
size	number	48	Width and height in points.
strokeWidth	number	4	Ring thickness in points.
color	string	theme primary	Progress indicator color.
trackColor	string	theme gray 300	Background ring color.
onPress	PressableProps['onPress']	-	Makes the ring tappable.

Other supported accessibility and pressable props are forwarded to the root component. Render it below the SDK ThemeProvider so default colors come from the active theme.