import type { CSSProperties } from "react";
import type { LucideProps } from "lucide-react";
import { resolveLucideIcon } from "@/components/lucide-icon/utils";

export type DynamicLucideIconProps = Omit<LucideProps, "color"> & {
  name?: string | null;
  iconComponent?: string | null;
  color?: string | null;
};

export function DynamicLucideIcon({
  name,
  iconComponent,
  color,
  className,
  size = 20,
  strokeWidth = 1.75,
  style,
  ...props
}: DynamicLucideIconProps) {
  const Icon = resolveLucideIcon(iconComponent ?? name);
  const iconStyle: CSSProperties = {
    ...style,
    ...(color ? { color } : {}),
  };

  return (
    <Icon
      aria-hidden={props["aria-label"] ? undefined : true}
      className={className}
      size={size}
      strokeWidth={strokeWidth}
      style={iconStyle}
      {...props}
    />
  );
}