import { App } from 'vue';
import { Component } from 'vue';
import { ComponentOptionsMixin } from 'vue';
import { DefineComponent } from 'vue';
import { ExtractPropTypes } from 'vue';
import { Plugin as Plugin_2 } from 'vue';
import { PublicProps } from 'vue';
import { RendererElement } from 'vue';
import { RendererNode } from 'vue';
import { VNode } from 'vue';

export declare const back: () => Promise<void>;

/**
 * 返回到 最首页
 */
export declare const backToHome: () => Promise<void>;

/**
 * 黑箱返回
 *
 * 场景如下:
 * 比如 当前的页面堆栈为: `a -> b -> c -> d`
 * ```js
 * /// 此时调用该方法
 * blackBoxBack(2)
 * ```
 * 那么 页面 堆栈 会修改为  a -> d
 */
export declare const blackBoxBack: (delta: number) => Promise<void>;

export declare const disableBodyPointerEvents: () => void;

export declare const enableBodyPointerEvents: () => void;

/**
 * 获取当前所在的页面的 mate 信息
 * @returns PageMate 信息
 */
export declare const getCurrentPageMate: () => PageMate | undefined;

/**
 * 返回当前最顶部页面方法
 *
 * 方法返回 `Promise<void>`, 在页面完成跳转后 `promise.reslove`
 *
 * 组件可以通过设置 `useTransitionLeave` 设置页面离开动画,如果设置动画则会在动画执行完成后, `promise.reslove`
 *
 * @param delta 返回次数 uint
 */
export declare const goBack: (delta?: number) => Promise<void>;

declare type LifeCycleHooks = {
    onBeforeEnter?: (el: RendererElement) => void;
    onAfterEnter?: (el: RendererElement) => void;
    onEnterCancelled?: (el: RendererElement) => void;
    onBeforeLeave?: (el: RendererElement) => void;
    onAfterLeave?: (el: RendererElement) => void;
    onLeaveCancelled?: (el: RendererElement) => void;
    onBeforeAppear?: (el: RendererElement) => void;
    onAfterAppear?: (el: RendererElement) => void;
    onAppearCancelled?: (el: RendererElement) => void;
};

/**
 * 示例
 ````ts
 import { createApp } from 'vue'

 const app = createApp({
 // ...
 })

 app.use(navigation)
 ````

 在 app,创建后 use 开始启用 该插件
 */
export declare const navigation: Plugin_2;

declare const Navigator_2: DefineComponent<    {}, () => VNode<RendererNode, RendererElement, {
[key: string]: any;
}>[] | undefined, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {}>>, {}, {}>;
export { Navigator_2 as Navigator }

/**
 * 页面即将展示hook
 * 执行动画后
 */
export declare const onDidAppear: (hook: (isFirst: boolean) => void) => void;

/**
 * 页面即将消失hook
 * 执行动画后
 */
export declare const onDidDisappear: (hook: () => void) => void;

export declare const onPageAfterEnter: (hook: () => void) => void;

export declare const onPageAfterLeave: (hook: () => void) => void;

export declare const onPageBeforeEnter: (hook: () => void) => void;

export declare const onPageBeforeLeave: (hook: () => void) => void;

export declare const onPageChange: (func: PageChangeHook, config?: Partial<PageChangeConfig>) => () => boolean;

/**
 * 页面即将展示hook
 * 执行动画前
 * @param hook
 */
export declare const onWillAppear: (hook: (isFirst: boolean) => void) => void;

/**
 * 页面即将消失hook
 * 执行动画前
 * @param hook
 */
export declare const onWillDisappear: (hook: () => void) => void;

declare type PageChangeConfig = {
    /**
     * 是不是每一个 页面切换都监听到
     * 默认为 false:
     * * true: 每一次页面变动的时候 都会触发
     * * false: 只有存在 mateInfo 并且 没有设置为 useQuietPage 的页面 会触发
     */
    isEvery: boolean;
};

declare type PageChangeHook = (from?: PageMate, to?: PageMate) => void;

declare interface PageMate {
    id?: string;
    name?: string;
    [key: string]: any;
}

declare type ProgressExitAnimatedHandle = (elements: {
    from?: Element;
    to?: Element;
}, progress: number, isFinish?: boolean) => void;

