Notes: Block editor with slash commands, drag-drop, and native UI#130
Open
elicep01 wants to merge 6 commits intofeat/notes-ui-tooltips-glassfrom
Open
Notes: Block editor with slash commands, drag-drop, and native UI#130elicep01 wants to merge 6 commits intofeat/notes-ui-tooltips-glassfrom
elicep01 wants to merge 6 commits intofeat/notes-ui-tooltips-glassfrom
Conversation
…e SuperCmd UI - Replace textarea editor with block-based contentEditable that live-renders markdown (headings, bullets, checkboxes, ordered lists, blockquotes, code, dividers) - Add Notion-like slash command menu (type '/' to insert block types) - Add drag-and-drop block reordering with grip handles - Clickable checkboxes in both editor and search preview - Markdown shortcuts auto-convert (# → heading, - → bullet, - [ ] → checkbox, etc.) - Auto-continue lists on Enter, empty prefix exits list on Enter - Match native SuperCmd UI throughout: CSS variables (--text-primary, --card-bg, etc.), sc-back-button class, ExtensionActionFooter with Actions ⌘K on bottom-right, glass-effect theme, kbd badge styling - Keyboard shortcuts: ⌘B bold, ⌘I italic, ⌘E code, ⌘+Enter toggle checkbox, arrow keys navigate between blocks, backspace merges/converts blocks
- Undo (⌘Z) and redo (⌘⇧Z) with debounced history snapshots - ArrowLeft/Right cross-block cursor navigation like Notion - History tracks all structural changes (split, merge, drag, format)
- Block math: type $$ or /math to create a math block with live KaTeX preview - Inline math: wrap with $...$ for inline equations rendered when not editing - Math blocks show raw LaTeX when focused, rendered output when blurred - Inline math overlay hides raw text and shows rendered KaTeX when block unfocused - Added ⌘⇧M shortcut and toolbar button for inline math wrapping - Search preview renders both block and inline math
- Active block gets subtle accent ring + background for navigation visibility - ActionsOverlay anchored to bottom-left matching SuperCmd UI pattern - LaTeX math already supported (inline $...$ and /math block command)
- Notes now opens in its own always-on-top detached window via portal - Main launcher window hides when notes opens - Window is resizable with shadow, registered in main process - Uses existing useDetachedPortalWindow pattern (same as cursor prompt)
- Placeholder "Type '/' for commands..." only shows on focused empty block - Removed Format as default primary action from footer - Fixed arrow key navigation in ActionsOverlay (moved to input onKeyDown) - ActionsOverlay renders inline instead of createPortal for detached window compat
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
/to open a command menu for inserting any block type (/heading,/todo,/bullet,/code,/divider, etc.)--text-primary,--card-bg,--kbd-bg, etc.),sc-back-button,ExtensionActionFooterwith Actions on bottom-right, glass-effect themeKey features
#→ heading,-→ bullet,- [ ]→ checkbox,>→ blockquote,---→ dividerTest plan
/and verify slash command menu appears with all block types#at start of paragraph and verify it converts to Heading 1- [ ]and verify checkbox block appears; click to toggle