import { VNode } from 'vue';
import { ElementUIComponent, ElementUIComponentSize } from './component';
import { CascaderOption, CascaderProps, CascaderNode } from './cascader-panel';

export type CascaderOption = CascaderOption;

export type CascaderProps<V, D> = CascaderProps<V, D>;

export type CascaderNode<V, D> = CascaderNode<V, D>;

export interface CascaderSlots {
  /** Custom label content */
  default: VNode[];

  /** Empty content when no option matches */
  empty: VNode[];

  [key: string]: VNode[];
}

/** Cascader Component */
export declare class ElCascader<V = any, D = CascaderOption> extends ElementUIComponent {
  /** Data of the options */
  options: CascaderOption[];

  /** Configuration options */
  props: CascaderProps<V, D>;

  /** Selected value */
  value: V | V[];

  /** Size of Input */
  size: ElementUIComponentSize;

  /** Input placeholder */
  placeholder: string;

  /** Whether Cascader is disabled */
  disabled: boolean;

  /** Whether selected value can be cleared */
  clearable: boolean;

  /** Whether to display all levels of the selected value in the input */
  showAllLevels: boolean;

  /** Whether to collapse selected tags in multiple selection mode */
  collapseTags: boolean;

  /** Separator of option labels */
  separator: string;

  /** Whether the options can be searched */
  filterable: boolean;

  /** filter method to match options according to input keyword */
  filterMethod: (node: CascaderNode<V, D>, keyword: string) => boolean;

  /** Debounce delay when typing filter keyword, in millisecond */
  debounce: number;

  /** Custom class name for Cascader's dropdown */
  popperClass: string;

  /** Hook function before filtering with the value to be filtered as its parameter */
  beforeFilter: (value: string) => boolean | Promise<any>;

  $slots: CascaderSlots;
}