Components / Rating
Rating
Star rating input with keyboard navigation (arrow keys), half-star precision, hover preview, and clear-on-same-value.
forms v0.7.0
Playground
Examples
Basic
<cg-rating value="4"></cg-rating>Half-star precision
<cg-rating value="3.5" precision="0.5"></cg-rating>Large readonly
<cg-rating value="5" size="lg" readonly></cg-rating>Import
import { CgRating } from '@cognivo/components';// Or tree-shake: import '@cognivo/components/cg-rating';Per-component imports ship only that component (~8 kB gzip).
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
value | number | 0 | Current rating |
max | number | 5 | Maximum stars |
precision | 0.5 | 1 | 1 | Step precision |
size | "sm" | "md" | "lg" | "md" | Star size |
readonly | boolean | false | Read-only mode |
disabled | boolean | false | Disabled state |
Events
| Event | Detail | Description |
|---|---|---|
cg-rating-change | {value: number} | Rating changed |