scrollを可能にする

k35o · Sep 21, 2024 · 01a4931 · 01a4931
1 parent 9ac1775
commit 01a4931
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/src/components/list-box/list-box.stories.tsx b/src/components/list-box/list-box.stories.tsx
@@ -34,12 +34,14 @@ const OPTIONS: Option[] = [
 
 export const Default: Story = {
  render: () => (
- <ListBox.Root
- options={OPTIONS}
- onSelect={(key: string) => console.log(key)}
- >
- <ListBox.Trigger />
- <ListBox.Content />
- </ListBox.Root>
+ <div className="w-56">
+ <ListBox.Root
+ options={OPTIONS}
+ onSelect={(key: string) => console.log(key)}
+ >
+ <ListBox.Trigger />
+ <ListBox.Content />
+ </ListBox.Root>
+ </div>
  ),
 };
diff --git a/src/components/list-box/list-box.tsx b/src/components/list-box/list-box.tsx
@@ -103,7 +103,7 @@ const Content: FC = () => {
  <section
  {...props}
  {...contentProps}
- className="flex min-w-40 flex-col rounded-xl border border-borderSecondary bg-bgBase py-2 shadow-xl"
+ className="flex max-h-48 min-w-56 flex-col overflow-y-auto rounded-xl border border-borderSecondary bg-bgBase py-2 shadow-xl"
  >
  {options.map(({ key, label }, idx) => (
  <Item key={key} label={label} index={idx} />