Reviews Summary

Reviews: average rating, filterable histogram, sorting and helpful votes. Pro · Shop and payments › Catalog

Ratings overview and review list: average and histogram (bars filter the list), sort, verified-only filter, helpful votes and pagination.

Installation

npx valyro-cli@latest login
npx valyro-cli@latest add reviews-summary

npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { ReviewsSummary } from 'valyro-ui-pro';

Props

Prop	Type	Default
`reviews` *	`ReviewData[]`		Reviews to list; sorting, the rating and verified filters and paging are applied to them here.
`stats`	`ReviewStats`		Totals from the server when `reviews` is only part of them; computed from `reviews` otherwise.
`title`	`ReactNode`		Heading; `null` hides it. Default "Customer reviews".
`sort`	`'recent' \| 'helpful' \| 'highest' \| 'lowest'`		Controlled `sort`; use with `onSortChange`.
`defaultSort`	`'recent' \| 'helpful' \| 'highest' \| 'lowest'`	`'recent'`	Initial `sort` when uncontrolled.
`onSortChange`	`(sort: ReviewSort) => void`		Called with the new `sort` when it changes.
`rating`	`number \| null`		Whole-star rating the list is filtered to (set by the histogram), or null.
`defaultRating`	`number \| null`	`null`	Initial `rating` when uncontrolled.
`onRatingChange`	`(rating: number \| null) => void`		Called with the new `rating` when it changes.
`verifiedOnly`	`boolean`		Controlled `verifiedOnly`; use with `onVerifiedOnlyChange`.
`defaultVerifiedOnly`	`boolean`	`false`	Initial `verifiedOnly` when uncontrolled.
`onVerifiedOnlyChange`	`(verifiedOnly: boolean) => void`		Called with the new `verifiedOnly` when it changes.
`votes`	`Record<string, ReviewVote>`		The viewer's votes by review id.
`defaultVotes`	`Record<string, ReviewVote>`	`{}`	Initial `votes` when uncontrolled.
`onVotesChange`	`(votes: Record<string, ReviewVote>) => void`		Called with the new `votes` when it changes.
`pageSize`	`number`	`5`	Reviews per page. Default 5.
`onWriteReview`	`() => void`		Shows a "Write a review" button.
`headingLevel`	`2 \| 3 \| 4`	`2`	Heading level of the title; review titles use the next level. Default 2.
`locale`	`string`		BCP 47 locale for numbers and dates; defaults to the ThemeProvider's, then the browser's.
`labels`	`Partial<ReviewsSummaryLabels>`		Overrides for the built-in English text; keys left out keep their defaults.

Related components

Product Card — Product card
Product Grid — Product catalog
Product Filters — Catalog filters
Product Spotlight — Featured product: tagged photo, price, rating and actions
Guided Product Finder — Product finder wizard: branching questions and why a product fits
Location Card — Store location: distance, opening hours, pickup options and ordering
Shopping Cart Drawer — Slide-out cart
Checkout Summary — Order summary at checkout
Checkout Form — Checkout: shipping, address type, payment and field validation
Order Tracking — Order tracking: stages, carrier, tracking number and history
Invoice — Printable invoice: line items, taxes, discounts and totals in any currency
Credit Card — Bank card: gradient or two-tone, network detected from the number, contactless

Previous: Product Spotlight · Next: Guided Product Finder · All Shop and payments