expose html button properties
This commit is contained in:
@@ -1,9 +1,9 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import type { Snippet } from 'svelte';
|
import type { Snippet } from 'svelte';
|
||||||
import type { ClassValue, MouseEventHandler } from 'svelte/elements';
|
import type { ClassValue, HTMLButtonAttributes, MouseEventHandler } from 'svelte/elements';
|
||||||
import Spinner from './Spinner.svelte';
|
import Spinner from './Spinner.svelte';
|
||||||
|
|
||||||
interface Props {
|
interface Props extends Omit<HTMLButtonAttributes, 'type' | 'class'> {
|
||||||
icon?: string;
|
icon?: string;
|
||||||
animate?: boolean;
|
animate?: boolean;
|
||||||
loading?: boolean;
|
loading?: boolean;
|
||||||
@@ -12,7 +12,15 @@
|
|||||||
onclick?: MouseEventHandler<HTMLButtonElement>;
|
onclick?: MouseEventHandler<HTMLButtonElement>;
|
||||||
}
|
}
|
||||||
|
|
||||||
let { icon, animate = true, loading, class: classValue, children, onclick }: Props = $props();
|
let {
|
||||||
|
icon,
|
||||||
|
animate = true,
|
||||||
|
loading,
|
||||||
|
class: classValue,
|
||||||
|
children,
|
||||||
|
onclick,
|
||||||
|
...others
|
||||||
|
}: Props = $props();
|
||||||
|
|
||||||
let iconElement = $state<HTMLSpanElement | null>(null);
|
let iconElement = $state<HTMLSpanElement | null>(null);
|
||||||
|
|
||||||
@@ -69,6 +77,7 @@
|
|||||||
classValue
|
classValue
|
||||||
]}
|
]}
|
||||||
onclick={handleButtonClick}
|
onclick={handleButtonClick}
|
||||||
|
{...others}
|
||||||
>
|
>
|
||||||
{@render children()}
|
{@render children()}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user