更新日志

最新组件更新与公告。

由于 Plate UI 并非组件库,更新日志在此维护。

使用 CLI 安装最新版本的组件。

2025年6月 #23

6月9日 #23.1

Plate 49

合并文件,使用更一致的命名约定,并删除未使用的 export 语句。

组件:

  • 由于基本节点现在有默认的 HTML 元素,你可以删除 withProps(..., { as: '...' }) 插件组件。
  • 为了提高解耦性,不再仅为了获取键而导入插件。从 @udecode/plate 导入 KEYS 作为统一的键源。
    • ParagraphPlugin.key -> KEYS.p
    • INDENT_LIST_KEYS.listStyleType -> KEYS.listType
    • ListStyleType.Decimal -> KEYS.ol
    • ListStyleType.Disc -> KEYS.ul
    • list (经典) -> KEYS.listClassic
    • ol (经典) -> KEYS.olClassic
    • ul (经典) -> KEYS.ulClassic
    • li (经典) -> KEYS.liClassic
    • action_item (经典) -> KEYS.listTodoClassic
  • 将所有 *-element*-leaf 文件重命名为 *-node(以及静态版本)
  • 删除 ai-anchor-element,合并到 ai-node
  • 删除 ai-loading-bar,合并到 ai-menu
  • 删除 ai-menu-items,合并到 ai-menu
  • align-dropdown-menu 重命名为 align-toolbar-buttonAlignDropdownMenu 重命名为 AlignToolbarButton
  • api-ai 重命名为 ai-api
  • api-uploadthing 重命名为 media-uploadthing-api
  • BlockSelection:修复表格的块选择
  • 删除 code-block-combobox,合并到 code-block-node
  • 删除 code-line-element,合并到 code-block-node(以及静态版本)
  • 删除 code-syntax-leaf,合并到 code-block-node(以及静态版本)
  • color-toolbar-button 重命名为 font-color-toolbar-buttonColorDropdownMenu 重命名为 FontColorToolbarButton
  • 删除所有 color-* 文件,合并到 font-color-toolbar-button
    • color-dropdown-menu 重命名为 font-color-toolbar-button
  • 删除 column-group-element,合并到 column-node(以及静态版本)
  • 删除 comment-create-form,合并到 comment
  • draggable 重命名为 block-draggableDraggableAboveNodes 重命名为 BlockDraggable
  • emoji-input-element 重命名为 emoji-node
  • 删除所有 emoji-* 文件(除了 emoji-input-node),合并到 emoji-toolbar-button
    • EmojiToolbarDropdown 重命名为 EmojiPopoverEmojiDropdownMenu 重命名为 EmojiToolbarButton
    • EmojiPickericons 属性现在是可选的,默认为 emojiCategoryIconsemojiSearchIcons
  • image-preview 重命名为 media-preview-dialogImagePreview 重命名为 MediaPreviewDialog
  • image-element 重命名为 media-image-node
    • MediaFileElement 重命名为 FileElement(以及静态版本)
    • MediaAudioElement 重命名为 AudioElement(以及静态版本)
    • MediaVideoElement 重命名为 VideoElement(以及静态版本)
  • indent-list-toolbar-button 重命名为 list-toolbar-button
    • BulletedIndentListToolbarButton 重命名为 BulletedListToolbarButton
    • NumberedIndentListToolbarButton 重命名为 NumberedListToolbarButton
  • indent-todo-marker 重命名为 block-list
  • 删除 indent-fire-marker
  • 删除 indent-todo-toolbar-button,合并到 list-toolbar-button
  • IndentTodoToolbarButton 重命名为 TodoListToolbarButton
  • 删除 inline-equation-elementequation-popover,合并到 equation-node(以及静态版本)
  • 删除 inline-equation-toolbar-button,合并到 equation-toolbar-button
  • insert-dropdown-menu 重命名为 insert-toolbar-buttonInsertDropdownMenu 重命名为 InsertToolbarButton
  • line-height-dropdown-menu 重命名为 line-height-toolbar-buttonLineHeightDropdownMenu 重命名为 LineHeightToolbarButton
  • link-floating-toolbar 重命名为 link-toolbar
  • 删除 list-indent-toolbar-button,合并到 list-classic-toolbar-button
  • ListIndentToolbarButton 重命名为 IndentToolbarButton
  • list-node 重命名为 list-classic-node
  • media-popover 重命名为 media-toolbarMediaPopover 重命名为 MediaToolbar
  • mode-dropdown-menu 重命名为 mode-toolbar-buttonModeDropdownMenu 重命名为 ModeToolbarButton
  • more-dropdown-menu 重命名为 more-toolbar-buttonMoreDropdownMenu 重命名为 MoreToolbarButton
  • 删除 outdent-toolbar-button,合并到 indent-toolbar-button
  • table-icons:将 Border* 重命名为 Border*Icon
  • slash-input-element 重命名为 slash-input-node
  • SuggestionBelowNodes 重命名为 SuggestionLineBreak
  • 删除 table-cell-element,合并到 table-node(以及静态版本)
  • 删除 table-row-element,合并到 table-node(以及静态版本)
  • table-dropdown-menu 重命名为 table-toolbar-buttonTableDropdownMenu 重命名为 TableToolbarButton
  • 删除 todo-list-node,合并到 list-classic-node
  • turn-into-dropdown-menu 重命名为 turn-into-toolbar-buttonTurnIntoDropdownMenu 重命名为 TurnIntoToolbarButton
  • export-toolbar-buttonindent-list-plugins:从 listStyleTypes 中移除 fire
  • useCommentEditor:使用 usePlateEditor 替代 useCreateEditor
  • 删除 placeholderwithPlaceholder。迁移:使用 block-placeholder-kitBlockPlaceholderPlugin 替代。
  • line-height-toolbar-button:删除 useLineHeightDropdownMenu 钩子。
  • font-color-toolbar-button:删除 useColorInput 钩子。

