Dashboard

Custom Rendering & Themes

Custom node renderers for type-aware styling, theme switching between Chrome presets and MUI-synced palettes, and a real-world structured product deep dive.

Custom nodeRendererColor-coded values: numbers (blue), booleans (orange), null (red), ISINs (highlighted badge)
number
boolean
null / undefined
ISIN
Theme SwitchingToggle between built-in Chrome themes and a custom MUI-synced theme
Structured Product Deep DiveBarrier Reverse Convertible with 3 underlyings — sensible expandPaths preset reveals pricing & terms
expandPaths: ["$","$.underlying","$.terms","$.pricing","$.pricing.impliedVol","$.pricing.correlation"]