Commit 199d09d0 by Яков

update

parent 3607e730
...@@ -2,7 +2,7 @@ import { NodeViewWrapper, ReactNodeViewRenderer } from "@tiptap/react"; ...@@ -2,7 +2,7 @@ import { NodeViewWrapper, ReactNodeViewRenderer } from "@tiptap/react";
import React, { useEffect, useRef, useState, Fragment } from "react"; import React, { useEffect, useRef, useState, Fragment } from "react";
import TipTapImage from "@tiptap/extension-image"; import TipTapImage from "@tiptap/extension-image";
import { Button, Modal, Input } from 'antd'; import { Button, Modal, Input } from 'antd';
import Icon, {FontSizeOutlined} from "@ant-design/icons"; import {FontSizeOutlined} from "@ant-design/icons";
const { TextArea } = Input; const { TextArea } = Input;
...@@ -24,17 +24,26 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select ...@@ -24,17 +24,26 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select
useEffect(() => { useEffect(() => {
if (!editor || !getPos) return; if (!editor || !getPos) return;
const pos = getPos() + 1; let pos;
try {
pos = getPos();
if (typeof pos !== 'number') return;
} catch (e) {
console.warn('getPos() failed:', e);
return;
}
const doc = editor.state.doc; const doc = editor.state.doc;
if (doc.nodeSize > pos && doc.nodeAt(pos)?.textContent !== '\u200B') { if (doc.nodeSize > pos && doc.nodeAt(pos)?.textContent !== '\u200B') {
editor.commands.insertContentAt(pos, { editor.commands.insertContentAt(pos + 1, {
type: 'text', type: 'text',
text: '\u200B' // Невидимый нулевой пробел text: '\u200B'
}); });
} }
}, [editor, getPos]); }, [editor, getPos]);
// Получаем текущую ширину редактора и доступное пространство // Получаем текущую ширину редактора и доступное пространство
const getEditorDimensions = () => { const getEditorDimensions = () => {
const editorContent = editor?.options?.element?.closest('.atma-editor-content'); const editorContent = editor?.options?.element?.closest('.atma-editor-content');
...@@ -115,7 +124,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select ...@@ -115,7 +124,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select
useEffect(() => { useEffect(() => {
const handleClickOutside = (event) => { const handleClickOutside = (event) => {
if (wrapperRef.current && !wrapperRef.current.contains(event.target) && selected) { if (wrapperRef.current && !wrapperRef.current.contains(event.target) && selected) {
editor.commands.setNodeSelection(getPos()); try {
const pos = getPos?.()
if (typeof pos === 'number') {
editor.commands.setNodeSelection(pos)
}
} catch (e) {
console.warn('getPos() failed:', e)
}
// editor.commands.setNodeSelection(getPos());
} }
}; };
document.addEventListener('mousedown', handleClickOutside); document.addEventListener('mousedown', handleClickOutside);
...@@ -192,7 +209,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select ...@@ -192,7 +209,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select
e.stopPropagation(); e.stopPropagation();
setIsResizing(true); setIsResizing(true);
editor.commands.setNodeSelection(getPos()); try {
const pos = getPos?.()
if (typeof pos === 'number') {
editor.commands.setNodeSelection(pos)
}
} catch (e) {
console.warn('getPos() failed:', e)
}
// editor.commands.setNodeSelection(getPos());
const startWidth = node.attrs.width || imgRef.current.naturalWidth; const startWidth = node.attrs.width || imgRef.current.naturalWidth;
const startHeight = node.attrs.height || imgRef.current.naturalHeight; const startHeight = node.attrs.height || imgRef.current.naturalHeight;
...@@ -252,7 +277,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select ...@@ -252,7 +277,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select
window.removeEventListener('mousemove', onMouseMove); window.removeEventListener('mousemove', onMouseMove);
window.removeEventListener('mouseup', onMouseUp); window.removeEventListener('mouseup', onMouseUp);
setIsResizing(false); setIsResizing(false);
editor.commands.setNodeSelection(getPos()); try {
const pos = getPos?.()
if (typeof pos === 'number') {
editor.commands.setNodeSelection(pos)
}
} catch (e) {
console.warn('getPos() failed:', e)
}
// editor.commands.setNodeSelection(getPos());
editor.commands.focus(); editor.commands.focus();
}; };
...@@ -335,7 +368,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select ...@@ -335,7 +368,15 @@ const ResizableImageTemplate = ({ node, updateAttributes, editor, getPos, select
ref={wrapperRef} ref={wrapperRef}
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();
editor.commands.setNodeSelection(getPos()); try {
const pos = getPos?.()
if (typeof pos === 'number') {
editor.commands.setNodeSelection(pos)
}
} catch (e) {
console.warn('getPos() failed:', e)
}
// editor.commands.setNodeSelection(getPos());
}} }}
contentEditable={false} contentEditable={false}
data-image-wrapper data-image-wrapper
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment