组件概述
组件和节点组件提供了与 Tiptap 功能集成的预构建功能(节点组件是编辑器内容中的元素),而原语是用于构建这些更丰富交互的基本、低级 UI 组件。
Components
AI 菜单
添加智能 AI 支持的菜单,用于内容编辑、生成和转换。
AI 问答按钮
添加一个按钮,用于触发所选文本的 AI 驱动内容生成和编辑。
Code Block Button
Add a button that toggles through block-level nodes like blockquotes.
Open Source
Emoji Dropdown Menu
一个预构建的 React 组件,通过输入 `:` 触发提供表情符号建议。
Emoji 菜单
添加一个带有搜索和键盘导航功能的交互式 Emoji 选择菜单。
列表下拉菜单
从下拉菜单中选择列表类型。
Open Source
列表按钮
通过按钮在无序、有序或任务列表之间切换。
Open Source
删除节点按钮
一个预构建的 React 组件,用于从编辑器中删除节点。
图像上传按钮
通过触发按钮上传一张图片。
Open Source
图片对齐按钮
一个内置的 React 组件,用于控制 Tiptap 编辑器中的图片对齐。
复制到剪贴板按钮
一个预构建的 React 组件,用于将编辑器内容复制到剪贴板。
复制按钮
一个预构建的 React 组件,用于复制编辑器中的节点。
复制锚点链接按钮
一个预构建的 React 组件,用于复制编辑器中节点的锚点链接。
拖拽上下文菜单
添加一个带有上下文菜单的拖拽句柄,提供块级操作,如转换、样式设置、复制和删除节点。
提及触发按钮
一个预建的 React 组件,用于在 Tiptap 编辑器中插入提及触发字符。
撤销/重做按钮
使用按钮撤销或重做一个操作
Open Source
文字按钮
用智能检测和键盘快捷键将所选内容转换为段落文本,适用于 Tiptap 编辑器。
文本对齐按钮
通过按钮在文本对齐选项之间切换
Open Source
斜杠命令触发按钮
一个预构建的 React 组件,用于向 Tiptap 编辑器插入斜杠命令触发器。
标记按钮
添加一个按钮来触发文本标记,如粗体、斜体等。
Open Source
标题下拉菜单
预构建的 React 组件,提供一个用于选择标题级别的下拉菜单。
Open Source
移动节点按钮
一个预构建的 React 组件,可以在编辑器中向上或向下移动节点。
表情符号触发按钮
一个预构建的 React 组件,用于在编辑器中插入表情符号触发字符。
转换为下拉菜单
添加一个下拉菜单,用于在不同内容类型之间转换块元素。
重置所有格式按钮
一个预构建的 React 组件,用于移除当前选区中的所有格式标记。
链接弹出框
添加一个具有链接选项的弹出框元素。
Open Source
颜色文本弹出框
一个全面的颜色选择弹出框,支持 Tiptap 编辑器中的文本和高亮颜色,包含最近使用颜色、键盘导航及视觉颜色反馈。
Node Components
Image Node Pro
一个用于 Tiptap 编辑器的增强图片节点组件,带有浮动工具栏、对齐控制和高级管理功能。
代码块 UI 节点
为你的编辑器添加一个代码块节点组件。
Open Source
列表节点
添加用于渲染列表的节点组件。
Open Source
图像上传节点
通过节点 UI 组件上传图像
Open Source
图像节点
集成图像节点 UI 组件。
Open Source
引用 UI 节点
向您的编辑器添加引用节点组件。
Open Source
标题 UI 节点
向你的编辑器添加一个标题节点组件。
Open Source
段落节点
添加段落 UI 节点组件
Open Source
水平分隔线 UI 节点
向您的编辑器添加一个水平分隔线节点组件。
Open Source
New
目录节点
添加带有侧边导航的目录 UI 节点组件
New
表格节点
添加表格 UI 节点组件
Primitives
Badge
在你的 Tiptap 编辑器中集成一个小型视觉指示器。
Open Source
Card
一个灵活的容器,以统一的方式组合相关内容和操作。
Open Source
Label
一个语义化的标签组件,可以渲染为 label 或 div 元素,具备一致的排版和交互处理。
Open Source
Menu
一个全面的菜单系统,支持层级导航、搜索功能、筛选及键盘交互,完全支持无障碍访问。
TextareaAutosize
一个根据内容自动调整高度的 textarea 组件,兼容服务端渲染,具有平滑的尺寸调整表现。
Open Source
下拉菜单
从下拉菜单 UI 组件中选择一个选项。
Open Source
分隔符
在工具栏中将菜单项彼此分开。
Open Source
头像
将用户或实体的视觉表示集成到您的 Tiptap 编辑器中。
弹出式
在选择旁边集成一个弹出式 UI 元素。
Open Source
按钮
将按钮 UI 组件添加到你的 Tiptap 编辑器中。
Open Source
提示工具
添加一个当您悬停在元素上时出现的弹出框。
Open Source
组合框
一个可搜索的下拉组件,将输入框与可过滤的选项列表结合,提升用户交互体验。
输入框
一个用于文本输入的简单输入字段组件,具有一致的样式和无障碍功能。
Open Source
间隔
在菜单项之间添加一些空间。
Open Source