1 | import * as React from 'react';
|
2 | import { StandardProps } from '@material-ui/core';
|
3 |
|
4 | export interface IconContainerProps extends React.HTMLAttributes<HTMLSpanElement> {
|
5 | value: number;
|
6 | }
|
7 |
|
8 | export interface RatingProps
|
9 | extends StandardProps<
|
10 | React.HTMLAttributes<HTMLSpanElement>,
|
11 | RatingClassKey,
|
12 | 'children' | 'onChange'
|
13 | > {
|
14 | /**
|
15 | * The default value. Use when the component is not controlled.
|
16 | */
|
17 | defaultValue?: number;
|
18 | /**
|
19 | * If `true`, the rating will be disabled.
|
20 | */
|
21 | disabled?: boolean;
|
22 | /**
|
23 | * The icon to display when empty.
|
24 | */
|
25 | emptyIcon?: React.ReactNode;
|
26 | /**
|
27 | * The label read when the rating input is empty.
|
28 | */
|
29 | emptyLabelText?: React.ReactNode;
|
30 | /**
|
31 | * Accepts a function which returns a string value that provides a user-friendly name for the current value of the rating.
|
32 | *
|
33 | * For localization purposes, you can use the provided [translations](/guides/localization/).
|
34 | *
|
35 | * @param {number} value The rating label's value to format.
|
36 | * @returns {string}
|
37 | */
|
38 | getLabelText?: (value: number) => string;
|
39 | /**
|
40 | * The icon to display.
|
41 | */
|
42 | icon?: React.ReactNode;
|
43 | /**
|
44 | * The component containing the icon.
|
45 | */
|
46 | IconContainerComponent?: React.ElementType<IconContainerProps>;
|
47 | /**
|
48 | * Maximum rating.
|
49 | */
|
50 | max?: number;
|
51 | /**
|
52 | * The name attribute of the radio `input` elements.
|
53 | * If `readOnly` is false, the prop is required,
|
54 | * this input name`should be unique within the parent form.
|
55 | */
|
56 | name?: string;
|
57 | /**
|
58 | * Callback fired when the value changes.
|
59 | *
|
60 | * @param {object} event The event source of the callback.
|
61 | * @param {number} value The new value.
|
62 | */
|
63 | onChange?: (event: React.ChangeEvent<{}>, value: number | null) => void;
|
64 | /**
|
65 | * Callback function that is fired when the hover state changes.
|
66 | *
|
67 | * @param {object} event The event source of the callback.
|
68 | * @param {number} value The new value.
|
69 | */
|
70 | onChangeActive?: (event: React.ChangeEvent<{}>, value: number) => void;
|
71 | /**
|
72 | * The minimum increment value change allowed.
|
73 | */
|
74 | precision?: number;
|
75 | /**
|
76 | * Removes all hover effects and pointer events.
|
77 | */
|
78 | readOnly?: boolean;
|
79 | /**
|
80 | * The size of the rating.
|
81 | */
|
82 | size?: 'small' | 'medium' | 'large';
|
83 | /**
|
84 | * The rating value.
|
85 | */
|
86 | value?: number | null;
|
87 | }
|
88 |
|
89 | export type RatingClassKey =
|
90 | | 'root'
|
91 | | 'sizeSmall'
|
92 | | 'sizeLarge'
|
93 | | 'readOnly'
|
94 | | 'disabled'
|
95 | | 'focusVisible'
|
96 | | 'visuallyhidden'
|
97 | | 'pristine'
|
98 | | 'label'
|
99 | | 'icon'
|
100 | | 'iconEmpty'
|
101 | | 'iconFilled'
|
102 | | 'iconHover'
|
103 | | 'iconFocus'
|
104 | | 'iconActive'
|
105 | | 'decimal';
|
106 |
|
107 | /**
|
108 | *
|
109 | * Demos:
|
110 | *
|
111 | * - [Rating](https://mui.com/components/rating/)
|
112 | *
|
113 | * API:
|
114 | *
|
115 | * - [Rating API](https://mui.com/api/rating/)
|
116 | */
|
117 | export default function Rating(props: RatingProps): JSX.Element;
|