import { TAny } from '@flatbiz/utils';
import { CSSProperties, ReactElement, ReactNode } from 'react';

export interface EditableFieldProps {
	className?: string;
	style?: CSSProperties;
	editRender: ReactElement | ((data: {
		value?: TAny;
		onChange?: (data?: TAny) => void;
	}) => ReactElement);
	viewRender?: (value?: TAny) => ReactNode;
	value?: TAny;
	onChange?: (data?: TAny) => void;
	placeholderValue?: string;
	/** edit 区域是否铺满，showEditableIcon=false 无效  */
	isEditFull?: boolean;
	/** 只读状态 */
	readonly?: boolean;
	/** 显示为编辑状态 */
	showEditable?: boolean;
	/** 是否显示编辑、确认、取消操作icon，默认值：true */
	showEditableIcon?: boolean;
	/** 点击编辑按钮，操作前，返回reject不会开启编辑效果 */
	onClickEditIconPre?: (value?: TAny) => Promise<void>;
	onEditCallback?: (value?: TAny) => void;
	/** 点击确定按钮，操作前，返回reject不会执行确定功能 */
	onClickConfirmIconPre?: (value?: TAny, preValue?: TAny) => Promise<void>;
	onConfirmCallback?: (value?: TAny, preValue?: TAny) => void;
	/** 组件操作Icon配置 */
	iconConfig?: {
		editIcon?: (options: {
			onClick: () => void;
		}) => ReactElement;
		confirmIcon?: (options: {
			onClick: () => void;
		}) => ReactElement;
		cancelIcon?: (options: {
			onClick: () => void;
		}) => ReactElement;
	};
}
/**
 * 可编辑字段组件
 * @param props
 * @returns
 * ```
 * 字段渲染有两种状态
 * 1. 只读：如果value类型为复杂格式，必须要通过【viewRender】来进行处理操作，转成简单数据类型
 * 2. 编辑：参数value的格式要求必须满足编辑组件入参value要求
 * 3. 可自定义编辑Icon、确定Icon、取消Icon
 * 4. 可拦截编辑操作、确定操作
 * ```
 */
export declare const EditableField: (props: EditableFieldProps) => any;

export {};