From 2d1321a7a0f30482ff3b8e9c5249666f05a3d180 Mon Sep 17 00:00:00 2001
From: Bryan Thomas <49354825+bryanjtc@users.noreply.github.com>
Date: Thu, 6 Jun 2024 11:56:59 -0500
Subject: [PATCH] Update styled.tsx

---
 src/styled.tsx | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/styled.tsx b/src/styled.tsx
index 7d5d21a..2bcc015 100644
--- a/src/styled.tsx
+++ b/src/styled.tsx
@@ -1,3 +1,4 @@
+import React from 'react';
 import styled from '@emotion/styled';
 
 import colors from './colors';
@@ -7,7 +8,16 @@ export const paraGraphDefaultStyle = {
   lineHeight: '20px',
 };
 
-const Button = styled.button<{ hideBackground?: boolean }>`
+interface ButtonBaseProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  type: React.ButtonHTMLAttributes<HTMLButtonElement>['type'];
+}
+
+const ButtonBase = ({ type = 'button', ...props }: ButtonBaseProps) => {
+  return <ButtonBase type={type} {...props} />;
+};
+
+const Button = styled(ButtonBase)<{ hideBackground?: boolean }>`
   appearance: none;
   margin: 0;
   border: 0;
@@ -23,8 +33,6 @@ const Button = styled.button<{ hideBackground?: boolean }>`
   }
 `;
 
-Button.defaultProps = { type: 'button' };
-
 const CircleButton = styled(Button)`
   font-size: 14px;
   font-weight: bold;