feat: literal hints

packages/entity/src/behavior-components/expression.jsx

@@ -199,10 +199,19 @@ const Expression = ({
                     type: 'invoke',
                     args: description.vararg
                       ? []
-                      : description.args.map(() => ({
+                      : description.args.map((arg) => {
+                        let value = null;
+                        if ('expressions' === arg.type) {
+                          value = {
+                            type: 'expressions',
+                            expressions: [],
+                          };
+                        }
+                        return {
                           type: 'literal',
-                        value: null,
-                      })),
+                          value,
+                        };
+                      }),
                   },
                 });
               })(description, opPath)}

packages/entity/src/behavior-components/expression/invocation.jsx

@@ -1,6 +1,12 @@
 import {join} from 'path';
 
-import {PropTypes, React} from '@latus/react';
+import {
+  PropTypes,
+  React,
+  useEffect,
+  useRef,
+  useState,
+} from '@latus/react';
 import {useJsonPatcher} from '@persea/json';
 
 import Variant from '../variant';
@@ -13,11 +19,43 @@ const Invocation = ({
   op,
   path,
 }) => {
+  const literalTypeRef = useRef();
+  const [literalType, setLiteralType] = useState(false);
+  useEffect(() => {
+    literalTypeRef.current?.focus();
+  });
   const patch = useJsonPatcher();
   const argComponent = (arg, i) => {
     const argPath = join(path, 'args', i.toString());
     if ('undefined' === arg.type) {
-      return (
+      const confirmLiteralType = () => {
+        let value = null;
+        switch (literalType) {
+          case 'expressions':
+            value = {
+              type: 'expressions',
+              expressions: [],
+            };
+            break;
+          case 'number': value = 0; break;
+          case 'string': value = ''; break;
+          case 'array': value = []; break;
+          case 'object': value = {}; break;
+          case 'vector': value = [0, 0]; break;
+          default:
+        }
+        patch({
+          op: 'replace',
+          path: argPath,
+          value: {
+            type: 'literal',
+            value,
+          },
+        });
+        setLiteralType(false);
+      };
+      return false === literalType
+        ? (
           <Key
             childrenDescription={{
               '...': {label: '', type: 'undefined'},
@@ -28,14 +66,7 @@ const Invocation = ({
             key={path}
             onChange={(event, value) => {
               if ('[literal]' === value) {
-              patch({
-                op: 'replace',
-                path: argPath,
-                value: {
-                  type: 'literal',
-                  value: null,
-                },
-              });
+                setLiteralType('');
               }
               else {
                 patch({
@@ -56,6 +87,22 @@ const Invocation = ({
             path={argPath}
             value="..."
           />
+        )
+        : (
+          <input
+            type="text"
+            onBlur={confirmLiteralType}
+            onChange={({target: {value}}) => {
+              setLiteralType(value);
+            }}
+            onKeyPress={(event) => {
+              if ('Enter' === event.key) {
+                confirmLiteralType(event);
+              }
+            }}
+            ref={literalTypeRef}
+            value={literalType}
+          />
         );
     }
     const j = description.vararg ? Math.min(description?.args?.length - 1, i) : i;

packages/entity/src/behavior-components/expression/key.jsx

@@ -116,7 +116,6 @@ const Key = ({
               ref={customizeRef}
               value={customization}
             />
-
           )
       }
     </div>

packages/entity/src/behavior-components/literal.jsx

@@ -50,25 +50,7 @@ const Literal = ({
               null === value
                 ? {
                   type: 'expressions',
-                  expressions: [
-                    {
-                      type: 'expression',
-                      ops: [
-                        {
-                          type: 'key',
-                          key: 'Flow',
-                        },
-                        {
-                          type: 'key',
-                          key: 'nop',
-                        },
-                        {
-                          type: 'invoke',
-                          args: [],
-                        },
-                      ],
-                    },
-                  ],
+                  expressions: [],
                 }
                 : value
             }