From 21ffd9bb003796ac7761d98e6ed1f4430cc2e86c Mon Sep 17 00:00:00 2001
From: Robb Niznik <rniznik@launchdarkly.com>
Date: Thu, 20 Feb 2025 11:23:58 -0500
Subject: [PATCH 1/2] fix(components): fix `ListBox` width

---
 .changeset/thirty-gorillas-peel.md                | 5 +++++
 packages/components/src/styles/ListBox.module.css | 2 +-
 packages/components/stories/ListBox.stories.tsx   | 8 ++++++++
 3 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/thirty-gorillas-peel.md

diff --git a/.changeset/thirty-gorillas-peel.md b/.changeset/thirty-gorillas-peel.md
new file mode 100644
index 000000000..92e2fd4e4
--- /dev/null
+++ b/.changeset/thirty-gorillas-peel.md
@@ -0,0 +1,5 @@
+---
+"@launchpad-ui/components": patch
+---
+
+Fix `ListBox` width
diff --git a/packages/components/src/styles/ListBox.module.css b/packages/components/src/styles/ListBox.module.css
index 449eb8151..5f53d3c7f 100644
--- a/packages/components/src/styles/ListBox.module.css
+++ b/packages/components/src/styles/ListBox.module.css
@@ -1,6 +1,6 @@
 .box {
+	--lp-menu-max-width: none;
 	composes: menu from './Menu.module.css';
-	max-width: unset;
 }
 
 .item {
diff --git a/packages/components/stories/ListBox.stories.tsx b/packages/components/stories/ListBox.stories.tsx
index ffcfdd2a5..d0b239ca5 100644
--- a/packages/components/stories/ListBox.stories.tsx
+++ b/packages/components/stories/ListBox.stories.tsx
@@ -3,6 +3,7 @@ import type { ComponentType } from 'react';
 import type { Selection as AriaSelection } from 'react-aria-components';
 
 import { Icon } from '@launchpad-ui/icons';
+import { vars } from '@launchpad-ui/vars';
 import { fireEvent, userEvent, within } from '@storybook/test';
 import { useState } from 'react';
 
@@ -12,6 +13,13 @@ const meta: Meta<typeof ListBox> = {
 	component: ListBox,
 	subcomponents: { ListBoxItem, ListBoxSection, Header } as Record<string, ComponentType<unknown>>,
 	title: 'Components/Collections/ListBox',
+	decorators: [
+		(Story) => (
+			<div style={{ width: vars.size[400] }}>
+				<Story />
+			</div>
+		),
+	],
 };
 
 export default meta;

From 917db2a5587b428a6e7a793cf1135dba11161489 Mon Sep 17 00:00:00 2001
From: Robb Niznik <rniznik@launchdarkly.com>
Date: Thu, 20 Feb 2025 11:36:02 -0500
Subject: [PATCH 2/2] fix: remove decorator

---
 packages/components/stories/ListBox.stories.tsx | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/packages/components/stories/ListBox.stories.tsx b/packages/components/stories/ListBox.stories.tsx
index d0b239ca5..ffcfdd2a5 100644
--- a/packages/components/stories/ListBox.stories.tsx
+++ b/packages/components/stories/ListBox.stories.tsx
@@ -3,7 +3,6 @@ import type { ComponentType } from 'react';
 import type { Selection as AriaSelection } from 'react-aria-components';
 
 import { Icon } from '@launchpad-ui/icons';
-import { vars } from '@launchpad-ui/vars';
 import { fireEvent, userEvent, within } from '@storybook/test';
 import { useState } from 'react';
 
@@ -13,13 +12,6 @@ const meta: Meta<typeof ListBox> = {
 	component: ListBox,
 	subcomponents: { ListBoxItem, ListBoxSection, Header } as Record<string, ComponentType<unknown>>,
 	title: 'Components/Collections/ListBox',
-	decorators: [
-		(Story) => (
-			<div style={{ width: vars.size[400] }}>
-				<Story />
-			</div>
-		),
-	],
 };
 
 export default meta;