RatingProps
Properties
Section titled “Properties”allowClear?
Section titled “allowClear?”allowClear?: boolean;Re-selecting the current value clears to 0.
Default
Section titled “Default”true when interactivearia-describedby?
Section titled “aria-describedby?”"aria-describedby"?: string;ids of external error/help text.
className?
Section titled “className?”className?: string;defaultValue?
Section titled “defaultValue?”defaultValue?: number;Uncontrolled initial score. Ignored when value is provided.
dir?: "ltr" | "rtl";Flips the fill origin.
Default
Section titled “Default”inherited from the DOMdisabled?
Section titled “disabled?”disabled?: boolean;emptyIcon?
Section titled “emptyIcon?”emptyIcon?: RatingIcon;Empty/track icon.
Default
Section titled “Default”same as icon, dimmed via --rx-rating-empty-filter
formatLabel?
Section titled “formatLabel?”formatLabel?: (value, max) => string;Formats the default accessible name.
Parameters
Section titled “Parameters”| Parameter | Type |
|---|---|
value | number |
max | number |
Returns
Section titled “Returns”string
Default
Section titled “Default”${value} out of ${max}
formatOptionLabel?
Section titled “formatOptionLabel?”formatOptionLabel?: (value, max) => string;Accessible name for one option, e.g. for aria-label on each radio.
Parameters
Section titled “Parameters”| Parameter | Type |
|---|---|
value | number |
max | number |
Returns
Section titled “Returns”string
icon?: RatingIcon;Filled icon. A function receives per-icon state.
Default
Section titled “Default”a built-in starid?: string;Base id; option inputs derive ${id}-1, ${id}-2, …
invalid?
Section titled “invalid?”invalid?: boolean;Sets aria-invalid and data-invalid on the group.
label?
Section titled “label?”label?: string;Accessible name for the group.
max?: number;Number of icons rendered. Positive integer.
Default
Section titled “Default”5name?: string;Radio group name; also emits a value readable by a native <form>.
onBlur?
Section titled “onBlur?”onBlur?: (event) => void;Fires when focus leaves the whole group, not when moving between icons.
Parameters
Section titled “Parameters”| Parameter | Type |
|---|---|
event | FocusEvent<HTMLElement> |
Returns
Section titled “Returns”void
onChange?
Section titled “onChange?”onChange?: (value) => void;Providing this makes the component interactive.
Parameters
Section titled “Parameters”| Parameter | Type |
|---|---|
value | number |
Returns
Section titled “Returns”void
onHoverChange?
Section titled “onHoverChange?”onHoverChange?: (value) => void;Hover/keyboard preview; null when the preview ends.
Parameters
Section titled “Parameters”| Parameter | Type |
|---|---|
value | number | null |
Returns
Section titled “Returns”void
onWarn?
Section titled “onWarn?”onWarn?: (warning) => void;Called in development whenever a prop is coerced to keep the component
functional — see RatingWarning. The coerced result still renders,
so this never changes what the user sees; it only surfaces the mistake.
When omitted, the same warnings go to console.warn. The entire path is
stripped from production builds, so this is a no-op there.
Parameters
Section titled “Parameters”| Parameter | Type |
|---|---|
warning | RatingWarning |
Returns
Section titled “Returns”void
precision?
Section titled “precision?”precision?: number;Quantization grid: 1 = whole icons, 0.5 = halves, 0 = continuous.
Default
Section titled “Default”0readOnly?
Section titled “readOnly?”readOnly?: boolean;Force read-only even when onChange is present.
Default
Section titled “Default”!onChange
required?
Section titled “required?”required?: boolean;rounding?
Section titled “rounding?”rounding?: RatingRounding;Direction of the snap onto the grid.
Default
Section titled “Default”'nearest'style?
Section titled “style?”style?: CSSProperties;value?
Section titled “value?”value?: number;Controlled score. Clamped to [0, max]; NaN/Infinity become 0.