Introduction

What it is

A Vue and React editor library on TipTap v3. Editors are assembled from features: the simple editor is the core features alone (formatting, headings, lists, quotes, code, undo/redo) and needs no backend, no Yjs and no feature code; the advanced editor composes every feature (media, mentions, transcripts, Typed blocks, authors, comments, AI, collaboration, block UI, site-wide Obsidian themes and their integrations) on both surfaces. The framework-free ./core holds the feature model, and every feature's logic is framework-free too (./<feature>): a feature is built from a typed UI binding (<x>FeatureCore(ui)) that the Vue layer (./<feature>/vue, Nuxt UI chrome) and the React layer (./<feature>/react, shadcn/ui on Radix and Tailwind) fill with their components, node views and notice seam. Toolbar, settings panel and modal, Block outline, AI sidebar, Comments margin, Typed blocks table and Block inspector, and the Document tree are components you place anywhere beside an editor; both layers ship the simple editor (./vue/simple, ./react/simple) and the advanced editor (./vue/advanced, ./react/advanced).

A reference Nuxt app and the @skaile/forge-editor library it is built on: a block editor for structured documents (transcripts, minutes, reports) with AI assistance and collaboration, offered on a Vue and a React surface.

How the pieces fit

• An editor is a list of features (EditorFeature) validated by defineEditor into an immutable EditorPreset and mounted by EditorSurface. composeEditor({ content: 'basic' | 'rich', interaction: 'minimal' | 'full' | [], ai: boolean, backend?, add?, remove? }) builds one from three dimensions; a feature whose requires or backend capability is missing is dropped and listed in omitted. Prebuilt are the SimpleEditor and AdvancedEditor components (Vue and React), advancedEditor() (everything plus the three integrations) and the framework-free simpleEditor() (core-content + core-ui, no backend, no ⌘K palette) from /presets/compose. See Feature composition.
• Toolbar, settings panel and modal, Block outline, AI sidebar and Document tree are separate components you place beside an editor and give the editor (:editor from ready). The toolbar and settings components find the editor's preset through it; there is no preset prop.
• Every advanced feature has three entries: framework-free /<x> (logic, models and the UI binding contract), /<x>/vue and /<x>/react. Layers: framework-free /core, Vue (/vue, Nuxt UI) and React (/react, shadcn/ui). Importing an entry registers nothing globally, and the root entry @skaile/forge-editor is type-only. All entries are listed in the exports reference.
• The package is published as built ESM with .d.ts (the source maps embed the sources; src is not published). Consume it through Vite (@vitejs/plugin-vue with @nuxt/ui/vite, or @vitejs/plugin-react with @tailwindcss/vite) or Nuxt.
• UI strings render from catalogs in de (default) and en: locale: 'de' | 'en' and partial messages overrides on createEditorContext / createEditor / the module option, ctx.t(key, params?) in features and useEditorI18n() in components (see Language). Server error messages are German developer messages; docs and identifiers are English.

The words used on these pages (Feature, Preset, Surface, Block, …) are defined in the glossary.

Where to start