From 93849c8461eb13111e7b4ebd4d0d5ae961612e5f Mon Sep 17 00:00:00 2001
From: Johanna Szepanski <johanna.szepanski@softhouse.se>
Date: Thu, 13 Mar 2025 10:06:11 +0100
Subject: [PATCH] migrated IconMenuButton stories
---
.../common/IconMenuButton/IconMenuButton.tsx | 1 +
...stories.jsx => IconMenuButton.stories.tsx} | 34 ++++++++++++-------
src/style/Theme.ts | 2 ++
3 files changed, 25 insertions(+), 12 deletions(-)
rename src/stories/common/IconMenuButton/{IconMenuButton.stories.jsx => IconMenuButton.stories.tsx} (59%)
diff --git a/src/components/common/IconMenuButton/IconMenuButton.tsx b/src/components/common/IconMenuButton/IconMenuButton.tsx
index eb893778..6379a8ca 100644
--- a/src/components/common/IconMenuButton/IconMenuButton.tsx
+++ b/src/components/common/IconMenuButton/IconMenuButton.tsx
@@ -63,6 +63,7 @@ export const IconMenuButton = ({
className={className}
id={`${id}icon-menu-button-button`}
onClick={singleItem ? menuItems[0]?.action : handleClick}
+ sx={{ color: (theme) => theme.palette.primaryContrastText.main }}
aria-label={
// eslint-disable-next-line no-nested-ternary
singleItem
diff --git a/src/stories/common/IconMenuButton/IconMenuButton.stories.jsx b/src/stories/common/IconMenuButton/IconMenuButton.stories.tsx
similarity index 59%
rename from src/stories/common/IconMenuButton/IconMenuButton.stories.jsx
rename to src/stories/common/IconMenuButton/IconMenuButton.stories.tsx
index 56dbe4f7..cd7d9ebc 100644
--- a/src/stories/common/IconMenuButton/IconMenuButton.stories.jsx
+++ b/src/stories/common/IconMenuButton/IconMenuButton.stories.tsx
@@ -1,6 +1,7 @@
+import { Box } from "@mui/material";
import { BugReport, AddBoxOutlined } from "@mui/icons-material";
-import { ButtonAppBar } from "../../../components/navigation/ButtonAppBar";
import { IconMenuButton } from "../../../components/common/IconMenuButton";
+import { IconMenuButtonProps } from "../../../components/common/IconMenuButton/IconMenuButton";
import { sbDisabledArg } from "../../utils/common-args";
@@ -10,9 +11,16 @@ export default {
iconMenuButton: sbDisabledArg
}
};
-
-export const SingleButton = (args) => <ButtonAppBar {...args} />;
-const singleButtonProps = {
+export const SingleButton = (args: IconMenuButtonProps) => (
+ <Box
+ sx={{
+ background: (theme) => theme.palette.primary.main
+ }}
+ >
+ <IconMenuButton {...args} />
+ </Box>
+);
+SingleButton.args = {
id: "single-story-",
menuItems: [
{
@@ -21,12 +29,17 @@ const singleButtonProps = {
}
]
};
-SingleButton.args = {
- iconMenuButton: <IconMenuButton {...singleButtonProps} />
-};
-export const MenuButton = (args) => <ButtonAppBar {...args} />;
-const menuButtonProps = {
+export const MenuButton = (args: IconMenuButtonProps) => (
+ <Box
+ sx={{
+ background: (theme) => theme.palette.primary.main
+ }}
+ >
+ <IconMenuButton {...args} />
+ </Box>
+);
+MenuButton.args = {
id: "menu-story-",
icon: <AddBoxOutlined />,
menuItems: [
@@ -41,6 +54,3 @@ const menuButtonProps = {
}
]
};
-MenuButton.args = {
- iconMenuButton: <IconMenuButton {...menuButtonProps} />
-};
diff --git a/src/style/Theme.ts b/src/style/Theme.ts
index 4209adb5..21ad353b 100644
--- a/src/style/Theme.ts
+++ b/src/style/Theme.ts
@@ -35,6 +35,7 @@ declare module "@mui/material/styles" {
lab: Palette["primary"];
development: Palette["primary"];
};
+ primaryContrastText: Palette["primary"];
}
interface PaletteOptions {
@@ -51,6 +52,7 @@ declare module "@mui/material/styles" {
lab: Palette["primary"];
development: Palette["primary"];
};
+ primaryContrastText: Palette["primary"];
}
}
--
GitLab