@block-kit/plugin 1.0.0 → 1.0.3

package/dist/lib/image/view/image.js

@@ -0,0 +1,47 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var IconLoading = require('@arco-design/web-react/icon/react-icon-cjs/IconLoading');
+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 shared_components_selection = require('../../shared/components/selection.js');
+var image_types_index = require('../types/index.js');
+var image_view_wrapper = require('./wrapper.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var IconLoading__default = /*#__PURE__*/_interopDefaultLegacy(IconLoading);
+
+const ImageView = props => {
+    const { selection, 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(IconLoading__default["default"], {}) })), jsxRuntime.jsx(shared_components_selection.SelectionHOC, { selection: selection, leaf: context.leafState, children: jsxRuntime.jsx(image_view_wrapper.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) }) }) })] }));
+};
+
+exports.ImageView = ImageView;

package/dist/lib/image/view/wrapper.js

@@ -0,0 +1,99 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var Image = require('@arco-design/web-react/lib/Image');
+require('@arco-design/web-react/lib/Image/style');
+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 React = require('react');
+var image_types_index = require('../types/index.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var Image__default = /*#__PURE__*/_interopDefaultLegacy(Image);
+
+const Preview = Image__default["default"].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 })] }));
+};
+
+exports.ImageWrapper = ImageWrapper;

package/dist/lib/indent/index.js

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../tslib.es6-d44c9a95.js');
+var tslib_es6 = require('../tslib.es6-9953fd0d.js');
 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 is = require('../is-473d664a.js');
