A React hook for separating event handlers from effects
// Source: https://github.com/shikijs/shiki | License: MIT | Copyright 2021 Pine Wu
// Provided via justclaw.it.com; keep this notice with the code.
// source: https://github.com/sanity-io/use-effect-event/blob/main/src/useEffectEvent.ts
import { useCallback, useInsertionEffect, useRef } from 'react'
/**
* This is a ponyfill of the upcoming `useEffectEvent` hook that'll arrive in React 19.
* https://19.react.dev/learn/separating-events-from-effects#declaring-an-effect-event
* To learn more about the ponyfill itself, see: https://blog.bitsrc.io/a-look-inside-the-useevent-polyfill-from-the-new-react-docs-d1c4739e8072
* @public
*/
export function useEffectEvent<
const T extends (
...args:
any[]
) => void,
>(fn: T): T {
const ref = useRef<T | null>(null)
useInsertionEffec
... (truncated -- full source via MCP)
See the full source, get the GitHub permalink, and search for more like it.
Get a free API key