Added new label input component

This commit is contained in:
Lucas Oliveira 2025-09-18 15:32:00 -03:00
parent 1d44fc4658
commit d77c3d2ea2

View file

@ -0,0 +1,40 @@
import { Info } from "lucide-react";
import { Input } from "./ui/input";
import { Label } from "./ui/label";
import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
export function LabelInput({
label,
helperText,
id,
required,
...props
}: {
label: string;
helperText: string;
id: string;
required: boolean;
} & React.InputHTMLAttributes<HTMLInputElement>) {
return (
<div className="space-y-2">
<Label
htmlFor={id}
className="text-mmd font-medium flex items-center gap-1"
>
{label}
{required && <span className="text-red-500">*</span>}
{helperText && (
<Tooltip>
<TooltipTrigger>
<Info className="w-3.5 h-3.5 text-muted-foreground" />
</TooltipTrigger>
<TooltipContent>{helperText}</TooltipContent>
</Tooltip>
)}
</Label>
<div className="relative">
<Input id={id} {...props} />
</div>
</div>
);
}