@block-kit/plugin 1.0.0 → 1.0.3

package/dist/es/toolbar/modules/inline-code.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import IconCode from '@arco-design/web-react/icon/react-icon/IconCode';
+import { cs, NIL, TRULY } from '@block-kit/utils';
+import { INLINE_CODE } from '../../inline-code/types/index.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const InlineCode = () => {
+    const { keys, refreshMarks, editor } = useToolbarContext();
+    return (jsx("div", { className: cs("menu-toolbar-item", keys[INLINE_CODE] && "active"), onClick: () => {
+            editor.command.exec(INLINE_CODE, { value: keys[INLINE_CODE] ? NIL : TRULY });
+            refreshMarks();
+        }, children: jsx(IconCode, {}) }));
+};
+
+export { InlineCode };

package/dist/es/toolbar/modules/italic.js

@@ -0,0 +1,16 @@
+import { jsx } from 'react/jsx-runtime';
+import IconItalic from '@arco-design/web-react/icon/react-icon/IconItalic';
+import { cs, NIL, TRULY } from '@block-kit/utils';
+import { ITALIC_KEY } from '../../italic/types/index.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const Italic = () => {
+    const { keys, refreshMarks, editor } = useToolbarContext();
+    const onExec = () => {
+        editor.command.exec(ITALIC_KEY, { value: keys[ITALIC_KEY] ? NIL : TRULY });
+        refreshMarks();
+    };
+    return (jsx("div", { className: cs("menu-toolbar-item", keys[ITALIC_KEY] && "active"), onClick: onExec, children: jsx(IconItalic, {}) }));
+};
+
+export { Italic };

package/dist/es/toolbar/modules/line-height.js

@@ -0,0 +1,17 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import Trigger from '@arco-design/web-react/es/Trigger';
+import '@arco-design/web-react/es/Trigger/style';
+import IconCheck from '@arco-design/web-react/icon/react-icon/IconCheck';
+import IconDown from '@arco-design/web-react/icon/react-icon/IconDown';
+import { NIL } from '@block-kit/utils';
+import { LINE_HEIGHT_KEY } from '../../line-height/types/index.js';
+import { LineHeightIcon } from '../../shared/icons/line-height.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const STEP = [...Array.from({ length: 11 }, (_, i) => i * 0.1 + 1.5), 3].map(v => v.toFixed(1).toString());
+const LineHeight = () => {
+    const { keys, refreshMarks, editor } = useToolbarContext();
+    return (jsx(Trigger, { trigger: "click", popupAlign: { bottom: 10 }, getPopupContainer: e => e.parentElement || document.body, popup: () => (jsxs("div", { className: "block-kit-toolbar-dropdown", onClick: refreshMarks, children: [jsxs("div", { className: "block-kit-toolbar-height-item kit-toolbar-node", onClick: () => editor.command.exec(LINE_HEIGHT_KEY, { value: NIL }), children: [!keys[LINE_HEIGHT_KEY] && jsx(IconCheck, {}), "\u9ED8\u8BA4"] }), STEP.map(item => (jsxs("div", { className: "block-kit-toolbar-height-item kit-toolbar-node", onClick: () => editor.command.exec(LINE_HEIGHT_KEY, { value: item }), children: [keys[LINE_HEIGHT_KEY] === item && jsx(IconCheck, {}), item] }, item)))] })), children: jsxs("div", { className: "menu-toolbar-item", children: [jsx(LineHeightIcon, {}), jsx(IconDown, { className: "menu-toolbar-icon-down" })] }) }));
+};
+
+export { LineHeight };

package/dist/es/toolbar/modules/link.js

