Extension Priority Manager

Build a rich text editor that demonstrates how extension priorities control execution order and command overriding.

Requirements

Create an editor with three custom extensions that have different priority values. The extensions should demonstrate that higher priority values cause extensions to load later, allowing them to override commands from lower priority extensions.

Extension 1: Base Counter (priority: 100)

• Name: 'baseCounter'
• Priority: 100
• Storage: { count: number } initialized to 0
• Lifecycle: Increment count in storage on every onUpdate call
• Command: getCount() returns the current count value from storage

Extension 2: Enhanced Counter (priority: 200)

• Name: 'enhancedCounter'
• Priority: 200
• Storage: { count: number } initialized to 0
• Lifecycle: Increment count in storage on every onUpdate call
• Command: getEnhancedCount() returns the current count value from storage

Extension 3: Count Modifier (priority: 300)

• Name: 'countModifier'
• Priority: 300
• Command: Override the getCount command to return the base counter's value multiplied by 10

Editor Setup

Create a function createPriorityEditor() that:

• Initializes an editor with all three extensions (extensions can be passed in any order to the array)
• Sets initial content to a paragraph with text "Test"
• Returns the configured editor instance

Test Cases

• After one content update, getCount() returns 10 (1 × 10 from modifier) @test
• After two content updates, getCount() returns 20 (2 × 10 from modifier) @test
• The getEnhancedCount() command returns correct independent count @test

@generates

API

/**
 * Base counter extension with priority 100
 */
export const BaseCounter: any;

/**
 * Enhanced counter extension with priority 200
 */
export const EnhancedCounter: any;

/**
 * Count modifier extension with priority 300
 */
export const CountModifier: any;

/**
 * Creates an editor with priority-ordered extensions
 */
export function createPriorityEditor(): any;

Dependencies { .dependencies }

@tiptap/core { .dependency }

Provides rich text editor functionality with extension system and priority-based loading.

@satisfied-by