Add flex basis to Flex component

1 files changed, 12 insertions, 1 deletions

diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/common/layout/Flex.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/common/layout/Flex.tsx
index ede836194b..32d7f4f30b 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/components/common/layout/Flex.tsx
+++ b/desktop/packages/mullvad-vpn/src/renderer/components/common/layout/Flex.tsx
@@ -12,11 +12,21 @@ export interface FlexProps extends LayoutProps {
   $justifyContent?: React.CSSProperties['justifyContent'];
   $flexGrow?: React.CSSProperties['flexGrow'];
   $flexShrink?: React.CSSProperties['flexShrink'];
+  $flexBasis?: React.CSSProperties['flexBasis'];
   children?: React.ReactNode;
 }
 
 export const Flex = styled(Layout)<FlexProps>(
-  ({ $gap, $flex, $flexDirection, $alignItems, $justifyContent, $flexGrow, $flexShrink }) => ({
+  ({
+    $gap,
+    $flex,
+    $flexDirection,
+    $alignItems,
+    $justifyContent,
+    $flexGrow,
+    $flexShrink,
+    $flexBasis,
+  }) => ({
     display: 'flex',
     gap: $gap,
     flex: $flex,
@@ -25,5 +35,6 @@ export const Flex = styled(Layout)<FlexProps>(
     justifyContent: $justifyContent,
     flexGrow: $flexGrow,
     flexShrink: $flexShrink,
+    flexBasis: $flexBasis,
   }),
 );