@reactuses/core/dist/index.d.ts

<div align = "center"> <h1 align = "center"> reactuse </h1> </div>

import * as react from 'react';
import react__default, { DependencyList, MutableRefObject, EffectCallback, RefObject, Dispatch, SetStateAction, useEffect, useLayoutEffect, Ref, Context } from 'react';
import Cookies from 'js-cookie';
import { DebounceSettings, ThrottleSettings, DebouncedFunc as DebouncedFunc$1 } from 'lodash-es';
import * as lodash from 'lodash';
import { DebounceSettings as DebounceSettings$1, DebouncedFunc, ThrottleSettings as ThrottleSettings$1 } from 'lodash';
import { FetchEventSourceInit } from '@microsoft/fetch-event-source';

/**
 * @title useActiveElement
 * @returns_en Returns an instance of the type parameter `T` or `null`.
 * @returns 返回类型参数 `T` 或 `null` 的实例
 */
type UseActiveElement = <T extends Element>() => T | null;

declare const useActiveElement: UseActiveElement;

/**
 *
 * @title useAsyncEffect
 */
type UseAsyncEffect = <T>(
/**
 * @zh 支持promise的副作用函数
 * @en effect that support promise
 */
effect: () => Promise<T> | T, 
/**
 * @zh 清理函数
 * @en cleanup function
 * @defaultValue () => {}
 */
cleanup?: typeof effect, 
/**
 * @zh 依赖列表
 * @en dependency list
 */
deps?: DependencyList) => void;

declare const useAsyncEffect: UseAsyncEffect;

type TargetValue<T> = T | undefined | null;
type TargetType = HTMLElement | Element | Window | Document | EventTarget;
type BasicTarget<T extends TargetType = Element> = (() => TargetValue<T>) | TargetValue<T> | MutableRefObject<TargetValue<T>>;

/**
 * @title useClickOutside
 */
type UseClickOutside = (
/**
 * @zh dom对象
 * @en dom element
 */
target: BasicTarget<Element>, 
/**
 * @zh 监听函数
 * @en listener fucntion
 */
handler: (evt: EventType) => void, 
/**
 * @zh 监听函数是否生效
 * @en whether the listener fucntion is enabled
 */
enabled?: boolean) => void;
type EventType = MouseEvent | TouchEvent;

declare const useClickOutside: UseClickOutside;

/**
 * @title useCookie
 * @returns 包含以下元素的元组：
 * - cookie 的当前值。
 * - 更新 cookie 值的函数。
 * - 刷新 cookie 值的函数，以防其他事件更改它。
 * @returns_en A tuple with the following elements:
 * - The current value of the cookie.
 * - A function to update the value of the cookie.
 * - A function to refresh the value of the cookie, incase other events change it.
 */
type UseCookie = (
/**
 * @zh 键值
 * @en key
 */
key: string, 
/**
 * @zh 透传给 `js-cookie` 的参数
 * @en option pass to `js-cookie`
 */
options?: Cookies.CookieAttributes, 
/**
 * @zh 默认值，ssr必须传递
 * @en defaultValue, must be required in ssr
 */
defaultValue?: string) => readonly [
    UseCookieState,
    (newValue: UseCookieState | ((prevState: UseCookieState) => UseCookieState)) => void,
    () => void
];
/**
 * @title useCookieState
 */
type UseCookieState = string | undefined;

declare const useCookie: UseCookie;

/**
 * @title useCountdown
 * @returns_en A tuple with the following elements:
 * - hour
 * - minute.
 * - second.
 * @returns 包含以下元素的元组：
 * - 小时。
 * - 分钟。
 * - 秒数。
 */
type UseCountDown = (
/**
 * @zh 时间差
 * @en time differ
 */
time: number, 
/**
 * @zh 时间格式化函数
 * @en time format function
 * @defaultValue HH MM SS
 */
format?: (num: number) => [string, string, string], 
/**
 * @zh 倒计时结束的回调函数
 * @en callback function for end of countdown
 */
callback?: () => void) => readonly [string, string, string];

declare const useCountDown: UseCountDown;

/**
 * @title useCounter
 * @returns_en A tuple with the following elements:
 * - The current value of the counter.
 * - A function to set the state of the counter. It can accept a number or a function that returns a number.
 * - A function to increment the counter. It optionally accepts a number to increment the counter by, defaulting to 1.
 * - A function to decrement the counter. It optionally accepts a number to decrement the counter by, defaulting to 1.
 * - A function to reset the counter to its initial value.
 *  @returns 包含以下元素的元组：
 * - 计数器的当前值。
 * - 设置计数器状态的函数。 它可以接受数字或返回数字的函数。
 * - 递增计数器的函数。 它可以选择接受一个数字来增加计数器，默认为 1。
 * - 递减计数器的函数。 它可以选择接受一个数字来减少计数器，默认为 1。
 * - 将计数器重置为其初始值的函数。
 */
type UseCounter = (
/**
 * @zh 初始值，可以为数字或者一个初始化的函数
 * @en The initial value of the counter. It can be a number or a function that returns a number. If not provided, the counter will start from 0.
 * @defaultValue 0
 */
initialValue?: number | (() => number), 
/**
 * @zh 最大值。不提供则无上限
 * @en The maximum value that the counter can reach. If not provided or null, there is no upper limit.
 */
max?: number | null, 
/**
 * @zh 最小值。不提供则无下限
 * @en The minimum value that the counter can reach. If not provided or null, there is no lower limit.
 */
min?: number | null) => readonly [
    number,
    (newState: number | ((prev: number) => number) | (() => number)) => void,
    (delta?: number) => void,
    (delta?: number) => void,
    () => void
];

declare const useCounter: UseCounter;

declare const defaultOptions: UseCssVarOptions;
/**
 * @title useCssVar
 * @returns_en A tuple with the following elements:
 * - The current value of the css var.
 * - A function to update the value of the css var.
 *  @returns 包含以下元素的元组：
 * - css 变量值
 * - 更新 css 变量值的函数
 */
type UseCssVar = <T extends HTMLElement = HTMLElement>(
/**
 * @zh 属性值，比如 --color
 * @en prop, eg: --color
 */
prop: string, 
/**
 * @zh dom元素
 * @en dom element
 */
target: BasicTarget<T>, 
/**
 * @zh 默认值
 * @en default value
 */
defaultValue?: string, 
/**
 * @zh 可选项
 * @en options
 */
options?: UseCssVarOptions) => readonly [string, (v: string) => void];
/**
 * @title UseCssVarOptions
 */
interface UseCssVarOptions {
    /**
     * @en Use MutationObserver to monitor variable changes
     * @zh 使用 MutationObserver 来监听变量变更
     * @defaultValue false
     */
    observe?: boolean;
}

declare const useCssVar: UseCssVar;

type DepsEqualFnType<TDeps extends DependencyList> = (prevDeps: TDeps, nextDeps: TDeps) => boolean;
/**
 * @title useCustomCompareEffect
 */
type UseCustomCompareEffect = <TDeps extends DependencyList>(
/**
 * @zh 副作用函数
 * @en effect callback
 */
effect: EffectCallback, 
/**
 * @zh 依赖列表
 * @en deps
 */
deps: TDeps, 
/**
 * @zh 依赖比较函数
 * @en deps compare function
 */
depsEqual: DepsEqualFnType<TDeps>) => void;

