Add an inline-only mode to the rich text editor

[rtibblesbot]

Summary

• inlineOnly prop builds the editor on a schema with no block nodes, for inline-only QTI fields such as gap match choices.
• Toolbars, mobile bars, shortcuts and input rules offer only inline tools.
• Block content from storage or the clipboard flattens to one inline run; images are dropped.

References

Closes #6193. Builds on #6151.

Reviewer guidance

• No field uses the prop yet.
• Top node is a textblock (content: 'inline*'); focus('end'), selectAll and the Math node view are the likeliest to misbehave.
• Always reads and writes HTML: the markdown serializer writes each inline child as a block.

QA steps

Setup: exercise → Questions → multiple-choice question. For steps 3–5, add inlineOnly to the choice <TipTapEditor> in shared/views/QTIEditor/interactions/choice/Editor.vue.

1. Full editor, desktop and mobile: every toolbar group, More overflow and insert menu item works; content survives save and reopen.
2. Full editor: pasting a heading, list and image (Ctrl+V, Paste, Paste as plain text) keeps blocks.
3. Inline-only, desktop: only inline tools, also in More; no empty groups or doubled dividers.
4. Inline-only, mobile: no format size, list or align controls; insert menu offers math only.
5. Inline-only, typing: Enter and Shift-Enter insert <br>; block shortcuts and input rules (#, -, 1., >, ```, ---) create no blocks; saved value has no <p>.

Evidence

Full editor, desktop

Step	Screenshot
Full toolbar on a choice

s1-more-menu-flow-820px.webm

Full editor, mobile

Step	Screenshot
Formatting bar with all groups and dividers

Full editor, paste

Step	Screenshot
Ctrl+V keeps heading, paragraphs and list as blocks

Inline-only, desktop

Step	Screenshot
Inline-only toolbar at full width
More menu open at 420px: inline tools only

Inline-only, mobile

Step	Screenshot
Formatting bar without format size, lists or align

Inline-only, typing

Step	Screenshot
Emitted value is one inline run with <br> and <code>, no <p>

More captures (25)

Step	Screenshot
Full editor: math modal
Full editor: reopened, content preserved
Full editor mobile: insert menu
Full editor mobile: formatted stem
Paste dropdown open
Paste as plain text
Ctrl+V into a markdown-format editor
Inline-only toolbar at 820px
Inline-only More menu at 320px
Inline-only marks applied
Inline-only math modal
Inline-only math inserted, minimized
Inline-only mobile: insert menu with math only
Inline-only mobile: bold applied
Inline-only mobile: subscript applied
Inline-only mobile: superscript applied
Inline-only mobile: math editor
Inline-only mobile: math inserted
Inline-only mobile: minimized
Enter and Shift-Enter give line breaks
Backticks make inline code
Markdown rules create no blocks
Markdown rules after a line break create no blocks
Emptied editor, minimized
Inline-only toolbar at 420px

AI usage

Used Claude Code to plan and implement the change test-first and to capture the screenshots. Verified with the TipTapEditor and QTIEditor Jest suites, pre-commit, and an axe audit in a headless browser.

🤖 Generated with Claude Code

---

@rtibblesbot's comments are generated by an LLM, and should be evaluated accordingly

How was this generated?

• Ran pre-flight CI checks (lint, format, tests) and verified all pass
• Rebased onto the target branch and resolved any conflicts
• Reorganized commit history into clean, logical commits
• Audited the diff to ensure only issue-relevant files are changed
• Built PR body from the repository's PR template with evidence blocks

🟢 Updating PR Last updated: 2026-09-30 20:21 UTC