diff --git a/packages/client/src/components/app/Button.svelte b/packages/client/src/components/app/Button.svelte
index 018f21c583..51452de199 100644
--- a/packages/client/src/components/app/Button.svelte
+++ b/packages/client/src/components/app/Button.svelte
@@ -5,6 +5,8 @@
   const { styleable, builderStore } = getContext("sdk")
   const component = getContext("component")
 
+  let handlingOnClick = false
+
   export let disabled = false
   export let text = ""
   export let onClick
@@ -16,6 +18,16 @@
   export let icon = null
   export let active = false
 
+  const handleOnClick = async () => {
+    if (handlingOnClick) {
+      return
+    }
+
+    handlingOnClick = true
+    await onClick()
+    handlingOnClick = false
+  }
+
   let node
 
   $: $component.editing && node?.focus()
@@ -39,7 +51,7 @@
     class:spectrum-Button--quiet={quiet}
     {disabled}
     use:styleable={$component.styles}
-    on:click={onClick}
+    on:click={handleOnClick}
     contenteditable={$component.editing && !icon}
     on:blur={$component.editing ? updateText : null}
     bind:this={node}