diff --git a/packages/components/submenu/index.js b/packages/components/submenu/index.js
index 8ed6822b76..9d5624c7c1 100644
--- a/packages/components/submenu/index.js
+++ b/packages/components/submenu/index.js
@@ -21,7 +21,6 @@ const Submenu = (props) => {
startSelect = 0,
forsedActiveItemId,
onSelect,
- isFullLength,
...rest
} = props;
if (!data) return null;
@@ -106,7 +105,7 @@ const Submenu = (props) => {
-
+
{data.map((d) => {
const isActive =
@@ -145,12 +144,9 @@ const Submenu = (props) => {
);
})}
- {!isFullLength && (
-
- )}
- {isFullLength && }
+
diff --git a/packages/components/submenu/styled-submenu.js b/packages/components/submenu/styled-submenu.js
index db4b268230..d5eda69d0d 100644
--- a/packages/components/submenu/styled-submenu.js
+++ b/packages/components/submenu/styled-submenu.js
@@ -22,6 +22,12 @@ export const StyledSubmenu = styled.div`
top: 0;
background: ${(props) => props.theme.submenu.backgroundColor};
z-index: 1;
+ ${(props) =>
+ !props.isFullLength &&
+ !isMobileOnly &&
+ css`
+ width: fit-content;
+ `};
}
${isMobileOnly &&
@@ -128,13 +134,6 @@ export const SubmenuScroller = styled.div`
}
overflow-x: auto;
overflow-y: hidden;
-
- ${(props) =>
- !props.isFullLength &&
- css`
- display: grid;
- flex: 0 1 auto;
- `};
`;
export const SubmenuRoot = styled.div`