@cainiaofe/cn-ui-m/es/components/cn-select/types.d.ts

## 在线文档

import { ReactNode } from 'react';
import type { BasicComponentProps, BasicSizeType } from '../../types';
import type { CnSelectDrawerProps } from '../select-drawer/types';
export declare type SelectMode = 'single' | 'multiple';
export interface CnSelectOptionProps extends BasicComponentProps {
    /**
     * 选项值
     */
    value?: any;
    /**
     * 选项文本
     */
    label?: string;
    /**
     * 选项标题
     */
    title?: string;
    /**
     * 是否禁用
     */
    disabled?: boolean;
    /**
     * 是否选中
     */
    selected?: boolean;
    /**
     * 选项点击事件
     */
    onClick?: (value: any) => void;
}
export interface CnSelectProps extends BasicComponentProps, Omit<CnSelectDrawerProps, 'content'> {
    /**
     * 字段name
     */
    name?: string;
    /**
     * 当前值，用于受控模式
     */
    value?: any;
    /**
     * 初始的默认值
     */
    defaultValue?: any;
    /**
     * value 使用对象类型 {value, label}, 同时 onChange 第一个参数返回也修改为 dataSource 中的对象
     */
    useDetailValue?: boolean;
    /**
     * 是否展示清除按钮
     */
    hasClear?: boolean;
    /**
     * 开启本地搜索过滤, 当 hasSearch=true 时，filterLocal 默认为 true ，如果要处理远程数据源，须关闭此项
     */
    filterLocal?: boolean;
    /**
     * 单选时自动确认
     */
    autoConfirm?: boolean;
    /**
     * 已选项置顶
     */
    stickyOnTop?: boolean;
    /**
     * 自定义本地搜索过滤函数，返回一个 boolean 确定是否保留当前值，仅当 filterLocal=true 时生效. val: 当前输入搜索值； item: 待渲染节点数据项
     */
    filter?: (key: string, item?: CnSelectOptionProps) => boolean;
    /**
     * 传入的数据源，可以动态渲染子项
     */
    dataSource?: CnSelectOptionProps[] | string[];
    /**
     * 选择框类型
     */
    type?: 'normal' | 'inverse';
    /**
     * 渲染类型。可选值：normal - 常规；tag-value - 仅展示选中值为 tag；tag - 选中值和选项皆为 tag
     */
    displayType?: 'normal' | 'tag' | 'tag-value';
    /**
     * 类型。单选还是多选
     */
    mode?: SelectMode;
    /**
     * 尺寸
     */
    size?: BasicSizeType;
    /**
     * 是否禁用
     */
    disabled?: boolean;
    /**
     * 是否为只读态
     */
    readOnly?: boolean;
    /**
     * 是否为 Search 模式
     */
    hasSearch?: boolean;
    /**
     * 是否为 Search 模式（已废弃，不建议使用）
     */
    showSearch?: boolean;
    /**
     * 搜索框loading状态
     */
    searchLoading?: boolean;
    /**
     * 搜索框 Placeholder
     */
    searchPlaceholder?: string;
    /**
     * 是否为预览态
     */
    isPreview?: boolean;
    /**
     * 预览模式下的css类
     */
    previewClassName?: string;
    /**
     * 预览模式下的样式
     */
    previewStyle?: any;
    /**
     * 搜索结果是否可转为选项
     */
    transferSearchToOption?: boolean;
    /**
     * 对齐方式
     */
    align?: 'left' | 'right';
    /**
     * 预览态模式下渲染的内容 ,value 参数格式为 [{label:string,value:any}]
     */
    renderPreview?: (values: any, props: CnSelectProps) => ReactNode;
    /**
     * 用户搜索时回调，仅当 hasSearch=true 时，触发
     */
    onSearch?: (value?: string) => void;
    /**
     * 值改变时触发回调，value(s) 当前选中项的值；actionType 区分值为 change、clear；item(s) 选中项对象数据
     */
    onChange?: (value?: any, actionType?: string, items?: any) => void;
    /**
     * 点击清除按钮回调
     */
    onClear?: () => void;
    /**
     * 点击取消按钮或遮罩层触发回调。reason 可选值：mask - 遮罩层；cancel-button - 取消按钮
     */
    onCancel?: (reason?: string) => void;
    /**
     * transferSearchToOption为true时，添加选项的回调
     */
    onSearchAdd?: (searchValue?: string) => void;
    /**
     * 下拉选项可见状态变化时的回调，返回可见状态和触发可见变化的来源
     */
    onVisibleChange?: (visible: boolean, reason: string | undefined) => void;
    /**
     * 自定义选中项目渲染内容
     */
    renderSelection?: (selectedOptions: any[]) => any;
    /**
     * 自定义选项的渲染方法
     */
    renderItem?: (item: any) => ReactNode;
}