import { Cascader } from 'antd';
import type { DefaultOptionType } from 'antd/es/cascader';
import { PROVINCE_CITY_OPTIONS } from '../lib/china-region';

type ChinaProvinceCityCascaderProps = {
  value?: string[];
  onChange?: (codes: string[]) => void;
  disabled?: boolean;
  placeholder?: string;
};

export default function ChinaProvinceCityCascader({
  value,
  onChange,
  disabled,
  placeholder = '请选择省 / 市',
}: ChinaProvinceCityCascaderProps) {
  return (
    <Cascader
      options={PROVINCE_CITY_OPTIONS as DefaultOptionType[]}
      value={value}
      onChange={(codes) => onChange?.((codes ?? []) as string[])}
      disabled={disabled}
      placeholder={placeholder}
      showSearch={{
        filter: (input, path) =>
          path.some((option) =>
            String(option.label ?? '').toLowerCase().includes(input.toLowerCase()),
          ),
      }}
      changeOnSelect={false}
    />
  );
}