@flatbiz/mobile

/// <reference types="node" /> /// <reference types="prop-types" /> /// <reference types="scheduler" /> import { LabelValueItem, TAny, TImageCompressOptions, TNoopDefine, TPlainObject } from '@flatbiz/utils'; import { CSSProperties, ChangeEvent, DetailedHTMLProps, FC, ImgHTMLAttributes, InputHTMLAttributes, MutableRefObject, ReactElement, ReactNode, RefObject, SyntheticEvent, TextareaHTMLAttributes } from 'react'; export interface NativeProps<S extends string = never> { className?: string; style?: CSSProperties & Partial<Record<S, string>>; } export interface CommonProps<S extends TPlainObject = TPlainObject> { className?: string; style?: CSSProperties & Partial<S>; } export interface CommonPropsWithChildren<S extends TPlainObject = TPlainObject> { className?: string; style?: CSSProperties & Partial<S>; children?: ReactNode | undefined; } declare function withNativeProps<P extends NativeProps>(props: P, element: ReactElement<P>): ReactElement<P, string | import("react").JSXElementConstructor<any>>; export type ArrowIconVarStyle = "--arrow-color"; export type ArrowDirection = "top" | "right" | "bottom" | "left"; export type ArrowIconProps = { direction?: ArrowDirection; fill?: "solid" | "outline" | "none"; disabled?: boolean; size?: number; onClick?: (e: any) => void; } & NativeProps<ArrowIconVarStyle>; export declare const ArrowIcon: (props: ArrowIconProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>; export type AutoCenterProps = CommonPropsWithChildren; /** * 1. 内容不够整行宽度时自动居中 * 2. 内容达到满宽后保持正常的左对齐 * @param props * @returns */ export declare const AutoCenter: (props: AutoCenterProps) => import("react/jsx-runtime").JSX.Element; export type BadgeVarStyle = { "--badge-background-color": CSSProperties["color"]; "--badge-text-color": CSSProperties["color"]; "--badge-top": number; "--badge-right": number; "--badge-font-size": CSSProperties["fontSize"]; }; export type BadgeProps = CommonPropsWithChildren<BadgeVarStyle> & { bgColor?: CSSProperties["color"]; content?: React.ReactNode; top?: number; right?: number; fontSize?: number; }; export declare const Badge: (props: BadgeProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>; /** * Button内置Var Style * ``` * 1. --button-color button主色系 * 2. --button-full-solid-bg-color button在solid填充模式下的背景色，默认值：--button-color * 3. --button-full-solid-text-color button在solid填充模式下的文字颜色，默认值：#fff * 4. --button-full-solid-loading-color button在solid填充模式下loading颜色，默认值：solid模式默认为白色，其他模式下为--button-color * 5. --button-full-solid-box-shadow button在solid填充模式下阴影设置，无默认值 * * 6. --button-full-outline-bg-color button在outline填充模式下背景色，默认值：#fff * 7. --button-full-outline-box-shadow button在outline填充模式下阴影设置，无默认值 * * 8. --button-border-radius button button边框圆角数值，默认值：10px * 9. --button-border-color button边框颜色，solid、outline模式下有效果 * ``` */ export type ButtonVarStyle = { "--button-color": CSSProperties["color"]; "--button-font-size": CSSProperties["fontSize"]; "--button-padding": CSSProperties["padding"]; "--button-full-solid-bg-color": CSSProperties["backgroundColor"]; "--button-full-solid-text-color": CSSProperties["color"]; "--button-full-solid-loading-color": CSSProperties["color"]; "--button-full-solid-box-shadow": CSSProperties["boxShadow"]; "--button-full-outline-bg-color": CSSProperties["backgroundColor"]; "--button-full-outline-box-shadow": CSSProperties["boxShadow"]; "--button-border-radius": CSSProperties["borderRadius"]; "--button-border-color": CSSProperties["borderColor"]; }; export type ButtonProps = CommonPropsWithChildren<ButtonVarStyle> & { type?: "default" | "primary" | "secondary" | "danger"; /** 填充模式 */ fill?: "solid" | "outline" | "none"; size?: "mini" | "small" | "middle" | "large"; onClick?: (e: any) => void | Promise<void>; disabled?: boolean; inline?: boolean; ellipsis?: boolean; beforeIcon?: ReactNode; afterIcon?: ReactNode; stopPropagation?: boolean; loading?: boolean; /** loading全局蒙层，默认值：false */ loadingMask?: boolean; /** 重复点击间隙，单位毫秒默认值：500 */ debounceDuration?: number; }; export declare const Button: (props: ButtonProps) => import("react/jsx-runtime").JSX.Element; export type DayTagItem = { date: string; topTag?: string; label?: string; bottomTag?: string; topTagColor?: string; labelColor?: string; bottomTagColor?: string; className?: string; disabled?: boolean; }; export type CalendarProps = { className?: string; style?: CSSProperties; /** * 周排布方式 * ``` * week1-first: 周一在第一位 * week7-first: 周日在第一位 * ``` */ weekType?: "week1-first" | "week7-first"; /** * 前后是否填满上一个月和下一个月数据 */ isFill?: boolean; minDate: string; maxDate: string; onDisabledClick?: (dayItem: TMonthDayItem) => void; /** * 选择类型，单选、双选 */ selectedType?: "two-select" | "one-select"; /** 隐藏月份标题 */ hideMonthTitle?: boolean; onPreChange?: (dayItem: TMonthDayItem) => Promise<void>; onChange: (dayInfo: string | string[]) => void; /** * 赋值后则为受控更新 */ value?: string | string[]; defaultValue?: string | string[]; selectedStartTag?: string; selectedEndTag?: string; /** * 配置日历标签，例如：[{ date: '2022-06-03', tag: '端午' }] */ dayTagList?: DayTagItem[]; onDayCellRender?: (dayItem: TMonthDayItem & { dayTagInfo?: DayTagItem; }) => ReactElement; tips?: string | ReactElement; onTips?: () => void; titleSticky?: boolean; /** 月份额外渲染 */ onMonthExtraRender?: (month: Date) => ReactElement; }; export type TMonthDayItem = { type?: "empty" | "prev" | "next"; label: string; week: number; date: string; inScope?: boolean; }; export type CalendarRefApi = { scrollToTarget: () => void; }; /** * 日历组件 * @param props * @returns * ``` * 1. 涉及到时间的格式均为：YYYY-MM-DD（包括：minDate、maxDate、value、defaultValue等） * 2. dayTagList 配置日历标签，例如：节假日显示 * 3. selectedType 选择类型，单选、双选；默认值：two-select * 4. weekType: 星期显示格式，周日是否显示在第一列；默认值：week7-first * 5. 虚拟dom渲染 * androd: 支持前后虚拟dom渲染 * iphone: 支持后虚拟dom渲染（前dom在虚拟变更时webview会上移，固无法实现前虚拟dom效果） * ``` */ export declare const Calendar: import("react").ForwardRefExoticComponent<CalendarProps & import("react").RefAttributes<CalendarRefApi>>; export type GetContainer = HTMLElement | (() => HTMLElement) | null; declare function resolveContainer(container: HTMLElement | (() => HTMLElement) | string | undefined | null): Element; export type ModalDrawerProps = { visible?: boolean; mask?: boolean; onMaskClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void; destroyOnClose?: boolean; forceRender?: boolean; getContainer?: GetContainer; onBeforeOpen?: () => void; onAfterOpen?: () => void; onBeforeClose?: () => void; onAfterClose?: () => void; position?: "bottom" | "top" | "left" | "right"; bodyClassName?: string; bodyStyle?: CSSProperties; maskClassName?: string; maskStyle?: CSSProperties; closeByMask?: boolean; onClose?: (operate?: "mask" | "closeIcon") => void; inline?: boolean; closeIcon?: boolean; title?: string | JSX.Element; bodyRef?: (node: HTMLDivElement) => void; duration?: number; } & CommonPropsWithChildren<{ "--modal-drawer-border-radius": CSSProperties["borderRadius"]; }>; export declare const ModalDrawer: FC<ModalDrawerProps>; export type TCalendarModalChangeData = { label: string; value: string; } | { label: string; value: LabelValueItem<string>[]; }; export type CalendarDrawerProps = { title?: string | ReactElement; closeIcon?: boolean; visible?: boolean; className?: string; onClose?: TNoopDefine; modalDrawerProps?: Omit<ModalDrawerProps, "className" | "visible" | "onClose" | "title" | "closeIcon">; calendarProps: Omit<CalendarProps, "onChange" | "value">; calendarHeight?: number; /** * 是否自动回调 * true / 没有确定按钮 */ autoFinish?: boolean; onChange?: (data?: TCalendarModalChangeData) => void; /** * 赋值后则为受控更新 */ value?: string | string[]; footerBefore?: ReactElement; footerAfter?: ReactElement; }; export declare const CalendarDrawer: FC<CalendarDrawerProps>; /** * ----check-checked-bg-color 默认值: --v-color-primary * --check-disabled-bg-color 默认值: #ebedf0 */ export type CheckIconVarStyle = "--check-size" | "--check-bg-color" | "--check-checked-bg-color" | "--check-disabled-bg-color" | "--check-border-color" | "--check-border-radius" | "--check-checked-bg-image"; export type CheckIconProps = { checked?: boolean; disabled?: boolean; onClick?: (e: any) => void; } & NativeProps<CheckIconVarStyle>; export declare const CheckIcon: (props: CheckIconProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>; export type CheckListItemValue = string | number; export type CheckListValue = CheckListItemValue[] | CheckListItemValue | undefined; export type CheckListSelectedValue<T extends "multi" | "radio"> = (T extends "multi" ? CheckListItemValue[] : CheckListItemValue) | CheckListItemValue | CheckListItemValue[]; export type CheckListProps = { multiple?: boolean; onChange?: (value: CheckListSelectedValue<never>, operateValue: CheckListItemValue) => void; onPreChange?: (value: CheckListItemValue) => Promise<void>; value?: CheckListValue; defaultValue?: CheckListValue; beforeExtra?: ReactNode; afterExtra?: ReactNode; checkedClassPrefix: string; stopPropagation?: boolean; required?: boolean; } & CommonPropsWithChildren; export type CheckListItemContentProps = { checked?: boolean; disabled?: boolean; onClick?: (event: any) => void; className?: string; readOnly?: boolean; }; export type CheckListItemProps = { value: CheckListItemValue; disabled?: boolean; readOnly?: boolean; children?: string | ReactElement | ((data: CheckListItemContentProps) => ReactElement); }; export declare const CheckList: ((props: CheckListProps) => import("react/jsx-runtime").JSX.Element) & { Item: (props: CheckListItemProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null; }; export type CheckboxProps = Omit<CheckListProps, "checkedClassPrefix"> & { children?: ReactElement | ReactElement[]; }; export type CheckboxItemProps = { reverse?: boolean; checkIconProps?: Pick<CheckIconProps, "style">; clickArea?: "all" | "checkIcon"; className?: string; children?: ReactNode; gap?: number; } & CheckListItemProps; export declare const Checkbox: ((props: CheckboxProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & { Item: (props: CheckboxItemProps) => import("react/jsx-runtime").JSX.Element; }; export type CollapseProps = Omit<CheckListProps, "checkedClassPrefix"> & { children?: ReactElement | ReactElement[]; }; export type CollapseItemProps = { value: string | number; title: string | ReactElement | ((data: { checked?: boolean; }) => ReactElement); disabled?: boolean; hideArrow?: boolean; clickArea?: "all" | "arrowIcon"; } & CommonPropsWithChildren; export declare const Collapse: ((props: CollapseProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & { Item: (props: CollapseItemProps) => import("react/jsx-runtime").JSX.Element; }; /** * 倒计时 * ``` * 1. seconds 倒计时秒数 * 2. 默认分隔符 x天x时x分x秒 * ``` */ export type CountDownProps = { className?: string; style?: CSSProperties; seconds: number; split?: { d?: string; h?: string; m?: string; s?: string; }; onEnd?: TNoopDefine; }; export declare const CountDown: FC<CountDownProps>; export type PickerColumnValue = string | number; export type PickerColumnItem<T extends PickerColumnValue = PickerColumnValue> = { value: T; label: string; }; export type PickerProps = { pickerDataList: PickerColumnItem[]; value?: PickerColumnValue; onChange?: (pickerColumnItem: PickerColumnItem) => void; itemHeight?: number; } & CommonProps<{ "--height": CSSProperties["height"]; }>; export declare const Picker: (props: PickerProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>; export interface DateViewProps { minDate: string; maxDate: string; defaultDate: string; value?: string; onChange?: (pickerColumnItem: PickerColumnItem<string>) => void; itemHeight?: number; className?: string; } /** * 选择日期 * 1. 如果minDate、maxDate数据有异常，则系统为minDate、maxDate重新赋值，赋值规则为currentDate的前后两年 * * https://stackoverflow.com/questions/4310953/invalid-date-in-safari */ export declare const DateView: (props: DateViewProps) => import("react/jsx-runtime").JSX.Element | null; export interface DatePickerProps { className?: string; visible?: boolean; title: string | JSX.Element; modalProps?: Omit<ModalDrawerProps, "visible" | "className" | "onClose">; onClose?: () => void; dateViewProps: Omit<DateViewProps, "className" | "defaultDate" | "onChange" | "value">; value?: string; onChange?: (pickerColumnItem: PickerColumnItem<string>) => void; defaultDate?: string; } /** * 日期选择 */ export declare const DatePicker: { (props: DatePickerProps): import("react/jsx-runtime").JSX.Element; domTypeName: string; }; export type DateRangePickerChangeParam = { label: string; value: Array<PickerColumnItem<string> | null>; }; export interface DateRangePickerProps { title?: string | JSX.Element; closeIcon?: boolean; visible?: boolean; value?: [ string | PickerColumnItem<string> | null, string | PickerColumnItem<string> | null ]; onChange?: (value?: DateRangePickerChangeParam) => void; modalProps?: Omit<ModalDrawerProps, "visible" | "className" | "title" | "closeIcon">; onClose?: () => void; isUnite?: boolean; dateViewProps: { minDate: string; maxDate: string; }; className?: string; leftOperateBtn?: { btnName: string; onClick?: () => void; }; header?: JSX.Element; startDateIsRequired?: boolean; } export type DateRangePickerRefApi = { onChangeTab: (tab: "left" | "right") => void; }; /** * 选择日期区间 * ``` * 1. value可设置开始时间和结束时间，['2022-01-01', '2022-02-02'] * * 2. 如果minDate、maxDate数据有异常，则系统为minDate、maxDate重新赋值，赋值规则为value设置的前后两年 * ``` */ export declare const DateRangePicker: import("react").ForwardRefExoticComponent<DateRangePickerProps & import("react").RefAttributes<DateRangePickerRefApi>>; export type ModalProps = { visible?: boolean; mask?: boolean; onMaskClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void; destroyOnClose?: boolean; forceRender?: boolean; getContainer?: GetContainer; onBeforeOpen?: () => void; onAfterOpen?: () => void; onBeforeClose?: () => void; onAfterClose?: () => void; bodyClassName?: string; bodyStyle?: CSSProperties; maskClassName?: string; maskStyle?: CSSProperties; onClose?: (operate?: "mask" | "closeIcon") => void; closeByMask?: boolean; closeIcon?: boolean; title?: string | JSX.Element; duration?: number; clickStopPropagation?: boolean; } & CommonPropsWithChildren<{ "--modal-border-radius": CSSProperties["borderRadius"]; }>; export declare const Modal: FC<ModalProps>; export type ModalAlertProps = ModalProps & { btnName?: string | JSX.Element; onClick?: () => void | Promise<void>; buttonProps?: Omit<ButtonProps, "onClick" | "stopPropagation">; }; export declare const ModalAlert: FC<ModalAlertProps>; export type TDialogAlertProps = Omit<ModalAlertProps, "visible" | "getContainer" | "onClose" | "destroyOnClose" | "children"> & { content: string | JSX.Element; }; export declare const dialogAlert: (props: TDialogAlertProps) => void; export type GridProps = { columns: number; columnHeight?: number; gap?: number | [ number, number ]; } & CommonPropsWithChildren; export type ModalConfirmProps = ModalProps & { children: string | JSX.Element; cancelText?: string | JSX.Element; okText?: string | JSX.Element; onCancel?: () => void | Promise<void>; onOK?: () => void | Promise<void>; reverse?: boolean; gridGap?: GridProps["gap"]; okButtonProps?: Omit<ButtonProps, "onClick" | "stopPropagation">; cancelButtonProps?: Omit<ButtonProps, "onClick" | "stopPropagation">; }; export declare const ModalConfirm: FC<ModalConfirmProps>; export type TDialogConfirmProps = Omit<ModalConfirmProps, "visible" | "getContainer" | "onClose" | "onClick" | "destroyOnClose" | "children"> & { content: string | JSX.Element; }; export declare const dialogConfirm: (props: TDialogConfirmProps) => void; export type DialogDrawerProps = ModalDrawerProps & { children?: JSX.Element; content?: JSX.Element | ((param: { onClose: any; }) => JSX.Element); }; export declare const dialogDrawer: { show: (props: DialogDrawerProps) => { closeId: string; }; /** * 关闭单个、关闭所有弹框 * ``` * 1. params.closeId 关闭弹框ID，如果不传则关闭所有 dialogDrawer 弹框 * 2. closeId 为 dialogDrawer.show 返回 * ``` */ close: (params?: { closeId: string; }) => void; }; export interface DialogMessage { message: string; onClose?: () => void; duration?: number; showMask?: boolean; className?: string; } export declare const dialogMessage: (props: string | DialogMessage) => void; export type DialogModalProps = Omit<ModalProps, "visible" | "getContainer" | "onClose" | "children"> & { content: JSX.Element | ((param: { onClose: any; }) => JSX.Element); }; export declare const dialogModal: { show: (props: DialogModalProps) => { closeId: string; }; /** * 关闭单个、关闭所有弹框 * ``` * 1. params.closeId 关闭弹框ID，如果不传则关闭所有 dialogModal 弹框 * 2. closeId 为 dialogModal.show 返回 * ``` */ close: (params?: { closeId: string; }) => void; }; export type PageErrorProps = { message?: string; className?: string; btnName?: string; buttonProps?: ButtonProps; }; export declare const PageError: (props: PageErrorProps) => import("react/jsx-runtime").JSX.Element; export type DialogPageErrorProps = PageErrorProps & { getContainer?: () => Element | null; }; export declare const dialogPageError: { show: (props?: DialogPageErrorProps) => void; hide: () => void; }; export declare const dialogPageSpinner: { show: (params?: { hideBgColor?: boolean; }) => void; hide: () => void; }; export type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "defaultValue" | "onChange" | "disbled" | "readOnly">; export type FormItemVarStyle = "--v-form-label-color" | "--v-form-label-font-size" | "--v-form-label-width" | "--v-form-value-color" | "--v-form-value-font-size" | "--v-form-placeholder-color" | "--v-form-placeholder-font-size" | "--v-form-item-border"; export type FormProps = NativeProps<FormItemVarStyle> & { form: FormMethods; initialValues?: FieldsData; onValuesChange?: (changedValues: FieldsData, allValues: FieldsData) => void; /** * 是否设置触发异常时，滑到一车区域，默认值 true */ scrollIntoView?: boolean; /** * 显示默认的异常方式，设置后Form.Item属性showErrorMessage失效 */ showErrorMessage?: boolean; children?: ReactNode | ReactNode[]; /** 初始化 initialValues 是否触发 onValuesChange；默认值true */ initialValueTriggerOnChange?: boolean; }; export type FieldItemProps = NativeProps<FormItemVarStyle> & { name: string; label?: string | ReactElement; rules?: RuleItem[]; className?: string; onClear?: () => void; children: ReactElement; validateTrigger?: Array<"onChange" | "onBlur">; onValidateResponse?: (errorList: FormErrorItem[]) => void; format?: number[] | ((value?: string) => string); /** * 显示默认的异常方式，默认值true */ showErrorMessage?: boolean; /** * 移动滚动处理 */ onScrollIntoView?: () => void; onItemValueChange?: (value: FieldValue, allValues: FieldsData) => void; showTips?: boolean; onTips?: () => void; /** * 只对输入类型有效 * 1. before-after: 移除前后空格 * 2. all: 移除所有空格 */ removeSpace?: false | "before-after" | "all"; dependencies?: string[]; /** * label和value的布局 */ layout?: "horizontal" | "vertical"; disabled?: boolean; readOnly?: boolean; suffix?: JSX.Element | string; prefix?: JSX.Element | string; hideRequiredMark?: boolean; /** * value 对齐方式；默认值：left */ valueAlign?: "left" | "right"; /** * 自定义结构，label相关配置失效 */ isCustom?: boolean; desc?: ReactNode; /** 设置验证规则防抖等待时间（毫秒），默认：0 */ validateDebounceWait?: number; }; export interface FieldItemCustomProps { label?: string | ReactElement; name: string; rules?: FieldRequiredRule[]; className?: string; children: JSX.Element; showErrorMessage?: boolean; onScrollIntoView?: () => void; onItemValueChange?: (value: FieldValue, allValues: FieldsData) => void; } export interface FormErrorItem { message: string; name: string; value: FieldValue; type: "required" | "regExp" | "custom"; } export interface FormMethods { getFieldValue: (name: string) => FieldValue; getFieldsValue: () => FieldsData; setFieldsValue: (data: FieldsData) => void; validateFields: (names?: string[]) => FormErrorItem[]; validateField: (name: string) => FormErrorItem[]; /** * 验证是否存在未输入的必输项 * ``` * true: 存在必输项 * false: 不存在必输项 * ``` */ validateFieldsRequired: (names?: string[]) => boolean; /** * 清楚页面所有已显示的验证消息 */ clearValidateMessage: () => void; /** * 重置form value为initialValues */ onReset: (values?: FieldsData) => void; /** * 快捷获取Form.Modal picker控件的value值 * ``` * 例如： * string | number => string | number; * { label: 'xx', value: '3' } => '3' * { label: 'xx', value: { label: 'xx', value: '3' } } => '3' * { label: 'xx', value: ['1', '2', '3'] } => ['1', '2', '3'] * { label: 'xx', value: [{ label: 'xx', value: '1' },{ label: 'xx', value: '2' }] } => ['1', '2'] * ``` */ getFormModalPickerValue: <T extends string | number>(value: FieldValue) => T | T[] | undefined; /** * 快捷获取Form.Modal非picker控件的value值 * 例如： * { label: 'xx', value: T } => T */ getFormModalValue: (value: FieldValue) => unknown; _this: TAny; } export type FieldRequiredRule = { required: boolean; message: string; }; export type FieldRegExpRule = { reg: RegExp; message: string; }; export type FieldCustomRule = (data: FieldsData) => { status: false; message: string; } | { status: true; }; /** * 校验规则类型 * 1. 只有字段值类型为字符串的FieldRegExpRule校验才会生效 */ export type RuleItem = FieldRequiredRule | FieldRegExpRule | FieldCustomRule; export type FieldValue = string | number | undefined | boolean | Record<string, TAny> | TAny[]; export type FieldsData = Record<string, FieldValue>; /** * 自定义组件props */ export interface FormItemCustomComptProps<V extends FieldValue = FieldValue> { value?: V; onChange?: (value?: V) => void; } export type FormPickerColumnValueType = PickerColumnValue | PickerColumnItem<PickerColumnValue> | PickerColumnItem<PickerColumnValue>[]; export type FormPickerColumnItem<T extends PickerColumnValue | PickerColumnItem<PickerColumnValue> | PickerColumnItem<PickerColumnValue>[] = FormPickerColumnValueType> = { label: string; value: T; }; export type TFormModalColumnItemValue = string | number; export type FormModalColumnItem = { label: string; value: TAny; extraData?: TPlainObject; }; export type FormTextColumnItem = { label: string; value: TAny; }; /** * 自定义Form.Text组件props */ export interface FormTextItemCustomComptProps<V extends FieldValue = FieldValue> extends FormItemCustomComptProps<V> { clickTigger?: number; } export type FormModalRefApi = { onClose: () => void; }; export type SearchInputFormItemProps = Omit<FieldItemProps, "children"> & { inputProps?: InputProps; searchIcon?: "prefix" | "suffix"; onSearch?: (keyword?: string) => void; }; /** * 搜索框，必须在Form中使用 * @param props * @returns */ export declare const SearchInputFormItem: (props: SearchInputFormItemProps) => import("react/jsx-runtime").JSX.Element; export type TModalSelectorDataItem = { label: string; value: string | number; extraData?: TPlainObject; }; export type TModalSelectorValue = string | number | Array<string | number>; export type TModalSelectorRespItem = TModalSelectorDataItem | { label: string; value: TModalSelectorDataItem[]; }; export interface ModalSelectorProps { visible?: boolean; className?: string; /** 标题 */ title: string | ReactElement; value?: TModalSelectorValue; /** 是否多选 */ multiple?: boolean; /** 选择器数据列表 */ selectorList: TModalSelectorDataItem[]; onClose?: () => void; onChange?: (value?: TModalSelectorRespItem) => void; /** 弹框中是否添加选择确认按钮，默认值true */ needSelectConfirm?: boolean; /** 是否必选 */ required?: boolean; /** 选择回调 */ onValueChange?: (data?: TModalSelectorDataItem | TModalSelectorDataItem[]) => void; /** 默认列表item label适配器，配置checkItemAdaptive后失效 */ labelAdaptive?: (dataItem: TModalSelectorDataItem) => ReactElement | string; /** * 自定义渲染列表item * ``` * 例如： * <ModalSelector checkItemAdaptive={(item) => <div onClick={item.onClick} checked={item.checked}>...</div>}/> * ``` */ checkItemAdaptive?: (checkItem: TModalSelectorDataItem & CheckListItemContentProps) => ReactElement; /** 是否显示搜索项 */ showSearch?: true | Omit<SearchInputFormItemProps, "name" | "onSearch">; /** * 文案配置 * ``` * 默认数据 * copyWritingConfigs: { * selectorListIsEmpty: '暂无数据', * searchListIsEmpty: '搜索结果无数据', * confirmButton: '确认', * } * ``` */ copyWritingConfigs?: { selectorListIsEmpty?: string | ReactElement; searchListIsEmpty?: string | ReactElement; confirmButton?: string | ReactElement; }; /** 列表顶部自定义布局 */ contentBeforeRender?: ReactElement; /** 列表底部自定义布局 */ contentAfterRender?: ReactElement; /** 选择器列表高度，默认值600，组件会对数值进行px2rem处理 */ selectorListHeight?: number; modalDrawerProps?: Omit<ModalDrawerProps, "visible" | "className" | "title" | "onClose">; } /** * 抽屉弹框列表选择器 * ``` * 1. 可自定列表item * 2. 可配置列表搜索 * 3. 与Form结合使用取值方式 * 例如： * b. 取值格式: { label: '白金会员', value: '1' } * 可通过使用form.getFormModalPickerValue(value) 直接取值 => '1' * ``` */ export declare const ModalSelector: FC<ModalSelectorProps>; export type DialogSelectorProps = ModalSelectorProps; /** * 抽屉弹框列表选择器 * ``` * 1. 可自定列表item * 2. 可配置列表搜索 * ``` */ export declare const dialogSelector: { show: (props: DialogSelectorProps) => { closeId: string; }; /** * 关闭单个、关闭所有弹框 * ``` * 1. params.closeId 关闭弹框ID，如果不传则关闭所有 dialogSelector 弹框 * 2. closeId 为 dialogSelector.show 返回 * ``` */ close: (params?: { closeId: string; }) => void; }; export interface DialogSpinnerProps { message?: string; className?: string; hideMask?: boolean; } export declare const dialogSpinner: { show: (props?: DialogSpinnerProps) => void; close: () => void; }; export type DialogToastProps = { message: string; status?: "success" | "error" | "warn"; onClose?: () => void; duration?: number | false; hideMask?: boolean; } & CommonPropsWithChildren<{ /** 格式：url('http://xxxx.png') */ "--v-dialog-toast-success-icon": string; "--v-dialog-toast-error-icon": string; "--v-dialog-toast-warn-icon": string; }>; export declare const dialogToast: (props: DialogToastProps) => void; export type DividerProps = { height: number | string; }; /** * 分割线 * @param props * @returns */ export declare const Divider: (props: DividerProps) => import("react/jsx-runtime").JSX.Element; export type DropMenuProps = { content: ReactElement | string; direction: "bottom" | "top"; visible: boolean; onClose: () => void; modalDrawerProps?: Omit<ModalDrawerProps, "visible" | "direction" | "onClose">; } & CommonPropsWithChildren; export declare const DropMenu: (props: DropMenuProps) => ReactElement<any, string | import("react").JSXElementConstructor<any>>; export type TDynamicNodeProps = { className?: string; getContainer?: HTMLElement | (() => HTMLElement) | string; content?: ReactElement; fixed?: boolean; style?: CSSProperties; }; /** * 动态添加 element 元素 * ``` * 1. 默认添加到 body 下 * 2. 可通过 getContainer 参数设置添加位置 * ``` */ export declare const dynamicNode: { append: (props?: TDynamicNodeProps) => { elementId: string; }; remove: (elementId?: string) => void; }; export interface EmptyProps { text?: string | ReactElement; desc?: string; button?: string | ReactElement; className?: string; style?: CSSProperties; isShow: boolean; } export declare const Empty: (props: EmptyProps) => import("react/jsx-runtime").JSX.Element | null; export type TargetValue<T> = T | undefined | null; export type TargetType = Element | Document | Window; export type BasicDomTarget<T extends TargetType = Element> = (() => TargetValue<T>) | TargetValue<T> | MutableRefObject<TargetValue<T>>; declare function getTargetElement<T extends TargetType>(target: BasicDomTarget<T>, defaultElement?: T): TargetValue<T>; declare function useMutationEffect(effect: () => void, target: BasicDomTarget<Element | Document>, options: MutationObserverInit): void; export type ShouldUpdateFunc<T> = (prev: T | undefined, next: T) => boolean; declare function usePrevious<T>(state: T, shouldUpdate?: ShouldUpdateFunc<T>): T | undefined; export type UsePropsListActiveValueChangeOption<T> = { value?: T; defaultValue?: T; onChange?: (v: T) => void; valueList: T[]; }; declare function usePropsListActiveValueChange<T>(option: UsePropsListActiveValueChangeOption<T>): readonly [ T, (v: T) => void ]; export type UsePropsValueOption<T> = { value?: T; defaultValue: T; onChange?: (v: T) => void; }; declare function usePropsValue<T>(options: UsePropsValueOption<T>): readonly [ T, (v: T) => void ]; declare function useResizeEffect(effect: () => void, targetRef: RefObject<HTMLElement>): void; export type UseCountdownParam = { targetDate: Date | number | string; onEnd?: () => void; }; export interface UseCountdownFormattedRes { days: number; hours: number; minutes: number; seconds: number; milliseconds: number; } export type pageInitRequestOptions = { getPageErrorContainer?: () => Element | null; pageErrorProps?: Omit<PageErrorProps, "message">; }; export type ScrollListenController = (val: Position) => boolean; export type Position = { left: number; top: number; }; export declare const fbmHooks: { useArrayChange: <T>(dataList: T[], forceUpdate?: boolean) => readonly [ T[], { add: (dataItem: T | T[], isUnshift?: boolean | undefined) => void; update: (index: number, dataItem: T) => void; delete: (index: number) => T[]; resetList: (dataList: T[]) => void; getList: () => T[]; } ]; useClosePageSpinner: () => void; useCountdown: (options: UseCountdownParam) => UseCountdownFormattedRes; /** * document 事件处理 * @param onEventCallback 事件回调 * @param eventNames 事件名称数组 * @param excludeTargets 排除的DOM节点或者Ref的数组 * @example * ``` * 可用于处理指定dom节点以外的document事件，例如点击任意位置执行回调 * ``` */ useDocumentEvent: <T extends Event = Event>(onEventCallback: (event: T) => void, eventNames: string[], excludeTargets?: BasicDomTarget[] | undefined) => void; useEffectCustomAsync: (fn: () => Promise<void>, deps: import("react").DependencyList) => void; useEffectCustom: (fn: import("react").EffectCallback, deps: import("react").DependencyList) => void; useLockFn: <P extends unknown[] = unknown[], V = unknown>(fn: (...args: P) => Promise<V>) => (...args: P) => Promise<V | undefined>; /** * 原生api中用来监听node节点变化 * @param effect * @param targetRef * @param options */ useMutationEffect: typeof useMutationEffect; /** * 页面初始化请求结构 * @param onRequest 返回值为promise的函数 * ``` * 1. onRequest返回resolve，会执行dialogPageSpinner.hide操作 * 2. onRequest返回reject，会显示页面异常效果 * 3. getPageErrorContainer配置异常页面渲染父级 * * 可配置window参数 * 1. _account_error = { * btnName: 按钮名称，默认值：重新登录 * btnType: button类型 * btnFill: button填充模式 * code: 账户异常code码，数组格式, * logout: 点击登录按钮事件，函数类型 * } * ``` */ usePageInitRequest: (onRequest: () => Promise<any>, options?: pageInitRequestOptions | undefined) => void; usePrevious: typeof usePrevious; usePropsListActiveValueChange: typeof usePropsListActiveValueChange; usePropsValue: typeof usePropsValue; /** * 监听元素的大小更改 * @param effect * @param targetRef */ useResizeEffect: typeof useResizeEffect; /** * 监听 document & element 滚动 * 理论上 document的监听和element元素的监听是分开的，相互不会影响的，但在iphone中element元素的滚动会触发document的监听 * 例如：一个自然页面，监听页面的滚动，即对document的滚动监听，但是页面中一个弹窗中设置了overflow=scroll，在弹窗内容滚动时，会触发document的滚动监听 * @param callback * @param scrollTarget 滚动Dom或者Ref * @param shouldUpdate */ useScrollCallback: (callback: (position: Position) => void, scrollTarget?: BasicDomTarget<Element | Document>, shouldUpdate?: ScrollListenController) => void; }; export type ScrollElement = HTMLElement | Window | Document; declare function getScrollParent(el: Element, root?: ScrollElement | null | undefined): Element | Document | Window | null | undefined; declare function renderToBody(element: ReactElement): () => void; declare function isStyleNameSupport(styleName: string): boolean; declare function isStyleValueSupport(styleName: string, value: unknown): boolean; export interface Viewport { currRem: number; } export type TLocaleConfig = { /** DatePicker组件取消按钮 */ DatePicker_cancel_button?: string; /** DatePicker组件确定按钮 */ DatePicker_submit_button?: string; /** DateRangePicker组件清空按钮 */ DateRangePicker_clear_button?: string; /** DateRangePicker组件确定按钮 */ DateRangePicker_submit_button?: string; /** DateRangePicker组件连接文案，默认：至 */ DateRangePicker_connect_text?: string; /** ModalAlert组件按钮，默认：确定 */ ModalAlert_button?: string; /** ModalConfirm组件取消按钮，默认：取消 */ ModalConfirm_cancel_button?: string; /** ModalConfirm组件确定按钮，默认：确定 */ ModalConfirm_ok_button?: string; /** DateView 组件，年 */ DateView_year?: string; /** DateView 组件，月 */ DateView_month?: string; /** DateView 组件，日 */ DateView_day?: string; /** dialogSpinner组件加载中文案，默认：加载中 */ DialogSpinner_loadingText?: string; /** dialogToast组件关闭按钮文案，默认：关闭 */ DialogToast_close_button?: string; /** Keyboard组件确定按钮，默认：确定 */ Keyboard_confirm_button?: string; /** ModalUpPicker 取消按钮，默认：取消 */ ModalUpPicker_cancel_button?: string; /** ModalUpPicker 确定按钮，默认：确定 */ ModalUpPicker_confirm_button?: string; /** NativeInfiniteScroll 加载中文案，默认：加载中... */ NativeInfiniteScroll_loading?: string; /** NativeInfiniteScroll 没有更多数据文案，默认：没有更多数据了 */ NativeInfiniteScroll_noMoreText?: string; /** NativeInfiniteScroll 加载失败文案，默认：数据加载失败，点击重新加载 */ NativeInfiniteScroll_loading_error?: string; /** NativePullToRefresh pullingText，默认：下拉刷新 */ NativePullToRefresh_pullingText?: string; /** NativePullToRefresh canReleaseText，默认：释放刷新 */ NativePullToRefresh_canReleaseText?: string; /** NativePullToRefresh refreshingText，默认：加载中... */ NativePullToRefresh_refreshingText?: string; /** NativePullToRefresh completeText，默认：刷新成功 */ NativePullToRefresh_completeText?: string; /** PageError 重新获取按钮，默认：重新获取 */ PageError_button?: string; /**PageError 默认异常文案，默认：未知异常，请稍后再使用 */ PageError_default_error?: string; /** PickerCascadeModalDrawer 取消按钮，默认：取消 */ PickerCascadeModalDrawer_cancel_button?: string; /** PickerCascadeModalDrawer 确定按钮，默认：确定 */ PickerCascadeModalDrawer_confirm_button?: string; /** SmsCountDown sendTxt，默认：获取验证码 */ SmsCountDown_sendTxt?: string; /** SmsCountDown sentTxt，默认：重新获取 */ SmsCountDown_sentTxt?: string; /** SmsCountDown processingTxt，默认：发送中... */ SmsCountDown_processingTxt?: string; }; export declare const fbmUtils: { fabricViewport: () => Viewport; /** 转换特定设备分辨率下的缩放值到屏幕设计稿像素对应PX值 */ dpiPX2px: (d: string | number) => string; /** 转换屏幕实际像素PX值到特定设备分辨率下的缩放值 */ px2DPIpx: (d: string | number) => string; /** 转换750PX下的视觉稿PX尺寸到REM值 */ px2rem: (d: number) => string; /** * 数字格式px转rem * @param pxValue px值 * @param defaultValue 默认值 * @returns * ``` * 1. px、defaultValue如果是字符串，不会进行任何处理 * 2. px、defaultValue如果是数字，会使用px2rem处理 * ``` */ numberPx2rem: (pxValue?: string | number | undefined, defaultValue?: string | number | undefined) => string | number | undefined; /** * 数字格式px转DPIpx * @param pxValue px值 * @param defaultValue 默认值 * @returns * ``` * 1. px、defaultValue如果是字符串，不会进行任何处理 * 2. px、defaultValue如果是数字，会使用DPIpx处理 * ``` */ numberPx2DPIpx: (pxValue?: string | number | undefined, defaultValue?: string | number | undefined) => string | number | undefined; getTargetElement: typeof getTargetElement; getStyles: (elem: any) => any; getElemWidth: (elem?: HTMLElement | undefined) => number; getElemHeight: (elem?: HTMLElement | undefined) => number; resolveContainer: typeof resolveContainer; getScrollParent: typeof getScrollParent; isBrowser: boolean; withNativeProps: typeof withNativeProps; renderToBody: typeof renderToBody; /** 计算H5原生滚动条滚动距离 */ getScrollPosition: (target: BasicDomTarget) => { left: number; top: number; }; isStyleNameSupport: typeof isStyleNameSupport; isStyleValueSupport: typeof isStyleValueSupport; getZIndex: () => number; setLocale: (locale: TLocaleConfig) => void; getLocale: () => TLocaleConfig; }; export type FlexLayoutProps = { fullIndex?: number | number[]; direction?: "vertical" | "horizontal"; height?: number | string; onClick?: () => void; gap?: number; } & CommonPropsWithChildren; /** * flex布局 * @param props * @returns */ export declare const FlexLayout: (props: FlexLayoutProps) => import("react/jsx-runtime").JSX.Element; export type BoundaryProps = { left?: number; right?: number; top?: number; bottom?: number; }; export type OffsetProps = BoundaryProps; export type AxiasBoundaryProps = { xMin: number; xMax: number; yMin: number; yMax: number; }; export type FloatButtonProps = { /** 拖拽边界 */ boundary?: BoundaryProps; /** 拖拽初始位置 */ offset?: OffsetProps; /** 拖拽结束是否吸附到边界，只支持左右边界吸附 */ isAdsorbed?: boolean; /** 滚动时是否隐藏 */ needHideOnScroll?: boolean; /** 拖拽时的样式 */ draggingClassName?: string; } & CommonPropsWithChildren; export declare const px2DPIpxNum: (num: number) => number; /** 计算拖拽边界 */ export declare const calcBoundary: (targetEle: HTMLDivElement, boundary?: BoundaryProps) => AxiasBoundaryProps; /** 将以上下左右为边界的offset偏移量，转换为x,y坐标点 */ export declare const offsetToAxias: (targetEle: HTMLDivElement, boundary?: BoundaryProps, offset?: BoundaryProps) => { x: number; y: number; }; /** * 浮动按钮组件 * 1. isAdsorbed可以控制拖拽放手后，元素是否吸边，默认不吸边。 * 2. needHideOnScroll滚动是否隐藏，默认为false， * 隐藏动画效果会根据按钮靠左还是靠右，执行不同的向左或向右收起展开动画 * 3. draggingClassName可以定义拖拽时的样式 * 4. 父容器高度需要与视窗高度一致，否则滚动收起展开的动效会失灵 */ export declare const FloatButton: (props: FloatButtonProps) => import("react/jsx-runtime").JSX.Element; declare const Input: { (props: InputProps): import("react/jsx-runtime").JSX.Element; domTypeName: string; }; export type FormModalProps = { className?: string; /** isPure = true 无效 */ placeholder?: string; /** isPure = true 无效 */ adapter?: (value?: FormModalColumnItem) => string | JSX.Element; children: ReactElement; /** isPure = true 无效 */ loading?: boolean; /** * 是否自定义modal * ``` * 与 isPure 的与别在于，存在 ListItem 的结构 * ``` */ isCustom?: boolean; /** * 纯净模块 * ``` * 1. 没有任何结构，只做 modal 的状态代理 * 2. 纯净模式默认无触发modal操作结构，可通过pureAction自定义处理 * ``` */ isPure?: boolean; /** * 纯净模块触发节点；isPure = true有效 * @param * ``` * <FormModal * isPure * pureAction={({ onClick }) => { * return <div onClick={onClick}>点我弹框</div>; * }} * > * <Modal>1</Modal> * </FormModal> * ``` */ pureAction?: (data: { onClick: (event: any) => void; }) => ReactElement; }; declare const FormModal: import("react").ForwardRefExoticComponent<FormModalProps & import("react").RefAttributes<FormModalRefApi>>; export type ListItemVarStyle = { "--list-item-align-items": CSSProperties["alignItems"]; "--list-item-justify-content": CSSProperties["justifyContent"]; }; export type ListItemProps = { prefix?: string | ReactElement; extra?: string | ReactElement; onClick?: (e: React.MouseEvent) => void; title?: string | ReactElement; description?: string | ReactElement; arrow?: true | ArrowIconProps; icon?: ReactElement; } & CommonPropsWithChildren<ListItemVarStyle>; export type FormTextProps = { className?: string; placeholder?: string; arrow?: ListItemProps["arrow"]; children?: ReactElement; }; declare const FormText: { (props: FormTextProps): import("react/jsx-runtime").JSX.Element; domTypeName: string; }; export type TextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "value" | "defaultValue" | "onChange"> & { onChange?: (value: string, event: ChangeEvent) => void; showCount?: boolean; }; declare const Textarea: { (props: TextareaProps): import("react/jsx-runtime").JSX.Element; domTypeName: string; }; /** * 键盘Key类型 *``` * xSpan：水平方向跨度 * ySpan：竖直方向跨度 *``` */ export type KeyboardKeyItem = string | { key: string; name: string; xSpan?: number; ySpan?: number; }; export type KeyboardProps = { /** * 1. pure_number 纯数字 * 2. number 数字 * 3. idcard 身份证 * 4. integer 正整数（大于0的整数） */ type?: "pure_number" | "number" | "idcard" | "integer"; /** * 自定义键值 * ``` * 1. type为 pure_number、integer时无效 * 2. 可自定义输入 * ``` */ customKey?: "-" | "." | "X" | (string & {}); customKeyboardKeyList?: KeyboardKeyItem[]; showOkButton?: boolean; randomOrder?: boolean; gridColumns?: number; onConfirm?: () => void; onBackSpace?: () => void; onInput: (key: string) => void; } & NativeProps; /** * 自定义键盘【可自定义键值】 * @param props * @returns *``` * 1. customKey：默认键盘自定义键格 * 2. 未设置customKeyboardKeyList，gridColumns属性无效 * 3. 当设置customKeyboardKeyList后，customKey、showOkButton、randomOrder配置将失效 * 4. 当设置type属性后，customKey失效 *``` */ export declare const Keyboard: FC<KeyboardProps>; export type VirtualInputRefApi = { onFocus: () => void; onBlur: () => void; }; declare const VirtualInput: import("react").ForwardRefExoticComponent<{ disabled?: boolean | undefined; readOnly?: boolean | undefined; placeholder?: string | undefined; onFocus?: (() => void) | undefined; onBlur?: (() => void) | undefined; onClick?: ((e: React.MouseEvent<HTMLDivElement>) => void) | undefined; keyboardProps?: Omit<KeyboardProps, "onInput" | "onConfirm" | "onBackSpace"> | undefined; modalProps?: Omit<ModalDrawerProps, "visible" | "className" | "onClose" | "bodyRef"> | undefined; maxLength?: number | undefined; autoConfirm?: boolean | undefined; value?: string | undefined; onChange?: ((value: string, key?: string) => void) | undefined; initFocus?: boolean | undefined; /** 输出值格式化 */ outputFormat?: ((data?: string) => string | undefined) | undefined; /** * 显示格式化 * ``` * 1. showFormat: number[] 情况会根据数值进行间隔显示，例如手机号格式化：[3,4,4] * ``` */ showFormat?: number[] | ((data?: string) => string | undefined) | undefined; } & NativeProps<never> & import("react").RefAttributes<VirtualInputRefApi>>; declare const FormItem: FC<FieldItemProps>; declare const useForm: (form?: FormMethods) => [ FormMethods ]; declare const useFormInstance: () => FormMethods; export type FormStaticMethods = { Input: typeof Input; Item: typeof FormItem; Textarea: typeof Textarea; useForm: typeof useForm; VirtualInput: typeof VirtualInput; /** * 自定义FormItem，可用于跳转页面取值交互 * ``` * 比普通自定义FormItem，多了一个clickTigger属性，用于触发click事件通知 * ``` */ Text: typeof FormText; /** * 自定义FormItem，用于非Picker类的弹框结构 * 1. 如果为Picker选择器类型的，使用Form.Picker最合适 * 2. 用于非Picker类的弹框结构 */ Modal: typeof FormModal; useFormInstance: typeof useFormInstance; }; /** * Form组件 * ``` * 1. disabled只有设置在Form.item才能起到作用 * ``` */ export declare const Form: ((props: FormProps) => import("react/jsx-runtime").JSX.Element) & FormStaticMethods; export type GapProps = { className?: string; style?: CSSProperties; height?: number; bgColor?: CSSProperties["backgroundColor"]; }; /** * 间隙组件 * ``` * height 为 number 类型时，会进行px2rem转换 * ``` */ export declare const Gap: FC<GapProps>; export type GridItemProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> & { xSpan?: number; ySpan?: number; } & NativeProps; /** * 网格布局 * ``` * 1. columns 水平方向上网格格数 * 2. columnHeight 单个网格高度，视觉稿高度，数值将被转换成rem * 3. gap 网格间隙，默认值：30 * a. number：上下左右相同 * b. [number, number]: [上下，左右] * ``` */ export declare const Grid: ((props: GridProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & { /** * Grid单元格 * ``` * 1. xSpan: 单元格水平方向格数 * 1. ySpan: 单元格竖直方向格数 * ``` */ Item: import("react").FC<GridItemProps>; }; export interface IfProps { isTrue: boolean; children?: ReactNode; } export declare const If: (props: IfProps) => import("react/jsx-runtime").JSX.Element | null; export type ImageProps = { src: string; lazy?: boolean; threshold?: number; imgProps?: Omit<DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "src" | "width" | "height" | "onClick" | "onError" | "onLoad">; width?: string | number; height?: string | number; loading?: ReactNode; onClick?: (event: React.MouseEvent<HTMLDivElement, Event>) => void; onError?: (event: SyntheticEvent<HTMLImageElement, Event>) => void; fit?: CSSProperties["objectFit"]; } & NativeProps; export declare const Image: FC<ImageProps>; export type ImageViewerProps = { images: string[]; visible: boolean; onClose: () => void; initActiveIndex?: number; onAfterClose?: () => void; destroyOnClose?: boolean; loop?: boolean; lazy?: boolean; maxZoom?: number; }; export type TDialogImageViewerProps = Pick<ImageViewerProps, "images" | "initActiveIndex">; export declare const ImageViewer: import("react").FC<ImageViewerProps> & { show: (props: TDialogImageViewerProps) => void; }; export type LazyDetectorProps = { className?: string; onChange: (inView: boolean) => void; unobserve?: boolean; rootMargin?: string; children?: ReactNode; }; /** * 判断是否进出最近一个原生滚动条父节点可视区域 * ``` * 1. unobserve表示触发监听后，是否销毁监听功能 * ``` */ export declare const InVisibleView: (props: LazyDetectorProps) => import("react/jsx-runtime").JSX.Element; export type IndexBarOptionKey = string | number; export type IndexBarOption = { key: IndexBarOptionKey; name: string; }; export type IndexBarProps = { onChange: (key: any) => void; options: IndexBarOption[]; onTouchStart?: () => void; onTouchEnd?: () => void; activeKey?: IndexBarOptionKey; } & NativeProps; export declare const IndexBar: (props: IndexBarProps) => import("react/jsx-runtime").JSX.Element; export type IphoneBottomAdaptiveProps = { bgColor?: string; }; export declare const IphoneBottomAdaptive: FC<IphoneBottomAdaptiveProps>; export type KeyboardModalProps = { title?: string | JSX.Element; visible?: boolean; keyboardProps: KeyboardProps; modalProps?: Omit<ModalDrawerProps, "visible" | "className" | "title" | "closeIcon" | "onClose">; closeIcon?: boolean; onClose: () => void; } & NativeProps; export declare const KeyboardModal: FC<KeyboardModalProps>; export type ListProps = { mode?: "default" | "card"; gap?: number; } & CommonPropsWithChildren<ListItemVarStyle>; export declare const List: ((props: ListProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & { /** * ``` * 1. 自定义icon 在未设置arrow情况下有效 * ``` */ Item: (props: ListItemProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>; }; export type LoadingAnimationProps = { size?: "small" | "default" | "minSmall" | "large"; }; export type LocalLoadingServiceConfig = { onRequest: (params?: TAny) => Promise<TAny>; params?: TPlainObject; /** 标记serviceConfig.params中无效参数，被设置的params key 不传入服务接口入参 */ invalidParamKey?: string[]; }; export interface LocalLoadingProps { className?: string; style?: CSSProperties; contentStyle?: CSSProperties; /** 接口数据配置 */ serviceConfig: LocalLoadingServiceConfig; /** children 为函数，参数【respData】为接口返回数据 */ children: (respData?: TAny) => ReactElement; /** * 是否异步，默认：false * ``` * true（异步）：onRequest、react dom渲染同步执行 * false（同步）：onRequest有结果了才渲染 react dom * ``` */ isAsync?: boolean; /** 自定义异常渲染处理 */ errorRender?: (error: TAny, params: { onReset: () => void; }) => ReactElement; /** loading高度；isAsync = true 无效 */ loadingHeight?: number | string; loadingSize?: LoadingAnimationProps["size"]; } export type LocalLoadingRefApi = { onRefresh: (params?: TPlainObject) => void; /** 获取服务相应数据 */ getDataSource: () => TAny; }; /** * 局部加载，包含接口数据处理逻辑 * ``` * 包括 * 1. loading显示效果 * 2. error显示效果 * 3. 获取服务数据 * 4. 当 serviceConfig.params 值与上一次值不相等时，会主动发起服务调用 * 5. 通过ref.onRequest可重新发起请求 * 6. 使用ref.getDataSource 可获取服务数据 * 7. 使用方式 * <LocalLoading * serviceConfig={{ * onRequest: async () => { * // 调用service服务 * }, * }} * > * {(respData) => { * return ( * <Fragment> * <div>1</div> * <div>{respData.xxx}</div> * </Fragment> * ); * }} * </LocalLoading> * ``` */ export declare const LocalLoading: import("react").ForwardRefExoticComponent<LocalLoadingProps & import("react").RefAttributes<LocalLoadingRefApi>> & { useLocalLoading: () => { onRequest: (params?: TPlainObject) => void; }; }; export type MaskProps = { visible?: boolean; onMaskClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void; color?: "black" | "white"; opacity?: "default" | "thin" | "thick" | number; getContainer?: GetContainer; afterShow?: () => void; afterClose?: () => void; stopPropagation?: boolean; } & CommonPropsWithChildren; export declare const Mask: FC<MaskProps>; export type ModalFullProps = ModalProps; export declare const ModalFull: FC<ModalFullProps>; export type ModalPoptipProps = { content: string | JSX.Element; } & Omit<ModalProps, "getContainer">; export declare const ModalPoptip: (props: ModalPoptipProps) => import("react/jsx-runtime").JSX.Element; export type TModalUpPickerDataItem = { label: string; value: string | number; extraData?: TPlainObject; }; export interface ModalUpPickerProps { className?: string; visible?: boolean; title: string; itemHeight?: number; pickerDataList: TModalUpPickerDataItem[]; onChange?: PickerProps["onChange"]; onClose?: () => void; value?: PickerProps["value"]; drawerProps?: Omit<ModalDrawerProps, "visible" | "className">; header?: ReactElement | string; onValueChange?: (selectedData?: TModalUpPickerDataItem) => {}; } /** * 自定义选择器 * ``` * 1. 可自定义header结构 * 2. 与Form结合使用赋值与取值方式 * 例如： * a. 赋值格式: { label: '白金会员', value: '1' } * b. 取值格式: * { * label: '白金会员', * value: '1' * } * 可通过使用form.getFormModalPickerValue(value) 直接取值 => '1' * ``` */ export declare const ModalUpPicker: (props: ModalUpPickerProps) => import("react/jsx-runtime").JSX.Element; export type NativeInfinit