feat: publish new version

package.json

@@ -1,7 +1,7 @@
 {
   "name": "specter-ui-kit",
   "private": false,
-  "version": "0.4.0-rc-4",
+  "version": "0.4.0",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.es.js",

src/@types/theme.d.ts

@@ -25,6 +25,10 @@ declare module '@mui/material/styles' {
         highlight: string;
         icon: string;
       };
+      colors: {
+        primary: string;
+        secondary: string;
+      }
     };
   }
   interface ThemeOptions {

src/components/base/TranslationButton/TranslationButton.style.tsx

@@ -2,21 +2,19 @@ import { styled } from '@mui/material/styles';
 import Button from '@mui/material/Button';
 import TranslateIcon from '@mui/icons-material/Translate';
 
-
 const StyledTranslationButton = styled(Button)(({ theme }) => ({
-  backgroundColor: theme.colorPalette.secondaryColor.color,
+  backgroundColor: theme.colorPalette.colors.primary,
   color: 'white',
   '&:hover': {
-    backgroundColor: theme.colorPalette.primaryColor.color,
+    backgroundColor: theme.colorPalette.colors.secondary,
   },
   minWidth: 'auto',
   padding: '8px',
   borderRadius: '4px',
 }));
 
-
 const StyledTranslateIcon = styled(TranslateIcon)(() => ({
   color: 'inherit',
 }));
 
-export { StyledTranslationButton, StyledTranslateIcon };
+export { StyledTranslationButton, StyledTranslateIcon };

src/context/theme/lightMode.ts

@@ -28,10 +28,10 @@ export const colorPalette = {
     highlight: '#FFDF5F',
     icon: '#2860A8',
   },
-  primaryColor: {
-    color: '#474E72'
+  colors: {
+    primary: '#474E72',
+    secondary: '#1B1E2D',
   },
-  secondaryColor: '#1B1E2D',
 };
 
 export const lightMode = createTheme({
@@ -52,4 +52,4 @@ export const lightMode = createTheme({
       },
     },
   },
-});
+});