andras/reconcile
andras/reconcile
Watch
1
0
Fork
You've already forked reconcile
 0
Code Issues Pull requests 10 Projects Releases Packages Wiki Activity Actions

Fix emoji bug on the demo website

Browse source
This commit is contained in:
Andras Schmelczer 2026-10-27 20:53:36 +00:00
commit 55e8177255
1 changed files with 37 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

21
examples/website/src/index.ts
View file

@ -1,5 +1,5 @@
import { reconcileWithHistory } from 'reconcile-text';
import type { BuiltinTokenizer } from 'reconcile-text';
import type { BuiltinTokenizer, CursorPosition } from 'reconcile-text';
import './style.scss';
const originalTextArea = document.getElementById('original') as HTMLTextAreaElement;
@ -157,19 +157,22 @@ function getCursorsFromActiveTextArea() {
let rightCursors = undefined;
if (activeElement === leftTextArea) {
leftCursors = [
{ id: 1, position: leftTextArea.selectionStart },
{ id: 2, position: leftTextArea.selectionEnd },
];
leftCursors = getSelectionCursors(leftTextArea);
} else if (activeElement === rightTextArea) {
rightCursors = [
{ id: 1, position: rightTextArea.selectionStart },
{ id: 2, position: rightTextArea.selectionEnd },
];
rightCursors = getSelectionCursors(rightTextArea);
}
return { leftCursors, rightCursors };
}
function getSelectionCursors(textarea: HTMLTextAreaElement): CursorPosition[] {
const text = textarea.value;
// DOM selections count UTF-16 code units; reconcile counts Unicode scalars.
return [
{ id: 1, position: [...text.slice(0, textarea.selectionStart)].length },
{ id: 2, position: [...text.slice(0, textarea.selectionEnd)].length },
];
}
function createSelectionOverlay(isLeft: boolean, isSelection: boolean): HTMLSpanElement {
const caretSpan = document.createElement('span');
caretSpan.className = `selection-caret selection-caret-${isLeft ? 'left' : 'right'}`;