"use client";

import { CITIES } from "@/config/home.config";

interface CitySelectProps {
  value: string;
  onChange: (v: string) => void;
  className?: string;
  required?: boolean;
}

export default function CitySelect({ value, onChange, className = "", required }: CitySelectProps) {
  return (
    <select
      value={value}
      onChange={(e) => onChange(e.target.value)}
      required={required}
      className={`form-input appearance-none ${value ? "text-stone-800 dark:text-stone-100" : "text-stone-400 dark:text-stone-500"} ${className}`}
    >
      <option value="" disabled>请选择城市</option>
      {CITIES.map((c) => (
        <option key={c} value={c}>{c}</option>
      ))}
    </select>
  );
}