AIO 編輯器
Image
圖片節點（可拖曳縮放）。
圖片節點，自製變體：node view 帶八向 resize 把手（拖曳後回寫 width / height 屬性）；貼上 / 拖放圖檔會觸發上傳 hook；貼上 Excel / Word 內容時跳過圖片攔截，交由表格 / 文字流程。圖片被選取時會出現 Image bubble。
- config key：
AioEditorCoreExtension.Image - 來源：自製（基於
@tiptap/extension-image）
載入途徑：跟隨 features 宣告：Image。按鈕未宣告但要保留能力 → include: [AioEditorCoreExtension.Image]。
排除影響（exclude: [Image]）： 按鈕 Image 將自動隱藏； 以 extraExtensions 補上同名 extension（image）即為替換。
選項
| 欄位 | 型別 | 預設值 | 說明 |
|---|---|---|---|
inline | boolean | false | 行內圖片或區塊圖片 |
allowBase64 | boolean | false | 允許 base64 圖片來源 |
HTMLAttributes | Record<string, any> | {} | 渲染輸出時附加之 HTML 屬性 |
pasteAndDropHandle | (options: PasteAndDropImageOptions) => void | console 提示未實作 | 貼上 / 拖放圖檔時觸發：consumer 上傳後呼叫 options.afterImageUpload(imageInfo) 插入圖片 |
clickHandle | (options: ClickImageOptions) => void | console 提示未實作 | 點擊圖片時觸發（{ src, alt }），常用於開燈箱 |
keepRatioWhenResize | boolean | false | 拖曳把手時鎖定長寬比 |
Commands
| Command | 說明 |
|---|---|
setExtendImage(options) | 插入圖片（src 必填，可帶 alt / title / width / height / htmlData） |
覆寫範例
const config: AioEditorConfig = { extensionsConfig: { Image: { pasteAndDropHandle: async ({ files, afterImageUpload }) => { const url = await uploadToServer(files[0]!) afterImageUpload({ src: url }) } } }}額外節點屬性：width / height（resize 回寫）、htmlData（data-* 屬性透傳，解析與輸出自動轉 kebab-case）。輸入規則：。