"use client";

type FieldProps = {
  label: string;
  error?: string;
  required?: boolean;
  children: React.ReactNode;
};

export function Field({ label, error, required, children }: FieldProps) {
  return (
    <label className="block">
      <span className="block text-sm font-bold text-slate-700 mb-1">
        {label}
        {required ? <span className="text-red-600"> *</span> : null}
      </span>
      {children}
      {error ? <span className="text-xs text-red-600 mt-1 block">{error}</span> : null}
    </label>
  );
}