@tiwz/react-video-player 2.0.2 → 2.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -14
- package/dist/index.js +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +2 -8
package/README.md
CHANGED
|
@@ -13,7 +13,7 @@ A modern, fully-featured, and mobile-friendly React video player component with
|
|
|
13
13
|
- 🔊 Volume control + mute toggle
|
|
14
14
|
- 🎯 Multi-quality source switching (resumes from same timestamp)
|
|
15
15
|
- ⚡ Playback speed control (0.25x – 4x)
|
|
16
|
-
- 📡 HLS streaming support
|
|
16
|
+
- 📡 HLS streaming support (built-in, no extra install needed)
|
|
17
17
|
- 🕒 Seek bar with buffered progress indicator
|
|
18
18
|
- 🚀 Smooth UX with throttled interactions
|
|
19
19
|
- 💡 Auto-hide controls on inactivity
|
|
@@ -67,7 +67,7 @@ export default function App() {
|
|
|
67
67
|
| `source` | `string \| VideoSourceQuality[]` | ✅ | Single URL or array of quality sources |
|
|
68
68
|
| `title` | `string` | ❌ | Video title shown in top bar |
|
|
69
69
|
| `poster` | `string` | ❌ | Thumbnail image shown before playback |
|
|
70
|
-
| `hls` | `boolean \| Partial<HlsConfig>` | ❌ | Enable HLS streaming
|
|
70
|
+
| `hls` | `boolean \| Partial<HlsConfig>` | ❌ | Enable HLS streaming |
|
|
71
71
|
|
|
72
72
|
### VideoSourceQuality
|
|
73
73
|
|
|
@@ -99,11 +99,7 @@ type VideoSourceQuality = {
|
|
|
99
99
|
|
|
100
100
|
## 📡 HLS Streaming
|
|
101
101
|
|
|
102
|
-
HLS support
|
|
103
|
-
|
|
104
|
-
```bash
|
|
105
|
-
npm install hls.js
|
|
106
|
-
```
|
|
102
|
+
HLS support is built-in — no extra packages needed.
|
|
107
103
|
|
|
108
104
|
```tsx
|
|
109
105
|
// Basic HLS
|
|
@@ -121,8 +117,7 @@ npm install hls.js
|
|
|
121
117
|
/>
|
|
122
118
|
```
|
|
123
119
|
|
|
124
|
-
> Safari uses native HLS automatically —
|
|
125
|
-
> If `hls.js` is not installed and `hls` prop is set, falls back to native `src` with a console warning.
|
|
120
|
+
> Safari uses native HLS automatically — hls.js is bypassed on Safari.
|
|
126
121
|
|
|
127
122
|
---
|
|
128
123
|
|
|
@@ -179,7 +174,6 @@ Works on:
|
|
|
179
174
|
- Optimized re-rendering via `useReducer` + `useRef`
|
|
180
175
|
- Stale closure prevention with refs for hot-path callbacks
|
|
181
176
|
- Smart seek stacking with auto-reset
|
|
182
|
-
- HLS loaded via dynamic `import()` — zero cost if unused
|
|
183
177
|
- Minimal event listeners
|
|
184
178
|
|
|
185
179
|
---
|
|
@@ -188,12 +182,12 @@ Works on:
|
|
|
188
182
|
|
|
189
183
|
| Browser | Fullscreen | PiP | HLS | Orientation Lock |
|
|
190
184
|
|---------|-----------|-----|-----|-----------------|
|
|
191
|
-
| Chrome | ✅ | ✅ | ✅
|
|
192
|
-
| Edge | ✅ | ✅ | ✅
|
|
193
|
-
| Firefox | ✅ | ✅ | ✅
|
|
185
|
+
| Chrome | ✅ | ✅ | ✅ | ✅ |
|
|
186
|
+
| Edge | ✅ | ✅ | ✅ | ✅ |
|
|
187
|
+
| Firefox | ✅ | ✅ | ✅ | ⚠️ Partial |
|
|
194
188
|
| Safari (desktop) | ✅ | ✅ | ✅ (native) | — |
|
|
195
189
|
| Mobile Safari | ✅ | ✅ (iPadOS) | ✅ (native) | ✅ |
|
|
196
|
-
| Chrome Android | ✅ | ✅ | ✅
|
|
190
|
+
| Chrome Android | ✅ | ✅ | ✅ | ✅ |
|
|
197
191
|
|
|
198
192
|
---
|
|
199
193
|
|