Use native button instead of ButtonBase component

4 files changed, 4 insertions, 7 deletions

diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/accordion/components/AccordionTrigger.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/accordion/components/AccordionTrigger.tsx
index 30ba2092c0..ff852e4ea1 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/accordion/components/AccordionTrigger.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/accordion/components/AccordionTrigger.tsx
@@ -2,7 +2,6 @@ import React from 'react';
 import styled from 'styled-components';
 
 import { colors } from '../../../foundations';
-import { ButtonBase } from '../../button';
 import { useAccordionContext } from '../AccordionContext';
 import { StyledAccordionHeader } from './AccordionHeader';
 
@@ -10,7 +9,7 @@ export type AccordionTriggerProps = {
   children?: React.ReactNode;
 };
 
-const StyledAccordionTrigger = styled(ButtonBase)`
+const StyledAccordionTrigger = styled.button`
   background-color: transparent;
   &&:hover > ${StyledAccordionHeader} {
     background-color: ${colors.blue60};
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/button/Button.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/button/Button.tsx
index f526800c2a..bdb18b7547 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/button/Button.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/button/Button.tsx
@@ -40,7 +40,7 @@ const styles = {
   },
 };
 
-export const StyledButton = styled(ButtonBase)<ButtonProps>`
+export const StyledButton = styled.button<ButtonProps>`
   ${({ width: sizeProp = 'fill', variant: variantProp = 'primary' }) => {
     const variant = styles.variants[variantProp];
     const size = styles.flex[sizeProp];
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/icon-button/IconButton.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/icon-button/IconButton.tsx
index 1ae5688be4..b349c34f2e 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/icon-button/IconButton.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/icon-button/IconButton.tsx
@@ -2,7 +2,6 @@ import React, { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
 
 import { colors } from '../../foundations';
-import { ButtonBase } from '../button';
 import { IconProps, iconSizes } from '../icon/Icon';
 import { IconButtonIcon } from './components/IconButtonIcon';
 import { IconButtonProvider } from './IconButtonContext';
@@ -12,7 +11,7 @@ export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
   size?: IconProps['size'];
 }
 
-const StyledButton = styled(ButtonBase)<{ $size: IconButtonProps['size'] }>`
+const StyledButton = styled.button<{ $size: IconButtonProps['size'] }>`
   ${({ $size = 'medium' }) => {
     const size = iconSizes[$size];
     return css`
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/components/list-item/components/list-item-trigger/ListItemTrigger.tsx b/desktop/packages/mullvad-vpn/src/renderer/lib/components/list-item/components/list-item-trigger/ListItemTrigger.tsx
index 13aaa74a8f..7cd7b85859 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/components/list-item/components/list-item-trigger/ListItemTrigger.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/components/list-item/components/list-item-trigger/ListItemTrigger.tsx
@@ -1,11 +1,10 @@
 import styled, { css } from 'styled-components';
 
 import { colors } from '../../../../foundations';
-import { ButtonBase } from '../../../button';
 import { ListItemProps } from '../../ListItem';
 import { useListItem } from '../../ListItemContext';
 
-const StyledButton = styled(ButtonBase)<Pick<ListItemProps, 'disabled'>>`
+const StyledButton = styled.button<Pick<ListItemProps, 'disabled'>>`
   display: flex;
   width: 100%;
   --background: transparent;