diff --git a/.claude-plugin/marketplace.json b/.claude-plugin/marketplace.json new file mode 100644 index 0000000..2e21828 --- /dev/null +++ b/.claude-plugin/marketplace.json @@ -0,0 +1,27 @@ +{ + "name": "visual-explainer-marketplace", + "owner": { + "name": "nicobailon" + }, + "metadata": { + "description": "A marketplace for visual explainer plugins — tools that turn complex terminal output into styled HTML pages", + "version": "1.0.0", + "pluginRoot": "./plugins" + }, + "plugins": [ + { + "name": "visual-explainer", + "source": "./plugins/visual-explainer", + "description": "Generate beautiful HTML pages for diagrams, diff reviews, plan reviews, slides, and data tables", + "version": "0.5.0", + "author": { + "name": "nicobailon" + }, + "repository": "https://github.com/nicobailon/visual-explainer", + "license": "MIT", + "keywords": ["diagrams", "html", "visualization", "diff-review", "slides"], + "category": "visualization", + "tags": ["diagrams", "html-generation", "code-review", "slides", "mermaid"] + } + ] +} diff --git a/.claude-plugin/plugin.json b/.claude-plugin/plugin.json index 4c509a2..a073c95 100644 --- a/.claude-plugin/plugin.json +++ b/.claude-plugin/plugin.json @@ -1,10 +1,5 @@ { - "name": "visual-explainer", - "description": "Generate beautiful HTML pages for diagrams, diff reviews, plan reviews, and data tables", - "version": "0.5.0", - "author": { - "name": "nicobailon" - }, - "repository": "https://github.com/nicobailon/visual-explainer", - "license": "MIT" + "name": "visual-explainer-marketplace", + "description": "A marketplace for visual explainer plugins", + "version": "1.0.0" } diff --git a/README.md b/README.md index ba57abe..02d122a 100644 --- a/README.md +++ b/README.md @@ -28,18 +28,24 @@ This skill fixes that. Real typography, dark/light themes, interactive Mermaid d ## Install -**Pi:** -```bash -pi install https://github.com/nicobailon/visual-explainer +**Claude Code (marketplace):** +```shell +/plugin marketplace add nicobailon/visual-explainer +/plugin install visual-explainer@visual-explainer-marketplace ``` -**Claude Code (plugin):** +**Claude Code (direct plugin):** ```bash claude /plugin install https://github.com/nicobailon/visual-explainer ``` Note: Claude Code plugins namespace commands as `/visual-explainer:command-name`. +**Pi:** +```bash +pi install https://github.com/nicobailon/visual-explainer +``` + **OpenAI Codex:** ```bash git clone https://github.com/nicobailon/visual-explainer.git ~/.agents/skills/visual-explainer @@ -76,19 +82,28 @@ https://github.com/user-attachments/assets/342d3558-5fcf-4fb2-bc03-f0dd5b9e35dc ## How It Works ``` -SKILL.md ← workflow + design principles -commands/ ← slash commands (works with pi and Claude Code) -references/ ← agent reads before generating -├── css-patterns.md (layouts, animations, theming) -├── libraries.md (Mermaid, Chart.js, fonts) -├── responsive-nav.md (sticky TOC for multi-section pages) -└── slide-patterns.md (slide engine, transitions, presets) -templates/ ← reference templates with different palettes -├── architecture.html -├── mermaid-flowchart.html -├── data-table.html -└── slide-deck.html - ↓ +.claude-plugin/ +├── plugin.json ← marketplace identity +└── marketplace.json ← plugin catalog +plugins/ +└── visual-explainer/ + ├── .claude-plugin/ + │ └── plugin.json ← plugin manifest + ├── SKILL.md ← workflow + design principles + ├── commands/ ← slash commands + ├── references/ ← agent reads before generating + │ ├── css-patterns.md (layouts, animations, theming) + │ ├── libraries.md (Mermaid, Chart.js, fonts) + │ ├── responsive-nav.md (sticky TOC for multi-section pages) + │ └── slide-patterns.md (slide engine, transitions, presets) + ├── templates/ ← reference templates with different palettes + │ ├── architecture.html + │ ├── mermaid-flowchart.html + │ ├── data-table.html + │ └── slide-deck.html + └── scripts/ + └── share.sh + ↓ ~/.agent/diagrams/filename.html → opens in browser ``` diff --git a/plugins/visual-explainer/.claude-plugin/plugin.json b/plugins/visual-explainer/.claude-plugin/plugin.json new file mode 100644 index 0000000..4c509a2 --- /dev/null +++ b/plugins/visual-explainer/.claude-plugin/plugin.json @@ -0,0 +1,10 @@ +{ + "name": "visual-explainer", + "description": "Generate beautiful HTML pages for diagrams, diff reviews, plan reviews, and data tables", + "version": "0.5.0", + "author": { + "name": "nicobailon" + }, + "repository": "https://github.com/nicobailon/visual-explainer", + "license": "MIT" +} diff --git a/SKILL.md b/plugins/visual-explainer/SKILL.md similarity index 100% rename from SKILL.md rename to plugins/visual-explainer/SKILL.md diff --git a/commands/diff-review.md b/plugins/visual-explainer/commands/diff-review.md similarity index 100% rename from commands/diff-review.md rename to plugins/visual-explainer/commands/diff-review.md diff --git a/commands/fact-check.md b/plugins/visual-explainer/commands/fact-check.md similarity index 100% rename from commands/fact-check.md rename to plugins/visual-explainer/commands/fact-check.md diff --git a/commands/generate-slides.md b/plugins/visual-explainer/commands/generate-slides.md similarity index 100% rename from commands/generate-slides.md rename to plugins/visual-explainer/commands/generate-slides.md diff --git a/commands/generate-visual-plan.md b/plugins/visual-explainer/commands/generate-visual-plan.md similarity index 100% rename from commands/generate-visual-plan.md rename to plugins/visual-explainer/commands/generate-visual-plan.md diff --git a/commands/generate-web-diagram.md b/plugins/visual-explainer/commands/generate-web-diagram.md similarity index 100% rename from commands/generate-web-diagram.md rename to plugins/visual-explainer/commands/generate-web-diagram.md diff --git a/commands/plan-review.md b/plugins/visual-explainer/commands/plan-review.md similarity index 100% rename from commands/plan-review.md rename to plugins/visual-explainer/commands/plan-review.md diff --git a/commands/project-recap.md b/plugins/visual-explainer/commands/project-recap.md similarity index 100% rename from commands/project-recap.md rename to plugins/visual-explainer/commands/project-recap.md diff --git a/commands/share.md b/plugins/visual-explainer/commands/share.md similarity index 100% rename from commands/share.md rename to plugins/visual-explainer/commands/share.md diff --git a/references/css-patterns.md b/plugins/visual-explainer/references/css-patterns.md similarity index 100% rename from references/css-patterns.md rename to plugins/visual-explainer/references/css-patterns.md diff --git a/references/libraries.md b/plugins/visual-explainer/references/libraries.md similarity index 100% rename from references/libraries.md rename to plugins/visual-explainer/references/libraries.md diff --git a/references/responsive-nav.md b/plugins/visual-explainer/references/responsive-nav.md similarity index 100% rename from references/responsive-nav.md rename to plugins/visual-explainer/references/responsive-nav.md diff --git a/references/slide-patterns.md b/plugins/visual-explainer/references/slide-patterns.md similarity index 100% rename from references/slide-patterns.md rename to plugins/visual-explainer/references/slide-patterns.md diff --git a/scripts/share.sh b/plugins/visual-explainer/scripts/share.sh similarity index 100% rename from scripts/share.sh rename to plugins/visual-explainer/scripts/share.sh diff --git a/templates/architecture.html b/plugins/visual-explainer/templates/architecture.html similarity index 100% rename from templates/architecture.html rename to plugins/visual-explainer/templates/architecture.html diff --git a/templates/data-table.html b/plugins/visual-explainer/templates/data-table.html similarity index 100% rename from templates/data-table.html rename to plugins/visual-explainer/templates/data-table.html diff --git a/templates/mermaid-flowchart.html b/plugins/visual-explainer/templates/mermaid-flowchart.html similarity index 100% rename from templates/mermaid-flowchart.html rename to plugins/visual-explainer/templates/mermaid-flowchart.html diff --git a/templates/slide-deck.html b/plugins/visual-explainer/templates/slide-deck.html similarity index 100% rename from templates/slide-deck.html rename to plugins/visual-explainer/templates/slide-deck.html