Skip to content

feat(packages/ui): add rspress rendering plugins#47

Merged
zrosenbauer merged 4 commits intomainfrom
feature/full-support
Mar 18, 2026
Merged

feat(packages/ui): add rspress rendering plugins#47
zrosenbauer merged 4 commits intomainfrom
feature/full-support

Conversation

@zrosenbauer
Copy link
Member

@zrosenbauer zrosenbauer commented Mar 18, 2026

Summary

  • Add four Rspress plugins to @zpress/ui for full markdown rendering support:
    • rspress-plugin-mermaid — renders ```mermaid diagrams (flowcharts, sequence, ER)
    • rspress-plugin-file-tree — renders ```tree blocks as interactive collapsible trees
    • rspress-plugin-supersub^superscript^ / ~subscript~ syntax
    • rspress-plugin-katex$inline$ / $$block$$ math formulas via KaTeX
  • Update diagram documentation standards to reflect the new plugins and tree block syntax

Changes

  • packages/ui/src/config.ts — import and register all four plugins
  • packages/ui/package.json — add plugin dependencies
  • contributing/standards/documentation/diagrams.md — add "Rendering Plugins" section, update file tree guidance to use ```tree blocks, add plugin links to Resources

Test plan

  • pnpm typecheck passes (16/16 tasks)
  • pnpm test passes in packages/ui (9/9 tests)
  • Verify mermaid diagrams render on dev server
  • Verify ```tree blocks render as collapsible trees
  • Verify $math$ and ^super^/~sub~ render correctly

Summary by CodeRabbit

  • New Features

    • Added rendering plugins for Mermaid diagrams, file trees, KaTeX mathematical formulas, and superscript/subscript notation.
  • Documentation

    • Updated documentation standards for file trees, replacing ASCII-based formatting with Tree Blocks.
    • Expanded guidance on rendering plugins with examples and external resources.

…ees, math, and supersub

Register rspress-plugin-mermaid, rspress-plugin-file-tree,
rspress-plugin-katex, and rspress-plugin-supersub in the Rspress
config so that markdown code blocks and syntax render correctly
on the built site.

Co-Authored-By: Claude <noreply@anthropic.com>
@changeset-bot
Copy link

changeset-bot bot commented Mar 18, 2026

🦋 Changeset detected

Latest commit: f0a5076

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages
Name Type
@zpress/ui Minor
@zpress/cli Patch
@zpress/kit Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@coderabbitai
Copy link

coderabbitai bot commented Mar 18, 2026

Warning

Rate limit exceeded

@zrosenbauer has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 1 minutes and 27 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: f94d076c-e8a7-49d1-ba7e-d84d2cc12319

📥 Commits

Reviewing files that changed from the base of the PR and between 622afad and f0a5076.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (3)
  • contributing/standards/documentation/diagrams.md
  • package.json
  • patches/rspress-plugin-devkit@1.0.0.patch
📝 Walkthrough

Walkthrough

This PR adds Rspress rendering plugins (mermaid, file-tree, KaTeX, and superscript/subscript) to the @zpress/ui package. It updates the Rspress configuration to include these plugins, adds corresponding dependencies, and updates documentation to reflect the new rendering capabilities.

Changes

Cohort / File(s) Summary
Plugin Registration
packages/ui/package.json, packages/ui/src/config.ts
Added four Rspress plugin dependencies (mermaid, file-tree, KaTeX, superscript/subscript) to package.json and registered each plugin in the Rspress configuration with mermaid() and fileTree() receiving specific options.
Documentation & Changelog
.changeset/add-rspress-plugins.md, contributing/standards/documentation/diagrams.md
Added changeset documenting minor version bump for @zpress/ui. Updated diagrams documentation to replace ASCII-based file trees with Tree Blocks, introduced a Rendering Plugins section with plugin table and syntax guidance, and expanded rendering references.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

Possibly related PRs

  • joggrdocs/zpress#1: Modifies packages/ui/src/config.ts to extend Rspress configuration with additional settings.

Poem

🐰 With mermaid dreams and formulas fair,
Tree blocks flourish everywhere,
Plugins dance in configs bright,
Rendering magic, oh what a sight! ✨

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately and specifically describes the main change: adding Rspress rendering plugins to the packages/ui package.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feature/full-support
📝 Coding Plan
  • Generate coding plan for human review comments

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
contributing/standards/documentation/diagrams.md (1)

29-29: ⚠️ Potential issue | 🟡 Minor

Minor inconsistency: table still references "ASCII".

The diagram type table on line 29 still lists "File tree (ASCII)" but the guidance now recommends using ```tree blocks (which are not ASCII diagrams but plugin-rendered components). Consider updating this to "File tree (Tree block)" for consistency with the renamed section.

📝 Suggested fix
-| Directory layouts                            | File tree (ASCII) | Repository structure                    |
+| Directory layouts                            | File tree (Tree block) | Repository structure                    |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@contributing/standards/documentation/diagrams.md` at line 29, Update the
table header entry that currently reads "File tree (ASCII)" to "File tree (Tree
block)" so the "Directory layouts | File tree (ASCII) | Repository structure"
row matches the renamed section; edit the table cell text to "File tree (Tree
block)" wherever that table row appears to keep terminology consistent.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Outside diff comments:
In `@contributing/standards/documentation/diagrams.md`:
- Line 29: Update the table header entry that currently reads "File tree
(ASCII)" to "File tree (Tree block)" so the "Directory layouts | File tree
(ASCII) | Repository structure" row matches the renamed section; edit the table
cell text to "File tree (Tree block)" wherever that table row appears to keep
terminology consistent.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: c4958db8-15b8-484a-b16b-fdde3ba080f1

📥 Commits

Reviewing files that changed from the base of the PR and between 62248ba and 622afad.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (4)
  • .changeset/add-rspress-plugins.md
  • contributing/standards/documentation/diagrams.md
  • packages/ui/package.json
  • packages/ui/src/config.ts

zrosenbauer and others added 2 commits March 18, 2026 17:25
Co-Authored-By: Claude <noreply@anthropic.com>
rspress-plugin-devkit@1.0.0 ships as ESM ("type": "module") but its
internal imports omit .js extensions, which Node.js ESM resolution
rejects. Patch all relative imports to include explicit .js extensions.

Co-Authored-By: Claude <noreply@anthropic.com>
@zrosenbauer zrosenbauer merged commit d8cf9b2 into main Mar 18, 2026
3 checks passed
@zrosenbauer zrosenbauer deleted the feature/full-support branch March 18, 2026 23:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant