reopt designreopt design
DocsExploreToolsPricingBuilder
로그인
시작하기
시작하기
Playground
핵심 개념
핵심 개념
Editor
Editor 개요
블록 타입
스트리밍
Markdown 변환
구축·운영
Skills
앱 조합 가이드
AI 연동
Authoring 플레이북
커스텀 블록
릴리즈 노트
Oopt-editor
reopt designreopt design

AI 시대를 위한 디자인 시스템

  • 문서
  • 가격
  • 릴리즈 노트
  • GitHub
  • 서비스 약관
  • 개인정보처리방침

주식회사 리옵트사업자등록번호 217-88-02453contact@reopt.ai

© 2026 reopt Inc. All rights reserved.

구축·운영
  1. 문서
  2. /
  3. 구축·운영
  4. /
  5. 릴리즈 노트

릴리즈 노트

opt-editor 변경 이력만 따로 모아서 확인할 수 있도록 패키지 기준으로 정리했습니다.

reopt design · 업데이트 2026년 8월 2일

시작하기Playground핵심 개념개요블록 타입스트리밍Markdown 변환Skills앱 조합 가이드AI 연동Authoring 플레이북커스텀 블록릴리즈 노트

1. 포함 범위

  • 이 페이지는 @reopt-ai/opt-editor 변경만 보여줍니다.
  • 같은 버전에서 opt-datagrid 가 함께 배포된 경우에도 여기에는 Editor 관련 항목만 남깁니다.
  • AI 연동, streaming, custom block 변화는 각 세부 문서와 함께 보면 영향 범위를 더 빨리 파악할 수 있습니다.

2. 버전별 변경 이력

v1.13.0

2026-07-29LatestBreaking Changes
@reopt-ai/opt-editor@2.0.0

Zod 런타임 스키마를 /server에서 전용 /schemas 엔트리로 분리 / 직렬화 XSS·round-trip 보존, 스트림 resume·abort, 히스토리·diff 정합성과 편집 접근성 개선

  • !
    Zod 런타임 스키마를 /server에서 전용 /schemas 엔트리로 분리(opt-editor)

    patchOpSchema, createEditorOperationSchema 등 런타임 스키마는 @reopt-ai/opt-editor/schemas에서 가져옵니다. /ai-sdk 재노출과 type-only export는 유지됩니다.

  • ~
    직렬화 XSS·round-trip 보존, 스트림 resume·abort, 히스토리·diff 정합성과 편집 접근성 개선(opt-editor)

마이그레이션 가이드

opt-editor 런타임 스키마 import 변경: `@reopt-ai/opt-editor/server` → `@reopt-ai/opt-editor/schemas`. `@reopt-ai/opt-editor/ai-sdk` import와 type-only export는 변경되지 않습니다.

v1.10.2

2026-07-11
@reopt-ai/opt-editor@1.1.2

