Rating

@spartanfx/react v1.0.5

---

@spartanfx/react / Rating

Variable: Rating

const Rating: React.FC<IRatingProps>

A controlled Rating component for selecting or displaying ratings.

Supports star, circle, or custom rating elements with half-fill display capability. Includes full theming support for light/dark modes and customization via tokens.

Example

// Interactive controlled rating
const [rating, setRating] = React.useState(3);
<Rating value={rating} onChange={setRating} />

// Read-only display (e.g., showing average rating)
<Rating value={3.5} onChange={() => {}} readOnly />

// With label and custom colors
<Rating
  value={rating}
  onChange={setRating}
  label="Rate this product"
  fillColor="#FF6B6B"
/>

// Circle variant with large size
<Rating
  value={rating}
  onChange={setRating}
  variant={RatingVariant.Circle}
  size={RatingSize.Large}
  appearanceMode={AppearanceMode.dark}
/>