Rating
Rating is a set of radio buttons that allow the user to rate something.
Usage
import { Rating } from 'stwui';
import Rating from 'stwui/rating';
Basic and Show Value
<script lang="ts">
import { Rating } from 'stwui';
</script>
<Rating name="rating-1" />
<Rating name="rating-2" value={3} showValue />
<script lang="ts">
import { Rating } from 'stwui';
</script>
<Rating name="rating-3" half />
<br />
<Rating name="rating-4" value={3} half class="text-orange-400" />
<script lang="ts">
import { Rating } from 'stwui';
</script>
<Rating name="rating-5" size="sm" />
<br />
<Rating name="rating-6" value={3} class="text-orange-400" />
<br />
<Rating name="rating-7" value={3} size="lg" class="text-purple-400" />
<script lang="ts">
import { Rating } from 'stwui';
</script>
<Rating name="rating-5" size="sm" showValue />
<br />
<Rating name="rating-6" value={3} class="text-orange-400" showValue />
<br />
<Rating name="rating-7" value={3} size="lg" class="text-purple-400" showValue />
<br />
<Rating name="rating-8" size="sm" half showValue />
<br />
<Rating name="rating-9" value={3} half class="text-orange-400" showValue />
<br />
<Rating name="rating-10" value={3.5} half size="lg" class="text-purple-400" showValue />
Rating Props
half | boolean | false |
outOf | number | 5 |
name | string | nanoid() |
value | number | 0 |
size | 'sm' | 'md' | 'lg' | md |
showValue | boolean | false |
disabled | boolean | false |
type | 'info' | 'success' | 'warn' | 'error' | undefined | |