declare const useCustomCompareEffect: UseCustomCompareEffect;

/**
 * @title useCycleList
 * @returns_en A tuple with the following elements:
 * - The current index value of the list.
 * - A function to set index to prev.
 * - A function to set index to next.
 *  @returns 包含以下元素的元组：
 * - 数组中当前的索引对象值
 * - 设置索引为前一个的函数
 * - 设置索引为后一个的函数
 */
type UseCycleList = <T>(
/**
 * @zh 循环数组
 * @en cycle array
 */
list: T[], 
/**
 * @zh 数组索引
 * @en array index
 */
i?: number) => readonly [T, (i?: number) => void, (i?: number) => void];

declare const useCycleList: UseCycleList;

/**
 * @title UseDarkOptions
 */
interface UseDarkOptions {
    /**
     * @en CSS Selector for the target element applying to
     * @zh 适用于目标元素的 CSS 选择器
     * @defaultValue 'html'
     */
    selector?: string;
    /**
     * @en HTML attribute applying the target element
     * @zh 应用到目标元素的 html 属性
     * @defaultValue 'class'
     */
    attribute?: string;
    /**
     * @en default value
     * @zh 默认值
     * @defaultValue false
     */
    defaultValue?: boolean;
    /**
     * @en Key to persist the data into localStorage/sessionStorage.
     * @zh 将数据持久保存到 localStorage/sessionStorage 的键值
     * @defaultValue 'reactuses-color-scheme'
     */
    storageKey?: string;
    /**
     * @en Storage object, can be localStorage or sessionStorage
     * @zh 存储对象，可以是localStorage或sessionStorage
     * @defaultValue `localStorage`
     */
    storage?: () => Storage;
    /**
     * @en name dark apply to element
     * @zh  应用到目标元素上黑色类名称
     */
    classNameDark: string;
    /**
     * @en name light apply to element
     * @zh 应用到目标元素上的亮色类名称
     */
    classNameLight: string;
}
/**
 * @title useDarkMode
 * @returns_en A tuple with the following elements:
 * - The current value of the dark state.
 * - A function to toggle the dark state.
 * -  A function to update the dark state.
 * @returns 包含以下元素的元组：
 * - 黑暗状态的当前值。
 * - 切换黑暗状态的功能。
 * - 更新黑暗状态的功能。
 */
type UseDarkMode = (options: UseDarkOptions) => readonly [
    boolean | null,
    () => void,
    React.Dispatch<React.SetStateAction<boolean | null>>
];

declare const useDarkMode: UseDarkMode;

/**
 * @title useDebounce
 */
type UseDebounce = <T>(
/**
 * @zh 要防抖的值
 * @en the value need to debounce
 */
value: T, 
/**
 * @zh 间隔时间
 * @en wait time
 */
wait?: number, 
/**
 * @zh 传递给 `lodash.debounce` 的选项
 * @en options passed to `lodash.debounce`
 */
options?: DebounceSettings) => T;

declare const useDebounce: UseDebounce;

/**
 * @title useDebounceFn
 * @returns_en A object with the following elements:
 * - run: exec function.
 * - cancel: cancel exec function.
 * - flush:  immediately exec function
 * @returns 具有以下元素的对象:
 * - run：执行函数。
 * - cancel：取消执行函数。
 * - flush: 立即执行函数
 */
type UseDebounceFn = <T extends (...args: any) => any>(
/**
 * @zh 要防抖的函数
 * @en debounce function
 */
fn: T, 
/**
 * @zh 间隔时间
 * @en wait time
 */
wait?: number, 
/**
 * @zh 传递给 `lodash.debounce` 的属性
 * @en options passed to `lodash.debounce`
 */
options?: DebounceSettings$1) => {
    run: DebouncedFunc<(...args_0: Parameters<T>) => ReturnType<T>>;
    cancel: () => void;
    flush: any;
};

declare const useDebounceFn: UseDebounceFn;

/**
 * @title useDeepCompareEffect
 */
type UseDeepCompareEffect = (
/**
 * @zh 副作用函数
 * @en effect function
 */
effect: EffectCallback, 
/**
 * @zh 依赖列表
 * @en dep list
 */
deps: DependencyList) => void;

declare const useDeepCompareEffect: UseDeepCompareEffect;

declare function useDocumentVisibility(defaultValue?: DocumentVisibilityState): DocumentVisibilityState;

/**
 * @title useDoubleClick
 */
type UseDoubleClick = (props: UseDoubleClickProps) => void;
/**
 * @title UseDoubleClickProps
 */
interface UseDoubleClickProps {
    /**
     * @zh dom对象
     * @en dom element
     */
    target: BasicTarget<Element>;
    /**
     * @zh 延迟时间（毫秒）
     * @en latency time (milliseconds)
     */
    latency?: number | undefined;
    /**
     * @zh 单击事件处理函数
     * @en single click event handler
     */
    onSingleClick?: ((e?: MouseEvent | TouchEvent) => void) | undefined;
    /**
     * @zh 双击事件处理函数
     * @en double click event handler
     */
    onDoubleClick?: ((e?: MouseEvent | TouchEvent) => void) | undefined;
}

declare const useDoubleClick: UseDoubleClick;

type Fn = (this: any, ...args: any[]) => any;
type Stoppable = [boolean, Fn, Fn];
type PointerType = 'mouse' | 'touch' | 'pen';
interface Position {
    x: number;
    y: number;
}
/**
 * @title Pausable
 */
interface Pausable$1 {
    /**
     * @en A ref indicate whether a pausable instance is active
     * @zh 一个 ref，表示一个 pausable 实例是否处于激活状态
     */
    isActive: boolean;
    /**
     * @en Temporary pause the effect from executing
     * @zh 暂时暂停效果的执行
     */
    pause: Fn;
    /**
     * @en Resume the effects
     * @zh 恢复效果
     */
    resume: Fn;
}

/**
 * @title useDraggable
 * @returns 包含以下元素的元组：
 * - x
 * - y
 * - 元素是否在拖动中
 * - 设置元素的位置
 * @returns_en A tuple with the following elements:
 * - x
 * - y
 * - Whether the element is being dragged
 * set the element position
 */
type UseDraggable = (
/**
 * @zh dom对象
 * @en dom element
 */
target: BasicTarget<HTMLElement | SVGElement>, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseDraggableOptions) => readonly [number, number, boolean, Dispatch<SetStateAction<Position>>];
/**
 * @title  UseDraggableOptions
 */
