jaro/flowbite-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Eslint fixes

Browse Source
This commit is contained in:
Ilya Artamonov
2022-12-14 22:25:19 +03:00
parent b6a0e125e2
commit 87b50c1fbd
8 changed files with 54 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/components/Rating/Rating.vue
View File

@@ -1,30 +1,41 @@
<template>
<div class="flex items-center">
<!-- valid stars -->
<svg v-for="valid_star_index in valid_star_number" :key="valid_star_index"
class="text-yellow-400"
:class="sizeClasses"
fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
<svg
v-for="valid_star_index in valid_star_number"
:key="valid_star_index"
class="text-yellow-400"
:class="sizeClasses"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>
<!-- invalid stars -->
<svg v-for="invalid_star_index in invalid_star_number" :key="invalid_star_index"
class="text-gray-300 dark:text-gray-500"
:class="sizeClasses"
fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
<svg
v-for="invalid_star_index in invalid_star_number"
:key="invalid_star_index"
class="text-gray-300 dark:text-gray-500"
:class="sizeClasses"
fill="currentColor"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
</svg>
<!-- text -->
<slot name="besideText"></slot>
<!-- review link -->
<template v-if="(reviewText && reviewLink)">
<span class="w-1 h-1 mx-1.5 bg-gray-500 rounded-full dark:bg-gray-400"></span>
<a :href="reviewLink" class="text-sm font-medium text-gray-900 underline hover:no-underline dark:text-white">{{ reviewText }}</a>
<a
:href="reviewLink"
class="text-sm font-medium text-gray-900 underline hover:no-underline dark:text-white"
>
{{ reviewText }}
</a>
</template>
</div>
</template>
@@ -36,7 +47,7 @@ import type { RatingSize } from './types'
const props = defineProps({
size: {
type: String as PropType<RatingSize>, // 'sm' | 'md' | 'lg'
type: String as PropType<RatingSize>,
default: 'sm',
},
rating: {
@@ -49,12 +60,12 @@ const props = defineProps({
},
reviewText: {
type: String,
default: ""
default: '',
},
reviewLink: {
type: String,
default: ""
}
default: '',
},
})
const valid_star_number = computed(() => {

11
src/components/Rating/composables/useRatingClasses.ts
View File

@@ -6,7 +6,7 @@ import type { RatingSize } from '../types'
const ratingSizeClasses: Record<RatingSize, string> = {
sm: 'w-5 h-5',
md: 'w-7 h-7',
lg: 'w-10 h-10'
lg: 'w-10 h-10',
}
export type UseRatingClassesProps = {
@@ -17,15 +17,12 @@ export function useRatingClasses(props: UseRatingClassesProps):{
sizeClasses: Ref<string>
}{
const sizeClasses = computed(() => {
let sizeClass = ''
sizeClass = ratingSizeClasses[props.size.value]
return classNames(
sizeClass
ratingSizeClasses[props.size.value] ?? '',
)
})
return {
sizeClasses
sizeClasses,
}
}
}