Skip to content

@newtil/editor — 문서

이 폴더는 VitePress 사이트(https://newlecture-corp.github.io/newtil-editor/)의 원본이다. npm run docs:dev 로 미리 본다.

사용 문서 (현재 동작의 정본)

문서내용
guide/getting-started.md설치, 기본 사용, 언어·문자열, 이미지 업로드, 마크다운 모드, 붙여넣기, 빈 줄
guide/slash-commands.md슬래시 명령 16개와 키워드
guide/keyboard-shortcuts.md입력 규칙, 단축키, Enter/Backspace 정책
guide/media.md이미지·영상·오디오·코드 임베드
guide/drawing.md그림판 연동 — onDrawingSave/onDrawingLoad, 데이터 흐름
guide/toolbar.md상단·플로팅 툴바, 드래그 핸들
guide/theming.md스타일 번들, CSS 변수, 다크 모드, 높이
guide/react.md · guide/vue.md래퍼 props(둘은 대칭이 아니다)
api/index.md속성 · 프로퍼티 · 이벤트 · 문자열 표 · CSS 변수 · 타입

변경 이력은 CHANGELOG 가 정본이다.

개발 기록 (초기 설계·구현 기록)

문서내용
design.md초기 설계 — 목표, 기술 선택, ProseMirror 핵심 개념, 배포 전략
roadmap.mdStep 1 ~ 7 구현 로드맵과 완료 상태
steps/step-01-scaffolding.mdStep 1 — 스캐폴딩
steps/step-02-prosemirror.mdStep 2 — ProseMirror 통합, 공개 API
steps/step-03a-commands-foundation.mdStep 3-A — history / InputRules / keymap
steps/step-03b-slash-menu.mdStep 3-B — 슬래시 메뉴 플러그인

Step 1~7 은 모두 끝났고 npm 에 게시돼 운영에서 쓰인다. 위 기록은 당시 결정을 남긴 것이라 지금 동작과 다른 곳이 있다 — 특히:

  • 편집 모델: 마크다운 모드가 있다(0.6.0). 기록의 "소스 모드 미지원"은 라이브 동기화 시도가 실패해 접었던 시기의 것. 지금은 전환하는 순간에만 한 번 변환한다.
  • CSS 격리: Light DOM 이 아니라 Shadow DOM 이다(0.3.0).
  • 테마: 별도 import 없이 자동 주입된다(0.4.1). 색은 CSS 변수로 호스트에서 넘긴다. 기록의 @newtil/css 통합은 @newtil/design-tokens + @newtil/components(n- 컴포넌트) 조합으로 바뀌었다.
  • 빈 문단은 만들어지지도 저장되지도 않는다(0.6.2).
  • 그림판은 @newtil/drawing 패키지로 분리됐다(0.10.12).

문서 관리 규칙

  • 동작이 바뀌면 CHANGELOG 와 함께 guide/·api/ 를 고친다. 속성·prop·이벤트·단축키·슬래시 명령은 src/ 에 있는 것만 적는다.
  • design.md·roadmap.md·steps/ 는 기록이므로 고쳐 쓰지 않는다. 지금과 다른 점은 이 파일의 목록에 덧붙인다.