插件:

  • 将所有 *-plugin*-plugins 文件重命名为 -kit,将 *Plugin*Plugins 重命名为 *Kit插件套件是已配置插件的集合。

    • editor-plugins 重命名为 editor-kit
    • equation-plugins 重命名为 math-kitequationPlugins 重命名为 MathKit
    • indent-list-plugins 重命名为 list-kitindentListPlugins 重命名为 ListKit
    • block-list 中添加 BlockList 组件,在 list-kit 中使用
    • 删除 use-create-editor,使用 usePlateEditor 替代
  • ai-kit:添加 show 快捷键。从 ai-menu 中删除 useHotkeys('mod+j')

  • comment-kit:添加 setDraft 转换,快捷键

  • basic-marks-kitbasic-blocks-kit:添加快捷键

  • transformsblock-draggable:删除 STRUCTURE_TYPES,这些现在从 plugin.node.isContainer 推断。改用 editor.meta.containerTypes

  • useSelectionFragmentProp 用法中删除 structuralTypes

2025年5月 #22

5月26日 #22.7

  • list (classic) -> KEYS.listClassic
  • ol (classic) -> KEYS.olClassic
  • ul (classic) -> KEYS.ulClassic
  • li (classic) -> KEYS.liClassic
  • action_item (classic) -> KEYS.listTodoClassic
  • 将所有 *-element*-leaf 文件重命名为 *-node(以及静态版本)
  • 删除 ai-anchor-element,合并到 ai-node
  • 删除 ai-loading-bar,合并到 ai-menu
  • 删除 ai-menu-items,合并到 ai-menu
  • align-dropdown-menu 重命名为 align-toolbar-buttonAlignDropdownMenu 重命名为 AlignToolbarButton
  • api-ai 重命名为 ai-api
  • api-uploadthing 重命名为 media-uploadthing-api
  • BlockSelection:修复表格的块选择
  • 删除 code-block-combobox,合并到 code-block-node
  • 删除 code-line-element,合并到 code-block-node(以及静态版本)
  • 删除 code-syntax-leaf,合并到 code-block-node(以及静态版本)
  • color-toolbar-button 重命名为 font-color-toolbar-buttonColorDropdownMenu 重命名为 FontColorToolbarButton
  • 删除所有 color-* 文件,合并到 font-color-toolbar-button
    • color-dropdown-menu 重命名为 font-color-toolbar-button
  • 删除 column-group-element,合并到 column-node(以及静态版本)
  • 删除 comment-create-form,合并到 comment
  • draggable 重命名为 block-draggableDraggableAboveNodes 重命名为 BlockDraggable
  • emoji-input-element 重命名为 emoji-node
  • 删除所有 emoji-* 文件(除了 emoji-input-node),合并到 emoji-toolbar-button
    • EmojiToolbarDropdown 重命名为 EmojiPopoverEmojiDropdownMenu 重命名为 EmojiToolbarButton
    • EmojiPickericons 属性现在是可选的,默认为 emojiCategoryIconsemojiSearchIcons
  • image-preview 重命名为 media-preview-dialogImagePreview 重命名为 MediaPreviewDialog
  • image-element 重命名为 media-image-node
    • MediaFileElement 重命名为 FileElement(以及静态版本)
    • MediaAudioElement 重命名为 AudioElement(以及静态版本)
    • MediaVideoElement 重命名为 VideoElement(以及静态版本)
  • indent-list-toolbar-button 重命名为 list-toolbar-button
    • BulletedIndentListToolbarButton 重命名为 BulletedListToolbarButton
    • NumberedIndentListToolbarButton 重命名为 NumberedListToolbarButton
  • indent-todo-marker 重命名为 block-list
  • 删除 indent-fire-marker
  • 删除 indent-todo-toolbar-button,合并到 list-toolbar-button
  • IndentTodoToolbarButton 重命名为 TodoListToolbarButton
  • 删除 inline-equation-elementequation-popover,合并到 equation-node(以及静态版本)
  • 删除 inline-equation-toolbar-button,合并到 equation-toolbar-button
  • insert-dropdown-menu 重命名为 insert-toolbar-buttonInsertDropdownMenu 重命名为 InsertToolbarButton
  • line-height-dropdown-menu 重命名为 line-height-toolbar-buttonLineHeightDropdownMenu 重命名为 LineHeightToolbarButton
  • link-floating-toolbar 重命名为 link-toolbar
  • 删除 list-indent-toolbar-button,合并到 list-classic-toolbar-button
  • ListIndentToolbarButton 重命名为 IndentToolbarButton
  • list-node 重命名为 list-classic-node
  • media-popover 重命名为 media-toolbarMediaPopover 重命名为 MediaToolbar
  • mode-dropdown-menu 重命名为 mode-toolbar-buttonModeDropdownMenu 重命名为 ModeToolbarButton
  • more-dropdown-menu 重命名为 more-toolbar-buttonMoreDropdownMenu 重命名为 MoreToolbarButton
  • 删除 outdent-toolbar-button,合并到 indent-toolbar-button
  • table-icons:将 Border* 重命名为 Border*Icon
  • slash-input-element 重命名为 slash-input-node
  • SuggestionBelowNodes 重命名为 SuggestionLineBreak
  • 删除 table-cell-element,合并到 table-node(以及静态版本)
  • 删除 table-row-element,合并到 table-node(以及静态版本)
  • table-dropdown-menu 重命名为 table-toolbar-buttonTableDropdownMenu 重命名为 TableToolbarButton
  • 删除 todo-list-node,合并到 list-classic-node
  • turn-into-dropdown-menu 重命名为 turn-into-toolbar-buttonTurnIntoDropdownMenu 重命名为 TurnIntoToolbarButton
  • export-toolbar-buttonindent-list-plugins:从 listStyleTypes 中移除 fire
  • useCommentEditor:使用 usePlateEditor 替代 useCreateEditor
  • 删除 placeholderwithPlaceholder。迁移:使用 block-placeholder-kitBlockPlaceholderPlugin 替代。
  • line-height-toolbar-button:删除 useLineHeightDropdownMenu 钩子。
  • font-color-toolbar-button:删除 useColorInput 钩子。

