Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add MarcSkovMadsen/holoviz-mcp --skill panel-custom-componentsgit clone --depth 1 https://github.com/MarcSkovMadsen/holoviz-mcpWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/marcskovmadsen/holoviz-mcp/panel-custom-components)<a href="https://agentmods.dev/skills/marcskovmadsen/holoviz-mcp/panel-custom-components"><img src="https://agentmods.dev/badge/skills/marcskovmadsen/holoviz-mcp/panel-custom-components/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/marcskovmadsen/holoviz-mcp/panel-custom-components"><img src="https://agentmods.dev/badge/skills/marcskovmadsen/holoviz-mcp/panel-custom-components.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector warn
SkillSpector: 1 finding, up to high
These are SkillSpector’s own severities. On a checked sample its high-severity flags on skills were ~96% false positives — a documented command, a public API, a “never do X” rule — so we show them as a caution to read, not a verdict. Why →
- high Memory Poisoning · line 1149 Skill manipulates agent memory, state, or stored context. Memory corruption can alter personality, override safety rules, or cause unpredictable behavior.Fix: Protect agent memory and state from modification by untrusted content. Use read-only memory for critical instructions and validate all state changes.
What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00083 | $0.10932 |
| Opus 5 | $0.00042 | $0.05466 |
| Sonnet 5 | $0.00017 | $0.02186 |
| Haiku 4.5 | $0.00008 | $0.01093 |
Grade A, and why
panel-custom-components scanned grade A with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Makes network callslowCapability
Not a fault in itself. Listed so you know the mod talks to something, and to what.
const data = await fetch(model.data_url).then(r => r.json()); How it starts
The opening of the file, as written. The whole thing — 1,645 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Panel Custom Components
This skill covers building custom Panel components that bridge Python and JavaScript. Use it when you need to:
- Wrap JavaScript libraries (D3, Leaflet, Chart.js, etc.)
- Create interactive widgets with custom UI behavior
- Create Material UI themed components for
panel-material-uiapps
Prerequisites: Solid JavaScript and React knowledge assumed.
1. Decision Guide - Which Component Type to Use
Comparison Table
| Criteria | JSComponent | ReactComponent | AnyWidgetComponent | MaterialUIComponent |
|---|---|---|---|---|
| Best For | Vanilla JS libs, Web Components, D3, Leaflet, simple widgets | React ecosystem, complex state, MUI/Chakra libs | Cross-platform (Jupyter+Panel), community sharing | panel-material-ui apps, MUI theming |
| JS Pattern | DOM manipulation | React/JSX | AnyWidget AFM spec | React/JSX + MUI |
| State Sync | model.on('param', cb) |
model.useState("param") |
model.get/set/save_changes |
model.useState("param") |
| Export | export function render({model, el}) |
export function render({model, el}) |
export default { render } |
export function render({model, el}) |
| Base Import | panel.custom.JSComponent |
panel.custom.ReactComponent |
panel.custom.AnyWidgetComponent |
panel_material_ui.MaterialUIComponent |
Decision Flow
┌─────────────────────────────────────────────────────────────────┐
│ Need Material UI theming / using panel-material-ui? │
│ YES → MaterialUIComponent │
│ NO ↓ │
├─────────────────────────────────────────────────────────────────┤
│ Need Jupyter compatibility / sharing community widgets? │
│ YES → AnyWidgetComponent │
│ NO ↓ │
├─────────────────────────────────────────────────────────────────┤
│ Using React libraries or need complex state management? │
│ YES → ReactComponent │
│ NO ↓ │
├─────────────────────────────────────────────────────────────────┤
│ Vanilla JS, Web Components, or simple DOM manipulation? │
│ YES → JSComponent │
└─────────────────────────────────────────────────────────────────┘
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 10d ago First seen · 1,645 lines · 83 tokens per session scan A 05da19b5154a
panel-custom-components is a skill published in the GitHub repository MarcSkovMadsen/holoviz-mcp (34 stars, last pushed 9d ago), licensed BSD-3-Clause. It adds 83 tokens to every session and 10,932 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it A with 1 finding (makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
dataviz-mcp
Show Python visualizations live in the browser with the dataviz-mcp MCP tools (show, screenshot). Use when those tools are available and the user asks to display, plot, chart, or visualize anything. Do not use for apps the user serves themselves with panel serve.
build-with-tinybase
Scaffold, extend, and verify reactive local-first JavaScript or TypeScript applications with TinyBase. Use when choosing TinyBase for in-memory tabular or key-value state, generating an app with create-tinybase, adding schemas or UI bindings, configuring browser or database persistence, configuring MergeableStore…
portaljs-add-map
Render a GeoJSON dataset on an interactive Leaflet map in the Views section of a dataset's showcase. Installs react-leaflet and a Map component, then renders the map for the chosen dataset. Use when a dataset's data is geographic and a map view is needed alongside the showcase's default metadata and download.
portaljs-add-chart
Add a chart (line, bar, area, pie, or scatter) to a dataset's showcase in a PortalJS portal. Installs recharts, writes a reusable Chart component, and renders it in the showcase Views section. Use when visualizing a dataset already registered in datasets.json.
malloy-html-data-apps
Build or modify an in-package HTML data app for a Malloy Publisher package (a public/ directory the package serves). Use when the user wants a hand-authored HTML dashboard or web page backed by a package's Malloy models, with no build step.
reimagine-it-extract
Emit the content signals reimagine-it reads from an HTML file — title, anchors, proper nouns, dates, numbers, emails, links, source hex colors, and the derived palette — as JSON without generating a redesign. Use when the user says /reimagine-it extract, "what does the engine see in this page", "extract the palette"…