@use-kona/editor 0.1.22 → 0.1.23

package/dist/plugins/DnDPlugin/DnDPlugin.js

@@ -3,7 +3,7 @@ import { map } from "nanostores";
 import { useEffect, useRef, useState } from "react";
 import { useDrag, useDrop } from "react-dnd";
 import { NativeTypes } from "react-dnd-html5-backend";
-import { Editor, Transforms } from "slate";
+import { Editor, Path, Transforms } from "slate";
 import { ReactEditor, useReadOnly, useSlate } from "slate-react";
 class DnDPlugin {
     options;
@@ -78,7 +78,7 @@ class DnDPlugin {
                 const itemType = monitor.getItemType();
                 const sourceTo = ReactEditor.findPath(editor, props.element);
                 if (!sourceTo) return;
-                const dropPath = getDropPath(editor, sourceTo);
+                const dropPath = getDropPath(editor, sourceTo, dropPosition || 'bottom');
                 if (!dropPath) return;
                 switch(itemType){
                     case NativeTypes.FILE:
@@ -88,7 +88,7 @@ class DnDPlugin {
                         {
                             const dragItem = item;
                             if (!dropPosition || !dragItem.nodeIds?.length) return;
-                            moveNode(editor, sourceTo, dragItem.nodeIds);
+                            moveNode(editor, sourceTo, dragItem.nodeIds, dropPosition);
                             $store.selected.clear();
                             break;
                         }
@@ -120,12 +120,17 @@ class DnDPlugin {
         });
     };
 }
-const getDropPath = (editor, targetNodePath)=>{
+const getDropPath = (editor, targetNodePath, position)=>{
     const target = Editor.node(editor, targetNodePath);
-    return target[1];
+    switch(position){
+        case 'top':
+            return target[1];
+        case 'bottom':
+            return Path.next(target[1]);
+    }
 };
-const moveNode = (editor, targetNodePath, nodeIds)=>{
-    const dropPath = getDropPath(editor, targetNodePath);
+const moveNode = (editor, targetNodePath, nodeIds, position)=>{
+    const dropPath = getDropPath(editor, targetNodePath, position);
     if (!dropPath) return;
     if (!Editor.hasPath(editor, dropPath)) return;
     Editor.withoutNormalizing(editor, ()=>{

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@use-kona/editor",
-  "version": "0.1.22",
+  "version": "0.1.23",
   "type": "module",
   "exports": {
     ".": "./src/index.ts"

package/src/plugins/DnDPlugin/DnDPlugin.tsx

@@ -154,7 +154,7 @@ export class DnDPlugin implements IPlugin {
 
         if (!sourceTo) return;
 
-        const dropPath = getDropPath(editor, sourceTo);
+        const dropPath = getDropPath(editor, sourceTo, dropPosition || 'bottom');
 
         if (!dropPath) return;
 
@@ -173,7 +173,7 @@ export class DnDPlugin implements IPlugin {
               return;
             }
 
-            moveNode(editor, sourceTo, dragItem.nodeIds);
+            moveNode(editor, sourceTo, dragItem.nodeIds, dropPosition);
             $store.selected.clear();
             break;
           }
@@ -223,18 +223,25 @@ export class DnDPlugin implements IPlugin {
 const getDropPath = (
   editor: Editor,
   targetNodePath: Path,
+  position: 'top' | 'bottom',
 ) => {
   const target = Editor.node(editor, targetNodePath);
 
-  return target[1];
+  switch (position) {
+    case 'top':
+      return target[1];
+    case 'bottom':
+      return Path.next(target[1]);
+  }
 };
 
 const moveNode = (
   editor: Editor,
   targetNodePath: Path,
   nodeIds: string[],
+  position: 'top' | 'bottom',
 ) => {
-  const dropPath = getDropPath(editor, targetNodePath);
+  const dropPath = getDropPath(editor, targetNodePath, position);
 
   if (!dropPath) return;
   if (!Editor.hasPath(editor, dropPath)) {