markstream-custom-components

Override Markstream renderers with scoped custom components for nodes.

2.9k|175|Updated May 22, 2025
One-click install
npx skills add https://github.com/Simon-He95/markstream-vue --skill markstream-custom-components
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: markstream-custom-components
Source: https://github.com/Simon-He95/markstream-vue/tree/main/.agents/skills/markstream-custom-components
Command: npx skills add https://github.com/Simon-He95/markstream-vue --skill markstream-custom-components

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill enables developers to tailor how Markstream renders content by supplying scoped overrides and trusted custom tags, preventing global changes to core rendering behavior.

Core Features & Use Cases

  • Override built-in renderers such as image, link, code_block, mermaid, d2, infographic, and inline_code with project-scoped mappings.
  • Add supported custom HTML-like tags (trusted tags) and render inner Markdown via nested renderers for complex content.
  • Use with setCustomComponents(customId, mapping) to keep overrides isolated and removable with removeCustomComponents(customId).

Quick Start

Override Markstream renderers with a scoped, trusted-tag aware component map for your project.

Frequently Asked Questions about markstream-custom-components

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I customize Markdown rendering for specific components like images and code blocks without affecting global behavior?

You can customize Markdown rendering by applying scoped overrides to Markstream renderers using setCustomComponents(customId, mapping). This isolates changes to image, link, code_block, and other node types, preventing global modifications to core rendering behavior.

Can I render nested Markdown content inside custom trusted HTML tags?

Yes, Markstream supports trusted custom tags that render inner Markdown via nested renderers. This allows complex content structures to be processed while preserving node context across the entire rendering pipeline.

What is the best way to scope custom renderer overrides so they can be removed later?

The best way to scope renderer overrides is using setCustomComponents(customId, mapping) with a unique identifier. When the scope ends, you call removeCustomComponents(customId) to clean up and remove the applied mappings cleanly.

Does Markstream support overriding diagram and visualization renderers like mermaid and d2?

Yes, Markstream supports overriding renderers for mermaid, d2, and infographic nodes. You can map these keys in your custom component configuration to tailor how visual and diagram content is displayed per project.

How do I preserve node context when applying custom rendering overrides?

Markstream preserves node context across renders when applying custom component overrides. This ensures that scoped mappings for image, link, code_block, or inline_code maintain their original context throughout the nested rendering process.

What are the limitations of using scoped custom components for Markdown rendering?

Scoped custom components are limited to supported override keys like image, link, code_block, mermaid, d2, infographic, and inline_code. Overrides require manual cleanup via removeCustomComponents(customId) to prevent stale mappings from persisting beyond their intended scope.