interface UseDraggableOptions {
    /**
     * @en Only start the dragging when click on the element directly
     * @zh 仅当直接单击元素时才开始拖动
     * @defaultValue false
     */
    exact?: boolean;
    /**
     * @en Prevent events defaults
     * @zh 阻止默认事件
     * @defaultValue false
     */
    preventDefault?: boolean;
    /**
     * @en Prevent events propagation
     * @zh 阻止事件冒泡
     * @defaultValue false
     */
    stopPropagation?: boolean;
    /**
     * @en Element to attach `pointermove` and `pointerup` events to.
     * @zh 将“pointermove”和“pointerup”事件附加到的dom元素
     * @defaultValue window
     */
    draggingElement?: BasicTarget<HTMLElement | SVGElement>;
    /**
     * @en Element for calculating bounds (If not set, it will use the event's target).
     * @zh 设置拖拽容器边界
     * @defaultValue undefined
     */
    containerElement?: BasicTarget<HTMLElement | SVGAElement>;
    /**
     * @en Handle that triggers the drag event
     * @zh 触发拖动事件的dom元素
     * @defaultValue target
     */
    handle?: RefObject<HTMLElement | SVGElement>;
    /**
     * @en Pointer types that listen to.
     * @zh 监听的事件类型
     * @defaultValue ['mouse', 'touch', 'pen']
     */
    pointerTypes?: PointerType[];
    /**
     * @en Initial position of the element.
     * @zh 初始的元素位置
     * @defaultValue { x: 0, y: 0 }
     */
    initialValue?: Position;
    /**
     * @en Callback when the dragging starts. Return `false` to prevent dragging.
     * @zh 拖动开始时的回调。 返回“false”以防止拖动
     */
    onStart?: (position: Position, event: PointerEvent) => void | false;
    /**
     * @en Callback during dragging.
     * @zh 拖动时候的回调
     */
    onMove?: (position: Position, event: PointerEvent) => void;
    /**
     * @en Callback when dragging end.
     * @zh 拖动结束的回调
     */
    onEnd?: (position: Position, event: PointerEvent) => void;
}

declare const useDraggable: UseDraggable;

/**
 * @title useDropZone
 * @returns 文件是否在区域上
 * @returns_en Whether the file is on the zone
 */
type UseDropZone = (
/**
 * @zh 目标元素
 * @en target element
 */
target: BasicTarget<EventTarget>, 
/**
 * @zh 拖拽释放时候的回调
 * @en drop callback
 */
onDrop?: ((files: File[] | null) => void) | undefined) => boolean;

declare const useDropZone: UseDropZone;

/**
 * @title useElementBounding
 */
type UseElementBounding = (
/**
 * @zh 目标元素
 * @en target element
 */
target: BasicTarget<Element>, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseElementBoundingOptions) => UseElementBoundingReturn;
/**
 * @title UseElementBoundingOptions
 */
interface UseElementBoundingOptions {
    /**
     * @en Reset values to 0 on component unmounted
     * @zh 将数值重置为0
     * @defaultValue true
     */
    reset?: boolean;
    /**
     * @en Listen to window resize event
     * @zh 是否监听 resize 事件
     * @defaultValue true
     */
    windowResize?: boolean;
    /**
     * @en Listen to window scroll event
     * @zh 是否监听 scroll 事件
     * @defaultValue true
     */
    windowScroll?: boolean;
    /**
     * @en Immediately call update on component mounted
     * @zh 立即更新
     * @default true
     */
    immediate?: boolean;
}
/**
 * @title UseElementBoundingReturn
 */
interface UseElementBoundingReturn {
    /**
     * @en Height of the element
     * @zh 元素的高度
     */
    readonly height: number;
    /**
     * @en Bottom position of the element
     * @zh 元素的底部位置
     */
    readonly bottom: number;
    /**
     * @en Left position of the element
     * @zh 元素的左侧位置
     */
    readonly left: number;
    /**
     * @en Right position of the element
     * @zh 元素的右侧位置
     */
    readonly right: number;
    /**
     * @en Top position of the element
     * @zh 元素的顶部位置
     */
    readonly top: number;
    /**
     * @en Width of the element
     * @zh 元素的宽度
     */
    readonly width: number;
    /**
     * @en X position of the element
     * @zh 元素的 X 位置
     */
    readonly x: number;
    /**
     * @en Y position of the element
     * @zh 元素的 Y 位置
     */
    readonly y: number;
    /**
     * @en Manual update
     * @zh 手动更新
     */
    readonly update: () => void;
}

declare const useElementBounding: UseElementBounding;

/**
 * @title useElementSize
 * @returns_en A tuple with the following elements:
 * - width
 * - height
 * @returns 包含以下元素的元组：
 * - 元素宽度。
 * - 元素高度。
 */
type UseElementSize = (
/**
 * @zh dom对象
 * @en dom element
 */
target: BasicTarget<Element>, 
/**
 * @zh `resizeObserver` 参数
 * @en options passed to `resizeObserver`
 */
options?: ResizeObserverOptions) => readonly [number, number];

declare const useElementSize: UseElementSize;

/**
 * @title useElementVisibility
 * @returns 包含以下元素的元组：
 * - 当前元素是否可见。
 * - 停止监听函数。
 * @returns_en A tuple with the following elements:
 * - is the current element visible.
 * - stop observer listening function.
 */
type UseElementVisibility = (
/**
 * @zh dom对象
 * @en dom element
 */
target: BasicTarget<HTMLElement | SVGElement>, 
/**
 * @zh 传递给 `intersectionObserver` 的选项
 * @en options passed to `intersectionObserver`
 */
options?: IntersectionObserverInit) => readonly [boolean, () => void];

declare const useElementVisibility: UseElementVisibility;

/**
 * @title useEvent
 */
type UseEvent = <T extends Fn>(
/**
 * @zh 函数
 * @en function
 */
fn: T) => T;

/**
 * keep function reference immutable
 */
declare const useEvent: UseEvent;

/**
 * @title useEventEmitter
 * @returns 包含以下元素的元组：
 * - 添加监听器的函数。
 * - 触发函数。
 * - 停止函数。
 * @returns_en A tuple with the following elements:
 * - a function to add lisenter.
 * - fire functiion.
 * stop functiion
 */
type UseEventEmitter = <T, U = void>() => readonly [
    UseEventEmitterEvent<T, U>,
    (arg1: T, arg2: U) => void,
    () => void
];
interface UseEventEmitterListener<T, U = void> {
    (arg1: T, arg2: U): void;
}
interface UseEventEmitterDisposable {
    dispose: () => void;
}
interface UseEventEmitterEvent<T, U = void> {
    (listener: (arg1: T, arg2: U) => any): UseEventEmitterDisposable;
}
interface UseEventEmitterEventOnce<T, U = void> {
    (listener: (arg1: T, arg2: U) => any): void;
}
interface UseEventEmitterReturn<T, U = void> {
    /**
     * Subscribe to an event. When calling emit, the listeners will execute.
     * @param listener watch listener.
     * @returns a stop function to remove the current callback.
     */
    event: UseEventEmitterEvent<T, U>;
    /**
     * fire an event, the corresponding event listeners will execute.
     * @param event data sent.
     */
    fire: (arg1: T, arg2: U) => void;
    /**
     * Remove all corresponding listener.
     */
    dispose: () => void;
}

declare function useEventEmitter<T, U = void>(): readonly [UseEventEmitterEvent<T, U>, (arg1: T, arg2: U) => void, () => void];

