df378d33ef
Some checks failed
CI / go (push) Waiting to run
CI / docker (push) Waiting to run
CI / lint-go (push) Waiting to run
CI / lint-docs (push) Waiting to run
CI / check-paperclip (push) Waiting to run
Deploy static site / Deploy to GitHub Pages (push) Has been cancelled
Deploy static site / Deploy via Docker to hatch.surf (push) Has been cancelled
Resolved conflicts by taking GitHub versions for: - .dockerignore, .gitignore, Dockerfile, README.md, docker-compose.yml Kept deploy.sh updated to: - Pull from GitHub (primary source) - Push to Gitea (push-mirror) - Build from site/ directory (GitHub structure) Co-Authored-By: Paperclip <noreply@paperclip.ing>
36 lines
965 B
TypeScript
36 lines
965 B
TypeScript
interface Options {
|
|
enterDelay?: number;
|
|
exitDelay?: number;
|
|
onUnmount?: () => void;
|
|
}
|
|
/**
|
|
* Useful to perform CSS transitions on React components without
|
|
* using libraries like Framer Motion. This hook will defer the
|
|
* unmount of a React component until after a delay.
|
|
*
|
|
* @param active - Whether the component should be rendered
|
|
* @param options - Options for the delayed render
|
|
* @param options.enterDelay - Delay before rendering the component
|
|
* @param options.exitDelay - Delay before unmounting the component
|
|
*
|
|
* const Modal = ({ active }) => {
|
|
* const { mounted, rendered } = useDelayedRender(active, {
|
|
* exitDelay: 2000,
|
|
* })
|
|
*
|
|
* if (!mounted) return null
|
|
*
|
|
* return (
|
|
* <Portal>
|
|
* <div className={rendered ? 'modal visible' : 'modal'}>...</div>
|
|
* </Portal>
|
|
* )
|
|
*}
|
|
*
|
|
* */
|
|
export declare function useDelayedRender(active?: boolean, options?: Options): {
|
|
mounted: boolean;
|
|
rendered: boolean;
|
|
};
|
|
export {};
|