41 lines
825 B
TypeScript
41 lines
825 B
TypeScript
import type { ReactNode } from "react";
|
|
|
|
import {
|
|
cn,
|
|
fieldErrorClass,
|
|
fieldHelpClass,
|
|
fieldLabelClass,
|
|
} from "@/lib/ui/variants";
|
|
|
|
interface FieldProps {
|
|
label: string;
|
|
children: ReactNode;
|
|
htmlFor?: string;
|
|
help?: ReactNode;
|
|
error?: ReactNode;
|
|
required?: boolean;
|
|
className?: string;
|
|
}
|
|
|
|
export function Field({
|
|
label,
|
|
children,
|
|
htmlFor,
|
|
help,
|
|
error,
|
|
required = false,
|
|
className,
|
|
}: FieldProps) {
|
|
const labelText = required ? `${label} *` : label;
|
|
return (
|
|
<div className={cn("space-y-1.5", className)}>
|
|
<label htmlFor={htmlFor} className={fieldLabelClass()}>
|
|
{labelText}
|
|
</label>
|
|
{children}
|
|
{error ? <p className={fieldErrorClass()}>{error}</p> : null}
|
|
{!error && help ? <p className={fieldHelpClass()}>{help}</p> : null}
|
|
</div>
|
|
);
|
|
}
|