富文本编辑器
版本 ^1.0.27
好吧，我们做到了。自今天起，Flux 现在自带富文本编辑器 🎉。
只需在你的应用中任意位置加入这一行，你就可以开始编辑：
<flux:editor wire:model="content" />我们为这个组件打磨了许多细节，希望你能感受到。
可配置工具栏
<flux:editor toolbar="heading | bold italic strike ~ link" />要配置编辑器的工具栏项目，你可以在 toolbar 属性中传入自定义排列的字符串，字符串由项目名称与分隔符（|）和占位空格（~）混合组成。
由于这些项目在 Flux 中都是简单的 Blade 组件，你可以轻松创建自己的 Blade 组件，并在 toolbar 属性中通过名称进行引用。
自定义工具栏项
如果你想完全掌控工具栏，可以自己组合这些 Blade 组件来拼装一个编辑器。
下面是给编辑器工具栏添加自定义下拉菜单的示例：
<flux:editor>
<flux:editor.toolbar>
<flux:editor.heading />
<flux:editor.separator />
<flux:editor.bold />
...
<flux:dropdown>
<flux:editor.button icon="ellipsis-horizontal" tooltip="More" />
<flux:menu>
<flux:menu.item wire:click="..." icon="arrow-top-right-on-square">Preview</flux:menu.item>
<flux:menu.item wire:click="..." icon="arrow-down-tray">Export</flux:menu.item>
<flux:menu.item wire:click="..." icon="share">Share</flux:menu.item>
</flux:menu>
</flux:dropdown>
</flux:editor.toolbar>
<flux:editor.content />
</flux:editor>如你所见，这和其他组件一样只是 Blade/HTML。你可以将任意你喜欢的 Flux 组件样式化并组装进编辑器的工具栏中。
无需鼠标
编辑器的工具栏使用“游走的 tabindex”，因此当你在页面上 Tab 键导航时，不必逐一穿过每个工具栏项目。工具栏作为一个单一的 Tab 停靠点，你可以使用方向键在其中导航。
你也可以仅通过键盘在工具栏的子菜单中进行导航。
实际上，你可以轻松地在不触碰鼠标的情况下完成对该编辑器的一切操作。
Markdown 语法
尽管这是一个富文本编辑器，但它也支持 Markdown 语法，作为你编辑文档时控制样式的便捷方式。
快捷键
同你在 Google Docs 等其他编辑器中熟悉的标准键盘快捷键一样，这里也都可以使用。
例如：
Cmd+B加粗Cmd+I斜体Cmd+K插入链接
作为表单字段
<flux:editor label="Release notes" description="说明此版本有哪些更新。" />我们希望在表单中使用该组件时，它与 textarea 字段的使用体验没有任何区别。
这意味着要处理字段与字段集两个层面的禁用与无效状态，把标签/描述与编辑器进行关联，以及在点击字段标签时将焦点聚焦到编辑器上。
屏幕阅读器
如上图所示，我们努力确保编辑器的可访问性树尽可能详尽且可用。
屏幕阅读器可以轻松发现并使用编辑器中的所有功能。这也包括一些棘手的部分，比如工具栏子选择、工具提示以及插入链接的弹出层。
动态 JS 包
目前，Flux 的所有 JavaScript 都包含在一个 21.5KB 的文件中。
由于富文本编辑器及其依赖体量巨大，这个组件会给 Flux 的包体增加高达 85.3KB。
问题在于，应用中的许多页面根本不会使用富文本编辑器，没有必要让它们承受更大的包体负担。
因此，我们将编辑器的 JavaScript 拆分成独立的包，并在需要时并行按需加载。只有在真正需要的那一刻，编辑器的 JS 才会被包含进来，以保证你应用的其他部分始终轻巧灵敏。这也覆盖了边界情况，比如在页面加载很久之后再惰性加载一个编辑器。
本地化
该组件中所有英文文案都可以通过将一组预定义的键复制到你的 lang/?.json 文件中来进行翻译。
基于 Tiptap 与 ProseMirror 构建
我们没有选择封装像 Quill 或 TinyMCE 这类“电池全含”的编辑器，而是选择在底层使用 Tiptap 来实现编辑器的核心功能。
Tiptap 是对功能极其强大的 ProseMirror 项目的一层便捷封装。
它是完全无头的，这意味着我们可以完全掌控所有的标记、视觉与可访问性，而无需自己处理输入/格式化交互。
这也意味着我们可以像 Flux 其他组件一样，让工具栏具备同等程度的可定制性，因为我们完全掌控其 HTML/CSS/JS。
此外，为了支持并感谢 ProseMirror 项目，我们通过其 GitHub 赞助页面捐赠了 $1000。
未来
在发布之初，我们的目标是：一个像 Flux 其他组件一样，开发与使用体验都同样扎实可靠的编辑器。
现在我们已经达成这一目标，可以开始添加更高级的功能，比如图片支持与 @mentions。
敬请期待！