import * as vue from 'vue';
import { Ref, MaybeRefOrGetter } from 'vue';
import { PaginationProps, TableData, TableColumnData, TreeFieldNames, TreeSelectInstance } from '@arco-design/web-vue';
import { MaybeRef } from '@vueuse/core';

declare const useShareBreakpoints: () => Record<"sm" | "md" | "lg" | "xl" | "xxl", vue.Ref<boolean, boolean>> & {
    greaterOrEqual: (k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">) => vue.Ref<boolean, boolean>;
    smallerOrEqual: (k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">) => vue.Ref<boolean, boolean>;
    greater(k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): vue.Ref<boolean, boolean>;
    smaller(k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): vue.Ref<boolean, boolean>;
    between(a: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">, b: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): vue.Ref<boolean, boolean>;
    isGreater(k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): boolean;
    isGreaterOrEqual(k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): boolean;
    isSmaller(k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): boolean;
    isSmallerOrEqual(k: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): boolean;
    isInBetween(a: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">, b: vue.MaybeRefOrGetter<"sm" | "md" | "lg" | "xl" | "xxl">): boolean;
    current: () => vue.ComputedRef<string[]>;
    active(): vue.ComputedRef<string | undefined>;
};

declare const propsSlot: <Prop extends Record<string, any> = Record<string, any>>(slots: any, props: Prop, key: keyof Prop, slotKey?: string) => any;

interface ProPaginationOption {
    total: number;
    pageNum: number;
    pageSize: number;
}
type PropPaginationProps = Omit<PaginationProps, 'total' | 'current' | 'pageSize'>;

declare const useProPagination: (data: Ref<any[]>, pagination: Ref<true | ProPaginationOption | undefined>, paginationProps: Ref<PaginationProps | undefined>) => {
    data: vue.ComputedRef<any[]>;
    total: vue.ComputedRef<number>;
    current: Ref<number, number>;
    pageSize: Ref<number, number>;
    pageChange: (value: number) => void;
    pageSizeChange: (value: number) => void;
} | {
    total: vue.ComputedRef<number>;
    current: vue.WritableComputedRef<number, number>;
    pageSize: vue.WritableComputedRef<number, number>;
    pageChange: (value: number) => void;
    pageSizeChange: (value: number) => void;
    data: Ref<any[], any[]>;
};

declare const useGrid: (useColumn: boolean, column: Ref<Record<string, any> | number>, gutter?: Ref<number | [number, number]>) => {
    gridProps: vue.ComputedRef<{
        span: number;
        gutter: number | [number, number] | undefined;
    }>;
    grid: vue.ComputedRef<string>;
};

declare const controlVModel: <Props extends Record<string, any>, Key extends keyof Props, Data extends Props[Key]>(props: Props, name: Key, emit: any, init: () => Data) => Ref<Data>;

declare const filterEmptyChildren: (children?: any[]) => any[];

declare const useEmptyComponentProvide: () => {
    empty: vue.Ref<boolean, boolean>;
};
declare const useEmptyComponentInject: () => {
    empty: vue.Ref<boolean, boolean>;
};

/**
 * `<ATableColumn/>` cell 插槽的类型帮助方法
 */
interface ATableColumnCell<Record extends TableData = TableData> {
    record: Record;
    column: TableColumnData;
    rowIndex: number;
}

interface CreateTreeSelectFilterNodeReturn {
    fieldNames: MaybeRef<TreeFieldNames>;
    filterTreeNode: TreeSelectInstance['filterTreeNode'];
}
/**
 * 解决arco tree-select反人类的默认筛选 key 的帮助方法
 * 简洁的封装 tree-select 筛选 title 的逻辑
 *
 * ```vue
 * <script setup lang="ts">
 *  import { createTreeSelectFilterNode } from '@vrx-arco/use'
 *  const treeFilter = createTreeSelectFilterNode({title:'name'})
 * </script>
 * <template>
 *  <ATeeSelect v-bind="treeFilter"/>
 * </template>
 * ```
 * *** 暂时不要将这个方法用到生产，现在还是半成品，可能会更改 ***
 * @inner
 */
declare const createTreeSelectFilterNode: (fieldNames: MaybeRef<TreeFieldNames>) => CreateTreeSelectFilterNodeReturn;

/**
 * 解决在使用 arco  RangePicker 向后端传递数据时常常要将数据处理成，以下形式的问题
 * 要将 ['2024-11-20 11:20:00','2024-11-20 21:20:00'] 数据转换为 {startTime:'2024-11-20 11:20:00',endTime:'2024-11-20 21:20:00'}
 *
 * ```vue
 * <script setup lang="ts">
 *  import { useRangePickerObjectValue } from '@vrx-arco/use'
 *  const model = ref({})
 *  const rangePickerValue = useRangePickerObjectValue(model,'startTime','endTime')
 *
 *  const handleSubmit = ()=>{
 *      // 提交 以下格式数据{startTime:'2024-11-20 11:20:00',endTime:'2024-11-20 21:20:00'}
 *      fetch('/api/submit',{method:'post',body:JSON.stringify(model.value)})
 *  }
 * </script>
 * <template>
 *  <AForm :model="model" @submit="handleSubmit">
 *    <AFormItem>
 *      <ARangePicker v-model="rangePickerValue" />
 *    </AFormItem>
 *  </AForm>
 * </template>
 * ```
 * *** 暂时不要将这个方法用到生产，现在还是半成品，可能会更改 ***
 * @inner
 */
declare const useRangePickerObjectValue: <Modal extends Record<string, any>>(model: MaybeRefOrGetter<Modal>, startKey: keyof Modal, endKey: keyof Modal) => vue.WritableComputedRef<(string | number | Date)[], (string | number | Date)[]>;

interface IUseAbortController {
    onabort?: () => void;
}
declare function useAbortController(options?: IUseAbortController): {
    abort: () => void;
    readonly signal: AbortSignal | undefined;
};

export { type ATableColumnCell, type CreateTreeSelectFilterNodeReturn, type IUseAbortController, type ProPaginationOption, type PropPaginationProps, type ATableColumnCell as TableColumnCell, controlVModel, createTreeSelectFilterNode, filterEmptyChildren, propsSlot, useAbortController, useEmptyComponentInject, useEmptyComponentProvide, useGrid, useProPagination, useRangePickerObjectValue, useShareBreakpoints };