type Target = BasicTarget<HTMLElement | Element | Window | Document | EventTarget>;
declare function useEventListener<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: Window, options?: boolean | AddEventListenerOptions): void;
declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: Document, options?: boolean | AddEventListenerOptions): void;
declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: T, options?: boolean | AddEventListenerOptions): void;
declare function useEventListener<K extends keyof ElementEventMap>(eventName: K, handler: (event: ElementEventMap[K]) => void, element: Element, options?: boolean | AddEventListenerOptions): void;
declare function useEventListener<K = Event>(eventName: string, handler: (event: K) => void, element: EventTarget | null | undefined, options?: boolean | AddEventListenerOptions): void;
declare function useEventListener(eventName: string, handler: (...p: any) => void, element?: Target, options?: boolean | AddEventListenerOptions): void;

/**
 * @title useEyeDropper
 * @returns 包含以下元素的元组：
 * - 浏览器是否支持该特性。
 * - 打开颜色选择器的函数。
 * @returns_en A tuple with the following elements:
 * - Whether the browser supports this feature.
 * - A function to open eye dropper.
 */
type UseEyeDropper = () => readonly [
    boolean,
    (options?: UseEyeDropperOpenOptions) => Promise<UseEyeDropperOpenReturnType>
];
/**
 * @title UseEyeDropperOpenOptions
 */
interface UseEyeDropperOpenOptions {
    /**
     * @zh 终止信号
     * @en abort signal
     */
    signal?: AbortSignal;
}
/**
 * @title UseEyeDropperOpenReturnType
 */
interface UseEyeDropperOpenReturnType {
    /**
     * @zh rgb 颜色值
     * @en rgb color value
     */
    sRGBHex: string;
}

declare const useEyeDropper: UseEyeDropper;

declare function useFavicon(href: string, baseUrl?: string, rel?: string): void;

/**
 * @title useFileDialog
 * @returns 包含以下元素的元组：
 * - 文件数组。
 * - 打开文件选择器函数。
 * - 重置函数。
 * @returns_en A tuple with the following elements:
 * - file array.
 * - A function to open file dialog.
 * - A function to reset files
 */
type UseFileDialog = (options?: UseFileDialogOptions) => readonly [
    FileList | null,
    (localOptions?: Partial<UseFileDialogOptions>) => Promise<FileList | null | undefined>,
    () => void
];
/**
 * @title UseFileDialogOptions
 */
interface UseFileDialogOptions {
    /**
     * @zh 选择多个文件
     * @en choose multiple file
     * @defaultValue true
     */
    multiple?: boolean;
    /**
     * @zh 可以接受的文件类型
     * @en accept file type
     * @defaultValue '*'
     */
    accept?: string;
    /**
     * @zh [指定设备，可以从麦克风或者摄像头中获取文件](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)
     * @en [Specify the device to obtain files from the microphone or camera](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)
     * @see [HTMLInputElement Capture](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/capture)
     */
    capture?: string;
}

declare const useFileDialog: UseFileDialog;

/**
 * @title useFirstMountState
 */
type UseFirstMountState = () => boolean;

declare const useFirstMountState: UseFirstMountState;

/**
 * @title useFocus
 * @returns 包含以下元素的元组：
 * - 元素是否聚焦。
 * - 更新聚焦状态。
 * @returns_en A tuple with the following elements:
 * -  whether the element focus.
 * - A function to update focus state.
 */
type UseFocus = (
/**
 * @zh dom对象
 * @en dom element
 */
target: BasicTarget<HTMLElement | SVGElement>, 
/**
 * @zh 默认值
 * @en defaultValue
 * @defaultValue false
 */
initialValue?: boolean) => readonly [boolean, (value: boolean) => void];

declare const useFocus: UseFocus;

/**
 * @title useFps
 * @returns 每秒帧数
 * @returns_en frames per second
 */
type UseFps = (options?: UseFpsOptions) => number;
/**
 * @title UseFpsOptions
 */
interface UseFpsOptions {
    /**
     * @en Calculate the FPS on every x frames.
     * @zh 每过 x 帧计算一次
     * @defaultValue 10
     */
    every?: number;
}

declare function useFps(options?: UseFpsOptions): number;

/**
 * @title useFullScreen
 * @returns 包含以下元素的元组：
 * - 当前是否处于全屏。
 * - 一个操作对象:
 * - enterFullscreen： 进入全屏。
 * - exitFullscreen： 退出全屏。
 * - toggleFullscreen： 切换全屏。
 * - isEnabled： 当前浏览器是否支持全屏。
 * @returns_en A tuple with the following elements:
 * - whether the browser is in fullscreen.
 * - a object：
 * - enterFullscreen
 * - exitFullscreen
 * - toggleFullscreen
 * - isEnabled: whether the browser support fullscreen
 */
type UseFullscreen = (
/**
 * @zh dom元素
 * @en dom element
 */
target: BasicTarget<Element>, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseFullScreenOptions) => readonly [
    /**
     * @zh 当前是否处于全屏
     * @en whether is in fullscreen
     */
    boolean,
    {
        /**
         * @zh 进入全屏
         * @en enter fullscreen
         */
        readonly enterFullscreen: () => void;
        /**
         * @zh 退出全屏
         * @en exit fullscreen
         */
        readonly exitFullscreen: () => void;
        /**
         * @zh 切换全屏
         * @en toggle fullscreen
         */
        readonly toggleFullscreen: () => void;
        /**
         * @zh 浏览器是否支持
         * @en whether the browser support fullscreen
         */
        readonly isEnabled: boolean;
    }
];
/**
 * @title UseFullScreenOptions
 */
interface UseFullScreenOptions {
    /**
     * @zh 退出时候的回调
     * @en exit callback
     */
    onExit?: () => void;
    /**
     * @zh 进入时候的回调
     * @en enter callback
     */
    onEnter?: () => void;
}

declare const useFullscreen: UseFullscreen;

/**
 * @title useGeoLocation
 * @returns 包含以下元素的对象：
 * - 坐标。
 * - 获取坐标的时间戳。
 * - 错误。
 * - 浏览器是否支持 `geolocation`。
 * @returns_en A object with the following elements:
 * - coordinates.
 * - timestamp when get coordinates.
 * - errors.
 * - Whether the browser supports `geolocation`.
 */
type UseGeolocation = (
/**
 * @zh 可选 `PositionOptions` 参数
 * @en optional `PositionOptions` params
 */
options?: Partial<PositionOptions>) => {
    readonly coordinates: GeolocationCoordinates;
    readonly locatedAt: number | null;
    readonly error: GeolocationPositionError | null;
    /**
     * @zh 浏览器是否支持 `geolocation`
     * @en Whether the browser supports `geolocation`
     */
    readonly isSupported: boolean;
};

declare const useGeolocation: UseGeolocation;

/**
 * @title useHover
 */
type UseHover = <T extends Element = HTMLDivElement>(
/**
 * @zh dom对象
 * @en dom element
 */
target: BasicTarget<T>) => boolean;

declare const useHover: UseHover;

/**
 * @title UseIdle
 * @returns 是否处于空闲
 * @returns_en whether user is idle
 */
type UseIdle = (
/**
 * @zh 检测时间
 * @en detection time
 * @defaultValue 60e3
 */
ms?: number, 
/**
 * @zh 初始值
 * @en initial value
 * @defaultValue false
 */
initialState?: boolean, 
/**
 * @zh 监听的事件
 * @en listener events
 * @defaultValue ["mousemove","mousedown","resize","keydown","touchstart","wheel"]
 */
events?: (keyof WindowEventMap)[]) => boolean;

