# Rating Props (свойства) для компонента Rating: [{"name":"view","type":{"name":"enum","raw":"\"default\" | \"accent\"","value":[{"value":"\"default\""},{"value":"\"accent\""}]}},{"name":"size","type":{"name":"enum","raw":"\"m\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"s\" | \"l\" | \"xs\" | \"xxs\" | \"displayL\" | \"displayM\" | \"displayS\"","value":[{"value":"\"m\""},{"value":"\"h1\""},{"value":"\"h2\""},{"value":"\"h3\""},{"value":"\"h4\""},{"value":"\"h5\""},{"value":"\"s\""},{"value":"\"l\""},{"value":"\"xs\""},{"value":"\"xxs\""},{"value":"\"displayL\""},{"value":"\"displayM\""},{"value":"\"displayS\""}]}},{"name":"value","type":{"name":"number | null"}},{"name":"hasValue","type":{"name":"boolean"}},{"name":"precision","type":{"name":"number"}},{"name":"valuePlacement","type":{"name":"enum","raw":"\"before\" | \"after\"","value":[{"value":"\"before\""},{"value":"\"after\""}]}},{"name":"iconSlot","type":{"name":"ReactNode"}},{"name":"iconSlotOutline","type":{"name":"ReactNode"}},{"name":"iconSlotHalf","type":{"name":"ReactNode"}},{"name":"hasIcons","type":{"name":"boolean"}},{"name":"iconQuantity","type":{"name":"enum","raw":"1 | 5 | 10","value":[{"value":"1"},{"value":"5"},{"value":"10"}]}},{"name":"helperText","type":{"name":"string"}},{"name":"helperTextStretching","type":{"name":"enum","raw":"\"filled\" | \"fixed\"","value":[{"value":"\"filled\""},{"value":"\"fixed\""}]}}] ## Использование Компонент `Rating` представляет собой неинтерактивный компонент для отображения оценки.
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
### Вид Rating Вид Rating задаётся с помощью свойства `view` :
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
### Размер Rating Размер Rating задается с помощью свойства `size` :
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
### Размер Rating Размер Rating задается с помощью свойства `size` : ```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
### Размер Rating Размер Rating задается с помощью свойства `size` : ```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
### Количество иконок в Rating Количество иконок в Rating задается с помощью свойства `iconQuantity` :
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
### Положение значения в Rating Положение значения в Rating задается с помощью свойства `valuePlacement` .
Отображение значения можно выключить с помощью свойства `hasValue` :
```tsx
import React from 'react';
import { Rating } from '@salutejs/plasma-web';
export function App() {
return (
);
}
```
### Пользовтельские иконки в Rating Пользовтельские иконки в Rating задаются с помощью свойств: `iconSlot` – закрашенная иконка; `iconSlotOutline` – outline иконка; `iconSlotHalf` - иконка для отображения дробного значения оценки. Для корректного применения размеров к иконкам, необходимо передавать класс `ratingClasses.customIconSizing` ("custom-icon-sizing")
```tsx
import React from 'react';
import { IconKeyFill, IconKeyOutline, IconLockFill } from '@salutejs/plasma-icons';
import { ratingClasses, Rating } from '@salutejs/plasma-web';
export function App() {
return (
}
iconSlotOutline={}
iconSlotHalf={}
/>
);
}
```