@ui5/webcomponents-react/dist/webComponents/RatingIndicator/index.js

React Wrapper for UI5 Web Components and additional components

'use client';

import '@ui5/webcomponents/dist/RatingIndicator.js';
import { withWebComponent } from '@ui5/webcomponents-react-base';
/**
 * The Rating Indicator is used to display a specific number of icons that are used to rate an item.
 * Additionally, it is also used to display the average and overall ratings.
 *
 * ### Usage
 * The recommended number of icons is between 5 and 7.
 *
 * ### Responsive Behavior
 * You can change the size of the Rating Indicator by changing its `font-size` CSS property.
 *
 * Example: `<RatingIndicator style="font-size: 3rem;"></RatingIndicator>`
 *
 * ### Keyboard Handling
 * When the `RatingIndicator` is focused, the user can change the rating
 * with the following keyboard shortcuts:
 *
 * - [RIGHT/UP] - Increases the value of the rating by one step. If the highest value is reached, does nothing
 * - [LEFT/DOWN] - Decreases the value of the rating by one step. If the lowest value is reached, does nothing.
 * - [Home] - Sets the lowest value.
 * - [End] - Sets the highest value.
 * - [SPACE/ENTER/RETURN] - Increases the value of the rating by one step. If the highest value is reached, sets the rating to the lowest value.
 * - Any number - Changes value to the corresponding number. If typed number is larger than the number of values, sets the highest value.
 *
 *
 *
 * __Note:__ This is a UI5 Web Component! [RatingIndicator UI5 Web Component Documentation](https://ui5.github.io/webcomponents/components/RatingIndicator) | [Repository](https://github.com/UI5/webcomponents)
 */
const RatingIndicator = withWebComponent('ui5-rating-indicator', ['accessibleName', 'accessibleNameRef', 'max', 'ratedIcon', 'size', 'tooltip', 'unratedIcon', 'value'], ['disabled', 'readonly', 'required'], [], ['change']);
RatingIndicator.displayName = 'RatingIndicator';
export { RatingIndicator };