declare const useIdle: UseIdle;

/**
 * @title useScroll
 * @returns 包含以下元素的元组：
 * - x 值。
 * - y 值。
 * - 是否在滚动。
 * - 到达边界状态。
 * - 滚动方向
 * @returns_en A tuple with the following elements:
 * - The x value.
 * - The y value.
 * - Whether it is scrolling.
 * - Boundary arrival status.
 * - Scroll direction.
 */
type UseScroll = (
/**
 * @zh dom元素
 * @en dom elment
 */
target: BasicTarget<Element> | Window | Document, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseScrollOptions) => readonly [
    number,
    number,
    boolean,
    UseScrollArrivedState,
    UseScrollDirection
];
/**
 * @title UseScrollOptions
 */
interface UseScrollOptions {
    /**
     * @en Throttle time for scroll event, it’s disabled by default.
     * @zh 滚动事件的节流时间，默认关闭。
     * @defaultValue 0
     */
    throttle?: number;
    /**
     * @en The check time when scrolling ends.
     * This configuration will be setting to (throttle + idle) when the `throttle` is configured.
     * @zh 滚动结束时的检查时间。
     * 当配置 `throttle` 时，此配置将设置为 (throttle +idle)。
     * @default 200
     */
    idle?: number;
    /**
     * @en Offset arrived states by x pixels
     * @zh 将到达状态偏移 x 像素
     */
    offset?: UseScrollOffset;
    /**
     * @en Trigger it when scrolling.
     * @zh 滚动的回调
     */
    onScroll?: (e: Event) => void;
    /**
     * @en Trigger it when scrolling ends.
     * @zh 滚动结束的回调
     */
    onStop?: (e: Event) => void;
    /**
     * @en Listener options for scroll event.
     * @zh 滚动事件参数
     * @defaultValue {capture: false, passive: true}
     */
    eventListenerOptions?: boolean | AddEventListenerOptions;
}
interface UseScrollOffset {
    left?: number;
    right?: number;
    top?: number;
    bottom?: number;
}
/**
 * @title UseScrollArrivedState
 */
interface UseScrollArrivedState {
    /**
     * @en arrived left
     * @zh 到达左边
     */
    left: boolean;
    /**
     * @en arrived right
     * @zh 到达右边
     */
    right: boolean;
    /**
     * @en arrived top
     * @zh 到达顶部
     */
    top: boolean;
    /**
     * @en arrived bottom
     * @zh 到达底部
     */
    bottom: boolean;
}
/**
 * @title UseScrollDirection
 */
interface UseScrollDirection {
    /**
     * @en scroll left
     * @zh 向左滚动
     */
    left: boolean;
    /**
     * @en scroll right
     * @zh 向右滚动
     */
    right: boolean;
    /**
     * @en scroll top
     * @zh 向上滚动
     */
    top: boolean;
    /**
     * @en scroll bottom
     * @zh 向下滚动
     */
    bottom: boolean;
}

/**
 * @title useInfiniteScroll
 */
type UseInfiniteScroll = (
/**
 * @zh dom元素
 * @en dom element
 */
target: BasicTarget<Element>, 
/**
 * @zh 加载更多函数
 * @en load more function
 */
onLoadMore: UseInfiniteScrollLoadMore, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseInfiniteScrollOptions) => void;
/**
 * @title UseInfiniteScrollLoadMore
 */
type UseInfiniteScrollLoadMore = (
/**
 * @zh `useScroll` 返回的状态
 * @en the return state of `useScroll`
 */
state: readonly [
    number,
    number,
    boolean,
    UseInfiniteScrollArrivedState,
    UseInfiniteScrollDirection
]) => void | Promise<void>;
/**
 * @title UseInfiniteScrollOptions
 */
interface UseInfiniteScrollOptions extends UseScrollOptions {
    /**
     * @en The minimum distance between the bottom of the element and the bottom of the viewport
     * @zh 元素底部与视口底部之间的最小距离
     * @defaultValue 0
     */
    distance?: number;
    /**
     * @en The direction in which to listen the scroll.
     * @zh 滚动方向
     * @defaultValue 'bottom'
     */
    direction?: 'top' | 'bottom' | 'left' | 'right';
    /**
     * @en Whether to preserve the current scroll position when loading more items.
     * @zh 加载更多项目时是否保留当前滚动位置
     * @defaultValueValue false
     */
    preserveScrollPosition?: boolean;
}
/**
 * @title UseInfiniteScrollArrivedState
 */
interface UseInfiniteScrollArrivedState {
    /**
     * @en arrived left
     * @zh 到达左边
     */
    left: boolean;
    /**
     * @en arrived right
     * @zh 到达右边
     */
    right: boolean;
    /**
     * @en arrived top
     * @zh 到达顶部
     */
    top: boolean;
    /**
     * @en arrived bottom
     * @zh 到达底部
     */
    bottom: boolean;
}
/**
 * @title UseInfiniteScrollDirection
 */
interface UseInfiniteScrollDirection {
    /**
     * @en scroll left
     * @zh 向左滚动
     */
    left: boolean;
    /**
     * @en scroll right
     * @zh 向右滚动
     */
    right: boolean;
    /**
     * @en scroll top
     * @zh 向上滚动
     */
    top: boolean;
    /**
     * @en scroll bottom
     * @zh 向下滚动
     */
    bottom: boolean;
}

declare const useInfiniteScroll: UseInfiniteScroll;

/**
 * @title useIntersectionObserver
 * @returns 停止监听函数
 * @returns_en stop listening function
 */
type UseIntersectionObserver = (
/**
 * @zh dom元素
 * @en dom element
 */
target: BasicTarget<Element>, 
/**
 * @zh 回调
 * @en callback
 */
callback: IntersectionObserverCallback, 
/**
 * @zh 传递给 `IntersectionObserver` 的参数
 * @en options passed to `IntersectionObserver`
 */
options?: IntersectionObserverInit) => () => void;

declare const useIntersectionObserver: UseIntersectionObserver;

/**
 * @title useInterval
 */
type UseInterval = (
/**
 * @zh 回调
 * @en callback
 */
callback: () => void, 
/**
 * @zh 时间，如果为 `null` 的话则停止计时器
 * @en Time, if `null` then stop the timer
 */
delay?: number | null, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseIntervalOptions) => Pausable;
/**
 * @title UseIntervalOptions
 */
interface UseIntervalOptions {
    /**
     * @zh 是否立即执行。
     * @en Whether to execute immediately.
     */
    immediate?: boolean;
    /**
     * @zh 是否控制执行。
     * @en Whether to control execution.
     */
    controls?: boolean;
}
/**
 * @title Pausable
 */
interface Pausable {
    /**
     * @en A ref indicate whether a pausable instance is active
     * @zh 一个 ref，指示一个 pausable 实例是否处于激活状态
     */
    isActive: RefObject<boolean>;
    /**
     * @en Temporary pause the effect from executing
     * @zh 暂时暂停执行效果
     */
    pause: () => void;
    /**
     * @en Resume the effects
     * @zh 恢复效果
     */
    resume: () => void;
}

