Skip to content

Node Attrs Sync

node-attrs-sync keeps node attributes synchronized between the editor state and the DOM. It is a good fit when a node view or custom element needs to reflect editor-side attribute changes without manual bookkeeping.

Install

Terminal window
pnpm add @citolab/prose-extensions

Usage

import { nodeAttrsSyncPlugin } from '@citolab/prose-extensions/node-attrs-sync';
const plugins = [nodeAttrsSyncPlugin];

ProseKit

If your app is built on ProseKit, use the extension wrapper instead. It requires the prosekit peer dependency:

import { nodeAttrsSyncExtension } from '@citolab/prose-extensions/prosekit-extensions';

When to use

Use this when the DOM representation and the ProseMirror document need to stay aligned as attributes change.