27 lines
1010 B
TypeScript
27 lines
1010 B
TypeScript
|
|
"use client"
|
||
|
|
|
||
|
|
import * as React from "react"
|
||
|
|
import { Combobox as BaseCombobox } from "@base-ui/react/combobox"
|
||
|
|
import { cn } from "@/lib/utils"
|
||
|
|
|
||
|
|
export type ComboboxItemProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Item> & {
|
||
|
|
className?: string
|
||
|
|
}
|
||
|
|
|
||
|
|
const BaseComboboxItem = BaseCombobox.Item as React.ElementType
|
||
|
|
|
||
|
|
export const ComboboxItem = React.forwardRef<HTMLElement, ComboboxItemProps>(
|
||
|
|
({ className, ...props }, ref) => (
|
||
|
|
<BaseComboboxItem
|
||
|
|
ref={ref}
|
||
|
|
className={cn(
|
||
|
|
"grid cursor-default grid-cols-[1rem_1fr] items-center gap-2 p-2 text-sm leading-4 outline-none select-none data-highlighted:relative data-highlighted:z-0 data-highlighted:text-white data-highlighted:before:absolute data-highlighted:before:inset-0 data-highlighted:before:z-[-1] data-highlighted:before:bg-neutral-950 dark:data-highlighted:text-neutral-950 dark:data-highlighted:before:bg-white",
|
||
|
|
className,
|
||
|
|
)}
|
||
|
|
{...props}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
)
|
||
|
|
|
||
|
|
ComboboxItem.displayName = "ComboboxItem"
|