heading 레벨이 노출되는 모든 에디터 표면(마크다운 # 단축·인라인 툴바·블록 툴바·AI 프롬프트 예시)을 카탈로그 단일 출처에서 파생시켜, 소비자가 본문 H1을 봉인할 수 있게 했습니다. levels를 선언하지 않은 기존 카탈로그는 1.1.1과 동일하게 동작합니다.

  • +
    heading 허용 레벨 단일 출처 — BlockDefinition.levels(opt-editor)

    heading 블록 정의에 levels?: number[](기본 [1,2,3])를 선언하면 모든 heading 레벨 표면이 이를 따릅니다. getHeadingLevels(catalog)·clampHeadingLevel(level, levels)·DEFAULT_HEADING_LEVELS를 export합니다. slash 메타와 독립적이라 메뉴에 없어도 레벨 허용이 가능합니다.

  • ^
    마크다운 # 단축이 허용 레벨로 클램프(opt-editor)

    입력한 # 개수가 허용 목록 밖이면 가장 가까운 허용 레벨로 클램프합니다(levels=[2,3]에서 # → 제목 2, #### → 제목 3). 변환 자체를 버리지 않고 제목을 만들려는 사용자 의도를 보존합니다.

  • ^
    인라인 툴바·블록 툴바 변환 옵션이 허용 레벨만 노출(opt-editor)

    허용 레벨의 H 버튼과 변환 항목만 렌더하고 변환도 허용 레벨로만 전환합니다. 비허용 레벨 heading을 선택해도 활성 표시가 나타나지 않습니다.

  • ^
    AI operations 프롬프트 예시를 최소 허용 레벨로 생성(opt-editor)

    catalog.prompt()의 heading 예시가 heading 정의의 최소 허용 레벨(≥2 우선)을 읽어 생성됩니다. 기본 카탈로그도 level 1 예시를 level 2로 바꿔 문서가 H1로 시작하도록 학습되는 것을 차단합니다.

v1.10.1

2026-07-10
@reopt-ai/opt-editor@1.1.1

1.1.0 실측에서 발견된 슬래시 메뉴 마우스 선택 버그(F1)를 수정하고, 소비자 커스텀 블록의 슬래시 메뉴 아이콘 메타(F2)를 추가했습니다.

  • ~
    슬래시 메뉴 마우스 선택 시 포커스 블록 유실 수정(opt-editor)

    옵션 클릭이 contentEditable을 blur시켜 블록이 문서 끝에 삽입되던 문제. 옵션 mousedown preventDefault로 포커스를 보존하고, onInsertBlock에 슬래시 트리거 블록 폴백을 추가해 이중 방어합니다. MentionPicker 옵션에도 동일 가드를 적용했습니다.

  • +
    SlashMenuMeta.icon — 커스텀 블록 슬래시 아이콘(opt-editor)

    slash 메타에 icon(짧은 텍스트/이모지)을 지정하면 메뉴에 렌더됩니다. 미지정 시 내장 글리프 맵 → "?" 순 폴백.

v1.10.0

2026-07-10
@reopt-ai/opt-editor@1.1.0

opt-editor Notion 패리티 P0 — catalog 파생 슬래시 메뉴, 체크리스트 블록, 인라인 마크 3종(밑줄·형광펜·글자색), @멘션, specToPlainText와 함께 코드 블록 Enter·복합 마크·IME 가드 등 기본 편집 버그를 수정했습니다.

  • +
    슬래시 메뉴 catalog 파생 전환(opt-editor)

    BlockDefinition.slash 메타에서 메뉴를 파생해 소비자 커스텀 블록도 자동 노출됩니다. 그룹 헤더(기본/미디어/고급)와 한글 키워드 검색, 컨테이너 draft로 리스트·표·할 일을 자식 포함 원자 삽입합니다.

  • +
    todo-list/todo-item 체크리스트 블록(opt-editor)

    읽기 모드 포함 클릭 토글, `[] ` 마크다운 단축, `- [x]` 마크다운 왕복을 지원합니다. 빈 항목 Enter는 리스트를 이탈하고 첫 항목 Backspace는 paragraph로 승격됩니다(list 계열 공통).

  • +
    인라인 마크 확장 — underline·highlight·color(opt-editor)

    인라인 툴바 팔레트(9토큰)와 Cmd+U/Cmd+Shift+H 단축키, 직렬화 삼형제 왕복을 지원합니다. 팔레트 토큰 검증으로 마크업 인젝션을 차단합니다.

  • +
    @멘션 + 내부 페이지 링크 (provider 주입)(opt-editor)

    `@`/`[[` 트리거 픽커의 후보를 onMentionSearch(kind, query)로 주입하고, `[label](mention://kind/id)`로 직렬화합니다. 읽기 렌더는 renderMention 슬롯으로 교체 가능합니다.

  • +
    specToPlainText 신설 — 직렬화 삼형제 완성(opt-editor)

    검색 인덱싱·AI 컨텍스트용 plain 직렬화를 제공합니다. 마크 제거, 코드 원문 유지, 이미지 alt/caption, 테이블 탭 구분.

  • ~
    기본 편집 P0 버그 수정(opt-editor)

    코드 블록 Enter 무반응, bold+italic 복합 마크 편집 소실, 링크 내부 커서 off-by-one, IME 조합 중 외부 패치/구조 단축키의 조합 파괴를 수정했습니다.

  • ^
    붙여넣기·복사·undo 개선(opt-editor)

    HTML 붙여넣기 서식 보존(htmlToMarkdown), 이미지 다중 붙여넣기, 단일 블록 마크 보존 복사, undo 배치 하드 캡(maxBatchDuration), readOnly/autoFocus prop, Cmd+K 링크, 인라인 툴바 viewport 클램핑.

v1.8.2

2026-06-22
@reopt-ai/opt-editor@1.0.4

@reopt-ai/opt-editor@1.0.4 — standalone examples와 editor roundtrip 안정화

  • ^
    @reopt-ai/opt-editor@1.0.4 — standalone examples와 editor roundtrip 안정화(opt-editor)

    showcase workflow, markdown/spec roundtrip, operations compiler, block interaction 흐름을 보강하고 API docs 7개 파일을 재생성했습니다.

v1.8.1

2026-06-18
@reopt-ai/opt-editor@1.0.3

@reopt-ai/opt-editor@1.0.3 — AI SDK UI message data-editor-patch 스트림 안정화

  • ^
    @reopt-ai/opt-editor@1.0.3 — AI SDK UI message data-editor-patch 스트림 안정화(opt-editor)

    writeEditorPatch/writeEditorPatches가 stable id/transient metadata를 지원하고, useEditorChatBridge가 part id 기준 중복 적용을 방지합니다. AI SDK SSE data part 파싱과 성능 예산 테스트를 추가했습니다.

v1.8.0

2026-06-13
@reopt-ai/opt-editor@1.0.2

@reopt-ai/opt-editor@1.0.2 — structural-sharing 트리 + per-block selection 성능 개선

  • ^
    @reopt-ai/opt-editor@1.0.2 — structural-sharing 트리 + per-block selection 성능 개선(opt-editor)

마이그레이션 가이드

opt-harness 사용처는 @reopt-ai/opt-shell로 교체하고 Harness* 식별자를 Shell*로 변경하세요. 하네스 감사 도구는 @reopt-ai/opt-cli의 ./audit에서 import합니다.

v1.7.0

2026-05-15
@reopt-ai/opt-editor@1.0.1

static-renderer indent를 CSS variable로 토큰화 + opt-inspect → opt-devtool rename + lint 24건 정리

  • ^
    static-renderer indent를 CSS variable로 토큰화 + opt-inspect → opt-devtool rename + lint 24건 정리(opt-editor)
    StaticRendererEditor Playground

마이그레이션 가이드

1. @reopt-ai/opt-palette를 직접 설치할 필요는 없음 (opt-ui transitively dep). 2. 테마 프리셋 corporate/playful 사용 중이면 mono-dark 또는 다른 프리셋으로 교체. 3. @reopt-ai/opt-ui-cli → @reopt-ai/opt-cli로 패키지 교체 (CLI 진입점은 동일하게 `opt`). 4. data-opt-id 사용 시 ./id-registry sub-export 활용 가능.

v1.6.0

2026-04-09Breaking Changes
@reopt-ai/opt-editor@1.0.0

opt-editor 1.0.0 — diff 모드 정식 추가, suggestion overlay(블록 강조/플로팅 diff), 블록 단위 승인·거절 UX 및 Playground 검증 흐름 강화

  • !
    EditorMode 확장: "stream" | "edit" | "diff" (major)(opt-editor)

    소비자 앱의 exhaustive mode 분기(switch 등)에 diff 분기 추가 필요. README/CHANGELOG에 major 변경으로 명시.

    EditorEditorProviderEditorMode
  • +
    SuggestionDecorations(옵트인) 추가 — 변경 블록 강조, 배지, hover 플로팅 diff 카드(opt-editor)

    블록 단위 approve/reject 액션과 i18n 라벨 지원. hover close delay 100ms로 조정해 overlay 사용성 개선.

    SuggestionDecorationsEditorstyles.css
  • +
    Diff review 흐름 강화 — editor/stream/diff 모드 분리 및 Harness/Devtool 연동(opt-editor)

    Playground와 harness adapter에서 diff 시나리오를 검증 가능하게 확장하고, review 중 상태 표시/동작을 정리.

    opt-shell adapteropt-devtool bridgeEditor Playground
  • ~
    suggestion overlay 동작 안정화 — 지연 닫힘 타이밍 및 테스트 동기화(opt-editor)
    suggestion-decorations.test.tsx

v1.5.0

2026-04-08
@reopt-ai/opt-editor@0.10.0

opt-editor 0.10.0 — Vercel AI SDK 통합, EditorOperation 추상화, agent mode tool 지원

  • +
    Vercel AI SDK 통합 — /ai-sdk sub-export (useEditorAI, useEditorCompletion, useEditorChatBridge)(opt-editor)

    createEditorHandler로 서버 Route Handler 4줄 생성, useEditorAI로 클라이언트 2줄. PatchSource 4종 통합 입력, buildEditorPrompt AI SDK 호환.

    useEditorAIuseEditorCompletionuseEditorChatBridgecreateEditorHandler
  • +
    EditorOperation 추상화 — insert/update/remove/move 고수준 연산, 마크다운 content, 자동 ID(opt-editor)

    OperationCompiler가 EditorOperation → JsonPatchOp[] 변환. catalog 기반 블록 타입 검증, 중첩 children 지원 (list, table).

    OperationCompilerOperationStreamCompilercreateOperationStream
  • +
    AI SDK agent mode — getDocument + applyEdits tool로 멀티스텝 편집(opt-editor)

    createEditorTools로 AI SDK tool 정의 생성. createEditorHandler({ mode: 'agent' })로 tool 기반 피드백 루프. AsyncIterable execute로 스트리밍.

    createEditorToolscreateEditorHandler
  • +
    스트리밍 블록 진입 애니메이션 — CSS @starting-style(opt-editor)
    Editor
  • ~
    @starting-style 비중첩 형태로 변환 — 브라우저 호환성 개선(opt-editor)
    Editor
  • -
    extractSSEText, buildAIMessages deprecated — AI SDK 사용 시 불필요(opt-editor)

    buildEditorPrompt()로 대체. extractSSEText는 AI SDK가 SSE 파싱을 처리하므로 불필요.

v1.4.0

2026-04-07
@reopt-ai/opt-editor@0.9.0

opt-editor 0.9.0 — 이미지 편집 버튼 + resourceId 지원, figcaption 너비 버그 수정

  • +
    onImageEdit 콜백 + ImageEditContext — 외부 이미지 편집기(Canva 등) 연동(opt-editor)

    floating toolbar에 편집 버튼 추가. onImageEdit 제공 시 이미지가 있는 블록에서 노출. 현재 이미지 context(blockId, src, resourceId, alt, width, height)를 전달하고 편집 결과로 attrs 업데이트.

    EditorEditorProviderImageBlock
  • +
    resourceId 지원 — ImageAttrs, FileUploadResult에 optional resourceId 필드 추가(opt-editor)

    DAM, S3 키, 버전 관리 등 외부 리소스 식별자. HTML: data-resource-id attribute, Markdown: <!-- resource-id: ... --> comment로 직렬화.

    ImageBlock
  • ^
    onFileRemove에 resourceId 두 번째 파라미터 추가 — 리소스 기반 cleanup 지원(opt-editor)
    EditorProvider
  • ~
    figcaption 인라인 width가 컨테이너를 넘치는 버그 수정 (max-width: 100%)(opt-editor)
    ImageBlock

v0.8.0

2026-03-17
@reopt-ai/opt-editor@0.8.0

opt-editor 0.8.0 — 이미지 블록 확장: AI 프롬프트 placeholder, 미디어 라이브러리, 파일 제거 알림, 리사이즈/프리뷰/클립보드 붙여넣기

  • +
    AI 이미지 프롬프트 placeholder (prompt attr + onImageGenerate 콜백)(opt-editor)

    AI가 이미지 블록을 생성할 때 실제 URL 대신 prompt를 포함하면, 에디터에 프롬프트 placeholder가 표시되고 소비자가 외부 이미지 생성 서비스로 채울 수 있음

    EditorEditorProviderImageBlock
  • +
    onImageBrowse 콜백 — 미디어 라이브러리 모달 확장 포인트(opt-editor)
    EditorProvider
  • +
    onFileRemove 콜백 — 이미지 URL 제거/교체 시 서버 리소스 정리 알림(opt-editor)
    EditorProvider
  • ^
    이미지 블록 기반 기능: 리사이즈 핸들, 프리뷰 모달, 클립보드 붙여넣기, align 직렬화(opt-editor)
    ImageBlock
  • ^
    FileUploadResult.alt 필드 추가 — 소비자가 alt 텍스트도 반환 가능(opt-editor)
  • ^
    프롬프트 인라인 편집, dark mode CSS, Markdown roundtrip (image-prompt 코멘트 파싱)(opt-editor)

v1.3.5

2026-04-06
@reopt-ai/opt-editor@0.7.0

opt-editor 0.7.0 — AI Command Menu (Cmd+J), Ghost Text Copilot, Inline Diff View, 멀티턴 대화, 블록 단위 Accept/Reject

  • +
    AI Command Menu — Cmd+J 단축키, 9개 기본 명령 (개선/문법/축약/확장/톤/번역/이어쓰기/요약/설명)(opt-editor)
    AICommandMenuuseAICommandMenu
  • +
    Ghost Text / Copilot — 커서 뒤 AI 제안 표시, Tab 수락, Cmd+→ 단어 수락(opt-editor)
    GhostTextOverlayuseGhostText
  • +
    Inline Diff View — 단어 레벨 LCS diff, 삭제선/하이라이트, 블록별 Accept/Reject(opt-editor)
    InlineDiffViewAIProgressBar
  • +
    멀티턴 AI 대화 — useAIConversation 훅, 대화 히스토리 + 반복 개선(opt-editor)
    useAIConversation
  • +
    블록 단위 승인/거부 — useAISuggestion에 approveBlock/rejectBlock 추가(opt-editor)
  • +
    인라인 툴바 AI 버튼 + 블록 툴바 AI 액션 + 슬래시 명령 AI 확장(opt-editor)
  • +
    Editor/EditorProvider에 onAIRequest, onGhostTextRequest 콜백 prop(opt-editor)
  • +
    AI i18n 35+ 키 (EN/KO) — 메뉴, 상태, diff, ghost text(opt-editor)
  • ~
    리스트 블록 방향키 탈출 — ArrowUp/Down이 리스트 밖 인접 블록으로 이동(opt-editor)
  • ~
    슬래시 메뉴 / AI 메뉴 키보드 탐색 시 자동 스크롤(opt-editor)

v1.3.4

2026-04-06
@reopt-ai/opt-editor@0.6.0

opt-editor 0.6.0 — AI Agent 통합 (server entry, external stream) + 포괄적 block selection 시스템

  • +
    @reopt-ai/opt-editor/server 진입점 — 서버 안전 AI 헬퍼 (buildSystemPrompt, StreamCompiler 등)(opt-editor)
  • +
    beginExternalStream/endExternalStream — 다중 패치 단일 undo 배칭(opt-editor)
  • +
    catalog.toJSON() + BlockDefinition.component optional — 서버용 스키마 전용 카탈로그(opt-editor)
  • +
    block selection — Ctrl+A, Shift+Click 범위, Ctrl+Click 토글, 마우스 드래그 선택(opt-editor)
  • +
    벌크 작업 — Ctrl+C/X 복사·잘라내기, Delete 벌크 삭제, Ctrl+D 다중 복제(opt-editor)
  • +
    useEditorStream({ mode: 'edit' }) — edit mode에서 forceRender + 자동 external stream 관리(opt-editor)
  • ^
    접근성: aria-selected, 선택 개수 live region announce, i18n blockSelection.count(opt-editor)

v1.3.3

2026-04-02
@reopt-ai/opt-editor@0.5.0

opt-editor 0.5.0 — Provider 기반 i18n (en/ko 내장), SVG 아이콘, 인라인 툴바 아이콘 교체

  • +
    Provider 기반 i18n — EditorMessages 타입, en/ko 내장 로케일, useEditorMessages() 훅(opt-editor)
  • +
    모든 컴포넌트/블록/슬래시 커맨드에 i18n 적용 (68개 키)(opt-editor)
  • ~
    인라인 툴바 이모지를 SVG 아이콘으로 교체 (LinkIcon, CheckIcon, CloseIcon)(opt-editor)

v1.3.1

2026-04-02
@reopt-ai/opt-editor@0.4.0

opt-editor 0.4.0 — 플로팅 인라인 툴바 (Bold/Italic/Code/Strikethrough/Link/Heading 변환)

  • +
    플로팅 인라인 툴바 — 텍스트 선택 시 포맷팅 UI 표시 (Bold, Italic, Code, Strikethrough, Link, H1/H2/H3)(opt-editor)
    InlineToolbaruseInlineToolbar
  • +
    FormatType에 strikethrough 추가, toggleLink() 함수, Ctrl+Shift+S 단축키(opt-editor)
  • ^
    rAF throttle, ref 기반 위치 측정, 링크 모드 선택 범위 저장, heading level 활성 표시(opt-editor)
  • ^
    block toolbar undo 지원, list indent 개선, slash command 키보드 네비게이션 강화(opt-editor)

v1.3.0

2026-04-01
@reopt-ai/opt-editor@0.3.0

opt-editor 0.3.0 — v2 아키텍처 완성 (inline content 모델, playground mock API, remote backend 가이드)

  • +
    v2 아키텍처 완성 — inline content 모델, rich marks, 테이블 구조, 마크다운 라운드트립(opt-editor)
  • +
    remote backend contract 가이드 추가 (dist/docs)(opt-editor)

v1.2.1

2026-03-31
@reopt-ai/opt-editor@0.2.0

opt-editor 0.2.0 — 실전 마이그레이션에서 발견된 DX 개선 7건

  • +
    EditorSpec.version optional + createEmptySpec() 팩토리 — 소비자 보일러플레이트 제거(opt-editor)
  • +
    BlockRenderProps.editableText() 헬퍼 — 인라인 편집 자동 와이어링, stream/edit 모드 자동 전환(opt-editor)
  • +
    SchemaFieldDef 유니온 타입 — 스키마에 default 값 선언 지원 (AI 프롬프트/JSON Schema 반영)(opt-editor)
  • +
    FocusTarget { position: "start" | "end" } — 문서 시작/끝 포커스 편의 타입(opt-editor)
  • ~
    스킬 문서 실제 타입 동기화 (rootIds→root, block→props)(opt-editor)

v1.2.0

2026-03-31
@reopt-ai/opt-editor@0.1.0

opt-editor 0.1.0 첫 릴리즈 — 스키마 기반 블록 에디터, AI NDJSON 스트리밍, 마크다운 양방향 변환 / dist/docs 인프라 — 14개 문서 (API 자동 생성 7 + 수동 7), 소비자 AI 참조용

  • +
    opt-editor 0.1.0 첫 릴리즈 — 스키마 기반 블록 에디터, AI NDJSON 스트리밍, 마크다운 양방향 변환(opt-editor)
  • +
    dist/docs 인프라 — 14개 문서 (API 자동 생성 7 + 수동 7), 소비자 AI 참조용(opt-editor)
  • +
    opt-editor-init/upgrade/migrate 스킬 3종 추가 (Plate→opt-editor 마이그레이션 포함)(opt-editor)
Previous커스텀 블록BlockDefinition 작성, defineCatalog 확장, 커스텀 에디터 구현 가이드구축·운영
커스텀 블록 페이지로 이동