packages/frontend/src/components/MkImgWithBlurhash.vue

@@ -5,14 +5,15 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <template>
 <div ref="root" :class="['chromatic-ignore', $style.root, { [$style.cover]: cover }]" :title="title ?? ''">
-	<TransitionGroup
+	<MkTransitionGroup
-		:duration="prefer.s.animation && props.transition?.duration || undefined"
+		:animate="prefer.s.animation && props.transition != null"
-		:enterActiveClass="prefer.s.animation && props.transition?.enterActiveClass || undefined"
+		:duration="props.transition?.duration"
-		:leaveActiveClass="prefer.s.animation && (props.transition?.leaveActiveClass ?? $style.transition_leaveActive) || undefined"
+		:enterActiveClass="props.transition?.enterActiveClass"
-		:enterFromClass="prefer.s.animation && props.transition?.enterFromClass || undefined"
+		:leaveActiveClass="(props.transition?.leaveActiveClass ?? $style.transition_leaveActive)"
-		:leaveToClass="prefer.s.animation && props.transition?.leaveToClass || undefined"
+		:enterFromClass="props.transition?.enterFromClass"
-		:enterToClass="prefer.s.animation && props.transition?.enterToClass || undefined"
+		:leaveToClass="props.transition?.leaveToClass"
-		:leaveFromClass="prefer.s.animation && props.transition?.leaveFromClass || undefined"
+		:enterToClass="props.transition?.enterToClass"
+		:leaveFromClass="props.transition?.leaveFromClass"
 	>
 		<canvas
 			v-show="hide"
@@ -42,7 +43,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			tabindex="-1"
 			style="-webkit-user-drag: none;"
 		/>
-	</TransitionGroup>
+	</MkTransitionGroup>
 </div>
 </template>