Rating (ALPHA)
Responsive Widgets are in alpha and available by invitation only on Business and Enterprise plans. Behavior and properties may change. To request access, open a support ticket and name the feature Responsive Widgets (ALPHA).
The Rating widget shows a row of stars or hearts. Users click them to give a rating. Use it to collect feedback, for example a product review, or turn on Read only to show an existing rating.
Widget type: WDS_RATE_WIDGET
Content properties
These properties appear in the Content tab of the property pane.
Data
Max rating number
Sets the highest rating, which is also the number of icons. It must be a whole number. Default: 5.
Default rating number
Sets the rating shown when the widget loads. It must be no more than Max rating. It can be a decimal, such as 2.5, only when Allow half is on. Default: 3.
Tooltips array<string>
Sets the tooltip text for each rating step, in order. Default: ["Terrible", "Bad", "Neutral", "Good", "Great"].
General
Allow half boolean
Lets users give half ratings, for example 3.5. Default: off.
Show count label boolean
Shows the current rating as text, for example "3 of 5." Default: off.
Visible boolean
Controls whether the widget is visible when the app runs. Default: on.
Disabled boolean
Stops users from changing the rating. Default: off.
Read only boolean
Shows the rating but stops users from changing it. Default: off.
Animate loading boolean
Shows a loading animation while the widget's data loads. Default: on.
Style properties
These properties appear in the Style tab of the property pane.
General
Size string
Sets the size of the icons. You cannot bind this property. Options: Small, Medium, Large. Default: Medium.
Icon string
Sets the icon used for each rating step. You cannot bind this property. Options: Star, Heart. Default: Star.
Reference properties
Reference properties let you read the widget's state in bindings and code, for example {{Rating1.isVisible}}. You cannot set them directly.
isVisible boolean
Shows whether the widget is visible.
Example:
{{Rating1.isVisible}}
maxCount number
Holds the value of Max rating.
Example:
{{Rating1.maxCount}}
value number
Holds the current rating.
Example:
{{Rating1.value}}
Methods
Methods let you change the widget's properties from code, for example in a JS Object.
setVisibility (param: boolean): Promise
Shows or hides the widget.
Example:
Rating1.setVisibility(true)
setDisabled (param: boolean): Promise
Turns the disabled state on or off.
Example:
Rating1.setDisabled(false)
setValue (param: number): Promise
Sets the rating.
Example:
Rating1.setValue(4)
Events
onChange
Runs when the user changes the rating.