nicolium: further improvements for multiselect keyboard navigation

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>

packages/pl-fe/src/components/ui/multiselect.tsx

@@ -195,8 +195,21 @@ const Multiselect: React.FC<IMultiselect> = ({
           break;
         case 'Escape':
           setIsOpen(false);
+          searchBoxRef.current?.focus();
           break;
         default:
+          if (document.activeElement !== searchBoxRef.current) {
+            if (
+              e.key === 'Backspace' ||
+              e.key === 'ArrowLeft' ||
+              e.key === 'ArrowRight' ||
+              (e.key.length === 1 && !e.ctrlKey && !e.metaKey)
+            ) {
+              searchBoxRef.current?.focus();
+            }
+          } else if (!isOpen) {
+            setIsOpen(true);
+          }
       }
     },
     [inputValue, selectedValues, visibleOptions, isOpen, onSelectItem, onRemoveSelectedItem],

packages/pl-fe/src/features/ui/components/hotkeys.tsx

@@ -193,7 +193,7 @@ function useHotkeys<T extends HTMLElement>(handlers: HandlerMap) {
         isKeyboardEvent(event) &&
         !event.defaultPrevented &&
         !['input', 'textarea', 'select', 'em-emoji-picker'].includes(tagName) &&
-        !(event.target as HTMLElement).closest('[contenteditable]') &&
+        !(event.target as HTMLElement).closest('[contenteditable], .multiselect-container') &&
         !(['a', 'button'].includes(tagName) && normalizeKey(event.key) === 'enter');
 
       if (shouldHandleEvent) {