chore: use returns

src/use-async-fn/index.mdx

@@ -53,7 +53,7 @@ export type UseAsyncFnOptions = {
 ### Returns
 
 ```tsx
-export type UseAsyncFnReturn<T extends AnyFunc> = {
+export type UseAsyncFnReturns<T extends AnyFunc> = {
   /**
    * a function to run the async function
    */

src/use-async-lock/index.mdx

@@ -46,7 +46,7 @@ A function that will be called when the function is locked and is called again.
 A function that can be used to ensure that **only one is running at a time**, return a promise that resolves the return value of the async function or the return value of the invalid operation callback function.
 
 ```tsx
-export type UseAsyncLockReturn<T extends AnyFunc, R extends AnyFunc> = (
+export type UseAsyncLockReturns<T extends AnyFunc, R extends AnyFunc> = (
   ...args: Parameters<T>
 ) => R extends undefined
   ? Promise<Awaited<ReturnType<T>> | undefined>

src/use-browser-memory/index.mdx

@@ -42,7 +42,7 @@ export type UseBrowserMemoryOptions = UseIntervalFnOptions & {
 ### Returns
 
 ```tsx
-export type UseBrowserMemoryReturn = {
+export type UseBrowserMemoryReturns = {
   /**
    * The timestamp when the memory info was last updated.
    */

src/use-clipboard-items/index.ts

@@ -6,7 +6,7 @@ import { useSupported } from '../use-supported'
 import { useTimeoutFn } from '../use-timeout-fn'
 
 import { useLatest } from '../use-latest'
-import type { UsePermissionReturn } from '../use-permission'
+import type { UsePermissionReturns } from '../use-permission'
 
 export interface UseClipboardItemsOptions<Source> {
   /**
@@ -50,7 +50,7 @@ export interface UseClipboardItemsReturns<Optional> {
   clear(): void
 }
 
-function isAllowed(status: UsePermissionReturn<false>) {
+function isAllowed(status: UsePermissionReturns<false>) {
   return status.current && ['granted', 'prompt'].includes(status.current)
 }
 

src/use-clipboard/index.ts

@@ -7,7 +7,7 @@ import { useSupported } from '../use-supported'
 import { useTimeoutFn } from '../use-timeout-fn'
 import { unwrapGettable } from '../utils/unwrap'
 
-import type { UsePermissionReturn } from '../use-permission'
+import type { UsePermissionReturns } from '../use-permission'
 import type { Gettable } from '../utils/basic'
 
 export interface UseClipboardOptions<Source> {
@@ -123,6 +123,6 @@ function legacyRead() {
   return document.getSelection()?.toString() ?? ''
 }
 
-function isAllowed(status: UsePermissionReturn<false>) {
+function isAllowed(status: UsePermissionReturns<false>) {
   return status.current && ['granted', 'prompt'].includes(status.current)
 }

src/use-device-list/index.mdx

@@ -57,7 +57,7 @@ export type UseDeviceListOptions = {
 ### Returns
 
 ```tsx
-export type UseDeviceListReturn = {
+export type UseDeviceListReturns = {
   /**
    * List of all devices
    */

src/use-element-size/index.mdx

@@ -30,7 +30,7 @@ import { Source } from '@/components'
 ## API
 
 ```tsx
-const { width, height, ...useResizeObserverReturn } = useElementSize(elementTarget, defaultValue, options)
+const { width, height, ...useResizeObserverReturns } = useElementSize(elementTarget, defaultValue, options)
 ```
 
 ### ElementTarget
@@ -63,5 +63,5 @@ Options of `useResizeObserver`, see [useResizeObserver#options](/reference/use-r
 Returns of `useResizeObserver`, see [useResizeObserver#returns](/reference/use-resize-observer/#returns) for more details.
 
 ```tsx
-export type UseElementSizeReturns = ElementSize & UseResizeObserverReturn
+export type UseElementSizeReturns = ElementSize & UseResizeObserverReturns
 ```

src/use-element-size/index.ts

@@ -2,7 +2,7 @@ import { useResizeObserver } from '../use-resize-observer'
 import { useSafeState } from '../use-safe-state'
 import { normalizeElement, useTargetElement } from '../use-target-element'
 
-import type { UseResizeObserverOptions, UseResizeObserverReturn } from '../use-resize-observer'
+import type { UseResizeObserverOptions, UseResizeObserverReturns } from '../use-resize-observer'
 import type { ElementTarget } from '../use-target-element'
 
 export interface ElementSize {
@@ -16,7 +16,7 @@ export interface ElementSize {
   height: number
 }
 
-export interface UseElementSizeReturns extends ElementSize, UseResizeObserverReturn {}
+export interface UseElementSizeReturns extends ElementSize, UseResizeObserverReturns {}
 
 export function useElementSize<T extends HTMLElement = HTMLElement>(
   target: ElementTarget<T>,

src/use-getter-ref/index.mdx

@@ -42,7 +42,7 @@ Initial value of the ref.
 ### Returns
 
 ```tsx
-export type UseGetterRefReturn<T> = [
+export type UseGetterRefReturns<T> = [
   /**
    * A mutable ref object that can be used to store a value.
    */

src/use-getter-ref/index.ts

@@ -1,7 +1,7 @@
 import { useRef } from 'react'
 import { useStableFn } from '../use-stable-fn'
 
-export type UseGetterRefReturn<T> = [
+export type UseGetterRefReturns<T> = [
   /**
    * A mutable ref object that can be used to store a value.
    */
@@ -12,7 +12,7 @@ export type UseGetterRefReturn<T> = [
   getter: () => T,
 ]
 
-export function useGetterRef<T>(initial: T): UseGetterRefReturn<T> {
+export function useGetterRef<T>(initial: T): UseGetterRefReturns<T> {
   const ref = useRef<T>(initial)
   const getter = useStableFn(() => ref.current)
   return [ref, getter] as const

src/use-infinite-scroll/index.mdx

@@ -73,7 +73,7 @@ export type UseInfiniteScrollOptions<T extends HTMLElement = HTMLElement> = UseS
 ### Returns
 
 ```tsx
-export type UseInfiniteScrollReturn = {
+export type UseInfiniteScrollReturns = {
   /**
    * loading state
    */

src/use-infinite-scroll/index.ts

@@ -40,7 +40,7 @@ export interface UseInfiniteScrollOptions<R> extends UseScrollOptions {
   canLoadMore?: (previousReturn: R | undefined) => boolean
 }
 
-export interface UseInfiniteScrollReturn {
+export interface UseInfiniteScrollReturns {
   /**
    * loading state
    */
@@ -60,7 +60,7 @@ export function useInfiniteScroll<R = any, T extends HTMLElement = HTMLElement>(
   target: ElementTarget<T>,
   onLoadMore: (previousReturn: R | undefined) => R | Promise<R>,
   options: UseInfiniteScrollOptions<R> = {},
-): UseInfiniteScrollReturn {
+): UseInfiniteScrollReturns {
   const { direction = 'bottom', immediate = true, interval = 100, canLoadMore = () => true, distance = 100 } = options
 
   const el = useTargetElement<T>(target)

src/use-intersection-observer/index.mdx

@@ -70,7 +70,7 @@ export type UseIntersectionObserverOptions = UseWebObserverOptions & Intersectio
 <Tip type="pausable" />
 
 ```tsx
-export interface UseWebObserverReturn<Observer> extends Pausable {
+export interface UseWebObserverReturns<Observer> extends Pausable {
   /**
    * ref that holds the observer instance
    */
@@ -81,5 +81,5 @@ export interface UseWebObserverReturn<Observer> extends Pausable {
   isSupported: boolean
 }
 
-export type UseIntersectionObserverReturn = UseWebObserverReturn<IntersectionObserver>
+export type UseIntersectionObserverReturns = UseWebObserverReturns<IntersectionObserver>
 ```

src/use-intersection-observer/index.ts

@@ -1,17 +1,17 @@
 import { useWebObserver } from '../use-web-observer'
 
 import type { ElementTarget } from '../use-target-element'
-import type { UseWebObserverOptions, UseWebObserverReturn } from '../use-web-observer'
+import type { UseWebObserverOptions, UseWebObserverReturns } from '../use-web-observer'
 import type { Arrayable } from '../utils/basic'
 
 export interface UseIntersectionObserverOptions extends UseWebObserverOptions, IntersectionObserverInit {}
-export interface UseIntersectionObserverReturn extends UseWebObserverReturn<IntersectionObserver> {}
+export interface UseIntersectionObserverReturns extends UseWebObserverReturns<IntersectionObserver> {}
 
 export function useIntersectionObserver(
   target: Arrayable<ElementTarget>,
   callback: IntersectionObserverCallback,
   options: UseIntersectionObserverOptions = {},
-): UseIntersectionObserverReturn {
+): UseIntersectionObserverReturns {
   const { immediate = true, ...initOptions } = options
 
   return useWebObserver('IntersectionObserver', target, callback, { immediate }, initOptions)

src/use-interval-fn/index.mdx

@@ -65,5 +65,5 @@ import { Tip } from '@/components'
 <Tip type="pausable" />
 
 ```tsx
-export type UseIntervalFnReturn = Pausable
+export type UseIntervalFnReturns = Pausable
 ```

src/use-interval/index.mdx

@@ -76,7 +76,7 @@ export interface UseIntervalAction extends UseCounterReturnsAction, Pausable {
   reset: (count?: number) => void
 }
 
-export type UseIntervalWithControlsReturn = [
+export type UseIntervalWithControlsReturns = [
   /**
    * Current count
    */
@@ -87,5 +87,5 @@ export type UseIntervalWithControlsReturn = [
   UseIntervalAction,
 ]
 
-export type UseIntervalReturn<Controls extends boolean> = Controls extends true ? UseIntervalWithControlsReturn : number
+export type UseIntervalReturns<Controls extends boolean> = Controls extends true ? UseIntervalWithControlsReturns : number
 ```

src/use-interval/index.ts

@@ -32,7 +32,7 @@ export interface UseIntervalAction extends UseCounterReturnsAction, Pausable {
   reset: (count?: number) => void
 }
 
-export type UseIntervalWithControlsReturn = [
+export type UseIntervalWithControlsReturns = [
   /**
    * Current count
    */
@@ -43,13 +43,18 @@ export type UseIntervalWithControlsReturn = [
   UseIntervalAction,
 ]
 
-export type UseIntervalReturn<Controls extends boolean> = Controls extends true ? UseIntervalWithControlsReturn : number
+export type UseIntervalReturns<Controls extends boolean> = Controls extends true
+  ? UseIntervalWithControlsReturns
+  : number
 
 export function useInterval(
   interval?: UseIntervalFnInterval,
   options?: UseIntervalOptions<false>,
-): UseIntervalReturn<false>
-export function useInterval(interval: UseIntervalFnInterval, options: UseIntervalOptions<true>): UseIntervalReturn<true>
+): UseIntervalReturns<false>
+export function useInterval(
+  interval: UseIntervalFnInterval,
+  options: UseIntervalOptions<true>,
+): UseIntervalReturns<true>
 export function useInterval(interval: UseIntervalFnInterval = 1000, options: UseIntervalOptions<boolean> = {}) {
   const { controls: exposeControls = false, immediate = true, callback } = options
   const [count, actions] = useCounter(0)

src/use-key-modifier/index.mdx

@@ -71,3 +71,7 @@ export type UseModifierOptions<Initial> = {
 ### Returns
 
 `boolean | null`, `boolean` indicates if the key modifier is pressed, `null` is means that the events not yet fired.
+
+```tsx
+export type UseKeyModifierReturns<Initial> = Initial extends boolean ? boolean : boolean | null
+```

src/use-key-modifier/index.ts

@@ -35,12 +35,12 @@ export interface UseModifierOptions<Initial> {
   initial?: Initial
 }
 
-export type UseKeyModifierReturn<Initial> = Initial extends boolean ? boolean : boolean | null
+export type UseKeyModifierReturns<Initial> = Initial extends boolean ? boolean : boolean | null
 
 export function useKeyModifier<Initial extends boolean | null>(
   modifier: KeyModifier,
   options: UseModifierOptions<Initial> = {},
-): UseKeyModifierReturn<Initial> {
+): UseKeyModifierReturns<Initial> {
   const { events = defaultEvents, initial = null } = options
   const [state, setState] = useSafeState(initial as boolean)
 

src/use-loading-fn/index.mdx

@@ -29,6 +29,4 @@ import { Source } from '@/components'
 
 ## API
 
-```tsx
-useLoadingFn(fn)
-```
+See [useAsyncFn#api](/reference/use-async-fn/#api) for more details.

src/use-loading-fn/index.ts

@@ -4,8 +4,8 @@ import type { UseAsyncFnOptions, UseAsyncFnReturns } from '../use-async-fn'
 import type { AnyFunc } from '../utils/basic'
 
 export interface UseLoadingFnOptions extends UseAsyncFnOptions {}
-export interface UseLoadingFnReturn<T extends AnyFunc> extends UseAsyncFnReturns<T> {}
+export interface UseLoadingFnReturns<T extends AnyFunc> extends UseAsyncFnReturns<T> {}
 
-export function useLoadingFn<T extends AnyFunc>(fn: T, options: UseLoadingFnOptions = {}): UseLoadingFnReturn<T> {
+export function useLoadingFn<T extends AnyFunc>(fn: T, options: UseLoadingFnOptions = {}): UseLoadingFnReturns<T> {
   return useAsyncFn(fn, options)
 }

src/use-long-press/demo.tsx

@@ -1,9 +1,9 @@
 import { Card } from '@/components'
 import { useLongPress } from '@shined/react-use'
 
-import type { UseLongPressReturn } from '@shined/react-use'
+import type { UseLongPressReturns } from '@shined/react-use'
 
-const getTipAndBgColor = (lp: UseLongPressReturn) => {
+const getTipAndBgColor = (lp: UseLongPressReturns) => {
   if (lp.isMeetThreshold) return { tip: 'Meet threshold 😅', bgColor: 'bg-red/80' }
   if (lp.isLongPressed) return { tip: 'Long pressed 👍', bgColor: 'bg-primary/80' }
   if (lp.isPressed) return { tip: 'Pressed, hold on 😊', bgColor: 'bg-blue/80' }

src/use-long-press/index.mdx

@@ -93,7 +93,7 @@ export interface UseLongPressOptions {
 ### Returns
 
 ```tsx
-export type UseLongPressReturn = {
+export type UseLongPressReturns = {
   /**
    * Whether the element is pressed
    */

src/use-long-press/index.ts

@@ -54,15 +54,15 @@ export interface UseLongPressOptions {
   distanceThreshold?: number | false
 }
 
-const defaultFalsyState: Pick<UseLongPressReturn, 'isPressed' | 'isLongPressed' | 'isMeetThreshold'> = {
+const defaultFalsyState: Pick<UseLongPressReturns, 'isPressed' | 'isLongPressed' | 'isMeetThreshold'> = {
   isPressed: false,
   isLongPressed: false,
   isMeetThreshold: false,
 }
 
 export type UseLongPressHandler = (evt: PointerEvent) => void
 
-export interface UseLongPressReturn {
+export interface UseLongPressReturns {
   /**
    * Whether the element is pressed
    */
@@ -85,7 +85,7 @@ export function useLongPress(
   target: ElementTarget,
   handler?: UseLongPressHandler,
   options?: UseLongPressOptions,
-): UseLongPressReturn {
+): UseLongPressReturns {
   const el = useTargetElement(target)
   const timeout = useRef<SetTimeoutReturn | null>(null)
   const posStart = useRef<Position | undefined>()

src/use-manual-state-history/index.mdx

@@ -98,7 +98,7 @@ export type UseRefHistoryRecord<T> = {
   timestamp: number
 }
 
-export type UseManualStateHistoryReturn<Raw, Serialized> = {
+export type UseManualStateHistoryReturns<Raw, Serialized> = {
   /**
    * The source state
    */

src/use-manual-state-history/index.ts

@@ -60,7 +60,7 @@ export interface UseManualStateHistoryOptions<Raw, Serialized = Raw> {
   parse?: (v: Serialized) => Raw
 }
 
-export interface UseManualStateHistoryReturn<Raw, Serialized> {
+export interface UseManualStateHistoryReturns<Raw, Serialized> {
   /**
    * The source state
    */
@@ -122,7 +122,7 @@ function defaultParse<R, S>(clone?: boolean | CloneFn<R>) {
 export function useManualStateHistory<Raw, Serialized = Raw>(
   source: Raw,
   options: UseManualStateHistoryOptions<Raw, Serialized> = {},
-): UseManualStateHistoryReturn<Raw, Serialized> {
+): UseManualStateHistoryReturns<Raw, Serialized> {
   const {
     clone = false,
     dump = defaultDump<Raw, Serialized>(clone),

src/use-media-query/index.mdx

@@ -53,5 +53,5 @@ If `queryString` is a `string`, returns a `boolean` value that indicates whether
 If `queryString` is an array, returns an array of `boolean` values that indicate whether the media queries match.
 
 ```tsx
-export type UseMediaQueryReturn<T, R> = R extends T[] ? boolean[] : boolean
+export type UseMediaQueryReturns<T, R> = R extends T[] ? boolean[] : boolean
 ```

src/use-media-query/index.ts

@@ -8,7 +8,7 @@ import type { Arrayable, Gettable } from '../utils/basic'
 
 export type UseMediaQueryType = Gettable<string>
 export type MediaQueryChangeListener = (this: MediaQueryList, ev: MediaQueryListEvent) => void
-export type UseMediaQueryReturn<T, R> = R extends T[] ? boolean[] : boolean
+export type UseMediaQueryReturns<T, R> = R extends T[] ? boolean[] : boolean
 
 export interface UseMediaQueryOptions extends AddEventListenerOptions {}
 
@@ -18,7 +18,7 @@ export interface UseMediaQueryOptions extends AddEventListenerOptions {}
 export function useMediaQuery<T extends UseMediaQueryType, R extends Arrayable<T> = Arrayable<T>>(
   query: R,
   options: UseMediaQueryOptions = {},
-): UseMediaQueryReturn<T, R> {
+): UseMediaQueryReturns<T, R> {
   const { ...addEventListenerOptions } = options
   const queryStrings = unwrapArrayable(query).filter(Boolean).map(unwrapGettable)
   const mediaQueries = useRef<(MediaQueryList & { handler?: MediaQueryChangeListener })[]>([])