babylonlabs-io / babylonlabs-io/babylonlabs.github.io
Feature request: copy tables as Markdown or CSV
- Dominant language
- TypeScript
- Stars
- 5
- Forks
- 10
- Avg merge
- 3d 1h
- Merged PRs (30d)
- 1
Description
# Summary
Add a copy control to every documentation table. The control lets a reader copy the table content in two formats:
- **Copy as Markdown** — copies a GitHub-flavored Markdown table.
- **Copy as CSV** — copies comma-separated values with a header row.
# Motivation
Readers often move table content into notes, spreadsheets, tickets, or AI chat tools. Today they must select the rendered HTML table by hand. The result loses structure and needs manual cleanup. A one-click copy in Markdown or CSV removes this friction.
# Proposed behavior
## Desktop
- Show the copy control when the mouse hovers over a table.
- The control shows the two format options: **Copy as Markdown** and **Copy as CSV**.
- Hide the control when the mouse leaves the table.
## Mobile
- Hover does not exist on touch devices. Show the control when the reader taps the table.
- The two format options appear the same way as on desktop.
## Shared behavior
- The copied Markdown must render correctly when pasted into GitHub, Notion, or a Markdown editor.
- The CSV output must escape commas, quotes, and line breaks inside cells.
- Show short feedback after the copy (for example, a "Copied" state), consistent with the existing code-block copy button.
- The control must work for every table on the site, including tables inside fetched remote docs (`RemoteMD` content in `static/remote-docs/`).
- The control must respect light and dark themes.
# Implementation notes (non-binding)
- Docusaurus supports swizzling the MDX `table` component (`@theme/MDXComponents`), which covers MDX-authored tables.
- Tables rendered from remote docs arrive as pre-converted HTML, so a client-side enhancement (attach the control to every `` after render) may cover both cases with one code path.
- Conversion can read the DOM directly: header cells become the Markdown header row / CSV header, `` text becomes cell values. Strip inline markup or convert simple inline code/links sensibly.
- Use the async Clipboard API with a fallback.
# Acceptance criteria
- [ ] Hover on a table shows the copy control on desktop.
- [ ] Tap on a table shows the copy control on mobile.
- [ ] "Copy as Markdown" puts a valid Markdown table on the clipboard.
- [ ] "Copy as CSV" puts valid CSV on the clipboard.
- [ ] Works on MDX tables and on remote-doc tables.
- [ ] Works in light and dark themes.
Contributor guide
No contributing guide indexed for this repository
Research direction
Start by locating the swizzled @theme/MDXComponents table handling, the existing code-block copy button, and the RemoteMD content under static/remote-docs/. Trace how tables appear after rendering, then verify that both formats copy valid content for MDX and remote-doc tables, with responsive controls, feedback, and light/dark theme support.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- documentation, frontend
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100