fix: remove unexpected clicking outlines (#392)

apps/main/package.json

@@ -24,8 +24,6 @@
     "@headlessui/react": "1.6.4",
     "@next/bundle-analyzer": "12.1.5",
     "@radix-ui/colors": "0.1.8",
-    "@react-aria/button": "3.5.0",
-    "@react-types/button": "3.5.0",
     "@sendinblue/client": "3.1.0",
     "@storybook/jest": "0.0.10",
     "@storybook/testing-library": "0.0.11",

apps/main/src/components/button/base-button.tsx

@@ -1,12 +1,9 @@
-import { useButton } from '@react-aria/button';
-import { AriaButtonProps } from '@react-types/button';
 import clsx from 'clsx';
 import * as React from 'react';
 
-export type BaseButtonProps = AriaButtonProps &
-  Omit<React.ComponentPropsWithRef<'button'>, keyof AriaButtonProps>;
+export type BaseButtonProps = React.ComponentPropsWithRef<'button'>;
 
-const BaseButton = React.forwardRef(function BaseButton(
+export const BaseButton = React.forwardRef(function BaseButton(
   { type = 'button', children, className, onClick, onMouseDown, ...restProps }: BaseButtonProps,
   ref: React.Ref<HTMLButtonElement>,
 ): JSX.Element {
@@ -18,16 +15,8 @@ const BaseButton = React.forwardRef(function BaseButton(
     },
     [onMouseDown],
   );
-  const defaultRef = React.useRef<HTMLButtonElement>();
-  const _ref: React.RefObject<HTMLButtonElement> = (ref ||
-    defaultRef) as React.RefObject<HTMLButtonElement>;
-  const props = {
-    type,
-    ...restProps,
-  };
-  const { buttonProps } = useButton(props, _ref);
   const allProps = {
-    ...buttonProps,
+    type,
     ...restProps,
   };
 
@@ -40,11 +29,9 @@ const BaseButton = React.forwardRef(function BaseButton(
       )}
       onMouseDown={handleMouseDown}
       onClick={onClick}
-      ref={_ref}
+      ref={ref}
     >
       {children}
     </button>
   );
 });
-
-export { BaseButton };