mirror of
https://github.com/AlchemillaHQ/Sylve.git
synced 2026-06-14 00:46:34 +03:00
ajasma6570
26 lines
828 B
Svelte
26 lines
828 B
Svelte
<script lang="ts">
|
|
import * as Dialog from '$lib/components/ui/dialog/index.js';
|
|
import Icon from '@iconify/svelte';
|
|
|
|
interface Props {
|
|
open: boolean;
|
|
title: string;
|
|
description: string;
|
|
iconColor?: string;
|
|
}
|
|
|
|
let { open = $bindable(), iconColor = 'text-red-500', title, description }: Props = $props();
|
|
</script>
|
|
|
|
<Dialog.Root bind:open closeOnOutsideClick={false}>
|
|
<Dialog.Content class="sm:max-w-[425px]">
|
|
<Dialog.Header class="flex flex-col items-center justify-center text-center">
|
|
<Dialog.Title class="mb-2 text-lg font-semibold">{title}</Dialog.Title>
|
|
<Icon icon="mdi:loading" class={`mb-4 animate-spin text-4xl ${iconColor}`} />
|
|
<Dialog.Description class="text-muted-foreground mt-3 text-sm">
|
|
{@html description}
|
|
</Dialog.Description>
|
|
</Dialog.Header>
|
|
</Dialog.Content>
|
|
</Dialog.Root>
|