Feat: The key for the begin operator can only contain alphanumeric characters and underscores. #10427 (#11377)

### What problem does this PR solve?

Feat: The key for the begin operator can only contain alphanumeric
characters and underscores. #10427

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/agent/form/begin-form/parameter-dialog.tsx

@@ -1,3 +1,4 @@
+import { KeyInput } from '@/components/key-input';
 import { Button } from '@/components/ui/button';
 import {
   Dialog,
@@ -113,7 +114,6 @@ function ParameterForm({
 
   function onSubmit(data: z.infer<typeof FormSchema>) {
     const values = { ...data, options: data.options?.map((x) => x.value) };
-    console.log('🚀 ~ onSubmit ~ values:', values);
 
     submit(values);
   }
@@ -153,7 +153,11 @@ function ParameterForm({
             <FormItem>
               <FormLabel>{t('key')}</FormLabel>
               <FormControl>
-                <Input {...field} autoComplete="off" onBlur={handleKeyChange} />
+                <KeyInput
+                  {...field}
+                  autoComplete="off"
+                  onBlur={handleKeyChange}
+                />
               </FormControl>
               <FormMessage />
             </FormItem>