Slide Video

Put videos in the sliding card, for example: youtube

import BearCarousel from 'bear-react-carousel';
import ReactPlayer from 'react-player'

const imagesAndVideo = [
    {id: 1, type: 'video', video: 'https://www.youtube.com/watch?v=ysz5S6PUM-U'},
    {id: 2, type: 'image', image: require('@site/static/img/racing/02.jpg').default},
    {id: 3, type: 'image', image: require('@site/static/img/racing/03.jpg').default},
    {id: 4, type: 'image', image: require('@site/static/img/racing/04.jpg').default},
    {id: 5, type: 'image', image: require('@site/static/img/racing/05.jpg').default},
    {id: 6, type: 'image', image: require('@site/static/img/racing/06.jpg').default},
];

const imageAndVideoData = imagesAndVideo.map(row => {
    return {
        key: row.id,
        children: <BearSlideCard bgUrl={row.image}>
            {row.video &&
                <ReactPlayer width="100%" url='https://www.youtube.com/watch?v=ysz5S6PUM-U' />
            }
        </BearSlideCard>
    };
});


<BearCarousel 
    // ...ignore some
    height="360px"
    data={imageAndVideoData}
/>