fix(inline-dropdown): handle Enter key PD-5602

packages/inline-dropdown/configure/src/inline-dropdown-toolbar.jsx

@@ -235,6 +235,7 @@ class RespAreaToolbar extends React.Component {
 
   onDone = (val) => {
     const { choices, node, editor, onAddChoice, onToolbarDone } = this.props;
+
     const { editedChoiceIndex } = this.state;
     const onlyText = createElementFromHTML(val).textContent.trim();
 
@@ -282,11 +283,17 @@ class RespAreaToolbar extends React.Component {
 
   onKeyDown = (event) => {
     if (event.key === 'Enter') {
-      this.preventDone = false;
-      this.onAddChoice();
+      const html = event.target?.innerHTML || '';
+
+      this.onDone(html);
+      this.preventDone = true;
+      this.focusInput();
+
       // Cancelling event
-      return false;
+      return true;
     }
+
+    return false;
   };
 
   onBlur = () => {

packages/inline-dropdown/configure/src/main.jsx

@@ -222,23 +222,12 @@ export class Main extends React.Component {
     });
 
     if (shouldWarn) {
-      this.setState({
-        warning: {
-          open: true,
-          text: 'Response areas with under 2 options or with no correct answers will be discarded.',
-          onClose: () => {
-            this.setState({ warning: { open: false } });
-          },
-          onConfirm: () => {
-            this.setState({ warning: { open: false } }, () =>
-              this.onModelChange({
-                choices: cloneDeep(newRespAreaChoices),
-                slateMarkup: domMarkup.innerHTML,
-              }),
-            );
-          },
-        },
-      });
+      this.onCheck(() =>
+        this.onModelChange({
+          choices: cloneDeep(newRespAreaChoices),
+          slateMarkup: domMarkup.innerHTML,
+        }),
+      );
     } else {
       this.onModelChange({
         choices: cloneDeep(newRespAreaChoices),
@@ -251,39 +240,32 @@ export class Main extends React.Component {
     const { respAreaChoices } = this.state;
     const { maxResponseAreaChoices } = this.props.configuration;
 
-    if (respAreaChoices[index] && respAreaChoices[index].length >= maxResponseAreaChoices) {
+    const showWarning = (message) =>
       this.setState({
         warning: {
           open: true,
-          text: `There are only ${maxResponseAreaChoices} answers allowed per choice.`,
+          text: message,
           onClose: undefined,
           onConfirm: () => {
             this.setState({ warning: { open: false } });
           },
         },
       });
 
+    if (respAreaChoices[index] && respAreaChoices[index].length >= maxResponseAreaChoices) {
+      showWarning(`There are only ${maxResponseAreaChoices} answers allowed per choice.`);
       return;
     }
 
     if (!respAreaChoices[index]) {
       respAreaChoices[index] = [];
     }
 
+
+
     // check for duplicate answer, but exclude the one that is currently edited
     if ((respAreaChoices[index] || []).find((r, idx) => r.label === label && idx !== choiceIndex)) {
-      // show warning for duplicated answers
-      this.setState({
-        warning: {
-          open: true,
-          text: 'Duplicate answers are not allowed.',
-          onClose: undefined,
-          onConfirm: () => {
-            this.setState({ warning: { open: false } });
-          },
-        },
-      });
-
+      showWarning('Duplicate answers are not allowed.');
       return;
     }