mirror of
https://github.com/backnotprop/plannotator.git
synced 2026-09-14 14:17:26 +08:00
feat/opencode2-native-commands
5 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 Michael Ramos
|
e181b824cc |
Mobile-safe plan and code comment composition (#1297)
* feat: harden mobile comment composition * fix(ui): keep mobile app inside Safari viewport * docs: record physical mobile triage * fix(ui): extend plan canvas behind Safari controls * fix(ui): let mobile plans drive Safari chrome * fix(ui): release Safari top edge on mobile plans * docs: triage mobile feedback and close phase 1b * fix(ui): harden compact touch behavior |
||
|
Mehdi
|
696bf1f24e | fix(vim): preserve plan position on refocus (#1252) | ||
|
Michael Ramos
|
c08b188812 |
perf(ui): single Shiki highlighter, palette-matched code blocks, drop highlight.js (#1218)
* perf(build): stub out the dead Oniguruma WASM in every bundle
@pierre/diffs picks its Shiki engine with a runtime ternary:
engine: preferredHighlighter === "shiki-wasm"
? createOnigurumaEngine(import("shiki/wasm"))
: createJavaScriptRegexEngine()
Plannotator pins `preferredHighlighter: 'shiki-js'` (and Pierre's own
default is 'shiki-js'), so the Oniguruma branch never executes. Because
the choice is a runtime ternary, bundlers keep the `import("shiki/wasm")`
edge anyway and inline `@shikijs/engine-oniguruma/wasm-inlined`, a
~622 KB base64 blob, into the single-file HTML builds. The review app
paid for it twice: once on the main thread (via
`highlighter/shared_highlighter.js`) and once inside the `?worker&inline`
Pierre worker.
Alias `shiki/wasm` to a stub that throws if it is ever reached. Wired via
`resolve.alias` rather than a plugin because `resolve.alias` is shared
with Vite's worker build and `plugins` are not.
Highlighting output is unchanged: the JS regex engine was already the one
doing the work. Opting back into 'shiki-wasm' now fails loudly instead of
silently costing every user a megabyte of dead bytes.
apps/review/dist/index.html 19,424,646 -> 18,180,545 (-1,244,101 raw / -463,348 gzip)
apps/hook/dist/index.html 23,032,467 -> 22,410,416 (-622,051 raw / -233,485 gzip)
* perf(ui): consolidate code highlighting onto Shiki, drop highlight.js
The app shipped two highlighters. Shiki already tokenised the code-review
diff pane (via @pierre/diffs, JavaScript regex engine); highlight.js
separately coloured markdown fences and review suggestion snippets at
~982 KB minified for a full build of ~190 grammars. That second
highlighter is now gone.
Every call site moves onto `packages/ui/utils/codeHighlight.ts`, a thin
wrapper over Pierre's SHARED Shiki instance:
CodeBlock, Viewer, PlanCleanDiffView markdown fences
InlineMarkdown code-file hover preview
HighlightedCode review suggestion snippets
Reusing Pierre's instance rather than standing up a second fine-grained
one is deliberate. Pierre imports Shiki's full bundle, so every grammar
and theme is ALREADY inlined in the single-file builds: a separate
highlighter with a curated language list would have duplicated a subset
of bytes that are already there. Sharing costs nothing, gives every
language Shiki bundles instead of a shortlist, and — the point of the
change — guarantees fences resolve the exact same theme the diff pane
resolves.
Theming. `SHIKI_THEME_MAP` / `resolveSyntaxTheme` move from
`packages/review-editor/hooks/usePierreTheme.ts` to
`packages/ui/utils/syntaxTheme.ts`; usePierreTheme re-exports them, so
the review editor's imports are unchanged. `useFenceTheme()` feeds the
components and re-highlights on palette or mode change. Code blocks now
follow the active palette across all ~52 themes in both light and dark,
instead of always rendering github-dark and relying on hand-written
`.hljs-*` override stacks to stay legible. Those stacks are deleted:
`packages/editor/index.css`'s light-mode token palette, and
`colorblind.css`'s hand-tuned tokens which existed to APPROXIMATE
@pierre/theme's protanopia-deuteranopia themes that are now simply used.
Behaviour held fixed:
- Language-less fences stay plain text (#1212). No auto-detection
anywhere, including the hover preview, which previously called
`hljs.highlightAuto`. `HighlightedCode` derives its language from
the caller's file path; an unknown extension renders plain.
- `applyHighlight(el, ...)` keeps the imperative `hljs.highlightElement`
DOM contract the annotation layer reaches into, and writes plain text
at final size first so async highlighting causes no layout shift.
Already-attached grammars highlight synchronously — no flicker on
cached highlights.
- It also verifies the rendered text is byte-identical to the source
and falls back to plain otherwise, because annotations address code
blocks by text offset.
- `@plannotator/ui`'s public API is unchanged: the highlighter is a
module-level default like the package's other seams, no new props.
The `hljs` class on fenced `<code>` becomes `pn-code` (it is a
structural hook for blockTargeting, vim navigation and print.css, and it
named a library we no longer ship). `language-*` stays.
apps/review/dist/index.html 18,180,545 -> 17,270,889 (-909,656 raw / -291,921 gzip)
apps/hook/dist/index.html 22,410,416 -> 21,704,434 (-705,982 raw / -238,096 gzip)
Verified the diff pane is untouched: the rendered Pierre shadow-DOM
markup is byte-for-byte identical between an origin/main build and this
one (SHA-256 aa1ee88a…).
* fix(ui): strip stray NUL bytes from the code-highlight source
Two U+0000 bytes slipped into comments in the previous commit, which made
git treat the file as binary. Replaced with spaces; no behaviour change.
* fix(ui): keep code-block annotation marks across highlight swaps
Fenced code is annotated by hand: one `<mark data-bind-id>` inside the
`<code>` element, which `applyHighlight` also owns. Every highlight swap
(palette change, dark/light toggle, or the first async grammar attach
after load) replaces that element's children, so the mark was silently
wiped and nothing put it back. Annotation state, the sidebar panel and
exports were unaffected; the loss was purely visual, and deterministic.
`applyHighlight` now publishes every write through `onCodeHighlightSwap`,
synchronously, immediately after it. `Viewer` subscribes and re-paints the
fence's mark, so a swapped block ends up with BOTH the new theme's tokens
and its annotation. The shared painter (`paintCodeBlockMark`) moves the
token spans into the mark instead of flattening them to text, so creating
an annotation no longer costs a block its colours either.
Being driven by the swap also fixes the cousin race by ordering rather
than timing: share/draft restore runs on a timer after load, and on a slow
machine the first async swap could land after it and wipe the restored
marks per block. A restore that painted before the swap is now
re-established in the same task the swap ran in, and one that runs after
finds the mark already there.
Removal tombstones the id before re-highlighting, because the host drops
the annotation from state a tick later — without it the swap listener
would paint the just-removed annotation back in, and a fence carrying a
second annotation would end up bare.
Also closes the named gap in the WASM coverage: entry-assets only grepped
source, so a future @pierre/diffs bump could reintroduce the inlined blob
through a different import specifier unnoticed. It now greps the built
`apps/{review,hook}/dist/index.html` for the base64 WASM magic, skipping
on an unbuilt checkout and running for real in the CI job that builds the
bundles.
|
||
|
Michael Ramos
|
47157e7a55 |
feat(editor): add Vim keyboard annotation controls and live HUD (#1127)
* feat(editor): add Vim keyboard annotation controls * feat(ui): add optional live Vim HUD * feat(ui): finish Vim HUD experience * feat(ui): promote Vim to dedicated settings panel * feat(ui): make Vim document focus automatic * feat(ui): let Vim HUD hide its key panel * fix(ui): harden Vim selection UX |
||
|
Michael Ramos
|
2739660fa6 |
feat: pinpoint mode for point-and-click annotations (#232)
* feat: add pinpoint mode for point-and-click annotations Adds a new input method toggle (Drag / Pinpoint) orthogonal to the existing annotation action modes (Selection / Comment / Redline). In pinpoint mode, hovering over blocks and inline elements shows a dashed outline with a label tooltip. Clicking auto-selects the element's text via highlighter.fromRange(), firing the same CREATE event as drag-selection — all downstream annotation flow is unchanged. New files: - blockTargeting.ts: resolves hover targets (inlines, cells, list items, blocks) - usePinpoint.ts: hover/click state machine with text-range bridge - PinpointOverlay.tsx: dashed outline + label badge - InputMethodToggle.tsx: Drag/Pinpoint segmented toggle - inputMethod.ts: cookie-based persistence Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * feat: unified AnnotationToolstrip with smooth animations Merge InputMethodToggle + ModeSwitcher into a single compact toolbar with two pill groups: input method (Select/Pinpoint) and action mode (Markup/Comment/Redline). Buttons expand to show labels on hover/active with explicit pixel-width transitions. Suppress transitions on mount to prevent initial flash. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * feat: keyboard shortcuts tab and settings reorganization Add Shortcuts tab to settings with OS-aware key cap styling and organized shortcut groups. Move Obsidian and Bear integrations to dedicated tabs under an Integrations sidebar group, leaving compact navigation links on the Saving tab. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * feat: Alt/Option key to switch between Select and Pinpoint Hold Alt to temporarily switch input method (reverts on release). Double-tap Alt to permanently toggle. Added to keyboard shortcuts panel in settings. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: remove md:py-8 to use consistent py-3 padding Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: toolbar polish — icon swap, full opacity active states, styling Move text-bracket icon to Select, pencil to Markup. Active buttons use full opacity backgrounds with contrasting foreground. Help link lowercase with updated styling. Revert md:py-8 padding. Add gap between buttons in pill groups. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix: match toolbar button sizing to main branch Use text-xs (12px) and px-2.5 padding to match main branch button rendering. Active state uses bg-background with no color tint. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * feat: smarter pinpoint hover — edge-zone tables, row targeting, list groups Table edge-zone detection: top/bottom edges target whole table, left/right edges target the specific row, interior targets individual cells. List group wrappers create hover zones in gaps between consecutive list items. Demo plan now includes sample tables for testing. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * chore: remove unused InputMethodToggle component Superseded by AnnotationToolstrip which unified input method + mode switching. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * chore: remove unimplemented S3 paste store stub Never used — paste service runs on Cloudflare KV and local FS. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * chore: remove dead ModeSwitcher component Replaced by AnnotationToolstrip which unified mode switching + input method toggle. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> |