)}
- {children}
+ {autocomplete ? (
+
+ {children}
+
+ ) : (
+ }
+ className={styles.itemText}
+ data-slot='select-item-text'
+ >
+ {children}
+
+ )}
>
) : (
children
@@ -81,7 +93,7 @@ export function SelectItem({
{...props}
render={(renderProps, state) => (
- {multiple && }
+ {multiple && }
{element}
)}
diff --git a/packages/react/components/select/select.module.css b/packages/react/components/select/select.module.css
index b5f5ae2fb..049dfe411 100644
--- a/packages/react/components/select/select.module.css
+++ b/packages/react/components/select/select.module.css
@@ -22,6 +22,11 @@
overflow: auto;
}
+/* With alignItemWithTrigger, Base UI sizes the positioner and the popup must fill it. */
+.content[data-side="none"] {
+ max-height: none;
+}
+
.content[data-starting-style],
.content[data-ending-style] {
opacity: 0;
@@ -286,3 +291,8 @@
.hidden {
display: none;
}
+
+.itemText {
+ flex: 1;
+ min-width: 0;
+}