Nesting Penguins Molt

    @u-wave/react-youtube
    TypeScript icon, indicating that this package has built-in type declarations

    0.7.4 • Public • Published

    @u-wave/react-youtube

    YouTube player component for React.

    Install - Usage - Demo - Props

    Install

    npm install --save @u-wave/react-youtube
    

    Usage

    Demo - Demo source code

    import YouTube from '@u-wave/react-youtube';
    
    <YouTube
      video="x2to0hs"
      autoplay
    />

    Props

    Name Type Default Description
    video string An 11-character string representing a YouTube video ID..
    id string DOM ID for the player element.
    className string CSS className for the player element.
    style object Inline style for container element.
    width number, string Width of the player element.
    height number, string Height of the player element.
    paused bool Pause the video.
    autoplay bool false Whether the video should start playing automatically.
    https://developers.google.com/youtube/player_parameters#autoplay
    showCaptions bool false Whether to show captions below the video.
    https://developers.google.com/youtube/player_parameters#cc_load_policy
    controls bool true Whether to show video controls.
    https://developers.google.com/youtube/player_parameters#controls
    disableKeyboard bool false Ignore keyboard controls.
    https://developers.google.com/youtube/player_parameters#disablekb
    allowFullscreen bool true Whether to display the fullscreen button.
    https://developers.google.com/youtube/player_parameters#fs
    lang string The player's interface language. The parameter value is an ISO 639-1 two-letter language code or a fully specified locale.
    https://developers.google.com/youtube/player_parameters#hl
    annotations bool true Whether to show annotations on top of the video.
    https://developers.google.com/youtube/player_parameters#iv_load_policy
    startSeconds number Time in seconds at which to start playing the video.
    https://developers.google.com/youtube/player_parameters#start
    endSeconds number Time in seconds at which to stop playing the video.
    https://developers.google.com/youtube/player_parameters#end
    modestBranding bool false Remove most YouTube logos from the player.
    https://developers.google.com/youtube/player_parameters#modestbranding
    playsInline bool false Whether to play the video inline on iOS, instead of fullscreen.
    https://developers.google.com/youtube/player_parameters#playsinline
    showRelatedVideos bool true Whether to show related videos after the video is over.
    https://developers.google.com/youtube/player_parameters#rel
    volume number The playback volume, as a number between 0 and 1.
    muted bool Whether the video's sound should be muted.
    suggestedQuality string The suggested playback quality.
    https://developers.google.com/youtube/iframe_api_reference#Playback_quality
    playbackRate number Playback speed.
    https://developers.google.com/youtube/iframe_api_reference#setPlaybackRate
    onReady function Sent when the YouTube player API has loaded.
    onError function Sent when the player triggers an error.
    onCued function () => {} Sent when the video is cued and ready to play.
    onBuffering function () => {} Sent when the video is buffering.
    onPlaying function () => {} Sent when playback has been started or resumed.
    onPause function () => {} Sent when playback has been paused.
    onEnd function () => {} Sent when playback has stopped.
    onStateChange function
    onPlaybackRateChange function
    onPlaybackQualityChange function

    Related

    • react-dailymotion - A Dailymotion component with a similar declarative API.
    • @u-wave/react-vimeo - A Vimeo component with a similar declarative API.
    • react-youtube - A widely-used YouTube component. Its API matches the YouTube iframe API more closely, and it doesn't support prop-based volume/quality/playback changes.

    License

    MIT

    Install

    npm i @u-wave/react-youtube

    DownloadsWeekly Downloads

    3,121

    Version

    0.7.4

    License

    MIT

    Unpacked Size

    66.9 kB

    Total Files

    23

    Last publish

    Collaborators

    • goto-bus-stop