diff --git a/dev/index.html b/dev/index.html index b0b5ca0..e1ff00b 100644 --- a/dev/index.html +++ b/dev/index.html @@ -19,7 +19,8 @@

Samples

  • Data-driven List
  • Ordered Data-driven List
  • Mapped Data-driven List
    • -
  • Styling
    • +
  • Styling - Data List
    • +
  • Styling - Complex Items
  • Persisting Data in Local Storage
  • Enable / Disable
  • Nesting Levels
    • diff --git a/dev/styling-complex.html b/dev/styling-complex.html new file mode 100644 index 0000000..b3fdeb5 --- /dev/null +++ b/dev/styling-complex.html @@ -0,0 +1,116 @@ + + + + + + + Nested Sort | Styling - Complex Items Demo + + + + + + + +
    +

    Styling - Complex Items

    + +
    + + 
    
+  
    
+
    
+
+
+
+
+
+
diff --git a/src/main.ts b/src/main.ts
index c48696b..c2b69e3 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -221,10 +221,11 @@ class NestedSort {
   }
 
   onDragEnter(e: DragEvent): void {
-    if (!this.canBeTargeted(e.target as HTMLElement)) return
+    const target = (e.target as HTMLElement)?.closest(`li[data-id],.${this.classNames.placeholder}`) as HTMLElement
+    if (!target || !this.canBeTargeted(target)) return
 
     this.removeClassFromEl(this.classNames.targeted, this.targetedNode)
-    this.targetedNode = e.target as HTMLElement
+    this.targetedNode = target
     this.targetedNode.classList.add(this.classNames.targeted)
   }