Add loading indicator for button

This commit is contained in:
marzban-dev
2024-12-30 19:56:28 +03:30
parent 37a15a9afe
commit 3205325586
+5 -3
View File
@@ -5,6 +5,7 @@ type Props = {
size?: "xl" | "lg" | "md"; size?: "xl" | "lg" | "md";
startIcon?: string; startIcon?: string;
endIcon?: string; endIcon?: string;
loading?: boolean;
}; };
// props // props
@@ -35,8 +36,9 @@ const classes = computed(() => {
<template> <template>
<button :class="classes"> <button :class="classes">
<Icon v-if="startIcon" :name="startIcon" /> <Icon v-if="!loading && startIcon" :name="startIcon" />
<slot /> <slot v-if="!loading" />
<Icon v-if="endIcon" :name="endIcon" /> <Icon v-if="!loading && endIcon" :name="endIcon" />
<Icon v-if="loading" name="svg-spinners:3-dots-fade" class="my-0.5" />
</button> </button>
</template> </template>