104 lines
2.1 KiB
Markdown
104 lines
2.1 KiB
Markdown
# @hublib-web/video-player
|
|
|
|
Video player package with shared runtime and framework adapters:
|
|
|
|
- `react` entrypoint with SSR-friendly player component
|
|
- `angular` adapter over framework-agnostic runtime
|
|
- `core` runtime/utilities for engine selection and token provider
|
|
|
|
## Install from Git (SSH tag)
|
|
|
|
```bash
|
|
yarn add "@hublib-web/video-player@git+ssh://git@github.com/ORG/REPO.git#workspace=@hublib-web/video-player&tag=video-player-v0.1.0"
|
|
```
|
|
|
|
## Install inside this monorepo
|
|
|
|
```bash
|
|
yarn add @hublib-web/video-player
|
|
```
|
|
|
|
## Release this package
|
|
|
|
1. Bump `version` in `packages/video-player/package.json`.
|
|
2. Build package artifacts:
|
|
|
|
```bash
|
|
yarn workspace @hublib-web/video-player build
|
|
```
|
|
|
|
3. Commit release files:
|
|
|
|
```bash
|
|
git add packages/video-player/package.json packages/video-player/dist
|
|
git commit -m "release(video-player): v0.1.0"
|
|
```
|
|
|
|
4. Create and push tag:
|
|
|
|
```bash
|
|
git tag -a video-player-v0.1.0 -m "@hublib-web/video-player v0.1.0"
|
|
git push origin main --follow-tags
|
|
```
|
|
|
|
Detailed docs:
|
|
|
|
- [Release policy](../../docs/release-policy.md)
|
|
- [Git installation](../../docs/git-installation.md)
|
|
|
|
## React usage
|
|
|
|
```tsx
|
|
import VideoPlayer, { type VideoJsPlayer } from "@hublib-web/video-player/react";
|
|
|
|
export const Example = () => (
|
|
<VideoPlayer
|
|
src="https://example.com/stream.m3u8"
|
|
aspectRatio="16:9"
|
|
controls
|
|
preload="auto"
|
|
onReady={(player: VideoJsPlayer) => {
|
|
player.play();
|
|
}}
|
|
/>
|
|
);
|
|
```
|
|
|
|
## Core usage
|
|
|
|
```ts
|
|
import { setVideoPlayerTokenProvider } from "@hublib-web/video-player/core";
|
|
|
|
setVideoPlayerTokenProvider(async () => {
|
|
// host app token resolver
|
|
return null;
|
|
});
|
|
```
|
|
|
|
## Angular usage
|
|
|
|
```ts
|
|
import { AngularVideoPlayerAdapter } from "@hublib-web/video-player/angular";
|
|
|
|
const adapter = new AngularVideoPlayerAdapter();
|
|
await adapter.attach(containerElement, {
|
|
source: { src: "https://example.com/stream.m3u8" },
|
|
});
|
|
```
|
|
|
|
## Development
|
|
|
|
Run from repository root:
|
|
|
|
```bash
|
|
yarn workspace @hublib-web/video-player build
|
|
yarn workspace @hublib-web/video-player typecheck
|
|
yarn workspace @hublib-web/video-player storybook
|
|
```
|
|
|
|
Build static Storybook:
|
|
|
|
```bash
|
|
yarn workspace @hublib-web/video-player storybook:build
|
|
```
|