nicer looking

src/Editor.tsx

@@ -9,7 +9,7 @@ import { evalEditorBlock } from "./eval";
 import { CommandContext } from "./CommandContext";
 import "./Editor.css";
 import { EnvContext } from "./EnvContext";
-import type { LambdaBlockState } from "./LambdaBlock";
+import { LambdaBlock, type LambdaBlockState } from "./LambdaBlock";
 import { LetInBlock, type LetInBlockState } from "./LetInBlock";
 import { initialEditorState } from "./configurations";
 import { focusNextElement, focusPrevElement } from "./util/dom_trickery";
@@ -71,9 +71,11 @@ export function Editor({state, setState, onCancel, suggestionPriority}: EditorPr
 
   const globalContext = useContext(CommandContext);
   const onCommand = (e: React.KeyboardEvent) => {
+    console.log(e);
+    
     // const type = getType(state.resolved);
     // const commands = getCommands(type);
-    const commands = ['e', 't', 'Enter', 'Backspace', 'ArrowLeft', 'ArrowRight', 'Tab', 'l', '=', '.', 'c'];
+    const commands = ['e', 't', 'Enter', 'Backspace', 'ArrowLeft', 'ArrowRight', 'Tab', 'l', 'L', '=', '.', 'c', 'a'];
     if (!commands.includes(e.key)) {
       return;
     }
@@ -124,18 +126,35 @@ export function Editor({state, setState, onCancel, suggestionPriority}: EditorPr
     }
     // l -> Let ... in ...
     // = -> assign to name
-    if (e.key === 'l' || e.key === '=') {
+    if (e.key === 'l' || e.key === '=' && !e.shiftKey) {
       // we become LetInBlock
       setState(state => ({
         kind: "let",
         inner: removeFocus(initialEditorState),
         name: "",
         value: removeFocus(state),
-        resolved: undefined,
-      }));
+      }));  
       globalContext?.doHighlight.let();
       return;
     }
+    if (e.key === 'L' || e.key === '=' && e.shiftKey) {
+      setState(state => ({
+        kind: "let",
+        inner: removeFocus(state),
+        name: "",
+        value: removeFocus(initialEditorState),
+      }));
+    }
+    // a -> lAmbdA
+    if (e.key === "a") {
+      setState(state => ({
+        kind: "lambda",
+        paramName: "",
+        expr: removeFocus(state),
+      }));
+      globalContext?.doHighlight.lambda();
+      return;
+    }
   };
 
   const renderBlock = () => {
@@ -169,22 +188,26 @@ export function Editor({state, setState, onCancel, suggestionPriority}: EditorPr
           suggestionPriority={suggestionPriority}
           />;
       case "lambda":
-        return <></>;
+        return <LambdaBlock
+          state={state}
+          setState={setState as (callback:(p:LambdaBlockState)=>EditorState)=>void}
+          suggestionPriority={suggestionPriority}
+          />;
     }  
   }
   const resolved = evalEditorBlock(state, env);
-  return <>
+  return <span className="editor">
     {renderBlock()}
     <div className="typeSignature">
-     &nbsp;::&nbsp;<Type type={getType(resolved)} />
+     <Type type={getType(resolved)} />
     </div>
     <input
       ref={commandInputRef}
       spellCheck={false}
       className="editable commandInput"
-      placeholder={`<command>`}
+      placeholder={`<c>`}
       onKeyDown={onCommand}
       value={""}
       onChange={() => {}} />
-  </>;
+  </span>;
 }