插件:

  • 将所有 *-plugin*-plugins 文件重命名为 -kit,将 *Plugin*Plugins 重命名为 *Kit插件套件是已配置插件的集合。

    • editor-plugins 重命名为 editor-kit
    • equation-plugins 重命名为 math-kitequationPlugins 重命名为 MathKit
    • indent-list-plugins 重命名为 list-kitindentListPlugins 重命名为 ListKit
    • block-list 中添加 BlockList 组件,在 list-kit 中使用
    • 删除 use-create-editor,使用 usePlateEditor 替代
  • ai-kit:添加 show 快捷键。从 ai-menu 中删除 useHotkeys('mod+j')

  • comment-kit:添加 setDraft 转换,快捷键

  • basic-marks-kitbasic-blocks-kit:添加快捷键

  • transformsblock-draggable:删除 STRUCTURE_TYPES,这些现在从 plugin.node.isContainer 推断。改用 editor.meta.containerTypes

  • useSelectionFragmentProp 用法中删除 structuralTypes

2025年5月 #22

5月26日 #22.7

5月15日 #22.6

5月11-12日 #22.5

  • 模板迁移到 Plate 48

  • 迁移到 shadcn v4:

    • Plate 有一个分叉版本的 shadcn/ui 原语,可能会与您现有的组件冲突。我们的组件现在完全依赖于原始的 shadcn/ui 原语,使 Plate 更容易集成到您现有的 shadcn/ui 组件集中。
  • 将所有 *-element*-leaf 文件重命名为 *-node(以及静态版本)

  • 删除 ai-anchor-element,合并到 ai-node

  • 删除 ai-loading-bar,合并到 ai-menu

  • 删除 ai-menu-items,合并到 ai-menu

  • align-dropdown-menu 重命名为 align-toolbar-buttonAlignDropdownMenu 重命名为 AlignToolbarButton

  • api-ai 重命名为 ai-api

  • api-uploadthing 重命名为 media-uploadthing-api

  • BlockSelection:修复表格的块选择

  • 删除 code-block-combobox,合并到 code-block-node

  • 删除 code-line-element,合并到 code-block-node(以及静态版本)

  • 删除 code-syntax-leaf,合并到 code-block-node(以及静态版本)

  • color-toolbar-button 重命名为 font-color-toolbar-buttonColorDropdownMenu 重命名为 FontColorToolbarButton

  • 删除所有 color-* 文件,合并到 font-color-toolbar-button

    • color-dropdown-menu 重命名为 font-color-toolbar-button
  • 删除 column-group-element,合并到 column-node(以及静态版本)

  • 删除 comment-create-form,合并到 comment

  • draggable 重命名为 block-draggableDraggableAboveNodes 重命名为 BlockDraggable

  • emoji-input-element 重命名为 emoji-node

  • 删除所有 emoji-* 文件(除了 emoji-input-node),合并到 emoji-toolbar-button

    • EmojiToolbarDropdown 重命名为 EmojiPopoverEmojiDropdownMenu 重命名为 EmojiToolbarButton
    • EmojiPickericons 属性现在是可选的,默认为 emojiCategoryIconsemojiSearchIcons
  • image-preview 重命名为 media-preview-dialogImagePreview 重命名为 MediaPreviewDialog

  • image-element 重命名为 media-image-node

    • MediaFileElement 重命名为 FileElement(以及静态版本)
    • MediaAudioElement 重命名为 AudioElement(以及静态版本)
    • MediaVideoElement 重命名为 VideoElement(以及静态版本)
  • indent-list-toolbar-button 重命名为 list-toolbar-button

    • BulletedIndentListToolbarButton 重命名为 BulletedListToolbarButton
    • NumberedIndentListToolbarButton 重命名为 NumberedListToolbarButton
  • indent-todo-marker 重命名为 block-list

  • 删除 indent-fire-marker

  • 删除 indent-todo-toolbar-button,合并到 list-toolbar-button

  • IndentTodoToolbarButton 重命名为 TodoListToolbarButton

  • 删除 inline-equation-elementequation-popover,合并到 equation-node(以及静态版本)

  • 删除 inline-equation-toolbar-button,合并到 equation-toolbar-button

  • insert-dropdown-menu 重命名为 insert-toolbar-buttonInsertDropdownMenu 重命名为 InsertToolbarButton

  • line-height-dropdown-menu 重命名为 line-height-toolbar-buttonLineHeightDropdownMenu 重命名为 LineHeightToolbarButton

  • link-floating-toolbar 重命名为 link-toolbar

  • 删除 list-indent-toolbar-button,合并到 list-classic-toolbar-button

  • ListIndentToolbarButton 重命名为 IndentToolbarButton

  • list-node 重命名为 list-classic-node

  • media-popover 重命名为 media-toolbarMediaPopover 重命名为 MediaToolbar

  • mode-dropdown-menu 重命名为 mode-toolbar-buttonModeDropdownMenu 重命名为 ModeToolbarButton

  • more-dropdown-menu 重命名为 more-toolbar-buttonMoreDropdownMenu 重命名为 MoreToolbarButton

  • 删除 outdent-toolbar-button,合并到 indent-toolbar-button

  • table-icons:将 Border* 重命名为 Border*Icon

  • slash-input-element 重命名为 slash-input-node

  • SuggestionBelowNodes 重命名为 SuggestionLineBreak

  • 删除 table-cell-element,合并到 table-node(以及静态版本)

  • 删除 table-row-element,合并到 table-node(以及静态版本)

  • table-dropdown-menu 重命名为 table-toolbar-buttonTableDropdownMenu 重命名为 TableToolbarButton

  • 删除 todo-list-node,合并到 list-classic-node

  • turn-into-dropdown-menu 重命名为 turn-into-toolbar-buttonTurnIntoDropdownMenu 重命名为 TurnIntoToolbarButton

  • export-toolbar-buttonindent-list-plugins:从 listStyleTypes 中移除 fire

  • useCommentEditor:使用 usePlateEditor 替代 useCreateEditor

  • 删除 placeholderwithPlaceholder。迁移:使用 block-placeholder-kitBlockPlaceholderPlugin 替代。

  • line-height-toolbar-button:删除 useLineHeightDropdownMenu 钩子。

  • font-color-toolbar-button:删除 useColorInput 钩子。 插件:

  • 将所有 *-plugin*-plugins 文件重命名为 -kit,将 *Plugin*Plugins 重命名为 *Kit插件套件是已配置插件的集合。

    • editor-plugins 重命名为 editor-kit
    • equation-plugins 重命名为 math-kitequationPlugins 重命名为 MathKit
    • indent-list-plugins 重命名为 list-kitindentListPlugins 重命名为 ListKit
    • block-list 中添加 BlockList 组件,用于 list-kit
    • 删除 use-create-editor,改用 usePlateEditor
  • ai-kit:添加 show 快捷键。从 ai-menu 中移除 useHotkeys('mod+j')

  • comment-kit:添加 setDraft 转换和快捷键

  • basic-marks-kitbasic-blocks-kit:添加快捷键

  • transformsblock-draggable:移除 STRUCTURE_TYPES,现在从 plugin.node.isContainer 推断。改用 editor.meta.containerTypes

  • useSelectionFragmentProp 用法中移除 structuralTypes

