Skip to content

Commit

Permalink
fix: Items in combobox have zero height (#4737)
Browse files Browse the repository at this point in the history
## Description


![image](https://github.com/user-attachments/assets/64314411-1dd5-49c2-84b0-23815dabb88f)

That's because LI items collapsed under Flex

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
0000)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
  • Loading branch information
istarkov authored Jan 10, 2025
1 parent b148e7b commit b09f869
Showing 1 changed file with 3 additions and 6 deletions.
9 changes: 3 additions & 6 deletions packages/design-system/src/components/combobox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ import { Box } from "./box";
import { Flex } from "./flex";
import { NestedInputButton } from "./nested-input-button";
import { InputField } from "./input-field";
import { Grid } from "./grid";

export const ComboboxListbox = styled(
"ul",
Expand All @@ -62,13 +63,9 @@ export const ComboboxScrollArea = forwardRef(
) => {
return (
<ScrollArea css={{ order: 1 }} {...props}>
<Flex
ref={forwardRef}
direction="column"
css={{ maxHeight: theme.spacing[34] }}
>
<Grid ref={forwardRef} css={{ maxHeight: theme.spacing[34] }}>
{children}
</Flex>
</Grid>
</ScrollArea>
);
}
Expand Down

0 comments on commit b09f869

Please sign in to comment.