<template>
  <div
    v-if="isLoading"
    class="w-full flex flex-col items-center justify-center py-4 min-h-[18rem]"
  >
    <font-awesome-icon
      :icon="['fas', 'spinner']"
      spin-pulse
      size="2xl"
      class="text-gray-500 animate-spin"
    />
    <p class="mt-2 text-gray-500 text-sm text-center">
      {{ loadingMessage }}
    </p>
  </div>
</template>

<script setup lang="ts">
const props = defineProps({
  isLoading: {
    type: Boolean,
    default: false,
  },
  loadingMessage: {
    type: String,
    default: '잠시만 기다려주세요..',
  },
});
</script>
