'use client';

import { QuestionParameterConfig } from '@/types/questionConfig';
import { SelectInput, RangeInput, TextInput, CheckboxInput } from './inputs';

interface ParameterInputProps {
  config: QuestionParameterConfig;
  value: string | number | boolean | string[];
  onChange: (value: string | number | boolean | string[]) => void;
  className?: string;
  disabled?: boolean;
}

export default function ParameterInput({ 
  config, 
  value, 
  onChange, 
  className = '',
  disabled = false 
}: ParameterInputProps) {
  const { type, label, options, min, max, step, placeholder, helpText, key } = config;

  switch (type) {
    case 'select':
      return (
        <SelectInput
          label={label}
          value={typeof value === 'string' || typeof value === 'number' ? value : undefined}
          defaultValue={typeof config.defaultValue === 'string' || typeof config.defaultValue === 'number' ? config.defaultValue : undefined}
          options={(options || []).filter(option => 
            typeof option.value === 'string' || typeof option.value === 'number'
          ).map(option => ({
            value: option.value as string | number,
            label: option.label
          }))}
          onChange={onChange}
          className={className}
          disabled={disabled}
          placeholder={placeholder}
          helpText={helpText}
        />
      );

    case 'range':
      return (
        <RangeInput
          label={label}
          value={typeof value === 'number' ? value : undefined}
          defaultValue={typeof config.defaultValue === 'number' ? config.defaultValue : undefined}
          min={min || 1}
          max={max || 10}
          step={step}
          onChange={onChange}
          className={className}
          disabled={disabled}
          valueUnit={helpText}
          showValue={true}
        />
      );

    case 'text':
      return (
        <TextInput
          label={label}
          value={typeof value === 'string' ? value : undefined}
          defaultValue={typeof config.defaultValue === 'string' ? config.defaultValue : undefined}
          onChange={onChange}
          className={className}
          disabled={disabled}
          placeholder={placeholder}
          helpText={helpText}
        />
      );

    case 'textarea':
      return (
        <TextInput
          label={label}
          value={typeof value === 'string' ? value : undefined}
          defaultValue={typeof config.defaultValue === 'string' ? config.defaultValue : undefined}
          onChange={onChange}
          className={className}
          disabled={disabled}
          placeholder={placeholder}
          helpText={helpText}
          isTextarea={true}
        />
      );

    case 'checkbox':
      return (
        <CheckboxInput
          label={label}
          value={typeof value === 'boolean' ? value : undefined}
          defaultValue={typeof config.defaultValue === 'boolean' ? config.defaultValue : undefined}
          onChange={onChange}
          className={className}
          disabled={disabled}
          helpText={helpText}
          id={key}
        />
      );

    default:
      return null;
  }
}