diff --git a/src/lib/Button.svelte b/src/lib/Button.svelte index 6b46dd1..5fc305e 100644 --- a/src/lib/Button.svelte +++ b/src/lib/Button.svelte @@ -19,6 +19,7 @@ icon, animate = true, loading, + disabled, class: classValue, ref = $bindable(null), children, @@ -35,12 +36,12 @@ }); const handleButtonClick: MouseEventHandler = (event) => { - if (animate) { + if (animate && !loading && !disabled) { animateLoop(); animateRipple(event); } - if (loading) return; + if (loading || disabled) return; onclick?.(event); }; @@ -87,8 +88,10 @@ bind:this={ref} class={[ 'button group relative flex items-center gap-3 overflow-hidden rounded-sm px-5', - 'text-sui-background cursor-pointer py-3 font-medium transition-colors', - !loading ? ' bg-sui-primary hover:bg-sui-secondary' : 'bg-sui-primary/50 cursor-not-allowed ', + 'text-sui-background py-3 font-medium transition-colors', + !loading && !disabled + ? ' bg-sui-primary hover:bg-sui-secondary cursor-pointer' + : 'bg-sui-primary/50 cursor-not-allowed ', classValue ]} onclick={handleButtonClick}