LC-1739 Add YouTube Video Support to Lightbox #68

hughesthatgirl · 2025-04-02T16:30:02Z

Added VideoPager component that handles animating navigation and interactions
- Maintained consistent animation behavior between images and videos
- Added video interaction handling to prevent unwanted navigation while interacting with videos
Added VideoEmbed component which is an iframe used for YouTube video integration
- Responsive sizing with aspect ratio preservation
- Gesture navigation support
- YouTube player controls enabled; video does not autoplay.
Updated ImageStage to use VideoPager when showVideo and videoId are present
Added unit tests for VideoLightBox example

Joanna Chandler and others added 23 commits March 28, 2025 10:30

Install dependencies

c76b4d5

Add optional video types to ImagesList

da7f366

Add VideoEmbed component

af2134c

Conditionally show VideoEmbed in ImageStage

5c7b38f

Add useGesture support to videoEmbed

829396b

Update LightBox to accept video props

a495961

Add a video example

f9b0cb2

Put back src

98f49b4

Re-work component a little bit. Re-style.

16f3a6c

Fix setting videoId

6def5bc

Style example link

dae22c8

Add VideoPager component to handle animations between videos and images

53a7412

Remove unused props

df988c2

Remove unused props

9b6e1ef

Remove description

f601ba8

Write unit tests

fed2ed0

Combine video and image pagers into one Pager component

0b242cf

Import react-youtube and use their tracking in VideoEmbed

567ff9c

Add tracking example

c650259

Successfully tracking, video played, duration, watch the whole video

c04b69b

Update README

745ff34

Delete VideoPager component

0673c94

Update tests

2281256

Provide feedback