Files
colanode/apps
Ylber Gashi 2cd02255c7 Mobile: keyboard avoidance and toolbar for page editor WebView (#347)
Add keyboard tracking, automatic content scrolling, and a native toolbar with block type selection for the page editor. The toolbar appears above the keyboard with "+" button for block types and a dismiss button. Keyboard height is tracked via native events and communicated to the WebView for cursor scroll-into-view. Block type selection is inline (not modal) to prevent keyboard dismissal during interaction.

- Track keyboard height in page screen with iOS/Android event listeners
- Use KeyboardAvoidingView for proper layout when keyboard is visible
- Add toolbar component with "+" (block types) and dismiss buttons
- Implement inline block type selector (no modal to preserve keyboard)
- Extend bridge protocol: keyboard.show/hide, editor.blur, block.command, editor.focus
- Handle block command execution in WebView with correct TipTap node commands
- Expose editor instance on window.__editorInstance for command execution
- Add focus/blur callbacks to notify native of editor state
- Send cursor position to scroll-into-view when keyboard shows
- Increase ProseMirror padding-bottom from 40vh to 60vh for comfortable scrolling
- Remove focus-restoration script that prevented cursor following

Co-authored-by: Claude Haiku 4.5 <noreply@anthropic.com>
2026-03-15 23:18:11 +01:00
..