import { useState }  from 'react'
import Rating from '../Rating'
import { Sandbox } from '@startupjs/docs'

# Rating (рейтинг)

Рейтинг предоставляет пользователю возможность оставить свое мнение и просмотреть мнение других пользователей о сервисе или продукте.

```jsx
import { Rating } from '@startupjs/ui'
```

## Простой пример

Рейтинг предоставляет пятизвездочную систему оценки. Свойство `value` округляется до ближайщего целого числа.

```jsx example
return (
  <Rating value={3} />
)
```

## Управление рейтингом

```jsx example
const [rated, setRated] = useState(0)
return (
  <Rating
    value={rated}
    onChange={(value) => setRated(value)}
  />
)
```

## Read only

Свойство `readonly` не позволяет пользователю изменять значение рейтинга и отображает его в компактном виде (по умолчанию `false`).

```jsx example
return(
  <Rating value={4.5} readonly />
)
```

## Sandbox

<Sandbox
  Component={Rating}
  props={{
    onChange: value => alert('Value ' + value + ' selected.')
  }}
/>