@hyunjin/hooks/dist/index.d.ts

collection of useful hooks

import * as react from 'react';
import { Dispatch, SetStateAction, DependencyList, useLayoutEffect, EffectCallback, RefObject, ReactNode, Context } from 'react';
import * as react_jsx_runtime from 'react/jsx-runtime';

declare const useBodyScrollLock: (enable?: boolean) => void;

declare const useBoolean: (defaultValue?: boolean) => {
    value: boolean;
    setValue: Dispatch<SetStateAction<boolean>>;
    setTrue: () => void;
    setFalse: () => void;
    toggle: () => void;
};

declare const useCallbackOnce: <F extends (...args: unknown[]) => void>(callback: F, deps: DependencyList) => (...args: Parameters<F>) => void;

type CopiedValue = string | null;
type CopyFn = (text: string) => Promise<boolean>;
declare const useCopyToClipboard: () => {
    copiedText: CopiedValue;
    copy: CopyFn;
};

declare const useDebounce: <T>(value: T, delay?: number) => T;

/**
 * 현재 문서에 title을 설정합니다.
 *
 * @param title
 */
declare const useDocumentTitle: (title: string) => void;

type EventListenerOptions = {
    capture?: boolean;
    passive?: boolean;
    once?: boolean;
};
declare const useEventListener: <T extends Event>(eventName: string, handler: (event: T) => void, element?: EventTarget, options?: EventListenerOptions) => void;

type State<T> = {
    data?: T;
    error?: Error;
};
declare function useFetch<T = unknown>(url?: string, options?: RequestInit): State<T>;

declare const useForceUpdate: () => react.ActionDispatch<[]>;

type Delay = number | null;
type TimerHandler = (...args: unknown[]) => void;
/**
 * setInterval을 선언적으로 표현할 수 있는 훅입니다.
 *
 * @param callback - delay마다 실행될 함수
 * @param delay - 함수가 실행되는 간격, null로 설정하면 setInterval이 멈춥니다.
 */
declare const useInterval: (callback: TimerHandler, delay: Delay) => void;

declare const useIsClient: () => boolean;

declare const useIsFirstRender: () => boolean;

declare const useIsMounted: () => () => boolean;

/**
 *  React의 코드와 로직 맞춤. shared/ExecutionEnvironment
 *
 *  React currently throws a warning when using useLayoutEffect on the server.
 *  To get around it, we can conditionally useEffect on the server (no-op) and
 *  useLayoutEffect in the browser. We need useLayoutEffect to ensure the store
 *  subscription callback always has the selector from the latest render commit
 *  available, otherwise a store update may happen between render and the effect,
 *  which may cause missed updates; we also must ensure the store subscription
 *  is created synchronously, otherwise a store update may occur before the
 *  subscription is created and an inconsistent state may be observed
 *
 * reference
 * - React Redux 소스코드
 */
declare const canUseDOM: boolean;
declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;

declare const useIsScrolled: (threshold?: number) => boolean;

/**
 * 수정 필요
 * @param param0
 */
declare const useKeyPress: ({ useAltKey, active, targetCode, onPress, dep, }: {
    useAltKey?: boolean;
    targetCode: string | string[];
    onPress: () => void;
    dep?: DependencyList;
    active?: boolean;
}) => void;

declare const useLatestValue: <T>(value: T) => react.RefObject<T>;

declare const useLockScroll: (isOpen?: boolean) => void;

declare const useMount: (callback: EffectCallback) => void;

type Handler = (event: MouseEvent | TouchEvent) => void;
/**
 *
 * @param ref
 * @param handler
 */
declare const useOnClickOutside: <T extends HTMLElement = HTMLElement>(ref: RefObject<T>, handler: Handler) => void;

/**
 * https://react.dev/reference/react/useSyncExternalStore
 */
declare const useOnlineStatus: () => boolean;

type OverlayContextValue = {
    openOverlay: (id: string, element: ReactNode) => void;
    closeOverlay: (id: string) => void;
};
declare const OverlayProvider: ({ children }: {
    children: ReactNode;
}) => react_jsx_runtime.JSX.Element;
declare const useOverlayContext: () => OverlayContextValue;

declare const useOverlay: () => {
    open: (element: ReactNode) => void;
    close: () => void;
};

type CustomMessage = string | ((displayName?: string) => string);
declare const useSafeContext: <T>(unsafeContext: Context<T>, customMessage?: CustomMessage) => NonNullable<T>;

/**
 * @description toggle을 위한 훅입니다.
 * @param {T | undefined} [defaultValue] toggle하고 싶은 초기값입니다.
//  * @returns {[T, () => void, typeof setValue]} [value, toggle, setValue]를 반환합니다.
 */
declare const useToggle: <T>(defaultValue?: T) => [boolean, () => void, react.Dispatch<react.SetStateAction<boolean>>];

declare const useUpdateEffect: (effect: EffectCallback, deps: DependencyList) => void;

declare const useUpload: () => {
    upload: () => Promise<File | undefined>;
    file: File | undefined;
};

type WindowSize = {
    width: number;
    height: number;
};
declare const useWindowSize: () => WindowSize | undefined;

export { OverlayProvider, canUseDOM, useBodyScrollLock, useBoolean, useCallbackOnce, useCopyToClipboard, useDebounce, useDocumentTitle, useEventListener, useFetch, useForceUpdate, useInterval, useIsClient, useIsFirstRender, useIsMounted, useIsScrolled, useIsomorphicLayoutEffect, useKeyPress, useLatestValue, useLockScroll, useMount, useOnClickOutside, useOnlineStatus, useOverlay, useOverlayContext, useSafeContext, useToggle, useUpdateEffect, useUpload, useWindowSize };