shadcn-ui Proper way for Input with icon
发布时间:2024-03-20浏览次数:0
支持注册ChatGPT Plus的OneKey虚拟卡
绑定Apple Pay、Google Pay、支付宝和微信支付进行日常消费
注册和了解更多 ->
silver
export type SearchProps = React.InputHTMLAttributes<HTMLInputElement>; const Search = React.forwardRef<HTMLInputElement, InputProps>( ({ className, ...props }, ref) => { return ( <div className={cn( "flex h-10 items-center rounded-md border border-input bg-white pl-3 text-sm ring-offset-background focus-within:ring-1 focus-within:ring-ring focus-within:ring-offset-2", className, )} > <SearchIcon className="h-[16px] w-[16px]" /> <input {...props} type="search" ref={ref} className="w-full p-2 placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50" /> </div> ); }, ); Search.displayName = "Search"; export { Search };
扫描二维码查看更多内容