"use client";
import React, { FC, ReactNode } from "react";
import { twMerge } from "tailwind-merge";

interface LabelProps {
  htmlFor?: string;
  children: ReactNode;
  className?: string;
  required?: boolean;
}

const Label: FC<LabelProps> = ({ htmlFor, children, className , required }) => {
  return (
    <label
      htmlFor={htmlFor}
      className={twMerge(
        // Default classes that apply by default
        "mb-1.5 block text-sm font-medium text-secondary dark:text-gray-400",

        // User-defined className that can override the default margin
        className
      )}
    >
 
      {children}
      {required && <span className="text-red-500">*</span>}
    </label>
  );
};

export default Label;