@@ -0,0 +1,99 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import Button from '@arco-design/web-react/es/Button';
+import '@arco-design/web-react/es/Button/style';
+import Form from '@arco-design/web-react/es/Form';
+import '@arco-design/web-react/es/Form/style';
+import Input from '@arco-design/web-react/es/Input';
+import '@arco-design/web-react/es/Input/style';
+import Switch from '@arco-design/web-react/es/Switch';
+import '@arco-design/web-react/es/Switch/style';
+import Trigger from '@arco-design/web-react/es/Trigger';
+import '@arco-design/web-react/es/Trigger/style';
+import useForm from '@arco-design/web-react/es/Form/useForm';
+import IconLink from '@arco-design/web-react/icon/react-icon/IconLink';
+import IconRight from '@arco-design/web-react/icon/react-icon/IconRight';
+import { APPLY_SOURCE, EDITOR_EVENT } from '@block-kit/core';
+import { cs, TRULY, NIL } from '@block-kit/utils';
+import { useState, useEffect } from 'react';
+import { LINK_KEY, LINK_BLANK_KEY, LINK_TEMP_KEY } from '../../link/types/index.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const Link = props => {
+    const [form] = useForm();
+    const [visible, setVisible] = useState(false);
+    const [collapsed, setCollapsed] = useState(true);
+    const { keys, refreshMarks, editor, selection } = useToolbarContext();
+    const onConfirm = () => {
+        const sel = editor.selection.get();
+        if (!sel)
+            return void 0;
+        const insert = form.getFieldValue("link-insert");
+        const href = form.getFieldValue(LINK_KEY);
+        const blank = form.getFieldValue(LINK_BLANK_KEY);
+        if (!href)
+            return void 0;
+        const filteredHref = props.filterXSS ? props.filterXSS(href) : href;
+        if (sel.isCollapsed) {
+            // 折叠选区的情况下则插入文本
+            if (!insert)
+                return void 0;
+            editor.lookup.marks = Object.assign(Object.assign({}, editor.lookup.marks), { [LINK_KEY]: filteredHref });
+            if (blank) {
+                editor.lookup.marks[LINK_BLANK_KEY] = TRULY;
+            }
+            editor.perform.insertText(sel, insert);
+        }
+        else {
+            // 非折叠选区则应用链接
+            editor.perform.applyMarks(sel, {
+                [LINK_KEY]: filteredHref,
+                [LINK_BLANK_KEY]: blank ? TRULY : NIL,
+                [LINK_TEMP_KEY]: NIL,
+            }, { autoCaret: false });
+        }
+        setVisible(false);
+        refreshMarks();
+    };
+    const onDelete = () => {
+        const sel = editor.selection.get();
+        if (!sel || sel.isCollapsed) {
+            setVisible(false);
+            return void 0;
+        }
+        editor.perform.applyMarks(sel, { [LINK_TEMP_KEY]: NIL, [LINK_BLANK_KEY]: NIL, [LINK_KEY]: NIL }, { autoCaret: false });
+        setVisible(false);
+        refreshMarks();
+    };
+    useEffect(() => {
+        if (visible) {
+            form.resetFields();
+            const sel = editor.selection.get();
+            const state = sel && sel.isCollapsed;
+            setCollapsed(!!state);
+        }
+    }, [editor.selection, form, visible]);
+    const onFocus = () => {
+        const sel = editor.selection.get();
+        if (sel && !sel.isCollapsed) {
+            // 由于焦点转移, 因此需要将临时标记应用到选区
+            editor.perform.applyMarks(sel, { [LINK_TEMP_KEY]: TRULY }, { autoCaret: false, source: APPLY_SOURCE.NO_UNDO });
+            editor.event.once(EDITOR_EVENT.SELECTION_CHANGE, () => {
+                // 这里是需要等待渲染后再执行, 否则会导致选区校正无法获取 LineNode
+                Promise.resolve().then(() => {
+                    editor.perform.applyMarks(sel, { [LINK_TEMP_KEY]: NIL }, { autoCaret: false, source: APPLY_SOURCE.NO_UNDO });
+                });
+            });
+        }
+    };
+    const go = () => {
+        const href = form.getFieldValue(LINK_KEY);
+        if (!href)
+            return void 0;
+        window.open(href, "_blank");
+    };
+    return (jsx(Trigger, { popupVisible: visible, onVisibleChange: setVisible, trigger: "click", popupAlign: { bottom: 10 }, getPopupContainer: e => e.parentElement || document.body, popup: () => {
+            return (jsxs("div", { className: "block-kit-link-popup", children: [jsxs(Form, { initialValues: keys, form: form, size: "small", labelCol: { span: 6, offset: 0 }, wrapperCol: { span: 18, offset: 0 }, labelAlign: "left", onSubmit: onConfirm, children: [collapsed && (jsx(Form.Item, { label: "\u6587\u672C\u5185\u5BB9", field: "link-insert", children: jsx(Input, { "data-no-prevent": true, autoComplete: "off", size: "mini", placeholder: "\u8F93\u5165\u6587\u672C" }) })), jsx(Form.Item, { label: "\u94FE\u63A5\u5730\u5740", field: LINK_KEY, children: jsx(Input, { "data-no-prevent": true, autoComplete: "off", size: "mini", placeholder: "\u8F93\u5165\u94FE\u63A5", onFocus: onFocus, addAfter: jsx(IconRight, { onClick: go, className: "block-kit-link-popup-go" }) }) }), jsx(Form.Item, { label: "\u65B0\u9875\u9762\u6253\u5F00", field: LINK_BLANK_KEY, triggerPropName: "checked", children: jsx(Switch, {}) })] }), jsxs("div", { className: "block-kit-link-popup-button", children: [jsx(Button, { size: "mini", htmlType: "submit", type: "primary", onClick: onConfirm, children: "\u786E\u5B9A" }), jsx(Button, { size: "mini", type: "primary", status: "danger", onClick: onDelete, children: "\u5220\u9664" })] })] }));
+        }, children: jsx("div", { className: cs("menu-toolbar-item", keys[LINK_KEY] && selection && !selection.isCollapsed && "active"), children: jsx(IconLink, {}) }) }));
+};
+
+export { Link };

