From b9077c400bd7ff2baf21c2e68b3f2a2b8f17841b Mon Sep 17 00:00:00 2001 From: alex leon Date: Wed, 16 Sep 2026 09:57:37 +0200 Subject: [PATCH] Add default max width to menu component lists --- .../ds-components/src/components/Filter/sort-menu.recipe.ts | 6 +++++- .../src/util/SelectableList/selectable-list.recipe.ts | 1 + 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/libs/@hashintel/ds-components/src/components/Filter/sort-menu.recipe.ts b/libs/@hashintel/ds-components/src/components/Filter/sort-menu.recipe.ts index 1fe825fb9b4..24f16495009 100644 --- a/libs/@hashintel/ds-components/src/components/Filter/sort-menu.recipe.ts +++ b/libs/@hashintel/ds-components/src/components/Filter/sort-menu.recipe.ts @@ -51,7 +51,11 @@ export const placeholderLabel = cva({ export const menuContent = cva({ base: { - maxWidth: "[300px]", + // && outranks the menu recipe's default max-width, which ties on + // specificity and would otherwise win or lose by extraction order. + "&&": { + maxWidth: "[300px]", + }, }, }); diff --git a/libs/@hashintel/ds-components/src/util/SelectableList/selectable-list.recipe.ts b/libs/@hashintel/ds-components/src/util/SelectableList/selectable-list.recipe.ts index 2b18ae0c093..ee5a840491e 100644 --- a/libs/@hashintel/ds-components/src/util/SelectableList/selectable-list.recipe.ts +++ b/libs/@hashintel/ds-components/src/util/SelectableList/selectable-list.recipe.ts @@ -278,6 +278,7 @@ export const styles = sva({ }, menu: { content: { + maxWidth: "[min(500px, 70vw)]", '&[data-state="open"]': { animation: "fadeIn 120ms ease-out", },