feat(core): support for responding to cell drag at the end area of libro

difizen · Jan 3, 2025 · 1691090 · 1691090
1 parent 09c2c01
commit 1691090
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 31 deletions.
diff --git a/packages/libro-core/src/components/dnd-component/dnd-context.tsx b/packages/libro-core/src/components/dnd-component/dnd-context.tsx
diff --git a/packages/libro-core/src/components/dnd-component/dnd-list.tsx b/packages/libro-core/src/components/dnd-component/dnd-list.tsx
@@ -446,7 +446,46 @@ export const DndList = forwardRef<
   ]);
 
   return (
-    <div className="libro-dnd-list-container">
+    <div
+      className="libro-dnd-list-container"
+      onDragOver={(e) => {
+        e.preventDefault();
+      }}
+      onDrop={(e) => {
+        if (fragFromRef.current !== 'cell') {
+          return;
+        }
+        const sourceCellIndex = e.dataTransfer.getData('libro_notebook_drag_text');
+        const _sourceIndex = Number(sourceCellIndex || 0);
+
+        const lastCell =
+          libroView.model.getCells()[libroView.model.getCells().length - 1];
+        const lastCellOffsetY = lastCell.container?.current?.getBoundingClientRect().y;
+        if (lastCellOffsetY && e.clientY >= lastCellOffsetY) {
+          e.preventDefault();
+          if (_sourceIndex === undefined) {
+            return;
+          }
+          if (libroView.model.selections.length > 0) {
+            const isDragInSelections =
+              libroView.model.selections.findIndex(
+                (selection) =>
+                  selection.id === libroView.model.getCells()[_sourceIndex].id,
+              ) > -1
+                ? true
+                : false;
+            if (isDragInSelections) {
+              libroView.model.exchangeCells(
+                libroView.model.selections,
+                libroView.model.cells.length,
+              );
+              return;
+            }
+          }
+          exchangeCellIndex(_sourceIndex, libroView.model.cells.length - 1);
+        }
+      }}
+    >
       <DragContext.Provider value={dragContextValue}>
         <DndCellsRender libroView={libroView} addCellButtons={children} />
       </DragContext.Provider>

diff --git a/packages/libro-core/src/components/dnd-component/index.tsx b/packages/libro-core/src/components/dnd-component/index.tsx
@@ -1,3 +1,2 @@
 export * from './default-dnd-content.js';
-export * from './dnd-context.js';
 export * from './dnd-list.js';
diff --git a/packages/libro-core/src/libro-view.tsx b/packages/libro-core/src/libro-view.tsx
@@ -75,7 +75,6 @@ export interface ClipboardType {
 
 export const LibroContentComponent = memo(function LibroContentComponent() {
   const libroSlotManager = useInject(LibroSlotManager);
-  const ref = useRef<HTMLDivElement | null>(null);
   const libroViewTopRef = useRef<HTMLDivElement>(null);
   const libroViewRightContentRef = useRef<HTMLDivElement>(null);
   const libroViewLeftContentRef = useRef<HTMLDivElement>(null);