package/dist/es/toolbar/modules/order-list.js

@@ -0,0 +1,17 @@
+import { jsx } from 'react/jsx-runtime';
+import IconOrderedList from '@arco-design/web-react/icon/react-icon/IconOrderedList';
+import { cs, TRULY } from '@block-kit/utils';
+import { ORDER_LIST_KEY } from '../../order-list/types/index.js';
+import { isOrderList } from '../../order-list/utils/is.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const OrderList = () => {
+    const { keys, refreshMarks, editor } = useToolbarContext();
+    const isOrder = isOrderList(keys);
+    return (jsx("div", { className: cs("menu-toolbar-item", isOrder && "active"), onClick: () => {
+            editor.command.exec(ORDER_LIST_KEY, { value: TRULY });
+            refreshMarks();
+        }, children: jsx(IconOrderedList, {}) }));
+};
+
+export { OrderList };

package/dist/es/toolbar/modules/quote.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import IconQuote from '@arco-design/web-react/icon/react-icon/IconQuote';
+import { cs, TRULY } from '@block-kit/utils';
+import { QUOTE_KEY } from '../../quote/types/index.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const Quote = () => {
+    const { keys, refreshMarks, editor } = useToolbarContext();
+    return (jsx("div", { className: cs("menu-toolbar-item", keys[QUOTE_KEY] && "active"), onClick: () => {
+            editor.command.exec(QUOTE_KEY, { value: TRULY });
+            refreshMarks();
+        }, children: jsx(IconQuote, {}) }));
+};
+
+export { Quote };

package/dist/es/toolbar/modules/strike.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import IconStrikethrough from '@arco-design/web-react/icon/react-icon/IconStrikethrough';
+import { cs, NIL, TRULY } from '@block-kit/utils';
+import { STRIKE_KEY } from '../../strike/types/index.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const Strike = () => {
+    const { keys, refreshMarks, editor } = useToolbarContext();
+    return (jsx("div", { className: cs("menu-toolbar-item", keys[STRIKE_KEY] && "active"), onClick: () => {
+            editor.command.exec(STRIKE_KEY, { value: keys[STRIKE_KEY] ? NIL : TRULY });
+            refreshMarks();
+        }, children: jsx(IconStrikethrough, {}) }));
+};
+
+export { Strike };

