From 8e0d86725ac6fc645324b9dd0686fc3e53406f6c Mon Sep 17 00:00:00 2001
From: preiter93 <p.reiter93@gmail.con>
Date: Sat, 7 Dec 2024 21:59:58 +0100
Subject: [PATCH] Add touchend handler - see
 https://github.com/isaacHagoel/svelte-dnd-action/issues/557

---
 src/lib/components/TimerItem.svelte             | 6 +++++-
 src/lib/components/buttons/CancelButton.svelte  | 7 ++++++-
 src/lib/components/buttons/ControlButton.svelte | 8 +++++++-
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/lib/components/TimerItem.svelte b/src/lib/components/TimerItem.svelte
index d7fccd6..d505d1c 100644
--- a/src/lib/components/TimerItem.svelte
+++ b/src/lib/components/TimerItem.svelte
@@ -143,7 +143,11 @@
 <div class="timer-item">
 	<div class="timer-item-content">
 		<div class="timer-name-row">
-			<button onclick={toggleIsExpanded} class="chevron">
+			<button
+				onclick={toggleIsExpanded}
+				ontouchend={toggleIsExpanded}
+				class="chevron"
+			>
 				<div>
 					<svg
 						class="chevron {isExpanded ? 'up' : 'down'}"
diff --git a/src/lib/components/buttons/CancelButton.svelte b/src/lib/components/buttons/CancelButton.svelte
index 9325104..1089ac3 100644
--- a/src/lib/components/buttons/CancelButton.svelte
+++ b/src/lib/components/buttons/CancelButton.svelte
@@ -10,7 +10,12 @@
 	let { margin = "0", onclick } = $props();
 </script>
 
-<button {onclick} class="cancel-button" style="margin: {margin};">
+<button
+	{onclick}
+	ontouchend={onclick}
+	class="cancel-button"
+	style="margin: {margin};"
+>
 	<div class="center">
 		<CancelIcon />
 	</div></button
diff --git a/src/lib/components/buttons/ControlButton.svelte b/src/lib/components/buttons/ControlButton.svelte
index 3b4f4af..9a4d724 100644
--- a/src/lib/components/buttons/ControlButton.svelte
+++ b/src/lib/components/buttons/ControlButton.svelte
@@ -17,7 +17,13 @@
 	let { symbol, cls = "default", margin = "0", onclick } = $props();
 </script>
 
-<button {onclick} class={cls} style="margin: {margin};" data-testid={symbol}>
+<button
+	{onclick}
+	ontouchend={onclick}
+	class={cls}
+	style="margin: {margin};"
+	data-testid={symbol}
+>
 	<div class="center">
 		{#if symbol === "play"}
 			<PlayIcon />