Feedback Overview summarizes collected feedback reactions with configurable label placement.
Loading demo: feedback-overview-real-world
npx sdaia-ui@latest add feedback-overview
import { FeedbackOverview } from "@/components/ui/feedback-overview"<FeedbackOverview labelPlacement="top" />The default feedback overview with top label placement.
Loading demo: feedback-overview-default
Feedback overview with the label displayed inline beside the score.
Loading demo: feedback-overview-inline
Feedback overview with the label positioned above the score.
Loading demo: feedback-overview-top
Feedback overview with the label positioned below the score.
Loading demo: feedback-overview-bottom
Props for the Feedback Overview component. Extends FeedbackProps.
Prop | Type | Default | Required |
|---|---|---|---|
label | ReactNode | - | optional |
labelPlacement | 'top' | 'inline' | 'bottom' | 'top' | optional |
type | 'emoji' | 'thumb' | thumb | optional |
size | 'sm' | 'md' | 'lg' | 'md' | optional |
defaultValue | 'like' | 'neutral' | 'dislike' | null | - | optional |
onValueChange | (value: 'like' | 'neutral' | 'dislike' | null) => void | - | optional |
disabled | boolean | false | optional |
dir | 'ltr' | 'rtl' | ltr | optional |