package/dist/es/toolbar/modules/underline.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import IconUnderline from '@arco-design/web-react/icon/react-icon/IconUnderline';
+import { cs, NIL, TRULY } from '@block-kit/utils';
+import { UNDERLINE_KEY } from '../../underline/types/index.js';
+import { useToolbarContext } from '../context/provider.js';
+
+const Underline = () => {
+    const { keys, refreshMarks, editor } = useToolbarContext();
+    return (jsx("div", { className: cs("menu-toolbar-item", keys[UNDERLINE_KEY] && "active"), onClick: () => {
+            editor.command.exec(UNDERLINE_KEY, { value: keys[UNDERLINE_KEY] ? NIL : TRULY });
+            refreshMarks();
+        }, children: jsx(IconUnderline, {}) }));
+};
+
+export { Underline };

package/dist/es/{marks-ac0ec630.js → toolbar/utils/marks.js}

@@ -1,7 +1,3 @@
-const PLUGIN_EVENTS = {
-    SHORTCUT_MARKS_CHANGE: "SHORTCUT_MARKS_CHANGE",
-};
-
 const filterMarkMap = (ops) => {
     const firstOp = ops[0];
     if (!firstOp || !firstOp.attributes)
@@ -43,4 +39,4 @@ const filterLineMarkMap = (attrs) => {
     return target;
 };
 
-export { PLUGIN_EVENTS as P, filterMarkMap as a, filterLineMarkMap as f };
+export { filterLineMarkMap, filterMarkMap };

package/dist/lib/bullet-list/index.js

@@ -2,22 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-d44c9a95.js');
+var tslib_es6 = require('../tslib.es6-9953fd0d.js');
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@block-kit/core');
 var delta = require('@block-kit/delta');
 var react = require('@block-kit/react');
 var utils = require('@block-kit/utils');
 var indent_types_index = require('../indent/types/index.js');
-var dom = require('../dom-cb8b8e40.js');
-var is$1 = require('../is-473d664a.js');
+var shared_utils_dom = require('../shared/utils/dom.js');
+var shared_utils_is = require('../shared/utils/is.js');
 var bulletList_types_index = require('./types/index.js');
-var is = require('../is-fa1755d0.js');
-
-const BulletListView = props => {
-    const { level, children } = props;
-    return (jsxRuntime.jsx("ul", { className: "block-kit-bullet-list", children: jsxRuntime.jsx("li", { className: utils.cs("block-kit-bullet-item", `block-kit-li-level-${level % 3}`), children: children }) }));
-};
+var bulletList_utils_is = require('./utils/is.js');
+var bulletList_view_list = require('./view/list.js');
 
 class BulletListPlugin extends react.EditorPlugin {
     constructor(editor) {
@@ -31,13 +27,13 @@ class BulletListPlugin extends react.EditorPlugin {
         this.editor.event.off(core.EDITOR_EVENT.KEY_DOWN, this.onKeyDown);
     }
     match(attrs) {
-        return is.isBulletList(attrs);
+        return bulletList_utils_is.isBulletList(attrs);
     }
     renderLine(context) {
         const level = Number(context.attributes[indent_types_index.INDENT_LEVEL_KEY]) || 0;
         // 这里需要注意, 必须要将 context.children 作为 React 的子元素
         // 否则, 在 React 的渲染过程中, 会出现奇怪的 Crash 问题
-        return (jsxRuntime.jsx(BulletListView, { level: level, editor: this.editor, context: context, children: context.children }));
+        return (jsxRuntime.jsx(bulletList_view_list.BulletListView, { level: level, editor: this.editor, context: context, children: context.children }));
     }
     onExec(payload) {
         const editor = this.editor;
@@ -47,7 +43,7 @@ class BulletListPlugin extends react.EditorPlugin {
         const { start, end } = sel;
         // 先检查当前需要设置/解除列表状态
         const lines = editor.state.block.getLines().slice(start.line, end.line + 1);
-        const isBullet = lines.every(line => is.isBulletList(line.attributes));
+        const isBullet = lines.every(line => bulletList_utils_is.isBulletList(line.attributes));
         // 计算需要操作的范围
         const rawPoint = core.RawPoint.fromPoint(this.editor, core.Point.from(start.line, 0));
         if (!rawPoint)
@@ -83,10 +79,10 @@ class BulletListPlugin extends react.EditorPlugin {
         const attrs = startLine.attributes;
         // 当前行是列表行, 且按下回车键, 且选区折叠, 且当前行是空行
         // => 处理列表的缩进等级
-        if (is$1.isKeyCode(event, utils.KEY_CODE.ENTER) &&
-            is.isBulletList(attrs) &&
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.ENTER) &&
+            bulletList_utils_is.isBulletList(attrs) &&
             sel.isCollapsed &&
-            is$1.isEmptyLine(startLine)) {
+            shared_utils_is.isEmptyLine(startLine)) {
             const level = Number(attrs[indent_types_index.INDENT_LEVEL_KEY]);
             const nextAttrs = {};
             if (level > 0) {
@@ -100,17 +96,17 @@ class BulletListPlugin extends react.EditorPlugin {
             }
             const delta$1 = new delta.Delta().retain(startLine.start + startLine.length - 1).retain(1, nextAttrs);
             this.editor.state.apply(delta$1, { autoCaret: false });
-            dom.preventContextEvent(event, context);
+            shared_utils_dom.preventContextEvent(event, context);
             return void 0;
         }
         // 当前行是列表行, 且按下回车键, 且选区折叠, 且位于行首, 且上一行是列表行
         // => 继续列表格式, 避免默认的处理, 保持列表的连续性
-        if (is$1.isKeyCode(event, utils.KEY_CODE.ENTER) &&
-            is.isBulletList(attrs) &&
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.ENTER) &&
+            bulletList_utils_is.isBulletList(attrs) &&
             sel.isCollapsed &&
             sel.start.offset === 0 &&
             prevLine &&
-            is.isBulletList(prevLine.attributes)) {
+            bulletList_utils_is.isBulletList(prevLine.attributes)) {
             const nextAttrs = Object.assign({}, prevLine.attributes);
             if (attrs[indent_types_index.INDENT_LEVEL_KEY]) {
                 // 缩进层级优先取当前行的缩进层级
@@ -118,27 +114,27 @@ class BulletListPlugin extends react.EditorPlugin {
             }
             const delta$1 = new delta.Delta().retain(startLine.start).insertEOL(nextAttrs);
             this.editor.state.apply(delta$1);
-            dom.preventContextEvent(event, context);
+            shared_utils_dom.preventContextEvent(event, context);
             return void 0;
         }
         // 当前行是列表行, 且按下回车键
         // => 在列表行内部插入换行符, 且携带列表状态
-        if (is$1.isKeyCode(event, utils.KEY_CODE.ENTER) && is.isBulletList(attrs) && sel.start.offset) {
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.ENTER) && bulletList_utils_is.isBulletList(attrs) && sel.start.offset) {
             this.editor.perform.insertBreak(sel, attrs);
-            dom.preventContextEvent(event, context);
+            shared_utils_dom.preventContextEvent(event, context);
             return void 0;
         }
         // 当前行是列表行, 且折叠选区, 且在行首, 且按下退格键
         // => 将当前行的列表状态移除, 保留缩进的等级
-        if (is$1.isKeyCode(event, utils.KEY_CODE.BACKSPACE) &&
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.BACKSPACE) &&
             sel.isCollapsed &&
-            is.isBulletList(attrs) &&
+            bulletList_utils_is.isBulletList(attrs) &&
             !sel.start.offset) {
             const delta$1 = new delta.Delta()
                 .retain(startLine.start + startLine.length - 1)
                 .retain(1, { [bulletList_types_index.LIST_TYPE_KEY]: utils.NIL });
             this.editor.state.apply(delta$1, { autoCaret: false });
-            dom.preventContextEvent(event, context);
+            shared_utils_dom.preventContextEvent(event, context);
             return void 0;
         }
     }

package/dist/lib/{is-fa1755d0.js → bullet-list/utils/is.js}

@@ -1,6 +1,8 @@
 'use strict';
 
-var bulletList_types_index = require('./bullet-list/types/index.js');
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var bulletList_types_index = require('../types/index.js');
 
 /**
  * 检查无序列表

package/dist/lib/bullet-list/view/list.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var utils = require('@block-kit/utils');
+
+const BulletListView = props => {
+    const { level, children } = props;
+    return (jsxRuntime.jsx("ul", { className: "block-kit-bullet-list", children: jsxRuntime.jsx("li", { className: utils.cs("block-kit-bullet-item", `block-kit-li-level-${level % 3}`), children: children }) }));
+};
+
+exports.BulletListView = BulletListView;

package/dist/lib/divider/index.js

@@ -2,23 +2,23 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-d44c9a95.js');
+var tslib_es6 = require('../tslib.es6-9953fd0d.js');
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@block-kit/core');
 var delta = require('@block-kit/delta');
 var react = require('@block-kit/react');
 var utils = require('@block-kit/utils');
-var selection = require('../selection-868f15c1.js');
-var is = require('../is-473d664a.js');
+var shared_components_selection = require('../shared/components/selection.js');
+var shared_modules_selection = require('../shared/modules/selection.js');
+var shared_utils_is = require('../shared/utils/is.js');
 var divider_types_index = require('./types/index.js');
-require('react');
 
 class DividerPlugin extends react.EditorPlugin {
     constructor(editor) {
         super();
         this.editor = editor;
         this.key = divider_types_index.DIVIDER_KEY;
-        this.selection = new selection.SelectionPlugin(editor);
+        this.selection = new shared_modules_selection.SelectionPlugin(editor);
         editor.command.register(divider_types_index.DIVIDER_KEY, this.onExec);
     }
     destroy() {
@@ -30,7 +30,7 @@ class DividerPlugin extends react.EditorPlugin {
         const line = sel && editor.state.block.getLine(sel.start.line);
         if (!sel || !line)
             return void 0;
-        const isEmptyTextLine = is.isEmptyLine(line);
+        const isEmptyTextLine = shared_utils_is.isEmptyLine(line);
         let nextLineIndex = line.index + 1;
         const delta$1 = new delta.Delta();
         if (isEmptyTextLine) {
@@ -54,7 +54,7 @@ class DividerPlugin extends react.EditorPlugin {
         return !!attrs[divider_types_index.DIVIDER_KEY];
     }
     renderLeaf(context) {
-        return (jsxRuntime.jsx(selection.SelectionHOC, { selection: this.selection, leaf: context.leafState, children: jsxRuntime.jsx(react.Void, { tag: "div", className: "block-kit-divider-container", context: context, children: jsxRuntime.jsx("div", { className: "block-kit-divider" }) }) }));
+        return (jsxRuntime.jsx(shared_components_selection.SelectionHOC, { selection: this.selection, leaf: context.leafState, children: jsxRuntime.jsx(react.Void, { tag: "div", className: "block-kit-divider-container", context: context, children: jsxRuntime.jsx("div", { className: "block-kit-divider" }) }) }));
     }
 }
 tslib_es6.__decorate([

package/dist/lib/emoji/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-d44c9a95.js');
+var tslib_es6 = require('../tslib.es6-9953fd0d.js');
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@block-kit/core');
 var delta = require('@block-kit/delta');

package/dist/lib/image/index.js

@@ -2,127 +2,17 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-d44c9a95.js');
+var tslib_es6 = require('../tslib.es6-9953fd0d.js');
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@block-kit/core');
 var delta = require('@block-kit/delta');
 var react = require('@block-kit/react');
 var utils = require('@block-kit/utils');
-var selection = require('../selection-868f15c1.js');
-var dom = require('../dom-cb8b8e40.js');
-var is = require('../is-473d664a.js');
+var shared_modules_selection = require('../shared/modules/selection.js');
+var shared_utils_dom = require('../shared/utils/dom.js');
+var shared_utils_is = require('../shared/utils/is.js');
 var image_types_index = require('./types/index.js');
-var icon = require('@arco-design/web-react/icon');
-var webReact = require('@arco-design/web-react');
-var React = require('react');
-
-const Preview = webReact.Image.Preview;
-const ImageWrapper = props => {
-    const { readonly } = react.useReadonly();
-    const [src, setImage] = React.useState("");
-    const ref = React.useRef(null);
-    const enable = readonly || props.selected;
-    const preview = (e) => {
-        // https://developer.mozilla.org/zh-CN/docs/Web/API/MouseEvent/button
-        if (e.button !== 0)
-            return;
-        enable && setImage(props.src || "");
-    };
-    const onMouseDown = (e) => {
-        const resider = e.target;
-        if (!ref.current)
-            return void 0;
-        // 这里直接取图片的宽高，若取原始图宽高会导致拖拽缩放问题
-        const width = ref.current.clientWidth;
-        const height = ref.current.clientHeight;
-        e.stopPropagation();
-        e.preventDefault();
-        if (resider instanceof HTMLDivElement && resider.dataset.type && width && height) {
-            const startX = e.clientX;
-            const startY = e.clientY;
-            const startWidth = Number(width);
-            const startHeight = Number(height);
-            const ratio = startWidth / startHeight;
-            const type = resider.dataset.type;
-            const range = props.leaf.toRange();
-            const raw = core.RawRange.fromRange(props.editor, range);
-            if (!raw)
-                return;
-            const onMouseMove = utils.throttle((event) => {
-                const currentX = event.clientX;
-                const currentY = event.clientY;
-                const diffX = currentX - startX;
-                const diffY = currentY - startY;
-                let nextWidth = startWidth;
-                let nextHeight = startHeight;
-                switch (type) {
-                    case "lt":
-                        nextWidth = nextWidth - diffX;
-                        nextHeight = nextHeight - diffY;
-                        break;
-                    case "rt":
-                        nextWidth = nextWidth + diffX;
-                        nextHeight = nextHeight - diffY;
-                        break;
-                    case "lb":
-                        nextWidth = nextWidth - diffX;
-                        nextHeight = nextHeight + diffY;
-                        break;
-                    case "rb":
-                        nextWidth = nextWidth + diffX;
-                        nextHeight = nextHeight + diffY;
-                        break;
-                }
-                if (nextWidth / nextHeight > ratio) {
-                    nextHeight = nextWidth / ratio;
-                }
-                else {
-                    nextWidth = nextHeight * ratio;
-                }
-                const delta$1 = new delta.Delta().retain(raw.start).retain(raw.len, {
-                    [image_types_index.IMAGE_WIDTH]: String(Math.max(nextWidth, 100)),
-                    [image_types_index.IMAGE_HEIGHT]: String(Math.max(nextHeight, 100)),
-                });
-                props.editor.state.apply(delta$1, { autoCaret: false });
-            }, 10);
-            const onMouseUp = () => {
-                document.removeEventListener("mousemove", onMouseMove);
-                document.removeEventListener("mouseup", onMouseUp);
-            };
-            document.addEventListener("mousemove", onMouseMove);
-            document.addEventListener("mouseup", onMouseUp);
-        }
-    };
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [src && jsxRuntime.jsx(Preview, { src: src, visible: !!src, onVisibleChange: v => !v && setImage("") }), !readonly && (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx("div", { className: utils.cs(enable && "block-kit-image-resider"), "data-type": "lt", onMouseDown: onMouseDown }), jsxRuntime.jsx("div", { className: utils.cs(enable && "block-kit-image-resider"), "data-type": "rt", onMouseDown: onMouseDown }), jsxRuntime.jsx("div", { className: utils.cs(enable && "block-kit-image-resider"), "data-type": "lb", onMouseDown: onMouseDown }), jsxRuntime.jsx("div", { className: utils.cs(enable && "block-kit-image-resider"), "data-type": "rb", onMouseDown: onMouseDown })] })), jsxRuntime.jsx("div", { ref: ref, onMouseDown: preview, className: utils.cs(enable && "block-kit-image-preview"), children: props.children })] }));
-};
-
-const ImageView = props => {
-    const { selection: selection$1, context, editor } = props;
-    const attrs = context.attributes || {};
-    const src = attrs[image_types_index.IMAGE_SRC];
-    const width = attrs[image_types_index.IMAGE_WIDTH];
-    const height = attrs[image_types_index.IMAGE_HEIGHT];
-    const status = attrs[image_types_index.IMAGE_STATUS];
-    const onImageLoad = event => {
-        const target = event.target;
-        if (width && height)
-            return void 0;
-        const { naturalHeight, naturalWidth } = target;
-        const scale = naturalHeight / naturalWidth;
-        const next = {
-            [image_types_index.IMAGE_WIDTH]: String(naturalWidth),
-            [image_types_index.IMAGE_HEIGHT]: String(naturalHeight),
-            [image_types_index.IMAGE_SCALE]: String(scale),
-        };
-        const range = context.leafState.toRange();
-        const rawRange = core.RawRange.fromRange(editor, range);
-        if (!rawRange)
-            return void 0;
-        const delta$1 = new delta.Delta().retain(rawRange.start).retain(rawRange.len, next);
-        editor.state.apply(delta$1, { source: core.APPLY_SOURCE.NO_UNDO, autoCaret: false });
-    };
-    return (jsxRuntime.jsxs(react.Void, { className: "block-kit-image-container", context: context, children: [status === image_types_index.LOADING_STATUS.LOADING && (jsxRuntime.jsx("div", { className: "block-kit-image-loading", children: jsxRuntime.jsx(icon.IconLoading, {}) })), jsxRuntime.jsx(selection.SelectionHOC, { selection: selection$1, leaf: context.leafState, children: jsxRuntime.jsx(ImageWrapper, { editor: props.editor, src: src, leaf: context.leafState, children: jsxRuntime.jsx("img", { className: "block-kit-image", src: src, onLoad: onImageLoad, width: utils.Styles.pixelate(width), height: utils.Styles.pixelate(height) }) }) })] }));
-};
+var image_view_image = require('./view/image.js');
 
 class ImagePlugin extends react.EditorPlugin {
     constructor(editor) {
@@ -130,7 +20,7 @@ class ImagePlugin extends react.EditorPlugin {
         this.editor = editor;
         this.key = image_types_index.IMAGE_KEY;
         this.input = null;
-        this.selection = new selection.SelectionPlugin(editor);
+        this.selection = new shared_modules_selection.SelectionPlugin(editor);
         editor.command.register(image_types_index.IMAGE_KEY, this.onExec);
     }
     destroy() {
@@ -142,7 +32,7 @@ class ImagePlugin extends react.EditorPlugin {
         return !!attrs[image_types_index.IMAGE_KEY];
     }
     renderLeaf(context) {
-        return (jsxRuntime.jsx(ImageView, { editor: this.editor, context: context, selection: this.selection }));
+        return (jsxRuntime.jsx(image_view_image.ImageView, { editor: this.editor, context: context, selection: this.selection }));
     }
     pickMultiImage() {
         let imageInput = this.input;
@@ -153,7 +43,7 @@ class ImagePlugin extends react.EditorPlugin {
             imageInput.hidden = true;
             imageInput.setAttribute("multiple", "true");
             this.input = imageInput;
-            dom.getMountDOM(this.editor).append(imageInput);
+            shared_utils_dom.getMountDOM(this.editor).append(imageInput);
         }
         return new Promise(resolve => {
             imageInput.onchange = e => {
@@ -179,7 +69,7 @@ class ImagePlugin extends react.EditorPlugin {
             if (!sel || !line || !files)
                 return void 0;
             // 开始计算索引值
-            const isEmptyTextLine = is.isEmptyLine(line);
+            const isEmptyTextLine = shared_utils_is.isEmptyLine(line);
             let nextLineIndex = line.index;
             const delta$1 = new delta.Delta();
             let index = line.start;
@@ -214,7 +104,7 @@ class ImagePlugin extends react.EditorPlugin {
             for (let i = 0; i < packIndex.length; i++) {
                 const file = files[i];
                 const refIndex = packIndex[i];
-                const ref = editor.ref.pack(core.RawRange.from(refIndex, 0));
+                const ref = editor.tracer.pack(core.RawRange.from(refIndex, 0));
                 // 独立并行上传, 且独立 unpack
                 this.uploadImage(file)
                     .then(res => {