import { ReactNode } from "react";

type DividerProps = {
  size?: "fullWidth" | "middle" | "inset";
  children?: ReactNode;
  className?: string;
};

export default function Divider({
  size = "fullWidth",
  children,
  className = "",
}: DividerProps) {
  const getWidthClass = () => {
    switch (size) {
      case "fullWidth":
        return "w-full";
      case "middle":
        return "w-1/2 mx-auto";
      case "inset":
        return "w-1/3 ml-6";
      default:
        return "w-full";
    }
  };

  if (children) {
    return (
      <div
        className={`flex items-center gap-4 text-md text-dark-700 dark:text-primary-100 nt-medium ${getWidthClass()} ${className}`}
      >
        <div className="flex-1 h-px bg-gradient-to-r from-transparent via-primary-600 to-transparent rounded-full opacity-70" />
        <span className="whitespace-nowrap">{children}</span>
        <div className="flex-1 h-px bg-gradient-to-r from-transparent via-primary-600 to-transparent rounded-full opacity-70" />
      </div>
    );
  }

  return (
    <div
      className={`h-px bg-gradient-to-r from-transparent via-dark-300 to-transparent rounded-full opacity-70 ${getWidthClass()} ${className}`}
    />
  );
}


