<script setup lang="ts">
import DsSpinner from "./DsSpinner.vue";
withDefaults(defineProps<{ title?: string; description?: string }>(), {
  title: "Cargando",
  description: "Espera un momento mientras obtenemos la información.",
});
</script>

<template>
  <div class="ds-state" role="status" aria-live="polite">
    <div class="ds-state__icon"><DsSpinner :label="title" /></div>
    <h3 class="ds-state__title">{{ title }}</h3>
    <p class="ds-state__description">{{ description }}</p>
  </div>
</template>
