feat: add type hint to monaco editor

Author: kermanx

packages/northstar/src/blocks/special/FuncBlockBase.r.ts

@@ -26,6 +26,7 @@ import { currentGraph } from "../../store";
 import { PropData, PropsData } from "../../utils/props";
 import { multiOutSocketToOutput } from "../../utils/toOutpus";
 import { SpecialBlock } from "./base";
+import { setExtraLib } from "../../utils";
 
 export abstract class FuncBlockBase extends RectBlock implements SpecialBlock {
   cloneTo(target: this): this {
@@ -100,6 +101,7 @@ export abstract class FuncBlockBase extends RectBlock implements SpecialBlock {
                     })
                   ) {
                     this.inputValue.value = _.$ev;
+                    setExtraLib(this.slots.map(slot => `/** param */ declare const $${slot}: any;`).join("\n"));
                   }
                 },
               );

packages/northstar/src/utils/index.ts

@@ -1,5 +1,5 @@
 export * from "./align";
 export * from "./duplicateBlocks";
 export * from "./file";
-export * from "./initMonaco";
+export * from "./monaco";
 export * from "./removeBlocks";

packages/northstar/src/utils/initMonaco.ts renamed to packages/northstar/src/utils/monaco.ts

@@ -34,3 +34,10 @@ export function initMonaco() {
     formatProvider,
   );
 }
+
+let currentExtraLib = "";
+export function setExtraLib(code: string) {
+  if (currentExtraLib === code) return;
+  monaco.languages.typescript.javascriptDefaults.addExtraLib(code, "context.d.ts");
+  currentExtraLib = code;
+}