Skip to content

Conversation

Copy link

Copilot AI commented Jan 28, 2026

PR #20 adds forwardRef to the Video component, enabling programmatic control via refs. The maintainer raised a valid concern about React 19 deprecating forwardRef.

Changes

Video Component (src/components/Video.tsx)

  • Wrapped component with forwardRef<HTMLVideoElement, IKVideoProps>
  • Added ref forwarding to underlying <video> element (placed after spread operator for proper precedence)
  • Added displayName for debugging
  • Added JSDoc example demonstrating ref usage

Usage:

const videoRef = useRef<HTMLVideoElement>(null);

useEffect(() => {
  if (inView) videoRef.current?.play();
  else videoRef.current?.pause();
}, [inView]);

<Video ref={videoRef} src="/video.mp4" muted playsInline />

Documentation

  • REACT_19_MIGRATION.md: Explains why forwardRef is required for React 18, React 19's deprecation timeline, and migration strategies
  • PR_20_VERIFICATION_SUMMARY.md: Complete analysis including type safety verification, comparison with Image component approach, and recommendation to merge

Deprecation Analysis

Current: Library targets React 18 (@types/react: ^18.3.3)
React 18: forwardRef is required—function components cannot receive refs directly
React 19: forwardRef is deprecated but remains functional for backward compatibility

The implementation is correct for React 18. Migration to React 19's ref-as-prop pattern can be handled when the library adds React 19 support, either by:

  1. Keeping forwardRef for backward compatibility ("react": "^18.0.0 || ^19.0.0")
  2. Dropping React 18 support in a major version bump

Type Safety

Generated type correctly shows ref support:

export declare const Video: React.ForwardRefExoticComponent<
  Omit<IKVideoProps, "ref"> & React.RefAttributes<HTMLVideoElement>
>;

Note: The Image component doesn't use forwardRef because it wraps Next.js's <NextImage>, which handles ref forwarding internally. Video wraps a native HTML element, requiring explicit forwardRef.


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copilot AI changed the title [WIP] Verify changes in PR #20 for accuracy Verify and apply PR #20: Add forwardRef to Video component Jan 28, 2026
Copilot AI requested a review from imagekitio January 28, 2026 08:19
@imagekitio imagekitio closed this Jan 28, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants