trying to simplify things a bit more... will get rid of 'onResolve'

src/InputBlock.tsx

@@ -61,6 +61,8 @@ export function InputBlock({ state, setState, filter, onResolve, onCancel }: Inp
   }, [focus]);
 
   const onSelectSuggestion = ([name, dynamic]) => {
+    console.log('resolving input block', text, '->', name);
+    
     onResolve({
       kind: "input",
       text: name,
@@ -69,23 +71,10 @@ export function InputBlock({ state, setState, filter, onResolve, onCancel }: Inp
     });
   };
 
-  const onInput = e => {
-    setText(e.target.value);
-    if (resolved) {
-      // un-resolve
-      onResolve({
-        kind: "input",
-        text: e.target.value,
-        resolved: undefined,
-        focus: true,
-      });
-    }
-  };
-
   const getCaretPosition = () => {
     return inputRef.current?.selectionStart || -1;
   }
-
+  // fired before onInput
   const onKeyDown = (e: React.KeyboardEvent) => {
     const fns = {
       Tab: () => {
@@ -141,6 +130,24 @@ export function InputBlock({ state, setState, filter, onResolve, onCancel }: Inp
     fns[e.key]?.();
   };
 
+  const onInput = e => {
+    const found = trie.get(env.name2dyn)(e.target.value);
+    if (found) {
+      console.log('resolving input block..', e.target.value);
+      onResolve({...state, text: e.target.value, resolved: found});
+    }
+    else {
+      if (resolved) {
+        // un-resolve
+        console.log('un-resolving input block..', e.target.value);
+        onResolve({...state, text: e.target.value, resolved: undefined});
+      }
+      else {
+        setText(e.target.value);
+      }
+    }
+  };
+
   return <span>
     <span className="">
       {/* Dropdown suggestions */}
@@ -164,6 +171,7 @@ export function InputBlock({ state, setState, filter, onResolve, onCancel }: Inp
         spellCheck={false}/>
       {/* Single 'grey' suggestion */}
       <span className="text-block suggest">{singleSuggestion}</span>
+      { resolved && <>&#x2611;</>}
     </span>
   </span>;
 }