diff --git a/ui/src/components/core/button/button-content.styled.ts b/ui/src/components/core/button/button-content.styles.ts
similarity index 100%
rename from ui/src/components/core/button/button-content.styled.ts
rename to ui/src/components/core/button/button-content.styles.ts
diff --git a/ui/src/components/core/button/button-content.tsx b/ui/src/components/core/button/button-content.tsx
index 81a168f..ba054bd 100644
--- a/ui/src/components/core/button/button-content.tsx
+++ b/ui/src/components/core/button/button-content.tsx
@@ -4,7 +4,7 @@ import { ButtonProps } from '.';
 import {
   StyledButtonContentFlex,
   StyledButtonContentGrid,
-} from './button-content.styled';
+} from './button-content.styles';
 import { ButtonIcon } from './button-icon';
 
 export type ButtonContentProps = Pick<
diff --git a/ui/src/components/core/button/button-icon.styled.ts b/ui/src/components/core/button/button-icon.styles.ts
similarity index 100%
rename from ui/src/components/core/button/button-icon.styled.ts
rename to ui/src/components/core/button/button-icon.styles.ts
diff --git a/ui/src/components/core/button/button-icon.tsx b/ui/src/components/core/button/button-icon.tsx
index 6950c28..bb82f1e 100644
--- a/ui/src/components/core/button/button-icon.tsx
+++ b/ui/src/components/core/button/button-icon.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import {
   ButtonIconSpanProps,
   StyledButtonIconSpan,
-} from './button-icon.styled';
+} from './button-icon.styles';
 
 export const ButtonIcon: React.FC<ButtonIconSpanProps> = (props) => {
   const { children, className, ...rest } = props;
diff --git a/ui/src/components/core/button/button-spinner.styled.ts b/ui/src/components/core/button/button-spinner.styles.ts
similarity index 100%
rename from ui/src/components/core/button/button-spinner.styled.ts
rename to ui/src/components/core/button/button-spinner.styles.ts
diff --git a/ui/src/components/core/button/button-spinner.tsx b/ui/src/components/core/button/button-spinner.tsx
index b64ad8b..fcf4796 100644
--- a/ui/src/components/core/button/button-spinner.tsx
+++ b/ui/src/components/core/button/button-spinner.tsx
@@ -6,7 +6,7 @@ import {
   StyledButtonSpinnerBox,
   StyledButtonSpinnerDot,
   StyledButtonSpinnerDotsBox,
-} from './button-spinner.styled';
+} from './button-spinner.styles';
 
 export const ButtonSpinner: React.FC<ButtonSpinnerProps> = (props) => {
   const {
diff --git a/ui/src/components/core/button/button.styles.ts b/ui/src/components/core/button/button.styles.ts
index fcc3b2d..6ae496e 100644
--- a/ui/src/components/core/button/button.styles.ts
+++ b/ui/src/components/core/button/button.styles.ts
@@ -243,7 +243,7 @@ export const StyledButton = styled('button', {
   ],
   defaultVariants: {
     colorScheme: 'gray',
-    variant: 'solid',
+    variant: 'outline',
     size: 'md',
   },
 });
diff --git a/ui/src/components/core/button/icon-button.tsx b/ui/src/components/core/button/icon-button.tsx
index 9ba21a5..cbb6c08 100644
--- a/ui/src/components/core/button/icon-button.tsx
+++ b/ui/src/components/core/button/icon-button.tsx
@@ -54,15 +54,12 @@ export const IconButton = forwardRef<IconButtonProps, 'button'>(
     const { minWidth, fontSize } = useMemo(() => {
       const props = {
         sm: {
-          minWidth: '$8',
           fontSize: '$lg',
         },
         md: {
-          minWidth: '$11',
           fontSize: '$xl',
         },
         lg: {
-          minWidth: '$14',
           fontSize: '$2xl',
         },
       };
diff --git a/ui/src/components/core/button/index.ts b/ui/src/components/core/button/index.ts
index b1eb04d..07813f6 100644
--- a/ui/src/components/core/button/index.ts
+++ b/ui/src/components/core/button/index.ts
@@ -1,2 +1,3 @@
 export * from './button.styles';
 export * from './button';
+export * from './icon-button';
diff --git a/ui/src/components/core/index.ts b/ui/src/components/core/index.ts
index 1a78866..8c49368 100644
--- a/ui/src/components/core/index.ts
+++ b/ui/src/components/core/index.ts
@@ -1 +1,2 @@
 export * from './button';
+export * from './icon';
diff --git a/ui/src/components/layout/flex.styled.tsx b/ui/src/components/layout/flex.styled.tsx
deleted file mode 100644
index 30af230..0000000
--- a/ui/src/components/layout/flex.styled.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { dripStitches } from '../../theme'; //TODO replace with absolute path
-import React from 'react';
-
-const { styled } = dripStitches;
-
-export const Flex = styled('div', {
-  display: 'flex',
-});
-
-export type FlexProps = React.ComponentProps<typeof Flex>;
diff --git a/ui/src/components/layout/index.ts b/ui/src/components/layout/index.ts
index 9f9e3ea..3ca6365 100644
--- a/ui/src/components/layout/index.ts
+++ b/ui/src/components/layout/index.ts
@@ -1,2 +1,3 @@
 export * from './grid.styles';
 export * from './flex.styles';
+export * from './stepper';
diff --git a/ui/src/components/layout/stepper/stepper.stories.tsx b/ui/src/components/layout/stepper/stepper.stories.tsx
index 5c75e57..543f33b 100644
--- a/ui/src/components/layout/stepper/stepper.stories.tsx
+++ b/ui/src/components/layout/stepper/stepper.stories.tsx
@@ -1,6 +1,6 @@
 import { Button } from '../../core';
 import { Stepper } from './stepper';
-import { Flex } from '../flex.styled';
+import { Flex } from '../../layout';
 
 export default {
   title: 'Components/Layout/Stepper',
@@ -21,7 +21,7 @@ const StepperButton: React.FC = () => {
 export const Default = () => {
   return (
     <>
-      <Stepper.Root initialStep={1} totalSteps={4}>
+      <Stepper.Root initialStep={1}>
         <Stepper.Container>
           <Stepper.Step>
             {/* Step 1 */}
diff --git a/ui/src/components/layout/stepper/stepper.tsx b/ui/src/components/layout/stepper/stepper.tsx
index 749ffa7..230140a 100644
--- a/ui/src/components/layout/stepper/stepper.tsx
+++ b/ui/src/components/layout/stepper/stepper.tsx
@@ -1,6 +1,6 @@
+import { Flex } from '@/components';
 import React, { useMemo, useState } from 'react';
-import { createContext } from '../../..//utils';
-import { Flex } from '../flex.styled';
+import { createContext } from '../../../utils';
 import { StepperStyles } from './stepper.styles';
 
 export type SelectContext = {
diff --git a/ui/src/views/mint/mint-stepper.tsx b/ui/src/views/mint/mint-stepper.tsx
index 0c0389d..78f8ca2 100644
--- a/ui/src/views/mint/mint-stepper.tsx
+++ b/ui/src/views/mint/mint-stepper.tsx
@@ -1,8 +1,4 @@
-import { Button, Flex } from '@/components';
-import { IconButton } from '@/components/core/button/icon-button';
-import { Icon } from '@/components/core/icon';
-import React from 'react';
-import { Stepper } from '@/components/layout/stepper/stepper';
+import { Button, Flex, IconButton, Icon, Stepper } from '@/components';
 
 // TODO remove after flow integration
 const StepperButton: React.FC = () => {