* chore: remove non-critical welcome dialogs
Remove UI Features Setup, Plan Diff Marketing, and What's New v0.11.0
dialogs from the first-run cascade. Only the Permission Mode Setup
dialog remains as it's the only one that affects agent behavior.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* refactor: extract demo plan content to separate file
Moves the 334-line PLAN_CONTENT string from App.tsx to demoPlan.ts to reduce clutter.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---------
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add mobile compatibility
- Add responsive hamburger menu with all header actions (MobileMenu)
- Annotation panel renders as full-screen overlay on mobile with backdrop and close button
- Panel starts closed on mobile (<768px)
- Touch support for resize handles, pinpoint annotations, and toolstrip buttons
- Mobile text selection creates annotations via highlighter.fromRange() bridge
- Card action buttons always visible on touch devices (hover:none media query)
- Settings modal uses horizontal tab bar on mobile
- CommentPopover width capped to viewport on small screens
- Replace mousedown with pointerdown for touch-compatible click-outside handling
- Add useIsMobile reactive hook for breakpoint detection
- Desktop layout (>=768px) unchanged
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* fix: mobile layout polish — panel gap, button overlap, responsive labels
- AnnotationPanel: fix bottom gap on mobile overlay (inset-y-12 → top-12 bottom-0)
- Viewer: push in-plan action buttons below badges on mobile (mt-6), add
clear-right before frontmatter, show short labels (Comment/Copy) on mobile
- App: reduce mobile horizontal padding to 8px (px-2)
- test-hook.sh: build review before hook to fix missing dist error
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add plan width display setting with compact/default/wide options
Adds a configurable plan width preference (compact 832px, default 1040px,
wide 1280px) with an abstract layout preview in Settings. Dynamic max-width
flows through to Viewer, PlanDiffViewer, and the toolstrip. Default is
compact to preserve existing behavior.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---------
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
Co-authored-by: Michael Ramos <mdramos8@gmail.com>
One-time dialog introduces Table of Contents and Sticky Actions to
new and existing users. Sequences after Permission Mode Setup dialog
if both need to show, uses cookie-based detection to avoid repeat.
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
* feat: Add Table of Contents sidebar with sticky action buttons
- Add hierarchical Table of Contents component with clickable navigation
- Implement useActiveSection hook for real-time section highlighting
- Add annotationHelpers utility for block identification
- Make Images, Global comment, and Copy plan buttons sticky during scroll
- Fix navigation scrolling to work within scrollable main container
* fix: Correct typo in opencode.json (CALUDE -> CLAUDE)
* docs: Update testing documentation - separate UI tests from integration/utility tests
* fix(ui): prevent code block annotation from breaking syntax highlighting
- Replace surroundContents() with plain text wrapper approach
- Add syntax highlighting restoration in removeHighlight()
- Fixes issue reported by kkharji in PR #122
The old approach used range.surroundContents() which wrapped syntax-highlighted
<span> elements, creating nested structure that broke the layout. The new approach
replaces code block innerHTML with plain text wrapped in <mark>, then restores
syntax highlighting when the annotation is removed.
Test coverage: 15 tests pass with edge cases for empty blocks, special chars,
large blocks (10k), unicode, and multiple annotation cycles.
* test(ui): add comprehensive code block annotation regression tests
- Add 15 test cases covering code block annotation behavior
- Test plain text wrapper approach vs nested span approach
- Verify syntax highlighting restoration on annotation removal
- Cover edge cases: empty blocks, special chars, large blocks, unicode
- Add happy-dom dev dependency for DOM testing
* feat: update opencode.json to include additional documentation instructions and configure Playwright MCP
* chore: stop tracking docs directory and opencode.json
* chore: move UI-TESTING.md to tests directory
* docs: extract UI testing checklist into separate file
- Move comprehensive feature checklists to UI-TESTING-CHECKLIST.md
- Keep main UI-TESTING.md focused on development workflow and setup
- Add reference link to checklist file for easy navigation
* docs: update UI testing documentation
* fix(ui): fix TOC active section tracking
IntersectionObserver was using root: null (viewport) instead of the
actual scroll container (<main>), and the effect only ran on mount
before headings were rendered. Pass the container as root and re-run
the observer when heading count changes.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* revert: remove Playwright MCP from marketplace.json and stale README links
Playwright MCP is dev tooling, not for end users. README referenced
docs/UI-TESTING.md and docs/CODE-STYLE.md which don't exist at those paths.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* style(ui): compact TOC styling and fix layout shifts
- Smaller text (text-xs) and tighter padding for compact feel
- Remove border-l-2 and font-medium from active state to prevent
layout shifts that pushed text into multiline
- Annotation count badges are now perfect circles (w-5 h-5)
- Add left padding to root-level heading
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat(ui): add optional TOC and sticky actions settings
- New uiPreferences.ts utility for cookie-based persistence
- TOC toggle: conditionally renders sidebar in App.tsx
- Sticky Actions toggle: conditionally applies sticky positioning in Viewer.tsx
- Both default to enabled, persisted via cookies
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* refactor(ui): redesign Settings dialog with sidebar navigation
Replace flat settings list with sidebar + content panel layout:
- General tab: Identity, Permission Mode, Agent Switching
- Display tab: TOC, Sticky Actions, Tater Mode
- Saving tab: Plan Saving, Obsidian, Bear Notes
- Scrollable content area (max-h-[70vh])
- Sidebar hidden in review mode (single tab)
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* fix(ui): fix sticky action bar positioning and add scroll-aware card background
Match main's button positioning across all breakpoints with responsive
margins that account for article padding. Use IntersectionObserver sentinel
to detect when the bar is stuck, revealing the card background only on scroll.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---------
Co-authored-by: Michael Ramos <mdramos8@gmail.com>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
Michael Ramos