import { StyleProp, ViewStyle, TextStyle } from 'react-native';
import type { RadioOption, RadioStyleConfig, RadioLayout } from '../DbRadio/DbRadio.types';
import type { DbTitlePairProps } from '../DbTitlePair/DbTitlePair.types';
/**
 * 弹窗模式
 * - input:  文本输入模式（类似订单备注）
 * - radio:  单选模式（类似选择退货原因）
 * - custom: 自定义模式（完全自定义弹窗内容）
 */
export type PopupFieldMode = 'input' | 'radio' | 'custom';
/** 自定义模式配置（mode='custom' 时生效） */
export interface PopupFieldCustomConfig {
    /**
     * 自定义弹窗内容渲染函数
     * 返回 ReactNode 作为弹窗的主体内容
     *
     * @example
     * customContent={(
     *   <View>
     *     <Text>自定义内容</Text>
     *     <Button title="确定" onPress={onConfirm} />
     *   </View>
     * )}
     */
    customContent?: React.ReactNode | ((props: {
        /** 确认回调，调用后关闭弹窗并触发 onConfirm */
        onConfirm: (value?: any) => void;
        /** 取消回调，调用后关闭弹窗并触发 onCancel */
        onCancel: () => void;
        /** 关闭弹窗（不触发任何回调） */
        onClose: () => void;
    }) => React.ReactNode);
    /**
     * 是否显示默认的底部操作栏（确定/取消按钮）
     * 默认为 false，由 customContent 内部自行控制
     */
    showActions?: boolean;
    /**
     * 自定义内容容器样式
     */
    contentStyle?: StyleProp<ViewStyle>;
}
/** 输入框配置（mode='input' 时生效） */
export interface PopupFieldInputConfig {
    /** 输入类型：单行 / 多行 */
    type?: 'text' | 'textarea';
    /** 占位文本 */
    placeholder?: string;
    /** 最大字符数 */
    maxLength?: number;
    /** 多行输入行数（type='textarea' 时生效） */
    rows?: number;
    /** 是否自动增高 */
    autoGrow?: boolean;
    /** 是否显示字数统计 */
    showCount?: boolean;
    /** 输入框样式 */
    inputStyle?: StyleProp<TextStyle>;
    /** 输入框容器样式 */
    inputContainerStyle?: StyleProp<ViewStyle>;
}
/** 单选配置（mode='radio' 时生效） */
export interface PopupFieldRadioConfig<T = string> {
    /** 选项列表 */
    options: RadioOption<T>[];
    /** 选择框位置 */
    layout?: RadioLayout;
    /** 尺寸 */
    size?: 'small' | 'medium' | 'large';
    /** 选中颜色 */
    activeColor?: string;
    /** 未选中颜色 */
    inactiveColor?: string;
    /** Radio 样式 */
    radioConfig?: RadioStyleConfig;
    /** 选项间距 */
    spacing?: number;
    /** 选项样式 */
    itemStyle?: StyleProp<ViewStyle>;
    /** 标签样式 */
    labelStyle?: StyleProp<TextStyle>;
}
/** 弹窗配置 */
export interface PopupFieldPopupConfig {
    /** 弹窗标题（默认取 title） */
    title?: string;
    /** 弹窗位置 */
    position?: 'center' | 'bottom';
    /** 弹窗高度（bottom 时有效） */
    height?: number | string;
    /** 弹窗最大高度 */
    maxHeight?: number | string;
    /** 是否显示关闭按钮 */
    closable?: boolean;
    /** 关闭按钮位置 */
    closeIconPosition?: 'top-left' | 'top-right';
    /** 确认按钮文本 */
    confirmText?: string;
    /** 取消按钮文本 */
    cancelText?: string;
    /** 是否显示底部操作栏 */
    showActions?: boolean;
    /** 是否圆角 */
    round?: boolean;
    /** 圆角大小 */
    borderRadius?: number;
    /** 弹窗样式 */
    popupStyle?: StyleProp<ViewStyle>;
    /** 内容区域样式 */
    contentStyle?: StyleProp<ViewStyle>;
}
/** DbPopupField 组件属性 */
export interface DbPopupFieldProps<T = string> {
    /** 模式：input=文本输入 radio=单选 */
    mode: PopupFieldMode;
    /** 当前值（受控） */
    value?: T;
    /** 默认值（非受控） */
    defaultValue?: T;
    /** 值变化回调（每次输入/选择时触发） */
    onChange?: (value: T) => void;
    /** 确认回调（点击确定按钮时触发） */
    onConfirm?: (value: T) => void;
    /** 取消回调 */
    onCancel?: () => void;
    /** 标题文本 */
    title: string;
    /** 占位文本（未选择时的副标题显示） */
    placeholder?: string;
    /** 自定义显示文本（覆盖自动生成的副标题） */
    displayText?: string | ((value?: T) => string);
    /**
     * 自定义右侧内容（完全覆盖默认的文本+箭头）
     * 传入后 displayText / placeholder / showArrow 等将被忽略
     * 适用于需要完全自定义右侧展示的场景
     *
     * @example
     * subtitleContent={
     *   <View style={{ flexDirection: 'row', alignItems: 'center' }}>
     *     <Text style={{ color: '#666' }}>极速退款</Text>
     *     <DbIcon name="chevron-forward" size={16} color="#999" />
     *   </View>
     * }
     */
    subtitleContent?: React.ReactNode;
    /** TitlePair 布局（默认 space-between） */
    titleLayout?: DbTitlePairProps['layout'];
    /** 是否必填 */
    required?: boolean;
    /** 是否禁用 */
    disabled?: boolean;
    /** 是否显示右侧箭头 */
    showArrow?: boolean;
    /** 右侧箭头颜色 */
    arrowColor?: string;
    /** 左侧额外元素 */
    leftExtra?: React.ReactNode;
    /** 是否显示分割线 */
    showDivider?: boolean;
    /** 主标题字号 */
    titleFontSize?: number;
    /** 主标题颜色 */
    titleColor?: string;
    /** 主标题字重 */
    titleFontWeight?: TextStyle['fontWeight'];
    /** 副标题（显示值）字号 */
    valueFontSize?: number;
    /** 副标题（显示值）颜色 */
    valueColor?: string;
    /** 占位文本颜色 */
    placeholderColor?: string;
    /** 输入框配置（mode='input' 时） */
    inputConfig?: PopupFieldInputConfig;
    /** 单选配置（mode='radio' 时） */
    radioConfig?: PopupFieldRadioConfig<T>;
    /** 自定义配置（mode='custom' 时） */
    customConfig?: PopupFieldCustomConfig;
    /** 弹窗配置 */
    popupConfig?: PopupFieldPopupConfig;
    /** 容器样式 */
    style?: StyleProp<ViewStyle>;
    /** TitlePair 样式 */
    titlePairStyle?: StyleProp<ViewStyle>;
    /** 内容区域内边距（触发行） */
    contentPadding?: number | {
        horizontal?: number;
        vertical?: number;
    };
}
/** DbPopupField Ref 接口 */
export interface DbPopupFieldRef {
    /** 打开弹窗 */
    open: () => void;
    /** 关闭弹窗 */
    close: () => void;
    /** 获取当前值 */
    getValue: () => any;
    /** 重置为默认值 */
    reset: () => void;
}