feat(web): mystmd vertical slice — first-order chapter (MIC-125)#483
Open
mtiller wants to merge 2 commits into
Open
feat(web): mystmd vertical slice — first-order chapter (MIC-125)#483mtiller wants to merge 2 commits into
mtiller wants to merge 2 commits into
Conversation
Implements the MIC-84 decision (mystmd) as a one-chapter vertical slice
in a new /web directory, standing alongside the existing Sphinx/nextgen
build without touching it.
Working end-to-end (npm run build → static HTML):
- first_order.rst converted to MyST Markdown (content/first-order.md):
prose, headings, cross-refs, admonitions, KaTeX math, and Modelica
source via {literalinclude} (:lines:/:emphasize-lines:).
- Custom {mbe-figure} directive (plugins/mbe-figure.mjs) renders all four
static plots and replaces the legacy .. plot:: + :class: interactive +
nextgen interactiveInjector (which recovered the model id by slicing an
image src). Figures are backed by the structured contract in
public/cases/<id>.json — the data _generate_casedata already emits.
- Byte-verified: FO -> ...SimpleExample.FirstOrder, FOE -> ...FirstOrderExperiment
(matches text/specs.py). The new data contract is provably correct.
Deferred (documented in web/README.md):
- Interactive island hydration: mystmd sanitizes raw HTML and doesn't
auto-serve public/, so it needs a theme-component hook. Groundwork is in
place (sanitizer-safe mbe-plot-<id> class marker, contract JSON,
public/mbe-island.{js,css}); paired with Jony's figure-interaction design.
- Bulk chapter conversion, i18n (MIC-92), live sim API (MIC-86), final design.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
…path (MIC-125)
Spike outcome (web/SPIKE.md): mystmd sanitizes raw HTML (strips data-* and
<script>) and has no page-script config hook, so the island can't be emitted
from the directive. Two viable mechanisms identified:
A. Post-build injection (scripts/postbuild.mjs) — copies island assets into
the built site + injects <link>/<script> after mystmd runs. Demonstrated
working end-to-end for the static build (assets served, figures carry a
sanitizer-safe mbe-plot-<id> class, contract fetchable at /cases/<id>.json).
Caveat: enhancement over a hydrating React app (mounts post-load); no dev.
B. Custom local theme extending @myst-theme/book with a React renderer for the
figure node — robust, dev+prod, but means forking/maintaining the theme.
Recommendation: A for the slice/preview now, B for production if dev-mode and
full hydration-safety are required. Skeleton is mechanism-agnostic either way.
Also: editable-param contract per Michael's call — explicit `params` field in
case.json, computed as editable iff variability=='parameter' (parity with the
legacy ParameterPanel categories.parameter). FO/FOE are parameter-free, so
params: [] (correct degenerate case).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Implements the MIC-84 decision (mystmd) as a one-chapter vertical slice (MIC-125), in a new
web/directory that stands alongside the existing Sphinx/nextgen build without touching it.What to review
The goal is to validate the pipeline and data contract, not the visual design (default book-theme; Jony's design lands later and is orthogonal).
Working end-to-end (
cd web && npm install && npm run build)text/source/behavior/equations/first_order.rst→web/content/first-order.md: prose, headings, cross-refs, admonitions, KaTeX math, and Modelica source via{literalinclude}(:lines:/:emphasize-lines:).{mbe-figure}directive (web/plugins/mbe-figure.mjs) renders all four static plots and replaces the legacy.. plot::+:class: interactive+ nextgeninteractiveInjector— which recovered the model id by string-slicing an imagesrc(src.slice(16, src.length-4)). Figures are now backed by the structured contract inweb/public/cases/<id>.json.FO → ModelicaByExample.BasicEquations.SimpleExample.FirstOrder,FOE → …FirstOrderExperiment(matchestext/specs.py:13,24).Deliberately deferred (documented in
web/README.md)data-*/<script>) and doesn't auto-servepublic/, so the island can't be drop-injected — it needs a theme component. Groundwork is in place: sanitizer-safembe-plot-<id>class marker, the contract JSON, and a readypublic/mbe-island.{js,css}. This is being co-designed with Jony (UI/UX).Notes
web/is self-contained.Closes MIC-125.
🤖 Generated with Claude Code