/**
 * 前进方法
 *
 * ```tsx
 * import Component from "./component"
 *
 * push(<Component prop1={1} />)
 * ```
 *
 * 异步加载组件使用 vue 自带的 `defineAsyncComponent`
 *
 * ```tsx
 * const Component = defineAsyncComponent(() => import("./component"));
 * push(<Component prop1={1} />);
 * ```
 *
 * 方法返回 `Promise<void>`, 在页面完成跳转后 `promise.reslove`
 *
 * 组件可以通过设置 `useTransitionEnter` 设置页面动画,如果设置动画则会在动画执行完成后, `promise.reslove`
 *
 * @param component 组件
 * @param params 页面的参数, 在页面发上变化的时候 这些参数会被携带
 */
export declare const push: (component: Component | VNode, hooks?: LifeCycleHooks) => Promise<App<Element>>;

/**
 * 替换方法
 *
 * ```tsx
 * import Component from "./component"
 *
 * replace(<Component prop1={1} />)
 * ```
 *
 * 异步加载组件使用 vue 自带的 `defineAsyncComponent`
 *
 * ```tsx
 * const Component = defineAsyncComponent(() => import("./component"));
 * replace(<Component prop1={1} />);
 * ```
 *
 * 方法返回 `Promise<void>`, 在页面完成跳转后 `promise.reslove`
 *
 * 组件可以通过设置 `useTransitionEnter` 设置页面动画,如果设置动画则会在动画执行完成后, `promise.reslove`
 *
 * @param component 组件
 */
export declare const replace: (component: Component | VNode, hooks?: LifeCycleHooks) => Promise<App<Element>>;

/**
 * 前往页面
 * @param isReplace  是否以替换的方式前往
 */
export declare const to: (isReplace: boolean) => (component: Component | VNode, hooks?: LifeCycleHooks) => Promise<App<Element>>;

declare type TransitionAmimatorHook = (elements: {
    from?: Element;
    to?: Element;
}, done: () => void) => void;

/**
 * useAppBeforeMount() 用于在 app 挂载之前执行一些操作
 * example:
 * ```tsx
 * import { useAppBeforeMount } from '@0x30/vue-navigation'
 *
 * useAppBeforeMount((app) => {
 *  app.use(store)
 *  app.use(router)
 * })
 * @param config  app 挂载之前执行的操作
 */
export declare const useAppBeforeMount: (config: (app: App) => void) => void;

/**
 * 在页面即将返回的时候，会调用hook方法，返回是否可以返回
 * 该方法，如果在某个页面多次注册，会覆盖请注意
 */
export declare const useLeaveBefore: (hook: (() => boolean) | (() => Promise<boolean>)) => void;

export declare const usePageMate: (mate: PageMate) => void;

/**
 * 当接收到 滑动手势渐进式返回 执行动画时
 * @param hook 执行动画的错做
 */
export declare const useProgressExitAnimated: (hook: ProgressExitAnimatedHandle) => void;

/**
 * 该项目在有新的页面
 * 1. 进入的时候，触发上一个页面的 onDeactivate
 * 2. 离开的时候，触发上一个页面的 onActivate 事件
 * 当你写了一个 Loading 加载中组件，当作一个页面,那么 你可以将它设置为 安静的页面;
 * 那么在他出现的时候，不会触发上一个页面的 deactived,在 Loading 页面消失之后， 也不会触发上一个页面的 actived 页面
 */
export declare const useQuietPage: () => void;

/**
 * 在页面进入时设置 动画执行方法
 * 请保证该方法只被注册一次,多次注册将覆盖
 */
export declare const useTransitionEnter: (hook: TransitionAmimatorHook) => void;

/**
 * 在页面离开时设置 动画执行方法
 * 请保证该方法只被注册一次,多次注册将覆盖
 */
export declare const useTransitionLeave: (hook: TransitionAmimatorHook) => void;

export { }

/**
 * 手势右滑执行
 * 需要客户端 介入
 */
declare global {
    interface Window {
        addEventListener<K extends keyof CustomEventMap>(type: K, listener: (this: Window, ev: CustomEventMap[K]) => void): void;
        dispatchEvent<K extends keyof CustomEventMap>(ev: CustomEventMap[K]): void;
        ScreenEdgePanGestureRecognizerStart: () => void;
        ScreenEdgePanGestureRecognizerChange: (progress: number) => void;
        ScreenEdgePanGestureRecognizerEnded: (isFinish: boolean) => void;
    }
}