anomalyco/opencode
1
0
Fork 0
mirror of https://github.com/anomalyco/opencode.git synced 2026-07-22 02:05:26 -04:00
Code Issues 5.9k Packages Projects Releases 19 Wiki Activity

Feature: Markdown preview toggle for README files #7199

New Issue
Closed
opened 2026-02-16 18:06:26 -05:00 by yindo · 2 comments
yindo commented 2026-02-16 18:06:26 -05:00
Owner
Copy Link
Copy Source

Originally created by @kyashrathore on GitHub (Jan 22, 2026).

Originally assigned to: @thdxr on GitHub.

Summary

Add the ability to open a rendered markdown preview in a new tab when viewing .md or .mdx files.

Motivation

When working with documentation files, it's useful to see how the rendered markdown will look without leaving OpenCode. This is especially helpful for reviewing README files, documentation, and other markdown content.

Proposed UX

Preview Button

When a markdown file (.md or .mdx) is the active tab, show an eye icon button in the header toolbar area (far right, separate from file tabs). This follows VS Code's pattern where editor actions appear in the top-right header area, separate from the tab bar.

┌─────────────────────────────────────────────────────────────────┐
│ [README.md] [config.ts]                              [👁]       │
├─────────────────────────────────────────────────────────────────┤
│ # Project Title                                                 │
│                                                                 │
│ ```bash                                                         │
│ npm install                                                     │
│ ```                                                             │
└─────────────────────────────────────────────────────────────────┘
  • Button only appears when a markdown file is active
  • Clicking opens rendered preview in a new tab

Keyboard Shortcut

Cmd+Shift+V (Mac) / Ctrl+Shift+V (Windows/Linux) opens preview in new tab - matching VS Code conventions.

Preview Tab Behavior

  • Opens as a new tab named Preview: README.md
  • Renders markdown using existing Markdown component
  • Read-only view (no line selection - that's only available in source view)
  • Closing the preview tab returns focus to source

Why Preview Opens in New Tab (Not Toggle)

Line selection for prompts only works in source view - the rendered HTML doesn't maintain source line mappings. Opening preview in a separate tab keeps source available for line selection while allowing preview for reading.

Current State

  • Markdown component exists in packages/ui/src/components/markdown.tsx
  • Uses marked library with DOMPurify sanitization
  • No preview mechanism currently exists

Implementation Notes

  • Add preview button to header toolbar (conditionally shown for markdown files)
  • Create special "preview" tab type that renders via Markdown component
  • Register mod+shift+v keyboard shortcut
Originally created by @kyashrathore on GitHub (Jan 22, 2026). Originally assigned to: @thdxr on GitHub. ## Summary Add the ability to open a rendered markdown preview in a new tab when viewing `.md` or `.mdx` files. ## Motivation When working with documentation files, it's useful to see how the rendered markdown will look without leaving OpenCode. This is especially helpful for reviewing README files, documentation, and other markdown content. ## Proposed UX ### Preview Button When a markdown file (`.md` or `.mdx`) is the active tab, show an eye icon button in the header toolbar area (far right, separate from file tabs). This follows VS Code's pattern where editor actions appear in the top-right header area, separate from the tab bar. ``` ┌─────────────────────────────────────────────────────────────────┐ │ [README.md] [config.ts] [👁] │ ├─────────────────────────────────────────────────────────────────┤ │ # Project Title │ │ │ │ ```bash │ │ npm install │ │ ``` │ └─────────────────────────────────────────────────────────────────┘ ``` - Button only appears when a markdown file is active - Clicking opens rendered preview in a **new tab** ### Keyboard Shortcut `Cmd+Shift+V` (Mac) / `Ctrl+Shift+V` (Windows/Linux) opens preview in new tab - matching VS Code conventions. ### Preview Tab Behavior - Opens as a new tab named `Preview: README.md` - Renders markdown using existing `Markdown` component - Read-only view (no line selection - that's only available in source view) - Closing the preview tab returns focus to source ## Why Preview Opens in New Tab (Not Toggle) Line selection for prompts only works in source view - the rendered HTML doesn't maintain source line mappings. Opening preview in a separate tab keeps source available for line selection while allowing preview for reading. ## Current State - `Markdown` component exists in `packages/ui/src/components/markdown.tsx` - Uses `marked` library with DOMPurify sanitization - No preview mechanism currently exists ## Implementation Notes - Add preview button to header toolbar (conditionally shown for markdown files) - Create special "preview" tab type that renders via `Markdown` component - Register `mod+shift+v` keyboard shortcut
yindo closed this issue 2026-02-16 18:06:26 -05:00
yindo commented 2026-02-16 18:06:26 -05:00
Author
Owner
Copy Link
Copy Source

@github-actions[bot] commented on GitHub (Jan 22, 2026):

For keybind-related issues, please also check our pinned keybinds documentation: #4997

@github-actions[bot] commented on GitHub (Jan 22, 2026): For keybind-related issues, please also check our pinned keybinds documentation: #4997
yindo commented 2026-02-16 18:06:26 -05:00
Author
Owner
Copy Link
Copy Source

@kyashrathore commented on GitHub (Jan 23, 2026):

Feature support available now.

@kyashrathore commented on GitHub (Jan 23, 2026): Feature support available now.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
acp
bad
bug
discussion
docs
documentation
enhancement
extension
good first issue
growth
help-wanted
mcp
model-problem
needs:compliance
nix
opentui
perf
pull-request
Mirrored from GitHub Pull Request
 tui
web
windows
zen
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
yindo
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: anomalyco/opencode#7199
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?