_hublib-web/packages/video-player/README.md

@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)

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

yarn add @hublib-web/video-player

Release this package

1. Bump version in packages/video-player/package.json.
2. Build package artifacts:

yarn workspace @hublib-web/video-player build

3. Commit release files:

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:

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
• Git installation

React usage

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

import { setVideoPlayerTokenProvider } from "@hublib-web/video-player/core";

setVideoPlayerTokenProvider(async () => {
  // host app token resolver
  return null;
});

Angular usage

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:

yarn workspace @hublib-web/video-player build
yarn workspace @hublib-web/video-player typecheck
yarn workspace @hublib-web/video-player storybook

Build static Storybook:

yarn workspace @hublib-web/video-player storybook:build