@block-kit/react 1.0.0
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/hooks/use-editor.d.ts +21 -0
- package/dist/es/hooks/use-editor.js +26 -0
- package/dist/es/hooks/use-readonly.d.ts +5 -0
- package/dist/es/hooks/use-readonly.js +6 -0
- package/dist/es/index.d.ts +18 -0
- package/dist/es/index.js +17 -0
- package/dist/es/model/block.d.ts +7 -0
- package/dist/es/model/block.js +142 -0
- package/dist/es/model/eol.d.ts +6 -0
- package/dist/es/model/eol.js +18 -0
- package/dist/es/model/leaf.d.ts +7 -0
- package/dist/es/model/leaf.js +38 -0
- package/dist/es/model/line.d.ts +7 -0
- package/dist/es/model/line.js +152 -0
- package/dist/es/plugin/index.d.ts +25 -0
- package/dist/es/plugin/index.js +3 -0
- package/dist/es/plugin/modules/priority.d.ts +13 -0
- package/dist/es/plugin/modules/priority.js +26 -0
- package/dist/es/plugin/modules/wrap.d.ts +26 -0
- package/dist/es/plugin/modules/wrap.js +72 -0
- package/dist/es/plugin/types/index.d.ts +35 -0
- package/dist/es/plugin/types/index.js +7 -0
- package/dist/es/preset/block-kit.d.ts +6 -0
- package/dist/es/preset/block-kit.js +17 -0
- package/dist/es/preset/editable.d.ts +16 -0
- package/dist/es/preset/editable.js +42 -0
- package/dist/es/preset/embed.d.ts +14 -0
- package/dist/es/preset/embed.js +23 -0
- package/dist/es/preset/isolate.d.ts +12 -0
- package/dist/es/preset/isolate.js +10 -0
- package/dist/es/preset/text.d.ts +9 -0
- package/dist/es/preset/text.js +34 -0
- package/dist/es/preset/void.d.ts +14 -0
- package/dist/es/preset/void.js +23 -0
- package/dist/es/preset/zero.d.ts +23 -0
- package/dist/es/preset/zero.js +20 -0
- package/dist/es/utils/constant.d.ts +2 -0
- package/dist/es/utils/constant.js +6 -0
- package/dist/es/utils/event.d.ts +2 -0
- package/dist/es/utils/event.js +7 -0
- package/dist/es/utils/is.d.ts +2 -0
- package/dist/es/utils/is.js +12 -0
- package/dist/es/utils/weak-map.d.ts +17 -0
- package/dist/es/utils/weak-map.js +15 -0
- package/dist/es/utils/wrapper.d.ts +7 -0
- package/dist/es/utils/wrapper.js +25 -0
- package/dist/lib/hooks/use-editor.d.ts +21 -0
- package/dist/lib/hooks/use-editor.js +53 -0
- package/dist/lib/hooks/use-readonly.d.ts +5 -0
- package/dist/lib/hooks/use-readonly.js +33 -0
- package/dist/lib/index.d.ts +18 -0
- package/dist/lib/index.js +40 -0
- package/dist/lib/model/block.d.ts +7 -0
- package/dist/lib/model/block.js +168 -0
- package/dist/lib/model/eol.d.ts +6 -0
- package/dist/lib/model/eol.js +24 -0
- package/dist/lib/model/leaf.d.ts +7 -0
- package/dist/lib/model/leaf.js +64 -0
- package/dist/lib/model/line.d.ts +7 -0
- package/dist/lib/model/line.js +178 -0
- package/dist/lib/plugin/index.d.ts +25 -0
- package/dist/lib/plugin/index.js +7 -0
- package/dist/lib/plugin/modules/priority.d.ts +13 -0
- package/dist/lib/plugin/modules/priority.js +31 -0
- package/dist/lib/plugin/modules/wrap.d.ts +26 -0
- package/dist/lib/plugin/modules/wrap.js +78 -0
- package/dist/lib/plugin/types/index.d.ts +35 -0
- package/dist/lib/plugin/types/index.js +10 -0
- package/dist/lib/preset/block-kit.d.ts +6 -0
- package/dist/lib/preset/block-kit.js +21 -0
- package/dist/lib/preset/editable.d.ts +16 -0
- package/dist/lib/preset/editable.js +46 -0
- package/dist/lib/preset/embed.d.ts +14 -0
- package/dist/lib/preset/embed.js +30 -0
- package/dist/lib/preset/isolate.d.ts +12 -0
- package/dist/lib/preset/isolate.js +14 -0
- package/dist/lib/preset/text.d.ts +9 -0
- package/dist/lib/preset/text.js +37 -0
- package/dist/lib/preset/void.d.ts +14 -0
- package/dist/lib/preset/void.js +30 -0
- package/dist/lib/preset/zero.d.ts +23 -0
- package/dist/lib/preset/zero.js +23 -0
- package/dist/lib/utils/constant.d.ts +2 -0
- package/dist/lib/utils/constant.js +9 -0
- package/dist/lib/utils/event.d.ts +2 -0
- package/dist/lib/utils/event.js +12 -0
- package/dist/lib/utils/is.d.ts +2 -0
- package/dist/lib/utils/is.js +16 -0
- package/dist/lib/utils/weak-map.d.ts +17 -0
- package/dist/lib/utils/weak-map.js +18 -0
- package/dist/lib/utils/wrapper.d.ts +7 -0
- package/dist/lib/utils/wrapper.js +29 -0
- package/package.json +38 -0
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { LeafContext, LeafState, LineContext, LineState } from "@block-kit/core";
|
|
3
|
+
/**
|
|
4
|
+
* 包装行状态
|
|
5
|
+
*/
|
|
6
|
+
export type ReactWrapLineContext = {
|
|
7
|
+
lineState: LineState;
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* 包装叶子状态
|
|
12
|
+
*/
|
|
13
|
+
export type ReactWrapLeafContext = {
|
|
14
|
+
leafState: LeafState;
|
|
15
|
+
children?: React.ReactNode;
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* 行状态
|
|
19
|
+
*/
|
|
20
|
+
export interface ReactLineContext extends LineContext {
|
|
21
|
+
children?: React.ReactNode;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* 叶子状态
|
|
25
|
+
*/
|
|
26
|
+
export interface ReactLeafContext extends LeafContext {
|
|
27
|
+
children?: React.ReactNode;
|
|
28
|
+
}
|
|
29
|
+
/**
|
|
30
|
+
* 包装类型
|
|
31
|
+
*/
|
|
32
|
+
export declare const WRAP_TYPE: {
|
|
33
|
+
readonly LINE: "wrapLine";
|
|
34
|
+
readonly LEAF: "wrapLeaf";
|
|
35
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { EDITOR_STATE } from "@block-kit/core";
|
|
3
|
+
import { useMemo } from "react";
|
|
4
|
+
import { BlockKitContext } from "../hooks/use-editor";
|
|
5
|
+
import { ReadonlyContext } from "../hooks/use-readonly";
|
|
6
|
+
import { initWrapPlugins } from "../plugin/modules/wrap";
|
|
7
|
+
export const BlockKit = props => {
|
|
8
|
+
const { editor, readonly, children } = props;
|
|
9
|
+
if (editor.state.get(EDITOR_STATE.READONLY) !== readonly) {
|
|
10
|
+
editor.state.set(EDITOR_STATE.READONLY, readonly || false);
|
|
11
|
+
}
|
|
12
|
+
useMemo(() => {
|
|
13
|
+
// 希望在 Editor 初始化后立即执行一次
|
|
14
|
+
initWrapPlugins(editor);
|
|
15
|
+
}, [editor]);
|
|
16
|
+
return (_jsx(BlockKitContext.Provider, { value: editor, children: _jsx(ReadonlyContext.Provider, { value: !!readonly, children: children }) }));
|
|
17
|
+
};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* 编辑节点
|
|
4
|
+
* @param props
|
|
5
|
+
*/
|
|
6
|
+
export declare const Editable: React.FC<{
|
|
7
|
+
/** 节点类名 */
|
|
8
|
+
className?: string;
|
|
9
|
+
/** 自动聚焦 */
|
|
10
|
+
autoFocus?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* 占位节点
|
|
13
|
+
* - 节点会脱离文档流, 需要注意 CSS 布局
|
|
14
|
+
*/
|
|
15
|
+
placeholder?: React.ReactNode;
|
|
16
|
+
}>;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { EDITOR_KEY, Point, Range } from "@block-kit/core";
|
|
3
|
+
import { cs } from "@block-kit/utils";
|
|
4
|
+
import { useEffect, useLayoutEffect, useRef } from "react";
|
|
5
|
+
import { useEditorStatic } from "../hooks/use-editor";
|
|
6
|
+
import { useReadonly } from "../hooks/use-readonly";
|
|
7
|
+
import { BlockModel } from "../model/block";
|
|
8
|
+
/**
|
|
9
|
+
* 编辑节点
|
|
10
|
+
* @param props
|
|
11
|
+
*/
|
|
12
|
+
export const Editable = props => {
|
|
13
|
+
const { className, autoFocus } = props;
|
|
14
|
+
const { editor } = useEditorStatic();
|
|
15
|
+
const { readonly } = useReadonly();
|
|
16
|
+
const ref = useRef(null);
|
|
17
|
+
useLayoutEffect(() => {
|
|
18
|
+
const el = ref.current;
|
|
19
|
+
el && editor.onMount(el);
|
|
20
|
+
return () => {
|
|
21
|
+
editor.destroy();
|
|
22
|
+
};
|
|
23
|
+
}, [editor]);
|
|
24
|
+
useEffect(() => {
|
|
25
|
+
// COMPAT: 这里有个奇怪的表现
|
|
26
|
+
// 当自动聚焦时, 必须要先更新浏览器选区再聚焦
|
|
27
|
+
// 否则会造成立即按下回车时, 光标不会跟随选区移动
|
|
28
|
+
// 无论是 Model 选区还是浏览器选区, 都已经更新但是却不移动
|
|
29
|
+
if (autoFocus) {
|
|
30
|
+
const start = new Point(0, 0);
|
|
31
|
+
editor.selection.set(new Range(start, start), true);
|
|
32
|
+
editor.selection.focus();
|
|
33
|
+
}
|
|
34
|
+
}, [autoFocus, editor.selection]);
|
|
35
|
+
return (_jsx("div", { ref: ref, className: cs(className, "notranslate"), [EDITOR_KEY]: true, contentEditable: !readonly, suppressContentEditableWarning: true, style: {
|
|
36
|
+
outline: "none",
|
|
37
|
+
position: "relative",
|
|
38
|
+
whiteSpace: "pre-wrap",
|
|
39
|
+
wordBreak: "break-word",
|
|
40
|
+
overflowWrap: "break-word",
|
|
41
|
+
}, children: _jsx(BlockModel, { editor: editor, state: editor.state.block, placeholder: props.placeholder }) }));
|
|
42
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { FC, PropsWithChildren } from "react";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import type { ReactLeafContext } from "../plugin/types";
|
|
4
|
+
export type EmbedProps = PropsWithChildren<{
|
|
5
|
+
className?: string;
|
|
6
|
+
style?: React.CSSProperties;
|
|
7
|
+
context: ReactLeafContext;
|
|
8
|
+
}>;
|
|
9
|
+
/**
|
|
10
|
+
* Embed 嵌入节点 HOC
|
|
11
|
+
* - Inline Block HOC
|
|
12
|
+
* @param props
|
|
13
|
+
*/
|
|
14
|
+
export declare const Embed: FC<EmbedProps>;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { VOID_KEY } from "@block-kit/core";
|
|
3
|
+
import { Range } from "@block-kit/core";
|
|
4
|
+
import { Point } from "@block-kit/core";
|
|
5
|
+
import React from "react";
|
|
6
|
+
import { useEditorStatic } from "../hooks/use-editor";
|
|
7
|
+
import { ZeroSpace } from "./zero";
|
|
8
|
+
/**
|
|
9
|
+
* Embed 嵌入节点 HOC
|
|
10
|
+
* - Inline Block HOC
|
|
11
|
+
* @param props
|
|
12
|
+
*/
|
|
13
|
+
export const Embed = props => {
|
|
14
|
+
const { context } = props;
|
|
15
|
+
const { editor } = useEditorStatic();
|
|
16
|
+
const leaf = context.leafState;
|
|
17
|
+
const onMouseDown = () => {
|
|
18
|
+
const point = new Point(leaf.parent.index, leaf.offset + 1);
|
|
19
|
+
const range = new Range(point, point.clone());
|
|
20
|
+
editor.selection.set(range, true);
|
|
21
|
+
};
|
|
22
|
+
return (_jsxs(React.Fragment, { children: [_jsx(ZeroSpace, { embed: true, len: leaf.length > 1 ? leaf.length : void 0 }), _jsx("span", { className: props.className, style: Object.assign({ margin: "0 0.1px" }, props.style), contentEditable: false, [VOID_KEY]: true, onMouseDown: onMouseDown, children: props.children })] }));
|
|
23
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { FC, PropsWithChildren } from "react";
|
|
2
|
+
import React from "react";
|
|
3
|
+
export type IsolateProps = PropsWithChildren<{
|
|
4
|
+
className?: string;
|
|
5
|
+
style?: React.CSSProperties;
|
|
6
|
+
}>;
|
|
7
|
+
/**
|
|
8
|
+
* 独立节点嵌入 HOC
|
|
9
|
+
* - 独立区域 完全隔离所有事件
|
|
10
|
+
* @param props
|
|
11
|
+
*/
|
|
12
|
+
export declare const Isolate: FC<IsolateProps>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { preventReactEvent } from "../utils/event";
|
|
3
|
+
/**
|
|
4
|
+
* 独立节点嵌入 HOC
|
|
5
|
+
* - 独立区域 完全隔离所有事件
|
|
6
|
+
* @param props
|
|
7
|
+
*/
|
|
8
|
+
export const Isolate = props => {
|
|
9
|
+
return (_jsx("span", { className: props.className, style: Object.assign({ userSelect: "none" }, props.style), contentEditable: false, onMouseDown: preventReactEvent, onCopy: preventReactEvent, children: props.children }));
|
|
10
|
+
};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { LEAF_STRING } from "@block-kit/core";
|
|
3
|
+
import { isDOMText, isFunction } from "@block-kit/utils";
|
|
4
|
+
import { forwardRef } from "react";
|
|
5
|
+
/**
|
|
6
|
+
* 文本节点
|
|
7
|
+
* @param props
|
|
8
|
+
*/
|
|
9
|
+
export const Text = forwardRef((props, ref) => {
|
|
10
|
+
const onRef = (dom) => {
|
|
11
|
+
// 处理外部引用的 ref
|
|
12
|
+
if (isFunction(ref)) {
|
|
13
|
+
ref(dom);
|
|
14
|
+
}
|
|
15
|
+
else if (ref) {
|
|
16
|
+
ref.current = dom;
|
|
17
|
+
}
|
|
18
|
+
// COMPAT: 避免 React 非受控与 IME 造成的 DOM 内容问题
|
|
19
|
+
if (!dom || props.children === dom.textContent)
|
|
20
|
+
return void 0;
|
|
21
|
+
const nodes = dom.childNodes;
|
|
22
|
+
// If the text content is inconsistent due to the modification of the input
|
|
23
|
+
// it needs to be corrected
|
|
24
|
+
for (let i = 1; i < nodes.length; ++i) {
|
|
25
|
+
const node = nodes[i];
|
|
26
|
+
node && node.remove();
|
|
27
|
+
}
|
|
28
|
+
// Guaranteed to have only one text child
|
|
29
|
+
if (isDOMText(dom.firstChild)) {
|
|
30
|
+
dom.firstChild.nodeValue = props.children;
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
return (_jsx("span", { ref: onRef, [LEAF_STRING]: true, children: props.children }));
|
|
34
|
+
});
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { FC, PropsWithChildren } from "react";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import type { ReactLeafContext } from "../plugin/types";
|
|
4
|
+
export type VoidProps = PropsWithChildren<{
|
|
5
|
+
className?: string;
|
|
6
|
+
style?: React.CSSProperties;
|
|
7
|
+
context: ReactLeafContext;
|
|
8
|
+
tag?: "span" | "div";
|
|
9
|
+
}>;
|
|
10
|
+
/**
|
|
11
|
+
* 空嵌入节点 HOC
|
|
12
|
+
* @param props
|
|
13
|
+
*/
|
|
14
|
+
export declare const Void: FC<VoidProps>;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { VOID_KEY } from "@block-kit/core";
|
|
3
|
+
import { Range } from "@block-kit/core";
|
|
4
|
+
import { Point } from "@block-kit/core";
|
|
5
|
+
import React from "react";
|
|
6
|
+
import { useEditorStatic } from "../hooks/use-editor";
|
|
7
|
+
import { ZeroSpace } from "./zero";
|
|
8
|
+
/**
|
|
9
|
+
* 空嵌入节点 HOC
|
|
10
|
+
* @param props
|
|
11
|
+
*/
|
|
12
|
+
export const Void = props => {
|
|
13
|
+
const { context, tag: Tag = "span" } = props;
|
|
14
|
+
const { editor } = useEditorStatic();
|
|
15
|
+
const leaf = context.leafState;
|
|
16
|
+
const onMouseDown = () => {
|
|
17
|
+
// FIX: 修复选区偏移量, leaf 的长度可能 > 1, 而 DOM 节点的长度仅为 1
|
|
18
|
+
const point = new Point(leaf.parent.index, leaf.offset + 1);
|
|
19
|
+
const range = new Range(point, point.clone());
|
|
20
|
+
editor.selection.set(range, true);
|
|
21
|
+
};
|
|
22
|
+
return (_jsxs(React.Fragment, { children: [_jsx(ZeroSpace, { void: true, hide: true, len: leaf.length > 1 ? leaf.length : void 0 }), _jsx(Tag, { className: props.className, style: Object.assign({ userSelect: "none" }, props.style), contentEditable: false, [VOID_KEY]: true, onMouseDown: onMouseDown, children: props.children })] }));
|
|
23
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export type ZeroSpaceProps = {
|
|
3
|
+
/** 隐藏光标 */
|
|
4
|
+
hide?: boolean;
|
|
5
|
+
/** void-block 空节点 */
|
|
6
|
+
void?: boolean;
|
|
7
|
+
/** embed(inline-block) 嵌入节点 */
|
|
8
|
+
embed?: boolean;
|
|
9
|
+
/** 行末尾占位 */
|
|
10
|
+
enter?: boolean;
|
|
11
|
+
/** 空节点占位长度 */
|
|
12
|
+
len?: number;
|
|
13
|
+
};
|
|
14
|
+
/**
|
|
15
|
+
* 零宽字符组件
|
|
16
|
+
* - void hide => 独占一行的空节点, 例如 Image
|
|
17
|
+
* - embed => 嵌入节点, 例如 Mention
|
|
18
|
+
* - enter => 行末尾占位, 保留于 EOLView
|
|
19
|
+
* - len => 空节点占位长度, 配合 Void/Embed
|
|
20
|
+
* @param props
|
|
21
|
+
* @param ref
|
|
22
|
+
*/
|
|
23
|
+
export declare const ZeroSpace: import("react").ForwardRefExoticComponent<ZeroSpaceProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { VOID_LEN_KEY, ZERO_EMBED_KEY, ZERO_ENTER_KEY, ZERO_SPACE_KEY, ZERO_SYMBOL, ZERO_VOID_KEY, } from "@block-kit/core";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { NO_CURSOR } from "../utils/constant";
|
|
5
|
+
/**
|
|
6
|
+
* 零宽字符组件
|
|
7
|
+
* - void hide => 独占一行的空节点, 例如 Image
|
|
8
|
+
* - embed => 嵌入节点, 例如 Mention
|
|
9
|
+
* - enter => 行末尾占位, 保留于 EOLView
|
|
10
|
+
* - len => 空节点占位长度, 配合 Void/Embed
|
|
11
|
+
* @param props
|
|
12
|
+
* @param ref
|
|
13
|
+
*/
|
|
14
|
+
export const ZeroSpace = forwardRef((props, ref) => {
|
|
15
|
+
return (_jsx("span", { ref: ref, [ZERO_SPACE_KEY]: true,
|
|
16
|
+
[ZERO_VOID_KEY]: props.void,
|
|
17
|
+
[ZERO_ENTER_KEY]: props.enter,
|
|
18
|
+
[ZERO_EMBED_KEY]: props.embed,
|
|
19
|
+
[VOID_LEN_KEY]: props.len, style: props.hide ? NO_CURSOR : void 0, children: ZERO_SYMBOL }));
|
|
20
|
+
});
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export const isStrictEmptyLine = (line) => {
|
|
2
|
+
const leaves = line.getLeaves();
|
|
3
|
+
if (!leaves.length) {
|
|
4
|
+
return true;
|
|
5
|
+
}
|
|
6
|
+
if (leaves.length === 1 &&
|
|
7
|
+
leaves[0].eol &&
|
|
8
|
+
(!leaves[0].op.attributes || !Object.keys(leaves[0].op.attributes).length)) {
|
|
9
|
+
return true;
|
|
10
|
+
}
|
|
11
|
+
return false;
|
|
12
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { LeafState, LineState } from "@block-kit/core";
|
|
3
|
+
/**
|
|
4
|
+
* LeafState 与 Text 节点的映射
|
|
5
|
+
* - 仅处理文本节点, 零宽字符节点暂不处理
|
|
6
|
+
*/
|
|
7
|
+
export declare const LEAF_TO_TEXT: WeakMap<LeafState, HTMLElement | null>;
|
|
8
|
+
/**
|
|
9
|
+
* JSX.Element 与 State 的映射
|
|
10
|
+
* - 渲染时即刻加入映射, wrap 时即刻消费映射
|
|
11
|
+
*/
|
|
12
|
+
export declare const JSX_TO_STATE: WeakMap<JSX.Element, LineState | LeafState>;
|
|
13
|
+
/**
|
|
14
|
+
* State 与 Wrapper Symbol 的映射
|
|
15
|
+
* - 主要是取得已经处理过的节点, 避免重复处理
|
|
16
|
+
*/
|
|
17
|
+
export declare const STATE_TO_SYMBOL: WeakMap<LineState | LeafState, string>;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* LeafState 与 Text 节点的映射
|
|
3
|
+
* - 仅处理文本节点, 零宽字符节点暂不处理
|
|
4
|
+
*/
|
|
5
|
+
export const LEAF_TO_TEXT = new WeakMap();
|
|
6
|
+
/**
|
|
7
|
+
* JSX.Element 与 State 的映射
|
|
8
|
+
* - 渲染时即刻加入映射, wrap 时即刻消费映射
|
|
9
|
+
*/
|
|
10
|
+
export const JSX_TO_STATE = new WeakMap();
|
|
11
|
+
/**
|
|
12
|
+
* State 与 Wrapper Symbol 的映射
|
|
13
|
+
* - 主要是取得已经处理过的节点, 避免重复处理
|
|
14
|
+
*/
|
|
15
|
+
export const STATE_TO_SYMBOL = new WeakMap();
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { JSX_TO_STATE, STATE_TO_SYMBOL } from "./weak-map";
|
|
2
|
+
/**
|
|
3
|
+
* 根据属性获取唯一标识值
|
|
4
|
+
* @param keys
|
|
5
|
+
* @param element
|
|
6
|
+
*/
|
|
7
|
+
export const getWrapSymbol = (keys, el) => {
|
|
8
|
+
if (!el)
|
|
9
|
+
return null;
|
|
10
|
+
const state = JSX_TO_STATE.get(el);
|
|
11
|
+
const cache = state && STATE_TO_SYMBOL.get(state);
|
|
12
|
+
if (cache || !state)
|
|
13
|
+
return cache || null;
|
|
14
|
+
const attrs = state.op.attributes;
|
|
15
|
+
if (!attrs || !Object.keys(attrs).length || !keys.length) {
|
|
16
|
+
return null;
|
|
17
|
+
}
|
|
18
|
+
const suite = [];
|
|
19
|
+
for (const key of keys) {
|
|
20
|
+
attrs[key] && suite.push(`${key}${attrs[key]}`);
|
|
21
|
+
}
|
|
22
|
+
const symbol = suite.join("");
|
|
23
|
+
STATE_TO_SYMBOL.set(state, symbol);
|
|
24
|
+
return symbol;
|
|
25
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { Editor } from "@block-kit/core";
|
|
2
|
+
import React from "react";
|
|
3
|
+
export declare const BlockKitContext: React.Context<Editor | null>;
|
|
4
|
+
export declare const useEditorStatic: () => {
|
|
5
|
+
editor: Editor;
|
|
6
|
+
ref: import("@block-kit/core").Ref;
|
|
7
|
+
rect: import("@block-kit/core/dist/es/rect").Rect;
|
|
8
|
+
state: import("@block-kit/core").EditorState;
|
|
9
|
+
event: import("@block-kit/core").Event;
|
|
10
|
+
input: import("@block-kit/core").Input;
|
|
11
|
+
model: import("@block-kit/core").Model;
|
|
12
|
+
plugin: import("@block-kit/core").Plugin;
|
|
13
|
+
schema: import("@block-kit/core").Schema;
|
|
14
|
+
logger: import("@block-kit/core").Logger;
|
|
15
|
+
collect: import("@block-kit/core").Collect;
|
|
16
|
+
command: import("@block-kit/core").Command;
|
|
17
|
+
history: import("@block-kit/core").History;
|
|
18
|
+
perform: import("@block-kit/core").Perform;
|
|
19
|
+
clipboard: import("@block-kit/core").Clipboard;
|
|
20
|
+
selection: import("@block-kit/core").Selection;
|
|
21
|
+
};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
exports.useEditorStatic = exports.BlockKitContext = void 0;
|
|
27
|
+
const react_1 = __importStar(require("react"));
|
|
28
|
+
exports.BlockKitContext = (0, react_1.createContext)(null);
|
|
29
|
+
const useEditorStatic = () => {
|
|
30
|
+
const editor = react_1.default.useContext(exports.BlockKitContext);
|
|
31
|
+
if (!editor) {
|
|
32
|
+
throw new Error("UseEditor must be used within a EditorContext");
|
|
33
|
+
}
|
|
34
|
+
return {
|
|
35
|
+
editor,
|
|
36
|
+
ref: editor.ref,
|
|
37
|
+
rect: editor.rect,
|
|
38
|
+
state: editor.state,
|
|
39
|
+
event: editor.event,
|
|
40
|
+
input: editor.input,
|
|
41
|
+
model: editor.model,
|
|
42
|
+
plugin: editor.plugin,
|
|
43
|
+
schema: editor.schema,
|
|
44
|
+
logger: editor.logger,
|
|
45
|
+
collect: editor.collect,
|
|
46
|
+
command: editor.command,
|
|
47
|
+
history: editor.history,
|
|
48
|
+
perform: editor.perform,
|
|
49
|
+
clipboard: editor.clipboard,
|
|
50
|
+
selection: editor.selection,
|
|
51
|
+
};
|
|
52
|
+
};
|
|
53
|
+
exports.useEditorStatic = useEditorStatic;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
exports.useReadonly = exports.ReadonlyContext = void 0;
|
|
27
|
+
const react_1 = __importStar(require("react"));
|
|
28
|
+
exports.ReadonlyContext = (0, react_1.createContext)(false);
|
|
29
|
+
const useReadonly = () => {
|
|
30
|
+
const readonly = react_1.default.useContext(exports.ReadonlyContext);
|
|
31
|
+
return { readonly };
|
|
32
|
+
};
|
|
33
|
+
exports.useReadonly = useReadonly;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export { BlockKitContext, useEditorStatic } from "./hooks/use-editor";
|
|
2
|
+
export { ReadonlyContext, useReadonly } from "./hooks/use-readonly";
|
|
3
|
+
export { BlockModel } from "./model/block";
|
|
4
|
+
export { EOLModel } from "./model/eol";
|
|
5
|
+
export { LeafModel } from "./model/leaf";
|
|
6
|
+
export { LineModel } from "./model/line";
|
|
7
|
+
export { EditorPlugin } from "./plugin/index";
|
|
8
|
+
export { Priority } from "./plugin/modules/priority";
|
|
9
|
+
export { InjectWrapKeys } from "./plugin/modules/wrap";
|
|
10
|
+
export type { ReactLeafContext, ReactLineContext, ReactWrapLeafContext, ReactWrapLineContext, } from "./plugin/types";
|
|
11
|
+
export { BlockKit } from "./preset/block-kit";
|
|
12
|
+
export { Editable } from "./preset/editable";
|
|
13
|
+
export { Embed } from "./preset/embed";
|
|
14
|
+
export { Isolate } from "./preset/isolate";
|
|
15
|
+
export { Text } from "./preset/text";
|
|
16
|
+
export { Void } from "./preset/void";
|
|
17
|
+
export { ZeroSpace } from "./preset/zero";
|
|
18
|
+
export { preventNativeEvent, preventReactEvent } from "./utils/event";
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.preventReactEvent = exports.preventNativeEvent = exports.ZeroSpace = exports.Void = exports.Text = exports.Isolate = exports.Embed = exports.Editable = exports.BlockKit = exports.InjectWrapKeys = exports.Priority = exports.EditorPlugin = exports.LineModel = exports.LeafModel = exports.EOLModel = exports.BlockModel = exports.useReadonly = exports.ReadonlyContext = exports.useEditorStatic = exports.BlockKitContext = void 0;
|
|
4
|
+
var use_editor_1 = require("./hooks/use-editor");
|
|
5
|
+
Object.defineProperty(exports, "BlockKitContext", { enumerable: true, get: function () { return use_editor_1.BlockKitContext; } });
|
|
6
|
+
Object.defineProperty(exports, "useEditorStatic", { enumerable: true, get: function () { return use_editor_1.useEditorStatic; } });
|
|
7
|
+
var use_readonly_1 = require("./hooks/use-readonly");
|
|
8
|
+
Object.defineProperty(exports, "ReadonlyContext", { enumerable: true, get: function () { return use_readonly_1.ReadonlyContext; } });
|
|
9
|
+
Object.defineProperty(exports, "useReadonly", { enumerable: true, get: function () { return use_readonly_1.useReadonly; } });
|
|
10
|
+
var block_1 = require("./model/block");
|
|
11
|
+
Object.defineProperty(exports, "BlockModel", { enumerable: true, get: function () { return block_1.BlockModel; } });
|
|
12
|
+
var eol_1 = require("./model/eol");
|
|
13
|
+
Object.defineProperty(exports, "EOLModel", { enumerable: true, get: function () { return eol_1.EOLModel; } });
|
|
14
|
+
var leaf_1 = require("./model/leaf");
|
|
15
|
+
Object.defineProperty(exports, "LeafModel", { enumerable: true, get: function () { return leaf_1.LeafModel; } });
|
|
16
|
+
var line_1 = require("./model/line");
|
|
17
|
+
Object.defineProperty(exports, "LineModel", { enumerable: true, get: function () { return line_1.LineModel; } });
|
|
18
|
+
var index_1 = require("./plugin/index");
|
|
19
|
+
Object.defineProperty(exports, "EditorPlugin", { enumerable: true, get: function () { return index_1.EditorPlugin; } });
|
|
20
|
+
var priority_1 = require("./plugin/modules/priority");
|
|
21
|
+
Object.defineProperty(exports, "Priority", { enumerable: true, get: function () { return priority_1.Priority; } });
|
|
22
|
+
var wrap_1 = require("./plugin/modules/wrap");
|
|
23
|
+
Object.defineProperty(exports, "InjectWrapKeys", { enumerable: true, get: function () { return wrap_1.InjectWrapKeys; } });
|
|
24
|
+
var block_kit_1 = require("./preset/block-kit");
|
|
25
|
+
Object.defineProperty(exports, "BlockKit", { enumerable: true, get: function () { return block_kit_1.BlockKit; } });
|
|
26
|
+
var editable_1 = require("./preset/editable");
|
|
27
|
+
Object.defineProperty(exports, "Editable", { enumerable: true, get: function () { return editable_1.Editable; } });
|
|
28
|
+
var embed_1 = require("./preset/embed");
|
|
29
|
+
Object.defineProperty(exports, "Embed", { enumerable: true, get: function () { return embed_1.Embed; } });
|
|
30
|
+
var isolate_1 = require("./preset/isolate");
|
|
31
|
+
Object.defineProperty(exports, "Isolate", { enumerable: true, get: function () { return isolate_1.Isolate; } });
|
|
32
|
+
var text_1 = require("./preset/text");
|
|
33
|
+
Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return text_1.Text; } });
|
|
34
|
+
var void_1 = require("./preset/void");
|
|
35
|
+
Object.defineProperty(exports, "Void", { enumerable: true, get: function () { return void_1.Void; } });
|
|
36
|
+
var zero_1 = require("./preset/zero");
|
|
37
|
+
Object.defineProperty(exports, "ZeroSpace", { enumerable: true, get: function () { return zero_1.ZeroSpace; } });
|
|
38
|
+
var event_1 = require("./utils/event");
|
|
39
|
+
Object.defineProperty(exports, "preventNativeEvent", { enumerable: true, get: function () { return event_1.preventNativeEvent; } });
|
|
40
|
+
Object.defineProperty(exports, "preventReactEvent", { enumerable: true, get: function () { return event_1.preventReactEvent; } });
|