{"id":20643962,"url":"https://github.com/u-wave/react-youtube","last_synced_at":"2025-05-16T07:07:34.640Z","repository":{"id":20007878,"uuid":"85941798","full_name":"u-wave/react-youtube","owner":"u-wave","description":"YouTube player component for React.","archived":false,"fork":false,"pushed_at":"2025-01-06T12:41:52.000Z","size":1731,"stargazers_count":126,"open_issues_count":9,"forks_count":18,"subscribers_count":4,"default_branch":"default","last_synced_at":"2025-05-09T01:18:16.267Z","etag":null,"topics":["embed","react","react-component","react-youtube","react-youtube-player","youtube","youtube-player","youtube-player-component"],"latest_commit_sha":null,"homepage":"https://u-wave.net/react-youtube","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/u-wave.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-03-23T11:24:29.000Z","updated_at":"2025-02-25T14:53:33.000Z","dependencies_parsed_at":"2024-06-18T15:26:17.161Z","dependency_job_id":"1be2c23f-b110-445c-a2f5-cf0dcb2fd172","html_url":"https://github.com/u-wave/react-youtube","commit_stats":{"total_commits":197,"total_committers":5,"mean_commits":39.4,"dds":"0.37055837563451777","last_synced_commit":"46ca09dbcb5689aef71a39c7687460709d532e15"},"previous_names":[],"tags_count":24,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u-wave%2Freact-youtube","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u-wave%2Freact-youtube/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u-wave%2Freact-youtube/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/u-wave%2Freact-youtube/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/u-wave","download_url":"https://codeload.github.com/u-wave/react-youtube/tar.gz/refs/heads/default","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254485065,"owners_count":22078767,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["embed","react","react-component","react-youtube","react-youtube-player","youtube","youtube-player","youtube-player-component"],"created_at":"2024-11-16T16:14:24.337Z","updated_at":"2025-05-16T07:07:34.619Z","avatar_url":"https://github.com/u-wave.png","language":"JavaScript","readme":"# @u-wave/react-youtube\n\nYouTube player component for React.\n\n[Install][] - [Usage][] - [Demo][] - [Props][]\n\n## Install\n\n```\nnpm install --save @u-wave/react-youtube\n```\n\n## Usage\n\n[Demo][] - [Demo source code][]\n\n```js\nimport YouTube from '@u-wave/react-youtube';\n\n\u003cYouTube\n  video=\"x2to0hs\"\n  autoplay\n/\u003e\n```\n\n## Props\n| Name | Type | Default | Description |\n|:-----|:-----|:-----|:-----|\n| video | string |  | An 11-character string representing a YouTube video ID.. |\n| id | string |  | DOM ID for the player element. |\n| className | string |  | CSS className for the player element. |\n| style | object |  | Inline style for container element. |\n| width | number, string |  | Width of the player element. |\n| height | number, string |  | Height of the player element. |\n| paused | bool |  | Pause the video. |\n| autoplay | bool | false | Whether the video should start playing automatically.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#autoplay |\n| showCaptions | bool | false | Whether to show captions below the video.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#cc_load_policy |\n| controls | bool | true | Whether to show video controls.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#controls |\n| disableKeyboard | bool | false | Ignore keyboard controls.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#disablekb |\n| allowFullscreen | bool | true | Whether to display the fullscreen button.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#fs |\n| lang | string |  | The player's interface language. The parameter value is an ISO 639-1 two-letter language code or a fully specified locale.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#hl |\n| annotations | bool | true | Whether to show annotations on top of the video.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#iv_load_policy |\n| startSeconds | number |  | Time in seconds at which to start playing the video.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#start |\n| endSeconds | number |  | Time in seconds at which to stop playing the video.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#end |\n| modestBranding | bool | false | Remove most YouTube logos from the player.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#modestbranding |\n| playsInline | bool | false | Whether to play the video inline on iOS, instead of fullscreen.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#playsinline |\n| showRelatedVideos | bool | true | Whether to show related videos after the video is over.\u003cbr\u003ehttps://developers.google.com/youtube/player_parameters#rel |\n| volume | number |  | The playback volume, **as a number between 0 and 1**. |\n| muted | bool |  | Whether the video's sound should be muted. |\n| suggestedQuality | string |  | The suggested playback quality.\u003cbr\u003ehttps://developers.google.com/youtube/iframe_api_reference#Playback_quality |\n| playbackRate | number |  | Playback speed.\u003cbr\u003ehttps://developers.google.com/youtube/iframe_api_reference#setPlaybackRate |\n| onReady | function |  | Sent when the YouTube player API has loaded. |\n| onError | function |  | Sent when the player triggers an error. |\n| onCued | function | () =\u003e {} | Sent when the video is cued and ready to play. |\n| onBuffering | function | () =\u003e {} | Sent when the video is buffering. |\n| onPlaying | function | () =\u003e {} | Sent when playback has been started or resumed. |\n| onPause | function | () =\u003e {} | Sent when playback has been paused. |\n| onEnd | function | () =\u003e {} | Sent when playback has stopped. |\n| onStateChange | function |  |  |\n| onPlaybackRateChange | function |  |  |\n| onPlaybackQualityChange | function |  |  |\n\n## Related\n\n - [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.\n - [@u-wave/react-vimeo][] - A Vimeo component with a similar declarative API.\n\n## License\n\n[MIT][]\n\n[Install]: #install\n[Usage]: #usage\n[Props]: #props\n[Demo]: https://u-wave.net/react-youtube\n[Demo source code]: ./example\n[MIT]: ./LICENSE\n[react-youtube]: https://github.com/tjallingt/react-youtube\n[@u-wave/react-vimeo]: https://github.com/u-wave/react-vimeo\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fu-wave%2Freact-youtube","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fu-wave%2Freact-youtube","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fu-wave%2Freact-youtube/lists"}