import { VNode, CreateElement } from 'vue';
import { ElementUIComponent } from './component';

/** Trigger mode of expanding current item */
export type ExpandTrigger = 'click' | 'hover';

/** Cascader Option */
export interface CascaderOption {
  label: string;
  value: any;
  children?: CascaderOption[];
  disabled?: boolean;
  leaf?: boolean;
}

/** Cascader Props */
export interface CascaderProps<V, D> {
  expandTrigger?: ExpandTrigger;
  multiple?: boolean;
  checkStrictly?: boolean;
  emitPath?: boolean;
  lazy?: boolean;
  lazyLoad?: (node: CascaderNode<V, D>, resolve: Resolve<D>) => void;
  value?: string;
  label?: string;
  children?: string;
  disabled?: string;
  leaf?: string;
}

/** Cascader Node */
export interface CascaderNode<V, D> {
  uid: number;
  data: D;
  value: V;
  label: string;
  level: number;
  isDisabled: boolean;
  isLeaf: boolean;
  parent: CascaderNode<V, D> | null;
  children: CascaderNode<V, D>[];
  config: CascaderProps<V, D>;
}

type Resolve<D> = (dataList?: D[]) => void;

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

  [key: string]: VNode[];
}

/** CascaderPanel Component */
export declare class ElCascaderPanel<V = any, D = CascaderOption> extends ElementUIComponent {
  /** Selected value */
  value: V | V[];

  /** Data of the options */
  options: D[];

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

  /** Whether to add border */
  border: boolean;

  /** Render function of custom label content */
  renderLabel: (h: CreateElement, context: { node: CascaderNode<V, D>; data: D }) => VNode;

  $slots: CascaderPanelSlots;
}