fix(UX): Avoid outside click while selecting text

closes: #229

frontend/src/components/BuilderBlock.vue

@@ -231,6 +231,12 @@ const triggerContextMenu = (e: MouseEvent) => {
 
 const handleClick = (e: MouseEvent) => {
 	if (isEditable.value) return;
+	if (store.preventClick) {
+		e.stopPropagation();
+		e.preventDefault();
+		store.preventClick = false;
+		return;
+	}
 	selectBlock(e);
 	e.stopPropagation();
 	e.preventDefault();

frontend/src/components/TextBlock.vue

@@ -111,6 +111,15 @@
 		<editor-content
 			@click="handleClick"
 			:editor="editor"
+			@mousedown="selectionTriggered = true"
+			@mousemove="
+				() => {
+					if (selectionTriggered) {
+						store.preventClick = true;
+					}
+				}
+			"
+			@mouseup="selectionTriggered = false"
 			v-if="editor && showEditor"
 			class="relative z-50"
 			:style="block.getRawStyles()"
@@ -144,6 +153,7 @@ const linkInput = ref(null) as Ref<typeof TextInput | null>;
 const component = ref(null) as Ref<HTMLElement | null>;
 const overlayElement = document.querySelector("#overlay") as HTMLElement;
 let editor: Ref<Editor | null> = ref(null);
+let selectionTriggered = false as boolean;
 
 const props = defineProps({
 	block: {

frontend/src/store.ts

@@ -49,6 +49,7 @@ const useStore = defineStore("store", {
 		autoSave: true,
 		pageBlocks: <Block[]>[],
 		propertyFilter: <string | null>null,
+		preventClick: false,
 		builderLayout: {
 			rightPanelWidth: 275,
 			leftPanelWidth: 250,