mirror of
https://github.com/pocket-id/pocket-id.git
synced 2026-09-20 01:49:05 +02:00
fix: loading indicator not visible
This commit is contained in:
@@ -1,26 +1,14 @@
|
||||
<script lang="ts">
|
||||
import { cn } from '$lib/utils/style.js';
|
||||
import Loader2Icon from '@lucide/svelte/icons/loader-2';
|
||||
import type { SVGAttributes } from 'svelte/elements';
|
||||
import type { ComponentProps } from 'svelte';
|
||||
|
||||
let {
|
||||
class: className,
|
||||
role = 'status',
|
||||
// we add name, color, and stroke for compatibility with different icon libraries props
|
||||
name,
|
||||
color,
|
||||
stroke,
|
||||
'aria-label': ariaLabel = 'Loading',
|
||||
...restProps
|
||||
}: SVGAttributes<SVGSVGElement> = $props();
|
||||
let { class: className, ...restProps }: ComponentProps<typeof Loader2Icon> = $props();
|
||||
</script>
|
||||
|
||||
<Loader2Icon
|
||||
{role}
|
||||
name={name === null ? undefined : name}
|
||||
color={color === null ? undefined : color}
|
||||
stroke={stroke === null ? undefined : stroke}
|
||||
aria-label={ariaLabel}
|
||||
role="status"
|
||||
aria-label="Loading"
|
||||
class={cn('size-4 animate-spin', className)}
|
||||
{...restProps}
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user