Add Button component

plugins/ui/src/deephaven/ui/components/__init__.py

@@ -8,6 +8,7 @@
 
 __all__ = [
     "action_button",
+    "button",
     "checkbox",
     "component",
     "content",

plugins/ui/src/deephaven/ui/components/spectrum/basic.py

@@ -17,6 +17,14 @@ def action_button(*children, **props):
     return spectrum_element("ActionButton", *children, **props)
 
 
+def button(*children, **props):
+    """
+    Python implementation for the Adobe React Spectrum Button component.
+    https://react-spectrum.adobe.com/react-spectrum/Button.html
+    """
+    return spectrum_element("Button", *children, **props)
+
+
 def checkbox(*children, **props):
     """
     Python implementation for the Adobe React Spectrum Checkbox component.

plugins/ui/src/js/src/SpectrumElementUtils.ts

@@ -13,13 +13,20 @@ import {
   View,
 } from '@adobe/react-spectrum';
 import { ValueOf } from '@deephaven/utils';
-import { ActionButton, RangeSlider, Slider, TextField } from './spectrum';
+import {
+  ActionButton,
+  Button,
+  RangeSlider,
+  Slider,
+  TextField,
+} from './spectrum';
 import { ELEMENT_KEY, ElementNode, isElementNode } from './ElementUtils';
 
 export const SPECTRUM_ELEMENT_TYPE_PREFIX = 'deephaven.ui.spectrum.';
 
 export const SpectrumSupportedTypes = {
   ActionButton,
+  Button,
   Checkbox,
   Content,
   ContextualHelp,

plugins/ui/src/js/src/spectrum/Button.tsx

@@ -0,0 +1,27 @@
+import React, { useCallback } from 'react';
+import {
+  Button as SpectrumButton,
+  SpectrumButtonProps,
+} from '@adobe/react-spectrum';
+
+function Button(props: SpectrumButtonProps & { onPress?: () => void }) {
+  const { onPress: propOnPress, ...otherProps } = props;
+
+  const onPress = useCallback(
+    e => {
+      // The PressEvent from React Spectrum is not serializable (contains circular references). We're just dropping the event here but we should probably convert it.
+      // TODO(#76): Need to serialize PressEvent and send with the callback instead of just dropping it.
+      propOnPress?.();
+    },
+    [propOnPress]
+  );
+
+  return (
+    // eslint-disable-next-line react/jsx-props-no-spreading
+    <SpectrumButton onPress={onPress} {...otherProps} />
+  );
+}
+
+Button.displayName = 'Button';
+
+export default Button;

plugins/ui/src/js/src/spectrum/index.ts

@@ -5,6 +5,7 @@
  * Or in the case of event handlers, we may want to wrap the event handler to serialize the event correctly.
  */
 export { default as ActionButton } from './ActionButton';
+export { default as Button } from './Button';
 export { default as RangeSlider } from './RangeSlider';
 export { default as Slider } from './Slider';
 export { default as TextField } from './TextField';