This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useCallback, useEffect, useRef, useState } from "react"; | |
interface UseUndoHook<T> { | |
value: T; | |
onChange: (newValue: T) => void; | |
undo: () => void; | |
redo: () => void; | |
clear: () => void; | |
canUndo: boolean; | |
canRedo: boolean; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useCallback, useEffect, useState } from "react"; | |
type FetchState<T> = { | |
data: T | null; | |
isLoading: boolean; | |
error: Error | null; | |
isCached: boolean; | |
refetch: () => void; | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useEffect, useRef, useState } from "react"; | |
interface MeasureResult<T extends Element> { | |
ref: React.RefObject<T>; | |
bounds: DOMRectReadOnly; | |
} | |
const useMeasure = <T extends Element = Element>(): MeasureResult<T> => { | |
const ref = useRef<T>(null); | |
const [bounds, setBounds] = useState<DOMRectReadOnly>(new DOMRectReadOnly()); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useEffect, useState } from "react"; | |
function useLocalStorage() { | |
const [loadingStates, setLoadingStates] = useState<Map<string, boolean>>( | |
new Map() | |
); | |
const setStorageValue = <T>(key: string, value: T) => { | |
try { | |
window.localStorage.setItem(key, JSON.stringify(value)); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useEffect, useState } from "react"; | |
const defaultEvents = [ | |
"mousemove", | |
"mousedown", | |
"touchstart", | |
"keydown", | |
"wheel", | |
"resize", | |
]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useCallback, useEffect, useRef } from "react"; | |
export function useLongPress({ | |
delay, | |
onLongPress, | |
onClick, | |
onCancel, | |
onFinish, | |
onStart, | |
}: { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useCallback, useEffect, useRef, useState } from "react"; | |
/** | |
* Custom React hook for double-click confirmation for critical actions. | |
* | |
* @param action - The action to be executed on the second click. | |
* @param timeout - Time in milliseconds to reset the unlocked state. | |
* @returns The current unlocked state and the trigger function. | |
*/ | |
const useConfirmation = (action: () => void, timeout: number = 5000) => { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useCallback, useState } from "react"; | |
// Custom hook to copy text to clipboard | |
const useCopyToClipboard = (timeoutDuration: number = 1000) => { | |
const [copied, setCopied] = useState(false); | |
const [error, setError] = useState<Error | null>(null); | |
const copyToClipboard = useCallback( | |
async (text: string) => { | |
try { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useEffect } from "react"; | |
const Keys = { | |
Backspace: "Backspace", | |
Tab: "Tab", | |
Enter: "Enter", | |
Shift: "Shift", | |
Control: "Control", | |
Alt: "Alt", | |
Pause: "Pause", |