Exact exports, props, slots, hooks, and runtime behavior belong to SDK package reference. Examples are guidance unless explicitly marked copy-paste-safe.

Review component intent and composition guidance before wiring this component into an app. Then use the live playground to confirm the rendered behavior.

Playground

• Import path: @enadhq/enad-react-sdk/client/storefront.
• Live playground: /components/commerce/review-summary.

When to use it

Use ReviewSummary near the top of a review section so visitors can quickly understand overall sentiment and the spread of scores.

It is especially useful when the next interaction is either reading reviews or filtering by star rating.

Composition notes

The required inputs are the average score, total count, and the star distribution array. Add onBarClick only when clicking a distribution row has a clear result in the surrounding page.

Behavior and theming guidance

Keep the summary close to the review list it controls or explains. If the bars are interactive, make the follow-up behavior obvious so the visitor knows clicking will filter or jump.

A review summary works best as a quick trust signal, so avoid overloading it with extra promotional messaging.

Contract scope

• Use SDK package reference for exact props, exports, slots, hooks, and runtime behavior.
• Public import: @enadhq/enad-react-sdk/client/storefront.
• Playground route: /sandbox?component=ReviewSummary.
• Copy/paste scope: guidance-only. Treat examples as guidance until checked against SDK package reference.

Implementation notes