Can this fix cursor drift in vmark?

It identifies the known limitation where line numbers drift after WYSIWYG edits and provides guidance on where attributes are correctly or incorrectly stored.

When should I use the Tiptap API vs. direct ProseMirror access?

Use Tiptap for standard format commands, block type changes, and content insertion. Use ProseMirror directly for low-level transactions, schema operations, custom node views, and markdown conversion layers.

How does this skill help with cursor positioning?

It provides patterns for using $pos helpers and doc.resolve(pos) to respect block boundaries, preventing common errors caused by flattening the document into a text string.

Does this skill support chained editor commands?

Yes, it provides specific syntax patterns for using editor.chain().focus() to perform multiple sequential operations while maintaining user focus.

How do I check if a specific format is active?

The skill guides you to use editor.isActive('name') for basic marks and editor.getAttributes('name') for retrieving specific configuration details like link URLs.

Tiptap Editor Patterns

Name: Tiptap Editor Patterns
Author: xiaolai

byxiaolai

•

141

•

Gestión de Contenido

Streamlines vmark WYSIWYG development through standardized Tiptap API patterns and ProseMirror integration guidance.

This skill provides specialized technical guidance for developers working on the vmark AI-friendly markdown editor. It helps Claude distinguish between high-level Tiptap commands for formatting and low-level ProseMirror access for complex document manipulation. By following these patterns, developers can implement robust editor features such as block-aware cursor handling, chained command execution, and accurate state queries, while avoiding common pitfalls like document flattening and cursor sync drift that occur during WYSIWYG editing.

Características Principales

01141 GitHub stars

02Implements block-aware node traversal using $pos resolution helpers

03Distinguishes between Tiptap high-level commands and direct ProseMirror transactions

04Enables efficient editor state queries and attribute extraction

05Provides standardized patterns for format operations, block changes, and list management

06Addresses specific vmark issues like cursor sync drift and document structure loss

Casos de Uso

01Fixing cursor positioning and selection bugs in rich text components

02Developing custom WYSIWYG commands for markdown editors

03Implementing complex document transformations and content insertion logic

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add xiaolai/vmark tiptap-editor

For use in Claude.ai and ChatGPT

Download Skill