Support code-folding for large code blocks / multi-file code snippets
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 13k
- Forks
- 1.4k
- Avg merge
- 15h 36m
- Merged PRs (30d)
- 3
Description
What’s the request
Add optional support for code-folding / collapse-expand in PrismJS for large code blocks or multi-file code snippets.
Motivation / Why this is useful
For long code blocks (e.g. 200+ lines) or when embedding multiple files in a single page, scrolling becomes cumbersome and readability suffers.
Code-folding would help maintain clean layout and improve usability when viewing big code samples (especially for documentation, tutorials, or code reviews).
Many other syntax-highlighters support folding — adding it to PrismJS would make it more feature-rich and user-friendly.
What I propose / Feature details
Provide an optional plugin or built-in mechanism to allow folding of code blocks: by default collapsed (first few lines visible), with toggle to expand.
Support collapse per block — not mandatory: user/developer must opt-in (e.g. via data-attribute or config) so it doesn’t break lightweight usage for small snippets.
Ensure that syntax highlighting still works correctly when folded/unfolded, and that HTML output remains valid (colors, line numbers, etc.).
Additional context / Use-cases
Useful for documentation sites, blogs, tutorials where large code examples are common.
Helpful when embedding multiple code examples on one page.
Could optionally integrate with existing Prism plugins (if feasible) or be developed as a new plugin to maintain modularity.
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reviewing Prism’s existing plugins and the highlighting and line-number behavior for large or multi-file code blocks. Define an opt-in folding mechanism, then verify that collapse and expand preserve syntax highlighting, valid HTML output, and per-block behavior without affecting small snippets.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100