2025年5月 #22

5月26日 #22.7

5月15日 #22.6

5月11-12日 #22.5

  • 模板迁移到 Plate 48
  • 迁移到 shadcn v4:
    • Plate 之前有一个分叉版本的 shadcn/ui 原语,可能会与你现有的组件冲突。我们的组件现在完全依赖原始的 shadcn/ui 原语,使 Plate 更容易集成到你现有的 shadcn/ui 组件集中。
    • 所有组件更新到 Tailwind v4
    • 查看更新的安装指南
  • 迁移到 React 19。如果你使用 React 18,可能需要在一些地方使用 React.forwardRef
  • 迁移到 shadcn CLI
    • components.json 中移除 registries
    • 使用 npx shadcn 替代 npx shadcx
  • MCP 支持
  • 从所有组件中移除 withRef
  • @/lib/utils 导入 cn 而不是 @udecode/cn,以保持与 shadcn/ui 的一致性
  • 从所有 element 和 leaf 组件中移除未使用的 classNamestyle 属性
  • draggable
    • 修复 Firefox 中的拖放功能
  • media-placeholder-element:重构为使用 use-upload-file 钩子而不是 uploadthing
    • 迁移:npx shadcn@latest add https://platejs.org/r/api-uploadthing

5月6日 #22.3

  • ai-chat-editor:支持非标准 markdown 节点。
  • slash-input-element:添加 callout 支持。
  • block-selection-plugins.tsx:修复块选择不工作的问题。

