{"id":28275435,"url":"https://github.com/boxcast/boxcast-sdk-react-native","last_synced_at":"2025-06-16T15:31:31.322Z","repository":{"id":34981407,"uuid":"192802530","full_name":"boxcast/boxcast-sdk-react-native","owner":"boxcast","description":"BoxCast SDK for React Native","archived":false,"fork":false,"pushed_at":"2023-07-08T11:56:34.000Z","size":13044,"stargazers_count":4,"open_issues_count":7,"forks_count":4,"subscribers_count":14,"default_branch":"master","last_synced_at":"2025-05-21T03:16:53.425Z","etag":null,"topics":["boxcast","hls","live-streaming","react","react-native","sdk","streaming","video"],"latest_commit_sha":null,"homepage":"https://www.boxcast.com","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/boxcast.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}},"created_at":"2019-06-19T20:49:48.000Z","updated_at":"2022-08-26T16:06:21.000Z","dependencies_parsed_at":"2023-01-15T11:30:43.750Z","dependency_job_id":null,"html_url":"https://github.com/boxcast/boxcast-sdk-react-native","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/boxcast/boxcast-sdk-react-native","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/boxcast%2Fboxcast-sdk-react-native","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/boxcast%2Fboxcast-sdk-react-native/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/boxcast%2Fboxcast-sdk-react-native/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/boxcast%2Fboxcast-sdk-react-native/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/boxcast","download_url":"https://codeload.github.com/boxcast/boxcast-sdk-react-native/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/boxcast%2Fboxcast-sdk-react-native/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260187101,"owners_count":22971569,"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":["boxcast","hls","live-streaming","react","react-native","sdk","streaming","video"],"created_at":"2025-05-21T03:14:09.997Z","updated_at":"2025-06-16T15:31:31.291Z","avatar_url":"https://github.com/boxcast.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# BoxCast SDK for React Native\n\nAll you need to build your own awesome video app to showcase your BoxCast channels and broadcasts.\n\nInternally, playback depends on the React Native `\u003cVideo\u003e` component from [react-native-video](https://github.com/react-native-community/react-native-video).\n\n## Preview\n\n\u003cimg src=\"https://github.com/boxcast/boxcast-sdk-react-native/blob/master/boxcast-sdk-react-native-demo-1.gif?raw=true\"\u003e\n\n## Features\n\n* Infinite scrolling display of all broadcasts in a channel via `\u003cChannelList /\u003e`\n* Channel scroller can go horizontal or vertical\n* Full screen video playback via `\u003cBroadcastModalView /\u003e`\n* Drag and dock the video player to continue browsing app while video plays\n* Simple inline video playback with `\u003cBroadcastVideo /\u003e`\n\n## Install\n\n_NOTE: This library depends on the separate react-native-video project, which\nhas platform-specific installation requirements.  Please review the installation guide at\n\u003ca href=\"https://github.com/react-native-community/react-native-video\"\u003ereact-native-community/react-native-video\u003c/a\u003e._\n\n```\nnpm install --save boxcast-sdk-react-native\nnpm install --save react-native-video@5.0.2\n\n## Then, for React Native v0.59 and below\n# react-native link react-native-video\n\n## ... or for React Native v0.60 and above\n# cd ios \u0026\u0026 pod install\n```\n\n\n## Usage\n\n* Import\n\n```JavaScript\nimport { ChannelList, BroadcastModalView } from 'boxcast-sdk-react-native';\n```\n\n* Render horizontal channel scroller with dockable video player on tap\n\n```JavaScript\n...\n\nrender() {\n  return (\n    \u003cView style={{flex:1}}\u003e\n      \u003cView style={{height:150, width:'100%'}}\u003e\n        \u003cChannelList channelId={MY_BOXCAST_CHANNEL_ID}\n                    query={'timeframe:relevant timeframe:next'}\n                    sort={'-starts_at'}\n                    pageSize={10}\n                    onSelectBroadcast={(broadcast) =\u003e this.setState({broadcast})}\n                    horizontal={true} /\u003e\n      \u003c/View\u003e\n      {this.state.broadcast \u0026\u0026\n        \u003cBroadcastModalView\n            broadcast={this.state.broadcast}\n            dockable={true}\n            onDismiss={() =\u003e this.setState({broadcast: null})} /\u003e\n      }\n    \u003c/View\u003e\n  );\n}\n```\n\n* Render vertical channel scroller with fixed (non-dockable) video player on tap\n\n```JavaScript\n...\n\nrender() {\n  return (\n    \u003cView style={{flex:1}}\u003e\n      \u003cChannelList channelId={MY_BOXCAST_CHANNEL_ID}\n                   query={'timeframe:relevant timeframe:next'}\n                   sort={'-starts_at'}\n                   pageSize={10}\n                   onSelectBroadcast={(broadcast) =\u003e this.setState({broadcast})}\n                   horizontal={false} /\u003e\n      {this.state.broadcast \u0026\u0026\n        \u003cBroadcastModalView\n            broadcast={this.state.broadcast}\n            dockable={false}\n            onDismiss={() =\u003e this.setState({broadcast: null})} /\u003e\n      }\n    \u003c/View\u003e\n  );\n}\n```\n\n## Components\n\n### ChannelList\n\nHorizontal or vertical display of all broadcasts in a given channel\n\n*Properties*\n\n Name | Description | Default | Type\n------|-------------|----------|-----------\nchannelId | BoxCast channel ID. Required. | - | string (required)\nhorizontal | Scroll horizontally? | false | boolean\ntitleStyle | Additional styles to apply | null | StyleObject\nonSelectBroadcast | Callback when a broadcast is selected | - | function\npageSize | Number of broadcasts to query at a time from API | 20 | int\nquery | API query for filtering the result set | timeframe:relevant | string\nsort | API sort parameter | -starts_at | string\n\n### BroadcastModalView\n\nFull-screen modal view of video and details for a given broadcast.\n\n*Properties*\n\n Name | Description | Default | Type\n------|-------------|----------|-----------\nbroadcast | BoxCast broadcast object. Required. | - | object (required)\ndockable | Enable dragging/docking behavior? | false | boolean\ndismissText | Text to use on the dismiss button | Close | string\ndismissStyle | Additional styles to apply to the dismiss button| null | StyleObject\nonDismiss | Callback when the modal is closed | - | function\ndragAcceleration | Value used to control vertical drag acceleration when dragging/docking | 1.0 | float\n\n\n### BroadcastVideo\n\nSimple inline video playback for a given broadcast.\n\n*Properties*\n\n Name | Description | Default | Type\n------|-------------|----------|-----------\nbroadcast | BoxCast broadcast object. Required. | - | object (required)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fboxcast%2Fboxcast-sdk-react-native","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fboxcast%2Fboxcast-sdk-react-native","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fboxcast%2Fboxcast-sdk-react-native/lists"}