Skip to content

Commit a43a183

Browse files
committed
Lexical: Added image insert via image link paste
Specifically added to align with existing TinyMCE behaviour which was used by some users based upon new editor feedback.
1 parent c4f7368 commit a43a183

File tree

1 file changed

+19
-1
lines changed

1 file changed

+19
-1
lines changed

resources/js/wysiwyg/services/drop-paste-handling.ts

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,21 @@ function handleMediaInsert(data: DataTransfer, context: EditorUiContext): boolea
9595
return handled;
9696
}
9797

98+
function handleImageLinkInsert(data: DataTransfer, context: EditorUiContext): boolean {
99+
const regex = /https?:\/\/([^?#]*?)\.(png|jpeg|jpg|gif|webp|bmp|avif)/i
100+
const text = data.getData('text/plain');
101+
if (text && regex.test(text)) {
102+
context.editor.update(() => {
103+
const image = $createImageNode(text);
104+
$insertNodes([image]);
105+
image.select();
106+
});
107+
return true;
108+
}
109+
110+
return false;
111+
}
112+
98113
function createDropListener(context: EditorUiContext): (event: DragEvent) => boolean {
99114
const editor = context.editor;
100115
return (event: DragEvent): boolean => {
@@ -138,7 +153,10 @@ function createPasteListener(context: EditorUiContext): (event: ClipboardEvent)
138153
return false;
139154
}
140155

141-
const handled = handleMediaInsert(event.clipboardData, context);
156+
const handled =
157+
handleImageLinkInsert(event.clipboardData, context) ||
158+
handleMediaInsert(event.clipboardData, context);
159+
142160
if (handled) {
143161
event.preventDefault();
144162
}

0 commit comments

Comments
 (0)