@aeriz/wysiwyg 1.0.2 → 1.0.4

package/dist-types/cjs/adapters/wc.d.cts

@@ -0,0 +1,96 @@
+/**
+ * 커스텀 엘리먼트 어댑터 — `<aeriz-editor>` / `<aeriz-viewer>`.
+ *
+ * 프레임워크 의존이 전혀 없는 최소 공통 분모다. Vanilla / jQuery 는 물론
+ * Angular 처럼 별도 컴파일러가 필요한 프레임워크도 이 엘리먼트를 통해 버전
+ * 제약 없이 붙을 수 있다 (`angular/` 디렉터리의 디렉티브가 이 위에 올라간다).
+ *
+ * Shadow DOM 을 쓰지 않는다. 에디터 스타일시트가 전역 CSS 변수 기반이라
+ * 그림자 경계를 두면 테마 변수와 폰트 상속이 끊긴다.
+ *
+ * @example
+ *   <script type="module">
+ *     import '@aeriz/wysiwyg/wc';
+ *   </script>
+ *   <link rel="stylesheet" href="/aeriz-wysiwyg.min.css" />
+ *
+ *   <aeriz-editor name="body" theme="dark" placeholder="내용을 입력하세요">
+ *   </aeriz-editor>
+ *   <script>
+ *     const el = document.querySelector('aeriz-editor');
+ *     el.addEventListener('change', (e) => console.log(e.detail.html));
+ *     el.value = '<p>안녕하세요</p>';
+ *   </script>
+ */
+import type { AerizEditor, AerizViewer, BlockSnapshot } from '@aeriz/wysiwyg';
+type UploadFn = (file: File) => Promise<string>;
+/**
+ * `<aeriz-editor>`.
+ *
+ * 문자열로 표현되는 설정은 속성(attribute), 함수/객체는 프로퍼티로 준다.
+ * 폼 연동을 지원하는 브라우저에서는 `name` 속성을 주면 `<form>` 전송에
+ * 본문 HTML 이 함께 실린다.
+ */
+export declare class AerizEditorElement extends HTMLElement {
+    static get observedAttributes(): string[];
+    /** 폼 연동 대상임을 선언. 미지원 브라우저는 이 필드를 무시한다. */
+    static formAssociated: boolean;
+    /** 프로퍼티로 설정된 업로드 핸들러. 속성으로는 표현할 수 없다. */
+    onImageUpload: UploadFn | undefined;
+    onFileUpload: UploadFn | undefined;
+    private controller;
+    private internals;
+    /**
+     * 아직 에디터에 반영되지 않은 **외부에서 지정한** 값.
+     *
+     * 반영이 끝나면 즉시 비운다. 이 값이 남아 있으면 관계없는 속성(`theme` 등) 이
+     * 바뀔 때마다 낡은 값이 `setHTML()` 로 다시 밀려들어가, 모든 블록 id 가
+     * 재발급되고 입력 중이던 캐럿이 문서 맨 앞으로 튄다.
+     */
+    private pendingValue;
+    /** 에디터가 마지막으로 보고한 본문. 폼 값과 마운트 해제 후 `value` 의 근거. */
+    private currentHTML;
+    constructor();
+    /** 현재 본문 HTML. 설정하면 본문을 교체한다. */
+    get value(): string;
+    set value(next: string);
+    /** 코어 인스턴스. 마운트 전에는 `null`. */
+    get editor(): AerizEditor | null;
+    /** 블록 상태 스냅샷. */
+    getBlocks(): BlockSnapshot[];
+    /** 본문에 캐럿을 둔다. `HTMLElement.focus()` 를 본문 쪽으로 위임한다. */
+    focus(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, _previous: string | null, next: string | null): void;
+    /**
+     * 현재 속성·프로퍼티 상태를 컨트롤러에 반영한다.
+     * 반영 직후 pendingValue 를 비워, 다음 갱신에서 같은 값이 되살아나지 않게 한다.
+     */
+    private applyProps;
+    private buildProps;
+    private syncFormValue;
+}
+/** `<aeriz-viewer>` — 읽기 전용 렌더링. */
+export declare class AerizViewerElement extends HTMLElement {
+    static get observedAttributes(): string[];
+    private controller;
+    private pendingBlocks;
+    /** 블록 상태를 직접 넣는다. `html` 속성보다 우선한다. */
+    get blocks(): BlockSnapshot[];
+    set blocks(next: BlockSnapshot[]);
+    get viewer(): AerizViewer | null;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(): void;
+    private buildProps;
+}
+/**
+ * 커스텀 엘리먼트를 등록한다. 이미 등록된 이름은 건너뛰므로 여러 번 불러도
+ * 안전하다. 이름 충돌이 있는 페이지에서는 `prefix` 로 바꿀 수 있다.
+ *
+ * @param prefix 태그 접두사. 기본 `'aeriz'` → `<aeriz-editor>` / `<aeriz-viewer>`
+ */
+export declare function defineAerizElements(prefix?: string): void;
+export {};
+// (소스맵은 CJS 선언 사본에서 제외됨 — scripts/finalize-types.mjs)

