Set up some pieces to support global limiter

 * scaffolding for global limiter AWP
 * placeholder small view for destination node

src/globalLimiter/GlobalLimiterAWP.js

@@ -0,0 +1,35 @@
+class GlobalLimiterAWP extends AudioWorkletProcessor {
+  constructor() {
+    super();
+
+    this.isShutdown = false;
+
+    this.port.onmessage = evt => this.handleMessage(evt.data);
+  }
+
+  handleMessage(data) {
+    switch (data.type) {
+      default: {
+        console.error('Unhandled message type in global limiter AWP: ', evt.data.type);
+      }
+    }
+  }
+
+  process(inputs, outputs, _params) {
+    if (this.isShutdown) {
+      return false;
+    }
+
+    const input = inputs[0]?.[0];
+    const output = outputs[0]?.[0];
+    if (!input || !output) {
+      return true;
+    }
+
+    // TODO
+
+    return true;
+  }
+}
+
+registerProcessor('global-limiter-awp', GlobalLimiterAWP);

src/graphEditor/GraphEditor.tsx

@@ -915,10 +915,7 @@ const GraphEditor: React.FC<{ stateKey: string }> = ({ stateKey }) => {
 
         <div style={{ display: 'flex', width: 400, flex: 1, flexDirection: 'column' }}>
           {selectedNodeVCID ? (
-            <FlatButton
-              style={{ marginBottom: 4 }}
-              onClick={() => getEngine()!.switch_view_context(selectedNodeVCID)}
-            >
+            <FlatButton onClick={() => getEngine()!.switch_view_context(selectedNodeVCID)}>
               Show Full UI
             </FlatButton>
           ) : null}

src/graphEditor/nodes/CustomAudio/CustomAudio.ts

@@ -45,6 +45,7 @@ import { LGAudioConnectables } from '../AudioConnectablesNode';
 import { FMSynthFxNode } from './FMSynthFx/FMSynthFxNode';
 import { SubgraphPortalNode } from 'src/graphEditor/nodes/CustomAudio/Subgraph/SubgraphPortalNode';
 import { BPMNode } from 'src/graphEditor/nodes/CustomAudio/BPM/BPMNode';
+import { DestinationNodeSmallViewShim } from 'src/graphEditor/nodes/CustomAudio/Destination/DestinationNodeSmallView';
 
 const ctx = new AudioContext();
 
@@ -335,26 +336,26 @@ const CustomBiquadFilterNode = enhanceAudioNode({
   ),
 });
 
+export class CustomAudioDestinationNode extends GainNode {
+  constructor(ctx: AudioContext) {
+    super(ctx);
+    return (ctx as any).globalVolume as GainNode;
+  }
+}
+
 const CustomDestinationNode = enhanceAudioNode({
-  AudioNodeClass: class CustomAudioDestinationNode {
-    constructor(ctx: AudioContext) {
-      return (ctx as any).globalVolume as GainNode;
-    }
-  },
+  AudioNodeClass: CustomAudioDestinationNode,
   nodeType: 'customAudio/destination',
   name: 'Destination',
-  buildConnectables: (
-    foreignNode: ForeignNode<GainNode> & {
-      node: GainNode;
-    }
-  ) => ({
+  buildConnectables: (foreignNode: ForeignNode<GainNode> & { node: GainNode }) => ({
     inputs: Map<string, ConnectableInput>().set('input', {
       node: foreignNode.node,
       type: 'customAudio',
     }),
     outputs: Map<string, ConnectableOutput>(),
     node: foreignNode,
   }),
+  SmallViewRenderer: DestinationNodeSmallViewShim,
   getOverridableParams: () => [],
   paramKeys: [],
 });
@@ -364,9 +365,7 @@ const NativeCompressorNode = enhanceAudioNode({
   nodeType: 'customAudio/nativeCompressor',
   name: 'Native Compressor',
   buildConnectables: (
-    foreignNode: ForeignNode<DynamicsCompressorNode> & {
-      node: DynamicsCompressorNode;
-    }
+    foreignNode: ForeignNode<DynamicsCompressorNode> & { node: DynamicsCompressorNode }
   ) => ({
     inputs: Map<string, ConnectableInput>(
       Object.entries({

src/graphEditor/nodes/CustomAudio/Destination/DestinationNodeSmallView.svelte

@@ -0,0 +1,27 @@
+<script lang="ts" context="module">
+  const buildSettings = (): ControlPanelSetting[] => [
+    { type: 'checkbox', label: 'enable safety limiter' },
+  ];
+</script>
+
+<script lang="ts">
+  import SvelteControlPanel, {
+    type ControlPanelSetting,
+  } from 'src/controls/SvelteControlPanel/SvelteControlPanel.svelte';
+  import type { CustomAudioDestinationNode } from 'src/graphEditor/nodes/CustomAudio/CustomAudio';
+
+  export let node: CustomAudioDestinationNode;
+
+  $: settings = buildSettings();
+</script>
+
+<div class="root">
+  <SvelteControlPanel title="destination settings" {settings} width={500} />
+</div>
+
+<style lang="css">
+  .root {
+    display: flex;
+    flex-direction: column;
+  }
+</style>

src/graphEditor/nodes/CustomAudio/Destination/DestinationNodeSmallView.ts

@@ -0,0 +1,11 @@
+import type { CustomAudioDestinationNode, ForeignNode } from 'src/graphEditor/nodes/CustomAudio';
+import { mkSvelteComponentShim } from 'src/svelteUtils';
+import DestinationNodeSmallView from './DestinationNodeSmallView.svelte';
+
+interface DestinationNodeSmallViewProps {
+  node: ForeignNode<CustomAudioDestinationNode>;
+}
+
+export const DestinationNodeSmallViewShim = mkSvelteComponentShim(
+  DestinationNodeSmallView as any
+) as unknown as React.FC<DestinationNodeSmallViewProps>;