Editors

Install:

BASH

npm install @vibeflui/editors @tiptap/react @tiptap/starter-kit @tiptap/pm @uiw/react-codemirror @uiw/react-md-editor @editorjs/editorjs

app/providers.tsx

TSX

import { FluiKitProvider } from "@vibeflui/core";
import { editorsPlugin } from "@vibeflui/editors";

export function Providers({ children }: { children: React.ReactNode }) {
  return <FluiKitProvider plugins={[editorsPlugin]}>{children}</FluiKitProvider>;
}

Exports include richtextPlugin, codePlugin, markdownPlugin, editorJsPlugin, createEditorsPlugin, and editorsPlugin.

editorsPlugin registers Editor.js with no tools, so its content field only gets paragraph blocks plus inline Bold/Italic/Link. See Editorjs for wiring the full Header/List/Quote/Table/... tool set.

schemas/articles/editor.schema.ts

form: {
  fields: [
    { name: "body", label: "Body", type: "richtext", adapter: "richtext" },
    { name: "code", label: "Code", type: "code", adapter: "code" },
    { name: "summary", label: "Summary", type: "markdown", adapter: "markdown" },
    { name: "content", label: "Content", type: "json", adapter: "editorjs" }
  ]
}