package/dist-types/cjs/core/AerizEditor.d.cts

@@ -0,0 +1,530 @@
+import type { EditorOptions, SerializeHtmlOptions } from '../types/index.cjs';
+import { Toolbar } from '../ui/Toolbar.cjs';
+import type { Block, BlockAttrs, BlockKind, BlockSnapshot } from './blocks.cjs';
+export type { Block, BlockAttrs, BlockKind, BlockMatch, BlockSnapshot, BlockType, ClassifyResult, HeadingLevel, } from './blocks.cjs';
+export interface InlineState {
+    bold: boolean;
+    italic: boolean;
+    underline: boolean;
+    strike: boolean;
+}
+export interface EditorState {
+    blocks: Block[];
+    activeBlockId: string | null;
+    inline: InlineState;
+}
+export type EditorStateListener = (state: EditorState) => void;
+export declare class AerizEditor {
+    readonly root: HTMLDivElement;
+    readonly content: HTMLDivElement;
+    readonly toolbar: Toolbar | null;
+    private readonly contentWrap;
+    private readonly handlesLayer;
+    private readonly dropIndicator;
+    private readonly handles;
+    private readonly blockLabelPill;
+    private readonly pillGlyphEl;
+    private readonly pillTextEl;
+    private readonly statusBar;
+    private readonly undoBtn;
+    private readonly redoBtn;
+    private readonly statusBlockEl;
+    private readonly statusBlocksEl;
+    private readonly statusCharsEl;
+    private readonly statusSourceEl;
+    private readonly options;
+    private readonly observer;
+    private readonly blockIds;
+    private readonly idFor;
+    private readonly listeners;
+    private readonly handleSelectionChange;
+    private readonly handleResize;
+    /** document 에 붙는다 — destroy() 에서 반드시 떼야 인스턴스가 GC 된다. */
+    private readonly handleDocumentMouseUp;
+    private state;
+    private destroyed;
+    private syncQueued;
+    private lastSerialized;
+    /** 포인터가 올라가 있는 블록. 그 블록의 컨트롤만 드러낸다. */
+    private hoveredBlockId;
+    /** hover 판정을 프레임당 1 회로 묶기 위한 rAF 핸들. */
+    private hoverRaf;
+    /** 라벨 pill 의 등장 애니메이션을 블록이 **바뀔 때만** 다시 재생하기 위한 표식. */
+    private pillBlockId;
+    /**
+     * 편집 이력. 브라우저 기본 undo 는 우리가 직접 한 DOM 조작(블록 이동 · 표
+     * 편집 · 유형 변경) 을 모르기 때문에 자체 스택을 둔다.
+     */
+    private history;
+    /**
+     * 이력 되돌리기가 만든 DOM 변경인지. 이 동안의 변경은 다시 기록하지 않는다
+     * (되돌리기가 스스로를 이력에 쌓으면 되돌리기를 되돌릴 수 없다).
+     */
+    private applyingHistory;
+    /**
+     * 다음 기록의 성격. 구조를 바꾸는 조작은 타이핑과 합쳐지지 않도록
+     * 조작 직전에 이 값을 올려 둔다.
+     */
+    private pendingChangeKind;
+    /** 사용자가 색 다이얼로그에서 직접 고른 색상의 LRU. 에디터 인스턴스 메모리에만 유지. */
+    private recentCustomColors;
+    constructor(options: EditorOptions);
+    /**
+     * 본문 HTML 을 반환한다.
+     *
+     * 두 가지 스타일 전략을 지원한다 (`options.styles`, 기본값은 생성 시
+     * `EditorOptions.htmlStyles`, 그것도 없으면 `'inline'`).
+     *
+     * - `'inline'` — 호출 시점의 테마 변수(--aw-primary 등) 를 읽어 블록 단위
+     *   인라인 스타일에 베이크한다. 스타일시트 없이 어디에 붙여도(이메일 본문,
+     *   다른 페이지) 에디터에서 보이는 그대로 렌더된다.
+     * - `'class'` — 테마 스타일을 베이크하지 않고 `aw-block-*` / `aw-align-*`
+     *   클래스만 남긴다. `style` 속성을 지우는 서버 sanitizer 아래에서 서식을
+     *   보존해야 할 때 쓴다. 출력은 `aeriz-wysiwyg.min.css` 를 로드한 페이지의
+     *   `.aeriz-wysiwyg > .aw-content` 안에 넣는 것을 전제로 한다.
+     *
+     * 어느 쪽이든 에디터 내부 DOM 은 변형되지 않으며(clone 트리에 적용),
+     * data-block-kind / data-block-focused 같은 에디터 전용 속성과 리사이즈
+     * 핸들 · 정렬 컨트롤 같은 편집 보조 마크업은 출력에서 제거된다.
+     * data-block-id 는 보존.
+     */
+    getHTML(options?: SerializeHtmlOptions): string;
+    /** 가공 없는 원본 innerHTML. 직렬화 검증/디버그 용도. */
+    getRawHTML(): string;
+    setHTML(html: string): void;
+    focus(): void;
+    setTheme(theme: 'light' | 'dark'): void;
+    getState(): EditorState;
+    getBlocks(): Block[];
+    /**
+     * 본문 블록들을 직렬화 가능한 BlockSnapshot 배열로 반환한다.
+     * AerizViewer.setBlocks(snapshots) 가 받아 동일한 트리를 렌더할 수 있다.
+     */
+    serialize(): BlockSnapshot[];
+    /**
+     * data-block-id 로 본문에서 블록을 찾아 반환. 없으면 null.
+     */
+    findBlockById(id: string): Block | null;
+    getActiveBlock(): Block | null;
+    /**
+     * 블록 유형을 변경/추가한다.
+     * - `targetBlockId` 지정 시 그 id 의 블록을 강제 대상으로 한다 (다이얼로그
+     *   확인 등으로 선택이 다른 곳으로 넘어간 뒤에도 원래 블록을 정확히 변환).
+     * - 미지정 시 현재 active block 사용. 둘 다 없으면 본문 끝에 새 블록 추가.
+     */
+    setBlockType(kind: BlockKind, attrs?: BlockAttrs, targetBlockId?: string): void;
+    private replaceBlock;
+    private appendBlock;
+    onStateChange(listener: EditorStateListener): () => void;
+    destroy(): void;
+    /**
+     * DOM 변화 후 호출되는 reconcile 진입점.
+     * 누락된 data-block-id 를 채우고, 자기 쓰기로 발생한 옵저버 레코드를
+     * takeRecords 로 흡수한 뒤 onChange + queueSync.
+     */
+    private flush;
+    /**
+     * 지금 본문을 이력에 기록한다.
+     *
+     * 되돌리기가 만든 변경은 기록하지 않는다 — 자기 자신을 이력에 쌓으면
+     * 되돌리기를 되돌릴 수 없다.
+     */
+    private recordHistory;
+    /**
+     * 유형이 막 바뀐 블록을 한 번 반짝인다.
+     *
+     * 유형 변경은 결과가 화면 아래쪽(들여쓰기 · 글꼴 · 배경) 에서 조용히 일어나
+     * "눌리긴 한 건가" 싶을 때가 있다. 짧은 하이라이트 하나로 어느 블록이
+     * 바뀌었는지가 분명해진다.
+     *
+     * 표식은 `data-block-flash` 속성이다 — class 로 걸면 사용자 컨텐츠의 class 에
+     * 섞여 `getHTML()` 로 새어 나갈 수 있다. data-block-* 는 출력 단계에서
+     * 통째로 제거되는 에디터 전용 네임스페이스다.
+     *
+     * 속성을 넣고 뺄 때마다 옵저버 레코드를 흡수한다. 이걸 빠뜨리면 이 표식
+     * 하나가 "문서가 바뀌었다" 로 잡혀 이력에 항목이 하나 더 쌓이고, 되돌리기가
+     * 눈에 보이는 변화 없이 한 번 헛돈다 (실제로 그랬다).
+     */
+    private flashBlock;
+    /**
+     * 이어지는 한 번의 변경을 **구조 변경**으로 표시한다.
+     *
+     * 블록 이동 · 유형 변경 · 표 편집처럼 사용자가 "한 번에 하나씩" 되돌리길
+     * 기대하는 조작 직전에 부른다. 이 표시가 없으면 직전 타이핑과 한 항목으로
+     * 합쳐져 Ctrl+Z 한 번에 둘 다 사라진다.
+     */
+    private markStructuralChange;
+    /** 되돌리기. 되돌릴 것이 없으면 아무 일도 하지 않는다. */
+    undo(): void;
+    /** 다시 실행. */
+    redo(): void;
+    private applyHistoryEntry;
+    private handleToolbarAction;
+    /**
+     * 선택 영역의 인라인 서식을 지운다. 블록 유형은 건드리지 않는다 —
+     * "서식 지우기" 로 제목이 본문이 되면 되돌릴 방법을 찾기 어렵다.
+     */
+    private clearInlineFormat;
+    /**
+     * 인라인 마크(bold/italic/underline/strike) 토글. 활성 블록의 allowedMarks
+     * 에 포함되지 않은 마크면 무시. styleWithCSS=true 모드로 deprecated 태그
+     * (<b>/<i>/<u>) 대신 `<span style="font-weight:bold">` 형태가 만들어진다.
+     *
+     * 'strike' 는 execCommand 표준 명령명이 'strikeThrough'.
+     */
+    private applyMark;
+    /**
+     * 색상 선택기에서 받은 색을 LRU 에 누적하고 selection 에 적용한다.
+     * `command` 가 'foreColor' 면 글자색, 'hiliteColor' 면 글 배경색.
+     */
+    private handleColorPick;
+    /**
+     * selection 에 색상을 적용. styleWithCSS=true 모드로 `<span style="color:…">`
+     * 또는 `<span style="background-color:…">` 형태가 만들어진다.
+     * `null` 은 '기본색' — 'inherit' 으로 부모 색을 따라가도록.
+     */
+    private applyColor;
+    /**
+     * 정렬을 활성 블록(또는 표 셀) 에 적용한다.
+     *
+     * execCommand('justify*') 는 일부 브라우저에서 blockquote 안의 <p> 에 적용
+     * 시 blockquote 를 <div style="text-align:..."> 로 바꿔버리는 잘 알려진
+     * 버그가 있어 직접 DOM 조작으로 대체한다.
+     *
+     * 적용 대상:
+     *   paragraph / heading → element 자체
+     *   blockquote          → 안의 <p> (없으면 자기 자신)
+     *   table 단일 셀       → 캐럿이 들어 있는 td/th
+     *   table 다중 셀 마킹  → 각 cell.style.textAlign 일괄
+     */
+    private applyAlign;
+    /** 캐럿이 들어 있는 표 셀(td/th) 반환. 표 밖이면 null. */
+    private getActiveTableCell;
+    /**
+     * 현재 활성 셀(들) 을 반환한다.
+     *  1순위: 커스텀 드래그-셀렉션으로 마킹된 `.aw-cell-selected` 셀들
+     *  2순위: 브라우저 selection range 가 가리키는 표 셀(들)
+     *  3순위: 캐럿이 들어 있는 단일 셀
+     */
+    private getSelectedTableCells;
+    private cellSelStart;
+    private cellSelDrag;
+    private handleCellSelStart;
+    private handleCellSelMove;
+    private handleCellSelEnd;
+    /** `.aw-cell-selected` 마킹을 모두 제거. */
+    private clearCellSelection;
+    /**
+     * 표 셀 배열 각각에 `cell.style.fontSize` 를 직접 설정. Range API 의 wrap
+     * 경로(셀 중첩 버그 발생) 를 우회하기 위한 안전한 다중 셀 적용 경로.
+     */
+    private applyFontSizeToCells;
+    /**
+     * 캡처해 둔 셀(들) 에 배경색을 일괄 적용. null 이면 inline background-color
+     * 제거. `<th>` 의 stylesheet 배경(0,1,2 specificity) 보다 inline + !important
+     * 가 항상 우선하도록 setProperty('important') 로 박는다.
+     */
+    private applyCellBgToCells;
+    /** 표 편집 드롭다운에서 받은 액션을 분기 실행. */
+    private runTableMenu;
+    /** 활성 셀의 행 위/아래에 새 행 삽입. 같은 열 수, 빈 td 로 채움. */
+    private insertRow;
+    /** 활성 셀이 속한 열의 좌/우에 새 열 삽입. 모든 행에 빈 td 추가. */
+    private insertColumn;
+    /** 활성 셀의 행 전체 삭제. 마지막 행이면 보존(빈 표 회피). */
+    private deleteRow;
+    /**
+     * 코드 블록 input 마다 호출되는 debounced rehighlight. 활성 블록이 codeBlock
+     * 이고 data-language 가 설정돼 있을 때만 동작 — 타이핑 멈춘 뒤 300ms 후 1 회.
+     */
+    private codeHighlightTimer;
+    private scheduleCodeHighlight;
+    /**
+     * code 블록의 언어를 변경하고 즉시 highlight 를 다시 적용. 캐럿 위치는
+     * 텍스트 offset 으로 보존.
+     */
+    private applyCodeLanguage;
+    /**
+     * `<code>` element 의 텍스트를 highlight 후 innerHTML 로 갱신. 셀렉션이
+     * code 안에 있다면 textContent offset 으로 caret 위치 보존.
+     */
+    private rehighlightCode;
+    /**
+     * 본문에서 모든 codeBlock 을 순회하며 highlight 적용. setHTML / 초기 로드
+     * / 외부 import 후 호출.
+     */
+    private rehighlightAllCodeBlocks;
+    /** 활성 셀의 열 전체 삭제. 마지막 열이면 보존(빈 표 회피). */
+    private deleteColumn;
+    /**
+     * 마우스 이동 시 셀 우/하 가장자리에서 col-resize / row-resize 커서 표시.
+     * 드래그 진행 중에는 별도 핸들러가 cursor 를 관리하므로 skip.
+     */
+    private handleTableCursor;
+    private tableResize;
+    /**
+     * 셀 가장자리 / 이미지·유튜브 리사이즈 핸들 mousedown 진입점.
+     * - 셀: 우(col-resize) / 하(row-resize) 가장자리 6px 영역
+     * - 이미지·유튜브: 우하단 `.aw-resize-handle` element (corner resize)
+     */
+    private handleTableResizeStart;
+    private handleTableResizeMove;
+    /**
+     * 체크리스트 항목의 체크 표시 토글.
+     *
+     * 체크박스는 실제 element 가 아니라 `<li>` 의 `::before` 다 — 폼 요소를
+     * contentEditable 안에 두면 캐럿이 그 안으로 들어가고 서버 sanitizer 가
+     * 지워 버린다. 그래서 클릭 좌표가 그 표시 영역 안인지 직접 따진다.
+     *
+     * `click` 이 아니라 `mousedown` 에서 처리한다 — click 까지 기다리면 그
+     * 사이에 캐럿이 항목 안으로 들어가 화면이 한 번 흔들린다.
+     */
+    private handleTaskToggle;
+    /**
+     * 이미지 캡션(`<figcaption>`) 에 캐럿을 둔다. 없으면 만든다.
+     *
+     * 버튼은 토글이 아니다 — 다시 눌러 캡션을 지우면 사용자가 쓴 글이 말없이
+     * 사라진다. 캡션을 없애는 방법은 글자를 지우는 것이고, 빈 캡션은 캐럿이
+     * 떠난 뒤 `normalizeContent` 가 알아서 걷어낸다.
+     */
+    private focusImageCaption;
+    /**
+     * 이미지/유튜브 좌상단 정렬 컨트롤 클릭 핸들러. data-align 에 따라 wrapper
+     * 의 marginLeft / marginRight 를 조정 — left/center/right.
+     */
+    private handleBlockAlignClick;
+    /**
+     * 이미지 / 유튜브 wrapper 의 너비를 드래그로 조정. 높이는 자동 (이미지는
+     * 종횡비 유지, 유튜브는 CSS aspect-ratio 16/9). mouseup 에서 cursor 복귀
+     * + flush.
+     *
+     * 너비는 본문 안쪽 폭을 상한으로 한다. 상한이 없으면 오른쪽으로 계속 끌 때
+     * wrapper 가 본문보다 넓어지고, 그만큼 에디터 전체가 가로로 늘어난다
+     * (드래그를 멈춰도 늘어난 상태가 남는다).
+     */
+    private startBlockResize;
+    /**
+     * 본문의 padding 을 제외한 실제 컨텐츠 폭. 블록 리사이즈의 상한이다.
+     * 에디터가 아주 좁을 때도 최소 폭은 확보되도록 하한을 둔다.
+     */
+    private contentInnerWidth;
+    private currentTheme;
+    /**
+     * 선택 영역에 글꼴을 적용한다.
+     * `styleWithCSS=true` 모드의 execCommand('fontName') 가 `<font face=…>` 대신
+     * `<span style="font-family: …">` 를 생성하도록 강제한다. selection 이
+     * 비어 있으면(캐럿만) 다음 입력 글꼴이 결정된다(브라우저 기본 동작).
+     */
+    private applyFontFamily;
+    /**
+     * 현재 selection 의 anchor 노드 기준 computed font-family 를 읽어 알려진
+     * FONT_FAMILIES id 와 매칭. 글꼴 드롭다운의 active 표시에 사용.
+     */
+    private detectActiveFontId;
+    /**
+     * 선택 영역에 글자 크기를 적용한다. execCommand('fontSize') 는 1~7 만 받기
+     * 때문에 px 적용을 위해 Range API 로 직접 `<span style="font-size: Xpx">`
+     * wrap 한다.
+     *
+     * **다중 셀 선택**(커스텀 마킹 또는 셀 경계를 넘는 browser range) 의 경우엔
+     * Range.extractContents 가 셀들을 묶어 한 셀 안에 끼워넣는 셀 중첩 버그가
+     * 있어 — 셀별로 `cell.style.fontSize` 를 직접 설정하는 안전한 경로를 사용.
+     */
+    private applyFontSize;
+    /**
+     * 현재 selection 의 anchor 노드 기준 computed font-size 를 px 정수로 읽어
+     * FONT_SIZES 의 값과 일치할 때만 반환. 글자 크기 드롭다운의 active 표시에
+     * 사용.
+     */
+    private detectActiveFontSize;
+    /**
+     * 블록 유형 드롭다운을 열어 사용자 선택 결과를 처리한다.
+     * 툴바의 blockType 버튼 / 활성 블록 라벨 pill 양쪽 진입점이 동일한 분기
+     * 로직(리치 블록 다이얼로그 분기 + targetId 보존) 을 공유한다.
+     */
+    private openBlockTypeMenu;
+    /**
+     * 링크 다이얼로그를 열어 URL/텍스트를 받은 뒤 linkCard 블록으로 변환/추가.
+     * 표시 텍스트가 비어 있으면 URL 을 텍스트로 사용. `targetId` 가 있으면
+     * 그 id 의 블록을 정확히 변환 대상으로 삼는다.
+     */
+    private openLinkDialogAndApply;
+    /**
+     * 이미지 다이얼로그(임베드/URL/업로드)를 열어 src 를 받은 뒤 image 블록으로
+     * 변환/추가.
+     */
+    private openImageDialogAndApply;
+    /**
+     * 유튜브 다이얼로그를 열어 URL 을 받고, 영상 ID 를 추출해 youtube 블록으로
+     * 변환/추가. 잘못된 URL 이면 무시.
+     */
+    private openYouTubeDialogAndApply;
+    /**
+     * HTML 가져오기 다이얼로그를 열어 사용자가 고른 HTML 을 iframe 으로 로드/
+     * 처리한 뒤 본문에 element 들을 삽입한다.
+     *
+     * - `targetId` 가 있으면 그 블록 바로 뒤에 삽입, 없으면 본문 끝에 append.
+     * - 삽입된 element 는 MutationObserver flush 가 새 data-block-id 를 발급.
+     */
+    private openImportHtmlDialogAndApply;
+    /**
+     * Markdown 가져오기 다이얼로그를 열어 사용자가 입력한 markdown 을 파싱해
+     * 본문에 element 들을 삽입한다. importHtml 과 동일한 삽입 정책을 따른다.
+     */
+    private openMarkdownImportDialogAndApply;
+    /**
+     * 파일 첨부 다이얼로그(URL/업로드)를 열어 src 를 받은 뒤 file 블록으로
+     * 변환/추가. src 가 비어 있으면 무시. 파일명이 없으면 URL 의 마지막
+     * segment 를 fallback 으로 사용.
+     */
+    private openFileAttachmentDialogAndApply;
+    /**
+     * 파일 업로드 핸들러를 결정. onFileUpload 가 우선, 없으면 fileUploadUrl 에
+     * multipart/form-data POST 후 응답 JSON 의 `url` 필드를 사용. 둘 다 없으면
+     * undefined → 다이얼로그 업로드 탭 비활성.
+     */
+    private resolveFileUploadFn;
+    /**
+     * 이미지 업로드 핸들러를 결정. options.onImageUpload 가 우선이며, 없으면
+     * options.imageUploadUrl 로 multipart/form-data POST 후 응답 JSON 의
+     * `url` 필드를 사용. 둘 다 없으면 undefined → 다이얼로그 업로드 탭 비활성.
+     */
+    private resolveImageUploadFn;
+    private queueSync;
+    private sync;
+    private handleKeyDown;
+    /**
+     * 마크다운 입력 규칙.
+     *
+     * 본문 블록 맨 앞에 `# ` / `- ` / `1. ` / `> ` / ``` 을 치면 그 자리에서
+     * 블록 유형이 바뀌고 방아쇠 문자는 사라진다. 메뉴를 열지 않고 글을 쓰던
+     * 흐름 그대로 유형을 고르는 길이다.
+     *
+     * 조건을 좁게 잡는다 — **본문 블록**에서, **캐럿이 그 텍스트 바로 뒤**에
+     * 있을 때만. 그렇지 않으면 이미 쓴 문단 중간에서 "- " 를 고치다가 블록이
+     * 통째로 바뀌는 사고가 난다.
+     */
+    private handleInputRule;
+    /**
+     * 글머리 목록 항목에서 `[ ] ` / `[x] ` 를 알아보고 체크리스트로 바꾼다.
+     *
+     * `setBlockType` 을 쓰지 않는다 — 그 경로는 항목들을 `<br>` 로 이어 붙여
+     * 한 덩어리로 만들기 때문에, 항목이 여럿인 목록에서 줄이 뭉개진다. 목록
+     * 구조는 그대로 두고 클래스만 올린다.
+     */
+    private applyTaskItemRule;
+    /**
+     * 블록 단축키. 처리했으면 `true`.
+     *
+     * 유형 변경은 `Ctrl/Cmd + Alt + 숫자` 다 — 구글 문서 · 노션이 같은 자리를
+     * 쓰기 때문에 손이 이미 알고 있는 배열이고, 브라우저 기본 단축키
+     * (Ctrl+숫자 = 탭 전환) 와 겹치지 않는다. 어느 유형의 블록에서든 다른
+     * 유형으로 바로 넘어간다.
+     *
+     *   Ctrl+Alt+0        본문          Ctrl+Alt+1~6   제목 1~6
+     *   Ctrl+Alt+7        번호 목록     Ctrl+Alt+8     글머리 목록
+     *   Ctrl+Alt+9        인용구        Ctrl+Alt+C     코드 블록
+     *   Ctrl+Shift+↑/↓    블록 이동     Ctrl+Shift+D   블록 삭제
+     *
+     * 이동과 삭제는 캐럿이 어디 있든 **블록 단위**로 동작한다. 지금까지는
+     * 드래그 핸들을 잡는 것 말고는 블록을 옮길 방법이 없었다.
+     */
+    private handleBlockShortcut;
+    /**
+     * 활성 블록을 위/아래 형제와 자리바꿈한다. 문서 끝에서는 아무 일도 하지
+     * 않는다 — 경고 없이 조용히 멈추는 편이 캐럿을 잃는 것보다 낫다.
+     */
+    private moveActiveBlock;
+    /**
+     * 활성 블록을 지우고 캐럿을 이웃 블록으로 옮긴다.
+     *
+     * 마지막 블록을 지우면 `normalizeContent` 가 빈 본문 블록을 다시 만든다 —
+     * 본문이 블록 없는 상태로 남지 않는다.
+     */
+    private deleteActiveBlock;
+    /**
+     * Tab 처리. 처리했으면 `true`.
+     *
+     * - 표 안: 다음(Shift 면 이전) 셀로 캐럿 이동. 마지막 셀에서 Tab 은 새 행을
+     *   만든다 — 표를 채워 넣을 때 손이 마우스로 갈 일이 없어진다.
+     * - 목록 안: `indent` / `outdent` 로 한 단계 들여쓰기. 중첩 목록을 만들
+     *   방법이 이것 말고는 없었다(마크다운으로 가져온 중첩 목록은 편집만 가능).
+     */
+    private handleTabKey;
+    /**
+     * Backspace 처리. 처리했으면 `true`.
+     *
+     * 비어 있는 제목 · 인용구 · 코드 블록 · 목록의 맨 앞에서 Backspace 를 누르면
+     * **본문 블록으로 되돌린다.** 유형을 잘못 골랐을 때 되돌리는 가장 자연스러운
+     * 동작이고, 브라우저 기본 동작(앞 블록에 병합) 이 만들어 내는 이상한 중첩
+     * (제목 안에 목록이 들어가는 등) 도 함께 피한다.
+     */
+    private handleBackspaceKey;
+    /**
+     * 활성 블록 뒤에 새 빈 **본문 블록**을 만들고 캐럿을 그 안에 둔다.
+     * 인용구 / 코드 블록의 Enter 탈출, 제목 끝 Enter 에 사용.
+     */
+    private exitBlockOnEnter;
+    private syncBlockHandles;
+    /**
+     * 컨트롤(드래그 핸들 · 단락 추가) 은 **지금 다루고 있는 블록** 에만 보인다.
+     * 포인터가 놓인 블록과 캐럿이 있는 블록 두 가지가 그 대상이다.
+     *
+     * 예전에는 본문에 포인터만 올라가면 모든 블록의 핸들이 한꺼번에 흐리게
+     * 떠올랐다. 글이 길어질수록 왼쪽에 점 세 개짜리 기둥이 생겨서, 정작 어느
+     * 블록을 잡는 손잡이인지가 안 보였다.
+     */
+    private syncHandleVisibility;
+    private readonly handleHoverMove;
+    private readonly handleHoverLeave;
+    private setHoveredBlock;
+    /**
+     * 뷰포트 y 좌표가 걸치는 블록의 id. 좌표가 블록들 사이의 여백이면 가장
+     * 가까운 블록으로 붙인다 — 문단 사이 간격에서 컨트롤이 깜빡이지 않게.
+     */
+    private blockIdAtViewportY;
+    private repositionHandles;
+    private positionHandle;
+    private createBlockHandle;
+    /**
+     * `blockId` 의 블록 뒤에 빈 단락을 삽입하고 캐럿을 그 단락으로 이동.
+     * MutationObserver flush 가 새 단락에 신규 data-block-id 를 발급한다.
+     */
+    private insertParagraphAfter;
+    private handleDragOver;
+    private handleDrop;
+    private handleDragLeave;
+    private findDropTarget;
+    private showDropIndicator;
+    private hideDropIndicator;
+    /**
+     * 본문 블록들에 data-block-kind / data-block-label 을 갱신하고,
+     * 활성 블록에 data-block-focused 를 표기한다. CSS 가 이 속성을 읽어
+     * 포커스 인디케이터와 라벨 태그를 그린다.
+     *
+     * 자기 쓰기로 발생한 attributes 레코드는 takeRecords 로 흡수.
+     */
+    /**
+     * 활성 블록 위쪽에 떠 있는 인터랙티브 라벨 pill 갱신.
+     * - 활성 블록이 없으면 숨김
+     * - 활성 블록의 라벨 텍스트로 갱신, 위치를 블록 상단에 맞춤
+     * - 클릭 시 openBlockTypeDropdown 가 열려 블록 유형을 즉시 변경 가능
+     */
+    private syncBlockLabelPill;
+    /**
+     * 하단 Status Bar 갱신.
+     * - 좌측: 활성 블록 라벨 + id (없으면 — )
+     * - 우측: 총 블록 수, 본문 글자 수(공백 제외)
+     */
+    private syncStatusBar;
+    /**
+     * 되돌리기 / 다시 실행 버튼의 활성 상태.
+     *
+     * 누를 수 없는 버튼이 누를 수 있는 것처럼 보이면, 눌러 보고 아무 일도 안
+     * 일어나는 경험을 준다. 이력 끝에 닿았다는 사실 자체가 정보다.
+     */
+    private syncHistoryButtons;
+    private syncBlockMarkers;
+    private applyToolbarState;
+}
+// (소스맵은 CJS 선언 사본에서 제외됨 — scripts/finalize-types.mjs)