Skip to main content

​
Modular Panel

Songbird Modular editor — the React panel for the songbirdModularInstrument / songbirdModularFx stock plugins. Thin glue over components/organisms/node-graph/ (the schema-agnostic shell). This directory wires the shell to the modular.* sync channel and provides DSP-specific custom UIs and visualisers.

​
What it owns

  • ModularPanel.tsx — entry point. Fetches the catalogue, subscribes to modular:state, adapts shell handlers into typed sync commands.
  • adapters/nodeDescriptorToMeta.ts — converts the JSON payload from modular.list_nodes into the shell’s typed NodeMeta[].
  • nodes/ — per-atom React custom UIs (Phase 2).
  • visualisers/ — TSL-based GL visualisers (oscilloscope, EQ curve, ADSR shape) per node type (Phase 2).

​
What it doesn’t own

  • Canvas rendering, cables, drag interaction — all in the organism.
  • Per-track plugin lifecycle — handled by the host’s plugin slot UI.

​
Status

Phase 1 (this commit): minimal mount. Loads the catalogue, can add a Gain node via the shell’s stub button, optimistic-updates the local state. No cables, no DOM block UI beyond the shell’s basic positioned divs. Phase 2: searchable node menu, drag/drop blocks, click-to-cable ports, param widgets (knobs/sliders/dropdowns from @/components/atoms), per-node visualisers via drei <View> once the organism’s GL layer lands.

​
Tests

./utils/validate vitest for unit tests; ./utils/validate ts for type checks.