From 5b957c231467b40ae749f52dbc01bf6ad3842112 Mon Sep 17 00:00:00 2001 From: adithya-s-k Date: Sun, 30 Aug 2026 22:28:28 +0530 Subject: [PATCH 01/77] article: scaffold "The ultimate guide to multi-harness RL" MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit A second long-form article, sibling to the RL environments guide, at content/articles/multi-harness-rl/. Structure and viz placeholders only — no prose beyond section-level framing. Scaffolded by copying the guide's fork and stripping content the way create-research-article's cleanupProject does (chapters, embeds except banner.html, assets, bibliography), keeping the app/public/data symlink the Dockerfile depends on. The upstream CLI was not usable here: it clones tfrere/research-article-template fresh rather than copying a sibling. - 9 chapters matching the outline, registered in article.mdx's import list (which is the entire chapter registry — no glob, no ordering config) - 15 embed placeholders that render a labelled card naming what each visualization should show, so the page reads as a frame rather than a blank. Root classes follow the convention the existing embeds actually use (strip a leading d3-), not the one the skill doc states. - Chapter stubs carry inline TODOs pointing at the source material: the multi-harness deck for the architecture half, OpenEnv PR #1036 for the capture layer, and the Data Agent datasets/models/Spaces for the empirical half. - bibliography.bib seeded and wired for [@key] citations. Note: the parser rejects both % comments and @comment{} blocks — entries only. - HeroArticle pointed at banner.html; it hard-codes banner-grid-scaling.html, which the strip removes. Also: - deploy.py excludes node_modules/dist/.astro from Space uploads. Without this an article upload ships ~350MB of node_modules, since hf upload reads the working tree rather than the git index. - fix the RL environments guide's own frontmatter: repo pointed at the old RL_Envs_101 name and seoThumbImage at assets/blog_thumbnail.png, which was renamed in the restructure and now 404s (verified). Verified: npm run build completes, all 9 sections and 15 placeholders render, zero "Embed not found", deploy --dry-run reports the docker SDK. Co-Authored-By: Claude Opus 5 (1M context) Claude-Session: https://claude.ai/code/session_01MLWbS4j4R3EB69BpMYbjvc --- content/README.md | 1 + .../.ai/skills/article-frontmatter/SKILL.md | 116 + .../.ai/skills/create-html-embed/SKILL.md | 133 + .../skills/create-html-embed/directives.md | 504 + .../.ai/skills/deploy-to-hf-spaces/SKILL.md | 121 + .../articles/multi-harness-rl/.cursor/skills | 1 + .../articles/multi-harness-rl/.dockerignore | 36 + .../articles/multi-harness-rl/.gitattributes | 35 + content/articles/multi-harness-rl/.gitignore | 52 + content/articles/multi-harness-rl/AGENTS.md | 80 + content/articles/multi-harness-rl/CLAUDE.md | 11 + content/articles/multi-harness-rl/Dockerfile | 123 + content/articles/multi-harness-rl/GEMINI.md | 1 + content/articles/multi-harness-rl/LICENSE | 33 + content/articles/multi-harness-rl/README.md | 57 + .../multi-harness-rl/app/astro.config.mjs | 91 + .../multi-harness-rl/app/package-lock.json | 12351 ++++++++++++++++ .../multi-harness-rl/app/package.json | 90 + .../app/plugins/astro/generate-llms-txt.mjs | 212 + .../app/plugins/rehype/code-copy.mjs | 94 + .../app/plugins/rehype/post-citation.mjs | 494 + .../app/plugins/rehype/restore-at-in-code.mjs | 22 + .../app/plugins/rehype/wrap-outputs.mjs | 38 + .../app/plugins/rehype/wrap-tables.mjs | 43 + .../remark/ignore-citations-in-code.mjs | 21 + .../app/plugins/remark/output-container.mjs | 23 + .../plugins/remark/unwrap-citation-links.mjs | 57 + .../multi-harness-rl/app/postcss.config.mjs | 14 + .../articles/multi-harness-rl/app/public/data | 1 + .../app/public/hf-space-parent-listener.js | 55 + .../multi-harness-rl/app/public/robots.txt | 5 + .../app/public/scripts/color-palettes.js | 274 + .../app/scripts/EXPORT-PDF-BOOK.md | 311 + .../app/scripts/README-PDF-BOOK.md | 309 + .../app/scripts/export-latex.mjs | 358 + .../app/scripts/export-pdf-book-simple.mjs | 626 + .../app/scripts/export-pdf-book.mjs | 612 + .../app/scripts/export-pdf.mjs | 742 + .../app/scripts/extract-used-assets.mjs | 397 + .../app/scripts/generate-trackio-data.mjs | 196 + .../app/scripts/jitter-trackio-data.mjs | 129 + .../app/scripts/latex-importer/README.md | 169 + .../scripts/latex-importer/bib-cleaner.mjs | 104 + .../latex-importer/filters/equation-ids.lua | 134 + .../app/scripts/latex-importer/index.mjs | 138 + .../latex-importer/latex-converter.mjs | 330 + .../scripts/latex-importer/mdx-converter.mjs | 896 ++ .../latex-importer/metadata-extractor.mjs | 170 + .../scripts/latex-importer/package-lock.json | 1272 ++ .../app/scripts/latex-importer/package.json | 33 + .../scripts/latex-importer/post-processor.mjs | 439 + .../latex-importer/reference-preprocessor.mjs | 239 + .../app/scripts/notion-importer/.cursorignore | 1 + .../app/scripts/notion-importer/README.md | 334 + .../app/scripts/notion-importer/env.example | 2 + .../app/scripts/notion-importer/index.mjs | 494 + .../scripts/notion-importer/mdx-converter.mjs | 863 ++ .../notion-importer/notion-converter.mjs | 266 + .../scripts/notion-importer/package-lock.json | 2032 +++ .../app/scripts/notion-importer/package.json | 38 + .../notion-importer/post-processor.mjs | 837 ++ .../notion-importer/static/bibliography.bib | 1711 +++ .../notion-importer/static/frontmatter.mdx | 59 + .../test-comment-fix-processed.md | 30 + .../notion-importer/test-component-spacing.md | 23 + .../notion-importer/test-external-images.md | 15 + .../notion-importer/test-social-media.md | 9 + .../app/scripts/notion-importer/yarn.lock | 1118 ++ .../app/scripts/screenshot-elements.mjs | 905 ++ .../app/scripts/sync-template.mjs | 447 + .../app/src/components/Accordion.astro | 196 + .../app/src/components/Footer.astro | 440 + .../app/src/components/FullWidth.astro | 9 + .../app/src/components/Glossary.astro | 337 + .../app/src/components/HeroArticle.astro | 749 + .../app/src/components/HeroPaper.astro | 210 + .../app/src/components/HfUser.astro | 96 + .../app/src/components/HtmlEmbed.astro | 927 ++ .../app/src/components/Image.astro | 629 + .../app/src/components/Note.astro | 124 + .../app/src/components/Quote.astro | 140 + .../app/src/components/RawHtml.astro | 6 + .../app/src/components/Reference.astro | 74 + .../app/src/components/Seo.astro | 81 + .../app/src/components/Sidenote.astro | 270 + .../app/src/components/Stack.astro | 141 + .../app/src/components/TableOfContents.astro | 1152 ++ .../app/src/components/ThemeToggle.astro | 126 + .../app/src/components/Wide.astro | 9 + .../app/src/components/heroUtils.ts | 87 + .../app/src/content/article.mdx | 43 + .../app/src/content/assets/data/.gitkeep | 0 .../src/content/assets/image/placeholder.png | Bin 0 -> 67 bytes .../app/src/content/bibliography.bib | 33 + .../app/src/content/chapters/async-grpo.mdx | 32 + .../app/src/content/chapters/conclusions.mdx | 15 + .../app/src/content/chapters/evals.mdx | 30 + .../app/src/content/chapters/introduction.mdx | 27 + .../src/content/chapters/openenv-harbor.mdx | 57 + .../src/content/chapters/rl-environments.mdx | 129 + .../small-models-across-harnesses.mdx | 30 + .../content/chapters/training-ablations.mdx | 41 + .../content/chapters/what-is-a-harness.mdx | 38 + .../src/content/embeds/ablation-matrix.html | 66 + .../app/src/content/embeds/banner.html | 258 + .../src/content/embeds/d3-capture-proxy.html | 66 + .../content/embeds/d3-dialects-funnel.html | 66 + .../content/embeds/d3-eval-comparison.html | 66 + .../app/src/content/embeds/d3-full-stack.html | 66 + .../content/embeds/d3-harness-anatomy.html | 66 + .../app/src/content/embeds/d3-nm-hub.html | 66 + .../embeds/d3-posttraining-timeline.html | 66 + .../src/content/embeds/d3-rollout-graph.html | 66 + .../app/src/content/embeds/d3-serve-flow.html | 66 + .../src/content/embeds/d3-token-contract.html | 66 + .../content/embeds/d3-training-curves.html | 66 + .../content/embeds/d3-white-black-box.html | 66 + .../app/src/content/embeds/harbor-matrix.html | 66 + .../embeds/harness-ecosystem-matrix.html | 66 + .../multi-harness-rl/app/src/env.d.ts | 7 + .../app/src/pages/dataviz.astro | 612 + .../app/src/pages/index.astro | 443 + .../app/src/scripts/README.md | 65 + .../app/src/scripts/mermaid-zoom-optimized.js | 294 + .../app/src/scripts/mermaid-zoom.js | 858 ++ .../multi-harness-rl/app/src/styles/_base.css | 168 + .../app/src/styles/_layout.css | 363 + .../app/src/styles/_print-book.css | 1002 ++ .../app/src/styles/_print.css | 128 + .../app/src/styles/_reset.css | 13 + .../app/src/styles/_variables.css | 126 + .../app/src/styles/components/_button.css | 58 + .../app/src/styles/components/_card.css | 138 + .../app/src/styles/components/_code.css | 357 + .../app/src/styles/components/_form.css | 243 + .../app/src/styles/components/_mermaid.css | 250 + .../app/src/styles/components/_table.css | 121 + .../app/src/styles/components/_tag.css | 14 + .../app/src/styles/global.css | 54 + .../app/src/utils/extract-embeds.mjs | 1089 ++ .../articles/multi-harness-rl/app/yarn.lock | 5857 ++++++++ .../create-research-article/cli.js | 635 + .../create-research-article/package.json | 35 + .../articles/multi-harness-rl/entrypoint.sh | 46 + content/articles/multi-harness-rl/nginx.conf | 61 + .../multi-harness-rl/scripts/release.mjs | 95 + .../app/src/content/article.mdx | 4 +- tools/deploy.py | 15 +- 148 files changed, 52651 insertions(+), 3 deletions(-) create mode 100644 content/articles/multi-harness-rl/.ai/skills/article-frontmatter/SKILL.md create mode 100644 content/articles/multi-harness-rl/.ai/skills/create-html-embed/SKILL.md create mode 100644 content/articles/multi-harness-rl/.ai/skills/create-html-embed/directives.md create mode 100644 content/articles/multi-harness-rl/.ai/skills/deploy-to-hf-spaces/SKILL.md create mode 120000 content/articles/multi-harness-rl/.cursor/skills create mode 100644 content/articles/multi-harness-rl/.dockerignore create mode 100644 content/articles/multi-harness-rl/.gitattributes create mode 100644 content/articles/multi-harness-rl/.gitignore create mode 100644 content/articles/multi-harness-rl/AGENTS.md create mode 100644 content/articles/multi-harness-rl/CLAUDE.md create mode 100644 content/articles/multi-harness-rl/Dockerfile create mode 120000 content/articles/multi-harness-rl/GEMINI.md create mode 100644 content/articles/multi-harness-rl/LICENSE create mode 100644 content/articles/multi-harness-rl/README.md create mode 100644 content/articles/multi-harness-rl/app/astro.config.mjs create mode 100644 content/articles/multi-harness-rl/app/package-lock.json create mode 100644 content/articles/multi-harness-rl/app/package.json create mode 100644 content/articles/multi-harness-rl/app/plugins/astro/generate-llms-txt.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/rehype/code-copy.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/rehype/post-citation.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/rehype/restore-at-in-code.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/rehype/wrap-outputs.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/rehype/wrap-tables.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/remark/ignore-citations-in-code.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/remark/output-container.mjs create mode 100644 content/articles/multi-harness-rl/app/plugins/remark/unwrap-citation-links.mjs create mode 100644 content/articles/multi-harness-rl/app/postcss.config.mjs create mode 120000 content/articles/multi-harness-rl/app/public/data create mode 100644 content/articles/multi-harness-rl/app/public/hf-space-parent-listener.js create mode 100644 content/articles/multi-harness-rl/app/public/robots.txt create mode 100644 content/articles/multi-harness-rl/app/public/scripts/color-palettes.js create mode 100644 content/articles/multi-harness-rl/app/scripts/EXPORT-PDF-BOOK.md create mode 100644 content/articles/multi-harness-rl/app/scripts/README-PDF-BOOK.md create mode 100755 content/articles/multi-harness-rl/app/scripts/export-latex.mjs create mode 100755 content/articles/multi-harness-rl/app/scripts/export-pdf-book-simple.mjs create mode 100755 content/articles/multi-harness-rl/app/scripts/export-pdf-book.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/export-pdf.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/extract-used-assets.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/generate-trackio-data.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/jitter-trackio-data.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/README.md create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/bib-cleaner.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/filters/equation-ids.lua create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/index.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/latex-converter.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/mdx-converter.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/metadata-extractor.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/package-lock.json create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/package.json create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/post-processor.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/latex-importer/reference-preprocessor.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/.cursorignore create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/README.md create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/env.example create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/index.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/mdx-converter.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/notion-converter.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/package-lock.json create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/package.json create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/post-processor.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/static/bibliography.bib create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/static/frontmatter.mdx create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/test-comment-fix-processed.md create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/test-component-spacing.md create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/test-external-images.md create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/test-social-media.md create mode 100644 content/articles/multi-harness-rl/app/scripts/notion-importer/yarn.lock create mode 100644 content/articles/multi-harness-rl/app/scripts/screenshot-elements.mjs create mode 100644 content/articles/multi-harness-rl/app/scripts/sync-template.mjs create mode 100644 content/articles/multi-harness-rl/app/src/components/Accordion.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Footer.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/FullWidth.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Glossary.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/HeroArticle.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/HeroPaper.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/HfUser.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/HtmlEmbed.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Image.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Note.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Quote.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/RawHtml.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Reference.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Seo.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Sidenote.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Stack.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/TableOfContents.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/ThemeToggle.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/Wide.astro create mode 100644 content/articles/multi-harness-rl/app/src/components/heroUtils.ts create mode 100644 content/articles/multi-harness-rl/app/src/content/article.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/assets/data/.gitkeep create mode 100644 content/articles/multi-harness-rl/app/src/content/assets/image/placeholder.png create mode 100644 content/articles/multi-harness-rl/app/src/content/bibliography.bib create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/async-grpo.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/conclusions.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/evals.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/introduction.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/openenv-harbor.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/rl-environments.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/small-models-across-harnesses.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/training-ablations.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/chapters/what-is-a-harness.mdx create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/ablation-matrix.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/banner.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-capture-proxy.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-dialects-funnel.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-eval-comparison.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-full-stack.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-harness-anatomy.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-nm-hub.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-posttraining-timeline.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-rollout-graph.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-serve-flow.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-token-contract.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-training-curves.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/d3-white-black-box.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/harbor-matrix.html create mode 100644 content/articles/multi-harness-rl/app/src/content/embeds/harness-ecosystem-matrix.html create mode 100644 content/articles/multi-harness-rl/app/src/env.d.ts create mode 100644 content/articles/multi-harness-rl/app/src/pages/dataviz.astro create mode 100644 content/articles/multi-harness-rl/app/src/pages/index.astro create mode 100644 content/articles/multi-harness-rl/app/src/scripts/README.md create mode 100644 content/articles/multi-harness-rl/app/src/scripts/mermaid-zoom-optimized.js create mode 100644 content/articles/multi-harness-rl/app/src/scripts/mermaid-zoom.js create mode 100644 content/articles/multi-harness-rl/app/src/styles/_base.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/_layout.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/_print-book.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/_print.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/_reset.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/_variables.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/components/_button.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/components/_card.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/components/_code.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/components/_form.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/components/_mermaid.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/components/_table.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/components/_tag.css create mode 100644 content/articles/multi-harness-rl/app/src/styles/global.css create mode 100644 content/articles/multi-harness-rl/app/src/utils/extract-embeds.mjs create mode 100644 content/articles/multi-harness-rl/app/yarn.lock create mode 100755 content/articles/multi-harness-rl/create-research-article/cli.js create mode 100644 content/articles/multi-harness-rl/create-research-article/package.json create mode 100644 content/articles/multi-harness-rl/entrypoint.sh create mode 100644 content/articles/multi-harness-rl/nginx.conf create mode 100644 content/articles/multi-harness-rl/scripts/release.mjs diff --git a/content/README.md b/content/README.md index c1cf2b2..2c5cc51 100644 --- a/content/README.md +++ b/content/README.md @@ -8,6 +8,7 @@ Each item ships to the Hub as a Space; the source of truth is here. | Article | Source | Live | |---|---|---| | **The ultimate guide to RL environments** | [`articles/rl-environments-guide/`](./articles/rl-environments-guide/) | [▶️ Space](https://huggingface.co/spaces/AdithyaSK/rl-environments-guide) | +| **The ultimate guide to multi-harness RL** | [`articles/multi-harness-rl/`](./articles/multi-harness-rl/) | 🚧 drafting | Built with [research-article-template](https://huggingface.co/spaces/tfrere/research-article-template) (Astro), served as a Docker Space. diff --git a/content/articles/multi-harness-rl/.ai/skills/article-frontmatter/SKILL.md b/content/articles/multi-harness-rl/.ai/skills/article-frontmatter/SKILL.md new file mode 100644 index 0000000..0d7c314 --- /dev/null +++ b/content/articles/multi-harness-rl/.ai/skills/article-frontmatter/SKILL.md @@ -0,0 +1,116 @@ +--- +name: article-frontmatter +description: Configure article metadata via MDX frontmatter. Use when the user asks about titles, authors, affiliations, template variants, banner, DOI, PDF export, or any article.mdx frontmatter field. +--- + +# Article Frontmatter Reference + +All metadata lives in `app/src/content/article.mdx` frontmatter (YAML block). + +## Frontmatter fields + +| Field | Type | Default | Description | +|-------|------|---------|-------------| +| `title` | string | required | Article title. Supports `\n` for line breaks (rendered as `
`). | +| `description` | string | `""` | Short description / subtitle shown below the title. | +| `authors` | array | `[]` | List of authors (see below). | +| `affiliations` | array | `[]` | List of affiliations (see below). | +| `published` | string | — | Publication date, e.g. `"Apr. 04, 2026"`. | +| `template` | `"article"` or `"paper"` | `"article"` | Layout variant (see below). | +| `banner` | string | `"banner.html"` | Banner embed filename in `embeds/`. | +| `doi` | string | — | DOI identifier, shown in footer. | +| `showPdf` | boolean | `true` | Show PDF download button in metadata bar. | +| `tableOfContentsAutoCollapse` | boolean | `false` | Auto-collapse TOC sections on scroll. | +| `licence` | string | — | Licence text (HTML allowed), shown in footer. | +| `pdfProOnly` | boolean | `false` | Gate PDF download behind HF Pro badge. | +| `seoThumbImage` | string | — | Custom OG image URL for social sharing. | +| `links` | array | `[]` | External links shown in paper template hero (see below). | + +## Title line breaks + +Long titles are automatically balanced across lines (`text-wrap: balance`). Titles longer than 60 characters are automatically downsized for readability (>100 chars: even smaller). + +To force a manual line break, use `\n` inside the title string: + +```yaml +title: "Why Open-Source LLMs\nAre Reshaping the AI Landscape" +``` + +This renders as two lines in the Hero section. The plain-text version (for SEO / PDF) strips the break automatically. + +## Template variants + +| Value | Layout | Features | +|-------|--------|----------| +| `article` (default) | Full layout | Banner, sidebar TOC, figure numbering, citation block, DOI, PDF export | +| `paper` | Single centered column | No TOC sidebar, no figure numbering, no citation/DOI block, lighter footer | + +## Authors and affiliations + +```yaml +authors: + - name: "Alice Martin" + url: "https://example.com/alice" + affiliations: [1] + - name: "Bob Chen" + affiliations: [1, 2] +affiliations: + - name: "Hugging Face" + url: "https://huggingface.co" + - name: "MIT" + url: "https://mit.edu" +``` + +Affiliation indices are 1-based and rendered as superscript numbers next to author names. + +## External links (paper template) + +The `links` field adds buttons below the author/affiliation line in the `paper` template hero. Each link has a `label` and a `url`: + +```yaml +links: + - label: "Paper" + url: "https://arxiv.org/abs/..." + - label: "Code" + url: "https://github.com/..." + - label: "Demo" + url: "https://huggingface.co/spaces/..." + - label: "Data" + url: "https://huggingface.co/datasets/..." +``` + +Links are rendered as pill-shaped buttons and only visible in the `paper` template. They are hidden in the `article` template. + +## README tag (critical) + +The project `README.md` contains a YAML frontmatter block with a `tags` field: + +```yaml +tags: + - research-article-template +``` + +**NEVER remove the `research-article-template` tag from the README.** This tag is used by the [Research Article Gallery](https://huggingface.co/spaces/tfrere/research-article-gallery) to discover and list all articles built with this template. Removing it will make the Space invisible in the gallery. + +## Complete example + +```yaml +--- +title: "Scaling Laws for\nNeural Language Models" +description: "An empirical study of scaling behavior across model size, data, and compute" +authors: + - name: "Alice Martin" + url: "https://example.com/alice" + affiliations: [1] +affiliations: + - name: "Hugging Face" + url: "https://huggingface.co" +published: "Apr. 04, 2026" +template: "article" +banner: "banner.html" +doi: "10.1234/example.2026" +showPdf: true +tableOfContentsAutoCollapse: true +licence: "This work is licensed under CC BY 4.0." +--- +``` diff --git a/content/articles/multi-harness-rl/.ai/skills/create-html-embed/SKILL.md b/content/articles/multi-harness-rl/.ai/skills/create-html-embed/SKILL.md new file mode 100644 index 0000000..436aeb8 --- /dev/null +++ b/content/articles/multi-harness-rl/.ai/skills/create-html-embed/SKILL.md @@ -0,0 +1,133 @@ +--- +name: create-html-embed +description: Create self-contained D3 HTML embed charts for the research article template. Use when the user asks to create a chart, visualization, embed, D3 chart, line chart, bar chart, scatter plot, sankey diagram, or any data visualization as an HTML embed file. +--- + +# Create HTML Embed + +Create self-contained D3.js chart embeds for the research article template. + +## Before you start + +**Read the full directives file** for all conventions, patterns, and checklists: + +- [directives.md](directives.md) — single source of truth for embed authoring rules + +This covers: colors & palettes, layout, SVG scope, mounting, theming, controls, tooltips, data loading, responsiveness, legends, accessibility, performance, error handling, printing, and the full agent checklist. + +## Workflow + +### Step 1: Understand the request + +Clarify with the user: +- What type of chart? (line, bar, scatter, sankey, waffle, heatmap, custom) +- What data source? (CSV path, JSON, inline data) +- Interactive controls needed? (metric selector, filters) +- Any specific design requirements? + +### Step 2: Create the HTML file + +- Location: `app/src/content/embeds/` +- Naming: `d3-.html` (e.g., `d3-training-loss.html`) +- Root class: `.d3-` (must match filename) + +### Step 3: Follow the mandatory structure + +Every embed must have this structure: + +```html +
+ + +``` + +### Step 4: Integrate in MDX + +Import and use the `HtmlEmbed` component: + +```mdx +import HtmlEmbed from '../../components/HtmlEmbed.astro'; + + +``` + +#### HtmlEmbed props + +| Prop | Type | Description | +|------|------|-------------| +| `src` | string | Path to HTML file in `embeds/` (required) | +| `title` | string | Title above the card | +| `desc` | string | Description below (supports HTML) | +| `frameless` | boolean | Removes card background/border | +| `wide` | boolean | Wide layout (~1100px) | +| `data` | string or string[] | Path(s) to data files | +| `config` | object | JSON config passed via `data-config` attribute | + +#### Usage examples + +```mdx + + + + + + + + + + + + + + +``` + +## Key conventions (quick reference) + +Full details in the directives file. The critical ones: + +1. **Colors**: Use `window.ColorPalettes.getColors('categorical', n)` — never hardcode palettes +2. **CSS variables**: `--text-color`, `--surface-bg`, `--border-color`, `--axis-color`, `--tick-color`, `--grid-color` +3. **Dark mode**: Check `document.documentElement.getAttribute('data-theme') === 'dark'` +4. **Mount guard**: Always set `container.dataset.mounted = 'true'` +5. **Data loading**: Try `/data/` first, then `./assets/data/` — use `fetchFirstAvailable()` +6. **Responsiveness**: `ResizeObserver` on container, recompute on resize +7. **Legend**: HTML-based, title "Legend", swatch 14x14px +8. **Controls**: HTML only (no SVG UI), selects labeled "Metric" when applicable +9. **Tooltip**: Single `.d3-tooltip` absolutely positioned inside container +10. **No globals**: Everything in IIFE, nothing on `window` + +## Data files + +- Store data in: `app/src/content/assets/data/` +- Served from: `/data/` (public) at build time +- Formats: CSV (preferred for tabular), JSON (for nested/hierarchical) + +## Post-creation checklist + +After creating the embed, verify against the **Agent Checklist** (section 14.1) and **Definition of Done** (section 14.2) in [directives.md](directives.md). diff --git a/content/articles/multi-harness-rl/.ai/skills/create-html-embed/directives.md b/content/articles/multi-harness-rl/.ai/skills/create-html-embed/directives.md new file mode 100644 index 0000000..329833c --- /dev/null +++ b/content/articles/multi-harness-rl/.ai/skills/create-html-embed/directives.md @@ -0,0 +1,504 @@ +## Embed Chart Authoring Guidelines + +### Quickstart (TL;DR) +- Create a single self-contained HTML fragment: root div + scoped style + IIFE script. +- Draw marks/axes in SVG; render UI (legend and controls) in HTML. +- Place legend and controls BELOW the chart (header appended after the chart). Include a legend title "Legend" and a select labeled "Metric" when relevant. +- Load data from public `/data` first, then fall back to `assets/data`. +- Use `window.ColorPalettes` for colors; stick to CSS variables for theming. + +Minimal header markup: +```html +
+
Legend
+
+ +
+
+
+ + +
+ +
+``` + +See also: `d3-line-simple.html`, `d3-line-quad.html`, `d3-benchmark.html`. + +Authoring rules for creating a new interactive chart as a single self-contained `.html` file under `src/content/embeds/`. These conventions are derived from `d3-bar.html`, `d3-comparison.html`, `d3-neural.html`, `d3-line.html`, and `d3-pie.html`. + +### A) Colors & palettes (MANDATORY) +- Always obtain color arrays from `window.ColorPalettes`; do not hardcode palettes. +- Use the categorical/sequential/diverging helpers and the current primary color. +- If you change `--primary-color` dynamically, call `window.ColorPalettes.refresh()` so listeners update. + +Usage: +```js +// Usage (with explicit counts) +const cat = window.ColorPalettes.getColors('categorical', 8); +const seq = window.ColorPalettes.getColors('sequential', 8); +const div = window.ColorPalettes.getColors('diverging', 7); + +// For current primary color string +const primaryHex = window.ColorPalettes.getPrimary(); + +// If you change --primary-color dynamically, call refresh to notify listeners +document.documentElement.style.setProperty('--primary-color', '#6D4AFF'); +window.ColorPalettes.refresh(); +``` + +Notes: +- Keep chart accents (lines, markers, selection) aligned with `--primary-color`. +- Prefer CSS variables for fills/strokes when possible; derive series colors via `ColorPalettes`. +- Provide a graceful fallback to CSS variables if `window.ColorPalettes` is unavailable. + +### B) Layout & form elements (HTML-only) +- All UI controls (labels, selects, sliders, buttons, toggles) must be plain HTML inside the root container. +- Do not draw controls with SVG; style them consistently (rounded 8px, custom caret, focus ring). +- Use `