fix: Can not add properties in "SetProperties" action

Composer/packages/adaptive-form/src/components/fields/IntellisenseFields.tsx

@@ -3,7 +3,7 @@
 
 import { FieldProps } from '@bfc/extension-client';
 import { Intellisense } from '@bfc/intellisense';
-import React, { useRef } from 'react';
+import React, { useRef, useCallback } from 'react';
 
 import { getIntellisenseUrl } from '../../utils/getIntellisenseUrl';
 import { ExpressionSwitchWindow } from '../ExpressionSwitchWindow';
@@ -12,6 +12,8 @@ import { JsonField } from './JsonField';
 import { NumberField } from './NumberField';
 import { StringField } from './StringField';
 
+const noop = () => {};
+
 export const IntellisenseTextField: React.FC<FieldProps<string>> = (props) => {
   const { id, value = '', onChange, uiOptions, focused: defaultFocused } = props;
 
@@ -39,7 +41,7 @@ export const IntellisenseTextField: React.FC<FieldProps<string>> = (props) => {
           focused={focused}
           id={id}
           value={textFieldValue}
-          onBlur={() => {}} // onBlur managed by Intellisense
+          onBlur={noop} // onBlur managed by Intellisense
           onChange={(newValue) => onValueChanged(newValue || '')}
           onClick={onClickTextField}
           onKeyDown={onKeyDownTextField}
@@ -72,7 +74,7 @@ export const IntellisenseExpressionField: React.FC<FieldProps<string>> = (props)
           focused={focused}
           id={id}
           value={textFieldValue}
-          onBlur={() => {}} // onBlur managed by Intellisense
+          onBlur={noop} // onBlur managed by Intellisense
           onChange={(newValue) => onValueChanged(newValue || '')}
           onClick={onClickTextField}
           onKeyDown={onKeyDownTextField}
@@ -110,7 +112,7 @@ export const IntellisenseNumberField: React.FC<FieldProps<string>> = (props) =>
           focused={focused}
           id={id}
           value={textFieldValue}
-          onBlur={() => {}} // onBlur managed by Intellisense
+          onBlur={noop} // onBlur managed by Intellisense
           onChange={(newValue) => onValueChanged(newValue || 0)}
           onClick={onClickTextField}
           onKeyDown={onKeyDownTextField}
@@ -167,7 +169,7 @@ export const IntellisenseJSONField: React.FC<FieldProps<string>> = (props) => {
           {...props}
           style={{ height: 100 }}
           value={textFieldValue}
-          onBlur={() => {}} // onBlur managed by Intellisense
+          onBlur={noop} // onBlur managed by Intellisense
           onChange={onValueChanged}
         />
       )}

Composer/packages/intellisense/src/components/Intellisense.tsx

@@ -76,12 +76,12 @@ export const Intellisense = React.memo(
       }
     }, [completionItems]);
 
-    // Closes the list of completion items if user clicks away from component or presses "Escape"
+    // Closes the list of completion items if user clicks away from component
     React.useEffect(() => {
       const outsideClickHandler = (event: MouseEvent) => {
         const { x, y } = event;
 
-        let shouldBlur = true;
+        let shouldBlur = focused;
 
         if (mainContainerRef.current && !checkIsOutside(x, y, mainContainerRef.current)) {
           shouldBlur = false;
@@ -97,21 +97,28 @@ export const Intellisense = React.memo(
         }
       };
 
+      document.body.addEventListener('click', outsideClickHandler);
+
+      return () => {
+        document.body.removeEventListener('click', outsideClickHandler);
+      };
+    }, [focused, onBlur]);
+
+    // Closes the list of completion items if user presses "Escape"
+    React.useEffect(() => {
       const keyupHandler = (event: KeyboardEvent) => {
         if (event.key === 'Escape') {
           setShowCompletionList(false);
           onBlur && onBlur(id);
         }
       };
 
-      document.body.addEventListener('click', outsideClickHandler);
       document.body.addEventListener('keyup', keyupHandler);
 
       return () => {
-        document.body.removeEventListener('click', outsideClickHandler);
         document.body.removeEventListener('keyup', keyupHandler);
       };
-    }, []);
+    }, [onBlur]);
 
     // When textField value is changed
     const onValueChanged = (newValue: string) => {