@santi020k/lumen-astro 1.4.0 → 1.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@santi020k/lumen-astro",
-  "version": "1.4.0",
+  "version": "1.6.0",
   "publishConfig": {
     "access": "public"
   },
@@ -37,14 +37,14 @@
   ],
   "dependencies": {
     "uqr": "^0.1.3",
-    "@santi020k/lumen": "^1.4.0",
-    "@santi020k/lumen-core": "^1.4.0"
+    "@santi020k/lumen-core": "^1.4.0",
+    "@santi020k/lumen": "^1.6.0"
   },
   "devDependencies": {
-    "@astrojs/ts-plugin": "^1.10.10",
-    "astro": "^7.2.0",
+    "@astrojs/ts-plugin": "^1.10.11",
+    "astro": "^7.2.6",
     "typescript": "^6.0.3",
-    "vitest": "^4.1.10"
+    "vitest": "^4.1.11"
   },
   "peerDependencies": {
     "astro": ">=5"

package/runtime/UIPrimitives.astro

@@ -3375,13 +3375,13 @@ const kanbanColumnSelector = '[data-ui-kanban-column]'
 
 const initKanbanBoards = (scope: ParentNode): void => {
   for (const root of scope.querySelectorAll<HTMLElement>('[data-ui-kanban]')) {
+    for (const handle of root.querySelectorAll<HTMLElement>('[data-ui-kanban-handle]'))
+      handle.draggable = true
+
     if (root.dataset.uiKanbanBound === 'true') continue
 
     root.dataset.uiKanbanBound = 'true'
 
-    for (const handle of root.querySelectorAll<HTMLElement>('[data-ui-kanban-handle]'))
-      handle.draggable = true
-
     let pointer: {
       active: boolean
       handle: HTMLElement
@@ -3391,13 +3391,21 @@ const initKanbanBoards = (scope: ParentNode): void => {
       startY: number
     } | undefined
 
-    const itemFor = (target: EventTarget | null): HTMLElement | null => target instanceof Element ?
-      target.closest<HTMLElement>('[data-ui-kanban-item]') :
-      null
+    const itemFor = (target: EventTarget | null): HTMLElement | null => {
+      const item = target instanceof Element ?
+        target.closest<HTMLElement>('[data-ui-kanban-item]') :
+        null
+
+      return item?.closest<HTMLElement>('[data-ui-kanban]') === root ? item : null
+    }
 
-    const columnFor = (target: EventTarget | null): HTMLElement | null => target instanceof Element ?
-      target.closest<HTMLElement>(kanbanColumnSelector) :
-      null
+    const columnFor = (target: EventTarget | null): HTMLElement | null => {
+      const column = target instanceof Element ?
+        target.closest<HTMLElement>(kanbanColumnSelector) :
+        null
+
+      return column?.closest<HTMLElement>('[data-ui-kanban]') === root ? column : null
+    }
 
     const clearState = (): void => {
       pointer = undefined
@@ -3580,8 +3588,7 @@ const initKanbanBoards = (scope: ParentNode): void => {
 
       pointer.item.dataset.state = 'dragging'
 
-      const target = document.elementFromPoint(event.clientX, event.clientY)
-        ?.closest<HTMLElement>(kanbanColumnSelector)
+      const target = columnFor(document.elementFromPoint(event.clientX, event.clientY))
 
       for (const column of root.querySelectorAll<HTMLElement>(kanbanColumnSelector)) {
         if (column === target) column.dataset.state = 'drop-target'
@@ -3592,8 +3599,7 @@ const initKanbanBoards = (scope: ParentNode): void => {
     root.addEventListener('pointerup', event => {
       if (!pointer || pointer.pointerId !== event.pointerId) return
 
-      const target = document.elementFromPoint(event.clientX, event.clientY)
-        ?.closest<HTMLElement>(kanbanColumnSelector)
+      const target = columnFor(document.elementFromPoint(event.clientX, event.clientY))
 
       if (pointer.active && target) requestMove(pointer.item, target, 'pointer')