21 lines
773 B
TypeScript
21 lines
773 B
TypeScript
|
import { ReactNode } from "react";
|
||
|
|
|
||
|
|
type FormFieldProps = {
|
||
|
|
label: string;
|
||
|
|
hint?: string;
|
||
|
|
children: ReactNode;
|
||
|
|
className?: string;
|
||
|
|
};
|
||
|
|
|
||
|
|
export function FormField({ label, hint, children, className = "" }: FormFieldProps) {
|
||
|
|
return (
|
||
|
|
<label className={`block space-y-1.5 ${className}`}>
|
||
|
|
<span className="block text-xs font-black uppercase text-gray-400">{label}</span>
|
||
|
|
{children}
|
||
|
|
{hint ? <span className="block text-xs font-bold text-gray-400">{hint}</span> : null}
|
||
|
|
</label>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export const inputClassName = "w-full rounded-2xl border border-gray-200 bg-white px-4 py-3 text-sm font-semibold text-gray-950 outline-none transition focus:border-[#0F766E] focus:ring-2 focus:ring-[#0F766E]/10 disabled:bg-gray-50 disabled:text-gray-400";
|