<template>
    <UiIcon class="rotate">progress_activity</UiIcon>
</template>

<script setup lang="ts">
import UiIcon from './UiIcon.vue';
import { Optional } from '#imports';

const props = defineProps<{
  size?: string
}>();

const fontSize = Optional.ofNullable(props.size).orElse("1rem");
</script>

<style scoped>
.rotate{
  animation: rotate 1s linear infinite;
  user-select: none;
  font-size: v-bind(fontSize);
}
@keyframes rotate{
  to{ transform: rotate(360deg); }
}
</style>