5月4日 #22.2

  • ai/command: 从 ai 包分叉的 smoothStream 现在默认使用 30ms 延迟(仅代码块和表格使用 100ms 延迟)。

5月2日 #22.1

  • use-chat: 添加 _abortFakeStream
  • ai-menu: 修复菜单项显示不正确的问题。
  • ai-loading-bar: 将 esc 按键处理移至 ai-menu
  • ai/command: 将分块延迟增加到 100ms(临时解决性能问题)。

2025年4月 #21

4月30日 #21.3

  • autoformat-plugin: 允许以非1的数字开始新的缩进列表

4月29日 #21.2

  • ai-leaf: 添加 aiIndicatorVariants 以显示加载状态。
  • cursor-overlay: 当 AI 流式传输时隐藏。
  • api/ai/command: 修复分块问题。

添加 discussion-plugin:

  • discussionPlugin 添加到 editor-plugins,从 suggestionPlugin 中移除 configure
  • 重构 block-suggestion, comment 以使用 discussionPlugin
  • 修复 comment-create-form 在不存在讨论时创建讨论
  • suggestion-leaf 中的样式更改
  • 修复 link-floating-toolbar 以支持内部链接,并在建议或评论激活时顶部放置

4月19日 #21.1

  • ai-anchor-element: 添加 ai-anchor-element 组件,在流式传输前插入,流式传输后移除,用于定位 ai-menu
  • ai-loading-bar: 添加 ai-loading-bar 组件,用于显示插入模式流式传输的加载进度
  • ai-menu: 迁移到最新的 ai
  • ai-menu-items: 添加 generateMarkdownSample
  • ai-plugins: 移除提示中的单段落限制
  • editor: 引入 PlateContainer 组件

