fix(ui): align combobox radius with selects and support aria-label

This commit is contained in:
alejandrobailo
2026-06-29 16:48:24 +02:00
parent 80e2375e93
commit cc0fb9d2a5
+5 -2
View File
@@ -24,7 +24,7 @@ const comboboxTriggerVariants = cva("", {
variants: {
variant: {
default:
"w-full justify-between rounded-xl border border-border-neutral-secondary bg-bg-neutral-secondary hover:bg-bg-neutral-tertiary",
"w-full justify-between rounded-lg border border-border-neutral-secondary bg-bg-neutral-secondary hover:bg-bg-neutral-tertiary",
ghost:
"border-none bg-transparent shadow-none hover:bg-accent hover:text-foreground",
},
@@ -38,7 +38,7 @@ const comboboxContentVariants = cva("p-0", {
variants: {
variant: {
default:
"w-[calc(100vw-2rem)] max-w-md rounded-xl border border-border-neutral-secondary bg-bg-neutral-secondary shadow-md sm:w-full",
"w-[calc(100vw-2rem)] max-w-md rounded-lg border border-border-neutral-secondary bg-bg-neutral-secondary shadow-md sm:w-full",
ghost:
"w-[calc(100vw-2rem)] max-w-md rounded-lg border border-slate-400 bg-white sm:w-full dark:border-[#262626] dark:bg-[#171717]",
},
@@ -74,6 +74,7 @@ export interface ComboboxProps
showSelectedFirst?: boolean;
loading?: boolean;
loadingMessage?: string;
"aria-label"?: string;
}
export function Combobox({
@@ -92,6 +93,7 @@ export function Combobox({
showSelectedFirst = true,
loading = false,
loadingMessage = "Loading...",
"aria-label": ariaLabel,
}: ComboboxProps) {
const [open, setOpen] = useState(false);
@@ -112,6 +114,7 @@ export function Combobox({
<Button
variant="outline"
role="combobox"
aria-label={ariaLabel}
aria-expanded={open}
disabled={disabled}
className={cn(