diff --git a/web/components/button.react.js b/web/components/button.react.js
--- a/web/components/button.react.js
+++ b/web/components/button.react.js
@@ -27,31 +27,29 @@
 };
 
 export type ButtonProps = {
-  +onClick: ?(event: SyntheticEvent<HTMLButtonElement>) => mixed,
-  +children: React.Node,
+  ...React.ElementConfig<'button'>,
   +variant?: ButtonVariant,
   +buttonColor?: ButtonColor,
-  +type?: string,
-  +disabled?: boolean,
-  +className?: string,
 };
 
 function Button(props: ButtonProps): React.Node {
   const {
-    onClick,
-    children,
     variant = 'plain',
     buttonColor,
+    children,
     type = 'button',
-    disabled = false,
-    className = '',
+    className,
+    ...buttonProps
   } = props;
 
-  const btnCls = classnames({
-    [css.plain]: true,
-    [css.btn]: variant === 'filled' || variant === 'outline',
-    [css[variant]]: true,
-  });
+  const btnCls = classnames(
+    {
+      [css.plain]: true,
+      [css.btn]: variant === 'filled' || variant === 'outline',
+      [css[variant]]: true,
+    },
+    className,
+  );
 
   let style = {};
   if (buttonColor) {
@@ -70,13 +68,7 @@
   });
 
   return (
-    <button
-      type={type}
-      className={`${btnCls} ${className}`}
-      onClick={onClick}
-      disabled={disabled}
-      style={style}
-    >
+    <button {...buttonProps} type={type} className={btnCls} style={style}>
       {wrappedChildren}
     </button>
   );