location click

This commit is contained in:
Anthony Stirling 2025-11-10 17:58:49 +00:00
parent 08e58349dc
commit addaf797cb

View File

@ -1472,18 +1472,28 @@ const PdfJsonEditorView = ({ data }: PdfJsonEditorViewProps) => {
</span> </span>
</div>, </div>,
(event: React.MouseEvent) => { (event: React.MouseEvent) => {
// Capture click position BEFORE switching to edit mode
const clickX = event.clientX;
const clickY = event.clientY;
setEditingGroupId(group.id); setEditingGroupId(group.id);
setActiveGroupId(group.id); setActiveGroupId(group.id);
// Store click position for later cursor placement
const editor = document.querySelector<HTMLElement>(`[data-editor-group="${group.id}"]`);
if (editor) {
const rect = editor.getBoundingClientRect();
const clickX = event.clientX - rect.left;
const clickY = event.clientY - rect.top;
// Use setTimeout to allow the editor to render first // Clear any stored offset to prevent interference
caretOffsetsRef.current.delete(group.id);
// Wait for editor to render, then position cursor at click location
requestAnimationFrame(() => {
const editor = document.querySelector<HTMLElement>(`[data-editor-group="${group.id}"]`);
if (!editor) return;
// Focus the editor first
editor.focus();
// Use caretRangeFromPoint to position cursor at click coordinates
setTimeout(() => { setTimeout(() => {
const range = document.caretRangeFromPoint(event.clientX, event.clientY); if (document.caretRangeFromPoint) {
const range = document.caretRangeFromPoint(clickX, clickY);
if (range) { if (range) {
const selection = window.getSelection(); const selection = window.getSelection();
if (selection) { if (selection) {
@ -1491,8 +1501,22 @@ const PdfJsonEditorView = ({ data }: PdfJsonEditorViewProps) => {
selection.addRange(range); selection.addRange(range);
} }
} }
}, 0); } else if ((document as any).caretPositionFromPoint) {
// Firefox fallback
const pos = (document as any).caretPositionFromPoint(clickX, clickY);
if (pos) {
const range = document.createRange();
range.setStart(pos.offsetNode, pos.offset);
range.collapse(true);
const selection = window.getSelection();
if (selection) {
selection.removeAllRanges();
selection.addRange(range);
} }
}
}
}, 10);
});
}, },
)} )}
</Box> </Box>