fix(ui): render select labels instead of values

This commit is contained in:
Jiayuan Zhang
2026-07-15 12:12:21 +08:00
parent b85bb71a58
commit 8d9a6d85e3
12 changed files with 120 additions and 18 deletions

View File

@@ -6,7 +6,22 @@ import { Select as SelectPrimitive } from "@base-ui/react/select"
import { cn } from "@multica/ui/lib/utils"
import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react"
const Select = SelectPrimitive.Root
type SelectProps<
Value,
Multiple extends boolean | undefined = false,
> = SelectPrimitive.Root.Props<Value, Multiple> & {
items: NonNullable<SelectPrimitive.Root.Props<Value, Multiple>["items"]>
}
/**
* Base UI renders the raw value unless Root receives an items label map.
* Keep items required so every select has a single source for value labels.
*/
function Select<Value, Multiple extends boolean | undefined = false>(
props: SelectProps<Value, Multiple>
) {
return <SelectPrimitive.Root {...props} />
}
function SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {
return (