4月2日 #21.1

  • export-toolbar-button: 修复与 html2canvas-pro 的 PDF 导出问题
  • import-toolbar-button: 修复有时无法选择文件的问题

2025年3月 #20

3月12日 #20.4

  • ai-toolbar-button: 添加缺失的 @platejs/ai 依赖。
  • comment-toolbar-button: 添加缺失的 comments-plugin registry 依赖。
  • font-size-toolbar-button: 添加缺失的 popover registry 依赖。
  • tooltip: 添加缺失的 button registry 依赖。

3月10日 #20.3

  • block-context-menu: 防止在只读模式下打开上下文菜单

3月2日 #20.2

  • block-suggestion: 修复样式
  • suggestion-leaf-static: 添加静态版本

3月1日 #20.1

Plate 46 - 新代码块

  • 从 Prism.js 迁移到 lowlight 进行语法高亮
    • code-block-element-static, code-block-element, code-block-combobox: 更新以使用 lowlight 类。默认为 github 主题。
    • code-syntax-leaf-static, code-syntax-leaf: 更新以使用 lowlight token 类
    • 移除 prismjs 依赖及相关样式
    • 使用 lowlight 插件选项代替 prism 选项
    • code-block-combobox: 添加 Auto 语言选项,更改语言值以匹配 lowlight
  • autoformat-plugin: 防止在代码块上自动格式化
import { all, createLowlight } from 'lowlight';
 
const lowlight = createLowlight(all);
 
CodeBlockPlugin.configure({
  options: {
    lowlight,
  },
});

2月21日 #19.3

  • image-preview: 防止在图像预览遮罩上显示块菜单
  • media-popover: 当图像预览打开时隐藏媒体弹出窗口

2月18日 #19.2

Plate 45 - 新评论和建议 UI

  • 新增 block-discussion 作为主容器,用于 plate-element
  • 新增 comment 用于单个评论显示
  • 新增 comment-create-form 带有最小 Plate 编辑器用于输入
  • 移除旧组件:
    • comments-popover
    • comment-avatar
    • comment-reply-items
    • comment-value
    • comment-resolve-button
  • 新增 block-suggestion
  • 新增 suggestion-leaf
  • 新增 suggestion-line-break
  • 移除 plate-element,从 platejs/react 导入 PlateElement 代替。在 block-selection-plugins 中添加:
render: {
  belowRootNodes: (props) => {
    if (!props.className?.includes('slate-selectable')) return null;
 
    return <BlockSelection />;
  },
},

2月3日 #19.1

  • React 19
  • TailwindCSS 4
  • Plate 45
  • Jotai 2
  • Zustand 6
  • comment-more-dropdown: 移除 useCommentEditButtonState, useCommentDeleteButtonState
  • image-element, media-embed-element, media-video-element, mode-dropdown-menu
    • 使用 const width = useResizableValue('width')
  • image-preview: 移除 useScaleInputState, useImagePreviewState
  • floating-toolbar:
    • useEventEditorValue 替换 useEventEditorSelectors
  • media-popover:
    • FloatingMediaStore.set 替换 floatingMediaActions,
    • useFloatingMediaValue 替换 useFloatingMediaSelectors

2025年1月 #18

1月23日 #18.8

  • table-element: 修复样式,折叠时显示表格边框控件
  • table-row-element: 重构
  • table-cell-element: 选择背景品牌色

