Skip to content
6 changes: 5 additions & 1 deletion apps/web/src/components/BranchToolbarBranchSelector.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -336,11 +336,14 @@ export function BranchToolbarBranchSelector({
effectiveEnvMode,
resolvedActiveBranch,
});
const branchSelectorHighlightClassName =
"hover:bg-accent hover:text-accent-foreground data-selected:bg-accent data-selected:text-accent-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground";

function renderPickerItem(itemValue: string, index: number, style?: CSSProperties) {
if (checkoutPullRequestItemValue && itemValue === checkoutPullRequestItemValue) {
return (
<ComboboxItem
className={branchSelectorHighlightClassName}
hideIndicator
key={itemValue}
index={index}
Expand All @@ -366,6 +369,7 @@ export function BranchToolbarBranchSelector({
if (createBranchItemValue && itemValue === createBranchItemValue) {
return (
<ComboboxItem
className={branchSelectorHighlightClassName}
hideIndicator
key={itemValue}
index={index}
Expand Down Expand Up @@ -393,11 +397,11 @@ export function BranchToolbarBranchSelector({
: null;
return (
<ComboboxItem
className={branchSelectorHighlightClassName}
hideIndicator
key={itemValue}
index={index}
value={itemValue}
className={itemValue === resolvedActiveBranch ? "bg-accent text-foreground" : undefined}
style={style}
onClick={() => selectBranch(branch)}
>
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/components/ui/autocomplete.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ function AutocompleteItem({ className, children, ...props }: AutocompletePrimiti
return (
<AutocompletePrimitive.Item
className={cn(
"flex min-h-8 cursor-default select-none items-center rounded-sm px-2 py-1 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm",
"flex min-h-8 cursor-default select-none items-center rounded-sm px-2 py-1 text-base outline-none hover:bg-accent data-disabled:pointer-events-none data-selected:bg-accent/50 data-selected:text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm",
className,
)}
data-slot="autocomplete-item"
Expand Down
2 changes: 1 addition & 1 deletion apps/web/src/components/ui/combobox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -195,7 +195,7 @@ function ComboboxItem({
return (
<ComboboxPrimitive.Item
className={cn(
"grid min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default grid-cols-[1rem_1fr] items-center gap-2 rounded-sm py-1 ps-2 pe-4 text-base outline-none data-disabled:pointer-events-none data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
"grid min-h-8 in-data-[side=none]:min-w-[calc(var(--anchor-width)+1.25rem)] cursor-default grid-cols-[1rem_1fr] items-center gap-2 rounded-sm py-1 ps-2 pe-4 text-base outline-none hover:bg-accent data-disabled:pointer-events-none data-selected:bg-accent/50 data-selected:text-foreground data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:opacity-64 sm:min-h-7 sm:text-sm [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shared primitives missing hover:text-accent-foreground class

Medium Severity

The shared ComboboxItem and AutocompleteItem base styles add hover:bg-accent but omit hover:text-accent-foreground. The branch selector works around this by adding hover:text-accent-foreground via branchSelectorHighlightClassName, but other combobox consumers won't get the text color change on hover. This is inconsistent with the data-highlighted state which pairs bg-accent with text-accent-foreground. On Windows where data-highlighted may not activate on hover, these consumers will see a background change without the corresponding text color update.

Additional Locations (1)
Fix in Cursor Fix in Web

className,
)}
data-slot="combobox-item"
Expand Down