fix(core): convert between list types with different item schemas#8033
fix(core): convert between list types with different item schemas#8033bdbch wants to merge 3 commits into
Conversation
Convert list items between different list types by recursively converting nested lists when the target item schema supports it, and flattening nested items into sibling items when it does not.
✅ Deploy Preview for tiptap-embed ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
🦋 Changeset detectedLatest commit: 904a969 The changes in this PR will be included in the next version bump. This PR includes changesets to release 72 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
There was a problem hiding this comment.
Pull request overview
This PR fixes toggleList in @tiptap/core so toggling between list types with different item node schemas (e.g. bulletList/listItem ↔ taskList/taskItem) performs a structured conversion instead of producing broken documents or no-ops. It also updates the default demos to expose task lists in the UI and adds test coverage for the new conversion behavior.
Changes:
- Add cross-item-type list conversion to
toggleList, including recursive nested-list conversion and flattening when the target item schema can’t contain nested lists. - Introduce small conversion utilities (
convertListItems,convertListItem, etc.) to keeptoggleListlogic focused and schema-valid. - Add/extend unit + demo e2e coverage and expose task list toggling in the default React/Vue/Svelte demos.
Reviewed changes
Copilot reviewed 17 out of 17 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| packages/extension-list/tests/taskItem.spec.ts | Adds unit tests covering cross-type list conversion, nested conversion/flattening, and selection preservation. |
| packages/core/src/commands/utils/listConversionTypes.ts | Adds shared types for list conversion context/state. |
| packages/core/src/commands/utils/flushPendingContent.ts | Adds helper to flush accumulated item content into a schema-valid item node. |
| packages/core/src/commands/utils/findNodePosition.ts | Adds helper to relocate selection by finding node positions after replacement. |
| packages/core/src/commands/utils/createNode.ts | Adds safe node creation helper guarded by validContent and try/catch. |
| packages/core/src/commands/utils/convertListItems.ts | Adds recursive conversion of all items in a list. |
| packages/core/src/commands/utils/convertListItem.ts | Adds per-item conversion that may yield multiple output items (flattening). |
| packages/core/src/commands/utils/appendNestedList.ts | Implements “preserve nested list if allowed; otherwise flatten” behavior. |
| packages/core/src/commands/utils/appendContentNode.ts | Appends or splits item content based on schema validity. |
| packages/core/src/commands/toggleList.ts | Integrates cross-item-type conversion into toggleList, including selection preservation. |
| demos/src/Examples/Default/Vue/index.vue | Adds Task list button and enables TaskItem/TaskList extensions. |
| demos/src/Examples/Default/Svelte/index.svelte | Adds Task list button and enables TaskItem/TaskList extensions. |
| demos/src/Examples/Default/React/menuBarState.ts | Tracks isTaskList active state for menu rendering. |
| demos/src/Examples/Default/React/MenuBar.tsx | Adds Task list toggle button. |
| demos/src/Examples/Default/React/index.tsx | Enables TaskItem/TaskList extensions in the default React demo. |
| demos/src/Examples/Default/index.spec.ts | Extends e2e assertions to include the Task list button + resulting DOM. |
| .changeset/fix-cross-type-list-toggle.md | Adds a patch changeset documenting the user-facing fix in @tiptap/core. |
|
@coderabbitai review |
✅ Action performedReview finished.
|
|
Important Review skippedNo new commits to review since the last review. ⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
📝 WalkthroughWalkthroughList toggling now converts between list types with different item schemas, recursively preserving nested lists when supported and flattening them otherwise. React, Svelte, and Vue demos now expose task-list controls with conversion and selection coverage. ChangesCross-type list toggling
Estimated code review effort: 4 (Complex) | ~45 minutes Sequence Diagram(s)sequenceDiagram
participant Editor
participant toggleList
participant ListConversion
participant ProseMirror
Editor->>toggleList: toggleTaskList()
toggleList->>ListConversion: convert incompatible list items
ListConversion->>ProseMirror: validate and create converted nodes
toggleList->>ProseMirror: replace list and remap selection
ProseMirror-->>Editor: updated task-list document
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/core/src/commands/utils/appendNestedList.ts`:
- Around line 19-34: Update the nested list construction in appendNestedList to
preserve the source ordered-list attributes when calling createNode, including
start and type, instead of always passing null attrs. Keep the existing
validation and pendingContent flow unchanged.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: 75a8e195-3c8b-4ab0-90b2-96c2f805012e
📒 Files selected for processing (17)
.changeset/fix-cross-type-list-toggle.mddemos/src/Examples/Default/React/MenuBar.tsxdemos/src/Examples/Default/React/index.tsxdemos/src/Examples/Default/React/menuBarState.tsdemos/src/Examples/Default/Svelte/index.sveltedemos/src/Examples/Default/Vue/index.vuedemos/src/Examples/Default/index.spec.tspackages/core/src/commands/toggleList.tspackages/core/src/commands/utils/appendContentNode.tspackages/core/src/commands/utils/appendNestedList.tspackages/core/src/commands/utils/convertListItem.tspackages/core/src/commands/utils/convertListItems.tspackages/core/src/commands/utils/createNode.tspackages/core/src/commands/utils/findNodePosition.tspackages/core/src/commands/utils/flushPendingContent.tspackages/core/src/commands/utils/listConversionTypes.tspackages/extension-list/__tests__/taskItem.spec.ts
Update createNode to accept optional attrs and pass them to the node type when creating. This ensures the nested list retains the source list's attributes (e.g., start, type).
|
@coderabbitai review again |
|
✅ Action performedReview finished.
|
|
@coderabbitai review again - I want to test something |
|
✅ Action performedReview finished.
|
Fixes
Closes #2492
Changes and Review
Checklist
Responsibility