@block-kit/plugin 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/es/align/{index.js → align/index.js} +1 -1
- package/dist/es/background/{index.js → background/index.js} +1 -1
- package/dist/es/bold/{index.js → bold/index.js} +1 -1
- package/dist/es/bullet-list/{index.js → bullet-list/index.js} +8 -12
- package/dist/es/{is-2b264ec8.js → bullet-list/utils/bullet-list/utils/is.js} +2 -2
- package/dist/es/bullet-list/view/bullet-list/view/list.js +9 -0
- package/dist/es/divider/{index.js → divider/index.js} +5 -5
- package/dist/es/emoji/{index.js → emoji/index.js} +2 -2
- package/dist/es/font-color/{index.js → font-color/index.js} +1 -1
- package/dist/es/font-size/{index.js → font-size/index.js} +1 -1
- package/dist/es/heading/{index.js → heading/index.js} +1 -1
- package/dist/es/image/image/index.js +135 -0
- package/dist/es/image/view/image/view/image.js +39 -0
- package/dist/es/image/view/image/view/wrapper.js +90 -0
- package/dist/es/indent/{index.js → indent/index.js} +3 -3
- package/dist/es/index.css +1 -1
- package/dist/es/index.js +50 -64
- package/dist/es/inline-code/{index.js → inline-code/index.js} +2 -2
- package/dist/es/italic/{index.js → italic/index.js} +1 -1
- package/dist/es/line-height/{index.js → line-height/index.js} +1 -1
- package/dist/es/link/{index.js → link/index.js} +5 -17
- package/dist/es/link/view/link/view/a.js +18 -0
- package/dist/es/mention/mention/index.js +28 -0
- package/dist/es/mention/modules/mention/modules/suggest.js +98 -0
- package/dist/es/mention/utils/mention/utils/constant.js +24 -0
- package/dist/es/mention/view/mention/view/suggest.js +72 -0
- package/dist/es/{tslib.es6-83956cc1.js → node_modules/.pnpm/tslib@2.8.1/node_modules/tslib/tslib.es6.mjs.js} +1 -1
- package/dist/es/order-list/{index.js → order-list/index.js} +11 -150
- package/dist/es/order-list/utils/order-list/utils/format.js +75 -0
- package/dist/es/order-list/utils/order-list/utils/is.js +12 -0
- package/dist/es/order-list/utils/order-list/utils/serial.js +68 -0
- package/dist/es/order-list/view/order-list/view/list.js +10 -0
- package/dist/es/quote/{index.js → quote/index.js} +4 -4
- package/dist/es/{selection-badfb0bc.js → shared/components/shared/components/selection.js} +3 -31
- package/dist/es/shared/icons/shared/icons/divider.js +5 -0
- package/dist/es/shared/icons/shared/icons/emoji.js +5 -0
- package/dist/es/shared/icons/shared/icons/font-color.js +5 -0
- package/dist/es/shared/icons/shared/icons/font-size.js +5 -0
- package/dist/es/shared/icons/shared/icons/justify.js +5 -0
- package/dist/es/shared/icons/shared/icons/line-height.js +5 -0
- package/dist/es/shared/icons/shared/icons/text.js +5 -0
- package/dist/es/shared/modules/shared/modules/selection.js +32 -0
- package/dist/es/{dom-71a99400.js → shared/utils/shared/utils/dom.js} +1 -1
- package/dist/es/shared/utils/shared/utils/event.js +5 -0
- package/dist/es/{is-3de778e2.js → shared/utils/shared/utils/is.js} +1 -1
- package/dist/es/shortcut/modules/shortcut/modules/preset.js +23 -0
- package/dist/es/shortcut/{index.js → shortcut/index.js} +6 -25
- package/dist/es/strike/{index.js → strike/index.js} +1 -1
- package/dist/es/toolbar/context/toolbar/context/basic.js +69 -0
- package/dist/es/toolbar/context/toolbar/context/float.js +67 -0
- package/dist/es/toolbar/context/toolbar/context/provider.js +12 -0
- package/dist/es/toolbar/modules/toolbar/modules/align.js +20 -0
- package/dist/es/toolbar/modules/toolbar/modules/bold.js +16 -0
- package/dist/es/toolbar/modules/toolbar/modules/bullet-list.js +17 -0
- package/dist/es/toolbar/modules/toolbar/modules/cut.js +7 -0
- package/dist/es/toolbar/modules/toolbar/modules/divider.js +15 -0
- package/dist/es/toolbar/modules/toolbar/modules/emoji.js +25 -0
- package/dist/es/toolbar/modules/toolbar/modules/font-color.js +49 -0
- package/dist/es/toolbar/modules/toolbar/modules/font-size.js +19 -0
- package/dist/es/toolbar/modules/toolbar/modules/heading.js +19 -0
- package/dist/es/toolbar/modules/toolbar/modules/history.js +34 -0
- package/dist/es/toolbar/modules/toolbar/modules/image.js +15 -0
- package/dist/es/toolbar/modules/toolbar/modules/inline-code.js +15 -0
- package/dist/es/toolbar/modules/toolbar/modules/italic.js +16 -0
- package/dist/es/toolbar/modules/toolbar/modules/line-height.js +15 -0
- package/dist/es/toolbar/modules/toolbar/modules/link.js +89 -0
- package/dist/es/toolbar/modules/toolbar/modules/order-list.js +17 -0
- package/dist/es/toolbar/modules/toolbar/modules/quote.js +15 -0
- package/dist/es/toolbar/modules/toolbar/modules/strike.js +15 -0
- package/dist/es/toolbar/modules/toolbar/modules/underline.js +15 -0
- package/dist/es/toolbar/toolbar/index.js +45 -0
- package/dist/es/toolbar/types/toolbar/types/index.js +7 -0
- package/dist/es/{marks-ac0ec630.js → toolbar/utils/toolbar/utils/marks.js} +1 -5
- package/dist/es/underline/{index.js → underline/index.js} +1 -1
- package/dist/lib/bullet-list/index.js +21 -25
- package/dist/lib/{is-fa1755d0.js → bullet-list/utils/is.js} +3 -1
- package/dist/lib/bullet-list/view/list.js +13 -0
- package/dist/lib/divider/index.js +7 -7
- package/dist/lib/emoji/index.js +1 -1
- package/dist/lib/image/index.js +9 -119
- package/dist/lib/image/view/image.js +43 -0
- package/dist/lib/image/view/wrapper.js +94 -0
- package/dist/lib/indent/index.js +3 -3
- package/dist/lib/index.css +1 -1
- package/dist/lib/index.js +23 -37
- package/dist/lib/inline-code/index.js +1 -1
- package/dist/lib/link/index.js +3 -15
- package/dist/lib/link/view/a.js +22 -0
- package/dist/lib/mention/index.js +26 -15
- package/dist/lib/mention/modules/suggest.js +106 -0
- package/dist/lib/mention/utils/constant.js +29 -0
- package/dist/lib/mention/view/suggest.js +76 -0
- package/dist/lib/order-list/index.js +34 -173
- package/dist/lib/order-list/utils/format.js +79 -0
- package/dist/lib/{is-18806678.js → order-list/utils/is.js} +4 -2
- package/dist/lib/order-list/utils/serial.js +72 -0
- package/dist/lib/order-list/view/list.js +14 -0
- package/dist/lib/quote/index.js +12 -12
- package/dist/lib/{selection-868f15c1.js → shared/components/selection.js} +2 -29
- package/dist/lib/shared/icons/divider.js +9 -0
- package/dist/lib/shared/icons/emoji.js +9 -0
- package/dist/lib/shared/icons/font-color.js +9 -0
- package/dist/lib/shared/icons/font-size.js +9 -0
- package/dist/lib/shared/icons/justify.js +9 -0
- package/dist/lib/shared/icons/line-height.js +9 -0
- package/dist/lib/shared/icons/text.js +9 -0
- package/dist/lib/shared/modules/selection.js +36 -0
- package/dist/lib/{dom-cb8b8e40.js → shared/utils/dom.js} +2 -0
- package/dist/lib/shared/utils/event.js +9 -0
- package/dist/lib/{is-473d664a.js → shared/utils/is.js} +2 -0
- package/dist/lib/shortcut/index.js +8 -27
- package/dist/lib/shortcut/modules/preset.js +27 -0
- package/dist/lib/toolbar/context/basic.js +73 -0
- package/dist/lib/toolbar/context/float.js +75 -0
- package/dist/lib/toolbar/context/provider.js +21 -0
- package/dist/lib/toolbar/index.js +45 -38
- package/dist/lib/toolbar/modules/align.js +24 -0
- package/dist/lib/toolbar/modules/bold.js +20 -0
- package/dist/lib/toolbar/modules/bullet-list.js +21 -0
- package/dist/lib/toolbar/modules/cut.js +11 -0
- package/dist/lib/toolbar/modules/divider.js +19 -0
- package/dist/lib/toolbar/modules/emoji.js +33 -0
- package/dist/lib/toolbar/modules/font-color.js +53 -0
- package/dist/lib/toolbar/modules/font-size.js +23 -0
- package/dist/lib/toolbar/modules/heading.js +23 -0
- package/dist/lib/toolbar/modules/history.js +38 -0
- package/dist/lib/toolbar/modules/image.js +19 -0
- package/dist/lib/toolbar/modules/inline-code.js +19 -0
- package/dist/lib/toolbar/modules/italic.js +20 -0
- package/dist/lib/toolbar/modules/line-height.js +19 -0
- package/dist/lib/toolbar/modules/link.js +97 -0
- package/dist/lib/toolbar/modules/order-list.js +21 -0
- package/dist/lib/toolbar/modules/quote.js +19 -0
- package/dist/lib/toolbar/modules/strike.js +19 -0
- package/dist/lib/toolbar/modules/underline.js +19 -0
- package/dist/lib/{marks-a30b8a0f.js → toolbar/utils/marks.js} +1 -4
- package/dist/styles/index.css +1 -0
- package/package.json +6 -6
- package/dist/es/image/index.js +0 -245
- package/dist/es/index-1e46887d.js +0 -205
- package/dist/es/index-ddc2e5ac.js +0 -493
- package/dist/es/is-7f3ae820.js +0 -12
- package/dist/es/mention/index.js +0 -13
- package/dist/es/toolbar/index.js +0 -34
- package/dist/es/toolbar/types/index.js +0 -7
- package/dist/lib/index-f50053bf.js +0 -506
- package/dist/lib/index-ffc4bb34.js +0 -212
- /package/dist/es/align/types/{index.js → align/types/index.js} +0 -0
- /package/dist/es/background/types/{index.js → background/types/index.js} +0 -0
- /package/dist/es/bold/types/{index.js → bold/types/index.js} +0 -0
- /package/dist/es/bullet-list/types/{index.js → bullet-list/types/index.js} +0 -0
- /package/dist/es/divider/types/{index.js → divider/types/index.js} +0 -0
- /package/dist/es/emoji/types/{index.js → emoji/types/index.js} +0 -0
- /package/dist/es/font-color/types/{index.js → font-color/types/index.js} +0 -0
- /package/dist/es/font-size/types/{index.js → font-size/types/index.js} +0 -0
- /package/dist/es/heading/types/{index.js → heading/types/index.js} +0 -0
- /package/dist/es/image/types/{index.js → image/types/index.js} +0 -0
- /package/dist/es/indent/types/{index.js → indent/types/index.js} +0 -0
- /package/dist/es/inline-code/types/{index.js → inline-code/types/index.js} +0 -0
- /package/dist/es/italic/types/{index.js → italic/types/index.js} +0 -0
- /package/dist/es/line-height/types/{index.js → line-height/types/index.js} +0 -0
- /package/dist/es/link/types/{index.js → link/types/index.js} +0 -0
- /package/dist/es/mention/types/{index.js → mention/types/index.js} +0 -0
- /package/dist/es/order-list/types/{index.js → order-list/types/index.js} +0 -0
- /package/dist/es/quote/types/{index.js → quote/types/index.js} +0 -0
- /package/dist/es/shortcut/types/{index.js → shortcut/types/index.js} +0 -0
- /package/dist/es/strike/types/{index.js → strike/types/index.js} +0 -0
- /package/dist/es/underline/types/{index.js → underline/types/index.js} +0 -0
- /package/dist/lib/{tslib.es6-d44c9a95.js → tslib.es6-82029525.js} +0 -0
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { IconCode } from '@arco-design/web-react/icon';
|
|
3
|
+
import { cs, NIL, TRULY } from '@block-kit/utils';
|
|
4
|
+
import { INLINE_CODE } from '../../../../inline-code/types/inline-code/types/index.js';
|
|
5
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
6
|
+
|
|
7
|
+
const InlineCode = () => {
|
|
8
|
+
const { keys, refreshMarks, editor } = useToolbarContext();
|
|
9
|
+
return (jsx("div", { className: cs("menu-toolbar-item", keys[INLINE_CODE] && "active"), onClick: () => {
|
|
10
|
+
editor.command.exec(INLINE_CODE, { value: keys[INLINE_CODE] ? NIL : TRULY });
|
|
11
|
+
refreshMarks();
|
|
12
|
+
}, children: jsx(IconCode, {}) }));
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
export { InlineCode };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { IconItalic } from '@arco-design/web-react/icon';
|
|
3
|
+
import { cs, NIL, TRULY } from '@block-kit/utils';
|
|
4
|
+
import { ITALIC_KEY } from '../../../../italic/types/italic/types/index.js';
|
|
5
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
6
|
+
|
|
7
|
+
const Italic = () => {
|
|
8
|
+
const { keys, refreshMarks, editor } = useToolbarContext();
|
|
9
|
+
const onExec = () => {
|
|
10
|
+
editor.command.exec(ITALIC_KEY, { value: keys[ITALIC_KEY] ? NIL : TRULY });
|
|
11
|
+
refreshMarks();
|
|
12
|
+
};
|
|
13
|
+
return (jsx("div", { className: cs("menu-toolbar-item", keys[ITALIC_KEY] && "active"), onClick: onExec, children: jsx(IconItalic, {}) }));
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
export { Italic };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { Trigger } from '@arco-design/web-react';
|
|
3
|
+
import { IconCheck, IconDown } from '@arco-design/web-react/icon';
|
|
4
|
+
import { NIL } from '@block-kit/utils';
|
|
5
|
+
import { LINE_HEIGHT_KEY } from '../../../../line-height/types/line-height/types/index.js';
|
|
6
|
+
import { LineHeightIcon } from '../../../../shared/icons/shared/icons/line-height.js';
|
|
7
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
8
|
+
|
|
9
|
+
const STEP = [...Array.from({ length: 11 }, (_, i) => i * 0.1 + 1.5), 3].map(v => v.toFixed(1).toString());
|
|
10
|
+
const LineHeight = () => {
|
|
11
|
+
const { keys, refreshMarks, editor } = useToolbarContext();
|
|
12
|
+
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" })] }) }));
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
export { LineHeight };
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { Trigger, Form, Input, Switch, Button } from '@arco-design/web-react';
|
|
3
|
+
import useForm from '@arco-design/web-react/es/Form/useForm';
|
|
4
|
+
import { IconRight, IconLink } from '@arco-design/web-react/icon';
|
|
5
|
+
import { APPLY_SOURCE, EDITOR_EVENT } from '@block-kit/core';
|
|
6
|
+
import { cs, TRULY, NIL } from '@block-kit/utils';
|
|
7
|
+
import { useState, useEffect } from 'react';
|
|
8
|
+
import { LINK_KEY, LINK_BLANK_KEY, LINK_TEMP_KEY } from '../../../../link/types/link/types/index.js';
|
|
9
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
10
|
+
|
|
11
|
+
const Link = props => {
|
|
12
|
+
const [form] = useForm();
|
|
13
|
+
const [visible, setVisible] = useState(false);
|
|
14
|
+
const [collapsed, setCollapsed] = useState(true);
|
|
15
|
+
const { keys, refreshMarks, editor, selection } = useToolbarContext();
|
|
16
|
+
const onConfirm = () => {
|
|
17
|
+
const sel = editor.selection.get();
|
|
18
|
+
if (!sel)
|
|
19
|
+
return void 0;
|
|
20
|
+
const insert = form.getFieldValue("link-insert");
|
|
21
|
+
const href = form.getFieldValue(LINK_KEY);
|
|
22
|
+
const blank = form.getFieldValue(LINK_BLANK_KEY);
|
|
23
|
+
if (!href)
|
|
24
|
+
return void 0;
|
|
25
|
+
const filteredHref = props.filterXSS ? props.filterXSS(href) : href;
|
|
26
|
+
if (sel.isCollapsed) {
|
|
27
|
+
// 折叠选区的情况下则插入文本
|
|
28
|
+
if (!insert)
|
|
29
|
+
return void 0;
|
|
30
|
+
editor.collect.marks = Object.assign(Object.assign({}, editor.collect.marks), { [LINK_KEY]: filteredHref });
|
|
31
|
+
if (blank) {
|
|
32
|
+
editor.collect.marks[LINK_BLANK_KEY] = TRULY;
|
|
33
|
+
}
|
|
34
|
+
editor.perform.insertText(sel, insert);
|
|
35
|
+
}
|
|
36
|
+
else {
|
|
37
|
+
// 非折叠选区则应用链接
|
|
38
|
+
editor.perform.applyMarks(sel, {
|
|
39
|
+
[LINK_KEY]: filteredHref,
|
|
40
|
+
[LINK_BLANK_KEY]: blank ? TRULY : NIL,
|
|
41
|
+
[LINK_TEMP_KEY]: NIL,
|
|
42
|
+
}, { autoCaret: false });
|
|
43
|
+
}
|
|
44
|
+
setVisible(false);
|
|
45
|
+
refreshMarks();
|
|
46
|
+
};
|
|
47
|
+
const onDelete = () => {
|
|
48
|
+
const sel = editor.selection.get();
|
|
49
|
+
if (!sel || sel.isCollapsed) {
|
|
50
|
+
setVisible(false);
|
|
51
|
+
return void 0;
|
|
52
|
+
}
|
|
53
|
+
editor.perform.applyMarks(sel, { [LINK_TEMP_KEY]: NIL, [LINK_BLANK_KEY]: NIL, [LINK_KEY]: NIL }, { autoCaret: false });
|
|
54
|
+
setVisible(false);
|
|
55
|
+
refreshMarks();
|
|
56
|
+
};
|
|
57
|
+
useEffect(() => {
|
|
58
|
+
if (visible) {
|
|
59
|
+
form.resetFields();
|
|
60
|
+
const sel = editor.selection.get();
|
|
61
|
+
const state = sel && sel.isCollapsed;
|
|
62
|
+
setCollapsed(!!state);
|
|
63
|
+
}
|
|
64
|
+
}, [editor.selection, form, visible]);
|
|
65
|
+
const onFocus = () => {
|
|
66
|
+
const sel = editor.selection.get();
|
|
67
|
+
if (sel && !sel.isCollapsed) {
|
|
68
|
+
// 由于焦点转移, 因此需要将临时标记应用到选区
|
|
69
|
+
editor.perform.applyMarks(sel, { [LINK_TEMP_KEY]: TRULY }, { autoCaret: false, source: APPLY_SOURCE.NO_UNDO });
|
|
70
|
+
editor.event.once(EDITOR_EVENT.SELECTION_CHANGE, () => {
|
|
71
|
+
// 这里是需要等待渲染后再执行, 否则会导致选区校正无法获取 LineNode
|
|
72
|
+
Promise.resolve().then(() => {
|
|
73
|
+
editor.perform.applyMarks(sel, { [LINK_TEMP_KEY]: NIL }, { autoCaret: false, source: APPLY_SOURCE.NO_UNDO });
|
|
74
|
+
});
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
const go = () => {
|
|
79
|
+
const href = form.getFieldValue(LINK_KEY);
|
|
80
|
+
if (!href)
|
|
81
|
+
return void 0;
|
|
82
|
+
window.open(href, "_blank");
|
|
83
|
+
};
|
|
84
|
+
return (jsx(Trigger, { popupVisible: visible, onVisibleChange: setVisible, trigger: "click", popupAlign: { bottom: 10 }, getPopupContainer: e => e.parentElement || document.body, popup: () => {
|
|
85
|
+
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" })] })] }));
|
|
86
|
+
}, children: jsx("div", { className: cs("menu-toolbar-item", keys[LINK_KEY] && selection && !selection.isCollapsed && "active"), children: jsx(IconLink, {}) }) }));
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
export { Link };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { IconOrderedList } from '@arco-design/web-react/icon';
|
|
3
|
+
import { cs, TRULY } from '@block-kit/utils';
|
|
4
|
+
import { ORDER_LIST_KEY } from '../../../../order-list/types/order-list/types/index.js';
|
|
5
|
+
import { isOrderList } from '../../../../order-list/utils/order-list/utils/is.js';
|
|
6
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
7
|
+
|
|
8
|
+
const OrderList = () => {
|
|
9
|
+
const { keys, refreshMarks, editor } = useToolbarContext();
|
|
10
|
+
const isOrder = isOrderList(keys);
|
|
11
|
+
return (jsx("div", { className: cs("menu-toolbar-item", isOrder && "active"), onClick: () => {
|
|
12
|
+
editor.command.exec(ORDER_LIST_KEY, { value: TRULY });
|
|
13
|
+
refreshMarks();
|
|
14
|
+
}, children: jsx(IconOrderedList, {}) }));
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
export { OrderList };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { IconQuote } from '@arco-design/web-react/icon';
|
|
3
|
+
import { cs, TRULY } from '@block-kit/utils';
|
|
4
|
+
import { QUOTE_KEY } from '../../../../quote/types/quote/types/index.js';
|
|
5
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
6
|
+
|
|
7
|
+
const Quote = () => {
|
|
8
|
+
const { keys, refreshMarks, editor } = useToolbarContext();
|
|
9
|
+
return (jsx("div", { className: cs("menu-toolbar-item", keys[QUOTE_KEY] && "active"), onClick: () => {
|
|
10
|
+
editor.command.exec(QUOTE_KEY, { value: TRULY });
|
|
11
|
+
refreshMarks();
|
|
12
|
+
}, children: jsx(IconQuote, {}) }));
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
export { Quote };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { IconStrikethrough } from '@arco-design/web-react/icon';
|
|
3
|
+
import { cs, NIL, TRULY } from '@block-kit/utils';
|
|
4
|
+
import { STRIKE_KEY } from '../../../../strike/types/strike/types/index.js';
|
|
5
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
6
|
+
|
|
7
|
+
const Strike = () => {
|
|
8
|
+
const { keys, refreshMarks, editor } = useToolbarContext();
|
|
9
|
+
return (jsx("div", { className: cs("menu-toolbar-item", keys[STRIKE_KEY] && "active"), onClick: () => {
|
|
10
|
+
editor.command.exec(STRIKE_KEY, { value: keys[STRIKE_KEY] ? NIL : TRULY });
|
|
11
|
+
refreshMarks();
|
|
12
|
+
}, children: jsx(IconStrikethrough, {}) }));
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
export { Strike };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { IconUnderline } from '@arco-design/web-react/icon';
|
|
3
|
+
import { cs, NIL, TRULY } from '@block-kit/utils';
|
|
4
|
+
import { UNDERLINE_KEY } from '../../../../underline/types/underline/types/index.js';
|
|
5
|
+
import { useToolbarContext } from '../../../context/toolbar/context/provider.js';
|
|
6
|
+
|
|
7
|
+
const Underline = () => {
|
|
8
|
+
const { keys, refreshMarks, editor } = useToolbarContext();
|
|
9
|
+
return (jsx("div", { className: cs("menu-toolbar-item", keys[UNDERLINE_KEY] && "active"), onClick: () => {
|
|
10
|
+
editor.command.exec(UNDERLINE_KEY, { value: keys[UNDERLINE_KEY] ? NIL : TRULY });
|
|
11
|
+
refreshMarks();
|
|
12
|
+
}, children: jsx(IconUnderline, {}) }));
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
export { Underline };
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { Align } from '../modules/toolbar/modules/align.js';
|
|
2
|
+
import { Bold } from '../modules/toolbar/modules/bold.js';
|
|
3
|
+
import { BulletList } from '../modules/toolbar/modules/bullet-list.js';
|
|
4
|
+
import { Cut } from '../modules/toolbar/modules/cut.js';
|
|
5
|
+
import { Divider } from '../modules/toolbar/modules/divider.js';
|
|
6
|
+
import { Emoji } from '../modules/toolbar/modules/emoji.js';
|
|
7
|
+
import { FontColor } from '../modules/toolbar/modules/font-color.js';
|
|
8
|
+
import { FontSize } from '../modules/toolbar/modules/font-size.js';
|
|
9
|
+
import { Heading } from '../modules/toolbar/modules/heading.js';
|
|
10
|
+
import { History } from '../modules/toolbar/modules/history.js';
|
|
11
|
+
import { Image } from '../modules/toolbar/modules/image.js';
|
|
12
|
+
import { InlineCode } from '../modules/toolbar/modules/inline-code.js';
|
|
13
|
+
import { Italic } from '../modules/toolbar/modules/italic.js';
|
|
14
|
+
import { LineHeight } from '../modules/toolbar/modules/line-height.js';
|
|
15
|
+
import { Link } from '../modules/toolbar/modules/link.js';
|
|
16
|
+
import { OrderList } from '../modules/toolbar/modules/order-list.js';
|
|
17
|
+
import { Quote } from '../modules/toolbar/modules/quote.js';
|
|
18
|
+
import { Strike } from '../modules/toolbar/modules/strike.js';
|
|
19
|
+
import { Underline } from '../modules/toolbar/modules/underline.js';
|
|
20
|
+
export { Toolbar } from '../context/toolbar/context/basic.js';
|
|
21
|
+
export { FloatToolbar } from '../context/toolbar/context/float.js';
|
|
22
|
+
|
|
23
|
+
const Mixin = {
|
|
24
|
+
Cut,
|
|
25
|
+
Bold,
|
|
26
|
+
Link,
|
|
27
|
+
Quote,
|
|
28
|
+
Image,
|
|
29
|
+
Align,
|
|
30
|
+
Emoji,
|
|
31
|
+
Italic,
|
|
32
|
+
Strike,
|
|
33
|
+
History,
|
|
34
|
+
Heading,
|
|
35
|
+
Divider,
|
|
36
|
+
FontSize,
|
|
37
|
+
FontColor,
|
|
38
|
+
OrderList,
|
|
39
|
+
Underline,
|
|
40
|
+
BulletList,
|
|
41
|
+
InlineCode,
|
|
42
|
+
LineHeight,
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
export { Mixin };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { BOLD_KEY } from '../../../../bold/types/bold/types/index.js';
|
|
2
|
+
import { INLINE_CODE } from '../../../../inline-code/types/inline-code/types/index.js';
|
|
3
|
+
|
|
4
|
+
const TOOLBAR_TYPES = [BOLD_KEY, INLINE_CODE];
|
|
5
|
+
const TOOLBAR_KEY_SET = new Set(TOOLBAR_TYPES);
|
|
6
|
+
|
|
7
|
+
export { TOOLBAR_KEY_SET, TOOLBAR_TYPES };
|
|
@@ -1,7 +1,3 @@
|
|
|
1
|
-
const PLUGIN_EVENTS = {
|
|
2
|
-
SHORTCUT_MARKS_CHANGE: "SHORTCUT_MARKS_CHANGE",
|
|
3
|
-
};
|
|
4
|
-
|
|
5
1
|
const filterMarkMap = (ops) => {
|
|
6
2
|
const firstOp = ops[0];
|
|
7
3
|
if (!firstOp || !firstOp.attributes)
|
|
@@ -43,4 +39,4 @@ const filterLineMarkMap = (attrs) => {
|
|
|
43
39
|
return target;
|
|
44
40
|
};
|
|
45
41
|
|
|
46
|
-
export {
|
|
42
|
+
export { filterLineMarkMap, filterMarkMap };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { isMatchHTMLTag, applyMarker } from '@block-kit/core';
|
|
2
2
|
import { EditorPlugin } from '@block-kit/react';
|
|
3
3
|
import { isHTMLElement, TRULY } from '@block-kit/utils';
|
|
4
|
-
import { UNDERLINE_KEY } from '
|
|
4
|
+
import { UNDERLINE_KEY } from '../types/underline/types/index.js';
|
|
5
5
|
|
|
6
6
|
class UnderlinePlugin extends EditorPlugin {
|
|
7
7
|
destroy() { }
|
|
@@ -2,22 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var tslib_es6 = require('../tslib.es6-
|
|
5
|
+
var tslib_es6 = require('../tslib.es6-82029525.js');
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
7
|
var core = require('@block-kit/core');
|
|
8
8
|
var delta = require('@block-kit/delta');
|
|
9
9
|
var react = require('@block-kit/react');
|
|
10
10
|
var utils = require('@block-kit/utils');
|
|
11
11
|
var indent_types_index = require('../indent/types/index.js');
|
|
12
|
-
var
|
|
13
|
-
var
|
|
12
|
+
var shared_utils_dom = require('../shared/utils/dom.js');
|
|
13
|
+
var shared_utils_is = require('../shared/utils/is.js');
|
|
14
14
|
var bulletList_types_index = require('./types/index.js');
|
|
15
|
-
var
|
|
16
|
-
|
|
17
|
-
const BulletListView = props => {
|
|
18
|
-
const { level, children } = props;
|
|
19
|
-
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 }) }));
|
|
20
|
-
};
|
|
15
|
+
var bulletList_utils_is = require('./utils/is.js');
|
|
16
|
+
var bulletList_view_list = require('./view/list.js');
|
|
21
17
|
|
|
22
18
|
class BulletListPlugin extends react.EditorPlugin {
|
|
23
19
|
constructor(editor) {
|
|
@@ -31,13 +27,13 @@ class BulletListPlugin extends react.EditorPlugin {
|
|
|
31
27
|
this.editor.event.off(core.EDITOR_EVENT.KEY_DOWN, this.onKeyDown);
|
|
32
28
|
}
|
|
33
29
|
match(attrs) {
|
|
34
|
-
return
|
|
30
|
+
return bulletList_utils_is.isBulletList(attrs);
|
|
35
31
|
}
|
|
36
32
|
renderLine(context) {
|
|
37
33
|
const level = Number(context.attributes[indent_types_index.INDENT_LEVEL_KEY]) || 0;
|
|
38
34
|
// 这里需要注意, 必须要将 context.children 作为 React 的子元素
|
|
39
35
|
// 否则, 在 React 的渲染过程中, 会出现奇怪的 Crash 问题
|
|
40
|
-
return (jsxRuntime.jsx(BulletListView, { level: level, editor: this.editor, context: context, children: context.children }));
|
|
36
|
+
return (jsxRuntime.jsx(bulletList_view_list.BulletListView, { level: level, editor: this.editor, context: context, children: context.children }));
|
|
41
37
|
}
|
|
42
38
|
onExec(payload) {
|
|
43
39
|
const editor = this.editor;
|
|
@@ -47,7 +43,7 @@ class BulletListPlugin extends react.EditorPlugin {
|
|
|
47
43
|
const { start, end } = sel;
|
|
48
44
|
// 先检查当前需要设置/解除列表状态
|
|
49
45
|
const lines = editor.state.block.getLines().slice(start.line, end.line + 1);
|
|
50
|
-
const isBullet = lines.every(line =>
|
|
46
|
+
const isBullet = lines.every(line => bulletList_utils_is.isBulletList(line.attributes));
|
|
51
47
|
// 计算需要操作的范围
|
|
52
48
|
const rawPoint = core.RawPoint.fromPoint(this.editor, core.Point.from(start.line, 0));
|
|
53
49
|
if (!rawPoint)
|
|
@@ -83,10 +79,10 @@ class BulletListPlugin extends react.EditorPlugin {
|
|
|
83
79
|
const attrs = startLine.attributes;
|
|
84
80
|
// 当前行是列表行, 且按下回车键, 且选区折叠, 且当前行是空行
|
|
85
81
|
// => 处理列表的缩进等级
|
|
86
|
-
if (
|
|
87
|
-
|
|
82
|
+
if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.ENTER) &&
|
|
83
|
+
bulletList_utils_is.isBulletList(attrs) &&
|
|
88
84
|
sel.isCollapsed &&
|
|
89
|
-
|
|
85
|
+
shared_utils_is.isEmptyLine(startLine)) {
|
|
90
86
|
const level = Number(attrs[indent_types_index.INDENT_LEVEL_KEY]);
|
|
91
87
|
const nextAttrs = {};
|
|
92
88
|
if (level > 0) {
|
|
@@ -100,17 +96,17 @@ class BulletListPlugin extends react.EditorPlugin {
|
|
|
100
96
|
}
|
|
101
97
|
const delta$1 = new delta.Delta().retain(startLine.start + startLine.length - 1).retain(1, nextAttrs);
|
|
102
98
|
this.editor.state.apply(delta$1, { autoCaret: false });
|
|
103
|
-
|
|
99
|
+
shared_utils_dom.preventContextEvent(event, context);
|
|
104
100
|
return void 0;
|
|
105
101
|
}
|
|
106
102
|
// 当前行是列表行, 且按下回车键, 且选区折叠, 且位于行首, 且上一行是列表行
|
|
107
103
|
// => 继续列表格式, 避免默认的处理, 保持列表的连续性
|
|
108
|
-
if (
|
|
109
|
-
|
|
104
|
+
if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.ENTER) &&
|
|
105
|
+
bulletList_utils_is.isBulletList(attrs) &&
|
|
110
106
|
sel.isCollapsed &&
|
|
111
107
|
sel.start.offset === 0 &&
|
|
112
108
|
prevLine &&
|
|
113
|
-
|
|
109
|
+
bulletList_utils_is.isBulletList(prevLine.attributes)) {
|
|
114
110
|
const nextAttrs = Object.assign({}, prevLine.attributes);
|
|
115
111
|
if (attrs[indent_types_index.INDENT_LEVEL_KEY]) {
|
|
116
112
|
// 缩进层级优先取当前行的缩进层级
|
|
@@ -118,27 +114,27 @@ class BulletListPlugin extends react.EditorPlugin {
|
|
|
118
114
|
}
|
|
119
115
|
const delta$1 = new delta.Delta().retain(startLine.start).insertEOL(nextAttrs);
|
|
120
116
|
this.editor.state.apply(delta$1);
|
|
121
|
-
|
|
117
|
+
shared_utils_dom.preventContextEvent(event, context);
|
|
122
118
|
return void 0;
|
|
123
119
|
}
|
|
124
120
|
// 当前行是列表行, 且按下回车键
|
|
125
121
|
// => 在列表行内部插入换行符, 且携带列表状态
|
|
126
|
-
if (
|
|
122
|
+
if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.ENTER) && bulletList_utils_is.isBulletList(attrs) && sel.start.offset) {
|
|
127
123
|
this.editor.perform.insertBreak(sel, attrs);
|
|
128
|
-
|
|
124
|
+
shared_utils_dom.preventContextEvent(event, context);
|
|
129
125
|
return void 0;
|
|
130
126
|
}
|
|
131
127
|
// 当前行是列表行, 且折叠选区, 且在行首, 且按下退格键
|
|
132
128
|
// => 将当前行的列表状态移除, 保留缩进的等级
|
|
133
|
-
if (
|
|
129
|
+
if (shared_utils_is.isKeyCode(event, utils.KEY_CODE.BACKSPACE) &&
|
|
134
130
|
sel.isCollapsed &&
|
|
135
|
-
|
|
131
|
+
bulletList_utils_is.isBulletList(attrs) &&
|
|
136
132
|
!sel.start.offset) {
|
|
137
133
|
const delta$1 = new delta.Delta()
|
|
138
134
|
.retain(startLine.start + startLine.length - 1)
|
|
139
135
|
.retain(1, { [bulletList_types_index.LIST_TYPE_KEY]: utils.NIL });
|
|
140
136
|
this.editor.state.apply(delta$1, { autoCaret: false });
|
|
141
|
-
|
|
137
|
+
shared_utils_dom.preventContextEvent(event, context);
|
|
142
138
|
return void 0;
|
|
143
139
|
}
|
|
144
140
|
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var utils = require('@block-kit/utils');
|
|
7
|
+
|
|
8
|
+
const BulletListView = props => {
|
|
9
|
+
const { level, children } = props;
|
|
10
|
+
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 }) }));
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
exports.BulletListView = BulletListView;
|
|
@@ -2,23 +2,23 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var tslib_es6 = require('../tslib.es6-
|
|
5
|
+
var tslib_es6 = require('../tslib.es6-82029525.js');
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
7
|
var core = require('@block-kit/core');
|
|
8
8
|
var delta = require('@block-kit/delta');
|
|
9
9
|
var react = require('@block-kit/react');
|
|
10
10
|
var utils = require('@block-kit/utils');
|
|
11
|
-
var
|
|
12
|
-
var
|
|
11
|
+
var shared_components_selection = require('../shared/components/selection.js');
|
|
12
|
+
var shared_modules_selection = require('../shared/modules/selection.js');
|
|
13
|
+
var shared_utils_is = require('../shared/utils/is.js');
|
|
13
14
|
var divider_types_index = require('./types/index.js');
|
|
14
|
-
require('react');
|
|
15
15
|
|
|
16
16
|
class DividerPlugin extends react.EditorPlugin {
|
|
17
17
|
constructor(editor) {
|
|
18
18
|
super();
|
|
19
19
|
this.editor = editor;
|
|
20
20
|
this.key = divider_types_index.DIVIDER_KEY;
|
|
21
|
-
this.selection = new
|
|
21
|
+
this.selection = new shared_modules_selection.SelectionPlugin(editor);
|
|
22
22
|
editor.command.register(divider_types_index.DIVIDER_KEY, this.onExec);
|
|
23
23
|
}
|
|
24
24
|
destroy() {
|
|
@@ -30,7 +30,7 @@ class DividerPlugin extends react.EditorPlugin {
|
|
|
30
30
|
const line = sel && editor.state.block.getLine(sel.start.line);
|
|
31
31
|
if (!sel || !line)
|
|
32
32
|
return void 0;
|
|
33
|
-
const isEmptyTextLine =
|
|
33
|
+
const isEmptyTextLine = shared_utils_is.isEmptyLine(line);
|
|
34
34
|
let nextLineIndex = line.index + 1;
|
|
35
35
|
const delta$1 = new delta.Delta();
|
|
36
36
|
if (isEmptyTextLine) {
|
|
@@ -54,7 +54,7 @@ class DividerPlugin extends react.EditorPlugin {
|
|
|
54
54
|
return !!attrs[divider_types_index.DIVIDER_KEY];
|
|
55
55
|
}
|
|
56
56
|
renderLeaf(context) {
|
|
57
|
-
return (jsxRuntime.jsx(
|
|
57
|
+
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" }) }) }));
|
|
58
58
|
}
|
|
59
59
|
}
|
|
60
60
|
tslib_es6.__decorate([
|
package/dist/lib/emoji/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var tslib_es6 = require('../tslib.es6-
|
|
5
|
+
var tslib_es6 = require('../tslib.es6-82029525.js');
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
7
|
var core = require('@block-kit/core');
|
|
8
8
|
var delta = require('@block-kit/delta');
|