fix: delegate checkbox/radio/switch label keydown to native inputs

packages/react-aria-components/test/Checkbox.test.js

@@ -385,4 +385,20 @@ describe.each(['Checkbox', 'CheckboxField'])('%s', (comp) => {
     expect(onBlur).not.toHaveBeenCalled();
     expect(onFocus).not.toHaveBeenCalled();
   });
+
+  it('should support implicit form submission from a focused checkbox on Enter', async () => {
+    let onSubmit = jest.fn(e => e.preventDefault());
+    let {getByRole} = render(
+      <form onSubmit={onSubmit}>
+        <Checkbox>Test</Checkbox>
+        <button type="submit">Submit</button>
+      </form>
+    );
+
+    let checkbox = getByRole('checkbox');
+    await user.click(checkbox);
+    await user.keyboard('{Enter}');
+
+    expect(onSubmit).toHaveBeenCalledTimes(1);
+  });
 });

packages/react-aria-components/test/RadioGroup.test.js

@@ -739,4 +739,24 @@ describe.each(['RadioGroup', 'RadioField'])('%s', (comp) => {
     expect(onFocusB).toHaveBeenCalledTimes(1);
     expect(onBlurA).toHaveBeenCalledTimes(1);
   });
+
+  it('should support implicit form submission from a focused radio on Enter', async () => {
+    let onSubmit = jest.fn(e => e.preventDefault());
+    let {getAllByRole} = render(
+      <form onSubmit={onSubmit}>
+        <RadioGroup defaultValue="a">
+          <Label>Test</Label>
+          <Radio value="a">A</Radio>
+          <Radio value="b">B</Radio>
+        </RadioGroup>
+        <button type="submit">Submit</button>
+      </form>
+    );
+
+    let radio = getAllByRole('radio')[0];
+    await user.click(radio);
+    await user.keyboard('{Enter}');
+
+    expect(onSubmit).toHaveBeenCalledTimes(1);
+  });
 });

packages/react-aria-components/test/Switch.test.js

@@ -359,4 +359,20 @@ describe.each(['Switch', 'SwitchField'])('%s', (comp) => {
       expect(checkbox).not.toHaveAttribute('aria-describedby');
     });
   }
+
+  it('should support implicit form submission from a focused switch on Enter', async () => {
+    let onSubmit = jest.fn(e => e.preventDefault());
+    let {getByRole} = render(
+      <form onSubmit={onSubmit}>
+        <Switch>Test</Switch>
+        <button type="submit">Submit</button>
+      </form>
+    );
+
+    let s = getByRole('switch');
+    await user.click(s);
+    await user.keyboard('{Enter}');
+
+    expect(onSubmit).toHaveBeenCalledTimes(1);
+  });
 });

packages/react-aria/src/radio/useRadio.ts

@@ -118,6 +118,10 @@ export function useRadio(props: AriaRadioProps, state: RadioGroupState, ref: Ref
     }
   });
 
+  // Let the hidden radio input handle keyboard events natively so Enter can
+  // submit forms like a native radio control.
+  delete labelProps.onKeyDown;
+
   let {focusableProps} = useFocusable(mergeProps(props, {
     onFocus: () => state.setLastFocusedValue(value)
   }), ref);

packages/react-aria/src/toggle/useToggle.ts

@@ -161,6 +161,10 @@ export function useToggle(props: AriaToggleProps, state: ToggleState, ref: RefOb
     isDisabled: isDisabled || isReadOnly
   });
 
+  // Let the hidden input handle keyboard events natively so Enter can
+  // submit forms like a native checkbox/switch control.
+  delete labelProps.onKeyDown;
+
   let {focusableProps} = useFocusable(props, ref);
   let interactions = mergeProps(pressProps, focusableProps);
   let domProps = filterDOMProps(props, {labelable: true});