/** * 프레임워크 어댑터 공통 코어. * * React / Vue / Svelte / Angular / jQuery / Web Component 어댑터는 모두 이 * 모듈의 컨트롤러 위에 얇게 올라간다. 각 프레임워크가 다르게 처리해야 하는 * 것은 "언제 update() 를 부르고 언제 destroy() 를 부르는가" 뿐이고, * 값 바인딩 · 캐럿 보존 · 재생성 판단 같은 실제 로직은 여기 한 곳에만 있다. * * 핵심 규칙 두 가지: * * 1. **캐럿 보존** — 외부에서 들어온 `value` 가 에디터의 현재 출력과 같으면 * `setHTML()` 을 부르지 않는다. 부르면 DOM 이 통째로 교체되어 캐럿이 문서 * 맨 앞으로 튀고, 한국어 조합 중 입력이 끊긴다. * 2. **되울림 차단** — 프로그램적 `setHTML()` 이 만든 변경은 `onChange` 로 * 다시 내보내지 않는다. 부모의 상태 갱신이 다시 prop 으로 내려와 무한 왕복이 * 되는 경로를 원천 차단한다. */ import { AerizEditor, AerizViewer } from '@aeriz/wysiwyg'; import type { BlockSnapshot, EditorOptions, EditorState, ViewerOptions } from '@aeriz/wysiwyg'; /** * 모든 어댑터가 공유하는 에디터 prop 집합. * * `EditorOptions` 에서 프레임워크가 스스로 관리하는 두 항목만 뺀 것이다. * - `element` — 어댑터가 마운트 노드를 직접 만든다. * - `onChange` — 컨트롤러가 감싼 뒤 최신 콜백으로 위임한다. */ export interface AerizEditorProps extends Omit { /** * 양방향 바인딩용 HTML. 지정하면 `initialHTML` 보다 우선한다. * 값이 에디터의 현재 출력과 다를 때만 본문이 교체된다. */ value?: string; /** 사용자 편집으로 본문이 바뀔 때 호출. 프로그램적 설정에서는 호출되지 않는다. */ onChange?: (html: string) => void; /** 블록/선택 상태가 바뀔 때 호출. 커스텀 툴바를 만들 때 쓴다. */ onStateChange?: (state: EditorState) => void; /** 인스턴스가 만들어진 직후 1회 호출. 명령형 API 접근 경로. */ onReady?: (editor: AerizEditor) => void; /** 인스턴스가 파괴되기 직전 1회 호출. */ onDestroy?: (editor: AerizEditor) => void; } /** 뷰어 어댑터 공통 prop. */ export interface AerizViewerProps extends Omit { /** 표시할 블록 상태. `html` 보다 우선한다. */ blocks?: BlockSnapshot[]; /** 블록 대신 HTML 문자열로 넣을 때 사용. 내부에서 블록으로 변환된다. */ html?: string; onReady?: (viewer: AerizViewer) => void; onDestroy?: (viewer: AerizViewer) => void; } export interface AerizEditorController { /** * 현재 에디터 인스턴스. 재생성(`toolbar`/`locale` 변경) 시 교체되므로 * 장기 보관하지 말고 매번 읽어야 한다. */ readonly editor: AerizEditor; /** 새 prop 을 반영한다. 바뀐 항목만 최소 비용으로 적용된다. */ update(next: AerizEditorProps): void; destroy(): void; } export interface AerizViewerController { readonly viewer: AerizViewer; update(next: AerizViewerProps): void; destroy(): void; } /** * HTML 문자열을 `BlockSnapshot[]` 로 변환한다. * * `AerizViewer` 는 상태 모델만 받으므로, HTML 을 들고 있는 호출자를 위한 * 다리 역할을 한다. 에디터 본문과 같은 정규화 경로(`normalizeContent` → * `listBlocks` → `serializeBlocks`) 를 타므로 결과 트리도 동일하다. */ export declare function htmlToBlocks(html: string): BlockSnapshot[]; /** * 프레임워크 중립 에디터 컨트롤러를 만든다. * * `host` 안에 에디터를 마운트한다. `host` 의 기존 자식은 * `AerizEditor` 생성자가 비운다. */ export declare function createEditorController(host: HTMLElement, initialProps: AerizEditorProps): AerizEditorController; /** 프레임워크 중립 뷰어 컨트롤러를 만든다. */ export declare function createViewerController(host: HTMLElement, initialProps: AerizViewerProps): AerizViewerController; //# sourceMappingURL=shared.d.ts.map