mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 14:30:41 +00:00
11f02a2645
- Remove unused @ts-expect-error directives in eslint.config.ts - Simplify LazyImage prop types from ClassValue to string - Fix DialogInstance to avoid infinitely deep type instantiation - Use cn() in DefaultThumbnail for class merging Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
36 lines
936 B
Vue
36 lines
936 B
Vue
<template>
|
|
<BaseThumbnail :hover-zoom="hoverZoom" :is-hovered="isHovered">
|
|
<LazyImage
|
|
:src="src"
|
|
:alt="alt"
|
|
:image-class="
|
|
cn(
|
|
'transform-gpu transition-transform duration-300 ease-out',
|
|
isVideoType
|
|
? 'size-full object-cover'
|
|
: 'max-h-64 max-w-full object-contain'
|
|
)
|
|
"
|
|
:image-style="
|
|
isHovered ? { transform: `scale(${1 + hoverZoom / 100})` } : undefined
|
|
"
|
|
/>
|
|
</BaseThumbnail>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import LazyImage from '@/components/common/LazyImage.vue'
|
|
import BaseThumbnail from '@/components/templates/thumbnails/BaseThumbnail.vue'
|
|
import { cn } from '@/utils/tailwindUtil'
|
|
|
|
const { src, isVideo } = defineProps<{
|
|
src: string
|
|
alt: string
|
|
hoverZoom: number
|
|
isHovered?: boolean
|
|
isVideo?: boolean
|
|
}>()
|
|
|
|
const isVideoType = isVideo ?? (src?.toLowerCase().endsWith('.webp') || false)
|
|
</script>
|