salla-reviews-summary
Rating summary for a product: the average rating, the review count, a bar per star level (5 to 1) with its percentage, the review factor tags and the "recommended" percentage.
Rating summary for a product: the average rating, the review count, a bar per star level (5 to 1) with its percentage, the review factor tags and the "recommended" percentage. Use it above the product reviews list.
What is shown follows the store rating settings: if both show_rating_summary and show_recommendation are off, or the
product has no reviews, nothing is rendered. If only recommendation is on, only the recommended percentage is shown.
The data is loaded from the store API, so there is no need to pass ratings in.
Use it
In HTML or JSX, use the tag <salla-reviews-summary> with the Attribute names below. In React, the wrapper takes the Property names (camelCase).
import { SallaReviewsSummary } from '@salla.sa/twilight-components-react/reviews-summary';Client-only. On the server this wrapper renders a placeholder (a skeleton, or nothing), and the real component mounts in the browser. Do not rely on it for content that search engines must see.
Example
import { SallaReviewsSummary } from '@salla.sa/twilight-components-react/reviews-summary';
export function Example() {
return (
<SallaReviewsSummary itemId={123456} />
);
}Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
itemId (required) | item-id | The ID of the product to load the summary for. Required: without it an error is logged and nothing is rendered. | number |
Related
Renders: <salla-progress-bar>, <salla-rating-stars>, <salla-review-factors-tags>.
Used inside: <salla-comments>.