1月21日 #18.7

  • table-element, table-row-element: 支持行拖放和选择
  • plate-element: 添加 blockSelectionClassName 属性
  • editor: 选择区域 z-50
  • draggable:
    • editor.api.blockSelection.clear 替换 editor.api.blockSelection.replaceSelectedIds
    • 使用 TooltipButton 作为拖动手柄
    • 在拖动手柄点击时选择块
    • 在表格单元格中隐藏拖动手柄
  • column-element, table-cell-element: 添加 isSelectionAreaVisible 检查
  • block-selection: 拖动时隐藏
  • editor.api.blockSelection.set 替换 editor.api.blockSelection.addSelectedRow:
    • ai-menu
    • equation-popover
  • align-dropdown-menu: 弃用

1月18日 #18.6

  • inline-equation-elementequation-popover: 修复: 当选择内联公式时,弹出窗口不应打开,因为它会导致选择丢失。

1月17日 #18.5

  • emoji-picker-search-bar: 添加 autoFocus

1月16日 #18.4

  • import-toolbar-buttonexport-toolbar-button: 添加 markdown 支持

1月14日 #18.3

  • fixed-toolbar-buttons: 添加 import-toolbar-button
  • indent-fire-marker.tsx 添加 data-plate-prevent-deserialization 以防止反序列化火标记。将 span 标签更改为 li
  • indent-todo-marker.tsxspan 标签更改为 li
  • image-element-static.tsxhr-element-static.tsx: 修复 nodeProps 未传递给 SlateElement
  • ai-chat-editor:
const aiEditor = usePlateEditor({ plugins });
useAIChatEditor(aiEditor, content);

1月12日 #18.2

  • ai-plugins: 移除 createAIEditor,现在在 ai-chat-editor 中创建
  • ai-chat-editor: 仅使用 useAIChatEditor (v42.1)
  • ai-menu: 避免冲突,移除 aiEditorRef
  • command: 添加 focus-visible:outline-none
  • editor-static: 更新 aiChat 内边距
  • transforms: 修复 insertBlock 被斜杠命令使用的问题: 如果新插入的块与命令类型相同,则应插入新块。
  • block-selection-plugins: 更新 BlockSelectionPlugin
BlockSelectionPlugin.configure(({ editor }) => ({
  options: {
    enableContextMenu: true,
    isSelectable: (element, path) => {
      return (
        !['code_line', 'column', 'td'].includes(element.type) &&
        !editor.api.block({ above: true, at: path, match: { type: 'tr' } })
      );
    },
  },
}))

1月8日 #18.1

  • v42 迁移
  • table-element, table-element-static
    • 将图标移至 table-icons
    • 移除 colgroup,列宽现在在 table-cell-element 中设置
  • table-row-element: 移除 hideBorder 属性
  • table-cell-element, table-cell-element-static:
    • 列悬停/调整大小状态现在使用 Tailwind 而非 JS
    • 主要性能改进: 所有表格单元格在单个单元格更改时都会重新渲染。现已修复。
    • React.memo
  • table-dropdown-menu:
    • 动态表格插入
    • 合并/拆分单元格
    • 在前插入行/列
  • tooltip: 添加 TooltipButton
  • indent-list-toolbar-button: 移除 IndentListToolbarButton,改用 NumberedIndentListToolbarButtonBulletedIndentListToolbarButton
  • table-dropdown-menu: 新的插入表格界面。
  • column-group-element: 修复 ColumnFloatingToolbar onColumnChange

2024年12月 #17

12月28日 #17.8

  • export-toolbar-button: 添加 katex 支持
  • plate-element: 移除 relative 类名
  • 所有使用 PlateElement 的组件已移除冗余的 relative 类名。

12月27日 #17.7

  • fixed-toolbar-buttons: 添加 font-size-toolbar-button
  • floating-toolbar: 添加 inline-equation-toolbar-button
  • turn-into-dropdown-menu: 修复: 转换为其他块后,编辑器应重新获得焦点。
  • insert-dropdown-menu: 添加 inline equationequation 并修复焦点问题
  • slash-input-element: 添加 equationinline equation

12月23日 #17.5

  • table-element: 修复选择
  • 之前: isSelectingCell && '[&_*::selection]:bg-none'
  • 之后: isSelectingCell && '[&_*::selection]:!bg-transparent'

12月21日 #17.4

更新 tailwind.config.cjs 以在 HTML 导出中更好地支持字体:

