StarRating

Status: Stable

Latest released: 2018

Current version: v3.7.1

Storybook
GitHub

Displays a visual rating of a product, including a NerdWallet-specific rating. StarRatingInput allows users to interactively rate.

Variants

Default

NerdWallet

Interactive

Select your rating

Disabled

It’s OK

Development

import StarRating from '@nerdwallet/react-star-rating';
<StarRating />;

Props

<StarRating>

className

string

Class on the outer container element.

Default

null

label

string

Label for the stars.

Default

null

maxRating

number

Maximum star rating.

Default

5

nerdwallet

boolean

Whether this is a "NerdWallet" rating, making the stars green.

Default

false

rating

number

Current star rating.

Default

0

ratingLabels

Object | boolean

Object mapping each rating value to its label or a flag indicating to hide the rating labels.

{
[key]: string
} | bool

Default

DEFAULT_RATING_LABELS