declare const useInterval: UseInterval;

declare const useIsomorphicLayoutEffect: typeof useEffect;

/**
 * @title useKeyModifier
 * @returns 按键是否被按下
 * @returns_en Whether the key is pressed
 */
type UseKeyModifier = (
/**
 * @zh 键位
 * @en key modifier
 */
modifier: KeyModifier, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseModifierOptions) => boolean;
type KeyModifier = 'Alt' | 'AltGraph' | 'CapsLock' | 'Control' | 'Fn' | 'FnLock' | 'Meta' | 'NumLock' | 'ScrollLock' | 'Shift' | 'Symbol' | 'SymbolLock';
/**
 * @title UseModifierOptions
 */
interface UseModifierOptions {
    /**
     * @en Event names that will prompt update to modifier states
     * @zh 更新按键状态的事件
     * @defaultValue ['mousedown', 'mouseup', 'keydown', 'keyup']
     */
    events?: (keyof WindowEventMap)[];
    /**
     * @en Initial value of the returned ref
     * @zh 初始值
     * @defaultValue false
     */
    initial?: boolean;
}

declare const useKeyModifier: UseKeyModifier;

/**
 * @title useLatest
 * @returns ref 对象
 * @returns_en ref object
 */
type UseLatest = <T>(
/**
 * @zh 追踪值
 * @en tracked value
 */
value: T) => MutableRefObject<T>;

declare const useLatest: UseLatest;

interface Serializer<T> {
    read: (raw: string) => T;
    write: (value: T) => string;
}
interface UseStorageOptions<T> {
    /**
     * @en Custom data serialization
     * @zh 自定义数据序列化
     */
    serializer?: Serializer<T>;
    /**
     * @en On error callback
     * @zh 错误回调
     * @defaultValue `console.error`
     */
    onError?: (error: unknown) => void;
    /**
     * @en set to storage when nodata in first mount
     * @zh 首次挂载时没有数据时设置到 storage
     * @deprecated
     */
    effectStorageValue?: T | (() => T);
    /**
     * @en set to storage when nodata in first mount
     * @zh 首次挂载时没有数据时设置到 storage
     */
    mountStorageValue?: T | (() => T);
    /**
     * @en listen to storage changes
     * @zh 监听 storage 变化
     * @defaultValue `true`
     */
    listenToStorageChanges?: boolean;
}

declare function useLocalStorage(key: string, defaults: string, options?: UseStorageOptions<string>): readonly [string | null, Dispatch<SetStateAction<string | null>>];
declare function useLocalStorage(key: string, defaults: number, options?: UseStorageOptions<number>): readonly [number | null, Dispatch<SetStateAction<number | null>>];
declare function useLocalStorage(key: string, defaults: boolean, options?: UseStorageOptions<boolean>): readonly [boolean | null, Dispatch<SetStateAction<boolean | null>>];
declare function useLocalStorage<T>(key: string, defaults: T, options?: UseStorageOptions<T>): readonly [T | null, Dispatch<SetStateAction<T | null>>];
declare function useLocalStorage<T = unknown>(key: string, defaults: null, options?: UseStorageOptions<T>): readonly [T | null, Dispatch<SetStateAction<T | null>>];

/**
 * @title useLocationSelector
 */
type UseLocationSelector = <R>(
/**
 * @zh 选择器
 * @en selector function
 */
selector: (location: Location) => R, 
/**
 * @zh 默认值
 * @en default value
 */
fallback?: R | undefined) => R | undefined;

declare const useLocationSelector: UseLocationSelector;

/**
 * @title useLongPress
 * @returns 包含以下元素的对象：
 * - onMouseDown 鼠标按下事件。
 * - onTouchStart 手指按下事件。
 * - onMouseUp 鼠标松开事件。
 * - onMouseLeave 鼠标离开事件
 * - onTouchEnd 手指松开事件
 * @returns_en A object with the following elements:
 * - onMouseDown: Mouse down event.
 * - onTouchStart: Finger touch start event.
 * - onMouseUp: Mouse up event.
 * - onMouseLeave: Mouse leave event.
 * - onTouchEnd: Finger touch end event.
 */
type UseLongPress = (
/**
 * @zh 回调
 * @en callback
 */
callback: (e: TouchEvent | MouseEvent) => void, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseLongPressOptions) => {
    readonly onMouseDown: (e: any) => void;
    readonly onTouchStart: (e: any) => void;
    readonly onMouseUp: () => void;
    readonly onMouseLeave: () => void;
    readonly onTouchEnd: () => void;
};
/**
 * @title UseLongPressOptions
 */
interface UseLongPressOptions {
    /**
     * @zh 阻止默认事件
     * @en whether prevent default event
     * @defaultValue true
     */
    isPreventDefault?: boolean;
    /**
     * @zh 延迟
     * @en delay time
     * @defaultValue 300
     */
    delay?: number;
}

declare const useLongPress: UseLongPress;

/**
 * @title useMeasure
 * @returns [DOMRect值,停止监听函数]
 * @returns_en [DOMRect, stop listening function]
 */
type UseMeasure = (
/**
 * @zh dom对象
 * @en dom element
 */
target: BasicTarget<Element>, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: ResizeObserverOptions) => readonly [UseMeasureRect, () => void];
/**
 * @title UseMeasureRect
 */
type UseMeasureRect = Omit<DOMRectReadOnly, 'toJSON'>;

declare const useMeasure: UseMeasure;

/**
 * @title useMediaDevices
 * @returns 包含以下元素的元组：
 * - 媒体设备信息。
 * - 请求媒体设备权限。
 * @returns_en A tuple with the following elements:
 * - The media devices info.
 * - A function to request media devices permission.
 */
type UseMediaDevices = (
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseMediaDeviceOptions) => readonly [
    {
        devices: {
            deviceId: string;
            groupId: string;
            kind: MediaDeviceKind;
            label: string;
        }[];
    },
    () => Promise<boolean>
];
/**
 * @title UseMediaDeviceOptions
 */
interface UseMediaDeviceOptions {
    /**
     * @en Request for permissions immediately if it's not granted,
     * otherwise label and deviceIds could be empty
     * @zh 自动请求权限
     * @defaultValue false
     */
    requestPermissions?: boolean;
    /**
     * @en Request for types of media permissions
     * @zh 请求媒体权限类型
     * @defaultValue { audio: true, video: true }
     */
    constraints?: MediaStreamConstraints;
}

declare const useMediaDevices: UseMediaDevices;

/**
 * @title useMediaQuery
 * @returns 是否符合媒体查询
 * @returns_en whether comply with media inquiries
 */
type UseMediaQuery = (
/**
 * @zh 媒体查询字符串
 * @en media query string
 */
query: string, 
/**
 * @zh 默认值
 * @en default value
 */
defaultState?: boolean) => boolean;

declare const useMediaQuery: UseMediaQuery;

/**
 * @title useMount
 */
type UseMount = (
/**
 * @zh 副作用函数
 * @en effect function
 */
effect: () => void) => void;

declare const useMount: UseMount;

declare function useMountedState(): () => boolean;

