텍스트 에디터에서 텍스트가 삽입될 위치를 나타내는 깜빡이는 수직선(|) 으로, 일반적으로 커서라 부르지만 약간의 차이가 있다.
즉, 커서가 더 넓은 의미의 포인터이고, 캐럿은 텍스트 편집시에만 사용되는 포인터이다.
일반적인 input 엘레먼트, contenteditable 속성등을 사용해 텍스트 입력을 받는 경우, 브라우저가 기본적으로 캐럿을 관리해서 따로 캐럿을 관리할 필요가 없다. 하지만 이번 프로젝트의 경우 일반 텍스트 에디터와는 차이점이 존재한다. Nocta의 CRDT구조를 보면 알 수 있듯이, 일반적인 텍스트 에디터와는 차이가 있다.
블록 기반 에디터 로, 각 블록이 별도의 컴포넌트이므로 캐럿을 공유하지 않음CRDT 노드 인스턴스실시간 동시편집 을 지원하므로, 내가 입력하는 중에 다른 위치에 글자가 입력되면서 캐럿의 위치가 변경될 수 있음
hello를 입력하고 w를 입력하게 되면, CRDT 상태가 변경되어 블록이 리렌더링되면서 캐럿의 위치가 0번째 위치로 초기화 된다. 이를 해결하기 위해 직접 캐럿을 관리하는 방식 을 도입했다.
currentCaret 이라는 속성을 통해 현재 캐럿의 위치를 저장한다.