import { CSSProperties, Slot, VNode } from 'vue'
import { BaseProps, OptionKeys, OptionProps } from './index'

/**
 * 级联选择的属性
 */
export interface CascaderProps extends BaseProps {
	/**
	 * 是否支持清除
	 */
	allowClear?: boolean
	/**
	 * 自动获取焦点
	 */
	autofocus?: boolean
	/**
	 * 当此项为 true 时，点选每级菜单选项值都会发生变化，具体见上面的演示
	 */
	changeOnSelect?: boolean

	/**
	 * 次级菜单的展开方式，可选 'click' 和 'hover'
	 */
	expandTrigger?: 'click' | 'hover'
	/**
	 * 自定义 options 中 label name children 的字段
	 */
	fieldNames?: OptionKeys
	/**
	 * 当下拉列表为空时显示的内容
	 */
	notFoundContent?: string | Slot
	/**
	 * 可选项数据源
	 */
	options?: Array<OptionProps> | Array<object>
	/**
	 * 在选择框中显示搜索框
	 */
	showSearch?: boolean | object
	/**
	 * 输入框大小，可选 large default small
	 */
	size?: 'large' | 'default' | 'small'
	/**
	 * 自定义的选择框后缀图标
	 */
	suffixIcon?: string | VNode | Slot
	/**
	 * 最多显示多少个 tag，响应式模式会对性能产生损耗
	 */
	maxTagCount?: number | 'responsive'
	/**
	 * 自定义浮层类名
	 */
	dropdownClassName?: string
	/**
	 * 自定义浮层样式	CSSProperties
	 */
	dropdownStyle?: CSSProperties
	/**
	 * 控制浮层显隐
	 */
	open?: boolean
	/**
	 * 浮层预设位置：
	 */
	placement?: 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight'
	/**
	 * 支持多选节点
	 */
	multiple?: boolean
	/**
	 * 设置搜索的值，需要与 showSearch 配合使用
	 */
	searchValue?: string
	/**
	 * 是否根据输入项进行筛选。当其为一个函数时，会接收 inputValue option 两个参数，当 option 符合筛选条件时，应返回 true，反之则返回 false。
	 */
	filterOption?: boolean | ((inputValue: string, option: object) => boolean)
	/**
	 * 文本框值变化时回调
	 */
	onSearch?: (value: string) => void
	/**
	 * 额外需要返回的字段
	 */
	extraNames?: CascaderExtraProps
}

export interface CascaderExtraProps {
	// 拼接后的label
	label?: string
	// 拼接后的value
	value?: string
	// 最后的那个选项
	option?: string
	// 所有选中的选项
	options?: string
}