/**
 * @title useMouse
 * @returns 鼠标位置
 * @returns_en Mouse Position
 */
type UseMouse = (
/**
 * @zh dom元素
 * @en dom element
 */
target?: BasicTarget) => UseMouseCursorState;
/**
 * @title UseMouseCursorState
 */
interface UseMouseCursorState {
    screenX: number;
    screenY: number;
    clientX: number;
    clientY: number;
    pageX: number;
    pageY: number;
    elementX: number;
    elementY: number;
    elementH: number;
    elementW: number;
    elementPosX: number;
    elementPosY: number;
}

declare const useMouse: UseMouse;

/**
 * @title useMousePressed
 * @returns 包含以下元素的元组：
 * - 鼠标是否按下。
 * - 按下的事件来源。
 * @returns_en A tuple with the following elements:
 * - whether the mouse is pressed.
 * - the pressed source type
 */
type UseMousePressed = (
/**
 * @zh dom对象
 * @en dom element
 */
target?: BasicTarget<Element>, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseMousePressedOptions) => readonly [boolean, UseMousePressedSourceType];
/**
 * @title UseMousePressedOptions
 */
interface UseMousePressedOptions {
    /**
     * @en Listen to `touchstart` `touchend` events
     * @zh 监听 `touchstart` 事件
     * @defaultValue true
     */
    touch?: boolean;
    /**
     * @en Listen to `dragstart` `drop` and `dragend` events
     * @zh 监听 `dragStart` 事件
     * @defaultValue true
     */
    drag?: boolean;
    /**
     * @en Initial values
     * @zh 初始值
     * @defaultValue false
     */
    initialValue?: boolean | (() => boolean);
}
/**
 * @title UseMousePressedSourceType
 */
type UseMousePressedSourceType = 'mouse' | 'touch' | null;

declare const useMousePressed: UseMousePressed;

/**
 * @title UseMutationObserver
 * @returns 停止函数
 * @returns_en stop listenering function
 */
type UseMutationObserver = (
/**
 * @zh 回调
 * @en callback
 */
callback: MutationCallback, 
/**
 * @zh dom元素
 * @en dom对象
 */
target: BasicTarget, 
/**
 * @zh 传递给 `MutationObserver` 的参数
 * @en options passed to `MutationObserver`
 */
options?: MutationObserverInit) => () => void;

declare const useMutationObserver: UseMutationObserver;

/**
 * @title useNetwork
 */
type UseNetwork = () => IUseNetworkState;
/**
 * @title IUseNetworkState
 */
interface IUseNetworkState {
    /**
     * @en Whether browser connected to the network or not.
     * @zh 浏览器是否连接网络
     */
    online: boolean | undefined;
    /**
     * @en Previous value of `online` property. Helps to identify if browser
     * just connected or lost connection.
     * @zh `online` 属性的先前值。 帮助识别浏览器是否
     * 刚刚连接或失去连接。
     */
    previous: boolean | undefined;
    /**
     * @en The {Date} object pointing to the moment when state change occurred.
     * @zh {Date} 对象指向状态更改发生的时刻。
     */
    since: Date | undefined;
    /**
     * @en Effective bandwidth estimate in megabits per second, rounded to the
     * nearest multiple of 25 kilobits per seconds.
     * @zh 有效带宽估计（以兆位每秒为单位），四舍五入到
     * 25 kbps 的最接近倍数。
     */
    downlink: INetworkInformation['downlink'] | undefined;
    /**
     * @en Maximum downlink speed, in megabits per second (Mbps), for the
     * underlying connection technology
     * @zh 最大下行链路速度，以兆比特每秒 (Mbps) 为单位
     */
    downlinkMax: INetworkInformation['downlinkMax'] | undefined;
    /**
     * @en Effective type of the connection meaning one of 'slow-2g', '2g', '3g', or '4g'.
     * This value is determined using a combination of recently observed round-trip time
     * and downlink values.
     * @zh 连接的有效类型，表示“slow-2g”、“2g”、“3g”或“4g”之一。
     * 该值是根据最近观察到的往返时间和和下行链路值的组合确定的
     */
    effectiveType: INetworkInformation['effectiveType'] | undefined;
    /**
     * @en Estimated effective round-trip time of the current connection, rounded
     * to the nearest multiple of 25 milliseconds
     * @zh 当前连接的估计有效往返时间，四舍五入
     * 精确到 25 毫秒的最接近倍数
     */
    rtt: INetworkInformation['rtt'] | undefined;
    /**
     * @en {true} if the user has set a reduced data usage option on the user agent.
     * @zh 如果用户在用户代理上设置了减少数据使用选项，则为 {true}。
     */
    saveData: INetworkInformation['saveData'] | undefined;
    /**
     * @en The type of connection a device is using to communicate with the network.
     * It will be one of the following values:
     *  - bluetooth
     *  - cellular
     *  - ethernet
     *  - none
     *  - wifi
     *  - wimax
     *  - other
     *  - unknown
     * @zh 设备用于与网络通信的连接类型。
     * 它将是以下值之一：
     *  - 蓝牙
     * - 蜂窝网络
     * - 以太网
     *  - 没有任何
     *  - 无线上网
     * - 无线麦克斯
     *  - 其他
     * - 未知
     */
    type: INetworkInformation['type'] | undefined;
}
interface INetworkInformation extends EventTarget {
    readonly downlink: number;
    readonly downlinkMax: number;
    readonly effectiveType: 'slow-2g' | '2g' | '3g' | '4g';
    readonly rtt: number;
    readonly saveData: boolean;
    readonly type: 'bluetooth' | 'cellular' | 'ethernet' | 'none' | 'wifi' | 'wimax' | 'other' | 'unknown';
    onChange: (event: Event) => void;
}

declare const useNetwork: UseNetwork;

/**
 * @title useObjectUrl
 * @returns 返回一个由 Blob 或 MediaSource 对象生成的 URL（如果存在），否则返回 undefined
 * @returns_en Returns a URL created from the Blob or MediaSource object, or undefined if none exists
 */
type UseObjectUrl = (
/**
 * @zh 文件或者媒体对象
 * @en file or media source
 */
object: Blob | MediaSource) => string | undefined;

declare const useObjectUrl: UseObjectUrl;

declare const useOnceEffect: typeof useEffect | typeof react.useLayoutEffect;

declare const useOnceLayoutEffect: typeof react.useEffect | typeof useLayoutEffect;

/**
 * @title useOnline
 * @returns 网络是否在线
 * @returns_en whether netwotk is online
 */
type UseOnline = () => boolean | undefined;

declare const useOnline: UseOnline;

/**
 * @title useOrientation
 * @returns 包含以下元素的元组：
 * - 方向状态。
 * - 锁定方向。
 * - 解锁方向。
 * @returns_en A tuple with the following elements:
 * - orientation type.
 * - lock orientation.
 * - unlock orientation.
 */
type UseOrientation = (
/**
 * @zh 初始值
 * @en initial value
 */
initialState?: UseOrientationState) => readonly [
    UseOrientationState,
    (type: UseOrientationLockType) => any,
    () => void
];
/**
 * @title UseOrientationState
 */
