refac

src/lib/components/common/Collapsible.svelte

@@ -55,7 +55,14 @@
 
 	export let onChange: Function = () => {};
 
-	$: onChange(open);
+	const toggleOpen = () => {
+		if (disabled) {
+			return;
+		}
+
+		open = !open;
+		onChange(open);
+	};
 
 	const collapsibleId = uuidv4();
 </script>
@@ -64,14 +71,7 @@
 	{#if title !== null}
 		<!-- svelte-ignore a11y-no-static-element-interactions -->
 		<!-- svelte-ignore a11y-click-events-have-key-events -->
-		<div
+		<div class="{buttonClassName} {disabled ? '' : 'cursor-pointer'}" on:pointerup={toggleOpen}>
-			class="{buttonClassName} {disabled ? '' : 'cursor-pointer'}"
-			on:pointerup={() => {
-				if (!disabled) {
-					open = !open;
-				}
-			}}
-		>
 			<div
 				class=" w-full flex items-center justify-between gap-2 {attributes?.done &&
 				attributes?.done !== 'true' &&
@@ -135,11 +135,7 @@
 			on:click={(e) => {
 				e.stopPropagation();
 			}}
-			on:pointerup={(e) => {
+			on:pointerup={toggleOpen}
-				if (!disabled) {
-					open = !open;
-				}
-			}}
 		>
 			<div>
 				<div class="flex items-start justify-between">