<script setup>
const props = defineProps({
  label: {
    type: String,
    required: true,
  },
  icon: {
    type: String,
  },
  variant: {
    type: String,
    default: 'solid'
  },
  color: {
    type: String,
    default: 'primary'
  },
  pos: {
    type: Number,
    default: 0
  }
})

const emit = defineEmits(['click'])

</script>

<template>
  <UButton
      id="fab"
      :icon="props.icon"
      :label="props.label"
      :variant="props.variant"
      :color="props.color"
      @click="emit('click')"
      :style="`bottom: ${10 + props.pos * 5}vh;`"
      class="bg-white dark:bg-gray-950"
  />
</template>

<style scoped>
#fab {
  position: fixed;
  right: 15px;
  z-index: 5;
}
</style>