choerodon-ui/es/cascader/index.d.ts

An enterprise-class UI design language and React-based implementation

import React, { Component, CSSProperties, MouseEventHandler, ReactElement, ReactNode } from 'react';
import Input from '../input';
import { Size } from '../_util/enum';
import ConfigContext, { ConfigContextValue } from '../config-provider/ConfigContext';
export interface CascaderOptionType {
    value?: string;
    label?: React.ReactNode;
    disabled?: boolean;
    children?: Array<CascaderOptionType>;
    [key: string]: any;
    __IS_FILTERED_OPTION?: boolean;
}
export interface FieldNamesType {
    value?: string;
    label?: string;
    children?: string;
}
export interface FilledFieldNamesType {
    value: string;
    label: string;
    children: string;
}
export declare type CascaderExpandTrigger = 'click' | 'hover';
export interface ShowSearchType {
    filter?: (inputValue: string, path: CascaderOptionType[], names: FilledFieldNamesType) => boolean;
    render?: (inputValue: string, path: CascaderOptionType[], prefixCls: string | undefined, names: FilledFieldNamesType) => React.ReactNode;
    sort?: (a: CascaderOptionType[], b: CascaderOptionType[], inputValue: string, names: FilledFieldNamesType) => number;
    matchInputWidth?: boolean;
}
export declare enum MenuMode {
    single = "single",
    multiple = "multiple"
}
export declare type CascaderLocale = any;
export interface CascaderProps {
    /** 可选项数据源 */
    options: CascaderOptionType[];
    /** 默认的选中项 */
    defaultValue?: string[];
    /** 指定选中项 */
    value?: string[];
    /** 选择完成后的回调 */
    onChange?: (value: string[], selectedOptions?: CascaderOptionType[]) => void;
    /** 选择后展示的渲染函数 */
    displayRender?: (label: string[], selectedOptions?: CascaderOptionType[]) => ReactNode;
    /** 自定义样式 */
    style?: CSSProperties;
    /** 自定义类名 */
    className?: string;
    /** 自定义浮层类名 */
    popupClassName?: string;
    /** 浮层预设位置：`bottomLeft` `bottomRight` `topLeft` `topRight` */
    popupPlacement?: string;
    /** 输入框占位文本 */
    placeholder?: string;
    /** 输入框大小，可选 `large` `default` `small` */
    size?: Size;
    /** 禁用 */
    disabled?: boolean;
    /** 是否支持清除 */
    allowClear?: boolean;
    showSearch?: boolean | ShowSearchType;
    notFoundContent?: ReactNode;
    loadData?: (selectedOptions?: CascaderOptionType[]) => void;
    /** 次级菜单的展开方式，可选 'click' 和 'hover' */
    expandTrigger?: CascaderExpandTrigger;
    /** 当此项为 true 时，点选每级菜单选项值都会发生变化 */
    changeOnSelect?: boolean;
    /** 浮层可见变化时回调 */
    onPopupVisibleChange?: (popupVisible: boolean) => void;
    prefixCls?: string;
    inputPrefixCls?: string;
    getPopupContainer?: (triggerNode?: HTMLElement) => HTMLElement;
    popupVisible?: boolean;
    fieldNames?: FieldNamesType;
    label?: ReactNode;
    /** 单框弹出形式切换 */
    menuMode?: MenuMode;
    /** 由于渲染在body下可以方便按照业务配置弹出框的大小 */
    singleMenuStyle?: CSSProperties;
    /** 由于渲染在body下可以方便按照业务配置超出大小样式和最小宽度等 */
    singleMenuItemStyle?: CSSProperties;
    /** 设置需要的提示问题配置 */
    singlePleaseRender?: ({ key, className, text }: {
        key: string;
        className: string;
        text: string;
    }) => ReactElement<any>;
    /** 头部可以渲染出想要的tab样子 */
    singleMenuItemRender?: (title: string) => ReactElement<any>;
}
export interface CascaderState {
    inputFocused: boolean;
    inputValue: string;
    value: string[];
    popupVisible: boolean | undefined;
    flattenOptions: CascaderOptionType[][] | undefined;
}
export default class Cascader extends Component<CascaderProps, CascaderState> {
    static displayName: string;
    static get contextType(): typeof ConfigContext;
    static defaultProps: {
        placeholder: string;
        transitionName: string;
        popupPlacement: string;
        options: never[];
        disabled: boolean;
        allowClear: boolean;
        notFoundContent: string;
        menuMode: MenuMode;
    };
    context: ConfigContextValue;
    cachedOptions: CascaderOptionType[];
    private input;
    constructor(props: CascaderProps);
    componentWillReceiveProps(nextProps: CascaderProps): void;
    handleChange: (value: any, selectedOptions: CascaderOptionType[]) => void;
    handlePopupVisibleChange: (popupVisible: boolean) => void;
    handleInputBlur: () => void;
    handleInputClick: MouseEventHandler<HTMLInputElement>;
    handleKeyDown: (e: React.KeyboardEvent<HTMLInputElement>) => void;
    handleInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
    clearSelection: MouseEventHandler<HTMLElement>;
    setValue: (value: string[], selectedOptions?: CascaderOptionType[]) => void;
    getLabel(): any;
    flattenTree(options: CascaderOptionType[], changeOnSelect: boolean | undefined, fieldNames: FieldNamesType | undefined, ancestor?: CascaderOptionType[]): CascaderOptionType[][];
    generateFilteredOptions(prefixCls: string | undefined): CascaderOptionType[];
    focus(): void;
    blur(): void;
    saveInput: (node: Input) => void;
    render(): JSX.Element;
}