+var shared_utils_is = require('../shared/utils/is.js');
 var indent_types_index = require('./types/index.js');
 
 class IndentPlugin extends react.EditorPlugin {
@@ -33,7 +33,7 @@ class IndentPlugin extends react.EditorPlugin {
         return context.children;
     }
     onKeydown(event) {
-        if (!is.isKeyCode(event, utils.KEY_CODE.TAB))
+        if (!shared_utils_is.isKeyCode(event, utils.KEY_CODE.TAB))
             return void 0;
         const sel = this.editor.selection.get();
         if (!sel)

package/dist/lib/index.css

@@ -1 +1 @@
-.block-kit-bullet-list{list-style-type:none;margin:0;padding-left:0}.block-kit-bullet-list .block-kit-bullet-item::marker{color:rgb(var(--arcoblue-6));margin-right:0;text-align:unset!important;text-align-last:unset!important}.block-kit-bullet-list .block-kit-bullet-item.block-kit-li-level-0{list-style-type:disc;margin-left:20px}.block-kit-bullet-list .block-kit-bullet-item.block-kit-li-level-1{list-style-type:circle;margin-left:20px}.block-kit-bullet-list .block-kit-bullet-item.block-kit-li-level-2{list-style-type:square;margin-left:20px}.block-kit-divider-container{padding:6px 0}.block-kit-divider{background-color:var(--color-fill-4);height:1px}.block-kit-embed-selected{box-shadow:0 0 0 1px rgba(var(--blue-7),.9)}.block-kit-emoji{height:1em;width:1em}.block-kit-heading{font-weight:700}.block-kit-heading.h1{font-size:20px;margin:10px 0}.block-kit-heading.h2{font-size:16px;margin:8px 0}.block-kit-heading.h3{font-size:14px;margin:7px 0}.block-kit-image-container{display:inline-block;position:relative}.block-kit-image-container .block-kit-image{display:block;height:auto;max-height:100%;max-width:100%;object-fit:contain}.block-kit-image-container .block-kit-image-loading{align-items:center;background-color:rgba(var(--gray-3),.5);bottom:0;box-sizing:border-box;color:var(--color-text-2);display:flex;font-size:23px;justify-content:center;left:0;padding:1px;position:absolute;right:0;top:0;z-index:2}.block-kit-image-preview{cursor:zoom-in}.block-kit-image-resider{position:absolute;z-index:1}.block-kit-image-resider:after{background-color:var(--color-bg-1);border:1px solid rgb(var(--arcoblue-6));border-radius:10px;content:"";display:block;height:10px;width:10px;z-index:1}.block-kit-image-resider[data-type=lt]{cursor:nwse-resize;left:-5px;top:-5px}.block-kit-image-resider[data-type=rt]{cursor:nesw-resize;right:-5px;top:-5px}.block-kit-image-resider[data-type=lb]{bottom:-5px;cursor:nesw-resize;left:-5px}.block-kit-image-resider[data-type=rb]{bottom:-5px;cursor:nwse-resize;right:-5px}.block-kit-inline-code{background-color:var(--color-fill-2);border-bottom-style:solid;border-color:var(--color-border-2);border-top-style:solid;border-width:1px;box-sizing:border-box;padding-bottom:1px;padding-top:1px}.block-kit-inline-code-start{border-bottom-left-radius:3px;border-left-style:solid;border-top-left-radius:3px;margin-left:2px;padding-left:2px}.block-kit-inline-code-end{border-bottom-right-radius:3px;border-right-style:solid;border-top-right-radius:3px;margin-right:2px;padding-right:2px}.block-kit-hyper-link{color:rgb(var(--link-6));cursor:pointer;text-decoration:none}.block-kit-mention-embed{display:inline-block;line-height:1.3}.block-kit-mention-embed .block-kit-mention-name{background-color:rgba(var(--arcoblue-6),.9);border-radius:8px;box-sizing:border-box;color:var(--color-bg-5);display:inline-block;margin:0 3px;padding:0 4px}.block-kit-suggest-panel{-ms-overflow-style:none;background-color:var(--color-bg-1);border:1px solid var(--color-border-2);border-radius:3px;border-radius:5px;box-shadow:0 0 4px var(--color-border-2);box-sizing:border-box;color:var(--color-text-1);font-size:13px;height:150px;overflow:-moz-scrollbars-none;overflow-y:auto;overscroll-behavior:contain;padding:5px 7px;position:absolute;scrollbar-width:none;width:100px;z-index:999}.block-kit-suggest-panel::-webkit-scrollbar{display:none}.block-kit-suggest-panel .block-kit-suggest-item{border-radius:4px;overflow:hidden;padding:3px 5px;text-overflow:ellipsis;white-space:nowrap}.block-kit-suggest-panel .block-kit-suggest-item.active{background-color:var(--color-fill-2)}.block-kit-suggest-panel .block-kit-suggest-empty{color:var(--color-text-3);margin-top:10px;text-align:center}.block-kit-order-list{display:flex;list-style-type:none;margin-block-end:0;margin-block-start:0;margin-inline-end:0;margin-inline-start:0;padding-inline-start:0}.block-kit-order-list .block-kit-order-indicator{color:rgb(var(--arcoblue-6));margin-right:6px;user-select:none}.block-kit-order-list .block-kit-order-item{display:block;flex:1 0 0}.block-kit-quote{border-left:3px solid var(--color-border-2);color:var(--color-text-2);padding-left:10px}.block-kit-menu-toolbar .menu-toolbar-cut{background-color:var(--color-fill-3);box-sizing:border-box;margin:4px 6px;width:1px}.arco-trigger.menu-toolbar-emoji-trigger{width:352px}.arco-trigger.menu-toolbar-emoji-trigger .scroll{max-height:300px}.block-kit-color-picker{padding:10px;width:230px}.block-kit-color-picker .kit-color-picker-label{font-size:12px}.block-kit-color-picker .kit-picker-group{display:flex;flex-wrap:wrap;font-size:13px;justify-content:space-between;margin:5px 0}.block-kit-color-picker .kit-picker-item-wrapper{border:1px solid transparent;border-radius:3px;flex-shrink:0}.block-kit-color-picker .kit-picker-item-wrapper.active{border-color:rgb(var(--arcoblue-6))}.block-kit-color-picker .kit-picker-item{align-items:center;border:1px solid var(--color-border-1);border-radius:3px;box-sizing:border-box;cursor:pointer;display:flex;height:22px;justify-content:center;width:22px}.block-kit-color-picker .kit-picker-background-case .kit-picker-item-wrapper{margin-right:3px;margin-top:4px}.block-kit-color-picker .kit-picker-background-case .kit-picker-item{border-color:transparent}.block-kit-color-picker .kit-picker-background-case .kit-picker-item-empty-background{border-color:var(--color-border-2);overflow:hidden;position:relative}.block-kit-color-picker .kit-picker-background-case .kit-picker-item-empty-background:before{background-color:var(--color-border-3);content:"";height:33px;left:7px;position:absolute;top:-9px;transform:rotate(-45deg);width:1px;z-index:2}.block-kit-menu-toolbar .menu-toolbar-item.kit-color-case{align-items:center;display:flex;padding:3px 0}.block-kit-menu-toolbar .menu-toolbar-item.kit-color-case .kit-color-block{border-radius:3px;padding:0 5px}.block-kit-menu-toolbar .menu-toolbar-item.kit-color-case .menu-toolbar-icon-down{margin-left:0;margin-right:3px}.block-kit-toolbar-dropdown .block-kit-toolbar-height-item{position:relative}.block-kit-toolbar-dropdown .block-kit-toolbar-height-item .arco-icon-check{left:5px;position:absolute}.block-kit-link-popup{background-color:var(--color-bg-1);border-radius:3px;box-shadow:0 0 4px var(--color-border-2);padding:10px 15px;position:relative;width:330px}.block-kit-link-popup .arco-form-size-small .arco-form-label-item>label{font-size:13px}.block-kit-link-popup .arco-form-item{margin:5px 0}.block-kit-link-popup .block-kit-link-popup-button{bottom:15px;position:absolute;right:15px}.block-kit-link-popup .block-kit-link-popup-button .arco-btn{margin-left:10px}.block-kit-link-popup .block-kit-link-popup-go{cursor:pointer}.block-kit-menu-toolbar{border-bottom:1px solid var(--color-border-3);display:flex;padding:6px 5px;user-select:none}.block-kit-menu-toolbar .menu-toolbar-item{align-items:center;border-radius:3px;color:var(--color-text-1);cursor:pointer;display:flex;margin:0 3px;padding:3px 7px}.block-kit-menu-toolbar .menu-toolbar-item.active,.block-kit-menu-toolbar .menu-toolbar-item:hover{background-color:var(--color-fill-2);color:var(--color-text-1)}.block-kit-menu-toolbar .menu-toolbar-item.disable{background-color:unset;color:var(--color-text-3)}.block-kit-menu-toolbar .menu-toolbar-icon-down{font-size:12px;margin-left:3px}.block-kit-toolbar-dropdown{background-color:var(--color-bg-1);border:1px solid var(--color-border-2);border-radius:3px;box-shadow:0 0 4px var(--color-border-2);color:var(--color-text-1)}.block-kit-toolbar-dropdown>.kit-toolbar-node{align-items:center;cursor:pointer;display:flex;font-size:12px;height:30px;justify-content:center;margin:5px;width:70px}.block-kit-toolbar-dropdown>.kit-toolbar-node>.arco-icon{font-size:13px}.block-kit-toolbar-dropdown>.kit-toolbar-node:hover{background-color:var(--color-fill-2)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.block-kit-float-toolbar{animation:fade-in .3s;background-color:var(--color-bg-2);border:1px solid var(--color-border-1);border-radius:3px;box-shadow:1px 2px 4px var(--color-border-2);position:absolute;z-index:999}.block-kit-menu-toolbar.block-kit-float-toolbar{border-bottom:unset}.block-kit-menu-toolbar.block-kit-float-toolbar .menu-toolbar-item{color:var(--color-text-1);margin:0 5px}.block-kit-menu-toolbar.block-kit-float-toolbar .menu-toolbar-item.kit-color-case{margin:0 3px 0 -2px;padding:3px}
+.block-kit-bullet-list{list-style-type:none;margin:0;padding-left:0}.block-kit-bullet-list .block-kit-bullet-item::marker{color:rgb(var(--arcoblue-6));margin-right:0;text-align:unset!important;text-align-last:unset!important}.block-kit-bullet-list .block-kit-bullet-item.block-kit-li-level-0{list-style-type:disc;margin-left:20px}.block-kit-bullet-list .block-kit-bullet-item.block-kit-li-level-1{list-style-type:circle;margin-left:20px}.block-kit-bullet-list .block-kit-bullet-item.block-kit-li-level-2{list-style-type:square;margin-left:20px}.block-kit-divider-container{padding:6px 0}.block-kit-divider{background-color:var(--color-fill-4);height:1px}.block-kit-embed-selected{box-shadow:0 0 0 1px rgba(var(--blue-7),.9)}.block-kit-emoji{height:1em;width:1em}.block-kit-heading{font-weight:700}.block-kit-heading.h1{font-size:20px;margin:10px 0}.block-kit-heading.h2{font-size:16px;margin:8px 0}.block-kit-heading.h3{font-size:14px;margin:7px 0}.block-kit-image-container{display:inline-block;position:relative}.block-kit-image-container .block-kit-image{display:block;height:auto;max-height:100%;max-width:100%;object-fit:contain}.block-kit-image-container .block-kit-image-loading{align-items:center;background-color:rgba(var(--gray-3),.5);bottom:0;box-sizing:border-box;color:var(--color-text-2);display:flex;font-size:23px;justify-content:center;left:0;padding:1px;position:absolute;right:0;top:0;z-index:2}.block-kit-image-preview{cursor:zoom-in}.block-kit-image-resider{position:absolute;z-index:1}.block-kit-image-resider:after{background-color:var(--color-bg-1);border:1px solid rgb(var(--arcoblue-6));border-radius:10px;content:"";display:block;height:10px;width:10px;z-index:1}.block-kit-image-resider[data-type=lt]{cursor:nwse-resize;left:-5px;top:-5px}.block-kit-image-resider[data-type=rt]{cursor:nesw-resize;right:-5px;top:-5px}.block-kit-image-resider[data-type=lb]{bottom:-5px;cursor:nesw-resize;left:-5px}.block-kit-image-resider[data-type=rb]{bottom:-5px;cursor:nwse-resize;right:-5px}.block-kit-inline-code{background-color:var(--color-fill-2);border-bottom-style:solid;border-color:var(--color-border-2);border-top-style:solid;border-width:1px;box-sizing:border-box;padding-bottom:1px;padding-top:1px}.block-kit-inline-code-start{border-bottom-left-radius:3px;border-left-style:solid;border-top-left-radius:3px;margin-left:2px;padding-left:2px}.block-kit-inline-code-end{border-bottom-right-radius:3px;border-right-style:solid;border-top-right-radius:3px;margin-right:2px;padding-right:2px}.block-kit-hyper-link{color:rgb(var(--link-6));cursor:pointer;text-decoration:none}.block-kit-mention-embed{display:inline-block;line-height:1.3}.block-kit-mention-embed .block-kit-mention-name{background-color:rgba(var(--arcoblue-6),.9);border-radius:8px;box-sizing:border-box;color:var(--color-bg-5);display:inline-block;margin:0 3px;padding:0 4px}.block-kit-suggest-panel{-ms-overflow-style:none;background-color:var(--color-bg-1);border:1px solid var(--color-border-2);border-radius:3px;border-radius:5px;box-shadow:0 0 4px var(--color-border-2);box-sizing:border-box;color:var(--color-text-1);font-size:13px;height:150px;overflow:-moz-scrollbars-none;overflow-y:auto;overscroll-behavior:contain;padding:5px 7px;position:absolute;scrollbar-width:none;width:100px;z-index:999}.block-kit-suggest-panel::-webkit-scrollbar{display:none}.block-kit-suggest-panel .block-kit-suggest-item{border-radius:4px;overflow:hidden;padding:3px 5px;text-overflow:ellipsis;white-space:nowrap}.block-kit-suggest-panel .block-kit-suggest-item.active{background-color:var(--color-fill-2)}.block-kit-suggest-panel .block-kit-suggest-empty{color:var(--color-text-3);margin-top:10px;text-align:center}.block-kit-order-list{display:flex;list-style-type:none;margin-block-end:0;margin-block-start:0;margin-inline-end:0;margin-inline-start:0;padding-inline-start:0}.block-kit-order-list .block-kit-order-indicator{color:rgb(var(--arcoblue-6));margin-right:6px;user-select:none}.block-kit-order-list .block-kit-order-item{display:block;flex:1 0 0}.block-kit-quote{border-left:3px solid var(--color-border-2);color:var(--color-text-2);padding-left:10px}.block-kit-menu-toolbar .menu-toolbar-cut{background-color:var(--color-fill-3);box-sizing:border-box;margin:4px 6px;width:1px}.arco-trigger.menu-toolbar-emoji-trigger{width:352px}.arco-trigger.menu-toolbar-emoji-trigger .scroll{max-height:300px}.block-kit-color-picker{padding:10px;width:230px}.block-kit-color-picker .kit-color-picker-label{font-size:12px}.block-kit-color-picker .kit-picker-group{display:flex;flex-wrap:wrap;font-size:13px;justify-content:space-between;margin:5px 0}.block-kit-color-picker .kit-picker-item-wrapper{border:1px solid transparent;border-radius:3px;flex-shrink:0}.block-kit-color-picker .kit-picker-item-wrapper.active{border-color:rgb(var(--arcoblue-6))}.block-kit-color-picker .kit-picker-item{align-items:center;border:1px solid var(--color-border-1);border-radius:3px;box-sizing:border-box;cursor:pointer;display:flex;height:22px;justify-content:center;width:22px}.block-kit-color-picker .kit-picker-background-case .kit-picker-item-wrapper{margin-right:3px;margin-top:4px}.block-kit-color-picker .kit-picker-background-case .kit-picker-item{border-color:transparent}.block-kit-color-picker .kit-picker-background-case .kit-picker-item-empty-background{border-color:var(--color-border-2);overflow:hidden;position:relative}.block-kit-color-picker .kit-picker-background-case .kit-picker-item-empty-background:before{background-color:var(--color-border-3);content:"";height:33px;left:7px;position:absolute;top:-9px;transform:rotate(-45deg);width:1px;z-index:2}.block-kit-menu-toolbar .menu-toolbar-item.kit-color-case{align-items:center;display:flex;padding:3px 0}.block-kit-menu-toolbar .menu-toolbar-item.kit-color-case .kit-color-block{border-radius:3px;padding:0 5px}.block-kit-menu-toolbar .menu-toolbar-item.kit-color-case .menu-toolbar-icon-down{margin-left:0;margin-right:3px}.block-kit-toolbar-dropdown .block-kit-toolbar-height-item{position:relative}.block-kit-toolbar-dropdown .block-kit-toolbar-height-item .arco-icon-check{left:5px;position:absolute}.block-kit-link-popup{background-color:var(--color-bg-1);border-radius:3px;box-shadow:0 0 4px var(--color-border-2);padding:10px 15px;position:relative;width:330px}.block-kit-link-popup .arco-form-size-small .arco-form-label-item>label{font-size:13px}.block-kit-link-popup .arco-form-item{margin:5px 0}.block-kit-link-popup .block-kit-link-popup-button{bottom:15px;position:absolute;right:15px}.block-kit-link-popup .block-kit-link-popup-button .arco-btn{margin-left:10px}.block-kit-link-popup .block-kit-link-popup-go{cursor:pointer}.block-kit-menu-toolbar{border-bottom:1px solid var(--color-border-3);display:flex;padding:6px 5px;user-select:none}.block-kit-menu-toolbar .menu-toolbar-item{align-items:center;border-radius:3px;color:var(--color-text-1);cursor:pointer;display:flex;margin:0 3px;padding:3px 7px}.block-kit-menu-toolbar .menu-toolbar-item.active,.block-kit-menu-toolbar .menu-toolbar-item:hover{background-color:var(--color-fill-2);color:var(--color-text-1)}.block-kit-menu-toolbar .menu-toolbar-item.disable{background-color:unset;color:var(--color-text-3)}.block-kit-menu-toolbar .menu-toolbar-icon-down{font-size:12px;margin-left:3px}.block-kit-toolbar-dropdown{background-color:var(--color-bg-1);border:1px solid var(--color-border-2);border-radius:3px;box-shadow:0 0 4px var(--color-border-2);color:var(--color-text-1)}.block-kit-toolbar-dropdown>.kit-toolbar-node{align-items:center;cursor:pointer;display:flex;font-size:12px;height:30px;justify-content:center;margin:5px;width:70px}.block-kit-toolbar-dropdown>.kit-toolbar-node>.arco-icon{font-size:13px}.block-kit-toolbar-dropdown>.kit-toolbar-node:hover{background-color:var(--color-fill-2)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.block-kit-float-toolbar{animation:fade-in .3s;background-color:var(--color-bg-2);border:1px solid var(--color-border-1);border-radius:3px;box-shadow:1px 2px 4px var(--color-border-2);position:absolute;transform:translate(-50%,-100%);z-index:999}.block-kit-menu-toolbar.block-kit-float-toolbar{border-bottom:unset}.block-kit-menu-toolbar.block-kit-float-toolbar .menu-toolbar-item{color:var(--color-text-1);margin:0 5px}.block-kit-menu-toolbar.block-kit-float-toolbar .menu-toolbar-item.kit-color-case{margin:0;padding:3px}

package/dist/lib/index.d.ts

@@ -43,7 +43,7 @@ export { Shortcut } from "./shortcut";
 export type { ShortcutFunc, ShortcutFuncMap } from "./shortcut/types";
 export { StrikePlugin } from "./strike/index";
 export { STRIKE_KEY } from "./strike/types";
-export { FloatToolbar, Mixin, Toolbar } from "./toolbar";
+export { FloatToolbar, Toolbar, ToolBarMixin } from "./toolbar";
 export type { ToolbarContextType } from "./toolbar/context/provider";
 export { ToolbarContext, useToolbarContext } from "./toolbar/context/provider";
 export { UnderlinePlugin } from "./underline/index";

package/dist/lib/index.js

@@ -32,40 +32,26 @@ var lineHeight_index = require('./line-height/index.js');
 var lineHeight_types_index = require('./line-height/types/index.js');
 var link_index = require('./link/index.js');
 var link_types_index = require('./link/types/index.js');
-var mention_index = require('./index-ffc4bb34.js');
+var mention_index = require('./mention/index.js');
+var mention_modules_suggest = require('./mention/modules/suggest.js');
 var mention_types_index = require('./mention/types/index.js');
 var orderList_index = require('./order-list/index.js');
 var orderList_types_index = require('./order-list/types/index.js');
 var quote_index = require('./quote/index.js');
 var quote_types_index = require('./quote/types/index.js');
-var selection = require('./selection-868f15c1.js');
-var dom = require('./dom-cb8b8e40.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_dom = require('./shared/utils/dom.js');
+var shared_utils_is = require('./shared/utils/is.js');
 var shortcut_index = require('./shortcut/index.js');
 var strike_index = require('./strike/index.js');
 var strike_types_index = require('./strike/types/index.js');
-var toolbar_index = require('./index-f50053bf.js');
+var toolbar_index = require('./toolbar/index.js');
+var toolbar_context_provider = require('./toolbar/context/provider.js');
 var underline_index = require('./underline/index.js');
 var underline_types_index = require('./underline/types/index.js');
-require('@block-kit/react');
-require('@block-kit/core');
-require('@block-kit/utils');
-require('./tslib.es6-d44c9a95.js');
-require('react/jsx-runtime');
-require('@block-kit/delta');
-require('./is-fa1755d0.js');
-require('@emoji-mart/data');
-require('emoji-mart');
-require('@arco-design/web-react/icon');
-require('@arco-design/web-react');
-require('react');
-require('react-dom');
-require('@block-kit/utils/dist/es/hooks');
-require('./is-18806678.js');
-require('./marks-a30b8a0f.js');
-require('./shortcut/types/index.js');
-require('@emoji-mart/react');
-require('@arco-design/web-react/es/Form/useForm');
+var toolbar_context_float = require('./toolbar/context/float.js');
+var toolbar_context_basic = require('./toolbar/context/basic.js');
 
 
 
@@ -111,7 +97,7 @@ exports.LINK_BLANK_KEY = link_types_index.LINK_BLANK_KEY;
 exports.LINK_KEY = link_types_index.LINK_KEY;
 exports.LINK_TEMP_KEY = link_types_index.LINK_TEMP_KEY;
 exports.MentionPlugin = mention_index.MentionPlugin;
-exports.SuggestModule = mention_index.SuggestModule;
+exports.SuggestModule = mention_modules_suggest.SuggestModule;
 exports.MENTION_KEY = mention_types_index.MENTION_KEY;
 exports.MENTION_NAME = mention_types_index.MENTION_NAME;
 exports.OrderListPlugin = orderList_index.OrderListPlugin;
@@ -121,21 +107,21 @@ exports.ORDER_LIST_KEY = orderList_types_index.ORDER_LIST_KEY;
 exports.ORDER_LIST_TYPE = orderList_types_index.ORDER_LIST_TYPE;
 exports.QuotePlugin = quote_index.QuotePlugin;
 exports.QUOTE_KEY = quote_types_index.QUOTE_KEY;
-exports.SelectionHOC = selection.SelectionHOC;
-exports.SelectionPlugin = selection.SelectionPlugin;
-exports.getMountDOM = dom.getMountDOM;
-exports.preventContextEvent = dom.preventContextEvent;
-exports.scrollIfNeeded = dom.scrollIfNeeded;
-exports.setMountDOM = dom.setMountDOM;
-exports.isEmptyLine = is.isEmptyLine;
-exports.isKeyCode = is.isKeyCode;
+exports.SelectionHOC = shared_components_selection.SelectionHOC;
+exports.SelectionPlugin = shared_modules_selection.SelectionPlugin;
+exports.getMountDOM = shared_utils_dom.getMountDOM;
+exports.preventContextEvent = shared_utils_dom.preventContextEvent;
+exports.scrollIfNeeded = shared_utils_dom.scrollIfNeeded;
+exports.setMountDOM = shared_utils_dom.setMountDOM;
+exports.isEmptyLine = shared_utils_is.isEmptyLine;
+exports.isKeyCode = shared_utils_is.isKeyCode;
 exports.Shortcut = shortcut_index.Shortcut;
 exports.StrikePlugin = strike_index.StrikePlugin;
 exports.STRIKE_KEY = strike_types_index.STRIKE_KEY;
-exports.FloatToolbar = toolbar_index.FloatToolbar;
-exports.Mixin = toolbar_index.Mixin;
-exports.Toolbar = toolbar_index.Toolbar;
-exports.ToolbarContext = toolbar_index.ToolbarContext;
-exports.useToolbarContext = toolbar_index.useToolbarContext;
+exports.ToolBarMixin = toolbar_index.ToolBarMixin;
+exports.ToolbarContext = toolbar_context_provider.ToolbarContext;
+exports.useToolbarContext = toolbar_context_provider.useToolbarContext;
 exports.UnderlinePlugin = underline_index.UnderlinePlugin;
 exports.UNDERLINE_KEY = underline_types_index.UNDERLINE_KEY;
+exports.FloatToolbar = toolbar_context_float.FloatToolbar;
+exports.Toolbar = toolbar_context_basic.Toolbar;

package/dist/lib/inline-code/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 core = require('@block-kit/core');
 var react = require('@block-kit/react');
 var inlineCode_types_index = require('./types/index.js');

package/dist/lib/link/index.js

@@ -2,24 +2,12 @@
 
 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 react = require('@block-kit/react');
 var utils = require('@block-kit/utils');
 var link_types_index = require('./types/index.js');
-require('@block-kit/core');
-
-const A = props => {
-    const { attrs } = props;
-    const { readonly } = react.useReadonly();
-    const href = attrs[link_types_index.LINK_KEY];
-    const target = attrs[link_types_index.LINK_BLANK_KEY] ? "_blank" : "_self";
-    const onClick = (e) => {
-        e[utils.CTRL_KEY] && window.open(href, "_blank");
-        e.preventDefault();
-    };
-    return (jsxRuntime.jsx("a", { href: href, target: target, rel: "noreferrer", className: "block-kit-hyper-link", onClick: readonly ? void 0 : onClick, children: props.children }));
-};
+var link_view_a = require('./view/a.js');
 
 class LinkPlugin extends react.EditorPlugin {
     constructor(editor) {
@@ -42,7 +30,7 @@ class LinkPlugin extends react.EditorPlugin {
         const href = attrs[link_types_index.LINK_KEY];
         if (!href)
             return context.children;
-        return jsxRuntime.jsx(A, { attrs: attrs, children: context.children });
+        return jsxRuntime.jsx(link_view_a.A, { attrs: attrs, children: context.children });
     }
     renderLeaf(context) {
         const attrs = context.attributes;

package/dist/lib/link/view/a.js

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('@block-kit/react');
+var utils = require('@block-kit/utils');
+var link_types_index = require('../types/index.js');
+
+const A = props => {
+    const { attrs } = props;
+    const { readonly } = react.useReadonly();
+    const href = attrs[link_types_index.LINK_KEY];
+    const target = attrs[link_types_index.LINK_BLANK_KEY] ? "_blank" : "_self";
+    const onClick = (e) => {
+        e[utils.CTRL_KEY] && window.open(href, "_blank");
+        e.preventDefault();
+    };
+    return (jsxRuntime.jsx("a", { href: href, target: target, rel: "noreferrer", className: "block-kit-hyper-link", onClick: readonly ? void 0 : onClick, children: props.children }));
+};
+
+exports.A = A;

package/dist/lib/mention/index.js

@@ -2,20 +2,31 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('react/jsx-runtime');
-require('@block-kit/react');
-var mention_index = require('../index-ffc4bb34.js');
-require('./types/index.js');
-require('../tslib.es6-d44c9a95.js');
-require('@block-kit/core');
-require('@block-kit/delta');
-require('@block-kit/utils');
-require('react-dom');
-require('../dom-cb8b8e40.js');
-require('../is-473d664a.js');
-require('@block-kit/utils/dist/es/hooks');
-require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('@block-kit/react');
+var mention_modules_suggest = require('./modules/suggest.js');
+var mention_types_index = require('./types/index.js');
 
+class MentionPlugin extends react.EditorPlugin {
+    constructor(editor) {
+        super();
+        this.editor = editor;
+        this.key = mention_types_index.MENTION_KEY;
+        this.suggest = new mention_modules_suggest.SuggestModule(editor);
+    }
+    destroy() {
+        this.suggest.destroy();
+    }
+    match(attrs) {
+        return !!attrs[mention_types_index.MENTION_KEY];
+    }
+    renderLeaf(context) {
+        const attrs = context.attributes || {};
+        const name = attrs[mention_types_index.MENTION_NAME];
+        if (!name || !attrs[mention_types_index.MENTION_KEY])
+            return context.children;
+        return (jsxRuntime.jsx(react.Embed, { className: "block-kit-mention-embed", context: context, children: jsxRuntime.jsxs("span", { className: "block-kit-mention-name", children: ["@", name] }) }));
+    }
+}
 
-
-exports.MentionPlugin = mention_index.MentionPlugin;
+exports.MentionPlugin = MentionPlugin;

package/dist/lib/mention/modules/suggest.js

@@ -0,0 +1,106 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+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 utils = require('@block-kit/utils');
+var ReactDOM = require('react-dom');
+var shared_utils_dom = require('../../shared/utils/dom.js');
+var shared_utils_is = require('../../shared/utils/is.js');
+var mention_utils_constant = require('../utils/constant.js');
+var mention_view_suggest = require('../view/suggest.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
+
+class SuggestModule {
+    constructor(editor) {
+        this.editor = editor;
+        this.rect = null;
+        this.isMountSuggest = false;
+        this.mountSuggestNode = null;
+        this.point = new core.Point(0, 0);
+        editor.event.on(core.EDITOR_EVENT.KEY_DOWN, this.onKeydown, 101);
+    }
+    destroy() {
+        this.unmountSuggestPanel();
+        this.editor.event.off(core.EDITOR_EVENT.KEY_DOWN, this.onKeydown);
+        this.editor.event.off(core.EDITOR_EVENT.SELECTION_CHANGE, this.onSelectionChange);
+    }
+    onKeydown(event) {
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.D2) && event.shiftKey) {
+            const sel = this.editor.selection.get();
+            const caretRect = this.editor.rect.getRawCaretRect();
+            if (!caretRect || !sel)
+                return void 0;
+            const editorRect = this.editor.rect.getEditorRect();
+            const rect = core.relativeTo(caretRect, editorRect);
+            // 这里是 CSS 预设的面板高度
+            const PANEL_HEIGHT = 150;
+            if (caretRect.bottom + PANEL_HEIGHT <= window.innerHeight) {
+                // 放置于下方
+                rect.top = rect.bottom + mention_utils_constant.SUGGEST_OFFSET;
+            }
+            else {
+                // 放置于上方
+                rect.top = rect.top - PANEL_HEIGHT - mention_utils_constant.SUGGEST_OFFSET;
+            }
+            this.rect = { top: rect.top, left: rect.left };
+            this.point = sel.start.clone();
+            this.editor.event.on(core.EDITOR_EVENT.SELECTION_CHANGE, this.onSelectionChange);
+        }
+        if (this.isMountSuggest && shared_utils_is.isKeyCode(event, utils.KEY_CODE.ESC)) {
+            this.unmountSuggestPanel();
+        }
+    }
+    onSelectionChange(event) {
+        const { current } = event;
+        if (!current ||
+            !current.isCollapsed ||
+            current.start.line !== this.point.line ||
+            current.start.offset <= this.point.offset) {
+            this.unmountSuggestPanel();
+            return void 0;
+        }
+        const ops = this.editor.lookup.getFragment(new core.Range(this.point, current.end));
+        if (!ops)
+            return void 0;
+        const text = delta.deltaToText(new delta.Delta(ops));
+        this.mountSuggestPanel(text.slice(1));
+    }
+    mountSuggestPanel(text = "") {
+        if (!this.rect)
+            return void 0;
+        if (!this.mountSuggestNode) {
+            this.mountSuggestNode = document.createElement("div");
+            this.mountSuggestNode.dataset.type = "mention";
+            shared_utils_dom.getMountDOM(this.editor).appendChild(this.mountSuggestNode);
+        }
+        const top = this.rect.top;
+        const left = this.rect.left;
+        const dom = this.mountSuggestNode;
+        this.isMountSuggest = true;
+        ReactDOM__default["default"].render(jsxRuntime.jsx(mention_view_suggest.Suggest, { controller: this, top: top, left: left, text: text }), dom);
+    }
+    unmountSuggestPanel() {
+        if (this.isMountSuggest && this.mountSuggestNode) {
+            ReactDOM__default["default"].unmountComponentAtNode(this.mountSuggestNode);
+        }
+        this.mountSuggestNode && this.mountSuggestNode.remove();
+        this.editor.event.off(core.EDITOR_EVENT.SELECTION_CHANGE, this.onSelectionChange);
+        this.mountSuggestNode = null;
+        this.isMountSuggest = false;
+    }
+}
+tslib_es6.__decorate([
+    utils.Bind
+], SuggestModule.prototype, "onKeydown", null);
+tslib_es6.__decorate([
+    utils.Bind
+], SuggestModule.prototype, "onSelectionChange", null);
+
+exports.SuggestModule = SuggestModule;

package/dist/lib/mention/utils/constant.js

@@ -0,0 +1,29 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const SUGGEST_OFFSET = 5;
+const DATA = [
+    "Alice",
+    "Bob",
+    "Charlie",
+    "David",
+    "Eve",
+    "Frank",
+    "Grace",
+    "Heidi",
+    "Ivan",
+    "Judy",
+    "Mallory",
+    "Oscar",
+    "Peggy",
+    "Romeo",
+    "Sybil",
+    "Trudy",
+    "Victor",
+    "Walter",
+    "Zoe",
+];
+
+exports.DATA = DATA;
+exports.SUGGEST_OFFSET = SUGGEST_OFFSET;

package/dist/lib/mention/view/suggest.js

@@ -0,0 +1,76 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@block-kit/core');
+var delta = require('@block-kit/delta');
+var utils = require('@block-kit/utils');
+var hooks = require('@block-kit/utils/dist/es/hooks');
+var React = require('react');
+var shared_utils_dom = require('../../shared/utils/dom.js');
+var shared_utils_is = require('../../shared/utils/is.js');
+var mention_types_index = require('../types/index.js');
+var mention_utils_constant = require('../utils/constant.js');
+
+const Suggest = props => {
+    const { controller } = props;
+    const editor = controller.editor;
+    const ref = React.useRef(null);
+    const [activeIndex, setActiveIndex] = React.useState(0);
+    const list = React.useMemo(() => {
+        setActiveIndex(0);
+        if (!props.text)
+            return mention_utils_constant.DATA;
+        return mention_utils_constant.DATA.filter(it => {
+            return it.toUpperCase().includes(props.text.toUpperCase());
+        });
+    }, [props.text]);
+    const onKeydown = hooks.useMemoFn((event, context) => {
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.DOWN)) {
+            const nextIndex = (activeIndex + 1) % list.length;
+            setActiveIndex(nextIndex);
+            const container = ref.current;
+            const child = container && container.children[nextIndex];
+            container && child && shared_utils_dom.scrollIfNeeded(container, child, 5);
+            shared_utils_dom.preventContextEvent(event, context);
+        }
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.UP)) {
+            const prevIndex = (activeIndex - 1 + list.length) % list.length;
+            setActiveIndex(prevIndex);
+            const container = ref.current;
+            const child = container && container.children[prevIndex];
+            container && child && shared_utils_dom.scrollIfNeeded(container, child, 5);
+            shared_utils_dom.preventContextEvent(event, context);
+        }
+        if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.ENTER)) {
+            const item = list[activeIndex];
+            shared_utils_dom.preventContextEvent(event, context);
+            const sel = editor.selection.get();
+            if (!item || !sel)
+                return void 0;
+            const range = new core.Range(controller.point, sel.end);
+            const raw = core.RawRange.fromRange(editor, range);
+            if (!raw)
+                return void 0;
+            const delta$1 = new delta.Delta()
+                .retain(raw.start)
+                .delete(raw.len)
+                .insert(" ", {
+                [mention_types_index.MENTION_KEY]: utils.TRULY,
+                [mention_types_index.MENTION_NAME]: item,
+            });
+            editor.state.apply(delta$1);
+            controller.unmountSuggestPanel();
+        }
+    });
+    React.useEffect(() => {
+        editor.event.on(core.EDITOR_EVENT.KEY_DOWN, onKeydown, 80);
+        return () => {
+            editor.event.off(core.EDITOR_EVENT.KEY_DOWN, onKeydown);
+        };
+    }, [onKeydown, editor.event]);
+    return (jsxRuntime.jsxs("div", { ref: ref, className: "block-kit-suggest-panel", style: { top: props.top, left: props.left }, onMouseDown: utils.preventNativeEvent, children: [list.map((it, index) => (jsxRuntime.jsx("div", { className: utils.cs("block-kit-suggest-item", index === activeIndex && "active"), children: it }, index))), !list.length && jsxRuntime.jsx("div", { className: "block-kit-suggest-empty", children: "No result" })] }));
+};
+
+exports.Suggest = Suggest;