interface UseOrientationState {
    /**
     * @zh 角度
     * @en document angle
     */
    angle: number;
    /**
     * @zh 方向类型
     * @en orientation type
     */
    type: UseOrientationType | undefined;
}
/**
 * @title UseOrientationType
 */
type UseOrientationType = 'portrait-primary' | 'portrait-secondary' | 'landscape-primary' | 'landscape-secondary';
/**
 * @title UseOrientationLockType
 */
type UseOrientationLockType = 'any' | 'natural' | 'landscape' | 'portrait' | 'portrait-primary' | 'portrait-secondary' | 'landscape-primary' | 'landscape-secondary';

declare const useOrientation: UseOrientation;

declare function usePageLeave(): boolean;

/**
 * @title usePermission
 * @returns 权限状态
 * @returns_en permission state
 */
type UsePermission = (
/**
 * @zh 权限描述符
 * @en permission desc
 */
permissionDesc: UsePermissionGeneralPermissionDescriptor | UsePermissionGeneralPermissionDescriptor['name']) => UsePermissionState;
/**
 * @title UsePermissionState
 */
type UsePermissionState = PermissionState | '';
/**
 * @title UsePermissionGeneralPermissionDescriptor
 */
type UsePermissionGeneralPermissionDescriptor = PermissionDescriptor | {
    name: UsePermissionDescriptorNamePolyfill;
};
/**
 * @title UsePermissionDescriptorNamePolyfill
 */
type UsePermissionDescriptorNamePolyfill = 'accelerometer' | 'accessibility-events' | 'ambient-light-sensor' | 'background-sync' | 'camera' | 'clipboard-read' | 'clipboard-write' | 'gyroscope' | 'magnetometer' | 'microphone' | 'notifications' | 'payment-handler' | 'persistent-storage' | 'push' | 'speaker';

declare const usePermission: UsePermission;

/**
 * @title usePreferredColorScheme
 * @returns prefers-color-scheme的媒体查询值
 * @returns_en value of prefers-color-scheme media query
 */
type UsePreferredColorScheme = (
/**
 * @zh 默认值
 * @en default value
 * @defaultValue no-preference
 */
defaultState?: ColorScheme) => ColorScheme;
/**
 * @title ColorScheme
 */
type ColorScheme = 'dark' | 'light' | 'no-preference';

declare const usePreferredColorScheme: UsePreferredColorScheme;

/**
 * @title usePreferredContrast
 */
type UsePreferredContrast = (
/**
 * @zh 默认值
 * @en default value
 * @defaultValue no-preference
 */
defaultState?: Contrast) => Contrast;
/**
 * @title Contrast
 */
type Contrast = 'more' | 'less' | 'custom' | 'no-preference';

declare const usePreferredContrast: UsePreferredContrast;

declare function usePreferredDark(defaultState?: boolean): boolean;

declare function usePrevious<T>(value: T): T | undefined;

/**
 * @title useRafFn
 * @returns 包含以下元素的元组：
 * - 停止函数。
 * - 开始函数。
 * - 函数是否在执行中。
 * @returns_en A tuple with the following elements:
 * - stop function
 * - start function
 * whether function is running
 */
type UseRafFn = (
/**
 * @zh 回调
 * @en callback
 */
callback: FrameRequestCallback, 
/**
 * @zh 立即执行
 * @en immediatly start
 */
initiallyActive?: boolean) => readonly [() => void, () => void, () => boolean];

declare const useRafFn: UseRafFn;

declare function useRafState<S>(initialState: S | (() => S)): readonly [S, Dispatch<SetStateAction<S>>];

declare function useReducedMotion(defaultState?: boolean): boolean;

/**
 * @title useResizeObserver
 */
type UseResizeObserver = (
/**
 * @zh dom元素
 * @en dom element
 */
target: BasicTarget<Element>, 
/**
 * @zh 回调
 * @en callback
 */
callback: ResizeObserverCallback, 
/**
 * @zh `resizeObserver` 参数
 * @en options passed to `resizeObserver`
 */
options?: ResizeObserverOptions) => () => void;

declare const useResizeObserver: UseResizeObserver;

declare function useScreenSafeArea(): readonly [string, string, string, string, lodash.DebouncedFunc<() => void>];

/**
 * @title useScriptTag
 * @returns 包含以下元素的元组：
 * - 用来加载资源的 html 元素。
 * - 资源加载状态。
 * - 资源加载函数。
 * - 资源卸载函数
 * @returns_en A tuple with the following elements:
 * - html element used to load resources.
 * - Resource loading status.
 * - Resource loading function.
 * - Resource unloading function
 */
type UseScriptTag = (
/**
 * @zh 资源地址
 * @en source
 */
src: string, 
/**
 * @zh 资源加载完成的回调
 * @en source loaded callback
 */
onLoaded?: (el: HTMLScriptElement) => void, 
/**
 * @zh 可选参数
 * @en optional params
 */
options?: UseScriptTagOptions) => readonly [
    HTMLScriptElement | null,
    UseScriptTagStatus,
    (waitForScriptLoad?: boolean) => Promise<HTMLScriptElement | boolean>,
    () => void
];
/**
 * @title UseScriptTagOptions
 */
interface UseScriptTagOptions {
    /**
     * @en Load the script immediately
     * @zh 立即加载资源
     * @defaultValue true
     */
    immediate?: boolean;
    /**
     * @en Add `async` attribute to the script tag
     * @zh 在 `script` 标签上加上 `async`
     * @defaultValue true
     */
    async?: boolean;
    /**
     * @en Script type
     * @zh 脚本类型
     * @defaultValue 'text/javascript'
     */
    type?: string;
    /**
     * @en Manual controls the timing of loading and unloading
     * @zh 手动控制加载和卸载时机
     * @defaultValue false
     */
    manual?: boolean;
    /**
     * @zh 跨域属性
     * @en cross origin
     */
    crossOrigin?: 'anonymous' | 'use-credentials';
    /**
     * @en referrer policy
     * @zh 来源属性
     */
    referrerPolicy?: 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url';
    /**
     * @en Add `noModule` attribute to the script tag
     * @zh 在 `script` 标签上加上 `noModule`
     */
    noModule?: boolean;
    /**
     * @en Add `defer` attribute to the script tag
     * @zh 在 `script` 标签上加上 `defer`
     */
    defer?: boolean;
    /**
     * @en Add custom attribute to the script tag
     * @zh 在 script 标签上添加自定义属性
     */
    attrs?: Record<string, string>;
}
/**
 * @title UseScriptTagStatus
 */
type UseScriptTagStatus = 'idle' | 'loading' | 'ready' | 'error';

declare const useScriptTag: UseScriptTag;

declare const useScroll: UseScroll;

/**
 * @title useScrollIntoView
 * @returns 包含以下元素的对象：
 * - scrollIntoView：滚动进入视口函数。
 * - cancel： 取消滚动函数。
 * @returns_en A object with the following elements:
 * - scrollIntoView: scroll target element into viewport
 * - cancel: cancel scroll function
 */
type UseScrollIntoView = (
/**
 * @zh dom对象
 * @en dom element
 */
targetElement: BasicTarget<HTMLElement>, 
/**
 * @zh 可选参数
 * @en optional params
 */ params?: UseScrollIntoViewPar