@use-kona/editor 0.1.24-dnd.4 → 0.1.24-dnd.6

package/dist/plugins/DnDPlugin/DnDPlugin.js

@@ -46,21 +46,23 @@ class DnDPlugin {
         const isReadOnly = useReadOnly();
         const [dropPosition, setDropPosition] = useState(null);
         const dropTargetRef = useRef(null);
-        options.customTypes?.[props.element.type];
+        const customType = options.customTypes?.[props.element.type];
         const currentElement = props.element;
         const [, drag, preview] = useDrag({
-            type: DnDPlugin.DND_BLOCK_ELEMENT,
+            type: customType?.type || DnDPlugin.DND_BLOCK_ELEMENT,
             item: ()=>{
                 const selected = Array.from($store.selected.values());
                 const nodes = selected.length > 0 && selected.includes(currentElement.nodeId) ? getNodesByNodeIds(editor, selected) : [
                     structuredClone(props.element)
                 ];
+                const item = this.options.customTypes?.[currentElement.type].getData?.(currentElement);
                 const items = nodes.map((node)=>{
                     if (this.options.customTypes?.[node.type]) return this.options.customTypes[node.type].getData?.(node);
                     return null;
                 }).filter(Boolean);
                 const dragItem = {
                     nodes,
+                    item,
                     items,
                     source: {
                         editorId: this.getEditorId(editor),
@@ -105,17 +107,11 @@ class DnDPlugin {
                 const insertAt = getDropPath(editor, sourceTo, dropPosition || 'bottom');
                 if (!insertAt) return;
                 const customDropHandler = itemType && options.customDropHandlers?.[itemType];
-                if (customDropHandler) {
-                    console.log('customDropHandler.onDrop', itemType);
-                    customDropHandler.onDrop({
-                        editor,
-                        item,
-                        insertAt
-                    });
-                    return;
-                }
-                console.log('customDropHandler not found', itemType);
-                options.customDropHandlers && console.log('valid drop handlers are', Object.keys(options.customDropHandlers));
+                if (customDropHandler) return void customDropHandler.onDrop({
+                    editor,
+                    item,
+                    insertAt
+                });
                 switch(itemType){
                     case NativeTypes.FILE:
                         options.onDropFiles(editor, item.files, insertAt);

package/dist/src/plugins/DnDPlugin/types.d.ts

@@ -44,6 +44,7 @@ type DropResult = 'handled' | 'ignored';
  */
 export type EditorDragItem = {
     nodes: NodeWithId[];
+    item?: unknown;
     items?: unknown[];
     source: {
         /**

package/package.json

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

package/src/plugins/DnDPlugin/DnDPlugin.tsx

@@ -76,7 +76,7 @@ export class DnDPlugin implements IPlugin {
     const currentElement = props.element as NodeWithId;
 
     const [, drag, preview] = useDrag({
-      type: DnDPlugin.DND_BLOCK_ELEMENT,
+      type: customType?.type || DnDPlugin.DND_BLOCK_ELEMENT,
       item: () => {
         const selected = Array.from($store.selected.values());
 
@@ -90,6 +90,11 @@ export class DnDPlugin implements IPlugin {
             ? getNodesByNodeIds(editor, selected)
             : [structuredClone(props.element as NodeWithId)];
 
+        const item =
+          this.options.customTypes?.[currentElement.type].getData?.(
+            currentElement,
+          );
+
         const items = nodes
           .map((node) => {
             if (this.options.customTypes?.[node.type]) {
@@ -101,6 +106,7 @@ export class DnDPlugin implements IPlugin {
 
         const dragItem: EditorDragItem = {
           nodes,
+          item,
           items,
           source: {
             editorId: this.getEditorId(editor),
@@ -170,16 +176,8 @@ export class DnDPlugin implements IPlugin {
           itemType && options.customDropHandlers?.[itemType];
 
         if (customDropHandler) {
-          console.log('customDropHandler.onDrop', itemType);
           customDropHandler.onDrop({ editor, item, insertAt });
           return;
-        } else {
-          console.log('customDropHandler not found', itemType);
-          options.customDropHandlers &&
-            console.log(
-              'valid drop handlers are',
-              Object.keys(options.customDropHandlers),
-            );
         }
 
         switch (itemType) {

package/src/plugins/DnDPlugin/types.ts

@@ -59,6 +59,7 @@ type DropResult = 'handled' | 'ignored';
  */
 export type EditorDragItem = {
   nodes: NodeWithId[];
+  item?: unknown;
   items?: unknown[];
   source: {
     /**