A self-contained React hook that detects clicks outside a given element. It accepts a ref and a callback, attaches event listeners to the document, and cleans up on unmount. This is a common UX pattern that can be extracted into any React project with zero internal dependencies.

A hook that wraps the Clipboard API to copy text to the clipboard. It returns a stateful boolean indicating success and a copy function. No external dependencies, works in any React application, and handles browser compatibility gracefully.

A hook that manages a value while keeping a ref to the latest value. Useful in async contexts (e.g., event handlers) where stale closures are a problem. Returns [state, setState, ref]. Simple, well-documented, and reusable in any React codebase.

A HOC that injects scaling props (width, height, margin, padding, font) derived from a context-based scale factor. Components wrapped with withScale can respond to a global or per-instance scale value. This pattern is isolated and can be extracted for any project needing a consistent scaling system.

A reusable backdrop component for modals, drawers, and popovers. It renders a semi-transparent overlay with a click handler and custom style props. Uses React portal (via usePortal) and CSS transition for fade-in/out. No internal imports beyond shared utilities, making it easily extractable.

A React component that manages enter/leave CSS transitions for its children. Uses a state machine to apply classes for entering, entered, exiting, and exited states. Can be extracted to add smooth animations to any component without external libraries.