fix(base): make property type-picker popover scrollable with responsive width

This commit is contained in:
Philipinho
2026-04-27 02:20:42 +01:00
parent adae526627
commit 8aabf86abb
@@ -231,7 +231,6 @@ export function CreatePropertyPopover({ pageId, properties, onPropertyCreated }:
onClose={noop} onClose={noop}
position="bottom-start" position="bottom-start"
shadow="md" shadow="md"
width={selectedType === "formula" ? 460 : 320}
withinPortal withinPortal
> >
<Popover.Target> <Popover.Target>
@@ -248,14 +247,24 @@ export function CreatePropertyPopover({ pageId, properties, onPropertyCreated }:
p={0} p={0}
onClick={(e) => e.stopPropagation()} onClick={(e) => e.stopPropagation()}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}
style={{ zIndex: 300 }} style={{
zIndex: 300,
minWidth: selectedType === "formula" ? 460 : 320,
maxWidth: "calc(100vw - 32px)",
}}
> >
{panel === "typePicker" && ( {panel === "typePicker" && (
<Stack gap={0} p={4}> <Stack gap={0} p={4}>
<PropertyTypePicker <ScrollArea.Autosize
onSelect={handleTypeSelect} mah="min(60vh, 400px)"
showSearch scrollbarSize={6}
/> offsetScrollbars
>
<PropertyTypePicker
onSelect={handleTypeSelect}
showSearch
/>
</ScrollArea.Autosize>
</Stack> </Stack>
)} )}
{panel === "configure" && selectedType === "formula" && ( {panel === "configure" && selectedType === "formula" && (