@cainiaofe/cn-ui-m
Version:
131 lines (130 loc) • 3.81 kB
TypeScript
import React, { ReactNode } from 'react';
import type { CnPickerProps, CnPickerValue } from '@/components/cn-picker/types/types';
import type { CnPickerRef } from "../../cn-picker/types/cn-picker-ref";
import type { CnPickerActions } from "../../cn-picker/types/cn-picker-actions";
import { CnPickerValueExtend } from "../../cn-picker-view/types/cn-picker-value-extend";
import { NativeProps } from "../../../utils/with-native-props";
import type { CnDatePickerFilter } from '../utils/date-picker-utils';
import { IPrecision } from '../types';
export type CnDatePickerRef = CnPickerRef;
export type GetContainer = HTMLElement | (() => HTMLElement) | null;
export interface CnDatePickerViewProps {
/**
* 取消事件的回调
*/
onCancel?: () => void;
/**
* 关闭事件的回调
*/
onClose?: () => void;
/**
* 点击背景蒙层后是否关闭
*/
closeOnMaskClick?: boolean;
/**
* 是否显示
*/
visible?: boolean;
/**
* 确定按钮的文字
*/
confirmText?: React.ReactNode;
/**
* 取消按钮的文字
*/
cancelText?: React.ReactNode;
/**
* 指定挂载的 HTML 节点，默认为 body，如果为 null 的话，会渲染到当前节点
*/
getContainer?: GetContainer;
/**
* 是否加载状态
*/
loading?: boolean;
/**
* 加载状态的内容
*/
loadingContent?: React.ReactNode;
/**
* 完全展示后触发
*/
afterShow?: () => void;
/**
* 完全关闭后触发
*/
afterClose?: () => void;
/**
* 点击事件的回调
*/
onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
/**
* 标题
*/
title?: React.ReactNode;
/**
* 所选项的渲染函数
*/
children?: (value: Date | null, actions: CnPickerActions) => ReactNode;
/**
* 选中值
*/
defaultValue?: Date | null;
/**
* 不可见时卸载内容
*/
destroyOnClose?: boolean;
/**
* 过滤可供选择的时间
*/
filter?: CnDatePickerFilter;
/**
* 强制渲染内容
*/
forceRender?: boolean;
/**
* 最小值
*/
min?: Date;
/**
* 最大值
*/
max?: Date;
/**
* 是否允许通过鼠标滚轮进行选择
*/
mouseWheel?: boolean;
/**
* 确认时触发
*/
onConfirm?: (value: CnPickerValue[], extend: CnPickerValueExtend) => void;
/**
* 选项改变时触发
*/
onSelect?: (value: CnPickerValue[], extend: CnPickerValueExtend) => void;
/**
* 精度
*/
precision?: IPrecision;
/**
* 自定义渲染每列展示的内容。其中 type 参数为 precision 中的任意值，data 参数为默认渲染的数字
*/
renderLabel?: (type: IPrecision, data: number) => ReactNode;
/**
* 选中值
*/
value?: Date | null;
}
export type CnDatePickerPropsBase = Pick<CnPickerProps, 'onCancel' | 'onClose' | 'closeOnMaskClick' | 'visible' | 'confirmText' | 'cancelText' | 'getContainer' | 'loading' | 'loadingContent' | 'afterShow' | 'afterClose' | 'onClick' | 'title' | 'stopPropagation' | 'style' | 'mouseWheel' | 'forceRender' | 'destroyOnClose'> & {
value?: Date | null;
defaultValue?: Date | null;
onSelect?: (value: Date) => void;
onConfirm?: (value: Date) => void;
min?: Date;
max?: Date;
precision?: IPrecision;
children?: (value: Date | null, actions: CnPickerActions) => ReactNode;
renderLabel?: (type: IPrecision, data: number) => ReactNode;
filter?: CnDatePickerFilter;
} & NativeProps;
declare const CnDatePickerView: React.ForwardRefExoticComponent<CnDatePickerViewProps & React.RefAttributes<any>>;
export { CnDatePickerView };