fontFamily: {
  heading: [
    'var(--font-heading)',
    'ui-sans-serif',
    '-apple-system',
    'BlinkMacSystemFont',
    'Segoe UI Variable Display',
    'Segoe UI',
    'Helvetica',
    'Apple Color Emoji',
    'Arial',
    'sans-serif',
    'Segoe UI Emoji',
    'Segoe UI Symbol',
    'Noto Color Emoji',
  ],
  mono: ['var(--font-mono)', ...fontFamily.mono],
  sans: [
    'var(--font-sans)',
    'ui-sans-serif',
    '-apple-system',
    'BlinkMacSystemFont',
    'Segoe UI Variable Display',
    'Segoe UI',
    'Helvetica',
    'Apple Color Emoji',
    'Arial',
    'sans-serif',
    'Segoe UI Emoji',
    'Segoe UI Symbol',
    'Noto Color Emoji',
  ],

12月20日 #17.3

  • insertColumnGroup, toggleColumnGroup: 使用 columns 选项代替 layout
  • 移除 with-draggables。添加 DraggableAboveNodesdraggable。添加到 DndPlugin 配置:
DndPlugin.configure({ render: { aboveNodes: DraggableAboveNodes } }),
  • column-element, image-element, media-video-element: 移除 useDraggableState。使用 const { isDragging, previewRef, handleRef } = useDraggable
  • column-group-element: 移除 useColumnState。改用:
const columnGroupElement = useElement<TColumnGroupElement>(ColumnPlugin.key);
 
const onColumnChange = (widths: string[]) => {
  setColumns(editor, {
    at: findNodePath(editor, columnGroupElement),
    widths,
  });
};
  • export-toolbar-button: 添加 exportToHtml

12月19日 #17.2

Plate 41

  • 新的 RSC 组件用于元素和叶子组件,文件名以 -static.tsx 结尾。这些现在与默认的客户端组件一起添加。
  • editor: 添加 select-texteditorVariants
  • date-element: 只读时移除弹出窗口
  • indent-todo-marker: 使用 SlateRenderElementProps 类型代替 PlateRenderElementProps
  • hr-element, media-audio-element, media-embed-element, mention-element: 改进光标样式
  • media-file-element: 使用 <a> 代替 div + onClick
  • 所有元素和叶子组件: className 属性现在放在内联属性之前。

12月16日 #17.1

  • column-element:

    • 添加列的拖放支持
    • 添加带工具提示的拖动手柄
    • 修复列间距和内边距
  • column-group-element:

    • 移除列之间的间隙
    • 移除顶部边距
  • draggable:

    • 移除 DraggableProvider HOC
    • 移除 DropLine 子属性

2024年11月 #16

11月26日 #16.9

https://github.com/udecode/plate/pull/3809/files

  • 添加 select-editor, tag-element, label, form
  • @udecode/cmdk 替换 cmdk 依赖。这是 cmdk 的可控版本。
  • command: 添加变体
  • editor: 添加 select 变体
  • popover: 添加 animate 变体

https://github.com/udecode/plate/pull/3807/files

  • toc-element: 移除 <nav> 标签,改用 <div> 修复 html2canvas 问题
  • editor: 移除 role="button" 修复 html2canvas 问题

11月21日 #16.8

Shadcn 同步:

  • input: 添加 text-base md:text-sm
  • textarea: 添加 text-base md:text-sm
  • editor(ai, aiChat 变体): 添加 text-base md:text-sm

11月14日 #16.7

  • toolbar: 添加 ToolbarSplitButton, ToolbarSplitButtonPrimary, ToolbarSplitButtonSecondary
  • media-toolbar-button: 使用 ToolbarSplitButton

11月13日 #16.6

  • resizable: 只读时隐藏 ResizeHandle

11月8日 #16.5

  • 将此添加到您的 tailwind 配置:
// 插件
require("tailwind-scrollbar-hide")
 
// theme.extend.screens
screens: {
  /**
   * 匹配主指向设备可以方便悬停的设备。用法: main-hover:group-hover:bg-red-500 参见:
   * https://developer.mozilla.org/en-US/docs/Web/CSS/@media/hover
   *
   * 在 iOS 设备上,包含 `group-hover:` CSS 规则的 .group 元素内的按钮需要点击两次才能
   * 点击。作为解决方法,我们在无法方便悬停的设备上禁用这些规则,使用 `main-hover:`。
   */
  'main-hover': {
    raw: '(hover: hover)',
  },
},
  • editor:
    • EditorContainer: 移除 ref,改用 useEditorContainerRef
    • 添加 caret-primary selection:bg-brand/25
    • 将 `id