mirror of
https://github.com/makeplane/plane
synced 2024-06-14 14:31:34 +00:00
chore: fix imports, ts errors and other things
This commit is contained in:
parent
8b297b2bda
commit
543168a756
@ -1,9 +1,13 @@
|
|||||||
import { Extension } from "@tiptap/core";
|
import { Extension } from "@tiptap/core";
|
||||||
|
|
||||||
import { PluginKey, NodeSelection, Plugin } from "@tiptap/pm/state";
|
import { NodeSelection, Plugin, PluginKey } from "@tiptap/pm/state";
|
||||||
// @ts-ignore
|
// @ts-expect-error __serializeForClipboard's is not exported
|
||||||
import { __serializeForClipboard, EditorView } from "@tiptap/pm/view";
|
import { __serializeForClipboard, EditorView } from "@tiptap/pm/view";
|
||||||
import React from "react";
|
|
||||||
|
export interface DragHandleOptions {
|
||||||
|
dragHandleWidth: number;
|
||||||
|
setHideDragHandle?: (hideDragHandlerFromDragDrop: () => void) => void;
|
||||||
|
}
|
||||||
|
|
||||||
function createDragHandleElement(): HTMLElement {
|
function createDragHandleElement(): HTMLElement {
|
||||||
const dragHandleElement = document.createElement("div");
|
const dragHandleElement = document.createElement("div");
|
||||||
@ -29,13 +33,8 @@ function createDragHandleElement(): HTMLElement {
|
|||||||
return dragHandleElement;
|
return dragHandleElement;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DragHandleOptions {
|
|
||||||
dragHandleWidth: number;
|
|
||||||
setHideDragHandle?: (hideDragHandlerFromDragDrop: () => void) => void;
|
|
||||||
}
|
|
||||||
|
|
||||||
function absoluteRect(node: Element) {
|
function absoluteRect(node: Element) {
|
||||||
const data = node?.getBoundingClientRect();
|
const data = node.getBoundingClientRect();
|
||||||
|
|
||||||
return {
|
return {
|
||||||
top: data.top,
|
top: data.top,
|
||||||
@ -51,40 +50,18 @@ function nodeDOMAtCoords(coords: { x: number; y: number }) {
|
|||||||
(elem: Element) =>
|
(elem: Element) =>
|
||||||
elem.parentElement?.matches?.(".ProseMirror") ||
|
elem.parentElement?.matches?.(".ProseMirror") ||
|
||||||
elem.matches(
|
elem.matches(
|
||||||
[
|
["li", "p:not(:first-child)", "pre", "blockquote", "h1, h2, h3", "table", "[data-type=horizontalRule]"].join(
|
||||||
"li",
|
", "
|
||||||
"p:not(:first-child)",
|
)
|
||||||
"pre",
|
|
||||||
"blockquote",
|
|
||||||
"h1, h2, h3",
|
|
||||||
"[data-type=horizontalRule]",
|
|
||||||
".tableWrapper",
|
|
||||||
].join(", ")
|
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function nodePosAtDOM(node: Element, view: EditorView) {
|
function nodePosAtDOM(node: Element, view: EditorView, options: DragHandleOptions) {
|
||||||
const boundingRect = node?.getBoundingClientRect();
|
const boundingRect = node.getBoundingClientRect();
|
||||||
|
|
||||||
if (node.nodeName === "IMG") {
|
|
||||||
return view.posAtCoords({
|
|
||||||
left: boundingRect.left + 1,
|
|
||||||
top: boundingRect.top + 1,
|
|
||||||
})?.pos;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (node.nodeName === "PRE") {
|
|
||||||
return (
|
|
||||||
view.posAtCoords({
|
|
||||||
left: boundingRect.left + 1,
|
|
||||||
top: boundingRect.top + 1,
|
|
||||||
})?.pos! - 1
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return view.posAtCoords({
|
return view.posAtCoords({
|
||||||
left: boundingRect.left + 1,
|
left: boundingRect.left + 50 + options.dragHandleWidth,
|
||||||
top: boundingRect.top + 1,
|
top: boundingRect.top + 1,
|
||||||
})?.inside;
|
})?.inside;
|
||||||
}
|
}
|
||||||
@ -96,14 +73,14 @@ function DragHandle(options: DragHandleOptions) {
|
|||||||
if (!event.dataTransfer) return;
|
if (!event.dataTransfer) return;
|
||||||
|
|
||||||
const node = nodeDOMAtCoords({
|
const node = nodeDOMAtCoords({
|
||||||
x: event.clientX + options.dragHandleWidth + 50,
|
x: event.clientX + 50 + options.dragHandleWidth,
|
||||||
y: event.clientY,
|
y: event.clientY,
|
||||||
});
|
});
|
||||||
|
|
||||||
if (!(node instanceof Element)) return;
|
if (!(node instanceof Element)) return;
|
||||||
|
|
||||||
const nodePos = nodePosAtDOM(node, view);
|
const nodePos = nodePosAtDOM(node, view, options);
|
||||||
if (nodePos === null || nodePos === undefined || nodePos < 0) return;
|
if (nodePos == null || nodePos < 0) return;
|
||||||
|
|
||||||
view.dispatch(view.state.tr.setSelection(NodeSelection.create(view.state.doc, nodePos)));
|
view.dispatch(view.state.tr.setSelection(NodeSelection.create(view.state.doc, nodePos)));
|
||||||
|
|
||||||
@ -132,9 +109,8 @@ function DragHandle(options: DragHandleOptions) {
|
|||||||
|
|
||||||
if (!(node instanceof Element)) return;
|
if (!(node instanceof Element)) return;
|
||||||
|
|
||||||
const nodePos = nodePosAtDOM(node, view);
|
const nodePos = nodePosAtDOM(node, view, options);
|
||||||
|
if (!nodePos) return;
|
||||||
if (nodePos === null || nodePos === undefined || nodePos < 0) return;
|
|
||||||
|
|
||||||
view.dispatch(view.state.tr.setSelection(NodeSelection.create(view.state.doc, nodePos)));
|
view.dispatch(view.state.tr.setSelection(NodeSelection.create(view.state.doc, nodePos)));
|
||||||
}
|
}
|
||||||
@ -192,7 +168,7 @@ function DragHandle(options: DragHandleOptions) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const node = nodeDOMAtCoords({
|
const node = nodeDOMAtCoords({
|
||||||
x: event.clientX + options.dragHandleWidth,
|
x: event.clientX + 50 + options.dragHandleWidth,
|
||||||
y: event.clientY,
|
y: event.clientY,
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -218,13 +194,13 @@ function DragHandle(options: DragHandleOptions) {
|
|||||||
if (!dragHandleElement) return;
|
if (!dragHandleElement) return;
|
||||||
|
|
||||||
dragHandleElement.style.left = `${rect.left - rect.width}px`;
|
dragHandleElement.style.left = `${rect.left - rect.width}px`;
|
||||||
dragHandleElement.style.top = `${rect.top + 3}px`;
|
dragHandleElement.style.top = `${rect.top}px`;
|
||||||
showDragHandle();
|
showDragHandle();
|
||||||
},
|
},
|
||||||
keydown: () => {
|
keydown: () => {
|
||||||
hideDragHandle();
|
hideDragHandle();
|
||||||
},
|
},
|
||||||
wheel: () => {
|
mousewheel: () => {
|
||||||
hideDragHandle();
|
hideDragHandle();
|
||||||
},
|
},
|
||||||
dragenter: (view) => {
|
dragenter: (view) => {
|
||||||
|
Loading…
Reference in New Issue
Block a user