<template>
	<div class="arrow">
		→
		<transition name="bounce" mode="out-in">
			<span :key="animate">🎈</span>
		</transition>
		→
	</div>
</template>

<script>
export default {
	props: {
		animate: {
			type: Number,
			default: 0,
		},
	},
}
</script>

<style>
.arrow {
	align-items: center;
	display: flex;
	justify-content: center;
	font-size: 72px;
}
</style>