import { forwardRef } from 'react';
import type { KeeniconsProps } from './types';

function joinClasses(...args: string[]): string {
  return args.join(' ');
}

export const KeenIcon = forwardRef<HTMLElement, KeeniconsProps>((props, ref) => {
  const { icon, variant = 'filled', className = '', size = 'md', ...rest } = props;

  return (
    <i
      ref={ref}
      {...rest}
      className={joinClasses(`ki-${variant}`, `ki-${icon}`, `ki-${size}`, className)}
    />
  );
});

KeenIcon.displayName = 'KeenIcon';