fix(Sidebar): Only close sidebar on v-click-outside for specific targets

Signed-off-by: Julius Härtl <jus@bitgrid.net>

src/components/Sidebar.vue

@@ -38,10 +38,9 @@ export default {
 			this.$router.push({ name: 'board' })
 		},
 		onClickOutside(e) {
-			if (Array.from(document.querySelectorAll('.card')).some(node => node.contains(e.target))) {
-				return
+			if (e.target?.dataset?.clickClosesSidebar) {
+				this.closeSidebar()
 			}
-			this.closeSidebar()
 		},
 	},
 }

src/components/board/Board.vue

@@ -53,11 +53,12 @@
 				<Container lock-axix="y"
 					orientation="horizontal"
 					:drag-handle-selector="dragHandleSelector"
+					data-click-closes-sidebar="true"
 					@drag-start="draggingStack = true"
 					@drag-end="draggingStack = false"
 					@drop="onDropStack">
-					<Draggable v-for="stack in stacksByBoard" :key="stack.id">
-						<Stack :stack="stack" :dragging="draggingStack" />
+					<Draggable v-for="stack in stacksByBoard" :key="stack.id" data-click-closes-sidebar="true">
+						<Stack :stack="stack" :dragging="draggingStack" data-click-closes-sidebar="true" />
 					</Draggable>
 				</Container>
 			</div>

src/components/board/Stack.vue

@@ -128,6 +128,7 @@
 
 		<Container :get-child-payload="payloadForCard(stack.id)"
 			group-name="stack"
+			data-click-closes-sidebar="true"
 			non-drag-area-selector=".dragDisabled"
 			:drag-handle-selector="dragHandleSelector"
 			@should-accept-drop="canEdit"