fix: Allow space character in Select input (#1210)

* Fix: Allow space character in Select input

Fixed issue where pressing the space key in Select input would not add a space character to the input field.

The root cause was that preventDefault() was always called when mode was not 'combobox', which prevented typing spaces even when the input was editable in showSearch mode.

Changes:
- Modified space key handling to only call preventDefault() when the input is not editable
- Input is considered editable when mode is 'combobox' or showSearch is true
- This allows users to type spaces in editable Select inputs while preventing default behavior (scroll/submit) in non-editable Selects

This fix allows users to type spaces in search terms within Select components with showSearch enabled.

* Test: Add test cases for space key behavior with showSearch

Added test coverage to verify space key behavior in different Select modes:

1. showSearch enabled: Space should NOT call preventDefault, allowing space to be typed
2. showSearch disabled: Space SHOULD call preventDefault, preventing page scroll
3. combobox mode: Space should NOT call preventDefault, allowing space to be typed

These tests ensure the fix correctly handles space key input based on whether the input is editable.

* chore: add comment explaining preventDefault behavior for Space key

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* refactor: refine enter/space key preventDefault logic

Separate isCombobox check and apply different preventDefault logic:
- Space: prevent only when not editable
- Enter: prevent only when not combobox

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>

Author: zombieJ

src/BaseSelect/index.tsx

@@ -471,7 +471,9 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
     // Enter or Space opens dropdown (ARIA combobox: spacebar should open)
     if (isEnterKey || isSpaceKey) {
       // Do not submit form when type in the input; prevent Space from scrolling page
-      if (mode !== 'combobox') {
+      const isCombobox = mode === 'combobox';
+      const isEditable = isCombobox || showSearch;
+      if ((isSpaceKey && !isEditable) || (isEnterKey && !isCombobox)) {
         event.preventDefault();
       }
 

tests/Select.test.tsx

@@ -2985,4 +2985,64 @@ describe('Select.Basic', () => {
 
     expect(selectedItem).not.toHaveAttribute('xxx');
   });
+
+  describe('Space key behavior with showSearch', () => {
+    it('should not call preventDefault on space when showSearch is enabled', () => {
+      const { container } = render(
+        <Select showSearch options={[{ value: 'test', label: 'test' }]} />,
+      );
+
+      const input = container.querySelector('input');
+      input.focus();
+
+      const keyDownEvent = new KeyboardEvent('keydown', {
+        key: ' ',
+        code: 'Space',
+        bubbles: true,
+      });
+      const preventDefaultSpy = jest.spyOn(keyDownEvent, 'preventDefault');
+
+      input.dispatchEvent(keyDownEvent);
+
+      expect(preventDefaultSpy).not.toHaveBeenCalled();
+    });
+
+    it('should call preventDefault on space when showSearch is disabled', () => {
+      const { container } = render(<Select options={[{ value: 'test', label: 'test' }]} />);
+
+      const input = container.querySelector('input');
+      input.focus();
+
+      const keyDownEvent = new KeyboardEvent('keydown', {
+        key: ' ',
+        code: 'Space',
+        bubbles: true,
+      });
+      const preventDefaultSpy = jest.spyOn(keyDownEvent, 'preventDefault');
+
+      input.dispatchEvent(keyDownEvent);
+
+      expect(preventDefaultSpy).toHaveBeenCalled();
+    });
+
+    it('should not call preventDefault on space in combobox mode', () => {
+      const { container } = render(
+        <Select mode="combobox" options={[{ value: 'test', label: 'test' }]} />,
+      );
+
+      const input = container.querySelector('input');
+      input.focus();
+
+      const keyDownEvent = new KeyboardEvent('keydown', {
+        key: ' ',
+        code: 'Space',
+        bubbles: true,
+      });
+      const preventDefaultSpy = jest.spyOn(keyDownEvent, 'preventDefault');
+
+      input.dispatchEvent(keyDownEvent);
+
+      expect(preventDefaultSpy).not.toHaveBeenCalled();
+    });
+  });
 });