Skip to content

Add checklist and better bullet and ordered list support to editor#107

Open
hendriebeats wants to merge 9 commits into
Added-Ordered-and-Unordered-Listsfrom
Added-checklist-items
Open

Add checklist and better bullet and ordered list support to editor#107
hendriebeats wants to merge 9 commits into
Added-Ordered-and-Unordered-Listsfrom
Added-checklist-items

Conversation

@hendriebeats

@hendriebeats hendriebeats commented Feb 18, 2026

Copy link
Copy Markdown
Contributor

Adds bullet, ordered, and checklist support to the ProseMirror editor, including a full list plugin, toolbar buttons, keyboard shortcuts, and interactive checkbox rendering.

List plugin (listPlugin.ts)

  • New file implementing all list behaviour: toggle commands, sink/lift (indent/outdent) for single items and multi-item selections, Enter/Backspace/Delete handling, and input rules (- , 1. , -[]).
  • Custom sinkCurrentItem keeps sibling children at their visual indentation level rather than moving them with the sunk parent — standard pmSinkListItem moves children, which felt wrong here.
  • joinAdjacentLists plugin auto-merges two lists of the same type when they become adjacent after edits.

Indent/outdent (editorUtils.tsx)

  • New indent/outdent exports try range-aware list operations first, then single-item list ops, then fall back to chunk-level indentation — this replaces the previous increaseLevel/decreaseLevel calls on the toolbar buttons, which didn't understand list context.

Checklist item rendering (Editor.tsxCheckListItemView)

  • Checklist items need an interactive checkbox span that is contenteditable=false; a plain <li> with a CSS checkbox isn't clickable without this NodeView.
  • Registered in both the main editor and the question popup editor so checklists work in both contexts.
  • listPlugins is also added to the question popup's plugin list so list keyboard handling (Enter, Backspace, Tab) works there too.

baseKeymap Backspace override removed

  • Previously mutated baseKeymap["Backspace"] globally, which could affect other editors. listPlugins now accepts custom pre-backspace commands as a parameter and chains them internally.

Placeholder decoration stopEvent

  • Added { stopEvent: () => true } so click events on the bible-text placeholder don't propagate into ProseMirror and accidentally move the cursor.

Accessibility polish

  • StudyBlockEditPencil changed from <img> to <button> so it is keyboard-reachable and has a proper role.
  • closer (question popup close) changed from a custom <closer> element to <button>.
  • Delete Study menu item changed from <a> to <button> (no href, purely an action).
  • Color picker buttons gained aria-label attributes.
  • contenteditable="false" added to noQuestionsText and addAnswer to prevent the cursor from entering non-editable UI chrome.

Keyboard shortcuts & toolbar

  • Mod+Shift+8 / Mod+Shift+7 / Mod+Shift+9 for bullet / ordered / checklist, matching Google Docs convention. Numbers without Shift conflict with browser tab switching.
  • Toolbar tooltips use the existing {{modkey}} template variable so they show ⌘ on macOS and Ctrl elsewhere.

@hendriebeats hendriebeats changed the title Add checklist, bullet list, and ordered list support to editor Add checklist and better bullet and ordered list support to editor Feb 18, 2026
@hendriebeats hendriebeats changed the base branch from master to Added-Ordered-and-Unordered-Lists February 19, 2026 08:33
- Add `- [ ]` (and `-[ ]`) as a markdown shorthand for creating checklist
  items, both from plain paragraphs and inside existing list items
- Import and prepend `undoInputRule` to the backspace chain so pressing
  backspace immediately after any input rule fires reverts the conversion
  and restores the original typed text, rather than lifting the list item
- Mark `joinAdjacentLists` appended transactions with `addToHistory: false`
  so auto-joining adjacent same-type lists is grouped with its triggering
  transaction, making Ctrl+Z fully undo an input rule conversion in one step
Registers Mod+Shift+8 (bullet), Mod+Shift+7 (ordered), and
Mod+Shift+9 (checklist) in the ProseMirror keymap, matching the
Google Docs convention. Toolbar tooltips use the existing {{modkey}}
template variable so they display ⌘ on macOS and Ctrl elsewhere.
@hendriebeats

Copy link
Copy Markdown
Contributor Author

@boxyoman I made the changes you suggested to this.

  • So now it supports the "- []", "- [ ]" Syntax to create the checklist items.
  • It registers the transformation from the raw text to various list items so that you can backspace or Ctrl+Z to get the raw text back.
  • There are keyboard shortcuts for the three list items following the Google Docs pattern. This is different from the other shortcuts we have because it also requires you to press shift, but this is a standard pattern and is likely the most familiar to people.

@hendriebeats hendriebeats added the Siee: XL / Too large 1,000+ lines: Hard to review; often requires staged PRs or special review strategy. label Feb 24, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Siee: XL / Too large 1,000+ lines: Hard to review; often requires staged PRs or special review strategy.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Ordered/Unordered/checkbox list

1 participant