@@ -53,3 +53,101 @@ pnpm install @halo-dev/ui-shared
5353### 表单定义 > 新增 ` array ` 组件
5454
5555在 2.22.0 中,我们为 FormKit 表单新增了 ` array ` 组件,用于定义一组数据,并计划使用 ` array ` 组件替换原有的 ` repeater ` 组件。详细文档可查阅:[ 表单定义#array] ( ../../developer-guide/form-schema.md#array )
56+
57+ ### 编辑器 > BubbleMenu 扩展点改动
58+
59+ 在 Halo 2.22.0 中,我们升级了编辑器的 Tiptap 版本至 3.x,由于 Tiptap 在 3.x 中做了一些破坏性更新且 Halo 也遵循其更新,因此如果插件扩展了编辑器,并使用了 BubbleMenu 扩展点,则需要根据以下方式进行更新升级。
60+
61+ 1 . 使用 ` options ` 代替 ` tippyOptions ` 。
62+
63+ ``` diff
64+ - tippyOptions: {
65+ - fixed: false,
66+ - },
67+ + options: {
68+ + strategy:"absolute",
69+ + },
70+ ```
71+
72+ 2 . 使用 ` getReferencedVirtualElement ` 代替 ` getRenderContainer ` 。
73+
74+ ``` diff
75+ - getRenderContainer: (node: HTMLElement) => {
76+ - let container = node;
77+ - if (container.nodeName === "#text") {
78+ - container = node.parentElement as HTMLElement;
79+ - }
80+ - while (
81+ - container &&
82+ - container.classList &&
83+ - !container.classList.contains("column")
84+ - ) {
85+ - container = container.parentElement as HTMLElement;
86+ - }
87+ - return container;
88+ - },
89+ + getReferencedVirtualElement() {
90+ + const editor = this.editor;
91+ + if (!editor) {
92+ + return null;
93+ + }
94+ + const parentNode = findParentNode(
95+ + (node) => node.type.name === Column.name
96+ + )(editor.state.selection);
97+ + if (parentNode) {
98+ + const domRect = posToDOMRect(
99+ + editor.view,
100+ + parentNode.pos,
101+ + parentNode.pos + parentNode.node.nodeSize
102+ + );
103+ + return {
104+ + getBoundingClientRect: () => domRect,
105+ + getClientRects: () => [domRect],
106+ + };
107+ + }
108+ + return null;
109+ + },
110+ ```
111+
112+ 3 . 移除 ` defaultAnimation ` 。
113+
114+ ``` diff
115+ - defaultAnimation: false,
116+ ```
117+
118+ 此外,扩展其他 Node 中 ` BubbleMenu ` 的旧方式将会失效,例如 [ 编辑器超链接卡片] ( https://github.com/halo-sigs/plugin-editor-hyperlink-card/blob/main/ui/src/editor/text-bubble-extension.ts ) 扩展了 Text Node 的 ` BubbleMenu ` 。 此版本中引入了 ` extendsKey ` 字段,用于扩展已有的 ` BubbleMenu ` 。** 需要已有的 ` BubbleMenu ` 设置了 PluginKey** 。
119+ 用法如下:
120+
121+ ``` ts
122+ Extension .create ({
123+ name: " expandTextBubbleMenu" ,
124+ addOptions() {
125+ return {
126+ getBubbleMenu() {
127+ return {
128+ // 目标 BubbleMenu 的 PluginKey。当前版本会导出 Halo UI Editor 中的所有 PluginKey。
129+ extendsKey: TEXT_BUBBLE_MENU_KEY ,
130+ items: [
131+ {
132+ priority: 10 ,
133+ // 具有同一个 key 的 items 将会被覆盖
134+ key: " textItem1" ,
135+ props: { title: " ExpandText" },
136+ },
137+ ],
138+ };
139+ },
140+ };
141+ },
142+ }),
143+ ```
144+
145+ 有关 ` BubbleMenu ` 扩展的详细文档可查阅:[ 悬浮菜单扩展] ( ./extension-points/ui/default-editor-extension-create.md#4-悬浮菜单扩展 )
146+
147+ ### 编辑器 > 新增 getDraggableMenuItems 扩展点
148+
149+ 在 Halo 2.22.0 中,我们为编辑器增加了拖拽菜单的功能,同时支持插件动态扩展拖拽菜单。与此同时,旧的 ` getDraggable ` 扩展点被移除,取而代之的是 ` getDraggableMenuItems ` 扩展点。
150+
151+ 可直接移除 ` getDraggable ` 扩展点,不再使用,也无需考虑兼容性问题。
152+
153+ 关于 ` getDraggableMenuItems ` 扩展点的详细文档可查阅:[ 拖拽菜单扩展] ( ./extension-points/ui/default-editor-extension-create.md#5-拖拽菜单扩展 )
0 commit comments