import { forwardRef, type SelectHTMLAttributes } from 'react';
import { inputVariants, type InputSize, type InputState } from '@lib/theme/variants';
import { cn } from '@lib/utils/cn';

export interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'size'> {
  size?: InputSize;
  state?: InputState;
}

/** Select — Input과 동일한 스타일 토큰 공유 */
export const Select = forwardRef<HTMLSelectElement, SelectProps>(
  ({ className, size, state, children, ...props }, ref) => {
    return (
      <select
        ref={ref}
        className={cn(inputVariants({ size, state }), 'cursor-pointer', className)}
        {...props}
      >
        {children}
      </select>
    );
  },
);
Select.displayName = 'Select';